@charset "utf-8";
/* CSS Document */
.flex-container {
	display: flex;
	flex-direction: row; /* Stacks flex items as rows */
  }
  
  .row {
	margin-bottom: 10px; /* Adds space between the rows. Remove margin from the last row if desired. */
	padding-right:15%;
	padding-left:20px;
	line-height: 2;
  }


.row2 {
	font-size: 14px;
}

.footer-flex {
	display: flex;
	justify-content: left;
	
  }
  

  

  .footer-section {
	padding: 10px; /* Adjust as needed */
	text-align: center; /* Centers the content */
	margin: auto;
	justify-content: center;
  }



.ft3 {
	font-size: 14px;

}
.ft2 {
	padding-top:20px;

}


ul.topMenu1 li::after {
	content: '';
	width: 2px;
	background: #010101;
	top: 3px;
	bottom: 3px;
	position: absolute;
	right: 0;
  }

  hr.solid {
	border-top: 1px solid #000000;
  }
/*----------------
	RESET CSS
-----------------*/
body {
	top:0;
	bottom:0;
	left:0;
	right:0;
	margin:auto;
	padding:0;
	background:#fff;
	color:#000000;
	text-align:center;
	font-family: 'futura';
	font-weight:400;
	}
div, ul, h1, h2, h3, h4, h5, li, p, img, form, input, textarea {margin: 0;padding: 0;}
header, section, footer, aside, nav, main, article, figure {display: block;}
table, tr, td {border: 0;}
a {outline: none;color: inherit;text-decoration: none;}
img {border: none; height:auto;}
li {list-style: none;}
* {box-sizing: border-box;}
.img-full {max-width: 100%;}
.clearall {
	clear: both;
	font-size: 1px;
	line-height: 1px;
	height: 1px;
	}
.fl{ float:left;}
.fr{ float:right;}
.show-tab, .show-mob{ display:none;}

p {font-family: futura;}

@font-face {
    font-family: 'Futura';
    src: url('Roboto-Regular.woff2') format('woff2'),
        url('Roboto-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'futura';
    src: url('Roboto-Bold.woff2') format('woff2'),
        url('Roboto-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'futura';
    src: url('Roboto-Medium.woff2') format('woff2'),
        url('Roboto-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}



/*-----------------------
	MAIN CSS START
------------------------*/
.container {
	width:1170px;
	margin:0 auto;
	padding:0;
	position:relative;
	}
	

.header{
	float:left;
	width:100%;
	background:#ffffff;
	height:110px;
	padding:0;
	position:relative;
	border-bottom-style:solid;
	border-color: #b6b6b6;
	border-width: 1px;
	}		
.logo{
	float:left;
	margin-top:20px;
	}
	
ul.topMenu{
	float:right;
	margin:35px 0 0 0;
	}
ul.topMenu li{
	float:left;
	padding:0 15px;
	position:relative;
	}
ul.topMenu li a{
	color:#000000;
	font-size:15px;
	line-height:18px;
	font-weight:400;
	letter-spacing:0.3px;
	}
ul.topMenu li a:hover, ul.topMenu li a.active{color:#287cf0;}

.mob-mnu-ic{
    cursor: pointer;
    position:absolute;
    right: 0px;
    top: 35px;
	z-index:16;
	height:30px;
	}
.mob-mnu-ic button{
	outline: none;
    -webkit-appearance: none;
	background: none;
	padding:0;
    cursor: pointer;
	border: none;
	}
.mob-mnu-ic span{
	color:#000;
	display:inline-block;
	vertical-align:top;
	font-size:16px;
	font-weight:300;
	margin-top:4px;
	margin-right:5px;
	}
.bar1, .bar2, .bar3 {
	width: 20px;
	height: 3px;
	background-color: #5f5f5f;
	transition: 0.2s;
	-webkit-border-radius: 2px 2px 2px 2px;
	border-radius: 2px 2px 2px 2px;
	}
.bar2{margin: 3px 0;}
.dl-active .bar1 {
	-webkit-transform: rotate(-45deg) translate(-6px, 5px);
	transform: rotate(-45deg) translate(-6px, 5px);
	background:#000;
	}
.dl-active .bar2 {opacity: 0;}
.dl-active .bar3 {
	-webkit-transform: rotate(45deg) translate(-3px, -3px);
	transform: rotate(45deg) translate(-3px, -3px);
	background:#000;
	}	
.mobilemenu{
	left:0;
	position:fixed;
	top:91px;
	background:rgba(255,255,255,1);
	z-index:10;
	right:0;
	bottom:0;
	overflow:scroll;
	display:none;
	}
.mobimenu-top{ top:65px;}	
.mobilemenu li{
	float:left;
	width:100%;
	text-align:left;
	border-bottom:1px solid #dddddd;
	}
.mobilemenu li a{
	float:left;
	width:100%;
	padding:15px 20px;
	font-size:15px;
	letter-spacing:0.3px;
	color:#000;
	}	
.mobilemenu li a:hover{color:#000;}


/*REVIEW*/
.top-review-strip{
	float:left;
	width:100%;
	background:#dcdcdc;
	padding:10px 0;
	}
.learn-more-text{
	display:inline-block;
	vertical-align:top;
	font-size:16px;
	line-height:20px;
	letter-spacing:0.3px;
	color:#000000;
	cursor:pointer;
	}
.learn-more-text span{
	border-bottom:1px solid #737373;
	}
.learn-more-text img{
	display:inline-block;
	vertical-align:middle;
	margin:-2px 0 0 3px;
	}
.learn-more-text.active img{
	transform:rotate(-180deg);
	}
.learn-more-open{
	font-size:12px;
	line-height:16px;
	color:#000;
	}

/*-----------------------
		MAIN SECTION
------------------------*/
.main-sec {
    float:left;
    width:100%;
	overflow:hidden;
	padding:45px 0;
	}
.inner-container{
	display:inline-block;
	vertical-align:top;
	width:100%;
	max-width:1060px;
	}
.left-section{
	float:left;
	width:68%;
	text-align:center;
	}
.main-head{
	float:left;
	width:100%;
	font-size:40px;
	line-height:50px;
	font-weight:bold;
	color:#000000;
	text-align:center;
	}
.banner-txt{
	float:left;
	width:100%;
	font-size:25px;
	line-height:32px;
	letter-spacing:0.5px;
	font-weight:normal;
	color:#000000;
	text-align:center;
	margin-top:10px;
	}
.anchor-btn-box{
	float:left;
	width:100%;
	margin-top:25px;
	display:flex;
	justify-content:space-between;
	align-items:center;
	}
.anchor-btn-box a{
	//border:2px solid #2a2a2a;
	border-radius:0px;
	font-size:15px;
	font-family:futura;
	height:40px;
	line-height:37px;
	color:#000000;
	padding:0 12px;
	text-align:center;
	background-color:#;
	}
.anchor-btn-box a.active,.anchor-btn-box a:hover{
	border:1px solid #000;
	font-weight:500;
	}

.video-box{
	float: left;
    width: 100%;
    position: relative;
    overflow: hidden;
	margin-top:28px;
	}
.full-img {
	display:block;
	margin:0 auto;
	width:100%;
	}
.heighlights-row{
	float: left;
    width: 100%;
    margin: 5px 0 0 0;
	}
.common-head{
	float:left;
	width:100%;
	font-size:30px;
	line-height:35px;
	font-weight:500;
	padding-bottom:18px;
	border-bottom:3px solid #287cf0;
	margin-top:35px;
	text-align:left;
	}
.heighlights-list{
	float:left;
	width:100%;
	margin-top:35px;
	text-align:left;
	}
.heighlights-list h3{
	font-size:22px;
	line-height:26px;
	color:#000000;
	font-weight:500;
	padding-left:38px;
	background:url(../images/check.png) no-repeat left 1px;
	background-size:23px;
	}
.heighlights-list > div{
	float:left;
	width:100%;
	margin-top:10px;
	padding-left:38px;
	}
.heighlights-list > div p{
	font-size:18px;
	line-height:26px;
	letter-spacing:0.3px;
	color:#000000;
	}
.heighlights-list ul{
	float:left;
	width:100%;
	margin-top:5px;
	padding-left:58px;
	}
.heighlights-list ul li{
	float:left;
	width:100%;
	text-align:left;
	font-size:18px;
	line-height:26px;
	letter-spacing:0.3px;
	color:#000000;
	margin-top:12px;
	list-style:disc;
	}
.expect{
	float:left;
	width:100%;
	padding:30px 25px 25px 25px;
	background-color:#f4f9ff;
	margin-top:40px;
	}
.month{
	float:left;
	width:100%;
	margin-top:38px;
	margin-bottom:8px;

	background:url(../images/calender.png) no-repeat left center;
	padding-left:50px;
	color:#287cf0;
	font-size:22px;
	line-height:36px;
	font-weight:500;
	text-align:left;
	}
ul.month-list{
	float:left;
	width:100%;
	padding-left:30px;
	}
ul.month-list li{
	float:left;
	width:100%;
	text-align:left;
	font-size:18px;
	line-height:26px;
	letter-spacing:0.3px;
	color:#000000;
	margin-top:12px;
	list-style:disc;
	}
	
.common-text{
	float: left;
    width: 100%;
	font-size:18px;
	line-height:28px;
	letter-spacing:0.3px;
	color:#000000;
	font-weight:normal;
	margin-top:30px;
	text-align:left;
	}
.highlight{
	font-weight:bold;
	background:url(../images/highlight-background.png) no-repeat center center;
	background-size:100%;
	}
.author-section{
	float:left;
	width:100%;
	margin-top:40px;
	border-top:3px solid #287cf0;
	border-bottom:3px solid #287cf0;
	padding:0 0 30px;
	}
.author-sign{
	float:left;
	max-width:165px;
	width:100%;
	margin-top:20px;
	}
.author-name{
	float:left;
	width:100%;
	font-size:16px;
	line-height:26px;
	color:#000000;
	font-weight:normal;
	margin-top:10px;
	text-align:left;
	}
.author-name span{
	display:block;
	font-weight:600;
	font-size:18px;
	}
.quality-list{
	display:inline-block;
	vertical-align:top;
	width:100%;
	padding-left:25px;
	}
.quality-list li{
	float:left;
	width:100%;
	font-size:19px;
	line-height:27px;
	color:#000000;
	margin-top:5px;
	list-style:disc;
	text-align:left;
	}

	
	
.ingredients{
	float:left;
	width:100%;
	margin:10px 0 20px 0;
	}
.ingredients-box{
	float:left;
	width:100%;
	}
.ingredients-box-row{
	float:left;
	width:100%;
	margin-top:30px;
	padding-bottom:30px;
	position:relative;
	}
.ingredients-box-row:before{
	position:absolute;
	left:38px;
	bottom:0;
	right:0;
	border-bottom:1px solid #ddd;
	content:"";
	}
.ingredients-box-row:last-child{ padding-bottom:0;}
.ingredients-box-row:last-child:before{ display:none;}
.ingredients-head{
	float:left;
	width:100%;
	text-align:left;
	padding-left: 38px;
	background: url(../images/check.png) no-repeat left 2px;
    background-size: 23px;
	font-size:22px;
	line-height:26px;
	font-weight:500;
	color:#000000;
	letter-spacing:0.3px;
	position:relative;
	}
.ingredients-head-avoid{
	background: url(../images/cross.png) no-repeat left 1px;
    background-size: 23px;
	}
.ingredients-content{
	float:left;
	width:100%;
	text-align:left;
	margin-top:8px;
	padding:0 0 0 38px;
	}
.ingredients-content p{
	float: left;
    width: 100%;
    font-size: 18px;
    line-height: 26px;
	letter-spacing:0.3px;
    color: #000000;
	}
a.ingredients-btn{
	display:inline-block;
	vertical-align:top;
	width:100%;
	max-width:400px;
	margin-top:40px;
	font-size:19px;
	line-height:25px;
	background:#0c8d2a;
	border-radius:5px;
	padding:15px;
	text-align:center;
	color:#fff;
	font-weight:500;
	letter-spacing:0.3px;
	}
.quality-box{
	float:left;
	width:100%;
	margin-top:30px;
	}
.quality-row{
	float:left;
	width:100%;
	margin-top:26px;
	padding-bottom:30px;
	text-align:left;
	border-bottom:1px solid #ddd;
	}
.quality-row:last-child{ border:none;}
.quality-head{
	float:left;
	width:100%;
	font-size:24px;
	line-height:28px;
	letter-spacing:0.3px;
	font-weight:500;
	color:#000000;
	}
.quality-para{
	float:left;
	width:100%;
	margin-top:10px;
	font-size:18px;
	line-height:26px;
	letter-spacing:0.3px;
	color:#000000;
	}

.top{
	float:left;
	width:100%;
	}
.blue-head{
	float:left;
	width:100%;
	margin-top:40px;
	font-size:60px;
	line-height:40px;
	font-weight:bold;
	color:#1f1f1f;
	text-align:left;
	}
ul.top-moisturizers-list{
	float:left;
	width:100%;
	margin-top:10px;
	padding-left:20px;
	}
ul.top-moisturizers-list li{
	float:left;
	width:100%;
	margin-top:10px;
	font-size:15px;
	line-height:26px;
	color:#000000;
	letter-spacing:0.3px;
	text-align:left;
	list-style:decimal;
	}
ul.top-moisturizers-list li span{
	font-weight:200;
	color:#5a5a5a;
	}
	
.pros-cons{
	float:left;
	width:100%;
	margin-top:40px;
	border-radius:4px;
	border:1px solid #d1d1d1;
	padding:30px 20px;
	text-align: center;
	}
.pros-box-head{
	float:left;
	width:100%;
	font-size:26px;
	line-height:30px;
	font-weight:500;
	color:#287cf0;
	text-align: left;
	padding-left: 50px;
    position: relative;
	}
.pros-box-head span{
	position:absolute;
	top:0;
	left:10px;
	color:#000000;
	font-weight:normal;
	}
.batch{
	display:inline-block;
	vertical-align:middle;
	margin:-5px 0 0 10px;
	width:30px;
	}
.pros-rating-box{
	float:left;
	width:100%;
	border-bottom:1px solid #d1d1d1;
	padding:30px 10px 30px;
	}
.prod-img{
	display: block;
    margin: 0 auto;
    max-width: 100%;
	}
.prod-img1{
	width:240px;
	}
.prod-img2{
	width:180px;
	}
.prod-img3{
	width:160px;
	}
.prod-img4{
	width:260px;
	}
.prod-img5{
	width:225px;
	}
	
.pros-text-box{
	float:left;
	width:100%;
	margin-top:40px;
	padding-bottom:40px;
	border-bottom:1px solid #ddd;
	}
.pros-col{
	width:50%;
	position:relative;
	}
.pros-col.fl{ float:left; padding-right:20px;}
.pros-col.fr{ float:right; padding-left:20px;}
.pros-col.fl:before{
	content:'';
	width:1px;
	background-color:#b6b6b6;
	position:absolute;
	right:0;
	top:70px;
	bottom:0;
	}
.pros-head{
	float:left;
	width:100%;
	font-size:22px;
	line-height:30px;
	font-weight:500;
	letter-spacing:0.5px;
	color:#ffffff;
	border-radius:5px;
	padding: 13px 20px;
	text-align:left;
	}
.green-background{background:#0c8d2a;}
.red-background{ background:#ff0000;}
.pros-list{
	float:left;
	width:100%;
	}
.pros-list li{
	float:left;
	width:100%;
	margin-top:25px;
    font-size: 18px;
    line-height: 26px;
	letter-spacing:0.3px;
    color: #000000;
    font-weight: normal;
	text-align:left;
	}
.pros-list li sup{
	position:relative;
	font-size:60%;
	top:0;
	right:0;
	}
.pros li{padding-left:40px; background:url(../images/check.png) no-repeat 4px 2px;background-size: 22px;}
.cons li{padding-left:40px; background:url(../images/cross.png) no-repeat 4px 2px;background-size: 22px;}
.more-feature{
	float:left;
	padding-left:40px;
	margin-top:30px;
	font-weight:500;
	color:#000;
	font-size:18px;
	line-height:26px;
	text-decoration:underline;
	}
.review{
	float:left;
	width:100%;
	text-align:left;
	margin-top:30px;
	}
.t-star{
	float:left;
	width:100px;
	}
.t-para{
	float: left;
    width: 100%;
	font-size: 18px;
    line-height: 26px;
    letter-spacing: 0.3px;
    color: #000000;
    font-weight: normal;
	margin-top:15px;
	}
.t-name{
	float: left;
    width: 100%;
	font-size: 18px;
    line-height: 26px;
    letter-spacing: 0.3px;
    color: #000000;
    font-weight: 500;
	margin-top:15px;
	}
.t-name span{
	font-weight:normal;
	color:#a5a5a5;
	padding-left:15px;
	font-size:16px;
	}

.more-info-box{
	float:left;
	width:100%;
	margin-top:40px;
	}
.more-info-box-head {
    float: left;
    width: 100%;
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.5px;
    color: #000000;
    border-radius: 5px;
    padding: 13px 20px;
    text-align: left;
	background:#dcdcdc;
	}
.more-info-box-inner{
	float:left;
	width:100%;
	margin-top:25px;
	}
ul.key-list{
	float:left;
	width:100%;
	}
ul.key-list li{
	float:left;
	min-width:90px;
	border:1px solid #ccc;
	padding:8px 15px;
	border-radius:5px;
	margin-right:7px;
	font-size:15px;
	line-height:20px;
	color:#232323;
	cursor:pointer;
	}
ul.key-list li.active{
	border:1px solid #000;
	font-weight:500;
	}
.key-content{
	float:left;
	width:100%;
	margin-top:10px;
	}
ul.key-feature{
	float: left;
    width: 100%;
    padding-left: 30px;
	}
ul.key-feature li{
	float: left;
    width: 100%;
    text-align: left;
    font-size: 18px;
    line-height: 26px;
    letter-spacing: 0.3px;
    color: #000000;
    margin-top: 15px;
    list-style: disc;
	}
.btn-box{
	display:inline-block;
	width:100%;
	max-width:400px;
	text-align:center;
	margin-top:40px;
	}
.get-btn{
	float:left;
	width:100%;
	height:60px;
	font-size:19px;
	line-height:60px;
	background:#287cf0;
	font-weight:500;
	color:#ffffff;
	border-radius: 6px;
	}
.get-btn img{
	display:inline-block;
	vertical-align:middle;
	margin:-3px 0 0 5px;
	}
.citations{
	float:left;
	width:100%;
	margin-top:30px;
	}
.citations ul{
	float:left;
	width:100%;
	margin-top:15px;
	padding-left:20px;
	}
.citations ul li{
	float:left;
	width:100%;
	font-size:17px;
	line-height:23px;
	letter-spacing:0.3px;
	margin-top:10px;
	list-style:decimal;
	padding-left:5px;
	color:#000000;
	word-break:break-all;
	text-align:left;
	}
.citations ul li a{
	color:#000;
	word-break:break-all;
	}
	

.right-section{
	float:right;
	width:28%;
	}
.right-box{
	float:left;
	width:100%;
	margin-top:20px;
	border:1px solid #e1e1e1;
	}
.right-header{
	float:left;
	width:100%;
	background-color:#287cf0;
	padding:15px;
	color:#fff;
	font-size:22px;
	line-height:30px;
	font-weight:bold;
	}
.right-box-inner{
	float:left;
	width:100%;
	padding:0 20px 20px;
	text-align:center;
	}
.source-pic{
	display:block;
	margin:20px auto 0;
	max-width:100%;
	}
.right-txt{
	font-size:16px;
	line-height:23px;
	letter-spacing:0.5px;
	font-weight:normal;
	color:#000000;
	margin-top:10px;
	}

.right-rat-box-inner{
    float: left;
    width: 100%;
    text-align: center;
    margin-top: 30px;
	}


.progressR{
	background-image: -webkit-linear-gradient(215deg, #ddd 50%, transparent 50%), linear-gradient(180deg, #0c8d2a 50%, #ddd 50%);	
	background-image: linear-gradient(215deg, #ddd 50%, transparent 50%), linear-gradient(180deg, #0c8d2a 50%, #ddd 50%);
	}

.rating-about {
    float: left;
    width: 100%;
    margin-top: 15px;
    font-size: 18px;
    line-height: 22px;
    font-weight: 500;
    color: #000;
	}
.right-list{
	float:left;
	width:100%;
	}
.right-list li{
	float:left;
	width:100%;
	margin-top:16px;
	font-size:18px;
	line-height:24px;
	letter-spacing:0.3px;
	color:#000;
	font-weight:normal;
	text-align:left;
	padding-left:35px;
	background:url(../images/check.png) no-repeat left 1px;
	background-size: 21px;
	}

.right-blue-head{
	float:left;
	width:100%;
	margin-top:10px;
	font-size:24px;
	line-height:26px;
	color:#287cf0;
	font-weight:bold;
	}
.right-bold-txt{
	float:left;
	width:100%;
	margin-top:10px;
	font-size:18px;
	line-height:24px;
	color:#000000;
	font-weight:500;
	}
.star-pic{
	display:inline-block;
	vertical-align:top;
	max-width:100%;
	margin-top:20px;
	}
.right-txt2{
	float:left;
	width:100%;
	margin-top:10px;
	font-size:17px;
	line-height:23px;
	color:#000000;
	font-weight:normal;
	}
.right-prod{
	display:block;
	max-width:100%;
	margin:20px auto 0;
	width:200px;
	}
.btn-box-rght{
	display: inline-block;
    width: 100%;
    max-width: 400px;
    text-align: center;
    margin-top: 30px;
	}
.learn-btn{
	float:left;
	width:100%;
	height:55px;
	font-size:19px;
	line-height:55px;
	background:#287cf0;
	letter-spacing:0.5px;
	font-weight:500;
	color:#ffffff;
	border-radius: 6px;
	}
.learn-btn img{
	display:inline-block;
	vertical-align:middle;
	margin:-3px 0 0 5px;
	}

/*=========ARTICLE==========*/
.articles-section{
	float:left;
	width:100%;
	padding:60px 0;
	}
.articles-heading{
    font-size: 40px;
    line-height: 45px;
    font-weight: 500;
    padding-bottom: 18px;
    border-bottom: 3px solid #287cf0;
	}
.article-box{
	width: 100%;
    display: flex;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    flex-wrap: wrap;
	margin:0 auto;
	}
.article-box-col{
	width:31%;
	text-align:center;
	margin:40px 3% 20px 0;
	}
.article-box-col:nth-child(3n){ margin-right:0;}
.article-img{
	display:inline-block;
	vertical-align:top;
	max-width:100%;
	border-radius:8px;
	}
.article-content{
	float:left;
	width:100%;
	margin-top:20px;
	}
.article-date{
	font-size:22px;
	line-height:30px;
	color:#000000;
	}
.article-name{
	font-size:28px;
	line-height:33px;
	letter-spacing:0.3px;
	color:#000000;
	font-weight:bold;
	margin-top:15px;
	}
	

.footer{
	float:left;
  width:100%;
	overflow:hidden;
	padding:60px 0;
	border-top:1px solid #e8e8e8;
	background-color: #f6f6f6;
	}

	.footer2{
		float:left;
	  width:100%;
		overflow:hidden;
		padding:60px 0;
		border-top:1px solid #e8e8e8;
		background-color: #f6f6f6;
		}



.policy-list{
	float:left;
	width:100%;
	text-align:center;
	}
.policy-list li{
	display:inline-block;
	padding:0 15px;
	font-size:18px;
	line-height:26px;
	font-weight:normal;
	color:#000000;
	}
.footer-text{
	float:left;
	width:100%;
	font-size:15px;
	line-height:24px;
	letter-spacing:0.3px;
	font-weight:normal;
	color:#000000;
	margin-top:30px;
	}
.problem-box{
	float:left;
	width:100%;
	background:#fff6f6;
	padding:25px;
	margin-top:40px;
	border:1px solid #ff9393;
	border-radius:7px;
	}
.color-red{ color:#F00;}
.green{ color:#0c8d2a; border-bottom:3px solid #0c8d2a;}
.red{ color:#ff0000; border-bottom:3px solid #ff0000;}
.marg-t0{ margin-top:0 !important;}
.marg-t10{ margin-top:10px !important;}
.marg-t20{ margin-top:20px;}
.marg-t50{ margin-top:50px;}
.font-21{ font-size:21px;}
.fr{ float:right;}
.fl{ float:left;}


/*=========reader-sec=============*/
.reader-sec{
	float:left;
	width:100%;
	}
.reading-progress {
	position: relative;
	height: 110px;
	width: 110px;
	z-index: 999;
	display: inline-block;
	vertical-align:top;
	overflow: visible;
	}
.reading-progress .percent {
	position:absolute;
	top: 35px;
	font-size: 28px;
	font-weight: 700;
	font-style: normal;
	text-align: center;
	color: #000;
	width: 100%
	}
.reading-progress svg path {
	fill: none
	}
.reading-progress svg.progress-circle {
	overflow: visible;
	fill: #cdcdcd;
	z-index: 999
	}
.reading-progress svg.progress-circle-background {
	overflow: visible;
	fill: #cdcdcd;
	position: relative;
	top: -115px;
	z-index: -1
	}
.reading-progress svg.progress-circle path {
	stroke: #0c8d2a;
	stroke-width: 7
	}
.reading-progress svg.progress-circle-background path {
	stroke: #cdcdcd;
	stroke-width: 7;
	stroke-dashoffset: 0
	}
	
	

/*---------Media Querry---------*/

@media (min-width: 1022px) {
    .menu-fix-bar-mob {
        display: none;
    }
	.footer1 {
		display:none;
	}
}

@media (max-width:1021px){
	.footer2{display:none;}
}

@media only screen and (max-width:1200px){
.container{width:1004px;}

.left-section{width:69%;}
.anchor-btn-box a{ padding:0 10px;}

.right-box-inner { padding: 0 15px 20px;}
.policy-list li { padding: 0 13px;}


}


@media only screen and (max-width:1021px){
.container{width:750px;}
.show-desk {display: none;}
.show-tab {display: block;}

.main-head { font-size: 37px; line-height:48px;}
.anchor-btn-box{margin: 0 auto; margin-top:25px;display: block;overflow-x: scroll; -webkit-overflow-scrolling: touch; white-space: nowrap;}
.anchor-btn-box a{display: inline-block;vertical-align: middle;position: relative;}

.common-head { font-size: 28px; line-height: 36px;}
.blue-head{ font-size:36px;}

.right-header { padding: 15px 10px; font-size: 20px; line-height: 28px;}
.right-box-inner { padding: 0 10px 20px;}

.article-name{ font-size:22px; line-height:28px;}

.policy-list li{font-size: 16px; line-height: 23px;padding: 0px 6px; letter-spacing:0.3px;}

}


@media only screen and (max-width:767px){
.container{width:100%; padding:0 15px; max-width:600px; box-sizing:border-box;}
.show-desk{display:none;}
.show-mob{display:block;}
.hide-mob{ display:none;}


.logo{ width:120px; margin:10px 0 0 0;}
.header { height: 55px; }

.mob-mnu-ic{ top:18px; right:20px;}
.mobilemenu{ top:56px;}
.mobimenu-top{ top:55px;}

.learn-more-text{ font-size:12px; line-height:18px;}
.learn-more-text img{ width:10px;}
.learn-more-open {font-size: 11px;line-height: 15px;letter-spacing: 0.5px; padding:0 10px;}

.main-sec { padding: 20px 0 20px;}
.left-section{ width:100%;}
.main-head { font-size: 27px; line-height: 32px;}
.menu-fix-bar-mob { float:left; width:calc(100% + 30px); margin-left:-15px;}
.anchor-btn-box { margin-top:20px; padding-left:10px;}
.fixed-nav-mob .anchor-btn-box  {
    position: fixed;
    z-index: 11;
    -webkit-transition: margin .3s ease-out;
    transition: margin .3s ease-out;
    margin-top: 0;
    top: 0;
	left:0;
	background:#fff;
	padding-left:0;
	}
.anchor-btn-box a {  font-size: 13px;line-height: 38px; margin-top: 0; margin-left:3px;}
.video-box{ margin-top:20px;}
.common-text {font-size: 16px;line-height: 24px;margin-top: 20px;}
.common-head{margin-top: 20px;font-size: 23px; line-height: 28px;padding-bottom: 13px;}
.heighlights-list{ margin-top:25px;}
.heighlights-list h3{font-size: 18px;line-height: 22px;background-size: 20px;padding-left: 30px; letter-spacing:0.3px;}
.heighlights-list > div{ padding:0;}
.heighlights-list > div p{font-size: 16px;line-height: 24px;}
.heighlights-list ul{padding-left: 24px;}
.heighlights-list ul li{font-size: 16px;line-height: 24px;margin-top: 10px;}
.expect { padding: 20px 15px 20px 15px;margin-top: 20px;}
.month{padding-left: 30px;font-size: 18px;margin-top: 20px; background-size:20px;}
ul.month-list{padding-left: 25px;}
ul.month-list li{font-size: 16px; line-height: 24px;margin-top: 8px;}

.ingredients-box-row{margin-top: 25px; padding-bottom:18px;}
.ingredients-box-row:before{ left:0;}
.ingredients-head { font-size: 18px; line-height: 22px; background-size: 20px; padding-left: 30px; letter-spacing: 0.3px;}
.ingredients-content{padding: 0;}
.ingredients-content p{font-size: 16px;  line-height: 24px;}
a.ingredients-btn{ margin-top:10px; font-size:17px; letter-spacing:0.5px;}

.quality-box{ margin-top:10px;}
.quality-row{ margin-top:20px; padding-bottom:20px;}
.quality-head{font-size: 18px; line-height: 26px;}
.quality-para{font-size: 16px; line-height: 24px;}

.blue-head{font-size: 25px;line-height: 30px;margin-top: 20px;}
ul.top-moisturizers-list li{font-size: 15px;line-height: 24px;}

.pros-cons{ margin-top:20px; padding:20px 15px;}
.pros-box-head{font-size: 20px; line-height: 24px;padding-left: 20px;}
.pros-box-head span{ left:0;}
.batch{ width:20px; margin:-5px 0 0 3px;}
.pros-rating-box{ padding:20px 0;}
.prod-img1{ width:150px;}
.prod-img2,.prod-img3{ width:100px;}
.prod-img4,.prod-img5{ width:130px;}
.pros-text-box{ margin-top:0; padding-bottom:0; border:none;}
.pros-col{ width:100%; margin-top:20px;}
.pros-col.fl,.pros-col.fr{ padding:0;}
.pros-col.fl:before{ display:none;}
.pros-head{font-size: 20px; line-height: 26px;padding: 10px 15px;}
.pros-list li{margin-top: 15px;font-size: 16px; line-height: 24px;}
.pros li,.cons li{padding-left: 32px;background-size: 18px; background-position:4px 3px;}
.more-feature{padding-left: 30px;margin-top: 15px;font-size: 15px; line-height: 26px;}
.review{ margin-top:22px; padding-top:20px; border-top:1px solid #ddd;}
.t-star{ width:80px;}
.t-para{font-size: 16px;  line-height: 24px;margin-top: 12px;}
.t-name{font-size: 15px;  line-height: 24px;margin-top: 12px;}
.t-name span{ font-size:14px;}
.more-info-box{ margin-top:20px;}
.more-info-box-head{font-size: 18px;line-height: 26px;padding: 10px 15px;}
.more-info-box-inner{ margin-top:20px;}
ul.key-list li{padding: 8px 10px;font-size: 13px; line-height: 16px;min-width: 80px;margin-right: 5px;}
ul.key-feature{ padding-left:23px;}
ul.key-feature li{font-size: 16px;line-height: 24px;margin-top: 10px;}
.btn-box{ margin-top:25px;}
.get-btn{height: 55px;font-size: 18px;line-height: 54px; letter-spacing:0.5px;}

.citations{ margin-top:10px;}
.citations ul{margin-top: 10px;}
.citations ul li{font-size: 15px; line-height: 21px;}

.right-section { float: left; width: 100%; margin-top: 30px; display:none;}
.right-list li { background: url(../images/pros-check.png) no-repeat 0px 2px;}
.right-list li { line-height: 25px;}
.right-box-inner { padding: 0 10px 15px;}

.articles-section{ padding:20px 0 30px;}
.articles-heading{font-size: 24px;line-height: 25px;padding-bottom: 10px;}
.article-box-col{ width:100%; margin:35px 0 0; padding:0 10px;}
.article-content{ margin-top:15px;}
.article-date {font-size: 18px;line-height: 22px;}
.article-name { font-size: 22px; line-height: 28px; letter-spacing:0.5px;margin-top: 10px;}


.marg-t20 {margin-top: 10px;}

.footer{ padding:25px 0;}
.policy-list li{padding: 0 8px;font-size: 13px; line-height: 17px;}
.footer-text{ font-size:14px;}


.reading-progress-mob{
	display: block;
    position: fixed;
    top: auto;
    bottom: 10px;
    left: auto;
    right: 10px;
    margin: 0;
    z-index: 1;
	}
.reading-progress{height: 50px;width: 50px;background: #fff;border-radius: 35px;}
.reading-progress .percent{top: 16px;font-size: 14px;}
.reading-progress svg.progress-circle-background {top: -55px;}

}