/*color*/
/*color*/
:root {
  --primary-color: #004081;
  --secondary-color:#4EB7F2;
  --default-color:#4F4F4F;
  --light-grey:#F2F4F4;
  --light-blue:#CEE6F2;

}

*,
*::before,
*::after {
  box-sizing: border-box; }

@-ms-viewport {
  width: device-width;
}

article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
  display:block; }

body{
	font-family: 'Open Sans', sans-serif;
	color: var(--default-color);
	font-size: 16px;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -ms-overflow-style: scrollbar;
  -webkit-tap-highlight-color: transparent;
  background-color: white;

}
h1,h2,h3,h4,h5,h6{
	font-family: 'SourceSerifPro-Bold';
  font-weight:bold;
	color: var(--primary-color);
}
a{
  font-family: 'Open Sans', sans-serif;
	color: var(--primary-color);
	transition: 0.3s;
}
a:hover{
	text-decoration: none;
	color: var(--secondary-color);
}

#menu-link a:active{
	text-decoration:underline;
	color: var(--secondary-color);
}

ul{
  font-family: 'Open Sans', sans-serif;
	margin: 0;
	padding: 0;
}
li{
  font-family: 'Open Sans', sans-serif;
	list-style: none;

}

p{
  font-family: 'Open Sans', sans-serif;
  line-height: 2em !important;
}

.modal-title{
justify-content: center;
font-size: 24px;
}
.modal-btn{
  padding:10px !important;
  margin-left: auto !important;
  margin-right: auto;
}
.center-all {
  position: absolute;
  left: 50%;
  top: 80%;
  transform: translate(-50%, -50%);
}


.search-trigger,
.cart {
    position:relative;
    z-index: 777;

}
.navbar-icons{
  display:flex;
  position:relative;
  left:80%;
}


.pull-right{
  margin-right: 5%;
}

.search-trigger {
	cursor: pointer;
	width:10px;
	height:auto;
	opacity:1;
  margin-right:20px;
	transition: all .32s ease-in-out;
	-webkit-transition: all .32s ease-in-out;
	-moz-transition: all .32s ease-in-out;
	-o-transition: all .32s ease-in-out;
}

.search-trigger:hover {
	opacity:0.6;
	transition: all .32s ease-in-out;
	-webkit-transition: all .32s ease-in-out;
	-moz-transition: all .32s ease-in-out;
	-o-transition: all .32s ease-in-out;
}

.cart {
	cursor: pointer;
	width:10px;
	height:auto;
	opacity:1;
  margin-right:20px;
	transition: all .32s ease-in-out;
	-webkit-transition: all .32s ease-in-out;
	-moz-transition: all .32s ease-in-out;
	-o-transition: all .32s ease-in-out;
}

.cart:hover {
	opacity:0.6;
	transition: all .32s ease-in-out;
	-webkit-transition: all .32s ease-in-out;
	-moz-transition: all .32s ease-in-out;
	-o-transition: all .32s ease-in-out;
}

.pull-right {
	width: 100% !important;
	max-width:20px;

}

.subscibe-input{
  margin-top:15px;
  border: none;
  border-bottom: 1px solid var(--secondary-color);
  width: 100%;
  margin-left: 10px;
}

.dropdown-menu{
  top:50px;
  left:-15px;
  height:auto;
  padding:10px 10px;
  border:none;
  box-shadow: 0px 5px 8px -5px rgba(0, 0, 0, 0.8);
  width:350px;

}
.dropdown-menu hr{
  padding-bottom:10px;
}

.menu{
  position: relative;
  display:flex !important;
  padding-top:15px;
  padding-bottom: 0px;
  padding-left:0;



}
.menu-links{
  padding-bottom: 20px;
  margin:0;


}
.links {
  width:auto;
  padding:2px;

}
.links a{
  font-size:14px;

}
.links-2 {
  width:auto;
  padding:5px;
  width:200px;
  max-width:100%;

}

.li-link a{
  color:var(--default-color);
}


a:hover{
  color:var(--secondary-color);
}
.nav-link{
  color:var(--default-color) !important;
  text-transform: uppercase;
  letter-spacing:2px;
  font-size:14px;

}

.navbar-light .navbar-nav .nav-link{
  color:var(--primary-color);

}


.navbar-nav > li{
  color:var(--primary-color);

}

.navbar-light .navbar-toggler{
    border:0px;

}



.subscribe-btn{
  background-color:var(--secondary-color);
  color:white;
  padding:5px 20px 5px 20px;
  border: none;
  border-radius: 20px;
  margin-top:20px;
  margin-left: 10px;
  text-transform: uppercase;
}
.header .search , .header .cart{
    position: relative;
    z-index: 777;
}


.bg-content h1, .explore-content h1, .liposomal-content h1{
  font-size:40px;

}
.bg-content p, .explore-content p{
  padding-top:20px;
  font-size:16px;
  line-height:30px;
  width:50%;
  margin-left:auto;
  margin-right: auto;

}
  .bg-content button,.explore-content  button, .liposomal-content  button{
     padding:5px 20px 5px 20px;
     border: none;
     border-radius: 30px;
     text-align: center;
     display: block;
     margin-left:auto;
     margin-right: auto;
  }

.liposomal-content p{
    padding-top:20px;
    font-size:16px;
    line-height:30px;
    width:80%;
    margin-left:auto;
    margin-right: auto;

  }
  .par-title{
    font-size:20px !important;
    color:var(--secondary-color);
    margin-bottom:-10px;
  }


.bg-content{
  position: relative;
  z-index: 1;
  top:50px;

}

.content-2{
  position: relative;
  top:-400px;
  margin-bottom: 150px;

}
.content-2 p {
  width:800px !important;
}

.lipo-import{
  position: relative;
  top:50px;
  padding-bottom: 600px;
}
.sup-import{
  position: relative;
  top:50px;
  padding-bottom: 350px;
}
.liposomal-content{
  position: relative;
  z-index: 1;
  padding-bottom:100px;
  margin-top:90px;

}

.lipo-header{
  top:50px;
  position: relative;
}

.broad-header{
  text-transform:uppercase;
  font-size: 20px;
  padding-top:50px;
  color:white;
  letter-spacing: 5px;
}
.broad-content{
  padding-bottom::500px;
  position:relative;
  top:-600px;
}
.broad-flex{
  display: flex;
  padding-bottom: 30px;
  padding-top: 20px;
}
.line-flex p{
  font-size: 20px;
  color: white;
  line-height: 40px;

}
.vl {
  border-left: 1px solid white;
  height: 120px;
  top: 0;
  margin-left: 10px;
  margin-right: 30px;
}


.line-flex{
    display: flex;
}

.group-flex{
  display: flex;
  flex-direction: column;
  width:500px;
  margin-top: 60px;

}
.details-flex{
  display:flex;
  flex-direction: row;
  max-width: 100%;
}
.lipo-img{
  width:40%;
  max-width: 60%;
}
.lipo-title{
  color:var(--primary-color);
  font-size:18px;
}




hr.lipo{
  border-top: 1px solid var(--secondary-color);
}

hr.full {
  border-top: 1px solid var(--secondary-color);
  width:500px;
}
hr.innov {
  border-top: 1px solid var(--secondary-color);
  width:800px;
}

hr.solid {
  border-top: 1px solid var(--secondary-color);
  width:500px;
}
hr.product-line {
  border-top: 1px solid var(--secondary-color);
  width:100%;
}
hr.prop{
  border-top: 1px solid white;
  width:50%;
}


.card-product{
  width:100%;
  padding:20px;
  border:none;
  background-color:white;
  border-radius:6px;
  overflow: hidden;
}
.card-img{
  width:60px;
  height:auto;
  margin-top: 30px;

}
.column {
  float: left;
  width: 25%;
  padding: 0 10px;
}

.accordion{
   background-color: transparent;
   position:relative;
   left:200px;
   width:800px;
   padding-bottom:

}

.card-text{
  margin-top:20px;
  width:80%;
}

.prod-high{
  background-color:#F5F6F8;
  height:auto;
  width:100%;
  margin-bottom: 100px;
  position: relative;
  top:-500px;

}
.prod-content{
  padding:100px 0px 550px 0px;
}
.prod-content h2{
  padding:0px 0px 50px 0px;

}
.strat-content{
  padding:100px 0px 550px 0px;

}
.strat-content h2{
  padding:0px 0px 20px 0px;
  width:30%;
}
.arrow-indicator2{
  position: relative;
  top:-30px;
  display: flex;
  left:-10%;

}
.arrow-indicator2 a{
  padding: 0 20px 0 20px;
  left:95%;
  position: relative;
}

.arrow-indicator{
  position: relative;
  top:450px;
  display: flex;
  left:-10%;
}
.arrow-indicator a{
  padding: 0 20px 0 20px;
  left:95%;
  position: relative;
}
.prod-header{
  display:flex;
  justify-content: space-between;
}
.prod-header a{
  position:relative;
  top:20px;
  left:-20px;
  text-transform: uppercase;
}

.strat-section{
  height:auto;
  width:100%;
  margin-bottom:-400px;
  position: relative;
  top:-800px;


}

.card-2{
  max-width:100%;
  width:30%;
  padding:10px 10px 10px 10px;
  border:none;
  border-radius:6px;
  overflow: hidden;
  margin-right: 10px;

}

.card-2 h4{
  font-size: 18px;
  padding-top: 20px;
}

.card-2 p{
  color:var(--secondary-color);
  font-size:14px;

}

.card-1{
  max-width:100%;
  width:30%;
  padding:10px 10px 30px 10px;
  border:none;
  background-color:white;
  border-radius:6px;
  overflow: hidden;
  margin-right: 20px;
}
.card-1 h4{
  text-align: center;
  font-size: 20px;
  padding-top: 20px;
}

.card-1 p{
  color:var(--secondary-color);
  font-size:20px;
  text-align: center;
}
.card-1 button{
  max-width: 100%;
  padding:5px 15px 5px 15px;
  text-align: center;
  border: 2px solid ;
  color:white;
  background-color:var(--primary-color);
  font-size:14px;
  letter-spacing:0.1;
}


.card-1-img img{
  width:50px;
  position:relative;
  height:auto;
  display: block;
  margin-left:auto;
  margin-right: auto;
  width: 30%;
  bottom:20px;
  padding-top:10px;

}

.card-2-img img{
  width:50px;
  position:relative;
  height:auto;
  display: block;
  margin-left:auto;
  margin-right: auto;
  width: 30%;
  bottom:20px;
  padding-top:10px;

}
.card-list{
  display: flex;
}


.card-body2{
  width:100%;
}


.card-team{
  box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.02);
  height:auto;
  width:500px;
  max-width:100%;


}
.card-team img{
  width:100%;
  height:auto;
}



.download-layout{
  display: flex;
  flex-direction: row;
}
.file-layout{
  display:flex;
  flex-direction: row;
}


.download-img{
  width:50px;
  padding-top: 10px;
}

.download-content{
  padding-left:10px;
  padding-top:10px;
}
.download-details{
  margin-top: 40px;
  margin-left: 20px;

}

.download-icon{
  margin-top: 5px;
}
.down-icon{
  margin-right:10px;
  width:15px;
  filter:invert(99%) sepia(12%) saturate(244%) hue-rotate(281deg) brightness(120%) contrast(100%);
}

.download-icon label{
  color:white !important;
}


.download-details label{
  letter-spacing: 0.05em;
  color:var(--primary-color);
  text-transform: uppercase;
  font-size:16px;
}

.download-details p{
  font-size:14px;
}

.doc-group{

    display:flex;
    flex-direction: column;
    position:relative;
    max-width:100%;
    width:100%;

}

.team-pad{
  padding-top:30px;

}
.team-bot{
  padding-bottom:40px;
}


.ed-download{
  position: relative;
  top:20px;
  padding-bottom:500px;
}

.file-section{
  position:relative;
  top:-100px;
  padding-top:100px;
  padding-bottom: 50px;

}

.file-title{
  padding-top: 20px;
  padding-bottom:-500px;
}

.file-title h1{
  padding-bottom:50px;
}

.video-thumb{
  width: 100%;

}
.video-group{
  width:200%;
  margin-right: 20px;


}

.video-lib{
  width:120%;
}
.video-lib label{
  color:var(--primary-color);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-size:12px;
  padding-top: 20px;
}

.video-lib p{
  font-size:14px;

}
.v-divider{
  border-top: 1px solid var(--secondary-color);
  width:90%;
  position:relative;
  top:-350px;
  padding-bottom:250px;

}

.vid-section{
    padding-bottom:400px;
    position: relative;
    top:20px;
}
.vid-section h1{
  padding-bottom: 30px;
}

.video-section{
  position: relative;
  top:-500px;
}

.video-fluid{
  width: 50%;
  max-height:100%;


}
.video-fluid-small{
  width: 30%;
  max-height:100%;
  margin-right: 20px;
}


.video-layout{
  display:flex;
  flex-direction: row;
  padding-bottom:30px;

}
.video-content{
  padding-top:10px;
  position: relative;
  margin:80px;
}

.vid-title hr {
  border-top: 1px solid var(--secondary-color);
  width:500px;
}
.vid-text{
  margin-bottom: 20px;
}
.video-divider {
  border-top: 1px solid var(--secondary-color);
  width:90%;
  padding:20px;
  padding-bottom:40px;
}
.categories-drop{
  padding-bottom: 10px;
}

.page-link{
  color:var(--primary-color);
  border: none;
}

.faq-section{
      position: relative;
      top:30px;
      padding-bottom:600px;
}
.faq-divider {
  border-top: 1px solid var(--secondary-color);
  max-width:90%;
    padding:20px;
  position:relative;
  top:30px;
  padding-bottom:40px;

}

.ans-divider {
  border-top: 1px solid var(--secondary-color);
  max-width:90%;
  position:relative;
  top:50px;
  padding-bottom:80px;


}

.terms-section{
      position: relative;
      top:30px;
      margin:auto;

}

.terms-divider {
  border-top: 1px solid var(--secondary-color);
  width:90%;
  padding:20px;
  position:relative;
  top:90px;




}
.download-divider {
  border-top: 1px solid var(--secondary-color);
  width:90%;
  padding:20px 20px -20px 20px;
  position:relative;
  top:-80px;

}

.d-divider{
  border-top: 1px solid var(--secondary-color);
  width:90%;
  padding:20px 20px -20px 20px;
  position:relative;
  top:-30px;

}



.divider {
  border-top: 1px solid var(--secondary-color);
  width:90%;
  padding:20px;
  padding-bottom:40px;
}

.team-divider {
  border-top: 1px solid var(--secondary-color);
  width:90%;
  padding:-10px;
  padding-bottom:-10px;
}

.doc-divider {
  border-top: 1px solid var(--secondary-color);
  width:90%;
  padding:-100px;

}

.quality-divider {
  border-top: 1px solid var(--secondary-color);
  width:90%;
  padding:20px;
  padding-bottom:80px;
  position: relative;
  top:-500px;
}

.contact-divider {
  border-top: 1px solid var(--secondary-color);
  width:90%;
  padding:20px;
  padding-bottom:100px;
  position: relative;
  top:-500px;
}


.vid-list{
  padding-bottom:80px;

}

.layout{
  display:flex;
  flex-direction: row;
  position:relative;
  max-width:100%;
  width:900px;
}

.layout h1{
  margin-right:50px;
}
.quality-section{
  position:relative;
  z-index: -1;
  top:-90px;
}

.resources-section{
  position:relative;
  z-index: -1;
  top:20px;
  padding-bottom: 800px;

}

.who-section{
  position:relative;
  z-index: -1;
  top:20px;


}

.doc-section{
  position:relative;
  top:-10px;
  padding-bottom:550px;

}




.quality-section3{
  position:relative;
  z-index: -1;
  top:-50px;
  margin-top:-100px;
  margin-bottom: 500px;


}

.centered {
  font-size: 30px;
  position:absolute;
  top: -300px;
  left: 50%;
  transform: translate(-50%, -50%);
}


.practioner-section{
  display:inline-flex;
}




.div-practioner{
  border-top: 1px solid var(--secondary-color);
  width:100%;
}


.quality-content, .quality-content2{
  padding:150px 0px 80px 0px;

}

.resources-content{
  padding:50px 0px 90px 0px !important;


}
.resources-content p{
  color:var(--primary-color);
  opacity:60%;
}



.who-content p{
  opacity:60%;

}


.doc-content{
  padding:50px 0px 50px 0px;
}
.doc-content p{
  color:var(--primary-color);
  opacity:60%;
}

.promises-bg-center{
  background-color:#f1f9fc;
  padding-top:30px;
  padding-bottom: 30px;
}
.q-title{
  width:300px;
  max-width: 100%;
  font-size: 40px;
}
.p-center-icon{
  padding-top: 20px;
}
.title-icon{
  position: relative;
  top:-100px;
  padding-top: 100px;
}
.form-gray{
  background-color:#FAFAFA;

}
.form-blue{
  background-color:var(--secondary-color);

}
.form-section{
  background-color:rgba(227, 227, 227, 0.2);
  padding:50px 0px 50px 0px;

}
.download{
  padding:80px 0px 80px 0px;
}

.testimonial-section{
  background-image:url("https://images.unsplash.com/photo-1556820014-ef5686f957eb?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1051&q=80");
  background-repeat: no-repeat;
  background-attachment: fixed;
 background-size: cover;

}
#testimonial{
  color:#fff;
}

.quality-content2{
  background-color:var(--secondary-color);
  color:white;
  margin-bottom:50px;
  position: relative;
  top:-60px;
}
.quality-content2 h1{
  color:white;
}
.p-ic{
  margin-bottom:20px;
  width:50px;
}

.ic-svg{
  margin-bottom:20px;
  width:80px;
}
.quality-ic{
  width:15%;
  max-width:20%;
  padding-bottom:20px;
  margin:20px;
}


.ic-plus{
  margin:20px;
  width:20px;
}
.img-divider{
  width:100%;
  height:auto;
}

.q-details{
  color:var(--default-color);
}
.p-details{
  color:var(--default-color);
  color: rgba(0, 0, 0, 0.5);
}

.banner-img3{
  width: 1680px;
  height: 550px;
  max-width: 100% !important;
  }
.banner-img3 img{
  width: 1680px;
  overflow: hidden;
  position:absolute;
  background-size:cover;
  top: -20%;
}

.banner-img{
  width: 1680px;
  height: 550px;
  max-width: 100% !important;
  }
.banner-img img{
  width: 1680px;
  overflow: hidden;
  position:absolute;
  background-size:cover;
  top: -20%;
}
.ban-img{
  width: 1680px;
  overflow: hidden;
  position:absolute;
  background-size:cover;
  top: -45%  !important;

}

.banner-img2{
  width: 100%;
  height: 400px;
  max-width: 100% !important;

  }


.img-banner{
  width: 800%;
  max-width: 100% !important;
  overflow: hidden;
  position:absolute;
  background-size:cover;
  top: -20% !important;
}


.carousel-caption3{
   width:auto;
    z-index:2;
    text-align:right;
    top:50%;
    -webkit-transform:translate(0, -50%);
    -ms-transform:translate(0, -50%);
    transform:translate(-5%, 25%);
  }


.carousel-caption3 p{
  color:var(--primary-color)!important;
  font-size: 20px;
  letter-spacing: 5px;
  text-transform: uppercase;
}
.carousel-caption3 h1{
  font-size:40px;
  color:var(--primary-color)!important;
}



 .carousel-caption{
    width:auto;
     z-index:2;
     text-align:right;
     top:50%;
     -webkit-transform:translate(0, -50%);
     -ms-transform:translate(0, -50%);
     transform:translate(-5%, 25%);
   }


 .carousel-caption p{
   color:white;
   font-size: 20px;
   letter-spacing: 5px;
   text-transform: uppercase;
 }
 .carousel-caption h1{
   font-size:40px;
   color:white;
 }

 .carousel-flex{
   display: flex;
 }

 .v2 {
   border-left:2px solid var(--secondary-color);
   height: 80px;
   top: 0;
   margin-left: 10px;
   margin-right: 30px;
   z-index: 1;
 }
 .v3 {
   border-left:2px solid white;
   height: 80px;
   top: 0;
   margin-left: 10px;
   margin-right: 30px;
   z-index: 1;
 }
 .prop-img{
   width:100%;
   max-width: 100%;
   padding-top:20px;
 }



 .global-btn{
  background-color:var(--primary-color);
  color:white;
  padding:5px 20px 5px 20px;
  border: none;
  border-radius: 20px;
  text-transform: uppercase;
   -moz-column-fill: auto;
   font-size: 14px;
   letter-spacing:3px;

}
.shop-btn a{
    color:white;
}

 ol.carousel-indicators li,
ol.carousel-indicators li.active {
  width: 20px;
  height: 5px;
  margin: 2px;
  border-radius: 0;
  border: 0;
  background: white;
}


ol.carousel-indicators li.active {
  background: var(--secondary-color);
  opacity: 100%;
}

ol.carousel-indicators li{
  background: white;

}

.list-group{
    margin-left: 20px;
}

.p-list{
  list-style:none;
  padding-bottom: 10px;
  color:var(--default-color);
  line-height: 2em;
}
.p-list2{
  list-style:inherit;
  padding-bottom: 10px;
  list-style:none;
  width:100%;
  max-width: 100%;
  padding-left: 10px;
}
.list-indent{
  padding-left: 20px!important;

}

.p-list::before {

  /* \2022 is the CSS Code/unicode for a disc */
                content: "\2022";
                color: var(--secondary-color);
                display: inline-block;
                width: 1em;
                margin-left: -0.9em;
                font-weight: bold;
                font-size:1.2rem;

           }
           .p-list2::before {

             /* \2022 is the CSS Code/unicode for a disc */
                           content: "\2022";
                           color: var(--secondary-color);
                           display: inline-block;
                           width: 1em;
                           margin-left: -0.9em;
                           font-weight: bold;
                           font-size:1.2rem;

                      }

.prop-list{
  list-style: decimal;
  padding-bottom: 10px;
  color: var(--default-color);
  font-size: 16px;
}
.statement-text{
  padding-left:20px;
  padding-top:5px;
  margin-bottom: 5px;
}


.footer-title{
	font-size: 18px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	margin: 0 0 15px;
  color:var(--primary-color);
}

.footer-links li {
	font-size: 16px;
	line-height: 35px;
}

.footer-links li a {
	color: var(--default-color);
}

.footer-content{
  margin-top:-520px;
  margin-bottom:-80px;
  margin-left:-10px;
}

.link-cont{
  margin-top: 10px;
  -webkit-columns: 2 200px;
  -moz-columns: 2 200px;
  columns: 2 200px;
  -webkit-column-gap: 4em;
  -moz-column-gap: 4em;
  column-gap: 4em;

}
.social-icons{
  margin:5px;
}


.nav-icons{
  padding:10px;
}

/*Loader Css start*/
.pa-preloader {
	background-color: #fff;
	bottom: 0;
	height: 100%;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 9999;
}
.pa-ellipsis {
	margin: 0 auto;
	position: relative;
	top: 50%;
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 64px;
	text-align: center;
	z-index: 9999;
}
.pa-ellipsis span {
	display: inline-block;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: var(--secondary-color);
	-webkit-animation: ball-pulse-sync 1s 0s infinite ease-in-out;
	animation: ball-pulse-sync 1s 0s infinite ease-in-out;
}
.pa-ellipsis span:nth-child(1) {
	-webkit-animation:ball-pulse-sync 1s -.14s infinite ease-in-out;
	animation:ball-pulse-sync 1s -.14s infinite ease-in-out
}
.pa-ellipsis span:nth-child(2) {
	-webkit-animation:ball-pulse-sync 1s -70ms infinite ease-in-out;
	animation:ball-pulse-sync 1s -70ms infinite ease-in-out
}
@-webkit-keyframes ball-pulse-sync {
	33% {
		-webkit-transform:translateY(10px);
		transform:translateY(10px)
 }
	66% {
		-webkit-transform:translateY(-10px);
		transform:translateY(-10px)
	}
	100% {
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
}
@keyframes ball-pulse-sync {
	33% {
		-webkit-transform:translateY(10px);
		transform:translateY(10px)
	}
	66% {
		-webkit-transform:translateY(-10px);
		transform:translateY(-10px)
	}
	100% {
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
}
/*Loader Css end*/



/* feature start */
.pa-feature ul li svg {
    width: 30px;
    fill: #6caaa8;
}
.pa-feature ul {
    text-align: center;
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.07);
    padding: 20px 50px 20px;
    border-radius: 10px;
    margin-top: -90px;
    margin-bottom: -600px;
    background: #fff;

}

.pa-feature ul li {
    display: inline-block;
    width: 30%;
    margin:10px;
    border-right: 1px solid #eee;
    vertical-align: top;
    text-align: left;
}

.pa-feature:after {
      content: "";
      display: table;
      clear: both;
   }


.feature-title{
    font-family: 'Open Sans', sans-serif;
    text-transform: uppercase;
    font-weight: bold;
    font-size:18px;
    letter-spacing: 0.1em;

}

.card-hover:hover, .card-hover:hover h4, .card-hover:hover p, .card-hover:hover h2{
    background: var(--secondary-color);
    color:white;

}

.card-content{
  padding:20px;

}


@keyframes pa_blink{
    0%{
        transform: scale(0.9)
    }
    50%{
        transform: scale(1.2)
    }
    100%{
        transform: scale(1)
    }
}

.products{
  width:100%;
  max-width: 100%;
}
.product-card{
  width:80%;
  max-width:100%;
  position:relative;
  display:flex;
  overflow: hidden;
  left:50%;
  transform: translate(-50%,20%);
}

.card-responsive{
  display:flex;
  height:250px;
  max-height:50%;
  width:50%;
  max-width: 100%;

}

.card-responsive img{
  height:20%;
  max-height:50%;
  margin: 60px 20px 20px 40px;
}

.arrow-icon{
  width:30px !important;
  max-width:100%;
  position: relative;
  top:-100px;
  left:280px;
  margin-left: 60px;

}

.breadcrumb{
  background-color:transparent !important;
  padding-bottom: 20px;
}

.card-details{
  width:100%;
  margin-top:40px;
  padding-right:30px;

}

.card-details p{
  font-size:16px;
  line-height: 28px;
}
.card-group{
  width:800px;
  position:relative;
  box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.10);
  overflow: hidden;
  border-radius:4px;
  z-index:1;

}
.card{
  width:100%;
  padding:30px 20px;
  border:none;
  background-color:white;
  overflow: hidden;
  padding-bottom:20px;

}

.card-explore{
  width:100%;
  padding:10px;
  border:none;
  background-color:white;
  border-radius:6px;
  overflow: hidden;
  z-index:1;
}



.card-high{
  margin:0px 50px 0px 0px;

}

.prod-amount{
  font-size:28px;
  color:var(--secondary-color);
}



.carousel-caption button{
   padding:10px 30px 10px 30px;
   border: none;
   border-radius: 30px;
   text-align: center;
}


    .faq-contents{
      width:100%;
      display:flex;
      flex-direction: row;
      margin-bottom: -40px;

    }

    .faq-contents img{
      position:relative;
      top:-15px;
    }
    .ans{
      width:600px;
      position:relative;
      left:90px;
    }

    .btn-link{
      color: var(--primary-color);

    }

    .card-header{
      background-color: transparent!important;
      border:none;

    }

    .faq-contents h5{
        font-size:16px;
        color:var(--primary-color);
    }

    .faq-contents p{
        font-size:10px;
        margin-left:80px;
    }


    .form-control{
      border:none;

    }

    .contact-section h5, .contact-form  h5{

      text-transform: uppercase;
      letter-spacing: 4px;
    }


.contact-layout{
  display:flex;
  flex-direction: row;
  justify-content: space-between;
}


.contact-details{
  width:500px;

}
.icon-flex{
  display: flex;
}

.bg {
  width:60%;
  max-width: 100% !important;
  position: relative;
  top:120px;
  left:250px;
  margin-bottom:500px;
  transform: translate(-50% 50%);

  }
.bg img{
  width: 60%;
  overflow: hidden;
  position:relative;
  top:-40px;
  left:250px;
  margin: 20px;

}

.bg-practioner {
  background-color: #F4F5F7;
  width: 1680px;
  height: 300px;
  max-height: 100%;
  max-width: 100% !important;
  position: relative;
  top:-790px;

  }

  .bg-bio {
    margin-top:-50px;
    max-height: 100%;
    position: relative;
    }
    .bio-img{
      max-height: 100%;
      max-width: 100% !important;
      overflow: hidden;
      position:relative;
      object-fit:cover;

    }

  .quality-bg {
    background-color:#E7ECEF;
    width: 100%;
    height: 600px;
    max-width: 100% !important;
    position: relative;
    top:-150px;

    }
  .quality-bg img{
    width: 1680px;
    height:600px;
    max-width: 100% !important;
    overflow: hidden;
    position:relative;
    object-fit:cover;
    object-position: 80% 60%;
  }

  .quality-banner{
    position:relative;
    z-index:1;
    top:120px;
    max-width:100%;
    width:900px;

  }

  .quality-banner h1{
    font-size:40px;

  }

  .banner-section{
    height:650px;


  }


.practioner-img{
  width: 1680px;
  height:500px;
  max-width: 100% !important;
  overflow: hidden;
  position:relative;
  object-fit:cover;
  object-position: 80% 30%;
}

.practioner-content{
  position: relative;
  width:40%;
  max-width: 80%;
   z-index:1;
   top:-450px;
   left:-5px;
   transform: translate(-50% 50%);
   -webkit-transform:translate(0, -25%);
   -ms-transform:translate(0, -100%);
   transform:translate(0, -5%);


}

.practioner-content h1{
  color:white;
  font-family: 'Open Sans', sans-serif;
  text-transform:uppercase;
  letter-spacing: 5px;
  font-size: 30px;
}
.practioner-content hr{
  width:100%;

}
.practioner-content p{
  font-weight: normal;
  color:white;
  font-size: 24px;
}
.practioner-content a{
font-weight: normal;
  color:white;
  font-size: 18px;
  text-transform: capitalize;
}

.practioner-content button{
padding:5px 10px 5px 10px;
position:relative;
left:260px;
}
.product-range{
  width:1680px;
  max-width: 100%;
  position:relative;
  top:-510px;
  margin-bottom:100px;

}

.guide-container{
  width:1680px;
  max-width: 100%;
  position:relative;
  top:-10px;
  margin-bottom:200px;
}

.practioner-container{
  width:1680px;
  max-width: 100%;
  position:relative;
  top:-10px;
  margin-bottom:-600px;
}
.i-divider{
  background-color: #F4F5F7;
  width: 1680px;
  height: 500px;
  max-width: 100% !important;
  position: relative;
  top:-30px;
  margin-bottom: -80px;
}

.img-divider{
  width: 1680px;
  height:500px;
  max-width: 100% !important;
  overflow: hidden;
  position:relative;
  object-fit:cover;
  object-position: 80% 30%;

}

.r-divider{
  background-color: #F4F5F7;
  width: 1680px;
  height: 200px;
  max-width: 100% !important;
  position: relative;
  top:-900px;

}


.resources-divider{
  width: 1680px;
  height:300px;
  max-width: 100% !important;
  overflow: hidden;
  position:relative;
  object-fit:cover;
  object-position: 80% 50%;

}
.testimony-content{
  position: relative;
  top:-700px;
  z-index: 1;
  display: flex;
  justify-content: space-between;

}

.testimony-content img{
    width:15%;
    max-width: 50%;

}
.testimony-content p{
    width:400px;
    margin-right: 200px;
}

.props-section{
  position: relative;
  top:700px;
  margin-top: 40px;
  margin-bottom: 80px;
}
.prop-benefits{
  position: relative;
  top:-650px;
  z-index: 1;
}

.prop-benefits img{
    width:15%;
    max-width: 50%;

}
.prop-benefits p{
  color:white;
  font-size: 20px;
}
.prop-benefits h3{
  color:white;
  font-size: 35px;
}

.statement-box{
  border:1px;
  border-style:solid;
  border-color:var(--default-color);

}

.f-title{
  margin-top:-10px;
}
.statement-filled{
  background-color:var(--secondary-color);
  margin-top: 20px;
  padding: 5px;
}

.statement-filled p{
  color:white;
  opacity: 100%;
}
.statement-filled h3{
  color:white;
}

.s-title{
  font-size: 20px;
  padding-top: -10px;
  margin-bottom: -10px;

}

.contact-section{
    padding-bottom:200px;
    position: relative;
    top:20px;
    padding-bottom:600px;
}
.contact-form-label{
  text-transform: uppercase;
  color:var(--primary-color);
  letter-spacing:0.2em;
  padding-bottom: 20px;
}


.form-flex{
  display:flex;

}

.message-form{
    border-bottom: 0.5px solid var(--secondary-color);

}
.input-form{
    border-bottom: 0.5px solid var(--secondary-color);
    margin-right: 20px;
}


.contact-social{
  display: flex;
  padding-top: 40px;
}
.contact-social div{
  padding-right:50px;
}
/* responsive start */

.contact-form{
  margin-right: 40px;
}



@media screen and (max-width: 500px) {
  .modal-title{
  justify-content: center;
  font-size: 24px;
  }
  .modal-btn{
    padding:10px !important;
    margin-left: auto !important;
    margin-right: auto;
  }
  .center-all {
    position: absolute;
    left: 50%;
    top: 80%;
    transform: translate(-50%, -50%);
  }

  .menu{
    display:inline-block;
    position: relative;
    left:-20px;

  }
  .dropdown-menu{
    width:90%;
    max-width: 100%;
    box-shadow: 0px 0px 0px -5px rgba(0, 0, 0, 0.8);
  }

  .nav-link{
    padding-bottom: 15px;
  }


  .breadcrumb{
    padding-bottom:50px;

  }

  .q-title{
    width:200px;
    max-width: 100%;
    font-size: 40px;

  }

  .card-header{
    background-color: transparent!important;
    border:none;
    width:500px;
    max-width:100%;

  }
  .banner-img3 {
    width: 880px;
    height: 500px;
    max-width: 100% !important;
    }
  .banner-img3 img{
    width: 880px;
    position:absolute;
    background-size:cover;
    top:-30px;
    left:-180px;
    margin:auto;
    }


  .banner-img {
    width: 880px;
    height: 500px;
    max-width: 100% !important;
    }
  .banner-img img{
    width: 880px;
    position:absolute;
    background-size:cover;
    top:-30px;
    left:-250px;
    margin:auto;
    }
    .ban-img{
      width: 880px !important;
      overflow: hidden;
      position:absolute;
      background-size:cover;
      top: -5%  !important;
      left:-350px !important;
    }

    .v2 {
      border-left:0px ;
    }
    .v3 {
      border-left:0px ;
    }


    .banner-img2 {
      width: 880px;
      height: 200px;
      max-width: 100% !important;
      }

      .img-banner{
        width: 100%;
        position:relative;
        background-size:cover;
        top:-10px !important;
        left:-1px;
        }

  .bg {
    width: 100%;
    max-width: 100%;
    top:-20px;
    margin-bottom:80px;
    left:-5px;
    }

    .bg img{
      width: 100%;
      position:relative;
      left:-40px;
      top:-50px;
      margin-left:10px !important;
      background-color:red;
    }

    .content-2{
      transform:translate(50%, 50%) ;
      position: relative;
      top:-230px !important;
      left:-170px !important;
      width:100%;
      max-width: 100%;
      padding-bottom: 80px !important;
      margin-bottom: 90px;


    }
    .content-2 p {
      width:100%;
      max-width:100%;
    }

    hr.full{
      width:100%;
    }

    .quality-bg {
      width: 100%;
      height: 500px;
      top:-345px;

      }

      .quality-bg img{
        width:100%;
        height:800px;
        position:relative;
        object-fit: cover;
        object-position:-100px -100px;

      }

      .quality-banner{
        position: relative;
        top:60px;


      }

      .banner-section{
        height:800px;

      }

      .quality-section3{
        position:relative;
        z-index: -1;
        top:-900px;


      }
    .product-range{
      top:-200px;
      margin-bottom:300px;

    }


    .bg-content h1 ,  .explore-content  h1, .quality-banner h1,  .liposomal-content h1{
      font-size:40px;
      width:100%;
    }
    .bg-content p , .explore-content p, .liposomal-content p, .content-2 p {
      font-size:18px;
      line-height:25px;
      width:80%;
      padding:0 !important;

    }
    .bg-content{
      transform:translate(50%, 50%) ;
      display: block;
      position: relative;
      top:-280px !important;
      left:-190px !important;
      overflow:hidden;
      padding:20 !important;
    }

      .bg-content button {
         padding:10px 50px 10px 50px;
         border: none;
         border-radius: 30px;
         text-align: center;
      }


      .explore-content button {
         padding:10px 50px 10px 50px;
         border: none;
         border-radius: 30px;
         text-align: center;
      }
      .prod-content{
        padding-bottom:1800px;
        margin-bottom: 200px;

      }


      .arrow-indicator{
        position: relative;
        left:-130px;
        top: 1700px;
      }
      .arrow-indicator a{

        padding: 0 20px 0 20px;
        position: relative;
      }

  .navbar-icons{
    position:relative;
    left:10%;
  }


.pull-right{
  margin-left:-30px;

}
.carousel-caption h1 {
    font-size: 40px;
  }


  .carousel-caption{

     width:100%;
     position:absolute;
      z-index:2;
      text-align:left;
      top:70px;
      left:130px;
      -webkit-transform:translate(0, -25%);
      -ms-transform:translate(0, -100%);
      transform:translate(0, -5%); }

      .carousel-caption button{
         padding:10px 120px 10px 120px;
         border: none;
         border-radius: 30px;
         text-align: center;
         margin-top:20px;
      }

      .card-group{
        width:330px;
        max-width: 100%;
        position:relative;
        box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.10);
        overflow: hidden;
        left:20%;
        transform: translate(-20%,-60%);
        background-color: white;
      }
      .card{
        padding:30px 30px;

      }

     .flex-column{
         -ms-flex-direction: column!important;
         flex-direction: column!important;

     }

     .outline-btn{
       height:auto;
       padding:5px 5px 5px 5px;
       font-size:12px;
     }

     .layout{
       display:inline-block;
       padding-top:40px;

     }

     .video-fluid{
       position: relative;
       margin:10px;
       width:90%;
       max-width:100%;

     }
     .video-fluid-small{
       position: relative;
       width:90%;
       max-width:100%;
       margin:10px;
     }

     .video-layout{
       display:inline-block;
       width:100%;
       max-width:100%;


     }
     .video-content{
       left:-1%;
       margin:0px 10px;
     }

     .video-content h1{
       font-size: 40px;
     }

     .video-divider {
       border-top: 1px solid var(--secondary-color);
       max-width:80%;

       padding-bottom:40px;
     }

     .video-thumb{
       width: 100%;
        }

        .v-divider{
          border-top: 1px solid var(--secondary-color);
          width:90%;
          position:relative;
          top:-450px;
          padding-bottom:400px;
        }
        .vid-section{
            padding-bottom:500px;
            position: relative;
            top:50px;

        }
        .video-group{
          display: inline-block;
          width:100%;

        }
        .video-lib{
          width:100%;
        }


        .download-layout{
          display: inline-block;

        }
        .file-layout{
          display:flex;
          padding:0;

        }


      .file-section{
        padding-bottom:100px;

      }
      .download-divider{
        position:relative;
        top:-200px;
        padding-bottom:80px;
      }

      .d-divider{
        position:relative;
        top:-30px;
        padding-bottom:20px;
      }

     .download-img{
       position: relative;
       width:40px;
     }

     .centered {
       font-size:16px;
       position:absolute;
       top: -70px;
       left: 50%;
       transform: translate(-50%, -50%);
     }

     .link-cont{
       margin-top: 10px;
       -webkit-columns: 2 200px;
       -moz-columns: 2 200px;
       columns: 2 100px;
       -webkit-column-gap: 4em;
       -moz-column-gap: 4em;
       column-gap: 4em;
     }

     .product-card{
       width:100%;
       max-width:100%;
       position:relative;
       display:inline-block;
       overflow: hidden;
       transform: translate(-50%,10%);

     }
     .card-responsive{
      display:inline-block;
      max-width:100%;
      width:100%;
      padding:20px;
      height:100%;
     }

     .card-responsive img{
       margin:0px;
       width:20%;

     }

     .card-details{
       width:140%;
       max-width: 100%;
       height:100%;
       margin-top:10px;

     }

     .prod-high{
       background-color:#F5F6F8;
       height:auto;
       width:100%;
       margin-bottom: 100px;
       position: relative;
       top:-400px;

     }
     .prod-content h2{
       padding:10px 20px 30px 20px;
       font-size: 40px;

     }
     .prod-header{
       flex-direction: column;
       position:relative;
       display: inline-block;
     }
     .prod-header a{
       position:relative;
       left:40%;
       top:1780px;
       font-size: 18px;

     }
     .card-list{
       display: inline-block;
       margin-left: auto;
       margin-right:auto;
     }
     .bg-practioner{
       top:-815px;
       height: 400px;
       max-height: 100%;

     }
     .practioner-img{
       width:140%;
       height:100%;
       max-width: 100% !important;
       overflow: hidden;
       position:relative;
       object-fit:cover;
       object-position: 60% 70%;

     }

     .practioner-content{
       position: relative;
        width:80%;
        max-width: 80%;
        z-index:2;
        top:-480px;
        left:10px;
        padding:0;
         overflow: hidden;
         -webkit-transform:translate(0, -25%);
         -ms-transform:translate(0, -100%);
         transform:translate(0, -5%);

     }

     .practioner-content h1{
       font-size: 20px;
     }
     .practioner-content button{
       position:relative;
       left:-1px;
     }
     .practioner-content hr{
       width: 100%;
     }

     .i-divider{
       top:-60px;
       height:80%;

     }

     .img-divider{
       width:140%;
       height:80%;
       max-width: 100% !important;
       overflow: hidden;
       position:relative;
       object-fit:cover;
       object-position: 60% 70%;

     }
     .contact-divider {
       border-top: 1px solid var(--secondary-color);
       width:90%;
       padding:20px;
       padding-bottom:100px;
       position: relative;
       top:-700px;
     }

     .quality-content2{
       position:relative;
       top:-125px;
     }
     .quality-section3{
       position:relative;
       top:-80px;
       padding-bottom: 200px;


     }
     .quality-divider{
       position:relative;
       top:-500px;
       padding-bottom: 300px;
     }

     .r-divider{
       background-color: #F4F5F7;
       width: 1680px;
       height: 200px;
       max-width: 100% !important;
       position: relative;
       top:-1000px;

     }

     .resources-divider{
       width: 1680px;
       height:400px;
       max-width: 100% !important;
       overflow: hidden;
       position:relative;
       object-fit:cover;
       object-position: 50% 50%;

     }


     .testimony-content{
       position: relative;
       top:-700px;
       z-index: 1;
       display: inline-block;

     }

     .testimony-content img{
         width:40%;
         max-width: 50%;
         margin-bottom: 60px;
     }
     .testimony-content p{
         width:400px;
         max-width: 100%;
     }

     .props-section{
       position: relative;
       top:650px;
       margin-top: 10px;
       margin-bottom: 30px;
     }

     .prop-benefits{
       position: relative;
       top:-650px;
       z-index: 1;
       display: inline-block;

     }

     .prop-benefits img{
         width:40%;
         max-width: 50%;
         margin-bottom: 60px;
     }
     .prop-benefits p{
         width:400px;
         max-width: 100%;
     }
     .prop-benefits h3{
         width:400px;
         max-width: 100%;
     }
     .strat-section{
       height:auto;
       width:100%;
       margin-bottom:1100px;
       position: relative;
       top:-800px;

     }
     .strat-section h2{
       padding-left: 20px;
     }
     .card-2{
       max-width:100%;
       width:100%;
       padding:10px 10px 10px 10px;
       border:none;
       border-radius:6px;
       overflow: hidden;


     }
     .card-2 h4{
       font-size: 18px;
       padding-top: 20px;

     }

     .card-2 p{
       color:var(--secondary-color);
       font-size:14px;

     }

     .card-1{
       max-width:100%;
       width:90%;
       padding:10px 40px 30px 40px;
       border:none;
       background-color:white;
       border-radius:6px;
       overflow: hidden;
       margin:20px;

     }
     .arrow-indicator2{
       position: relative;
       left:-140px;
       top: 1900px;
     }
     .doc-section{
       position:relative;
       z-index: -1;
       top:-50px;
       margin-bottom: 200px;



     }
     .who-section{
       margin-top: 20px;


     }

     .faq-list{
       width:200%;
       max-width: 100%;
       position: relative;
       top:-230px;
       left:120px;
       padding-bottom:400px;


     }
     .faq-contents{
       position:relative;
       width:250%;
       max-width:100%;
       display:flex;
       left:-20px;
       padding-bottom: 10px;


     }

     .faq-section{
           position: relative;
           top:30px;
           padding-bottom:600px;

            }
      .faq-section h1{
          font-size: 30px;
      }

     .ans{
       width:300px;
       position:relative;
       left:50px;
       top:20px;
       padding-bottom: 20px;

     }


     .accordion{
        position:relative;
        left:-20px;
        width:400px;
        max-width:100%;
        padding-bottom:200px;
        margin:20px;
        overflow: hidden;

     }
     .ans-divider {
       border-top: 1px solid var(--secondary-color);
       width:100%;

       position:relative;
       top:-180px;
       padding-bottom:80px;

     }

     .contact-layout{
       display:inline;

     }
     .form-flex{
       display:inline-block;

     }
     .message-form{
         width:340px;
         max-width:100%;
     }

.contact-form{
  padding-bottom:150px;
  width:900px;
  max-width:100%;
}

.subscribe-btn{
  margin:20px;

}

.contact-form button{
   padding:10px 130px 10px 130px;
   border: none;
   border-radius: 30px;
   text-align: center;
   margin-top:20px;
}

.contact-details{
  width:350px;
  max-width: 100%;
  position:relative;
  top:-100px;
  padding-bottom: 60px;
}


.contact-social{
  display: inline;
  padding-top: 40px;
}
.contact-social div{
  padding-top:50px;
}
.resources-content{
  padding:10px 0px 80px 0px;

}

.arrow-icon{
  width:30px !important;
  max-width:100%;
  position: relative;
  top:-300px;
  left:250px;
  margin-left: 60px;

}
.filter-blue{
  filter:invert(30%) sepia(92%) saturate(475%) hue-rotate(172deg) brightness(95%) contrast(100%);
}


 .terms-section{
    position: relative;
    top:30px;
    margin:auto;
 }

.file-title h1{
  font-size:40px;

}

.liposomal-content{
  transform:translate(0, 50%) ;
  display: inline-block;
  position: relative;
  top:-350px;
  margin:0;
  max-width: 100%;
  z-index: -1;
  padding-bottom:80px;
}


.par-title{
  font-size:20px !important;
  margin-bottom:20px;

}

.liposomal-content button {
   padding:10px 50px 10px 50px;
   border: none;
   border-radius: 30px;
   text-align: center;
}


.lipo-header{
  top:-30px;
  position: relative;
}



.group-flex{
  display:block;
  width:100%;
  max-width:100%;

}

.group-margin{
  margin-top: 500px;
}
.text-right{
  text-align:left !important;

}
.details-flex{
  display:block;
  flex-direction: column-reverse;
  max-width:100%;
  top:-20px;
  padding-bottom: 400px;

}

.lipo-img{
  width:100%;
  max-width: 100%;
  position: absolute;
  top:-400px;


}

.lipo-import{
  position: relative;
  top:-100px;

}


.pad2{
  padding-bottom:250px;

}
.broad-flex{
  display: inline;
  padding-bottom: 30px;
  padding-top: 20px;
}
.line-flex p{
  font-size: 20px;
  color: white;
  line-height: 40px;

}
.vl {
  border: 0px solid #4EB7F2  !important;

}
.line-flex{
    display: flex;
}
.form-section{
  padding:20px 0px 20px 0px;

}

.m-top2{
  margin-top:0px;
  padding-bottom: 350px;
}
.full-vid > video {
	width: 100%;
	height: 50vh !important;
  }
.full-vid{
  height:50vh !important;
}

  .m-top2{
    margin-top:-100px;
  }

  .full-vid button {
      display: block;
      left: 0;
      margin: 0 auto;
      padding: 8px 16px;
      position: absolute;
      right: 0;
      top: 35% !important;

  }

}

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

    .carousel-caption{
      margin-left: -110px;
    }

  }



  @media screen and (min-width:1680px){

      .card-details{
        width:90%;
        margin-top:40px;
        padding-right:10px;
      }
  }
/* responsive end */

/* video full */
.m-top{
  margin-top: -50px;
}
.m-top2{
  position: relative;
  top:90px;
  padding-bottom: 700px;
}

.full-vid {
  overflow: hidden;
	position: relative;
	display: block;
	width: 100vw;
	height: 80vh;
	min-height: 400px;

}
	.full-vid video {
		display: block;
		position: absolute;
		z-index: -1;
		width: auto;
		height: 120vh;
		left: 50%;
		top: -10%;
		transform: translate(-50%, 0);
}

.full-vid button {
   background:  transparent;
   border:none;
    display: block;
    left: 0;
    margin: 0 auto;
    padding: 8px 16px;
    position: absolute;
    right: 0;
    top: 40%;
    transform: translate(-50%, 0);
}

.full-vid img{
  width:400%;
}


.slider-page {
  background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
   height: 100vh;
   width: 100%;
   background-color: #0E1318;
   align-items: center;
   position:relative !important;
  }
  #vid-banner{
    position:fixed;
    width:100%;
    height:auto;
    opacity: 0.60;
    background-repeat: no-repeat
  }



  @media(min-aspect-ratio:16/9){
    #vid-banner{
      width:100%;
      height:auto;
    }
    #s-image{
      width:100%;
      height:auto;
    }
    .slider-caption{
      font-size:20px !important;
      top:-100px;
    }
    .slider-stepper{
    z-index: 2 !important;
    }
  }
  @media(max-aspect-ratio: 16/9){

    #vid-banner{
        width:auto;
        height:auto;
    }
    .slider-caption{
      font-size:16px !important;
      top:-40px !important;
      left:0
    }
    .slider-logo{
      top:-120px!important;
      margin-bottom: 0;
      width:100% !important ;
    }
    .s-icon{
    width:30px !important;
    }
    .slider-stepper{
    z-index: 3 !important;
    }

    .caption-style{
      top:20% !important;
      left:0;
      align-items: center;
    }
  #s-image{
    width: auto !important;
    height:100% !important;
    background-repeat: no-repeat;

  }
  }

  .op-low{
  opacity: 0.40;
  }

  .overlay-color{
    position:absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(255, 255, 255, 100);
    overflow:hidden;
  }

#s-image{
  width: 100%;
  position:absolute;
  background-size:cover;
  background-repeat: no-repeat;

  }

.s-icon{
  width:60px;
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 50%;

}
.slider-stepper{
  position:relative;
  margin-top: -60px;
  top:400px;
  display: flex !important;
  justify-content:space-between !important;
  left:0;
  margin-left:20px;
  margin-right:20px;
  z-index:1;
}

.slider-caption{
  font-size:20px;
  font-family: 'Montserrat', sans-serif;
  letter-spacing: normal !important;
  text-transform:none !important;
  color:#174481 !important;
  width:80vw;
  max-width:100%;
  position: relative;
  top:-20px;
}

.slider-logo{
  width:15vw;
  position: relative;
  top:-300px;

}

.flex-slider{
  position:absolute;
  top:0;
  left:-15%;
  display:flex;
  flex-direction: column !important;
  align-items: center;

}
.caption-style{
  position: relative;
  width:auto;
  z-index:1;
  text-align:center;
  top:50%;
  left:0;
  align-items: center;
  max-width:100% !important;
}

.start-button{
  background-color:#174481 !important;
  color:white;
  font-size: 30px;
  border: none;
  border-radius: 50px;
  width:220px !important;
  height:80px !important;
  position: relative !important;
  top:-20px !important;
  max-width:100%;

}
.slider-text{
  font-size:20px;
  letter-spacing: normal !important;
  text-transform:none !important;
  position: relative;
  z-index: 1;
}
.slider-text p{
  color:#174481;
  font-size: 20px;
  font-family: 'Montserrat', sans-serif !important;
}
.slider-text h1{
  color:#174481 !important;
  font-size:52px;
  color:black;
}
.s-text-style{
  color:black !important;
  font-size:28px !important;
  font-family: 'Montserrat', sans-serif !important;
}
.s-subtext{
  color:black !important;
  font-size:16px !important;
}
.slide-button{
  background-color:#174481 !important;
  color:white;
  font-size: 20px;
  border: none;
  border-radius: 50px;
  width:130px !important;
  height:45px !important;
  max-width:100%;

}
.slide-title{
  font-size:40px !important;
}
.s-list{
  margin-left:20px !important;
  list-style: circle;
  color:black;
}

.sm-text{
  padding-top: 10%;
  color:black !important;
  font-size: 12px !important;
}
.rec-text{
  background-color:#197739;
  border:none;
  border-radius: 20px;
  margin-right:20px;
  width:60%;
  height:40%;
}
.rec-text p{
  color:white !important;
  font-size:14px !important;
  padding:20px;
}
.rec-trans{
  background-color:transparent;
  border:none;
  border-radius: 20px;
  margin-right:100px;
  width:60%;
}

.rec-yellow{
  background-color:#e1e876;
  border:none;
  border-radius: 40px;
  margin-right:20px;
  width:130%;
  height:100%;
}
.rec-yellow p{
  color:black !important;
  font-size:14px ;
}
.rec-orange{
  background-color:#ea984e;
  border:none;
  border-radius: 60px;
  margin-right:20px;
  width:120%;
  height:50%;
}
.rec-orange p{
  color:black !important;
  font-size:14px;
  padding:20px;
}

.rec-red{
  background-color:#db2323;
  border:none;
  border-radius: 60px;
  margin-right:20px;
  width:80%;
  height:50%;
}
.rec-red p{
  color:white !important;
  font-size:14px;
  padding-top:50px !important;
  padding:20px;
}

.rec-pink{
  background-color:#DB1181;
  border:none;
  border-radius: 60px;
  margin-right:20px;
  width:80%;
  height:50%;
}
.rec-pink p{
  color:white !important;
  font-size:14px;
  padding-top:40px !important;
  padding:25px;
}

.rec-violet{
  background-color:#9c5fa5;
  border:none;
  border-radius: 60px;
  margin-right:20px;
  width:80%;
  height:50%;
}
.rec-violet p{
  color:white !important;
  font-size:14px;
  padding-top:40px !important;
  padding:25px;
}

.rec-blue{
  background-color:#2d3484;
  border:none;
  border-radius: 40px;
  margin-right:20px;
  width:80%;
  height:60%;

}
.rec-blue p{
  color:white !important;
  font-size:14px;
  padding-top:40px !important;
  padding:25px;
}
.rec-lightblue{
  background-color:#15A0DB;
  border:none;
  border-radius: 40px;
  margin-right:10px;
  width:120%;
  height:60%;

}
.rec-lightblue p{
  color:white !important;
  font-size:14px;
  padding-top:40px !important;
  padding:25px;
}
.rec-list{
  font-family: "Montserrat" !important;
  margin-left:20px !important;
  font-size:16px;
  list-style: circle;
  color:white;
}
.list-center{
  padding:40px;
}
.p-title{
  padding-top:40px !important;
  margin-bottom: -10px !important;
  font-size: 18px !important;
}
.p-sub{
  padding:20px;
}
.content-flex{
  display: flex;
  flex-direction: row-reverse;
  padding-top: 60px;
}

.p-bottom{
  padding-bottom: 10%;
}
.p-bottom2{
  padding-bottom:25px;
}
.slide-position1{
  text-align: center;
  padding-top:40px;
  margin: 0 auto;
  position: absolute;
  left:0;
  right:0;
}

.slide-position2{
  text-align: center;
  padding-top:40px;
  margin:auto;
  position: absolute;
  left:-80px;
  top:-200px;
}

.slide-position3{
  text-align: center;
  padding-top:40px;
  margin:auto;
  position: absolute;
  left:80px;
  top:-200px;
}
.slide-position4{
  text-align: center;
  padding-top:40px;
  margin:auto;
  position: absolute;
  left:300px;
  top:-200px;
}
.slide-position5{
  text-align: center;
  padding-top:40px;
  margin:auto;
  position: absolute;
  left:320px;
  top:-200px;
}

.slide-position6{
  text-align: center;
  padding-top:40px;
  margin:auto;
  position: absolute;
  left:650px;
  top:-200px;
}
.slide-position7{
  text-align: center;
  padding-top:40px;
  margin:auto;
  position: absolute;
  left:800px;
  top:-200px;
}
.slide-position8{
  text-align: center;
  padding-top:40px;
  margin:auto;
  position: absolute;
  left:90%;
  top:-200px;
}
.content-right{
  width:150%;
}


@media(max-aspect-ratio: 16/9){
  .slide-button{
    font-size: 14px;
  }
  .slide-position2{
    left:10px;
    right:auto;
    margin: 0 auto;
    top:-200px;
  }
  .slide-position4{
    left:20px;
    right:auto;
    margin: 0 auto;
    top:-250px;
  }
  .slide-position5{
    left:10px !important;
    right:auto;
    margin: 0 auto;
    top:-250px;
  }

  .slide-position6, .slide-position7{
    left:80px !important;
    right:auto;
    margin: 0 auto;
    top:-250px;
  }
  .slide-position8{
    left:80px !important;
    right:auto;
    margin: 0 auto;
    top:-200px;
  }

  .content-flex{
    display: inline-block;
    padding-top: 0px;
    margin:10px 20px;
  }
  .slide-title{
    margin:20px;
    font-size: 30px !important;
  }
  .s-text-style{
    font-size:20px !important;
  }
  .s-subtext{
    font-size: 14px !important;
  }
  .p-bottom{
    padding-bottom:0;
  }
  .rec-text{
    margin-right:0!important;
    width:100%;
  }
  .scroll-slider{
    height:180vh;
  }
  .content-right{
    width:100%;
  }
  .rec-yellow, .rec-orange, .rec-red,
  .rec-pink, .rec-violet, .rec-blue{
    width:100%;
    border-radius: 30px;
  }
  .rec-lightblue {
  width:90%;
  }

  .sm-text{
    margin:20px;
  }

}

.phase-stepper{
 width: 1em;
 height: 1em;
 text-align: center;
 line-height: 2em;
 border-radius: 1em;
 background: #4F4F4F;
 margin: 300px 2em;
 display:flex;
 flex-direction: row;
 color: white;
 position: relative;
}

.phase-stepper::before{
  content: '';
  position: absolute;
  top: -300px;
  left:8px;
  width: .2em;
  height: 15em;
  background: #4F4F4F;
  z-index: -1;
}

.phase-stepper:first-child::before {
  display: none;
}

.phase-position1{
  position:relative;
  left:40px;
  top:-30px;
  margin-bottom: -300px;
}
.phase-position2{
  position:relative;
  left:10px;
  top:-30px;
  margin-bottom:-300px;
}
.phase-position3{
  position:relative;
  left:40px;
  top:-30px;
  margin-bottom:-300px;
}
.phase-position4{
  position:relative;
  left:150px;
  top:-30px;
  margin-bottom:-300px;
}
.phase-position5{
  position:relative;
  left:190px;
  top:-30px;
  margin-bottom:-300px;
}
.phase-position6{
  position:relative;
  left:50px;
  top:-30px;
  margin-bottom:-300px;
}
.phase-position7{
  position:relative;
  left:90px;
  top:-30px;
  margin-bottom:-300px;
}
.phase-position8{
  position:relative;
  left:40px;
  top:-30px;
  margin-bottom:-300px;
}

@media(max-aspect-ratio: 16/9){
  .phase-position1,.phase-position2,.phase-position3
  {
    top:-30px;
    left:10px;
  }
  .phase-position4
  {
    top:-30px;
    left:90px;
  }
  .phase-position5
  {
    top:-30px;
    left:100px;
  }
  .phase-position6
  {
    top:-30px;
    left:20px;
  }
  .phase-position7
  {
    top:-30px;
    left:60px;
  }
  .phase-position8
  {
    top:-30px;
    left:20px;
  }
}

.phase-one{
 width: 1em;
 height: 1em;
 text-align: center;
 line-height: 2em;
 border-radius: 1em;
 background: #4F4F4F;
 margin: 200px 2em;
 display:flex;
 flex-direction: row;
 color: white;
 position: relative;
}


.phase-one::before{
  content: '';
  position: absolute;
  top: -200px;
  left:8px;
  width: .2em;
  height: 50em;
  background: #4F4F4F;
  z-index: -1;
}

.phase-one:first-child::before {
  display: none;
}
.phase-container1{
  position:relative;
  left:40px;
  top:-190px;
  margin-right: 50px;
}
.phase-flex{
  display: flex;
}
@media(max-aspect-ratio: 16/9){
  .phase-one{
   margin: 110px 2em;
  }
  .phase-one::before{
    content: '';
    position: absolute;
    top: -120px;
    height: 20em;
  }
  .phase-container1{
    top:-100px;
    margin-bottom: -60%;
  }
}

.phase-one-cont{
 width: 1em;
 height: 1em;
 text-align: center;
 line-height: 2em;
 border-radius: 1em;
 background: #4F4F4F;
 margin: 240px 2em;
 display:flex;
 flex-direction: row;
 color: white;
 position: relative;
}


.phase-one-cont::after{
  content: '';
  position: absolute;
  top: -280px;
  left:8px;
  width: .2em;
  height: 14em;
  background: #4F4F4F;
  z-index: -1;
}

.phase-one:first-child::before {
  display: none;
}
.phase-container2{
  position:relative;
  left:40px;
  top:-230px;
  margin-right: 50px;
}

@media(max-aspect-ratio: 16/9){
  .phase-one-cont{
   margin: 250px 2em;
  }
  .phase-one-cont::after{
    content: '';
    position: absolute;
    top: -400px;
    height: 20em;
  }
  .phase-container2{
    top:-240px;
    margin-bottom: -60%;
  }
}
.phase-two{
 width: 1em;
 height: 1em;
 text-align: center;
 line-height: 2em;
 border-radius: 1em;
 background: #4F4F4F;
 margin: 230px 2em;
 display:flex;
 flex-direction: row;
 color: white;
 position: relative;
}


.phase-two::before{
  content: '';
  position: absolute;
  top: -240px;
  left:8px;
  width: .2em;
  height: 50em;
  background: #4F4F4F;
  z-index: -1;
}

.phase-two:first-child::before {
  display: none;
}
.phase-container3{
  position:relative;
  left:40px;
  top:-220px;
  margin-right: 50px;
}

@media(max-aspect-ratio: 16/9){
  .phase-two{
   margin: 110px 2em;
  }
  .phase-two::before{
    content: '';
    position: absolute;
    top: -120px;
    height: 20em;
  }
  .phase-container3{
    top:-100px;
    margin-bottom: -60%;
  }
}

.phase-three{
 width: 1em;
 height: 1em;
 text-align: center;
 line-height: 2em;
 border-radius: 1em;
 background: #4F4F4F;
 margin: 230px 2em;
 display:flex;
 flex-direction: row;
 color: white;
 position: relative;
}

.phase-three::before{
  content: '';
  position: absolute;
  top: -230px;
  left:8px;
  width: .2em;
  height: 12em;
  background: #4F4F4F;
  z-index: -1;
}
.phase-three:first-child::before {
  display: none;
}
.phase-container4{
  position:relative;
  left:40px;
  top:-230px;
  margin-right: 50px;
}


@media(max-aspect-ratio: 16/9){
  .phase-three{
   margin: 190px 2em;
  }
  .phase-three::before{
    content: '';
    position: absolute;
    top: -190px;
    height: 10em;
  }
    .phase-container4{
    top:-190px;
    margin-bottom: -60%;
  }
}
.phase-four{
 width: 1em;
 height: 1em;
 text-align: center;
 line-height: 2em;
 border-radius: 1em;
 background: #4F4F4F;
 margin: 170px 2em;
 display:flex;
 flex-direction: row;
 color: white;
 position: relative;
}

.phase-four::before{
  content: '';
  position: absolute;
  top: -180px;
  left:8px;
  width: .2em;
  height: 10em;
  background: #4F4F4F;
  z-index: -1;
}
.phase-four:first-child::before {
  display: none;
}
.phase-container5{
  position:relative;
  left:40px;
  top:-170px;
  margin-right: 50px;
}
@media(max-aspect-ratio: 16/9){
  .phase-four{
   margin: 160px 2em;
  }
  .phase-four::before{
    content: '';
    position: absolute;
    top: -180px;
    height: 10em;
  }
    .phase-container5{
    top:-160px;
    margin-bottom: -60%;
  }
}
.phase-five{
 width: 1em;
 height: 1em;
 text-align: center;
 line-height: 2em;
 border-radius: 1em;
 background: #4F4F4F;
 margin: 210px 2em;
 display:flex;
 flex-direction: row;
 color: white;
 position: relative;
}

.phase-five::before{
  content: '';
  position: absolute;
  top: -230px;
  left:8px;
  width: .2em;
  height: 12em;
  background: #4F4F4F;
  z-index: -1;
}
.phase-five:first-child::before {
  display: none;
}
.phase-container6{
  position:relative;
  left:40px;
  top:-200px;
  margin-right: 50px;
}
@media(max-aspect-ratio: 16/9){
  .phase-five{
   margin: 160px 2em;
  }
  .phase-five::before{
    content: '';
    position: absolute;
    top: -180px;
    height: 10em;
  }
    .phase-container6{
    top:-150px;
    margin-bottom: -60%;
  }
}
.phase-six{
 width: 1em;
 height: 1em;
 text-align: center;
 line-height: 2em;
 border-radius: 1em;
 background: #4F4F4F;
 margin: 130px 2em;
 display:flex;
 flex-direction: row;
 color: white;
 position: relative;
}

.phase-six::before{
  content: '';
  position: absolute;
  top: -130px;
  left:8px;
  width: .2em;
  height: 7em;
  background: #4F4F4F;
  z-index: -1;
}
.phase-six:first-child::before {
  display: none;
}
.phase-container7{
  position:relative;
  left:40px;
  top:-130px;
  margin-right: 50px;
}
@media(max-aspect-ratio: 16/9){
  .phase-six{
   margin: 160px 2em;
  }
  .phase-six::before{
    content: '';
    position: absolute;
    top: -180px;
    height: 10em;
  }
    .phase-container7{
    top:-150px;
    margin-bottom: -60%;
  }
}


@media (max-width: 767px) {
       .hidden-mobile {
         display: none;
       }
  }



  @media screen and (min-width: 411px) and (max-width: 823px) and (orientation: landscape) {
    .slider-page {
       height: 300vh !important;
      }
    #s-image{
      width:300vw !important;
    }
    .slider-stepper{
      margin-top: -60px;
      top:250px;

    }
    .caption-style{
      top:10%;
    }
    .slider-caption{
      font-size: 14px !important;
    }
    .start-button{
      width:15vw !important;
      height:15vh !important;
      font-size: 14px;
    }
    .slider-logo{
      top:-50px;
    }
    .s-text-style{
      font-size: 18px !important;
    }
    .s-subtext{
      font-size: 14px !important;
    }
    .rec-text, .rec-yellow, .rec-orange, .rec-red,
    .rec-pink, .rec-violet, .rec-blue,   .rec-lightblue {
      margin-right:30px !important;
      border-radius: 20px;
      height:10%;
      width:150% !important;
    }
    .rec-text p, .rec-yellow p, .rec-orange p, .rec-red p,
    .rec-pink p, .rec-violet p, .rec-blue p,   .rec-lightblue p, .p-sub, .rec-list, .s-list {
      font-size:12px !important;

    }


    .p-title{
      font-size: 14px !important;
      margin-bottom: -30px !important;
      margin-top: -10px;
    }
    .list-center{
      padding-left:30px;
      width:100%;
    }
    .slide-title{
      font-size:30px !important;
    }
    .p-sub{
      margin-top: 15px;

    }

    .slide-position2{
      left:20px;
      top:-450px;
    }
    .phase-position1{
      left:15px;
    }
    .slide-position3{
      left:80px;
      top:-500px;
    }
    .phase-position3{
      left:15px;
    }
    .slide-position4{
      left:320px;
      top:-500px;
    }
    .phase-position4{
      left:50px;
    }
    .slide-position5{
      left:100px;
      top:-450px;
    }
    .phase-position5{
      left:100px;
    }
    .slide-position6{
      left:300px;
      top:-500px;
    }
    .phase-position6{
      left:20px;
    }
    .slide-position7{
      left:300px;
      top:-500px;
    }
    .phase-position7{
      left:50px;
    }
    .slide-position8{
      left:400px;
      top:-500px;
    }
    .phase-position8{
      left:10px;
    }
    .slide-button{
      font-size: 12px;
    }

  }
  .lipo2-background{
      background-color:#f3f5f4;
      margin-top:20px;
      padding-top:50px;
      padding-bottom: 50px;
  }
  .supp-background{
      background-color:#f3f5f4;
      margin-top:-10px;
      padding-top:50px;
      padding-bottom: -80px;
  }

  .o3-background{
      background-color:#f3f5f4;
      margin-top:-80px;
      padding-top:50px;
      padding-bottom: 50px;
  }
  .o3-image{
    width:100% !important;
    position: absolute;
    top:900px !important;
  }
  .o3-img2{
    width:100% !important;
    position:relative;
    top:-200px;
  }
  .o3-img-background{
    width:100% !important;
    position:relative;
    top:-1200px;
    z-index: -1;
    margin-bottom: -900px;
  }

  .o3-button button{
    padding:10px 30px 10px 30px;
    border: none;
    border-radius: 30px;
    text-align: center;
    font-size: 18px;
    position:relative;
    top:-300px;
  }

  .o3-importance{
      position: relative;
      top:-250px;
  }
  .o3-img-container{
    width:80%;
    max-width: 100%;
    margin:auto;

  }
  .o3-img-container img{
    width:180% !important;
    max-width: 200%;
    position: relative;
    transform:translate(-20%, -120px);
    z-index:-1;

  }
  .transdermal-img-container{
    width:60%;
    max-width: 100%;
    margin:auto;

  }
  .transdermal-img-container img{
    width:180% !important;
    max-width: 200%;
    position: relative;
    transform:translate(-20%, -90px);
    z-index:-1;

  }
  .o3-details{
    margin-bottom: -400px !important;
  }
  .transdermal-content{
    position:relative;
    top: -250px;
  }
  .transdermal-title-bar{
    background-color:var(--secondary-color);
    position:relative;
    margin-top:-90px;
    margin-bottom: 80px;
    padding-top:10px;
    padding-bottom:5px;
  }
  .transdermal-title-bar h3{
    color:white;

  }

  .wholesale-button button{
    padding:5px 20px 5px 20px;
    border: none;
    border-radius: 30px;
    text-align: center;
    font-size: 18px;
    position:relative;
    top:-100px;
    background-color: var(--primary-color) !important;
  }
  .wholesale-img{
    width:100% !important;
    position:relative;
    top:-100px;
  }

  .left-details{
        color:white;
        padding:30px;
        background-color: var(--secondary-color);
        position: relative;

    }
    .right-details{
        padding:30px;
        position: relative;
        background-color:#FAFAFA;
        color:var(--primary-color);

      }

    .whole-list{
       list-style-type: none;
       padding-bottom: 10px;
       color:white;
     }

    .wh-list{
      list-style:none;
      padding-bottom: 10px;
      color:var(--primary-color);
    }


    .wh-title{
      text-transform: uppercase;
      font-size:20px;
      color:white;
    }
    .wh-title2{
      text-transform: uppercase;
      font-size:20px;

    }
    .list-section{
      padding:20px 0px 50px 0px;
      position:relative;
      top:-40px;
      display: flex;
      justify-content: center;
    }
    .wlist-bg-left{
      background-color:var(--secondary-color);
    }
    .wlist-bg-right{
      background-color:#FAFAFA;
    }
    .wcontent2{
      position:relative;
      margin-bottom: 400px;
      top:-120px;

    }
    .ws-icon{
      margin-right:-80px !important;
      margin-bottom: 10px;
    }
    .ws-icon2{
      width:10%;
      max-width:20%;
      margin-left: 10px;
      margin-bottom: 10px;

    }
    .wh-flex{
      display:flex;
      align-items: center;

    }
    .wh-flex2{
      display:flex;
      align-items: center;
      position:relative;
      top:-5px;
      left:-10px;
    }
    .ws-bullet{
      width:10%;
      margin-left:-50px;
      margin-top: -10px;
    }
    .suppository-banner{
      width: 100%;
      max-width:100% !important;
      height:600px;
      }

      .sup-banner-img{
        width: 100%;
        max-width: 100% !important;
        overflow: hidden;
        position:relative;
        background-size:cover;
        top:-300px;
        transform: rotate(360deg);

      }
      .suppository_content{
        position: relative;
        top:-320px;
      }
      .suppository_cont2{
        position: relative;
        top:-200px;
      }
      .supp-button button{
        padding:10px 30px 10px 30px;
        border: none;
        border-radius: 30px;
        text-align: center;
        font-size: 18px;
        position:relative;
        top:-300px;
      }
      .supp_img_med{
        width:50% !important;
        height:500% !important;
        position:relative;
        top:-200px;
        left:100px;
        background-color:red;
      }
      .supp-list{
        position:relative;
        top:-420px !important;
      }
      .sup-img-container{
        width:40%;
        max-width: 100%;
        margin:auto;

      }
      .sup-img-container img{
        width:100% !important;
        max-width: 100%;
        position: relative;
        top:-180px;
        transform:translate(40%, -40px);
        z-index:-1;

      }
      .sup-scroll{
        position: relative;
        top:-720px !important;
        margin-bottom: -120px;
      }
      .sup-flex{
        display:inline;
        color:white;
        width:50%;
        padding-right: 20px;
      }
      .sup-flex h5{
        color: white;
      font-family: 'Open Sans', sans-serif;

      }
      .mtop{
        margin-top: -100px;
      }
      .vid-div > video {
        display: block;
        position: absolute;
        width: auto;
        z-index: 1;
        height: 120vh;
        left: 50%;
        top: -10%;
        transform: translate(-50%, 0%);
        }
      .vid-div{
        width: 100vw;
        height: 90vh;
        min-height: 400px;
        padding-bottom: 50px;
        overflow: hidden;
      }
      .vid-divider{
        width: 1680px;
        height: 100vh;
        max-width: 100% !important;
        position: relative;
        top:-30px;
        margin-bottom: -80px;
      }
      .innov-content{
        position: relative;
        top:120px !important;
      }
      .sub-innov{
        position: relative;
        top:100px !important;
      }
      .ptop{
        padding-top:50px;
      }

      table, th, td {
        border: 1px solid black;
        border-collapse: collapse;
      }
      th, td {
        padding: 15px;
        text-align: left;
      }
      .stp{
        padding: 10px 0;
      }





  @media only screen and (max-width:500px){
    .broad-content{
      margin-bottom:250px;
      position:relative;
      top:-600px;
    }

    .o3-img2{
      position: relative;
      top:-60px !important;
      padding-bottom: 50px;
    }
    .o3-content{
      position:relative;
      top:-400px !important ;
    }

    .o3-content h1{
      font-size: 32px;
    }
    .o3-content h3{
      font-size: 26px !important;
    }
    .o3-button button{
      padding:5px 15px 5px 15px !important;
      border: none;
      border-radius: 30px;
      text-align: center;
      font-size: 14px !important;
      position:relative;
      top:-178px !important;
    }
    .o3-importance{
        position: relative;
        top:-90px !important;
    }
    .o3-img-container img{
      transform:translate(-40px, -830px);
      z-index:-1;
      width:130% !important;
      max-width: 200%;

    }
    .o3-group{
      position: relative;
      top:-90px;
    }
    .o3-group2{
      position: relative;
      top:-400px;
      margin-bottom: -200px;
    }
    .o3-img-background{
      width:100% !important;
      position:relative;
      top:-720px;
      z-index: -2;
      margin-bottom: -900px;
    }
    .transdermal-details{
      position:relative;
      top:-250px !important ;
    }
    .transdermal-details2{
      position:relative;
      top:-340px !important ;
    }
    .transdermal-img-container img{
      transform:translate(-20%, -840px);
      z-index:-1;
      width:140% !important;
      max-width: 150%;
    }

    .card-1{
      border:none;
      background-color:white;
      border-radius:6px;
      overflow: hidden;
      margin:20px;
    }
    .line-flex p{
      font-size: 14px !important;
    }
    .list-section{
      display: inline-block;
    }

    .wcontent{
      position: relative;
      top:110px;
    }
    .wcontent2{
      position: relative;
      top:30px;
      padding-bottom: 400px;
    }
    .wholesale-button button{
      top:-130px;
      position:relative;
      padding:5px 15px 5px 15px;
      font-size: 14px !important;
    }
    .wh-flex{
      position:relative;
      left:-10px;
      top:-5px;

    }
    .ws-icon{
      width:15%;
    }
    .ws-icon2{
      width:15%;
      position: relative;
      left:-10%;
    }

    .suppository-banner{
      width: 100%;
      max-width:100% !important;
      }

      .sup-banner-img{
        width: 100%;
        max-width: 100% !important;
        position:relative;
        top:-50px;

      }

      .suppository_content{
        position: relative;
        top:-530px !important;
      }
      .suppository_cont2{
        position: relative;
        top:-350px;
      }
      .supp-button{
        position: relative;
        top:30px;
      }
      .supp-list-del{
        position: relative;
        top:-90px !important;
      }
      .sup-img-container{
        width:100%;
        max-width: 100%;
        margin:auto;
        height:300px;


      }
      .sup-img-container img{
        width:100% !important;
        max-width: 100%;
        position: relative;
        top:-120px;
        left:-30px;
        transform:translate(8%, 10px);
        z-index:-1;

      }
      .sup-scroll{
        position: relative;
        top:-820px !important;
        margin-bottom: -520px;
      }
      .sup-blue{
        position: relative;
        top:50px;
      }
      .ws-bullet{
        width:15%;
        padding-left:15px;
        margin-left:-40px;
        margin-top: -10px;
      }
      .whole-list, .wh-list{
        margin-left: -12px;
      }
      .vid-div > video {
      	width: 100%;
        max-width:100%;
      	height: 50vh !important;
        position:relative;
        top:-100px;

        }
      .vid-div{
        height:10vh !important;
        margin-bottom: -120px;
      }
      .innov-content{
        position:relative;
        top:-90px !important;
      }
      .sub-innov{
        position: relative;
        top:10px !important;
      }
      .vid-divider{
        top:-60px;
        height:80%;
      }

      .ptop{
        margin-top:-250px;
      }
  }



  @media only screen and  (max-width: 320px){
    .o3-img2{
      position: relative;
      top:-90px !important ;
      padding-bottom: 50px;
    }
    .o3-content{
      position:relative;
      top:-520px !important ;
    }
    .o3-button button{
      padding:5px 15px 5px 15px !important;
      border: none;
      border-radius: 30px;
      text-align: center;
      font-size: 12px !important;
      position:relative;
      top:-198px !important;
    }
    .o3-img-container img{
      transform:translate(-40px, -930px);
      z-index:-1;
      width:130% !important;
      max-width: 200%;
    }
    .o3-group{
      position: relative;
      top:-180px !important;
    }
    .o3-group2{
      position: relative;
      top:-400px;
      margin-bottom: -250px !important;
    }

    .transdermal-details{
      position:relative;
      top:-350px !important ;
    }
    .transdermal-details2{
      position:relative;
      top:-400px !important ;
    }
    .transdermal-img-container img{
      transform:translate(-20%, -900px);
      z-index:-1;
    }

    .card-1{
      border:none;
      background-color:white;
      border-radius:6px;
      overflow: hidden;
      margin-bottom:20px;
    }
    .lipo-header{
      position:relative;
      top:20px !important;
      padding-bottom: 20px;
    }
    .line-flex p{
      font-size: 14px !important;
    }

    .wcontent{
      position: relative;
      top:90px;
    }
    .wcontent2{
      position: relative;
      top:80px;
      padding-bottom: 400px;
    }
    .wholesale-button button{
      top:-200px;
      position:relative;
      padding:5px 15px 5px 15px;
      font-size: 14px !important;
    }
    .suppository-banner{
      width: 100%;
      max-width:100% !important;
      }

      .sup-banner-img{
        width: 100%;
        max-width: 100% !important;
        position:relative;
        top:-50px;

      }

      .suppository_content{
        position: relative;
        top:-550px !important;
      }
      .suppository_cont2{
        position: relative;
        top:-350px;
      }
      .supp-button{
        position: relative;
        top:25px;
      }
      .supp-list-del{
        position: relative;
        top:-100px !important;
      }
      .sup-img-container{
        width:100%;
        max-width: 100%;
        margin:auto;
        height:300px;

      }
      .sup-img-container img{
        width:100% !important;
        max-width: 100%;
        position: relative;
        top:-120px;
        left:-30px;
        transform:translate(8%, 10px);
        z-index:-1;

      }
      .sup-scroll{
        position: relative;
        top:-920px !important;
        margin-bottom: -520px;
      }
      .sup-blue{
        position: relative;
        top:-40px;
      }
      .innov-content{
        position: relative;
        top:-90px !important;
      }
      .sub-innov{
        position: relative;
        top:-20px !important;
      }
      .vid-divider{
        top:-60px;
        height:80%;
      }
      hr.innov{
        width:100%;
        position:relative;
        left:30px;
      }

  }





  @media screen and (min-width:320px ) and (max-height: 568px) and (orientation: portrait) {
    .slider-page {
       height: 260vh !important;
      }
  }
  @media screen and (min-width:568px ) and (max-width: 736px) and (orientation: landscape) {
    .rec-text, .rec-yellow, .rec-orange, .rec-red,
    .rec-pink, .rec-violet, .rec-blue,   .rec-lightblue {
      width:100% !important;

    }
    .phase-flex{
      margin-left:0!important;
    }

    @media screen and (min-width: 320px) and (max-width: 812px) and (orientation: portrait) {

        .rec-text, .rec-yellow, .rec-orange, .rec-red,
        .rec-pink, .rec-violet, .rec-blue,   .rec-lightblue {
          margin-right:18px !important;
          border-radius: 20px;
          width:100%;

        }
        .rec-text p, .rec-yellow p, .rec-orange p, .rec-red p,
        .rec-pink p, .rec-violet p, .rec-blue p,   .rec-lightblue p, .p-sub, .rec-list, .s-list {
          font-size:14px !important;

        }
    }