@charset "utf-8";
/* CSS Document */
	
.fv5 {font-family:HP Simplified}
.fv5 h1, .fv5 h2, .fv5 h3, .fv5 h4, .fv5 p.light { font-weight:100; padding:0; margin:0}


body{overflow-y:scroll; overflow-x:hidden}
.fv5 img{max-width:100%}
.fv5 .button-trans{background-color:rgba(255,255,255,.0); border:1px solid #0096d6; color:#0096d6; border-radius:3px; display:inline-block; padding:15px 30px; font-size:16px}
.fv5 .button-trans:hover{border:1px solid #007dba;color:#007dba; text-decoration:none}

.fv5 .titleBanner{background:url(/wcsstore/hpusstore/Banners/07-31_slp_btsSale.jpg) no-repeat top center; background-size:cover; text-align:center}
.fv5 .titleBanner .spacer{padding:50px 3%;}
.fv5 .titleBanner h1{display:none}
.fv5 .titleBanner p{font-size:28px; line-height:32px; margin-top:20px; color:#fff}	

.fv5 .blackHeroBanner {
	background: rgba(15, 15, 15, 0.8)!important;
	display: inline-block;
	padding: 5px 5% 35px;
	margin-bottom: 1%;
	float:right;
	margin-right:20%
}
.fv5 .blackHeroBanner h2{font-size:70px; color:white}
.fv5 .blackHeroBanner p.bottomtext{margin-top:0;}

.f-nav{position: fixed!important; left: 0; top: 0; width:100%; z-index:999}

@media only screen and (max-width: 1024px) {
		.fv5 .titleBanner{height:auto}
		.fv5 .titleBanner .spacer{padding:5%;}
		
	}
@media only screen and (max-width: 32em) {
		.fv5 .titleBanner .spacer{padding:5% 10%;}
		.fv5 .titleBanner p{font-size:20px; line-height:24px; margin-top:5%;}	
		
	}


.fv5 .scrollUp-btn{position: fixed; right: 25px; bottom: 25px; z-index:99999; width:50px; height:50px; border-radius:50px; background:url(/wcsstore/hpusstore/Treatment/md-nav-arrowUp.png) center no-repeat #FFF; -webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5);-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5);box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5); display:none}

.fv5 .pcats {max-width:1216px; margin:auto; color:#5a5a5a; padding-bottom:10%}
.fv5 .pcats .titleCont{text-align:center; margin:4% 0}
.fv5 .pcats .titleCont h2{font-size:48px;}
.fv5 .pcats .titleCont p{font-size:28px; line-height:32px; font-weight:100}

.fv5 .pcrow{position:relative; clear:both; overflow:hidden; margin:40px 0}
.fv5 .pcrow .images{}
.fv5 .pcrow .descCopy{position:absolute;}
.fv5 .pcrow .descCopy h3{ color:#167cba; font-size:48px; line-height:56px;}
.fv5 .pcrow .descCopy h3 span{display:block; width:42px; height:6px; background-color:#167cba; margin-left:3px}
.fv5 .pcrow .descCopy h4{color:black; font-size:18px; font-weight:normal; margin-bottom:10px}
.fv5 .pcrow .descCopy p{line-height:22px; font-weight:100; margin-bottom:25px; color:black}
.fv5 .pcrow .descCopy .pc-price{font-size:18x; line-height:22px; font-weight:100; margin-bottom:25px}
.fv5 .pcrow .descCopy .pc-price span{font-size:30px; color:black}
.fv5 .pcrow .descCopy .pc-price sup{position:relative; vertical-align:baseline; bottom:8px; font-size:60%}
.fv5 .t05right{text-align:right}
.fv5 .t05left{text-align:left}
.fv5 .show-tablet-down{display:none}
.fv5 .paddingforpc{padding-top:40px}

.fv5 .line{width: 12%;margin: 0.7rem 1rem;border-width: 2.2px 0 0;display:inline-block;}


@media only screen and (min-width: 70em) {
	.fv5 .whiteTextforPC{color:#fff!important}
	.fv5 .button-trans.dark{border-color:#fff; color:#fff}
}

@media only screen and (max-width: 70em) {
		.fv5 .paddingforpc{padding:0}
		.fv5 .pcrow .images{ text-align:center!important;}
		.fv5 .pcrow .images img{margin:0!important}
		.fv5 .pcrow .descCopy{position:inherit; text-align:center; top:auto!important; left:auto!important; right:auto!important; margin:30px auto 50px; padding:0 5%; max-width: 450px!important;}
		.fv5 .pcrow .descCopy h3 span{margin:auto}
		.fv5 .t05right{text-align:left}
		.fv5 .t05left{text-align:right}
		.fv5 .show-pc-up{display:none}
		.fv5 .show-tablet-down{display:block}
		.fv5 .halfImgsize{max-height:400px}
		
}
@media only screen and (max-width: 62em) {
		.fv5 .pcats .titleCont h2{font-size:42px;}
		.fv5 .pcats .titleCont p{font-size:22px; line-height:28px; margin:0 10%}
		
	}
@media only screen and (max-width: 32em) {
		.fv5 .pcats .titleCont h2{font-size:36px;}
		.fv5 .pcats .titleCont p{font-size:18px; line-height:24px; margin:0 10%}

	}


.pre_orderMDP.standard_price {
    min-height: 10px !important;
}


/*FOR SMB BUNDLE PAGE*/
.fv5 .titleBannerSMB{background:url(/wcsstore/hpusstore/Treatment/SMB-bundle-hero.jpg) no-repeat top center; height:400px; background-size:cover; text-align:center}
.fv5 .titleBannerSMB .spacer{padding-top:40px; overflow:hidden}
.fv5 .titleBannerSMB h1{display:none}
.fv5 .titleBannerSMB p{font-size:28px; line-height:32px; margin-top:20px; color:#fff}	
@media only screen and (max-width: 1024px) {
		.fv5 .titleBannerSMB{height:auto}
		.fv5 .titleBannerSMB .spacer{padding:5%;}
		.fv5 .blackHeroBanner{margin-right:0}
	}
@media only screen and (max-width: 32em) {
		.fv5 .titleBannerSMB .spacer{padding:5% 10%;}
		.fv5 .titleBannerSMB p{font-size:20px; line-height:24px; margin-top:5%;}
		.fv5  .blackHeroBanner h2{font-size:40px;}	
		.fv5  .blackHeroBanner p.toptext{font-size:16px}
		.fv5 .line{display:none}
		.fv5 .hide-for-small{display:none}
		
		
	}

