/** Shopify CDN: Minification failed

Line 667:0 Expected "}" to go with "{"

**/
/** POP UP */
div[role=dialog].kl-private-reset-css-Xuajs1{
  .ql-font-caveat{
    font-family: Verlag !important;
    font-weight: 400 !important;
    color: #45C1C8 !important;
  }
  button.klaviyo-close-form {
    height: 35px !important;
    width: 35px !important;
    svg{
      height: 35px;
      width: 35px;
    }
  }
  form{
    &>div.kl-private-reset-css-Xuajs1:first-child{
      &>div.kl-private-reset-css-Xuajs1{
        background-image: url('/cdn/shop/files/lu-popup-image.jpg?v=1747730496');
        background-size: cover;
        background-position: center;
        
        img{
          opacity: 0;
        }
      }
    }
    button{
      border: 1px solid #00ABC7 !important;
      border-radius: 74px! important;
      text-shadow: none;
      font-size: 16px !important;
      font-weight: 500 !important;
      background-color: transparent !important;
      color: #00ABC7 !important;
      max-height: 44px;
      
      &:hover{
       background-color: #00ABC7 !important; 
       color: #fff !important; 
      }
    }
  }
  p{
    line-height: 1.2 !important;
  }
  
}

/** COLLECTION PAGE */
body.collection > .container{
    padding-bottom: 90px;
}


.okeReviews .oke-reviewsTab {
  display: none !important;
}

.index-sections{
  overflow: hidden;  
}

.container{
  max-width: 1250px !important;
  padding-left: 15px;
  padding-right: 15px;
  box-sizing: border-box;
  
  .products {
    .four.columns{
      width: 25%;
      padding: 0px;
      padding-bottom: 90px;
  
      @media only screen and (max-width: 768px) {
        width: 50%;
      }
  
      @media only screen and (max-width: 480px) {
        width: 100%;
      }
    }
  }
}

.shopify-section{
    color: #231F20;
    margin-top: 0px;
    margin-bottom: 0px !important;
  
    h1 {
      color: #45C1C8;
      font-size: 30px;
      font-weight: 325;
      padding-bottom: 20px;

      @media only screen and (max-width: 959px) {
        font-size: 24px;
        line-height: 100%;
      }
    }
}


.related-product-list {
  display: flex;
  align-items: unset !important;

  .product_image img{
    max-width: 100% !important;
  }
  .thumbnail{
    margin-top: 0px;
  }
  .info{
    padding: 0px 30px;
    font-size: 18px;
    font-weight: 300;

    .money,
    .sold_out{
      font-size: 16px;
    }

    .money{
      color: #000;
    }

    .oke-sr-count{
      vertical-align: top;
    }
    .oke-sr-count-number{
      font-size: 16px;
      position: relative;
      
      &:before{
        content: '(';
        position: absolute;
        bottom: -5px;
        left: -5px;
      }
      &:after{
        content: ')';
        position: absolute;
        bottom: -5px;
        right: -5px;
      }
    }
    .oke-sr-label-text{
      display: none;
    }

    @media only screen and (max-width: 959px) {
      font-size: 16px;
      line-height: 24px;
    }
  }

  
  .homepage_add_to_cart{
    position: absolute;
    bottom: 0;
    width: 100%;
  }
  
}

.related-product-list .action_button,
.reef-safe-products-section .action_button,
.rebuy-cart .rebuy-cart__flyout-empty-cart a,
.rebuy-cart .rebuy-cart__flyout-recommendations button,
.add_to_cart.action_button,
#btnNotifyMe{
  border: 1px solid #00ABC7;
  border-radius: 74px! important;
  text-shadow: none;
  font-size: 16px;
  font-weight: 500 !important;
  background-color: transparent;
  color: #00ABC7;

  &.waitlist-me{
    margin: 10px 0px 30px;
  }
  
  &:hover{
   background-color: #00ABC7; 
   color: #fff; 
  }
}

.action_button, .oke-button{
  border-radius: 74px !important;
  min-height: 44px;
  max-height: 44px;
  padding: 12px 30px !important;
  line-height: 1.2;
  font-size: 16px;
  font-weight: 500 !important;
  text-shadow: none !important;
}

.flex-control-nav.flex-control-paging{
  bottom: 4%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 10px;
  
  li{
    margin: 0px;
    a {
      height: 13px;
      width: 13px;
    }
  }

  @media only screen and (max-width: 798px) {
    li{
      a {
        height: 13px;
        width: 13px;
      }
    }
  }
}

h3, .section-header{
  font-weight: 400 !important;
  color: #45C1C8 !important;
}

p{
  font-size: 18px;
  font-weight: 300;
  color: #231F20;
  line-height: 1.8;
}

@media only screen and (max-width: 959px) {
  h3, .section-header{
    font-size: 23px !important;
  }

  p{
    font-size: 15px !important;
  }
}

/** FOOTER */
footer.footer-v2{
  background-color: #FCF8F0 !important;
  
  .footer-logo{
    max-height: 143px;
    width: auto;
  }
 .footer-1{
   padding: 80px 0 70px;
 }

 .columns-100{
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   
   .col-50{
     width: 50%;
   }
 }

 

 .newsletter{
   max-width: 442px;
   padding-top: 35px;

   .newsletter-text{
     margin-bottom: 20px;
   }

   h6{
     display: none;
   }
   
   p{
     font-size: 15px;
   }

   form{
     margin: unset;

     &>div.kl-private-reset-css-Xuajs1{
       min-height: unset !important;
     }

     [data-testid="form-row"]{
       @media only screen and (max-width: 480px) {
         flex-direction: column !important;
         gap: 20px;
       }
     }

     input{
       background-color: transparent !important;
       border-top: 0px !important;
       border-left: 0px !important;
       border-right: 0px !important;
       border-bottom: 1px solid #4C5055 !important;
       padding-left: 0px !important;
     }

     .kl-private-reset-css-Xuajs1{
       justify-content: unset !important;
       &:not(button){
         background-color: transparent !important;
         font-size: 15px !important;
         text-transform: uppercase;
       }
     }
     button{
       background-color: #00ABC7 !important;
       font-weight: 500 !important;
       font-size: 16px;
       border: 1px solid #00ABC7 !important;
       border-radius: 74px !important;
       padding: 0px 40px !important;
       transition: all .3s ease-in-out;
       max-height: 44px;
       height: 42px !important;

       &:hover{
         background-color: transparent !important;
         color: #00ABC7 !important;
         border: 1px solid #00ABC7 !important;
       }

       &[aria-label="Copy coupon code"]{
         color: #fff !important;

         svg > svg{
           path{
             fill: #fff !important;
           }
           rect{
             stroke: #fff !important;
           }
         }

         &:hover{
           color: #00ABC7 !important;

           svg > svg{
             path{
               fill: #00ABC7 !important;
             }
             rect{
               stroke: #00ABC7 !important;
             }
           }
         }
       }
     }
   }
 }

 .footer-vertical-menus{
   display: flex;
   flex-direction: row;
   gap: 100px;

   ul{
     list-style: none;
     display: flex;
     flex-direction: column;
     gap: 24px;
     margin-bottom: 0px;

     li{
       list-style: none;
       line-height: 1.2 !important;

       a{
         color: #221F20 !important;
         font-size: 15px !important;
         text-transform: uppercase;
       }
     }
   }
 }

 .bg-blue{
   background-color: #3FC2CD;
 }

 .footer-2{
   padding: 5px 0;

   .social_icons{ 
     gap: 15px;
     a{
       width: unset !important;
       margin: 0px !important;
       height: 30px;
     }
   }

   .footer-horizontal-menus{
     ul{ 
       display: flex;
       flex-wrap: wrap;
       gap: 20px;
       height: 100%;
       align-items: center;
       justify-content: center;

       li{ 
         padding: 0px;
         line-height: 1.2 !important;

         a{
           color: #fff !important;
           font-size: 15px !important;
         }
       }
     }
   }

   .credits{
     color: #fff !important;
     text-align: center;
     a{
       color: #fff !important;
     }
   }
 }

 .footer-3{
   padding: 15px 0;

   .columns-100{
     justify-content: center;
   }

   .payment-methods{
     display: flex;
     align-items: center;
     gap: 5px;
   }

   .footer-sponsors{
     display: flex;
     align-items: center;
     gap: 15px;

     .sub-title{
       font-family: "Futura", sans-serif !important;
       font-size: 16px !important;
     }
     .sponsor_images{
       display: flex;
       align-items: center;
     }
     .sponsor-img-wrap{
       padding: 0px;
     }
   }
 }

 .footer-3-wrapper{
   gap: 20px;

   &>div{
     display: flex;
     align-items: center;
     justify-content: center;
   }
 }


@media only screen and (max-width: 798px){
  .footer-2{
    padding: 50px 0 !important;
  }
  .footer_menu{
    flex-direction: column;
    padding: 25px 0;
  }
}


 @media only screen and (max-width: 1199px){
   .footer-vertical-menus{
     gap: 50px;
   }
 }

 @media only screen and (max-width: 959px){

   .columns-100{
     flex-direction: column;
     gap: 40px;

     .col-50{
       width: 100%;
       display: flex;
       flex-direction: column;
       align-items: center;
     }
   }

   .footer-2{
     padding: 20px 0;
     .columns-100{
       gap: 20px;
     }
   }

   .newsletter-text{
     text-align: center;
   }
   
   .footer-vertical-menus{
     flex-direction: column;
     gap: 5px;

     ul{
       gap: 5px;
     }
     
     li{
       text-align: center;
     }
   }
 }

 @media only screen and (max-width: 798px) {
   .footer-logo{
     img{
       width: 100%;
       height: auto;
     }
   }
 }

 @media only screen and (max-width: 470px) {

   .newsletter-text{
     padding-bottom: 50px;
   }
 }
}

/** CONTACT PAGE */
.contact-section{
  padding-bottom: 90px;

   @media only screen and (max-width: 959px){
     form{
       display: flex;
       flex-direction: column;
       
       &>div{
         width: 100% !important;
         margin-left: 0px !important;
         margin-right: 0px !important;
         padding-left: 0px !important;
         padding-right: 0px !important;
       }
     }
   }
}

/** Floating Teaser */
.kl-teaser-UwZpZf{
  left: unset !important;
  /* right: 120px !important; */
  right: 5% !important;
  bottom: 120px !important;
  width: 134px !important;
  height: 134px !important;


  @media only screen and (max-width: 998px){
    right: 0px !important;
    width: 110px !important;
    height: 110px !important;
  }

  .kl-private-reset-css-Xuajs1{
    border-radius: 100%;
    overflow: hidden;
  }

  p > span{
    color: #fff !important;
    font-size: 18px !important;
    padding: 0px 13px;
    text-align: center;
    display: block;
    line-height: 1;
    text-transform: uppercase;

    @media only screen and (max-width: 998px){
      font-size: 15px !important;
    }
  }

  .klaviyo-close-form{
    width: 37px !important;
    height: 37px !important;
    top: -2px !important;
    right: 2px !important;
    
    svg{
      width: 37px;
      height: 37px;
      circle{
        fill: #F5A78E !important;
        stroke: #F5A78E !important;
      }
      path{
        stroke-width: 1.5 !important;
      }
    }

    @media only screen and (max-width: 998px){
      width: 30px !important;
      height: 30px !important;
      top: 4px !important;
      right: 2px !important;
      
      svg{
        width: 30px;
        height: 30px;
      }
    }
  }
}

body{
  &.index,
  &.page-our-story,
  &.page-community,
  &.page-center,
  &.page-reef{

  &.nav-open{
    @media only screen and (max-width: 998px){
      .kl-teaser-UwZpZf > div > span{
        background-color: #E3F3F6 !important;
        p span{
          color: #45C1C8 !important;
        }
      }
    }
  } 
}