@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i");
@import url("https://fonts.googleapis.com/css?family=Oswald:200,300,400,500,600,700");

body {
  overflow-x: hidden;
  font-family: 'Raleway', sans-serif !important;
}

.dosis {
  font-family: 'Dosis', sans-serif !important;
}

:root {
  --main-color: #ededed;
  --accent-color: #ededed;
  --accent-color-lt: #ededed;
  --accent-color-dk: #ededed;
}

.nolist {
  list-style: none !important;
}

.hero-back {
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media screen and (max-width:750px) {
  .hero-main {
    background-size: 0 !important;
  }
}

.hero-badge {
  display: none;
}

@media screen and (min-width:1650px) {
  .green-round {
    border: 1px solid var(--main-color);
    border-radius: 25px;
  }

  .hero-badge {
    display: block;
  }
}

/* ////// TOKENIZED COLORS \\\\\\ */

/* TEXT & BORDERS */

.text-main {
  color: var(--main-color) !important;
}

.text-alt {
  color: var(--accent-color) !important;
}

.border-main {
  border-color: var(--main-color) !important;
  border-top: 4px solid;
}

.border-alt {
  border-color: var(--accent-color) !important;
}

.link-alt {
  text-decoration: none;
  color: var(--accent-color);
}

.link-main {
  text-decoration: none;
  color: var(--main-color);
}


/* BACKGROUNDS */

.bg-main {
  background: var(--main-color) !important;
  color: var(--main-color-txt) !important;
}

.bg-alt {
  background: var(--accent-color) !important;
  color: var(--accent-color-tx)
}

.bg-accent-light {
  background: var(--accent-color-lt) !important;
  color: var(--accent-color-lt-txt) !important;
  ;
}

.bg-accent-dark {
  background: var(--accent-color-dk) !important;
  color: var(--accent-color-dk-txt) !important;
}

/* BUTTONS */

.btn-main {
  background: var(--main-color) !important;
  border-color: var(--main-color) !important;
  color: var(--main-color-txt) !important;
}

.btn-alt {
  background: var(--accent-color) !important;
  border-color: var(--accent-color) !important;
  color: var(--accent-color-txt) !important;
}

.btn-main:hover {
  background: var(--accent-color-dk) !important;
}

.btn-alt:hover {
  background: var(--accent-color-dk) !important;
  color: var(--accent-color-dk-txt) !important;
}


/* ////// TOKENIZED COLORS END \\\\\\ */





.stick {
  position: fixed;
  top: 0;
  width: 100%
}

.sticky+.content {
  padding-top: 102px;
}

.prod-container {
  margin-top: -8.5rem !important;
}

.qty-btn {
  padding: 0 1.25rem;
  border: 1px solid;
  border-radius: 5px;
  font-size: 1.25rem;
  font-weight: bold;
  display: flex;
  align-items: center;
  height: 55px;
  cursor: pointer;
}

.pointer {
  cursor: pointer;
}

.qty-btn.decrease-btn {
  border-radius: 5px 0 0 5px;
}

.qty-btn.increase-btn {
  border-radius: 0 5px 5px 0px;
}

.qty-value {
  display: flex;
  align-items: center;
  border: 1px solid #000;
  padding: 1rem 2.25rem;
  font-weight: bold;
  height: 55px;
}


@media screen and (max-width:768px) {
  .heroMain {
    background-position-x: left !important;
    background-size: cover;
    background-repeat: no-repeat;
    color: #FFF !important;
  }

  .heroMain p {
    color: #FFF !important;
  }
}

.dot {
  height: 75px;
  width: 75px;
  border-radius: 50%;
  display: inline-block;
  padding: 1rem;
}

.hero-main {
  background-image: url(https://s3.amazonaws.com/subscribe-funnels-production/assets/16f29e66-b568-4be9-9f3f-9b2493c475bd/hero-overlay.png) !important;
  background-size: cover;
  background-position-x: center;
  background-position-y: center;
}

.flip {
  transform: scaleX(-1);
}

.thumb {
  max-width: 100px !important;
  max-height: inherit;
}

.section-02 {
  background-image: var(--hero-image) !important;
  background-size: cover;
  background-position-x: center;
  background-position-y: center;
}

.subHero {
  min-height: 250px !important;
  background-size: cover !important;
  background-repeat: no-repeat;
  background-position-x: top;
  background-position-y: center;
}

.heroImg {
  max-height: 480px;
}


.border-lg {
  border-width: 6px !important;
}


.bg-black {
  background-color: #000 !important;
}

.hidden {
  display: none;
}

.video-container {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.video-container::after {
  padding-top: 56.25%;
  display: block;
  content: '';
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.bg-universal {
  background-size: contain !important;
  background-position: center right !important;
  background-repeat: no-repeat !important;
  background-color: #000000 !important;
}

/********************** cart in nav ***************/
.dropdown-menu {
  font-size: 12px !important;
  text-transform: none;
}

.pre-header {
  color: #fff;
  background-color: #222529;
  font-family: Poppins, sans-serif;
  font-weight: 500;
  font-size: 1.3rem;
  line-height: 1.4;
  letter-spacing: .025em
}

.pre-header .container {
  display: block;
  text-align: center
}

.pre-header>div {
  position: relative;
  padding-top: 1.6rem;
  padding-bottom: 1.6rem
}

.pre-header small {
  font-size: 1.09996rem;
  font-weight: 400;
  opacity: .5
}

.pre-header .mfp-close {
  top: 50%;
  transform: translateY(-50%) rotateZ(45deg);
  color: inherit;
  opacity: .7
}

.top-links {
  display: inline-block;
  margin-top: 0;
  margin-bottom: 0;
  vertical-align: middle
}

.menu-item {
  float: left
}

.menu-item a {
  display: inline-block;
  padding: .5rem 1.2rem;
  line-height: 26px
}

.separator {
  height: 17.59px;
  border-color: #e7e7e7
}

.wel-msg {
  margin-right: .8rem
}

.share-links a {
  width: 30px;
  height: 30px;
  margin: 0 1px;
  overflow: hidden;
  border-radius: 30px;
  font-size: 1.38rem
}

.share-links a:not(:hover) {
  color: inherit;
  background-color: transparent
}

.sticky-header.fixed {
  top: 0;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  z-index: 1040;
  animation-duration: .4s;
  animation-name: fixedHeader
}

.header-middle .header-left,
.header-middle .header-right {
  flex: 1
}

.header-middle .header-right {
  justify-content: flex-end
}

.header-middle .header-left,
.header-middle .header-right,
.header-middle .header-center {
  padding: 1rem 0
}

.header-middle .header-center {
  padding-right: 1.5rem;
  padding-left: 1.5rem
}

.header-middle .cart-dropdown {
  max-height: 3.8rem;
  margin-left: 1.4rem;
  line-height: 3.8rem;
  color: var(--main-color)
}

.header-middle .search-toggle {
  display: inline-block;
  width: 40px;
  height: 40px;
  font-size: 2.1rem;
  line-height: 40px;
  text-align: center
}

.header-icon,
.header-icon i {
  display: inline-block;
  max-height: 2.7rem
}

.icon-magnifier::before {
  font-weight: 600
}

.login-link {
  margin-right: 1.6rem
}

.icon-wishlist-2::before,
.icon-user-2::before {
  margin-left: .27rem;
  margin-right: .27rem
}

.icon-shopping-cart::before {
  font-size: 2.7rem;
  line-height: 1
}

.dropdown-toggle,
.icon-shopping-cart {
  display: inline-flex;
  align-items: center
}

.dropdown-arrow .badge-circle {
  top: .1rem
}

.dropdown-arrow::after {
  margin: 0;
  margin-left: 1.5rem;
  font-size: 1.7rem;
  display: none;
}

.header-contact i {
  display: inline-block;
  margin-right: .6rem;
  line-height: 1
}

.header-contact h6 {
  font-weight: 600;
  font-size: 1.1rem;
  line-height: 1.2
}

.header-contact a {
  margin-top: .3rem;
  font-weight: 700;
  font-size: 1.8rem;
  line-height: .9
}

.qtyButton {
  background: none;
  border: none;
}

.question {
  top: .5rem;
  right: .5rem;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

@media screen and (max-width:768px) {
  .heroImg {
    max-height: 275px;
  }
}

.card-img-top {
  object-fit: cover;
}

.bar {
  height: 2px;
  width: 165px;
  /*   background: #d4c0f4; */
  margin: 20px auto 30px;
  position: relative;
  border-radius: 50%;
}

.bar::before {
  content: '';
  position: absolute;
  left: 0;
  top: -3px;
  height: 8px;
  width: 8px;
  border-radius: 50%;
  background: var(--main-color);
  -webkit-animation-duration: 4s;
  animation-duration: 4s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-name: MOVE-BG;
  animation-name: MOVE-BG;
}

.accordion-button::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-plus-circle-dotted' viewBox='0 0 16 16'%3E%3Cpath d='M8 0c-.176 0-.35.006-.523.017l.064.998a7.117 7.117 0 0 1 .918 0l.064-.998A8.113 8.113 0 0 0 8 0zM6.44.152c-.346.069-.684.16-1.012.27l.321.948c.287-.098.582-.177.884-.237L6.44.153zm4.132.271a7.946 7.946 0 0 0-1.011-.27l-.194.98c.302.06.597.14.884.237l.321-.947zm1.873.925a8 8 0 0 0-.906-.524l-.443.896c.275.136.54.29.793.459l.556-.831zM4.46.824c-.314.155-.616.33-.905.524l.556.83a7.07 7.07 0 0 1 .793-.458L4.46.824zM2.725 1.985c-.262.23-.51.478-.74.74l.752.66c.202-.23.418-.446.648-.648l-.66-.752zm11.29.74a8.058 8.058 0 0 0-.74-.74l-.66.752c.23.202.447.418.648.648l.752-.66zm1.161 1.735a7.98 7.98 0 0 0-.524-.905l-.83.556c.169.253.322.518.458.793l.896-.443zM1.348 3.555c-.194.289-.37.591-.524.906l.896.443c.136-.275.29-.54.459-.793l-.831-.556zM.423 5.428a7.945 7.945 0 0 0-.27 1.011l.98.194c.06-.302.14-.597.237-.884l-.947-.321zM15.848 6.44a7.943 7.943 0 0 0-.27-1.012l-.948.321c.098.287.177.582.237.884l.98-.194zM.017 7.477a8.113 8.113 0 0 0 0 1.046l.998-.064a7.117 7.117 0 0 1 0-.918l-.998-.064zM16 8a8.1 8.1 0 0 0-.017-.523l-.998.064a7.11 7.11 0 0 1 0 .918l.998.064A8.1 8.1 0 0 0 16 8zM.152 9.56c.069.346.16.684.27 1.012l.948-.321a6.944 6.944 0 0 1-.237-.884l-.98.194zm15.425 1.012c.112-.328.202-.666.27-1.011l-.98-.194c-.06.302-.14.597-.237.884l.947.321zM.824 11.54a8 8 0 0 0 .524.905l.83-.556a6.999 6.999 0 0 1-.458-.793l-.896.443zm13.828.905c.194-.289.37-.591.524-.906l-.896-.443c-.136.275-.29.54-.459.793l.831.556zm-12.667.83c.23.262.478.51.74.74l.66-.752a7.047 7.047 0 0 1-.648-.648l-.752.66zm11.29.74c.262-.23.51-.478.74-.74l-.752-.66c-.201.23-.418.447-.648.648l.66.752zm-1.735 1.161c.314-.155.616-.33.905-.524l-.556-.83a7.07 7.07 0 0 1-.793.458l.443.896zm-7.985-.524c.289.194.591.37.906.524l.443-.896a6.998 6.998 0 0 1-.793-.459l-.556.831zm1.873.925c.328.112.666.202 1.011.27l.194-.98a6.953 6.953 0 0 1-.884-.237l-.321.947zm4.132.271a7.944 7.944 0 0 0 1.012-.27l-.321-.948a6.954 6.954 0 0 1-.884.237l.194.98zm-2.083.135a8.1 8.1 0 0 0 1.046 0l-.064-.998a7.11 7.11 0 0 1-.918 0l-.064.998zM8.5 4.5a.5.5 0 0 0-1 0v3h-3a.5.5 0 0 0 0 1h3v3a.5.5 0 0 0 1 0v-3h3a.5.5 0 0 0 0-1h-3v-3z'/%3E%3C/svg%3E") !important;
}

.accordion-button:not(.collapsed) {
  background-color: #fff !important;
  color: var(--main-color);
}

.accordion-button:focus {
  z-index: 3;
  border-color: none;
  outline: 0;
  box-shadow: none;
}

@-webkit-keyframes MOVE-BG {
  from {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  to {
    -webkit-transform: translateX(163px);
    transform: translateX(163px);
  }
}

@keyframes MOVE-BG {
  from {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  to {
    -webkit-transform: translateX(163px);
    transform: translateX(163px);
  }
}

.cartNumber {
  font-size: 15px;
  line-height: 18px;
  min-width: 18px;
  text-align: center;
}

/*SCROLL TO TOP*/
.scrollup i {
  width: 50px;
  height: 50px;
  position: fixed;
  bottom: 75px;
  right: 15px;
  display: none;
  background-image: linear-gradient(to top, #02643e, #02643e);
  z-index: 99;
  color: #fff;
  border-radius: 50%;
  padding-top: 12px !important;
}

.scrollup i:hover {
  background-image: linear-gradient(to top, #02643e, #02643e);
}

.screen-reader-text {
  display: none;
}

.cross-cart {
  cursor: pointer;
}

@media screen and (min-width:768px) {
  li.nav-item {
    margin-left: 1rem;
  }
}

.btn-alt:hover {
  background-image: linear-gradient(rgb(0 0 0/30%) 0 0) !important;
  transition: 0.2s ease-in !important;
}

@media screen and (min-width:992px) {
  .hero-main {
    height: 75vh;
  }
}

.footer-nav-item {
  color: inherit;
}

.footer-nav-item:hover {
  opacity: 0.75;
  color: inherit;
}