@charset "UTF-8";
/* CSS Document */

@media screen and (max-width: 999px){
	/* nav-wrap */
	#header .toplinks{
		position: relative;
	}
	/* menu icon */
	#header #menu-icon{
		width:52px;
		height:51px;
		background:url(../images/menuicon.png) no-repeat;
		padding:0;
		cursor: pointer;
		display: block; /* show menu icon */
		text-indent:-9999em;
		position:absolute;
		left:0;
		top:0;
	}
	/* main nav */
	#header .topinfo{
		display: none; /* visibility will be toggled with jquery */
	}
	#header .expand{
		display:block !important;
	}
}   

@media only screen and (max-width: 495px){
/*--- iPhone only CSS here ---*/
	body{
  		-webkit-text-size-adjust: none;
  	}
	#header .headerc{ width:auto;}
	#header a.logo{float:none; margin:0 auto !important; clear:both; width:250px; height:61px; background-size:100%;}
	#header #menu-icon{ width:40px; height:39px; background-size:100%;}
	#header .topinfo{ font-size:14px;}
	a#backtotop{background-size:75%; background-position:left bottom;}
	.content{
		width:auto;
		padding:0 20px;
	}
	.specialdeal{ padding:250px 20px 20px 20px !important; background-position:top center !important;}
	.vwos .video{ width:auto !important; clear:both; float:none; padding:0;}
	.vwos .video iframe{ width:100% !important; height:180px !important;}
	.vwos .woas{ float:none; clear:both; width:auto; height:auto; padding:20px 10px 125px 10px !important;}
	.vwos .woas br{ display:none;}
	.vwos .jbwoas{ padding-bottom:0 !important; height:auto !important;}
	.vwos .jbwoas .img{ margin-bottom:0;}
	.content h1,.content h2{ font-size:35px; text-align:center;}
	#guaranteepopup{ width:95% !important; padding:35px 20px !important; height:auto !important; bottom:inherit !important;}
	.specialoffer p{ padding:0 10px;}
	.samples{margin-bottom:20px;}
	.samples .facialrestorekit,.samples .totalbodyrepairkit,.samples .totalmakeoverkit,.samples .getstartedkit{ clear:both; float:none; width:100%;}
	.tryfirst a.link{ width:100%; height:100%;}
	.tryfirst h5{ font-size:24px !important; padding:0;}
	.tryfirst h6{ font-size:15px !important;}
	#tabs .tablinks a{ font-size:25px !important; padding:10px 20px !important; display:block !important;}
	#testimonials .royalSlider{ height:900px !important;}
	#testimonials .royalSlider .img img{width:100%; max-width:100%; height:auto;}
	#footer .footerc{ width:auto; padding:0 20px;}
	#footer .leftcolumn,#footer .rightcolumn{ float:none; clear:both; width:auto !important;}
	#footer .footerlinks a{ font-size:16px; margin-right:10px;}
}

/* Landscape Mode */
@media only screen and (max-width: 999px){
	body{
  		-webkit-text-size-adjust: none;
  	}
	#wrapper{ overflow:hidden;}
	#header .headerc{ width:auto;}
	#header a.logo{ float:none; clear:both; margin:0 auto;}
	#header .topinfo{ float:none; clear:both; margin:10px 10px;}
	.content{ width:auto; padding:0 20px;}
	.content h1{ font-size:36px; text-align:center;}
	.content h2{ font-size:42px; text-align:center;}
	.vwos .video{ width:100%; float:none; clear:both; margin:0 auto;}
	.vwos .video iframe{ width:100%; height:300px;}
	.vwos .woas{ float:none; clear:both; width:auto; padding:15px 0 0 0; height:245px;}
	.vwos .woas br{ display:none;}
	.specialoffer{ padding:0 0 20px 0;}
	.specialoffer img.alignright{
		width:100%;
		max-width:100%;
    	height:auto;
    	width:auto\9; /* ie8 */
		float:none;
		margin:0 0 20px 0;
	}
	.specialoffer .leafbottom{ display:none !important;}
	.samples .facialrestorekit,.samples .totalbodyrepairkit{ float:none; margin:0 auto;}
	.samples .totalmakeoverkit,.samples .getstartedkit{ float:none; clear:both; margin:0 auto;}
	.tryfirst{ 
		width:auto !important;
		background-image:none; 
		height:auto !important; 
		padding:0 10px;
		margin:0 20px  !important;
		border:solid 1px #dad6d6;
	    background: -moz-linear-gradient(top, #eceee8 0%, #f9faf9 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eceee8), color-stop(100%, #f9faf9));
		-webkit-border-radius:10px;
		border-radius:10px;
		padding:10px;
		margin:0 10px 20px 10px;
	}
	.tryfirst a.link{ height:120px;}
	.tryfirst h5{ font-size:35px; padding:10px 0 0 0;}
	.tryfirst h6{ font-size:18px;}
	.specialdeal{ width:auto; height:auto;padding-right:20px;}
	.specialdeal br{ display:none;}
	.ourguarantee{ width:auto;}
	#tabs .tablinks{ width:auto;}	
	#tabs .tablinks a#ourstorybtn,#tabs .tablinks a#testimonialsbtn,#ourstory{ display:none !important;}
	#determineskintype{ display:block;}
	#determineskintype .determineskintypec,#faqs ul{ width:auto; margin:0; padding:20px;}
	#determineskintype ul li,#determineskintype .quicktip{ width:auto;}
	#determineskintype ul li{ margin:0 0 20px 0;}
	#determineskintype .skintypes .skintypesc{ width:auto; margin:0 0 50px 0;}
	#faqs ul li hr{ width:auto;}
	#testimonials .testimonialsc{ width:auto;}
	#tabs .tablinks a{ font-size:24px;}
	#testimonials .royalSlider{ width:100% !important; height:800px;}
	#testimonials .royalSlider .img{float:none !important; clear:both !important; margin:0 auto !important;}
	#testimonials .royalSlider .txt{ width:auto !important; left:auto !important; float:none !important; margin:50px !important;}	
	#determineskintype br{ display:none;}
	#footer .footerc{ width:auto; padding-left:20px; padding-right:20px;}
	#footer .leftcolumn{ width:60%;}
	#footer .rightcolumn{ width:35%;}
	#footer .footerlinks a{ font-size:16px; margin-right:10px;}
	#footer p small br,#footer h4 br{ display:none;}
	#footer .emailsignup .input{ width:90% !important;}
}

/* iPad in Portrait orientation */
@media screen and (min-width: 768px) and (orientation: portrait) {
	body{
  		-webkit-text-size-adjust: none;
  	}
}

/* iPad in Landscape orientation */
@media only screen and (device-width: 768px) and (orientation: landscape) {
	body{
  		-webkit-text-size-adjust: none;
  	}
}