:root {
   --navy: #211F54;
   --navy-rgb: 33, 31, 84;
   --purple: #392CB5;
   --purple-dark: #2A2083;
   --order-blue: #0057B8;
   --link-blue: #1A79C1;
   --bright-green: #2CF388;
   --nav-background: var(--navy);
   --blue-grad: linear-gradient(90deg, var(--purple) 0%, var(--purple-dark) 100%);
   --green-grad: linear-gradient(20deg, #2BF388 -0.01%, #FFFFFF 41.54%);
}

sub, sup {
    font-size: 0.85em !important;
    line-height: 0 !important;
}

sup {
    top: -0.25em!important;
}

.paragraph--type--faq-accordion sup {
    position: relative;
    top: -0.4em;
    vertical-align: baseline;
}

body.is-member .node__content {
   margin-top: 0px;
}

body.has-member-nav .layout-main-wrapper {
   background: var(--green-grad);
}

body.is-member .field--name-field-hero {
  border: none;
}

body.has-member-nav .paragraph--type--hero {
   padding-bottom: 4rem;
}

.node--type-blog-post .paragraph_container {
   padding-top: 4rem;
   padding-bottom: 5rem;
}

@media print {
   #header,
   .member-subnav-bar,
   .site-footer,
   #block-signature-supplements-breadcrumbs,
   nav[aria-label="breadcrumb"],
   .ss-back-link-wrap {
      display: none !important;
   }

   .paragraph--type--hero {
      padding: 0 !important;
      margin-bottom: 0.75rem !important;
      min-height: 0 !important;
   }
   .paragraph--type--hero h1 {
      color: var(--navy) !important;
      margin-bottom: 0 !important;
   }

   body.has-member-nav .node__content {
      margin-top: 0 !important;
   }

   .compare-item__section {
      padding: 8px 0 !important;
   }
}

   .member-subnav-bar {
      background: var(--nav-background);
      border-top: 1px solid var(--bright-green);
   }

   .member-subnav-bar .nav .nav-item .dropdown-toggle::after {
      font-family: "Material Symbols Outlined";
      content: "keyboard_arrow_down";
      margin-left: 0.3125rem;
      font-size: 0.9375rem;
      border: 0 !important;
      display: inline-block;
      line-height: 1;
      height: 1em;
      vertical-align: middle;
   }

   .member-subnav-bar nav {
      padding-top: 18px;
      padding-bottom: 18px;
   }

   .member-subnav-bar nav ul {
      justify-content: center;
   }

   .member-subnav-bar .nav-item a {
      padding: 0px 12px;
      font-size: 0.8125rem;
      font-weight: 600;
      text-transform: uppercase;
      color: #ffffff;
      display: flex;
      align-items: center;
   }

   .member-subnav-bar .nav-item a:hover,
   .member-subnav-bar .nav-item.active > a {
      color: var(--bright-green);
   }

   .member-subnav-bar .nav--shop::after {
      content: 'shopping_cart_checkout';
      font-family: 'Material Symbols Outlined';
      font-weight: normal;
      margin-left: 0.4rem;
      vertical-align: middle;
      line-height: 1;
   }

   .member-subnav-bar .dropdown-menu {
      background-color: var(--nav-background);
      border: 0;
      border-radius: 0;
      padding: 6px 0;
   }

   .member-subnav-bar .dropdown-menu .dropdown-item {
      padding: 6px 20px;
      text-transform: uppercase;
      color: #ffffff;
   }

   .member-subnav-bar .dropdown-menu .dropdown-item:hover,
   .member-subnav-bar .dropdown-menu .dropdown-item:focus,
   .member-subnav-bar .dropdown-menu .dropdown-item.active {
      background-color: transparent;
      color: var(--bright-green);
   }

   #CollapsingNavbar .member-subnav-bar {
      border-top: 0;
      margin: 0 -0.75rem 0.75rem;
      margin-top: 10px;
   }

   #CollapsingNavbar .member-subnav-bar > .container {
      max-width: none;
      padding-left: 0;
      padding-right: 0;
   }

   #CollapsingNavbar .member-subnav-bar nav {
      padding-top: 8px;
      padding-bottom: 8px;
   }

   #CollapsingNavbar .member-subnav-bar nav ul {
      flex-direction: column;
      justify-content: flex-start;
      align-items: stretch;
   }

   #CollapsingNavbar .member-subnav-bar .nav-item a {
      padding: 12px 14px;
      justify-content: flex-start;
      font-size: 0.8125rem;
      font-weight: 600;
   }

   #CollapsingNavbar .member-subnav-bar .dropdown-menu {
      position: static !important;
      transform: none !important;
      inset: auto !important;
      margin: 0 !important;
      float: none;
      width: 100%;
   }

   @media (max-width: 767.98px) {
      .member-subnav-bar:not(.member-subnav-bar--mobile) {
         display: none;
      }

      #CollapsingNavbar {
         margin-left: -0.75rem;
         margin-right: -0.75rem;
         padding-left: 0.75rem;
         padding-right: 0.75rem;
      }

      #CollapsingNavbar #block-signature-supplements-useraccountmenu,
      #CollapsingNavbar #block-signature-supplements-usermenu {
         width: 100%;
         margin-left: 0;
         margin-right: 0;
         justify-content: flex-start!important;
      }

      #CollapsingNavbar #block-signature-supplements-useraccountmenu > ul,
      #CollapsingNavbar #block-signature-supplements-usermenu > ul {
         flex-direction: column;
         justify-content: flex-start;
         align-items: flex-start;
         padding-left: 0;
      }

      #CollapsingNavbar #block-signature-supplements-useraccountmenu > ul li a,
      #CollapsingNavbar #block-signature-supplements-usermenu > ul li a {
         padding-left: 0px;
         padding-right: 0px;
      }
   }

   @media (min-width: 768px) {
      .member-subnav-bar--mobile {
         display: none;
      }
   }

   .catalog.container,
   .blog.container {
      padding-bottom: 5rem;
      padding-top: 5rem;
   }

   .ss-back-link-wrap {
      padding-top: 20px;
   }

   .ss-back-link {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      color: var(--link-blue);
      font-size: 14px;
      font-weight: 600;
      text-transform: uppercase;
      text-decoration: none;
   }

   .ss-back-link:hover {
      color: var(--purple-dark);
   }

   .ss-back-link::before {
      content: "arrow_back";
      font-family: "Material Symbols Outlined";
      font-variation-settings: "wght" 400;
      font-size: 18px;
   }

   .paragraph--type--faq-accordion {
      padding-top: 0rem!important;
   }

   .paragraph--type--faq-accordion .accordion .ui-accordion > div {
      background: #fff;
   }

   .paragraph--type--faq-accordion .accordion .ui-accordion .ui-accordion-header,
   .paragraph--type--faq-accordion .accordion .ui-accordion .ui-accordion-content,
   .paragraph--type--faq-accordion .accordion .ui-accordion .ui-corner-all,
   .paragraph--type--faq-accordion .accordion .ui-accordion .ui-corner-top,
   .paragraph--type--faq-accordion .accordion .ui-accordion .ui-corner-bottom {
      border-radius: 0 !important;
   }

   .paragraph--type--faq-accordion .accordion .ui-accordion .ui-accordion-content .views-field * {
      color: var(--navy);
      font-family: Montserrat;
      font-size: 18px;
      font-style: normal;
      font-weight: 500;
      line-height: 24px;
   }

   .paragraph--type--faq-accordion .accordion .ui-accordion .ui-accordion-content .views-field ul li,
   .paragraph--type--faq-accordion .accordion .ui-accordion .ui-accordion-content .views-field ol li {
      margin-bottom: 5px;
   }

    .paragraph--type--faq-accordion .accordion .ui-accordion .ui-accordion-content .views-field a {
      color: var(--order-blue);
      text-decoration-line: underline;
      text-decoration-style: solid;
      text-decoration-skip-ink: none;
      text-decoration-thickness: auto;
      text-underline-offset: auto;
      text-underline-position: from-font;
    }

   .faq-accordion .views-row {
      margin-bottom: 0px!important;
      border-radius: 20px;
      background: #FFF;
      box-shadow: 0 6px 14px 0 rgba(var(--navy-rgb), 0.25);
   }

   .paragraph--type--faq-accordion .accordion__title {
      color: var(--purple);
      font-size: 32px;
      font-style: normal;
      font-weight: 600;
      line-height: 28px;
      margin-bottom: 30px!important;
   }

   @media print {
      .paragraph--type--faq-accordion .ui-accordion-content {
         display: block !important;
         height: auto !important;
      }

      .paragraph--type--faq-accordion .views-accordion-header::after {
         display: none !important;
      }

      .paragraph:not(.paragraph--type--hero) ul li::before {
         -webkit-print-color-adjust: exact;
         print-color-adjust: exact;
      }
   }

   .paragraph--type--banner-carousel .field--name-field-bc-items > .field__item {
      background: linear-gradient(90deg, var(--bright-green) 0%, rgba(255, 255, 255, 0.00) 100%);
      border-radius: 20px;
      overflow: hidden;
   }

   .paragraph--type--banner-carousel .banner-carousel__viewport {
      border-radius: 20px;
      border: 1px solid rgba(var(--navy-rgb), 0.11);
      box-shadow: 0 6px 14px 0 rgba(var(--navy-rgb), 0.25);
   }

   .paragraph--type--banner-carousel .banner {
      min-height: 250px;
      align-items: stretch;
      gap: 0;
      padding-top: 0rem!important;
      padding-bottom: 0rem!important;
   }

   .paragraph--type--banner-carousel .banner__content {
      flex: 1;
      align-self: center;
      padding: 24px 40px;
      z-index: 1;
   }

   .paragraph--type--banner-carousel .banner__image {
      flex: 0 0 auto;
      position: relative;
      align-self: stretch;
   }

   .paragraph--type--banner-carousel .banner__image .field--name-field-banner-image,
   .paragraph--type--banner-carousel .banner__image .field--name-field-banner-image .field__item {
      position: relative;
      height: 100%;
      z-index: 1;
   }

   .paragraph--type--banner-carousel .banner__image::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      background: url('../images/light-web-bg.png');
      background-repeat: no-repeat;
      -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 40%);
      mask-image: linear-gradient(to right, transparent 0%, #000 40%);
      background-position: right;
   }

   .paragraph--type--banner-carousel .banner__image img {
      height: 100%;
      width: auto;
      max-width: none;
      display: block;
      object-fit: contain;
      border-radius: 0;
      margin-right: 75px;
   }

   .banner-carousel__dot {
      border-radius: 5px!important;
      background: linear-gradient(90deg, var(--purple) 0%, var(--purple-dark) 100%)!important;
      height: 4px!important;
      box-shadow: none!important;
      padding: 0px!important;
   }

   .paragraph--type--banner-carousel .banner-carousel__prev,
   .paragraph--type--banner-carousel .banner-carousel__next {
      width: auto;
      height: auto;
      padding: 0 !important;
      border: 0 !important;
      border-radius: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
      line-height: 1;
   }

   .paragraph--type--banner-carousel .banner-carousel__prev::before,
   .paragraph--type--banner-carousel .banner-carousel__next::before {
      font-family: "Material Symbols Outlined";
      font-variation-settings: "wght" 300;
      font-size: 24px;
      line-height: 1;
      color: var(--purple-dark);
   }

   .paragraph--type--banner-carousel .banner-carousel__prev::before { 
      content: "arrow_back"; 
   }

   .paragraph--type--banner-carousel .banner-carousel__next::before { 
      content: "arrow_forward"; 
   }

   .paragraph--type--banner-carousel .banner-carousel__nav {
      gap: 5px!important;
   }

   .paragraph--type--banner-carousel .banner__content .field--name-field-banner-text h2 {
      color: #33279E;
      font-size: 38px;
      font-style: normal;
      font-weight: 700;
      line-height: 44px;
      letter-spacing: -1.52px;
      margin-bottom: 24px;
   }

   .paragraph--type--banner-carousel .banner__content .field--name-field-banner-button a {
      border-radius: 100px;
      background: var(--purple);
      box-shadow: 0 4px 10px 0 rgba(var(--navy-rgb), 0.40);
      padding: 16px 24px;
      color: #FFF;
      text-align: center;
      font-family: Montserrat;
      font-size: 13px;
      font-style: normal;
      font-weight: 600;
      line-height: 13px;
      letter-spacing: 0.26px;
      text-transform: uppercase;
      display: inline-flex;
   }

   .paragraph--type--compare-carousel {
      padding-top: 0px!important;
      padding-bottom: 0px!important;
   }

   .paragraph--type--compare-carousel .compare-carousel__heading {
      color: var(--purple);
      font-size: 32px;
      font-style: normal;
      font-weight: 600;
      line-height: 28px;
      border-bottom: 1px solid rgba(var(--navy-rgb), 0.25);
      padding-bottom: 20px;
   }

   .paragraph--type--compare-carousel .see-larger-label {
      display: block;
      text-align: center;
      margin-top: 14px;
      color: var(--link-blue);
      font-size: 14px;
      text-decoration: underline;
      cursor: pointer;
      font-family: "Montserrat", sans-serif;
   }

   .paragraph--type--compare-carousel .see-larger-label:hover {
      color: var(--purple-dark);
   }

   .paragraph--type--compare-carousel .paragraph--type--compare-item {
      padding-top: 0px;
      padding-bottom: 0px;
   }

   .compare-item__section {
      position: relative;
      padding: 25px 0;
   }

   .compare-item__section::after {
      content: "";
      position: absolute;
      bottom: 0;
      left: calc(var(--cc-gap, 28px) / -2);
      right: calc(var(--cc-gap, 28px) / -2);
      border-bottom: 1px solid rgba(var(--navy-rgb), 0.25);
   }

   @media print {
      .compare-item__section:not(.compare-item__safety)::after {
         left: 0;
         right: 0;
      }
   }

   .paragraph--type--compare-carousel .paragraph--type--compare-item .field--name-field-ci-title {
      color: var(--purple);
      font-size: 22px;
      font-style: normal;
      font-weight: 600;
      line-height: 26px;
      margin-bottom: 15px;
   }

   .paragraph--type--compare-carousel .paragraph--type--compare-item .field--name-field-ci-buttons div a {
      padding: 1px 18px;
      border-radius: 100px;
      border: 1px solid var(--order-blue);
      background: #FFF;
      color: var(--order-blue);
      font-size: 14px;
      font-style: normal;
      font-weight: 500;
      line-height: 24px;
      text-transform: uppercase;
      display: inline-flex;
      align-items: center;
      margin-bottom: 6px;
   }

   .paragraph--type--compare-carousel .paragraph--type--compare-item .field--name-field-ci-buttons div a::after {
      content: 'shopping_cart_checkout';
      font-family: 'Material Symbols Outlined';
      font-weight: normal;
      font-size: 18px;
      margin-left: 0.5rem;
      line-height: 1;
   }

   .paragraph--type--compare-carousel .paragraph--type--compare-item .field--name-field-ci-buttons div a:hover {
      background: var(--order-blue);
      color: #ffffff;
   }

   .paragraph--type--compare-carousel .field--name-field-ci-description .field__label, 
   .paragraph--type--compare-carousel  .field--name-field-ci-safety .field__label {
      color: var(--navy);
      font-size: 14px;
      font-style: normal;
      font-weight: 700;
      line-height: 24px;
      font-family: "Montserrat", sans-serif;
   }

   .paragraph--type--compare-carousel .field--name-field-ci-description .field__item,
   .paragraph--type--compare-carousel  .field--name-field-ci-safety .field__item,
      .paragraph--type--compare-carousel .field--name-field-ci-description .field__item *,
   .paragraph--type--compare-carousel  .field--name-field-ci-safety .field__item * {
      color: var(--navy);
      font-size: 14px;
      font-style: normal;
      font-weight: 500;
      line-height: 24px;
      font-family: "Montserrat", sans-serif;
   }

   .paragraph--type--compare-carousel .paragraph--type--compare-item .field--name-field-ci-image {
      border-radius: 20px;
      border: 1px solid rgba(var(--navy-rgb), 0.15);
      background: #FFF;
      box-shadow: 0 6px 14px 0 rgba(var(--navy-rgb), 0.15);
      padding: 15px 10px;
   }

   .paragraph--type--compare-item .field--label-inline .field__label,
   .paragraph--type--compare-item .field--label-inline .field__item,
   .paragraph--type--compare-item .field--label-inline .field__item p,
   .material-detail .field--label-inline .field__label,
   .material-detail .field--label-inline .field__item,
   .material-detail .field--label-inline .field__item p {
      display: inline;
      margin: 0;
   }

   .paragraph--type--compare-item .field--label-inline .field__label,
   .material-detail .field--label-inline .field__label {
      font-weight: 700;
   }

   .paragraph--type--compare-item .field--label-inline .field__label::after,
   .material-detail .field--label-inline .field__label::after {
      content: ": ";
   }

   .paragraph--type--material-details {
      padding-top: 20px !important;
   }

   .material-detail__grid {
      display: flow-root;
   }

   .paragraph--type--material-details .material-detail__title {
      color: var(--purple);
      font-family: Quicksand;
      font-size: 32px;
      font-style: normal;
      font-weight: 600;
      line-height: 28px;
      margin-bottom: 25px;
   }

   /* Applies to every field in this column, including any the client adds later.
      The order button is excluded because it is styled as a button below. */
   .paragraph--type--material-details .material-detail__info > .field:not(.field--name-field-md-order) {
      color: var(--navy);
      font-family: Montserrat;
      font-size: 18px;
      font-style: normal;
      font-weight: 500;
      line-height: 26px;
      margin-bottom: 20px;
   }

   .paragraph--type--material-details .material-detail__info > .field.clearfix::after {
      clear: none;
   }

   .paragraph--type--material-details .material-detail__info > .material-detail__section--full {
      clear: right;
   }


   .paragraph--type--material-details .material-detail__info .field--name-field-md-order div a {
      border-radius: 100px;
      border: 1px solid var(--order-blue);
      background: #FFF;
      color: var(--order-blue);
      text-align: center;
      font-family: Montserrat;
      font-size: 14px;
      font-style: normal;
      font-weight: 500;
      line-height: 24px;
      text-transform: uppercase;
      padding: 1px 16px;
      display: inline-flex;
      align-items: center;
   }

   .paragraph--type--material-details .material-detail__info .field--name-field-md-order div a::after {
      content: 'shopping_cart_checkout';
      font-family: 'Material Symbols Outlined';
      font-weight: normal;
      font-size: 18px;
      margin-left: 0.5rem;
      line-height: 1;
   }

   .paragraph--type--material-details .material-detail__info .field--name-field-md-order div a:hover {
      background: var(--order-blue);
      color: #ffffff;
   }

   .material-detail__label {
      float: right;
      width: calc((100% - 40px) * 5 / 12);
      margin: 0 0 30px 40px;
      border-radius: 20px;
      border: 1px solid rgba(var(--navy-rgb), 0.15);
      background: #FFF;
      box-shadow: 0 6px 14px 0 rgba(var(--navy-rgb), 0.15);
      padding: 24px 24px 65px 24px;
   }

   /* Tables match the price-table treatment in price-list.css. Scoped to the
      field type rather than a field name, so any tablefield the client adds to
      this paragraph later is styled automatically. */
   .paragraph--type--material-details .material-detail__info .field--type-tablefield .field__label {
      font-weight: 700;
      margin-bottom: 10px;
   }

   .paragraph--type--material-details .material-detail__info .tablefield-wrapper {
      overflow-x: auto;
      border: 1px solid #C7C7D4;
      border-radius: 20px;
   }

   .paragraph--type--material-details .material-detail__info .tablefield-wrapper table {
      width: 100%;
      border-collapse: collapse;
      margin-bottom: 0;
   }

   .paragraph--type--material-details .material-detail__info .tablefield-wrapper table thead tr th {
      color: #ffffff;
      font-size: 16px;
      font-style: normal;
      font-weight: 600;
      line-height: 21px;
      background: #6D758F;
   }

   .paragraph--type--material-details .material-detail__info .tablefield-wrapper table > tbody > tr > * {
      box-shadow: none;
      background-color: #ffffff;
   }

   .paragraph--type--material-details .material-detail__info .tablefield-wrapper table > tbody > tr:nth-of-type(even) > * {
      background-color: #EFEFF3;
   }

   .paragraph--type--material-details .material-detail__info .tablefield-wrapper table tr th,
   .paragraph--type--material-details .material-detail__info .tablefield-wrapper table tr td {
      border-left: 1px solid #DFE4F5;
      padding: 8px 30px;
      border-bottom: 1px solid #C7C7D4 !important;
   }

   .paragraph--type--material-details .material-detail__info .tablefield-wrapper table tr td {
      color: #211F54;
      font-family: Montserrat;
      font-size: 14px;
      font-style: normal;
      font-weight: 500;
      line-height: 24px;
   }

   .paragraph--type--material-details .material-detail__info .tablefield-wrapper table tr th:first-child,
   .paragraph--type--material-details .material-detail__info .tablefield-wrapper table tr td:first-child {
      border-left: none;
   }

   .paragraph--type--material-details .material-detail__info .tablefield-wrapper table > tbody > tr:last-child > * {
      border-bottom: none !important;
   }

   .paragraph--type--material-details .material-detail__info .tablefield-wrapper table tr td a {
      color: var(--link-blue);
      text-decoration: underline;
   }


   @media (max-width: 992px) {
      .material-detail__grid {
         display: flex;
         flex-direction: column;
      }

      .material-detail__label {
         float: none;
         width: 100%;
         margin: 0 0 30px 0;
         order: 2;
      }

      .material-detail__info {
         order: 1;
      }
   }

   /* Stacked rows on mobile, matching the price tables. The data-label values
      are set by the ssMaterialTable behavior in custom.js. */
   @media (max-width: 767px) {
      .paragraph--type--material-details .material-detail__info .tablefield-wrapper table,
      .paragraph--type--material-details .material-detail__info .tablefield-wrapper tbody,
      .paragraph--type--material-details .material-detail__info .tablefield-wrapper tr,
      .paragraph--type--material-details .material-detail__info .tablefield-wrapper td {
         display: block;
         width: 100%;
      }

      .paragraph--type--material-details .material-detail__info .tablefield-wrapper thead {
         position: absolute;
         width: 1px;
         height: 1px;
         overflow: hidden;
         clip: rect(0 0 0 0);
      }

      .paragraph--type--material-details .material-detail__info .tablefield-wrapper tr {
         border-bottom: 1px solid #6D758F;
      }

      .paragraph--type--material-details .material-detail__info .tablefield-wrapper tr:nth-last-child(1) {
         border-bottom: none;
      }

      .paragraph--type--material-details .material-detail__info .tablefield-wrapper .table-striped > tbody > tr > * {
         border-left: none !important;
      }

      .paragraph--type--material-details .material-detail__info .tablefield-wrapper td {
         position: relative;
         min-height: 1.5rem;
         padding-left: 170px !important;
         padding-right: 11px !important;
         text-align: left;
      }

      .paragraph--type--material-details .material-detail__info .tablefield-wrapper td::before {
         content: attr(data-label);
         position: absolute;
         left: 0;
         top: 0;
         bottom: 0;
         width: 145px;
         padding: 8px 15px;
         font-weight: 600;
         white-space: nowrap;
         background: #6D758F;
         color: #ffffff;
         display: flex;
         align-items: center;
      }

      .paragraph--type--material-details .material-detail__info .tablefield-wrapper table > tbody > tr:last-child > * {
         border-bottom: 1px solid #C7C7D4 !important;
      }
   }

   .paragraph--type--centered-image {
      padding-top: 1.7rem !important;
   }

   .paragraph--type--centered-image img {
      border-radius: 0px!important;
      display: block;
      margin: auto;
   }

   .price-list {
      padding-top: 2rem!important;
      padding-bottom: 2rem!important;
   }

   .price-list .price-table {
      padding: 0px;
   }

   .price-list h2.price-table__heading {
      color: var(--purple);
      font-size: 32px;
      font-style: normal;
      font-weight: 600;
      line-height: 28px;
   }

   .ss-filters__search-wrap {
      background: var(--blue-grad);
      padding: 22px 95px 22px 30px;
      border-radius: 20px;
      margin-bottom: 30px;
   }

   .ss-filters__search-wrap .js-form-item {
      display: flex;
      align-items: center;
      gap: 30px;
   }

   .ss-filters__search-wrap .js-form-item label {
      color: #FFF;
      font-size: 20px;
      font-style: normal;
      font-weight: 600;
      line-height: 28px;
   }

   .ss-filters__group {
      background: var(--blue-grad);
      padding: 27px 20px 45px;
      border-radius: 20px;
      margin-bottom: 30px;
   }

   .ss-filters__group label {
      color: #FFF;
      font-size: 20px;
      font-style: normal;
      font-weight: 600;
      line-height: 28px;
      margin-bottom: 10px;
   }

   .ss-filters__search-wrap label, 
   .ss-filters__group label {
      color: white;
   }

   .ss-listing {
      display: grid;
      grid-template-columns: 280px 1fr;
      grid-template-areas:
         "search  search"
         "filters content";
      column-gap: 40px;
      }

      .ss-listing > .ss-filters { display: contents; }

      .ss-listing .ss-filters__search-wrap { grid-area: search; }

      .ss-listing .ss-filters__group { 
         grid-area: filters; 
         align-self: start; 
         display: flex;
         flex-direction:column;
         gap: 30px;
      }

      .ss-filters__search-wrap input[type="text"],
      .ss-filters__search-wrap input[type="search"] {
         padding: 11px 16px 11px 46px;
         border-radius: 8px;
         border: 1px solid var(--navy);
         box-shadow: 0 1px 4px 0 rgba(25, 33, 61, 0.08);
      }

      .ss-filters__select {
         border-radius: 8px;
         border: 1px solid var(--navy);
         padding: 11px 16px;
         box-shadow: 0 1px 4px 0 rgba(25, 33, 61, 0.08);
      }

      .ss-filters__search-wrap input[type="text"]::placeholder,
      .ss-filters__search-wrap input[type="search"]::placeholder {
         color: var(--navy);
         font-size: 16px;
         font-style: normal;
         font-weight: 400;
         line-height: 20px;
      }

      .ss-filters__search-wrap .js-form-item label {
         position: relative;
      }

      .ss-filters__search-wrap .js-form-item label::after {
         content: "search";
         font-family: "Material Symbols Outlined";
         font-variation-settings: "wght" 300;
         font-size: 22px;
         line-height: 1;
         color: var(--navy);
         position: absolute;
         top: 50%;
         left: calc(100% + 46px);
         transform: translateY(-50%);
         pointer-events: none;
      }

      .ss-listing__content {
         grid-area: content;
         align-self: start;
      }

      .ss-listing .price-list__tables {
         grid-area: content;
         align-self: start;
         min-width: 0;
      }

      .ss-listing .ss-filters .form-actions,
      .ss-listing .ss-filters input[type="hidden"] { display: none; }

      @media (max-width: 768px) {
         .ss-listing {
            grid-template-columns: 1fr;
            grid-template-areas: "search" "filters" "content";
         }
      }

      .ss-listing__content {
         display: flex;
         flex-wrap: wrap;
         gap: 24px;
      }

      .ss-listing__content > .catalog-card {
         position: relative;
         flex: 0 0 calc(50% - 12px);
         min-width: 0;
         border-radius: 20px;
         background: #FFF;
         box-shadow: 0 6px 14px 0 rgba(var(--navy-rgb), 0.25);
         padding: 42px 45px 45px 20px;
         transition: box-shadow 0.2s ease, transform 0.2s ease;
         display: flex;
         flex-direction: column;
         justify-content: center;
      }

      .ss-listing__content > .catalog-card .views-field-title .field-content {
         margin-bottom: 5px;
         display: inline-block;
      }

      .ss-listing__content > .catalog-card .views-field-title .field-content a {
         color: var(--purple);
         font-size: 18px;
         font-style: normal;
         font-weight: 700;
         line-height: 26px;
         letter-spacing: -0.2px;
         font-family: Quicksand;
      }

      .ss-listing__content > .catalog-card .views-field-field-formula-type .field-content {
         color: var(--navy);
         font-family: Montserrat;
         font-size: 14px;
         font-style: normal;
         font-weight: 400;
         line-height: 18px;
      }

      .ss-listing__content > .catalog-card .catalog-card__badge {
         position: absolute;
         top: 11px;
      }

      .ss-listing__content > .catalog-card .catalog-card__badge span.ss-badge {
         border-radius: 50px;
         border: 1px solid;
         padding: 0px 10px;
      }

      .ss-listing__content > .catalog-card .catalog-card__badge span.ss-badge.new-badge {
         border-color: var(--bright-green);
         background: rgba(44, 243, 136, 0.20);
         color: #15733B;
         font-size: 14px;
         font-style: normal;
         font-weight: 700;
         line-height: 28px;
      }

      .ss-listing__content > .catalog-card .catalog-card__badge span.ss-badge.revised-badge {
         border-color: #E6C451;
         background: rgba(230, 196, 81, 0.30);
         color: #806200;
         font-size: 14px;
         font-style: normal;
         font-weight: 700;
         line-height: 28px;
      }

      @media (max-width: 768px) {
         .ss-listing__content > .catalog-card {
            flex-basis: 100%;
         }
      }

   .catalog-card__title a::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
   }

   .catalog-card:hover {
      box-shadow: 0 10px 22px 0 rgba(var(--navy-rgb), 0.35);
      transform: translateY(-2px);
   }

   .catalog-card::after {
      content: "arrow_forward";
      font-family: "Material Symbols Outlined";
      position: absolute;
      top: 50%;
      right: 20px;
      transform: translateY(-50%);
      font-size: 1.5rem;
      color: var(--purple-dark);
   }

   .ss-listing__content > .blog-card {
      position: relative;
      flex: 0 0 100%;
      min-width: 0;
      border-radius: 20px;
      background: #FFF;
      box-shadow: 0 6px 14px 0 rgba(var(--navy-rgb), 0.25);
      padding: 30px 70px 30px 40px;
      transition: box-shadow 0.2s ease, transform 0.2s ease;
   }

   .ss-listing__content > .blog-card .blog-card__category .field-content {
      color: var(--navy);
      font-size: 14px;
      font-style: normal;
      font-weight: 400;
      line-height: 22px;
      margin-bottom: 5px;
   }

   .ss-listing__content > .blog-card .blog-card__title .field-content {
      margin-bottom: 15px;
      display: inline-block;
   }

   .ss-listing__content > .blog-card .blog-card__title .field-content a {
      color: var(--purple);
      font-size: 24px;
      font-style: normal;
      font-weight: 700;
      line-height: 28px;
      letter-spacing: -0.24px;
   }

   .ss-listing__content > .blog-card .blog-card__excerpt .field-content {
      color: var(--navy);
      font-size: 18px;
      font-style: normal;
      font-weight: 500;
      line-height: 24px;
   }

   .blog-card__title a::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
   }

   .blog-card:hover {
      box-shadow: 0 10px 22px 0 rgba(var(--navy-rgb), 0.35);
      transform: translateY(-2px);
   }

   .ss-listing__content > .blog-card .blog-card__more {
      position: absolute;
      top: 50%;
      right: 20px;
      transform: translateY(-50%);
   }

   .ss-listing__content > .blog-card .blog-card__more a {
      font-size: 0;
   }

   .ss-listing__content > .blog-card .blog-card__more a::after {
      content: "arrow_forward";
      font-family: "Material Symbols Outlined";
      font-variation-settings: "wght" 300;
      font-size: 1.5rem;
      color: var(--purple-dark);
   }

   .paragraph--type--icon-cards .icon-card--title-only {
      padding: 20px 25px;
   }

   .paragraph--type--info-cards .info-card__button {
      margin-top: auto;
      align-self: stretch;
   }

   .paragraph--type--info-cards .info-card__button .field--name-field-info-card-button a {
      border-radius: 100px;
      background: var(--purple);
      box-shadow: 0 4px 10px 0 rgba(var(--navy-rgb), 0.40);
      color: #FFF;
      text-align: center;
      font-family: Montserrat;
      font-size: 13px;
      font-style: normal;
      font-weight: 600;
      line-height: 13px;
      letter-spacing: 0.26px;
      text-transform: uppercase;
      padding: 10px 18px;
      display: inline-flex;
   }

   .paragraph--type--info-cards .info-card {
      padding: 30px 20px;
   }

   @media (min-width: 1199px) and (max-width: 1400px) {

      /* banner carousel */

      .paragraph--type--banner-carousel .banner__image img {
         width: auto;
         height: 100%;
         border-radius: 0;
         margin-right: 0px;
      }

      .paragraph--type--banner-carousel .banner__content .field--name-field-banner-text h2 {
         font-size: 33px;
         line-height: 39px;
      }

   }

   @media (min-width: 992px) and (max-width: 1199px) {

      /* banner carousel */

      .paragraph--type--banner-carousel .banner__image img {
         width: auto;
         height: 100%;
         border-radius: 0;
         margin-right: 0px;
      }

      .paragraph--type--banner-carousel .banner__content .field--name-field-banner-text h2 {
         font-size: 28px;
         line-height: 34px;
      }

      /* material details */

      .paragraph_container {
         max-width: 960px;
      }

   }

   @media (min-width: 767px) and (max-width: 992px) {

      /* banner carousel */

      .paragraph--type--banner-carousel {
         padding-top: 0px!important;
      }

      .paragraph--type--banner-carousel .banner {
         flex-direction: column;
         height: 100%;
      }

      .paragraph--type--banner-carousel .banner__content {
         flex: none;
         align-self: stretch;
      }

      .paragraph--type--banner-carousel .banner__image {
         flex: none;
         align-self: stretch;
         margin-top: auto;
      }

      .paragraph--type--banner-carousel .banner__image .field--name-field-banner-image,
      .paragraph--type--banner-carousel .banner__image .field--name-field-banner-image .field__item {
         height: auto;
         width: 100%;
      }

      .paragraph--type--banner-carousel .banner__image img {
         width: 100%;
         height: auto;
         object-fit: contain;
         margin-right: 0;
      }

      .paragraph--type--banner-carousel .banner__content .field--name-field-banner-text h2 {
         font-size: 27px;
         line-height: 33px;
      }

      /* material details */

      .paragraph_container {
         max-width: 720px;
      }


      /* price list */

      /* catalog cards */
      .ss-listing {
         grid-template-columns: 1fr;
         grid-template-areas:
            "search"
            "filters"
            "content";
      }

      .ss-listing .ss-filters__group {
         flex-direction: row;
         gap: 20px;
         padding: 27px 20px 27px;
      }

      .ss-listing .ss-filters__group > * {
         flex: 1;
         min-width: 0;
      }

      .ss-listing .ss-filters__group .ss-filters__select {
         width: 100%;
      }

      .ss-filters__search-wrap {
         padding: 22px 20px 22px 20px;
      }

   }

   @media (min-width: 575px) and (max-width: 767px) {
      .paragraph_container {
         max-width: 540px;
      }
   }

   @media (max-width: 767px) {

      /* banner carousel */

      .paragraph--type--banner-carousel {
         padding-top: 0px!important;
      }

      .paragraph--type--banner-carousel .banner-carousel__prev::before, 
      .paragraph--type--banner-carousel .banner-carousel__next::before {
         font-size: 40px;
      }

      .paragraph--type--banner-carousel .banner {
         flex-direction: column;
         height: 100%;
      }

      .paragraph--type--banner-carousel .banner__content {
         flex: none;
         align-self: stretch;
      }

      .paragraph--type--banner-carousel .banner__image {
         flex: none;
         align-self: stretch;
         margin-top: auto;
      }

      .paragraph--type--banner-carousel .banner__image .field--name-field-banner-image,
      .paragraph--type--banner-carousel .banner__image .field--name-field-banner-image .field__item {
         height: auto;
         width: 100%;
      }

      .paragraph--type--banner-carousel .banner__content .field--name-field-banner-text h2 {
         font-size: 27px;
         line-height: 33px;
      }

      .paragraph--type--banner-carousel .banner__image img {
         width: 100%;
         height: auto;
         object-fit: contain;
         margin-right: 0;
      }

      /* compare carousel */
      .paragraph--type--compare-carousel {
         position: relative;
      }

      .paragraph--type--compare-carousel .compare-carousel {
         position: static;
      }

      .paragraph--type--compare-carousel .compare-carousel__nav {
         top: -5px;
         transform: none;
      }

      .paragraph--type--compare-carousel .compare-carousel__nav[disabled] {
         display: inline-flex;
         opacity: 0.35;
         cursor: default;
      }

      .paragraph--type--compare-carousel .compare-carousel__prev {
         left: auto;
         right: 60px;
      }

      .paragraph--type--compare-carousel .compare-carousel__next {
         right: 12px;
      }

      /* catalog cards */

      .catalog.container, .blog.container {
         padding-bottom: 3rem;
         padding-top: 3rem;
      }

      .ss-filters__search-wrap .js-form-item {
         align-items: start;
         gap: 5px;
         flex-direction: column;
         position: relative;
      }

      .ss-filters__search-wrap {
         padding: 16px 30px 22px 25px;
      }

      .ss-filters__search-wrap .js-form-item label {
         position: static;
      }

      .ss-filters__search-wrap .js-form-item label::after {
         left: 11px;
         top: auto;
         bottom: 11px;
         transform: none;
      }

      .ss-filters__search-wrap input[type="text"], 
      .ss-filters__search-wrap input[type="search"] {
         padding: 11px 16px 11px 38px;
      }

   }

   /* User profile — the registration application as reviewed by an admin. */

   .profile {
      margin: 0 auto;
      max-width: 1075px;
      padding: 2.5rem 1.5rem 4rem;
   }

   .profile-group {
      column-gap: 30px;
      display: grid;
      grid-template-columns: 1fr;
   }

   .profile-group__title {
      border-bottom: 1px solid rgba(var(--navy-rgb), 0.12);
      color: var(--purple);
      font-family: Quicksand;
      font-size: 21px;
      font-weight: 700;
      grid-column: 1 / -1;
      margin: 28px 0 16px;
      padding-bottom: 8px;
   }

   .profile .profile-group:first-of-type .profile-group__title {
      margin-top: 0;
   }

   .profile .field {
      margin-bottom: 18px;
   }

   .profile .field--label-inline .field__label,
   .profile .field__label {
      color: rgba(var(--navy-rgb), 0.62);
      display: block;
      font-family: Montserrat;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.4px;
      line-height: 16px;
      margin-bottom: 4px;
      text-transform: uppercase;
   }

   .profile .field--label-inline .field__label::after {
      content: none;
   }

   .profile .field--label-inline .field__item,
   .profile .field__item {
      color: var(--navy);
      display: block;
      font-family: Montserrat;
      font-size: 16px;
      font-weight: 500;
      line-height: 24px;
   }

   /* Long answers and long questions need the whole row. */
   .profile .field--type-string-long,
   .profile .field--type-list-string {
      grid-column: 1 / -1;
   }

   .profile .js-form-type-item .label {
      color: rgba(var(--navy-rgb), 0.62);
      font-family: Montserrat;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.4px;
      margin-bottom: 4px;
      text-transform: uppercase;
   }

   .profile .field__item--empty {
      color: rgba(var(--navy-rgb), 0.42);
      font-style: italic;
   }

.block-views-blockaccordion-view-block-1 .views-field-body ul,
.block-views-blockaccordion-view-block-2 .views-field-body ul,
.block-views-blockaccordion-view-block-3 .views-field-body ul {
   list-style: none;
   padding-left: 0;
}

.block-views-blockaccordion-view-block-1 .views-field-body ul li,
.block-views-blockaccordion-view-block-2 .views-field-body ul li,
.block-views-blockaccordion-view-block-3 .views-field-body ul li {
   position: relative;
   padding-left: 1.875rem;
   font-family: "Montserrat", sans-serif;
   color: #2A2083;
   margin-bottom: 5px;
}

.block-views-blockaccordion-view-block-1 .views-field-body ul li::before,
.block-views-blockaccordion-view-block-2 .views-field-body ul li::before,
.block-views-blockaccordion-view-block-3 .views-field-body ul li::before {
   content: "";
   position: absolute;
   left: 0;
   top: 0;
   width: 18px;
   height: 1.2em;
   background-image: url("../images/list_icon.png");
   background-size: 18px 21px;
   background-repeat: no-repeat;
   background-position: left center;
}

@media (min-width: 767px) {
   footer .region-footer-second #block-signature-supplements-footer ul .nav-item:nth-of-type(1) > .nav-link {
      padding-left: 0rem;
   }
}

footer .region-footer-second #block-signature-supplements-footer ul .nav-item:nth-last-of-type(1) > .nav-link {
   padding-right: 0px;
}

footer .region-footer-second {
   grid-template-columns: 1fr 0.6fr 0.6fr repeat(3, 1fr);
}

@media (min-width: 1200px) and (max-width: 1400px) {
   footer .region-footer-second {
      grid-template-columns: 1fr 0.5fr 0.5fr repeat(3, 1fr);
   }

   footer .region-footer-second #block-signature-supplements-footer ul .nav-item > .nav-link {
      padding-left: 0.4rem;
      padding-right: 0.4rem;
   }
}

@media (min-width: 767px) and (max-width: 1200px) {
   footer .region-footer-second #block-signature-supplements-footer ul {
      display: block;
      text-align: right;
   }

   footer .region-footer-second #block-signature-supplements-footer ul .nav-item > .nav-link {
      padding-left: 0rem;
      padding-right: 0rem;
   }
}


footer [id^="block-signature-supplements-footerfirst"] {
   color: #fff;
}

footer [id^="block-signature-supplements-footerfirst"] .field--name-body .left p {
   color: #fff;
   font-size: 1.5rem;
   font-family: "Quicksand", sans-serif;
}

footer [id^="block-signature-supplements-footerfirst"] .field--name-body .right {
   text-align: center;
}

footer [id^="block-signature-supplements-footerfirst"] .field--name-body .right button::after,
footer [id^="block-signature-supplements-footerfirst"] .field--name-body .right a::after {
   font-family: "Material Symbols Outlined";
   content: "arrow_forward";
   margin-left: 0.3125rem;
   font-size: 0.9375rem;
   border: 0 !important;
   vertical-align: 0;
}

@media (min-width: 48rem) {
   footer [id^="block-signature-supplements-footerfirst"] .field--name-body {
      display: flex;
      align-items: center;
      justify-content: space-between;
      max-width: 1000px;
      margin: auto;
   }

   footer [id^="block-signature-supplements-footerfirst"] .field--name-body .left,
   footer [id^="block-signature-supplements-footerfirst"] .field--name-body .right {
      width: 50%;
   }
}

footer [id^="block-signature-supplements-footerfirst"] a {
   border-radius: 100px;
   color: #fff;
   position: relative;
   z-index: 1;
   padding: 0.75rem 1.5rem;
   font-weight: 500;
   text-transform: uppercase;
   font-size: 0.825rem;
   box-shadow: 0 4px 10px 0 rgba(33, 31, 84, 0.6);
   letter-spacing: 2%;
}

footer [id^="block-signature-supplements-footerfirst"] a.primary {
   background: linear-gradient(#392CB5 0 0) padding-box,
               linear-gradient(to right, #fff 0%, #2BF388 100%) border-box;
   color: #fff;
   border: 1px solid transparent;
   border-radius: 100px;
   display: inline-block;
   transition: transform 0.5s ease;
}

footer [id^="block-signature-supplements-footerfirst"] a.primary:hover,
footer [id^="block-signature-supplements-footerfirst"] a.primary:focus {
   transform: translateY(-4px);
   background: linear-gradient(#392CB5 0 0) padding-box,
               linear-gradient(to right, #2BF388 0%, #fff 100%) border-box;
}
