.hero-wrapwmnjogger  {
  padding: 4rem 0;
}

.hero-threeonesimpleroutine  {
  padding: 4rem 0;
}

.hero-titlewmnjogger {
  font-weight: 600;
  line-height: 1.1;
  font-size: 3.2rem;
  margin-bottom: .5rem; margin-top: 1.5rem;
  color: #000000;
}

.hero-subtitlewmnjogger  {
  font-weight: 300;
  font-size: 2.5rem;
  line-height: 1.3;
  color: #000000;
  margin-bottom: 1.7rem;
}

.hero-copy {
  max-width: 520px;
  font-size: 1.45rem;
  line-height: 1.95rem; 
  color: #000000;
  margin-bottom: 1.2rem;
}

.hero-threeproducts {
  font-weight: 600;
  line-height: 1.1;
  font-size: 3.2rem;
  margin-bottom: .3rem; margin-top: 0.3rem;
  color: #000000;
}

.ddpsystem {
  font-weight: 600;
  line-height: 2.8rem;
  font-size: 2.75rem; letter-spacing: -0.07rem;
  margin-bottom: 0.25rem; margin-top: 0.3rem; float: right;
  color: #000000; margin-right: 2.0rem;
}

.hero-better {
  font-weight: 600;
  line-height: 1.1;
  font-size: 3.2rem;
  margin-bottom: .3rem; margin-top: 0.3rem;
  color: #000000;
}

.hero-betterenergy {
  line-height: 1.4;
  font-size: 1.4rem;
  margin-bottom: 0.95rem; margin-top: 0.3rem;
  color: #000000;
}

.hero-dailyroutine {
  line-height: 1.2;
  font-size: 1.2rem;
  margin-bottom: 0.95rem; margin-top: 0.3rem;
  color: #000000;
}	

.hero-dailyroutine strong{
  font-weight: 600;
}	

.threeprod {text-align: right; margin-bottom: 10px}

.foursecondsolution	{padding: 35px 15px 20px 0px;}
.xilerateallnatural {padding: 25px 15px 0px 0px}

.hero-copy strong { font-weight: 800; }
.wmnjoggerx {padding: 20px; margin-left: 40px}

.realstories {font-weight: 600; font-size: 2.9rem; line-height: 1.3;}
.customerssay {font-weight: 600; font-size: 2.9rem; line-height: 1.3; margin-top: 30px; margin-bottom: 0px}

.communityheart {float: right; max-width: 340px; font-size: 1.35rem; line-height: 1.95rem; color: #000000; margin-bottom: 1.2rem; margin-right: 0.4rem;}
.txtcenter {text-align: center}
.ourpromise {font-weight: 500; font-size: 1.8rem; line-height: 1.3; color: #000000; margin-bottom: 0.2rem; margin-top: 1.4rem}

.hdgwellness {font-size: 1.5rem; margin-bottom: 0.45rem}

.wellnesshding {font-size: 3.65rem; margin-bottom: 1.55rem; font-weight: 700; color: #000 !important;}
.wellnesshdingtxt {font-size: 1.75rem; margin-bottom: 1.55rem; color: #000 !important;}
.tprodbtn {text-align: center}

.threeprodtxt {text-align: left; float: right; max-width: 420px;}

.bettertxt {text-align: left; float: left;}

.easytotake {font-size: 1.5rem; margin-bottom: 0.85rem; line-height: 1.65rem}
.zerosugar {font-size: 1.5rem; margin-bottom: 1.15rem; line-height: 2.05rem}
.foursecond {font-size: 1.9rem; margin-bottom: 1.15rem; line-height: 2.05rem}

.easytotakediv {max-width: 374px}

.cta--testi .cta__inner2 {
    margin: 0 0 24px;
}
.cta__inner2 {
    padding: 0 30px;
}

.pad2 {
    padding: 0px 0;
}

.pad--lg2 {
    padding: 60px 0;
}

.pad--lg3 {
    padding: 20px 0;
}

.learnmore-btn {
  display: inline-block;
  background-color: #e9c272;
  color: #000;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: .03em;
  padding: 0.7rem 2.5rem;
  border-radius: 999px;
  text-decoration: none; max-width: 220px; margin: auto;
  transition: background-color .2s ease, transform .15s ease;
}
.learnmore-btn:hover { background-color: #efc060; transform: translateY(-2px); }
.learnmore-btn:active { transform: translateY(0);}

.shop-now-btn {
  display: inline-block;
  background-color: #284a53;
  color: #fff;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 1.55rem;
  letter-spacing: .03em;
  padding: 0.6rem 3.1rem;
  border-radius: 999px;
  text-decoration: none;
  transition: background-color .2s ease, transform .15s ease;
}
.shop-now-btn:hover { background-color: #0d5467; transform: translateY(-2px); }
.shop-now-btn:active { transform: translateY(0);}


.shopxlbtn {
  display: inline-block;
  background-color: #284a53;
  color: #fff;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 1.95rem;
  letter-spacing: .03em;
  padding: 0.6rem 2.4rem;
  border-radius: 999px;
  text-decoration: none;
  transition: background-color .2s ease, transform .15s ease;
}
.shopxlbtn:hover { background-color: #0d5467; transform: translateY(-2px); }
.shopxlbtn:active { transform: translateY(0);}	

.shopxllargebtn {
  display: inline-block;
  background-color: #284a53;
  color: #fff;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 1.95rem;
  letter-spacing: .03em;
  padding: 0.8rem 3.2rem;
  border-radius: 999px;
  text-decoration: none;
  transition: background-color .2s ease, transform .15s ease;
}
.shopxllargebtn:hover { background-color: #0d5467; transform: translateY(-2px); }
.shopxllargebtn:active { transform: translateY(0);}	

.guarantee-badge {
  position: absolute;
  bottom: -30px;
  left: 510px;
  max-width: 200px;
  z-index: 2;
}

.col-lg-6.position-relative {
  position: relative;
}

.brmobx {}

.get-social {
    margin: 0 0 50px
}

.get-social img {
    max-width: 650px;
    margin: 0 auto;
    display: block
}

@media only screen and (max-width: 991px) {
    .get-social img {
        max-width: 100%
    }
}

.get-social h2 {
    font-weight: bold;
    text-shadow: 0 10px 10px rgba(0, 0, 0, .2);
    text-transform: uppercase;
    margin: 0;
    position: relative;
    z-index: 1;
    font-size: 4rem
}

@media only screen and (max-width: 991px) {
    .get-social h2 {
        font-size: 2.3rem
    }
}

.get-social h2:first-child {
    margin-bottom: -80px
}

@media only screen and (max-width: 991px) {
    .get-social h2:first-child {
        margin-bottom: -20px
    }
}

.get-social h2:last-child {
    text-align: right;
    margin-top: -35px
}


@media only screen and (max-width: 1120px) {
.guarantee-badge {
    position: absolute;
    bottom: -30px;
    left: 490px;
    max-width: 160px;
    z-index: 2;
}
}

@media only screen and (max-width: 991px) {
.get-social h2:last-child {margin-top: -20px}
.ddpsystem {float: none; margin: auto}
.foursecondsolution	{padding: 35px 15px 40px 0px; margin-left: 120px;}
.xilerateallnatural {padding: 25px 15px 0px 0px}
.easytotakediv {max-width: 374px; margin: auto;}
.hero-copy {max-width: 100%; text-align: center;}
.hero-titlewmnjogger,  .hero-subtitlewmnjogger {text-align: center}
.joggerimg {text-align: center}	
.guarantee-badge {display: none;}
.wmnjoggerx {padding: 20px 0 5px 0px;  margin-left: 0px;}
.shopmlct {text-align: center;}
.guarantee-badgemobile {display: block !important; margin: auto; max-width: 140px; margin-top: 42px}
}

@media only screen and (max-width: 780px) {
.foursecondsolution {display: none;}
.foursecondsolutionmobile {display: block !important; margin: auto; margin-bottom: 30px; margin-top: 25px;}		
.easytotakediv {max-width: 374px; margin: auto;}
.shopcntr {text-align: center}
.cslider--left .carrow {bottom: -60px; right: 80px !important;}	
.cslider .carrow--next {left: auto !important; right: calc(1% + 5px) !important}
.communityheart {float: none; margin: auto}	
.realstories {font-size: 2.7rem;}
.customerssay {font-size: 2.7rem; margin-top: 4px}
.testi.cslider .carrow--next {right: auto !important; left: calc(50% + 6px) !important;}
.hero-copy {font-size: 1.30rem;}
}

.gold-card {
    border-radius: 20px;
    overflow: hidden;
    text-align: center;
    max-width: 340px;
    margin: 0 auto;
    height: 100%;
}

.gold-card h5 {
    font-weight: bold
}

.gold-card p {
    font-size: 1.05rem
}

.gold-card p:last-child {
    margin: 0
}

.gold-card__content {
  padding: 20px 25px;
  background-image: linear-gradient(to right, #fff5e4, #e9c272);
  margin-top: 10px;	
  min-height: 180px;	
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
}

.gold-card__content p {
    font-size: 1.25rem;
}

.docpr {padding-right: 10px; padding-bottom: 65px;}
.docpl {padding-left: 10px; padding-bottom: 65px}

.doc {
    display: flex;
    border-radius: 122px 25px 25px 122px;
    align-items: center;
    margin: 0 0 20px 0;
}

.doc--invert {
    flex-direction: row-reverse;
    text-align: left;
    border-radius: 25px 122px 122px 25px
}

.testi3__item {
    box-shadow: 0 10px 10px rgba(0, 0, 0, .1);
    border-radius: 15px;
    overflow: hidden;
    padding: 20px;
    background-color: #fff;
    height: 100%;
}

.testi3 h4 {
    position: relative;
    background: url(../images/quote.png) no-repeat left center;
    background-size: auto 100%;
    font-weight: bold;
    padding: 6px 0 6px 54px; padding-left: 50px !important;
    margin: 0 0 15px;
}

@media only screen and (max-width: 991px) {
.doc--invert {text-align: center}
.docpr {padding-right: 0px; padding-bottom: 5px}
.docpl {padding-left: 0px; padding-bottom: 5px}
.wellnesshding {
    font-size: 3.05rem;
    margin-bottom: 1.55rem;
    font-weight: 600;
    color: #000 !important;}
.testi3 h4 {padding-left: 0px !important}	
}

@media only screen and (max-width: 991px) {
    .doc {
        border-radius: 20px;
        display: block;
        text-align: center;
        padding-top: 20px
    }
}

.doc img {
    max-width: 210px
}

@media only screen and (max-width: 991px) {
    .doc img {
        margin: auto
    }
}

.doc>div {
    flex: 1;
    padding: 30px 20px
}

.doc>div p {
    margin: 0 0 5px;
    font-weight: 400;
    font-size: 1.35rem
}

.yellow-gradient {
    background: url(../images/yellowwhiteyellowbg.png) repeat-y center center;
    background-size: 100% auto;
}

.banner {
  max-width: 1200px;
  margin: 0 auto; 
}

.banner .container {
  max-width: 1200px;
}

.banner__slider {
  width: 100%;
aspect-ratio: 1200 / 537; 
}

.banner__inner {
  position: relative;
  width: 100%;
  max-width: 1200px; 
  aspect-ratio: 1200 / 537; 
  min-height: 537px; 
  margin: 0 auto;
  overflow: hidden;
}

.banner__inner > a,
.banner__inner > a > img {
  display: block;
  width: 100%;
  height: 100%;
}

@supports not (aspect-ratio: 1) {
  .banner__inner::before {
    content: "";
    display: block;
    padding-top: calc(537 / 1200 * 100%);
  }
  .banner__inner > a > img {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
  }
}

@media (max-width: 1199.98px) {
  .banner__inner {
    height: auto; 
    aspect-ratio: 1200 / 537; 
  height: auto !important;
  min-height: auto !important;
  }
.banner__inner > a,
.banner__inner > a > img {
  display: block;
  width: 100%;
  height: auto !important;
  min-height: auto !important;	
}	
}

.cslider2 .carrow {
margin-bottom: -82px;
}

@media (max-width: 702px) {
.cslider2 .carrow {margin-bottom: 0px;}}