.page-benefits-women,
.page-benefits-pregnancy,
.page-benefits-wet-wipe {
article.page.benefits-pregnancy {
  p {
    font-size: 22px;
    line-height: 1.2;
    margin: 22px 0 !important;

    @media(max-width: 480px) {
       margin: 14px 0 !important;
    }
    
    a {
        text-decoration-color: #000;

      &:hover {
          color: #000;
          opacity: .5;
      }
    }
  }

  h2.title {
    font-size: 32px;
    line-height: 60px;
  }

  .p-t-4vw {
    padding-top: 4vw;
  }

  .product {
    .body-text p,
    .variant-names p{
      font-size: 14px;
      line-height: 1.6;
      text-align: left;

    }

    .figure-text-text {
      text-align: left;
    }


  }

  @media(max-width: 1440px) {

    p {
      font-size: 22px;
    }

    h2.title {
      font-size: 28px !important;
      line-height: 50px;
    }
  }
  @media(max-width: 768px) {
    p,
    h2.title {
      font-size: 18px !important;
    }
  }


  @media(max-width: 480px) {
    p,
    h2.title {
      font-size: 14px !important;
    }
  }
  .video-info {
    font-size: 16px;
    text-align: center;
    line-height: 1.5;
    
    @media (max-width: 480px) {
       font-size: 16px !important;
    }
  }
  .video-wrapper {
    padding: 0;
  }
  .video-container {
    padding-bottom: 50.25%;
  }
  .youtube-player {
    position: absolute;
    height: 100%;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
  }
  @media (max-width: 768px) {
    .video-column {
      margin-bottom: 20px;
      padding: 0;
      width: 100%;
    }
    .video-container {
      padding-bottom: 52%;
    }
  }
  @media(max-width: 768px) {
    .shopify-section.first-section {
      padding-top: 45px;
      padding-bottom: 33px;
    }
  }
  .about-link:last-of-type {
    margin-bottom: 0px;
}
}
}

.benefits-body {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;


  &.full-image {
    .benefits-body-image {
      padding: 0;
    }

    .benefits-body-paragraph {
      padding: 40px 0;
    }
  }

  &.image-boxed-mobile {
    .benefits-body-image {
      display: flex;
      justify-content: flex-end;

      img {
        max-width: 80%;
        height: auto;
      }

      @media screen and (max-width: 768px) {
        justify-content: center;
        align-items: center;

        img {
          max-width: 100%;
          height: auto;
        }
      }
    }
  }



  .benefits-body-outer-title {
    font-size: 32px;
    margin-bottom: 40px;
    @media screen and (max-width: 768px) {
      font-size: 22px;
    }
  }

  .benefits-body-image {
    width: 40%;
    padding: 0 30px;

    @media screen and (max-width: 768px) {
        width: 100%;
        padding: 15px 0;
       order: 1;
    }
    

    img {
      max-width: 100%
    }
  }

  &.dark-grey {

    background: #444E58;

    .benefits-body-paragraph {
      color: #FFF;
    }

    .button-secondary {
      color: #FFF;
      background: transparent;
      border: 2px solid #FFF;
    }
  }

  &.light-grey {

    background: #F3F3F4;

  }

  &.cta-body {
    .benefits-body-paragraph {
      p {
        margin: 0 0 15px 0;
      }

      .button-secondary {
        margin-bottom: 15px;
      }
      .button {
        margin: 20px 0;
      }
    }
  }

  .benefits-body-paragraph {
    width: 60%;
    padding: 0 30px;

    @media screen and (max-width: 768px) {
        width: 100%;
        padding: 15px 0;
      order: 2;
    }
    
    h1 {
      @extend .heading-large;
    }

    h2 {
      @extend .heading-medium;
    }

    p {
       font-size: 22px;
      line-height: 1.2;
      font-weight: 300;
      -webkit-font-smoothing: antialiased;
    }

    &.full-width {
      width: 100%;
    }

    &.large-text {


      h2 {
        @media screen and (max-width: 768px) {

          font-size: 32px;
        }
      }

      p {
        @media screen and (max-width: 768px) {

          font-size: 22px;
        }
      }
    }

    &.cta {
      color: #1F1C1D;

      .index-body-text{
        color: #1F1C1D;
        margin-top: 0;
        margin-bottom: 30px;
      }

      .button-secondary,
      .button {
        margin-bottom: 15px;
      }
    }
  }




  &.equal-width {
    .benefits-body-image,
    .benefits-body-paragraph {
      width: 50%;
    }
  }

  &.larger-image {
    .benefits-body-image {
      width: 60%;
    }
    .benefits-body-paragraph {
      width: 40%;
    }
  }

  @media(max-width: 1440px) {

  }

  @media screen and (max-width: 768px) {
    .benefits-body-image,
    .benefits-body-paragraph, {
      width: 100% !important;
      padding: 15px 0;
    }

    .benefits-body-image {
      order: 1;
    }

    .benefits-body-paragraph {
      order: 2;
    }


    &.switch-mobile  {
      .benefits-body-image {
        order: 2;
      }

      .benefits-body-paragraph {
        order: 1;
      }
    }
  }

  @media(max-width: 480px) {
    p {
      font-size: 14px;
    }
  }
}



.benefits-pregnancy .video-wrapper:after {
  display: none;
}
.page-benefits-pregnancy {
  .mother-nature {
    background-image: url({{ 'pregnancy-hero_2x.jpg' | asset_url }});
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    min-height: 400px;
    color: #FFF;
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 0 30px !important;


    .text-header {
      font-size: 40px !important;
      text-align: center;
      margin: 0 auto;
      z-index: 3;
      @media (max-width: 1024px) {
        font-size: 24px !important;
      }
    }
  }
}


