/**
 * Variable Overrides.
 *
 * Modify this file to override the Bootstrap Framework variables. You can copy
 * these variables directly from ../bootstrap/less/variables.less to this file.
 */
.btn-secondary {
  color: #fff;
  background-color: #131313;
  border-color: #060606;
}
.btn-secondary:focus,
.btn-secondary.focus {
  color: #fff;
  background-color: #000000;
  border-color: #000000;
}
.btn-secondary:hover {
  color: #fff;
  background-color: #000000;
  border-color: #000000;
}
.btn-secondary:active,
.btn-secondary.active,
.open > .dropdown-toggle.btn-secondary {
  color: #fff;
  background-color: #000000;
  background-image: none;
  border-color: #000000;
}
.btn-secondary:active:hover,
.btn-secondary.active:hover,
.open > .dropdown-toggle.btn-secondary:hover,
.btn-secondary:active:focus,
.btn-secondary.active:focus,
.open > .dropdown-toggle.btn-secondary:focus,
.btn-secondary:active.focus,
.btn-secondary.active.focus,
.open > .dropdown-toggle.btn-secondary.focus {
  color: #fff;
  background-color: #000000;
  border-color: #000000;
}
.btn-secondary.disabled:hover,
.btn-secondary[disabled]:hover,
fieldset[disabled] .btn-secondary:hover,
.btn-secondary.disabled:focus,
.btn-secondary[disabled]:focus,
fieldset[disabled] .btn-secondary:focus,
.btn-secondary.disabled.focus,
.btn-secondary[disabled].focus,
fieldset[disabled] .btn-secondary.focus {
  background-color: #131313;
  border-color: #060606;
}
.btn-secondary .badge {
  color: #131313;
  background-color: #fff;
}
.btn-ghost {
  color: #31cfec !important;
  background-color: #fff !important;
  border-color: #31cfec !important;
}
.btn-ghost:focus,
.btn-ghost.focus {
  color: #31cfec !important;
  background-color: #e6e6e6 !important;
  border-color: #0d7c90 !important;
}
.btn-ghost:hover {
  color: #31cfec !important;
  background-color: #e6e6e6 !important;
  border-color: #13b0cd !important;
}
.btn-ghost:active,
.btn-ghost.active,
.open > .dropdown-toggle.btn-ghost {
  color: #31cfec !important;
  background-color: #e6e6e6 !important;
  background-image: none !important;
  border-color: #13b0cd !important;
}
.btn-ghost:active:hover,
.btn-ghost.active:hover,
.open > .dropdown-toggle.btn-ghost:hover,
.btn-ghost:active:focus,
.btn-ghost.active:focus,
.open > .dropdown-toggle.btn-ghost:focus,
.btn-ghost:active.focus,
.btn-ghost.active.focus,
.open > .dropdown-toggle.btn-ghost.focus {
  color: #31cfec !important;
  background-color: #d4d4d4 !important;
  border-color: #0d7c90 !important;
}
.btn-ghost.disabled:hover,
.btn-ghost[disabled]:hover,
fieldset[disabled] .btn-ghost:hover,
.btn-ghost.disabled:focus,
.btn-ghost[disabled]:focus,
fieldset[disabled] .btn-ghost:focus,
.btn-ghost.disabled.focus,
.btn-ghost[disabled].focus,
fieldset[disabled] .btn-ghost.focus {
  background-color: #fff !important;
  border-color: #31cfec !important;
}
.btn-ghost .badge {
  color: #fff !important;
  background-color: #31cfec !important;
}
.btn-ghost:hover {
  color: #fff;
  background-color: #31cfec;
  border-color: #31cfec;
}
.btn-ghost:hover:focus,
.btn-ghost:hover.focus {
  color: #fff;
  background-color: #14b8d6;
  border-color: #0d7c90;
}
.btn-ghost:hover:hover {
  color: #fff;
  background-color: #14b8d6;
  border-color: #13b0cd;
}
.btn-ghost:hover:active,
.btn-ghost:hover.active,
.open > .dropdown-toggle.btn-ghost:hover {
  color: #fff;
  background-color: #14b8d6;
  background-image: none;
  border-color: #13b0cd;
}
.btn-ghost:hover:active:hover,
.btn-ghost:hover.active:hover,
.open > .dropdown-toggle.btn-ghost:hover:hover,
.btn-ghost:hover:active:focus,
.btn-ghost:hover.active:focus,
.open > .dropdown-toggle.btn-ghost:hover:focus,
.btn-ghost:hover:active.focus,
.btn-ghost:hover.active.focus,
.open > .dropdown-toggle.btn-ghost:hover.focus {
  color: #fff;
  background-color: #119cb6;
  border-color: #0d7c90;
}
.btn-ghost:hover.disabled:hover,
.btn-ghost:hover[disabled]:hover,
fieldset[disabled] .btn-ghost:hover:hover,
.btn-ghost:hover.disabled:focus,
.btn-ghost:hover[disabled]:focus,
fieldset[disabled] .btn-ghost:hover:focus,
.btn-ghost:hover.disabled.focus,
.btn-ghost:hover[disabled].focus,
fieldset[disabled] .btn-ghost:hover.focus {
  background-color: #31cfec;
  border-color: #31cfec;
}
.btn-ghost:hover .badge {
  color: #31cfec;
  background-color: #fff;
}
/* Front Styles (Homepage, Students, Educators, Employers) */
#block-block-4 {
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-top: 1px solid #ccc;
  background: url(../images/gray_bg.png) 0 0;
  overflow: hidden;
  text-align: center;
}
#block-block-4 img {
  width: 100%;
}
#block-block-4 #homepage-text {
  padding-left: 1em;
  padding-right: 1em;
}
#block-block-4 #homepage-text h1 {
  font-weight: 700;
}
/** Homepage Membership Benefits **/
#block-block-8.home-block h2,
#block-block-8.home-block h3 {
  margin-top: 0;
}
/** Join Button Block w/ Pricing - Professional **/
#block-block-10 {
  background: url(../images/gray_bg.png) 0 0;
  border: 1px solid #ccc;
  height: fit-content;
  overflow: hidden;
  padding: 1em 1em 0 1em;
  text-align: center;
}
/** ASCP Employer Benefits **/
#block-block-17 .product:first-of-type {
  margin-right: 3%;
}
/** Students - Pricing **/
#block-block-18 {
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
}
/** ASCP Employer Benefits **/
#block-block-20 {
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
}
/** Employers **/
#block-block-21 {
  background: url(../images/gray_bg.png) 0 0;
  border: 1px solid #ccc;
  text-align: center;
}
#block-block-21 p {
  font-size: 1.25em;
  padding-left: 1em;
  padding-right: 1em;
}
@media all and (max-width: 480px) {
  #block-block-21 p {
    font-size: 1em;
  }
}
/** COVID-19 Maintenance Message **/
#block-block-30 {
  max-width: 1370px;
  margin: 0 auto;
}
/** ASCP School Membership Options (block-block-63) **/
#block-block-63 a.button-link {
  white-space: normal;
}
#block-block-63 #membership-details h6 {
  font-weight: 500;
  margin-bottom: 0.8em;
}
#block-block-63 #membership-details .middle-text {
  margin-top: 0;
  margin-bottom: 1em;
}
#block-block-63 #membership-details .footer {
  margin-top: 0;
  padding-top: 0;
  padding-bottom: 0;
}
body.front #content section.block-block .block-title ~ div > p {
  margin-top: 1.5em;
}
body.front #content section.block-block .block-title ~ p {
  margin-top: 1.5em;
}
body.front #content .block {
  margin-bottom: 0em;
}
body.not-front #content p {
  color: #766d5c;
}
.home-block .block-inner {
  padding: 0 1em;
}
/** Membership Benefits and pricing **/
.mem-details {
  margin-bottom: 40px;
}
.mem-details h3 {
  padding: 1em 0;
  text-transform: uppercase;
  text-align: center;
}
@media all and (max-width: 480px) {
  .mem-details h3 {
    margin-bottom: 0;
  }
}
.mem-details ul {
  margin: 0;
  padding: 0;
  overflow: hidden;
  text-align: center;
}
@media all and (max-width: 480px) {
  .mem-details ul {
    padding-left: 1em;
    padding-right: 1em;
  }
}
.mem-details ul li {
  display: inline-block;
  list-style: none;
  list-style-image: none;
  margin: 0 1em 2em 1em;
  position: relative;
  text-align: center;
  vertical-align: top;
  width: 20%;
}
@media all and (min-width: 768px) {
  .mem-details ul li {
    margin: 0 0.8em 2em;
    width: 16%;
  }
}
@media all and (min-width: 480px) and (max-width: 767px) {
  .mem-details ul li {
    margin: 0 1em 1em 1em;
    width: 40%;
  }
}
@media all and (max-width: 480px) {
  .mem-details ul li {
    margin: 0 1em 1em 0;
    text-align: left;
    width: 100%;
  }
}
.mem-details ul li h3 {
  margin: 0;
}
.mem-details ul li p {
  font-weight: 600;
  /* source sans pro semi-bold */
  margin: 0.1em;
}
.mem-details ul li p a {
  color: #766d5c;
  display: inline-block;
  padding-top: 60px;
  text-decoration: none;
}
@media all and (max-width: 480px) {
  .mem-details ul li p a {
    padding-top: 0;
  }
}
.mem-details ul li p a:visited,
.mem-details ul li p a:link {
  color: #766d5c;
}
.mem-details ul li p a:before {
  background: url(../images/icon_sprite.png) no-repeat 0 0;
  content: " ";
  display: block;
  height: 48px;
  width: 39px;
}
@media all and (min-width: 480px) {
  .mem-details ul li p a:before {
    margin-left: auto;
    margin-right: auto;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
  }
}
.mem-details ul li p a:hover {
  color: #111;
}
.mem-details ul li p a:hover:before {
  background-position: 0 -49px;
}
.mem-details ul li p a:hover b {
  color: #d37b73;
}
.mem-details ul li p b {
  color: #000;
  font-weight: 900;
  /* source sans pro black */
}
.mem-details ul li.ami p a:before {
  background-position: -178px 0;
  height: 52px;
  width: 38px;
}
.mem-details ul li.ami p a:hover:before {
  background-position: -178px -52px;
  height: 52px;
  width: 38px;
}
.mem-details ul li.careerToolkits p a:before {
  background-position: -50px -110px;
  height: 52px;
  width: 52px;
}
.mem-details ul li.careerToolkits p a:hover:before {
  background-position: -50px -164px;
}
.mem-details ul li.discount p a:before {
  background-position: -218px -105px;
  height: 48px;
  width: 48px;
}
.mem-details ul li.discount p a:hover:before {
  background-position: -218px -160px;
}
.mem-details ul li.free-web p a:before {
  background-position: 0px -110px;
  height: 52px;
  width: 50px;
}
.mem-details ul li.free-web p a:hover:before {
  background-position: 0 -162px;
}
.mem-details ul li.legislative p a:before {
  background-position: -104px -108px;
  height: 48px;
  width: 50px;
}
.mem-details ul li.legislative p a:hover:before {
  background-position: -104px -160px;
}
.mem-details ul li.liability p a:before {
  background-position: -133px 0;
  height: 48px;
  width: 40px;
}
.mem-details ul li.liability p a:hover:before {
  background-position: -133px -49px;
}
.mem-details ul li.magazine p a:before {
  background-position: -228px 0;
  height: 48px;
  width: 54px;
}
.mem-details ul li.magazine p a:hover:before {
  background-position: -228px -48px;
}
.mem-details ul li.marketing p a:before {
  background-position: -328px 0px;
  height: 50px;
  width: 38px;
}
.mem-details ul li.marketing p a:hover:before {
  background-position: -328px -51px;
}
.mem-details ul li.members p a:before {
  background-position: -210px -105px;
  height: 48px;
  width: 64px;
}
.mem-details ul li.members p a:hover:before {
  background-position: -210px -160px;
}
.mem-details ul li.on-demand p a:before {
  background-position: -39px 0;
  height: 48px;
  width: 52px;
}
.mem-details ul li.on-demand p a:hover:before {
  background-position: -39px -49px;
}
.mem-details ul li.podcast p a:before {
  background-position: -298px 0px;
  height: 46px;
  width: 27px;
}
.mem-details ul li.podcast p a:hover:before {
  background-position: -298px -50px;
}
.mem-details ul li.skinpro p a:hover:before {
  background-position: -50px -164px;
}
/** Homepage Magazine and Webinar **/
.home-products {
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
}
.home-products .block-inner {
  padding: 1em;
}
.home-products .magazine {
  margin-right: 3%;
}
.home-products .product {
  display: inline-block;
  margin-bottom: 1em;
  padding: 0.5em 1em 0 1em;
  vertical-align: top;
  width: 47%;
}
@media all and (max-width: 767px) {
  .home-products .product {
    display: block;
    padding-top: 0;
    width: 100%;
  }
}
.home-products .product figure {
  display: inline-block;
  height: 200px;
  margin-right: 1em;
  position: relative;
  vertical-align: top;
  width: 160px;
}
@media all and (max-width: 480px) {
  .home-products .product figure {
    display: block;
    margin: 0 auto;
  }
}
.home-products .product figure img {
  position: absolute;
}
.home-products .product figure figcaption {
  bottom: 0;
  background: rgba(255, 51, 229, 0.8);
  border: 0;
  position: absolute;
  width: 100%;
}
.home-products .product h3 {
  font-size: 1.7em;
}
.home-products .product .caption a {
  color: #fff;
  display: block;
  font-family: "Source Sans Pro", sans-serif;
  font-weight: 700;
  padding: 0.5em;
  text-decoration: none;
  white-space: nowrap;
}
.home-products .product .image {
  display: inline-block;
  height: 200px;
  margin-right: 1em;
  position: relative;
  vertical-align: top;
  width: 160px;
}
@media all and (max-width: 480px) {
  .home-products .product .image {
    display: block;
    margin: 0 auto;
  }
}
.home-products .product .image img {
  position: absolute;
}
.home-products .product .image .caption {
  bottom: 0;
  background: rgba(255, 51, 229, 0.8);
  border: 0;
  position: absolute;
  width: 100%;
}
.home-products .product .image .caption a {
  color: #fff;
}
.home-products .product .image .caption a:active {
  color: #fff;
}
.home-products .product .image .caption a:visited {
  color: #fff;
}
.home-products .product .product-info {
  display: inline-block;
  vertical-align: top;
  width: 65%;
}
@media all and (min-width: 480px) and (max-width: 991px) {
  .home-products .product .product-info {
    width: 80%;
  }
}
@media all and (max-width: 480px) {
  .home-products .product .product-info {
    width: 100%;
  }
}
.home-products .product .product-info p {
  margin-top: 0;
}
/** Homepage View: Updates: Latest from ASCP **/
.latest-news {
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  overflow: hidden;
  padding-bottom: 1em;
}
.latest-news article.node-update {
  padding-right: 50px;
}
.latest-news article.node-update h3 {
  font-size: 18px;
  text-transform: uppercase;
}
.latest-news article.node-update h3 a {
  color: #222;
  font-family: "Source Sans Pro", sans-serif;
  font-weight: 700;
}
.latest-news article header h2 {
  font-size: 18px;
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 1em;
  text-transform: uppercase;
}
.latest-news .view-id-updates {
  padding: 2em 1em;
}
.latest-news .view-id-updates .view-header > p {
  margin-bottom: 0;
}
.latest-news .view-id-updates .view-header > p > a {
  text-decoration: underline;
}
.latest-news .views-row {
  float: left;
  padding-bottom: 0.5em;
  width: 33%;
}
@media all and (max-width: 767px) {
  .latest-news .views-row {
    float: none;
    width: 100%;
  }
}
/** Homepage Join - "I Am" Block **/
section#block-system-main {
  overflow: hidden;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-top: 1px solid #ccc;
}
section#block-system-main h1 {
  margin-top: 1em;
  padding-left: 1em;
  padding-right: 1em;
}
section#block-system-main h1,
section#block-system-main p {
  text-align: center;
}
section#block-system-main article.node-page img {
  width: 100%;
}
section#block-system-main figcaption {
  position: absolute;
  text-align: left;
}
/** View: Updates: Student Benefits **/
#block-views-updates-block-student-benefits .item-list ul {
  list-style-type: none;
}
#block-views-updates-block-student-benefits div.view-display-id-block_student_benefits {
  margin-top: 2em;
}
#block-views-updates-block-student-benefits div.view-display-id-block_student_benefits article.node h2 {
  font-size: 1.5em;
}
#block-views-updates-block-student-benefits div.view-display-id-block_student_benefits article.node figure.float-right {
  margin-left: 1em;
}
/** View: Updates - Educator Benefits **/
#block-views-updates-block-educator-benefits .item-list ul {
  list-style-type: none;
}
#block-views-updates-block-educator-benefits div.view-display-id-block_educator_benefits {
  margin-top: 2em;
}
#block-views-updates-block-educator-benefits div.view-display-id-block_educator_benefits article.node h2 {
  font-size: 1.5em;
}
#block-views-updates-block-educator-benefits div.view-display-id-block_educator_benefits article.node figure.float-right {
  margin-left: 1em;
}