/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

/* General Styling */
body {
  margin: 0;
  padding: 0;
  font-family: Arial, sans-serif;
}

/* Main Container */
/* .warped-text {
    font-size: 60px;
    font-weight: bold;
    color: #2a7a3f;
    display: inline-block;
    transform: perspective(300px) rotateX(5deg);
  } */
/* Content Box */
#reDesign_background .content_wrap {
  -ms-flex-pack: distribute;
  justify-content: space-around;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  max-width: 100rem;
  margin: 0 auto;
  position: relative;
}

#reDesign_background {
  background-color: #f1f1de;
  height: 100rem;
  position: relative;
}

#reDesign_background .bg_wrap {
  position: relative;
}

/* Background Image */
#reDesign_background .bg_img_comtent {
  background-repeat: no-repeat;
  background-size: 127%;
  background-position: center;
  position: absolute;
  height: 790px;
  -webkit-transform: translate(0%, -20%);
  -ms-transform: translate(0%, -20%);
  transform: translate(0%, -20%);
  top: -14%;
  bottom: 0;
  right: 0;
  left: 0;
}

#reDesign_background .bg-wrap {
  min-height: 700px;
}

/* Product Images */
#reDesign_background .product_images {
  position: absolute;
  left: -2rem;
  top: 5rem;
  bottom: 0;
  gap: 21px;
  white-space: nowrap;
  font-size: 0;
}

/* #reDesign_background .shadow {
        position: absolute;
        bottom: -12px;
        left: 49%;
        transform: translateX(-50%);
        width: 100%;
        height: 39px;
        background: radial-gradient(ellipse at center, rgb(0 0 0 / 24%) 0%, #00000026 49%);
        border-radius: 50%;
        z-index: 0;
        filter: blur(5px);
    } */

#reDesign_background .shadow-img {
  position: relative;
  display: inline-block;
  width: auto;
  height: 750px;
}

#reDesign_background .shadow-img img {
  /* width: 100%; */
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  z-index: 1;
  position: relative;
}

#reDesign_background .shadow-img .can {
  height: 90%;
}

/* #reDesign_background .shadow-can {
        position: absolute;
        bottom: 1px;
        left: 50%;
        transform: translateX(-50%);
        width: 66%;
        height: 39px;
        background: radial-gradient(ellipse at center, rgb(0 0 0 / 24%) 0%, #00000026 49%);
        border-radius: 50%;
        z-index: 0;
        filter: blur(5px);
    } */

#reDesign_background .bottle {
  /* max-height: 75rem; */
}

.can {
  /* max-height: 85rem; */
  /* object-position: 0px 42px; */
}

/* Text Section */
#reDesign_background .text-head {
  top: 29rem;
  text-align: center;
  width: 30rem;
  padding-left: 20px;
  position: absolute;
  /* bottom: 91px; */
  left: 27rem;
}

.head-1 {
  color: #00734699 !important;
}

#reDesign_background .text-head h2 {
  font-weight: 700;
  color: #006e41;
  font-size: 3.7rem;
  margin: 0;
  margin-top: -6px;
  text-align: center;
  text-transform: uppercase;
  line-height: 33px;
}

#reDesign_background .description {
  position: absolute;
  /* bottom: 91px; */
  right: 16rem;
  width: 32rem;
  padding-left: 11.3rem;
  top: 46rem;
}

#reDesign_background .text-head h1 {
  color: #055a0b;
  font-size: 36px;
  font-weight: bold;
  margin-bottom: 11px;
}

#reDesign_background .inner-nutrition {
  border: 1px solid #006e41;
  margin-bottom: 15px;
}

#reDesign_background .inner-nutrition .row:not(:last-of-type) {
  border-bottom: 1px solid #006e41;
}

#reDesign_background .inner-nutrition .row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-size: 1.8rem;
  line-height: 30px;
}

#reDesign_background .copy-01 {
  font-size: 1.4rem;
  line-height: 1.4;
}

#reDesign_background .inner-nutrition .alcohol,
#reDesign_background .inner-nutrition .amount,
#reDesign_background .inner-nutrition .ingredients,
#reDesign_background .inner-nutrition .nutritional-info {
  display: block;
  padding: 0.8rem;
  color: #006e41;
}

#reDesign_background .nutritional-info {
  font-weight: 600;
  color: #006e41;
}

#reDesign_background .ingredients-link {
  color: #006e41;
  text-decoration: none;
  font-family: Avenir-Black, Arial, sans-serif;
  display: block;
  margin-top: 1.5rem;
  font-weight: bold;
}

#reDesign_background .inner-nutrition .row p {
  padding: 0 4rem 1.4rem 0;
}

#reDesign_background .inner-nutrition .amount {
  border-right: 1px solid #006e41;
}

.pl_newProductHeader .inner-nutrition .amount {
  /* white-space: nowrap !important; */
  -ms-flex-line-pack: center !important;
  align-content: center !important;
  /* font-size: 10px !important; */
}

.pl_newProductHeader .inner-nutrition .nutritional-info {
  white-space: nowrap;
  font-size: medium !important;
}

#reDesign_background .inner-nutrition .row p {
  margin: 0;
  padding: 0 0 1.4rem;
  color: #006e41;
  text-transform: none;
  font-family: Avenir-Medium, Arial, sans-serif;
  letter-spacing: 0;
}

#reDesign_background .overview-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 1rem;
  color: #006e41;
  font-size: 0.9rem;
}

#reDesign_background .overview-item .icon {
  height: 45px;
  width: 45px;
  margin-right: 1.1rem;
}

#reDesign_background .icon svg {
  height: 100%;
  /* width: 100%; */
  display: block;
  fill: currentColor;
}

#reDesign_background .overview,
.description {
  padding: 0 !important;
}

/* Responsive Design */
/* @media screen and (min-width: 1500px) and (max-width: 1720px){
    #reDesign_background .description {
        
        right: 30%;
    }
        #reDesign_background .product_images {
            left: 18%;
        }
} */
@media screen and (min-width: 1500px) {
  #reDesign_background .description {
    position: absolute;
    /* bottom: 91px; */
    right: 21rem;
    width: 38rem;
    padding-left: 11.3rem;
    top: 62rem;
  }

  #reDesign_background .content_wrap {
    max-width: 127rem;
  }

  #reDesign_background {
    background-color: #f1f1de;
    height: 130rem;
  }

  #reDesign_background .bg_img_comtent {
    background-repeat: no-repeat;
    background-size: 127%;
    background-position: center;
    position: absolute;
    height: 958px;
    -webkit-transform: translate(0%, -12%);
    -ms-transform: translate(0%, -12%);
    transform: translate(0%, -12%);
    top: -14%;
    bottom: 0;
    right: 0;
    left: 0;
  }

  #reDesign_background .bottle {
    /* max-height: 76rem; */
  }

  .can {
    /* max-height: 90rem; */
    /* object-position: 0px 47px; */
  }

  #reDesign_background .text-head h2 {
    font-weight: 800;
    color: #006e41;
    font-size: 5rem;
    margin: 0;
    margin-top: -6px;
    line-height: 43px;
  }

  #reDesign_background .product_images {
    position: absolute;
    left: 14rem;
    top: 32rem;
    bottom: 0;
  }

  #reDesign_background.orange-spritz .product_images {
    left: 3rem;
  }

  

  .inner-nutrition .row {
    font-size: 1.3rem;
  }

  .overview-item {
    font-size: 1.3rem;
  }

  #reDesign_background .text-head {
    top: 39rem;
    text-align: center;
    width: 41rem;
    padding-left: 20px;
    position: absolute;
    /* bottom: 91px; */
    left: 44rem;
  }

  #reDesign_background .copy-01 {
    font-size: 1.8rem;
    line-height: 1.6;
  }

  #reDesign_background .shadow-can {
    bottom: -6px;
  }
}

@media screen and (max-width: 375px) {
  #reDesign_background .can {
    /* max-height: 45rem !important; */
    /* object-position: 0px 21px; */
  }

  #reDesign_background .bottle {
    /* max-height: 40rem !important; */
  }

  #reDesign_background .text-head h2 {
    font-size: 2.2rem !important;
    line-height: 26px !important;
  }

  #reDesign_background .product_images {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    top: 47px !important;
    left: 22px !important;
  }

  #reDesign_background .description {
    top: 52rem !important;
    margin: 0;
  }

  #reDesign_background .text-head {
    width: 54% !important;
    padding-left: 0;
    position: absolute;
    /* bottom: 91px; */
    right: 0px;
    top: 115px;
    left: 123px;
  }

  #reDesign_background {
    background-color: #f1f1de;
    height: 1030px;
  }

  #reDesign_background .bg_img_comtent {
    -webkit-transform: translate(0%, -27%);
    -ms-transform: translate(0%, -27%);
    transform: translate(0%, -27%);
  }
}

@media screen and (max-width: 300px) {
  #reDesign_background .can {
    max-height: 30rem !important;
    /* object-position: 0px 21px; */
  }

  #reDesign_background .text-head {
    width: 52% !important;
    left: 99px !important;
    top: 96px !important;
  }

  #reDesign_background .bottle {
    max-height: 30rem !important;
  }

  #reDesign_background .text-head h2 {
    font-size: 1.6rem !important;
    line-height: 19px !important;
  }

  #reDesign_background .shadow-img {
    height: 300px !important;
  }

  #reDesign_background .product_images {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    top: 56px !important;
    left: 22px !important;
  }

  #reDesign_background .description {
    top: 39rem !important;
    margin: 0;
  }

  #reDesign_background {
    background-color: #f1f1de;
    height: 101rem;
  }

  #reDesign_background .text-head {
    width: 54% !important;
    padding-left: 0;
    position: absolute;
    /* bottom: 91px; */
    right: 0px;
    top: 110px;
    left: 144px;
  }

  #reDesign_background {
    background-color: #f1f1de;
    height: 1030px;
  }

  #reDesign_background .bg_img_comtent {
    -webkit-transform: translate(0%, -33%);
    -ms-transform: translate(0%, -33%);
    transform: translate(0%, -33%);
  }
}

@media screen and (min-width: 500px) and (max-width: 767px) {
  #reDesign_background .product_images {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    top: 110px !important;
    left: 95px !important;
  }

  #reDesign_background .text-head {
    width: 51% !important;
    top: 146px !important;
    left: 190px !important;
  }

  #reDesign_background .can {
    max-height: 57rem !important;
    /* object-position: 0px 21px; */
  }

  #reDesign_background .bottle {
    max-height: 52rem !important;
  }

  #reDesign_background .description {
    right: 20px;
    top: 59rem !important;
    margin: 0;
  }

  #reDesign_background {
    background-color: #f1f1de;
    height: 1093px !important;
  }
}

@media screen and (min-width: 220px) and (max-width: 766px) {
  #reDesign_background .bg_img_comtent {
    background-position: 50% 0;
    background-position: center;
    height: 256px;
  }

  #reDesign_background {
    background-color: #f1f1de;
    height: 116rem;
    overflow: hidden;
  }

  #reDesign_background .content_wrap {
    -webkit-box-pack: normal;
    -ms-flex-pack: normal;
    justify-content: normal;
    display: contents;
  }

  #reDesign_background .image-section,
  .text-section {
    width: 100%;
  }

  #reDesign_background .product_images {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    top: 68px;
    left: 37px;
  }
  #reDesign_background.orange-spritz .product_images {
    left: 0rem;
    top: 11.5rem;
  }

  #reDesign_background .shadow-img {
    height: 450px;
  }

  #reDesign_background .bottle {
    /* max-height: 40rem;
            ; */
  }

  #reDesign_background .can {
    /* max-height: 50rem; */
    /* object-position: 0px 21px; */
  }

  #reDesign_background .text-head {
    width: 53%;
    padding-left: 0;
    position: absolute;
    /* bottom: 91px; */
    right: 0px;
    top: 116px;
    left: 140px;
  }

  #reDesign_background .text-head h2 {
    font-size: 2.4rem;
    line-height: 33px;
    margin-top: -8px;
  }

  #reDesign_background .description p {
    padding: 18px;
    line-height: 28px;
  }

  #reDesign_background .description {
    width: 88%;
    position: absolute;
    /* bottom: 91px; */
    right: 20px;
    top: 55rem;
    margin: 0;
  }
}

/* @media only screen and (min-width: 601px) and (max-width:700px){
    #reDesign_background .bg_img_comtent {
        background-repeat: no-repeat;
        background-size: 153%;
        background-position: center;
        position: relative;
        height: 429px;
        transform: translate(0%, -18%);
    }
    #reDesign_background .product_images {
        position: absolute;
        left: 6%;
        top: 41%;
        bottom: 0;
    }
    #reDesign_background .bottle {
        max-height: 394px;
    }
    #reDesign_background .text-head {
        width: 70%;
        top: 197px;
        left: 9rem;
    }
    #reDesign_background .text-head h2 {
        font-size: 2.4rem;
        margin: 0;
    }
    #reDesign_background .description {
        width: 90%;
        top: 38.9rem;
        right: 29px;
        margin: 0;
    }
    .can {
        max-height: 24rem;
    }

} */
@media only screen and (min-width: 920px) and (max-width: 1022px) {
  #reDesign_background .bg_img_comtent {
    height: 492px !important;
  }

  #reDesign_background .product_images {
    position: absolute;
    left: 10rem !important;
    top: 22rem !important;
    bottom: 0;
  }

  .can {
    max-height: 72rem !important;
  }

  #reDesign_background .bottle {
    max-height: 63rem !important;
  }

  #reDesign_background .text-head {
    top: 29rem !important;
    text-align: center;
    width: 30rem;
    padding-left: 20px;
    position: absolute;
    /* bottom: 91px; */
    left: 35rem !important;
  }
}

@media only screen and (min-width: 767px) and (max-width: 1023px) {
  #reDesign_background .bg_img_comtent {
    background-repeat: no-repeat;
    background-size: 133%;
    background-position: center;
    height: 406px;
    -webkit-transform: translate(0%, 2%);
    -ms-transform: translate(0%, 2%);
    transform: translate(0%, 2%);
  }

  #reDesign_background .product_images {
    position: absolute;
    left: 4rem;
    top: 19rem;
    bottom: 0;
  }

  #reDesign_background .shadow-img {
    height: 586px;
  }

  #reDesign_background .text-head {
    top: 25rem;
    text-align: center;
    width: 28rem;
    padding-left: 20px;
    position: absolute;
    /* bottom: 91px; */
    left: 27rem;
  }

  #reDesign_background .description {
    position: absolute;
    /* bottom: 91px; */
    right: 4rem;
    width: 29rem;
    padding-left: 11.3rem;
    top: 43rem;
  }

  .can {
    /* max-height: 66rem; */
    /* object-position: 0px 27px; */
  }

  #reDesign_background .bottle {
    /* max-height: 54rem; */
  }

  #reDesign_background .text-head h2 {
    font-size: 3.3rem;
  }

  #reDesign_background .overview-item .icon {
    height: 43px;
    width: 43px;
  }
}

@media only screen and (min-width: 912px) and (max-width: 1368px) and (orientation: portrait) {
  #reDesign_background .description {
    right: 13rem !important;
  }
}

@media only screen and (min-width: 853px) and (max-width: 1280px) {
  #reDesign_background .description {
    right: 10rem;
  }
}

/* #reDesign_background .bottle {
        max-height: 51rem;
    }
    #reDesign_background .can {
        max-height: 55rem;
        object-position: -20px 12px;
    }
    #reDesign_background .text-head {
        width: 50%;
        left: 13rem;
        top: 74%;
    } */
/* #reDesign_background .product_images {
        position: absolute;
        left: 19px;
        top: 168px;
    }
    #reDesign_background .description {
        width: 41%;
        top: 41rem;
        right: 49px;
        margin: 0;
        padding: 0;
    }
    #reDesign_background {
        height: 800px;
    } */
/* }
@media only screen and (min-width: 820px) and (max-width:1180px){
    #reDesign_background .text-head {
        width: 50%;
        left: 12rem;
        top: 73%;
    }
} */
@media only screen and (min-width: 1023px) and (max-width: 1499px) {
  #reDesign_background .product_images {
    position: absolute;
    left: 9rem;
    top: 18rem;
    bottom: 0;
  }
  #reDesign_background.orange-spritz .product_images {
    left: 3rem;
  }

  #reDesign_background {
    background-color: #f1f1de;
    height: 100rem;
  }

  #reDesign_background .text-head {
    top: 26rem;
    text-align: center;
    width: 30rem;
    padding-left: 20px;
    position: absolute;
    /* bottom: 91px; */
    left: 34rem;
  }

  #reDesign_background .bg_img_comtent {
    background-size: 128%;
    height: 649px;
    -webkit-transform: translate(0%, -10%);
    -ms-transform: translate(0%, -10%);
    transform: translate(0%, -10%);
  }

  #reDesign_background .shadow-img {
    height: 650px;
  }

  #reDesign_background .description {
    position: absolute;
    /* bottom: 91px; */
    right: 15rem;
    width: 30rem;
    padding-left: 11.3rem;
    top: 44rem;
  }

  #reDesign_background .shadow-can {
    bottom: -6px;
  }
}

/* @media only screen and (min-width: 701px) and (max-width:767px) {
    #reDesign_background .text-head {
        width: 53%;
    top: 247px;
    left: 15rem;
    }
    #reDesign_background .text-head h2 {
        font-size: 2.8rem;
        margin: 0;
    }
    #reDesign_background .product_images {
        position: absolute;
        left: 23px;
        top: 182px;
    }
        #reDesign_background .bottle {
            max-height: 627px;
        }
        #reDesign_background .can {
            max-height: 392px;
        }
        #reDesign_background .description {
            width: 100%;
            top: 51.9rem;
            right: 0;
            margin: 0;
        }
        #reDesign_background .description p{
            padding: 35px;
            line-height: 31px;
        }
} */

/* color selection */
h2[data-txt-color="Apple"] .head-2 {
  color: #83b356;
}

h2[data-txt-color="Pear"] .head-2 {
  color: #c0c449;
}

h2[data-txt-color="Watermelon"] .head-2 {
  color: #d3262f;
}

h2[data-txt-color="Blueberry"] .head-2 {
  color: #2960a7;
}

h2[data-txt-color="Elderflower & Lime"] .head-2 {
  color: #78c2ac;
}

h2[data-txt-color="Mango & Lime"] .head-2 {
  color: #e29826;
}

h2[data-txt-color="Red Rhubarb"] .head-2 {
  color: #c82742;
}

h2[data-txt-color="Sparkling Spritz"] .head-2 {
  color: #d86017;
}

h2[data-txt-color="Passionfruit & Orange"] .head-2 {
  color: #eaa11c;
}

h2[data-txt-color="Raspberry & lime"] .head-2 {
  color: #cf2f5d;
}

h2[data-txt-color="Pineapple & Lime"] .head-2 {
  color: #dcc03a;
}

h2[data-txt-color="Blackberry"] .head-2 {
  color: #92207a;
}

h2[data-txt-color="Winter cider"] .head-2 {
  color: #1d6339;
}

h2[data-txt-color="Apple 0,0%"] .head-2 {
  color: #6aa43d;
}

h2[data-txt-color="Pear 0,0%"] .head-2 {
  color: #bbbf36;
}

h2[data-txt-color="Wild Berries 0,0"] .head-2 {
  color: #be3e62;
}

h2[data-txt-color="Strawberry & Lime 0,0%"] .head-2 {
  color: #d63742;
}

h2[data-txt-color="Mandarin 0,0%"] .head-2 {
  color: #e38238;
}

h2[data-txt-color="Orange spritz"] .head-2 {
  color: #e44e32;
}

.warped-text img {
  width: 92%;
}

.head-2 {
  font-family: Avenir-Black, Arial, sans-serif;
}

#reDesign_background .overview-item .icon:empty {
  display: none;
}

#reDesign_background .primary-button-new {
  padding: 1rem 2rem;
  -webkit-transition:
    color 0.25s cubic-bezier(0.645, 0.045, 0.355, 1),
    background-color 0.25s linear;
  -o-transition:
    color 0.25s cubic-bezier(0.645, 0.045, 0.355, 1),
    background-color 0.25s linear;
  transition:
    color 0.25s cubic-bezier(0.645, 0.045, 0.355, 1),
    background-color 0.25s linear;
  color: #006e41;
  border-radius: 50px;
  border: 1px solid #006e41;
  outline: 0;
  margin: 1.4rem 0;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
  text-decoration: none;
  font-size: 1.4rem;
}

#reDesign_background .primary-button-new:hover {
  color: #fff;
  background-color: #006e41;
}

.pl_cat_zero_zero .bg_wrap .content_wrap .text-head,
.pl_cat_light .bg_wrap .content_wrap .text-head,
.pl_cat_three_zero .bg_wrap .content_wrap .text-head {
  top: 20rem !important;
}

.pl_cat_zero_zero .bg_wrap .content_wrap .text-head .warped-text img,
.pl_cat_light .bg_wrap .content_wrap .text-head .warped-text img,
.pl_cat_three_zero .bg_wrap .content_wrap .text-head .warped-text img {
  width: 35%;
  margin-bottom: 10px;
}

.mango .bg_wrap .content_wrap .head-2 {
  white-space: nowrap;
}

.break-and .bg_wrap .content_wrap .head-2 {
  display: inline-block;
  max-width: 10ch;
}

.cherry-break-and .bg_wrap .content_wrap .head-2 {
  display: inline-block;
  max-width: 8ch;
}

@media (max-width: 767px) {

  .pl_cat_zero_zero .bg_wrap .content_wrap .text-head,
  .pl_cat_light .bg_wrap .content_wrap .text-head,
  .pl_cat_three_zero .bg_wrap .content_wrap .text-head {
    top: 7rem !important;
  }
}