@charset "UTF-8";

/*
Typography
=========================== */
html,body {
    width:100%;
    height: auto;
    margin:0;
    padding:0;
    /*overflow-x: hidden;*/
}


body {
    font-family: 'Source Sans Pro', sans-serif;
    /*position: relative;*/
    font-size:18px;
    /*line-height:24px;*/
    color:#6f6f6f;
}

header{
	border-bottom: 2px solid #ececec;
	padding: 0px 40px;
	width: 100%;
}

header nav {
	margin-top: 20px;
}

footer{
	/*margin-bottom: 50px;*/
}

h1 {
	font-family: 'Red Hat Display', sans-serif;
	font-size: 38px;
	font-weight:400; 
	color:#00416B;
	padding-top:0;
	margin-top: -0.309em;
	/*margin: 50px auto;*/
	/*letter-spacing: 1px;*/
}

h2 {
	font-family: 'Red Hat Display', sans-serif;
	font-size: 35px;
	font-weight:400; 
	color:#00416B;
	padding-top:0;
	margin-top: -0.309em;
	/*margin: 50px auto;*/
	/*letter-spacing: 1px;*/
}

h4 {
	font-size:18px;
	font-weight:400;
	color:#000000;
}

ul, menu, dir {
    display: block;
    list-style-type: disc;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 0px;
}

/* ------------------------------------ */
input {
	outline: none;
	border: none !important;
}

button {
    outline: none !important;
    border: none;
    background: transparent;
    cursor: pointer;
}

.strong {
    color: #333;
	ont-weight:400;
}
	
a {
	font-size: 15px;
	/*letter-spacing: 1px;*/
    color: #333;
	text-decoration: none;
}
.link a {
	font-family: 'Red Hat Display', 'Noto Sans SC', sans-serif;
	font-size: 14px;
	/*letter-spacing: 1px;*/
    color: #D6785E;
	text-decoration: none;
	font-weight: 600;
}

.report a {
	font-size: 17px;
	letter-spacing: 0px;
    color: #333;
	text-decoration: none;
}

.reportname {
    width: 100%;
    float: left;
}
/*@media (max-width:699px) {
    .reportname {
        width: 100%;
    }
}*/


.buttonlink {
    font-family: 'Red Hat Display', 'Noto Sans TC', 'Noto Sans SC','Noto Sans KR','Noto-Sans-Thai-Regular', sans-serif;
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    text-align: center;
    padding: 5px 10px;
    float: left;
    margin-top: 10px;
   /* margin-right: 30px;
    margin-top: 5px;*/
    cursor: pointer;
    color: #00416B;
    background: #d6bfb3;
    border-radius: 15px;
}

.buttonlink label {
	background-color: transparent;
	padding-right: 0;
}

#Details a,
.flex-item a{
	letter-spacing: 0px;
}

@media (max-width:699px) {
    #Details .buttonlink {
        float: left;
        margin-top: 10px;
    }
}

a,
a:active,
a:focus,
a:hover{
    outline:none;
    /*-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;*/
}

a:hover{
	color: #00416B;
    /*text-decoration:underline;*/
}

div .report{
	margin-bottom:40px;
}
/*----------------------GRID----------------------*/
/*BOX SIZING - necessary with grids*/
*, *:after, *:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


/*Basic column dimensions/layout */
[class*='col-'] {
	  float: left;
	}

[class*='col-'] {
  padding-right: 20px;
}
[class*='col-']:last-of-type {
  padding-right: 0;
}

.col-1-3 {
	width: 33.3%;
}
/*OTHER SIZES*/
.col-2-3 {
  width: 66.6%;
}
.col-1-2 {
  width: 50%;
}
.col-1-4 {
  width: 25%;
}
.col-2-4 {
  width: 50%;
}
.col-3-4 {
  width: 75%;
}
.col-1-8 {
  width: 12.5%;
}
.col-7-8 {
  width: 87.5%;
}
.col-1-10 {
  width: 10%;
}
.col-9-10 {
  width: 90%;
}


.grid{
	margin-bottom: 5px;
}
.grid:after {
  content: "";
  display: table;
  clear: both;
}

.grid-container {
  display: grid;
  grid-template-columns: auto auto auto auto;
  grid-gap: 20px;
  
  padding: 10px;
  padding-left:0;
  padding-right:0;
}

.ProductList-cl3 {
	float: left;
	width: 30%;
	margin-right: 3.3%;
	margin-bottom: 50px;
}

@media (max-width:992px) {
	.ProductList-cl3 {
		float: left;
		width: 45%;
		margin-right: 5%;
		margin-bottom: 50px;
	}
}

@media (max-width:699px) {
	.ProductList-cl3 {
		width: 46%;
    	/*margin-right: 2%;*/
		margin-right: 0;
		margin-bottom: 50px;
	}
}


.ProductListImage {
	display: block;
	/*min-height: 200px;*/
	background: #f9f9f9;
}

.ProductListImage img {
	width: 100%;
}
.menu{
	padding-top: 30px;
	font-size: 20px;
	display: block;
	width:30px;
	height: 30px;
	position: relative;
	float: left;
	cursor: pointer;
}

.container {
	background-color: #FFFFFF;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	border-bottom-width: 0px;
	padding-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
}

/*
 * Row with equal height columns
 * --------------------------------------------------
 */
.flex-container{
	display: -webkit-flex; /* Safari */		
	display: flex; /* Standard syntax */
}


#Products.flex-container {
    display: flex;
    display: -webkit-flex; /* Safari */		
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
    /* margin-top: 30px; */
    float: right;
}

.ProductList-cl3 {
    float: left;
    width: 30%;
    margin-right: 3.3%;
    margin-bottom: 50px;
}

#Brands .flex-container:first-of-type {
	margin-bottom: 20px;
}

#Brands .flex-container .col-1-3{
	-webkit-flex: 1; /* Safari */
	-ms-flex: 1; /* IE 10 */
	flex: 1; /* Standard syntax */
	background: #f7f7f7;
	margin-right: 20px;
	padding-right:0;
    /*padding-top: 30px;*/
	
}
#Brands .flex-container .col-1-3:last-of-type {
	margin-right: 0;
}

.vertical-center {
  margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.reportSmall{
	font-size: 13px;
	color:#979797;
}

div .report{
	margin-bottom:10px;

}

.row {
	width: 100%;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	display: inline-block
}
.row.blockDisplay {
	display: block;
}
.column_half {
	width: 50%;
	float: left;
	margin-top: 0px;
}
.columns {
	width: 25%;
	float: left;
	font-family: "Source Sans Pro";
	color: #A5A5A5;
	line-height: 24px;
	padding-top: 10px;
	padding-bottom: 10px;
	text-align: justify;
	margin-top: 15px;
	margin-bottom: 15px;
	padding-left: 0px;
	padding-right: 0px;
	margin-left: 0px;
	margin-right: 0px;
}
.row .columns p {
	padding-left: 10%;
	padding-right: 10%;
}
.container .columns h4 {
	text-align: center;
	color: #01B2D1;
}

.logo {
	display: block;
	margin: 0 auto;
	padding-top: 30px;
	padding-bottom: 30px;
	width:200px;
	position: relative;
	/*transition: all 500ms;
    overflow: hidden;*/
	/*overflow: hidden;
	transition: all 200ms;*/
}

@media (max-width: 500px){
    .logo {
        width: 160px
    }
}
/*.primary_header {
	width: 100%;
	background-color: #52bad5;
	padding-top: 10px;
	padding-bottom: 10px;
	clear: left;
	border-bottom: 2px solid #2C9AB7;
}*/
/*.secondary_header {
	width: 100%;
	padding-top: 50px;
	padding-bottom: 50px;
	background-color: #B3B3B3;
	clear: left;
}*/

/*.container .secondary_header ul {
	margin-top: 0%;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 15px;
	padding-left: 0px;
	width: 100%;
}
.secondary_header ul li {
	list-style: none;
	float: left;
	margin-right: auto;
	margin-top: 0px;
	font-family: "Source Sans Pro";
	font-weight: normal;
	color: #FFFFFF;
	letter-spacing: 1px;
	margin-left: auto;
	text-align: center;
	width: 16%;
	transition: all 0.3s linear;
}
.secondary_header ul li:hover {
	color: #717070;
	cursor: pointer;
}*/

.subTitle {
	/*font-family: 'Source Sans Pro', sans-serif;*/
	font-family: 'Red Hat Display', sans-serif;
	font-size: 38px;
	font-weight: 600;
	text-align: left;
	display: block;
	/*width: 90px;*/
	color: #E3785E;
	/*line-height: 1.2;
	letter-spacing: 1px;*/
}
.bwlQuality {
	width: 100%;
	padding: 80px 0px 40px 0px;
	display: inline-block;
	background-color: #FFFFFF;
	margin-top: 0px;
}

#bwlQuality .subTitle {
	margin-left: 20px;
}

.bwlPromise {
	width: 100%;
	padding: 40px 0px 80px 0px;
	display: inline-block;
	background-color: #FFFFFF;
	margin-top: 0px;
}
#bwlPromise .subTitle{
	margin-bottom: 50px;
}

.bwlPromise img {
	width: 95%;
}

.bwlPromise .link img {
	width: auto;
}

.bwlBrands {
	width: 100%;
	padding: 80px 0px 40px 0px;
	display: inline-block;
	background-color: #FFFFFF;
	margin-top: 0px;
	border-top: 1px solid #ececec;
}

#bwlBrands .subTitle {
	margin-left: 20px;
}
.brands, .products {
	/*background: #f7f7f7;*/
	/*height:100%;*/
}
.brands{
	min-height: 270px;
	padding: 10px;
    padding-top: 50px;
	position: relative;
}

.border-radius-20 {
	border-radius: 20px;
}

.brandLogo{
	/*display: block;
	margin: 0px auto;*/
	/*max-width: 150px;*/
	text-align: center;
	/*width:80px;*/
	/*padding-top: 50px;
	padding-bottom: 100px;*/
	margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.productImage{
	display: block;
	margin: 0px auto;
	/*max-width: 150px;*/
	text-align: center;
	/*width:80px;*/
	/*padding: 20px 0;
	background: #fcfcfc;*/
}

.productImage img {
	border-radius: 20px;
}

#Details .productImage {
     margin-bottom: 20px;
}

.productName{
	text-align: center;
	padding:20px 0;
	font-size: 15px;
	display: block;
}

.brandHeader .brandLogo{
	padding-top: 60px;
	padding-bottom: 40px;
}
.brandLogo img {
	/*width:100%;*/
}
.productImage img {
	width:100%;
    image-rendering: -webkit-optimize-contrast;
}


#secretHeader .brandHeaderLogo img,
#secretHeader2 .brandHeaderLogo img{
	height:55px;
}

#miragloHeader .brandHeaderLogo img,
#miragloHeader2 .brandHeaderLogo img{
	height:42px;
}

#avanceHeader .brandHeaderLogo img,
#avanceHeader2 .brandHeaderLogo img{
	height:40px;
}

#optrimaxHeader .brandHeaderLogo img,
#optrimaxHeader2 .brandHeaderLogo img{
	height:40px;
}

#pentalabHeader .brandHeaderLogo img,
#pentalabHeader2 .brandHeaderLogo img{
	height:24px;
}

#foodphiloHeader .brandHeaderLogo img,
#foodphiloHeader2 .brandHeaderLogo img{
	height:45px;
}

/*
	@media (max-width:600px) {
		.brandHeader2 {
			display: block;
		}
		#secretHeader .brandHeaderLogo img{
			height:40px;
		}
		#miragloHeader .brandHeaderLogo img{
			height:40px;
		}
		#avanceHeader .brandHeaderLogo img{
			height:30px;
		}

		#pentalabHeader .brandHeaderLogo img{
			height:13px;
		}
		
	}
*/


#skincare .subTitle,
#skincare2 .subTitle,
#supplements .subTitle,
#personal .subTitle{
	font-family: 'Red Hat Display', sans-serif;
	font-size: 15px;
	font-weight: 400; 
	text-align: center;
	display: block;
	width:auto;
	color: #939598;
	line-height: 1.2;
	letter-spacing: 1px;
	/*padding-top: 80px;*/
	padding-bottom:60px;
}

/*#skincare .subTitle{
	padding-top: 10px;
}*/

#relatedProducts .subTitle{
	font-family: 'Red Hat Display', sans-serif;
	font-size: 15px;
	font-weight: 400; 
	text-align: left;
	display: block;
	width:auto;
	color: #939598;
	line-height: 1.2;
	letter-spacing: 1px;
	padding-top: 10px;
	padding-bottom:10px;
}


/*#supplements {
	margin-bottom: 20px;
}*/

.link {
	font-family: 'Red Hat Display', 'Noto Sans SC', sans-serif;
	font-size: 14px;
	/*letter-spacing: 1px;*/
	font-weight: 600;
}

.prevpdt, .nextpdt {
	font-size: 20px;
	width: 10%;
	float: left;
	-webkit-flex: 1; /* Safari */
	-ms-flex: 1; /* IE 10 */
	flex: 1; /* Standard syntax */
}

.nextpdt {
	text-align: right;
}

.prevpdt a, .nextpdt a {
	font-family: 'Red Hat Display', 'Noto Sans SC', sans-serif;
	font-size: 30px;
	letter-spacing: 1px;
    color: #D6785E;
	text-decoration: none;
	font-weight: 600;
	position: relative;
	  top: 50%;
	  transform: translateY(-50%);
	
}

.noDisplay {
	display: none;
}
.container h2 {
	padding-left: 5%;
	padding-right: 5%;
	margin-top: 5%;
	color: #717070;
	font-weight: bold;
	text-transform: uppercase;
}

#bwlQuality h2, #bwlPromise h2, #bwlBrands h2 {
	font-family: 'Red Hat Display', sans-serif;
	font-size: 35px;
	font-weight:400; 
	color:#00416B;
	padding:0;
	margin-top: -0.309em;
	/*margin: 50px auto;*/
	/*letter-spacing: 1px;*/
	text-transform: inherit;
}

.container .left_article p {
	padding-left: 5%;
	padding-right: 5%;
	text-align: justify;
	line-height: 24px;
	margin-top: 30px;
	margin-bottom: 15px;
	color: #B3B3B3;
}
.right_article {
	width: 40%;
	float: left;
	/*background-color: #F6F6F6;*/
}
.container .right_article ul {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.right_article ul li {
	font-family: "Source Sans Pro";
	list-style: none;
	text-align: center;
	background-color: #B3B3B3;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-top: 15px;
	padding-bottom: 15px;
	color: #FFFFFF;
	font-weight: bold;
	border-radius: 0px;
	transition: all 0.3s linear;
	border-left: 5px solid #717070;
}
.right_article ul li:hover {
	background-color: #717070;
	cursor: pointer;
}
.footer {
	/*border-top: 2px solid #ececec;*/
	margin-top: 20px;
}

.title {
	font-weight: bold;
	font-style: normal;
	font-family: "Source Sans Pro";
	text-align: center;
	color: #FFFFFF;
	letter-spacing: 2px;
}
.placeholder {
	/* [disabled]max-width: 400px;
*/
	/* [disabled]max-height: 200px;
*/
	width: 100%;
	padding-top: 30px;
	/* [disabled]padding-left: 19px;
*/
	padding-bottom: 30px;
	height: 100%;
}
.left_half {
	background-color: #52BAD5;
}
.container .column_half.left_half h2 {
	color: #FFFFFF;
	font-family: "Source Sans Pro";
	text-align: center;
}
.right_half {
	background-color: #01B2D1;
	color: #FFFFFF;
	font-family: "Source Sans Pro";
	text-align: center;
	font-weight: bold;
}
.column_title {
	padding-top: 25px;
	padding-bottom: 25px;
}

.mainFooter {
	display:block;
	/*position: relative;*/
	width:100%;
	background: #f9f6f4;
    padding-top: 60px;
	/*margin-top: 150px;*/
}

.footergrey {
	display:block;
	width:100%;
	height:auto;
	background: #f9f6f4; 
	position: relative;
}

.footergrey .col-1-2 {
	padding-right: 0;
		}

.mainFooter .container {
    width: 90%;
    max-width: 1200px;
    margin-right: auto;
    margin-left: auto;
    padding: 0;
	background-color: #f9f6f4;
}

.footerRow{
	display:block;
	position: relative;
	
}

.footerRow p, .footerRow a {
	font-size:12px;
	color: #000000;
	margin-bottom: 0px;
	margin-block-start: 0;
    margin-block-end: 0;
}

.footerRow p.terms {
	padding: 0;
	margin-bottom: 3px;
}

.footerRow .col-1-2:nth-child(2) {
	padding-right:0px;
}

.copyright {
	font-size: 11px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.terms,
.terms-ch {
	text-align: right;
	font-weight: 600;
	margin-top: 0px;
}

.terms a {
    text-align: right;
    font-weight: 700;
	font-size: 10px;
    color: #004177;
    font-family: 'Red Hat Display', 'Noto Sans SC', sans-serif;
    position: relative;
    text-transform: uppercase;
}

.terms-cn a{
	font-size: 11px;
}

.terms-ch a {
    text-align: right;
    font-weight: 700;
	font-size: 11px;
    color: #004177;
    font-family: 'Red Hat Display', 'Noto Sans SC', sans-serif;
    position: relative;
    text-transform: uppercase;
}

.terms label {
	padding-right: 0px;
	background-color: #f9f6f4;
}

#TermsCondition .modal-dialog, 
#TermsCondition .modal-content, 
#TermsCondition .modal-body, 
#PDPP .modal-dialog, 
#PDPP .modal-content, 
#PDPP .modal-body,
.testreports .modal-dialog, 
.testreports .modal-content, 
.testreports .modal-body {
    height: 97%;
}

.testreports .modal-body {
    margin-top: 0;
}

.testreports .modal-header {
    padding: 10px 15px;
}

.testreports .modal-dialog {
    max-width: 60%;
	margin-left: auto;
	margin-right: auto;
}
	@media (max-width:768px) {
		.testreports .modal-dialog {
			max-width:90%;
		}
	}

.iframereport {
	 margin-left: 2.5%;
}

#Copyright {
	float: left;
}

#Disclaimer {
	float: right;
}

.disclaimer {
	text-align: right;
	margin: 0 auto;
	/*background-color: #717070;*/
	/*width:60%;*/
	color: #000000;
	font-size: 10px;
	font-weight: lighter;
	/*border-top-width: 2px;*/
	font-family: "Source Sans Pro";
	position: relative;
}

p.disclaimer { 
	text-align: left;
	padding-top: 20px;
	margin-top: 12px;
	font-size: 11px;
}

.disclaimer a {
	font-family: 'Source Sans Pro', 'Noto Sans SC', sans-serif;
	font-size: 10px;
	padding: 0;
	color: #009FBD;
	letter-spacing: 0px;
}

.disclaimer a:hover {
 color: #00416B;
}

.disclaimer .link {
	font-size: 0;
}

.socialmedia {
	/*width: 50%;
	height:auto;
	margin: 20px auto;*/
	position: relative;
	text-align: right;
}
	@media (max-width:400px) {
		.socialmedia {
			width:100%;
		}
	}

.socialmedia ul {
	
	max-width: 100%;
	-webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 0px;
}

.socialmedia ul li {
	list-style: none;
	display: inline-block;
	position: relative;
	padding:0px 10px;
}

.socialmedia ul li:last-of-type {
	padding-right: 0;
}

.show-wechat {
	display: none;
    position: absolute;
    z-index: 1100;
    /* width: 200px; */
    margin-top: 10px;
    /* top: 150%; */
    /* top: 45px; */
    top: -280px;
    right: -10px;
    padding: 15px;
    /* border-top: 3px solid #e6e6e6; */
    background-color: white;
    font-size: 13px;
    text-align: center;
    color: #000000;
    box-shadow: 0 3px 5px 0px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 3px 5px 0px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
    -o-box-shadow: 0 3px 5px 0px rgba(0, 0, 0, 0.1);
    -ms-box-shadow: 0 3px 5px 0px rgba(0, 0, 0, 0.1);
    -o-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
}

.showwechat {
	display: block;
}

@media (max-width:560px) {
		.footergrey .col-1-2 {
			width:100%;
		}
		.footergrey .terms,
        .footergrey .terms-ch {
			text-align: left;
		}
	
		.terms a {
			text-align: left;
		}
		
		#Copyright {
			float: none;
			margin-bottom: 30px;
		}

		#Disclaimer {
			float: none;
		}

		p.disclaimer {
			text-align: left;
		}

		.socialmedia {
			text-align: center;
		}
	}

.left{
	float: left;
}
.right{
	float: right;
}

.leftArrow {
	padding-right:10px;
}
.rightArrow {
	padding-left:10px;
}


.brandHeader{
	display: block;
	height:165px;
	border-bottom: 1px solid #ececec;
	width: 100%;
	position: relative;
}

@media (max-width:600px) {
		.brandHeader {
			display: none;
		}
		#optrimaxHeader2 .brandHeaderLogo,
		#avanceHeader2 .brandHeaderLogo{
			text-align: center;
			padding-top: 60px;
			padding-bottom: 25px;
			padding-right: 0px;
		}
		#secretHeader2 .brandHeaderLogo,
		#miragloHeader2 .brandHeaderLogo,
		#foodphiloHeader2 .brandHeaderLogo{
			text-align: center;
			padding-top: 60px;
			padding-bottom: 15px;
			padding-right: 0px;
		}
	}


.brandHeader .left{
	    padding-top: 70px;
   /* position: absolute; */
}
.brandHeader .right{
	padding-top: 70px;
	padding-left:20px;
    text-align: right;
    position: relative;
	/*top: -9%;*/
}

.brandHeader2{
	display: block;
	height:165px;
	border-bottom: 1px solid #ececec;
	width: 100%;
	position: relative;
}

	@media (min-width:600px) {
		.brandHeader2 {
			display: none;
		}
		
	}

.brandHeader2 .left{
	   /* padding-top: 70px;*/
   /* position: absolute; */
}
.brandHeader2 .right{
	/*padding-top: 70px;
	padding-left:20px;*/
    text-align: right;
    position: relative;
	/*top: -9%;*/
}

.brandHeaderLogo {
	text-align: center;
	padding-top: 60px;
	padding-bottom: 40px;
	padding-right: 0px;
}

.downArrow {
	/*background-image: url(../images/downarrow2.png) ;*/
	width: 40px;
	height:21px;
	margin: 0 auto;
	position:relative;
	top:-1px;
	display: block;

}

.downArrow img {
	vertical-align: initial;
}

.greyline {
	display: block;
	height:2px;
	width:100%;
	background: #ececec;
	margin:30px 0;
}

.contentContainer {
	display: block;
	position: relative;
	/*padding: 60px 0;*/
	/*padding:30px 0;*/
	min-height: 450px;
}


#Products .flex-container{
	padding: 0;
  margin: 0;
  list-style: none;
  
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  
  -webkit-flex-flow: row wrap;
 /* justify-content: flex-start;*/
  justify-content: center;
}
#skincare .flex-container{
	padding: 0;
  margin: 0;
  list-style: none;
  
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  
  -webkit-flex-flow: row wrap;
 /* justify-content: flex-start;*/
  justify-content: center;
}

#relatedProducts .flex-container{
	padding: 0;
  margin: 0;
  list-style: none;
  
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  
  -webkit-flex-flow: row wrap;
  justify-content:flex-start;
}
	
#Products .flex-item {
  /*background: #fcfcfc;*/
  padding: 20px;
  width: 25%;
  margin-top: 30px;
  text-align: center;
	cursor: pointer;
}
#skincare .flex-item {
  /*background: #fcfcfc;*/
  width: 25%;
  text-align: center;
	cursor: pointer;
}

@media (max-width: 1300px){
    #Products .flex-item,
    #skincare .flex-item {
      width: 33.333%;
    }
}
@media (max-width: 600px){
    #skincare .flex-item {
      width: 50%;
    }
}

#relatedProducts .flex-item {
  /*background: #fcfcfc;*/
  padding-right: 20px;
  width: 25%;
  margin-top: 30px;
  text-align: left;
  cursor: pointer;
}

#pdtMainContent {
	width: 100%;
	height: auto;
	display: -webkit-flex; /* Safari */		
	display: flex; /* Standard syntax */
}

#Details{
	width:80%;
	max-width: 1000px;
	margin: 0 auto;
    margin-top: 50px;
	display: block;
	float: left;
}
#Details .col-1-2 {
	padding-right: 60px;
}
#Details .col-1-2:last-of-type {
	padding-right:0px;
}

#Details .tab-content .col-1-2 {
	padding-right:0px;
}

.productTitle {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 30px;
	font-weight:400;
	color:#000000;
	padding-top:0;
	margin-top: -0.309em;
}

/*.productMenu {
	padding-bottom: 50px;
}*/
.productMenu ul {
	list-style:none;
	text-align: center
}

.productMenu ul li {
	text-transform: capitalize;
	list-style:none;
	display: inline-block;
	padding: 0 1.5%;
}

.productMenu a {
	color: #979797;
}

 .productMenu .active a{
	color:#000000;
}

@media (max-width: 320px) {
	
	body {
    font-size:16px;

	}
	
	header {
		padding: 0px 10px;
	}
	
	.container{
		width: 90%;
	}
	
	.flex-container{
		display: block;
	}
	
	
	#Brands .flex-container .col-1-3:nth-child(1){
		width:100%;
		/*flex: 1;
		float: none;*/
	}
	#Brands .flex-container .col-1-3{
		width: 100%;
	}
	
	#Brands .col-1-3 {
		width: 100%;
		margin-right: 0px;
   		margin-bottom: 20px;
	}
	
	.bwlQuality {
		width: 100%;
		padding: 0;
	}

	#bwlQuality .col-1-3,
	#bwlQuality .col-2-3,
	#bwlBrands .col-1-3,
	#bwlBrands .col-2-3 {
		width: 100%;
		float: none;
	}
	
	#bwlPromise .col-1-2{
		width: 100%;
		float: none;
	}
	
	.bwlPromise {
		padding-bottom: 40px;
	}
	
	.bwlPromise img {
		width: 100%;
    	height: auto;
	}
	
	#bwlQuality .subTitle,
	#bwlPromise .subTitle,
	#bwlBrands .subTitle {
		margin: 0;
		margin-bottom: 30px;
		font-size: 35px;
	}
	
	#bwlQuality .subTitle,
	#bwlPromise .subTitle {
		margin-top: 30px;
	}
	
	#bwlQuality h2,
	#bwlPromise h2,
	#bwlBrands h2 {
		font-size: 29px;
	}
	
	.bwlBrands {
		padding-top: 40px;
		padding-bottom: 0;
	}	
	
	#skincare .subTitle,
	#supplements .subTitle,
	#personal .subTitle {
		padding-top: 40px;
		padding-bottom: 40px;
	}
	
	#skincare .brandLogo {
    width: 50%;
    float: left;
    padding-top: 0px;
    /* padding-bottom: 40px;*/
	text-align: center;
	}
	
	.brandLogo {
	padding-top: 0px;
   /* padding-bottom: 40px;*/
	}
	
	.social .social_icon img {
	width: 80%;
	float: left;
	}
	
	.socialMedia{
	padding-top:0px;
	position: relative;
	width:40%;
	margin: 0 auto;
	float: none;
	text-align: center;
	}
	
	.copyright {
	/*float: left;*/
	width:100%;
	color: #000000;
	font-size: 12px;
	/*padding-top:20px;
	padding-bottom:20px;
	font-weight: lighter;
	letter-spacing: 0px;*/
	font-family: "Source Sans Pro";
	position: relative;
	}
	
	.disclaimer {
	float: left;
	width:100%;
	color: #000000;
	font-size: 10px;
	padding-top:20px;
	padding-bottom:20px;
	font-weight: lighter;
	/*letter-spacing: 0px;*/
	font-family: "Source Sans Pro";
	position: relative;
	}
}

@media (max-width: 500px) {
	#Products .flex-item {
	  /*background: #fcfcfc;*/
	  padding: 10px;
	  width: 50%;
	  margin-top: 10px;
	  text-align: center;
	}
	
	.prevpdt a, .nextpdt a {
	  font-size: 25px;
	  position: relative;
	  top: 0%;
	  transform: translateY(0%);
	
	}
	
	#Details .col-1-2 {
		width: 100%;
		float: none;
		padding-right: 0;
	}
    #Details .tab-content .col-1-2 {
        padding-right: 0px;
        width: 50%;
        float: left;
    }
	#relatedProducts .flex-item {
	  /*background: #fcfcfc;*/
	  padding-right: 20px;
	  width: 33.3%;
	  margin-top: 30px;
	  text-align: left;
		cursor: pointer;
}
}
@media (min-width: 321px) and (max-width: 768px) {

	header {
		padding: 0px 20px;
	}  
	
	.container{
		width: 90%;
	}
	
	.flex-container{
		display: block;
	}
	
	
	#Brands .flex-container .col-1-3{
		width:100%;
		flex: 1;
		float: none;
	}
	
	h1{
		line-height: 1;
	}
	
	.bwlQuality {
		width: 100%;
		padding: 0;
	}

	#bwlQuality .col-1-3,
	#bwlQuality .col-2-3,
	#bwlBrands .col-1-3,
	#bwlBrands .col-2-3 {
		width: 100%;
		float: none;
	}
	
	#bwlPromise .col-1-2{
		width: 100%;
		float: none;
	}
	
	.bwlPromise {
		padding-bottom: 40px;
	}
	
	.bwlPromise img {
		width: 100%;
    	height: auto;
	}
	
	#bwlQuality .subTitle,
	#bwlPromise .subTitle,
	#bwlBrands .subTitle {
		margin: 0;
		margin-bottom: 30px;
		font-size: 35px;
	}
	
	#bwlQuality .subTitle,
	#bwlPromise .subTitle {
		margin-top: 30px;
	}
	
	#bwlQuality h2,
	#bwlPromise h2,
	#bwlBrands h2 {
		font-size: 29px;
	}
	
	.bwlBrands {
		padding-top: 40px;
		padding-bottom: 0;
	}	
	
	#Brands .col-1-3 {
    	width: 50%;
    	margin-right: 0px;
   		margin-bottom: 20px;
	}
	#Brands img{
	/*	max-width:  80% ; */
	}
	
	#skincare{
		padding-top: 0;
	}
	
	/*#skincare .subTitle,
	#supplements .subTitle,
	#personal .subTitle {
		padding-top: 40px;
		padding-bottom: 40px;
	}*/
	
	#skincare .brandLogo {
    /*width: 50%;*/
    /*float: left;*/
    padding-top: 0px;
    /*padding-bottom: 40px;*/
	text-align: center;
	}
	
	.brandLogo {
	padding-top: 0px;
    /*padding-bottom: 40px;*/
	}
	
	.prevpdt a, .nextpdt a {
	  font-size: 25px;
	  position: relative;
	  top: 0%;
	  transform: translateY(0%);
	
	}

	#Details .col-1-2 {
		width: 100%;
		float: none;
		padding-right: 0;
	}
    #Details .tab-content .col-1-2 {
        padding-right: 0px;
        width: 50%;
        float: left;
    }
	#relatedProducts .flex-item {
	  /*background: #fcfcfc;*/
	  padding-right: 20px;
	  width: 33.3%;
	  margin-top: 30px;
	  text-align: left;
		cursor: pointer;
}
 
	.footergrey .col-1-2 {
		width: 100%;
		float: none;
	}
	
	.footergrey .terms,
    .footergrey .terms-ch {
		text-align: left;
	}
	
	.terms a {
		text-align: left;
	}
	
	#Copyright {
		float: none;
		margin-bottom: 30px;
	}
	
	#Disclaimer {
		float: none;
	}
	
	p.disclaimer {
		text-align: left;
		margin-top: 20px;
	}
	
	.socialmedia {
		text-align: center;
	}
}

@media (min-width: 769px) and (max-width: 1000px) {
	
	.bwlQuality {
	width: 100%;
	padding: 60px 0px 20px 0px;
	}
	
	.bwlPromise {
	width: 100%;
	padding: 40px 0px 40px 0px;
	display: inline-block;
	background-color: #FFFFFF;
	margin-top: 0px;
	}
	
	.bwlBrands {
	width: 100%;
	padding: 60px 0px 20px 0px;
	}
	
	/*#skincare {
	padding-top: 5%;
	}
	
	#skincare .subTitle,
	#supplements .subTitle,
	#personal .subTitle{

		padding-top: 40px;
		padding-bottom:30px;
	}*/
	
	
}

@media (max-width: 1000px) {
	#Products .col-1-4 {
		display: flex;
		width: 50%;
	}
	
	#Products .col-1-4:nth-child(even){
		padding-right:0px;
	}
}
@media (min-width: 1001px) and (max-width: 1300px) {
	#Products .col-1-4 {
		width: 33.3%;
	}
}

@media (min-width: 1001px) {
}
.thumbnail {
	width: 100px;
	border-radius: 200px;
	height: 100px;
	margin-left: auto;
}
.thumbnail_align {
	text-align: center;
}
.social {
	text-align: center;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	width: 100%;
	background-color: #414141;
	clear: both;
	overflow: auto;
}
.social_icon {
	min-width: 50px;
	width: 20%;
	/*text-align: center;*/
	float: right;
	transition: all 0.3s linear;
	line-height: 0px;

}
.container .social_icon:hover {
	cursor: pointer;
	opacity: 0.5;
}




.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #f9f6f4;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
}

.sidenav a,
.dropdown-btn{
	font-family: 'Red Hat Display', sans-serif;
    padding: 12px 8px 12px 32px;
    text-decoration: none;
    font-size: 20px;
	font-weight: 400; 
    color: #00416B;
    display: block;
    transition: 0.3s;
	border: none
}

.sidenav a:hover,
.dropdown-btn:hover{
    color: #333;
}

/* Add an active class to the active dropdown button */
.sidenav .active {
    
    
}
/* Dropdown container (hidden by default). Optional: add a lighter background color and some left padding to change the design of the dropdown content */
.dropdown-container {
    display: block;
}
.dropdown-container a {
    font-size: 18px;
	font-weight: 300;
   	padding-top: 15px;
	padding-bottom: 15px;
}

.dropdown-container a:first-of-type {
	padding-top: 30px;
}

.dropdown-container a:last-of-type {
	padding-bottom: 30px;
}

/* Optional: Style the caret down icon */
.fa-caret-down {
    float: right;
    padding-right: 8px;
}
.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 40px;
    margin-left: 50px;
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}


/* Acordeon styles */
.tab {
  position: relative;
margin-top: 15px;
  margin-bottom: 1px;
  width: 100%;
  overflow: hidden;
	font-size: 15px;
	letter-spacing: 0px;
    color: #333;
	text-decoration: none;
}
input {
  position: absolute;
  opacity: 0;
  z-index: -1;
}
label {
    position: relative;
    display: block;
    padding: 0;
    padding-right: 30px;
    background: #fff;
    line-height: 1.2;
    /*margin-bottom: 30px;*/
    cursor: pointer;
}

.tab-content {
  max-height: 0;
  overflow: hidden;
  background: #fff;
  -webkit-transition: max-height .35s;
  -o-transition: max-height .35s;
  transition: max-height .35s;
}

.tab-content p {
  margin: 0 1em;
}
/* :checked */
input:checked ~ .tab-content {
  max-height: 10em;
    margin-top: 10px;
  margin-bottom:30px;
}
/* Icon */
label::after {
  position: absolute;
  right: 0;
  top: 0;
  display: block;
  width: 1em;
  height: em;
  line-height: 1.3;
  text-align: center;
  -webkit-transition: all .35s;
  -o-transition: all .35s;
  transition: all .35s;
}

input[type=radio] + label::after {
  content: url(../images/dropdown.png);
}

input[type=radio]:checked + label::after {
  transform: rotateX(180deg);
}

/*-----------------language menu--------------*/

.topbar-language {
    position: relative;
    /* height: 100%; */
    top: -60px;
    float: right;
    right: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    /* padding-right: 32px; */
	font-size: 14px;
	font-weight: 600;
}

.topbar-language select {
    border: none;
	background-color: #fff;
}

.topbar-language .menuselectdiv .ui-button {
	background: url(../images/dropdown2.png) no-repeat right #f7f7f7;
    font-weight: normal;
    color: #333;
	padding: 0 20px;
}

/*[ Restyle Select2 ]
///////////////////////////////////////////////////////////
*/
/* Select2 */
.select2-container {
  display: block;
  max-width: 100% !important;
  width: auto !important;
	width: 60px;
}

.select2-container .select2-selection--single {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  background-color: transparent;
  border: none;
  height: 20px;
  outline: none;
  position: relative;
}

/* in select */
.select2-container .select2-selection--single .select2-selection__rendered {
  font-size: 13px;
  font-family: 'Source Sans Pro', 'Noto Sans TC', sans-serif;
  line-height: 20px;
  color: #4d4d4d;
  font-weight: 600;
  padding-left: 0px ;
  padding-right: 25px;
  background-color: transparent;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 20px;
  top: 50%;
  transform: translateY(-50%);
  right: 0px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.select2-selection__arrow b {
  display: none;
}

.select2-selection__arrow:after {
  content: '';
  display: block;
  width: 5px;
  height: 5px;
  background-color: transparent;
  border-right: 1px solid #888888;
  border-bottom: 1px solid #888888;
  color: white;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  margin-bottom: 2px;
  margin-right: 8px;
}

/* dropdown option */
.select2-container--open .select2-dropdown {
  z-index: 1251;
  /*min-width: 70px;*/
    width: auto !important;
  color: #A95C57;
    font-weight: 600;
    border-radius: 20px;
    border: 1px solid #D6BFB3;
}

.select2-container .select2-results__option[aria-selected] {
  padding: 8px 10px;
}

.select2-container .select2-results__option[aria-selected="true"] {
  background-color: #f4f4f4;
  color: #A95C57;
}

.select2-container .select2-results__option[aria-selected="true"]:first-of-type{
  background-color: #f4f4f4;
  color: #A95C57;
    border-radius: 20px 20px 0 0 ;
}

.select2-container .select2-results__option[aria-selected="true"]:last-of-type{
  background-color: #f4f4f4;
  color: #A95C57;
    border-radius: 0 0 20px 20px ;
}
.select2-container .select2-results__option--highlighted[aria-selected]:first-of-type{
  background-color: #f4f4f4;
  color: #A95C57;
  font-weight: 600;
    border-radius: 20px 20px 0 0 ;
}

.select2-container .select2-results__option--highlighted[aria-selected]:last-of-type{
  background-color: #f4f4f4;
  color: #A95C57;
  font-weight: 600;
    border-radius: 0 0 20px 20px ;
}
.select2-container .select2-results__option--highlighted[aria-selected] {
  background-color: #f4f4f4;
  color: #A95C57;
  font-weight: 600;
}

.select2-results__options {
  font-size: 13px;

}

.select2-search--dropdown .select2-search__field {
  border: 1px solid #aaa;
  outline: none;
 /* font-family: Montserrat-Regular;*/
  font-size: 13px;
  color: #888888;
}

.select2-dropdown .select2-dropdown--below{
width: 80px;	
}

/*[ rs1-select2 ]
-----------------------------------------------------------
*/
.rs1-select2 .select2-container {
  margin-left: 10px;
}

.rs1-select2 .select2-container .select2-selection--single {
  height: 20px;
}