@charset "utf-8";
/*Common css*/
.fv5{clear:both; overflow:hidden}
.fv5 h1, .fv5 h2, .fv5 h3, .fv5 h4, .fv5 h5{font-weight:100; line-height:inherit; margin-bottom:10px}
.fv5 p{color:#767676}
.fv5 a{color:#0095d9}
.fv5 a:hover{text-decoration:underline}
.fv5 .color-black{color:black}
.fv5 .paddingtopbot{padding:2em 0}
.fv5 .paddingbot{padding-bottom:4em}
.fv5 .paddingtopbot2{padding:3em 0}
.fv5 .bringtofront{z-index:99999}
.fv5 .close-reveal-modal.move{top:.3em; right:.4em}
.fv5 .show-for-smaller{display:none}
.fv5 .textWhite{color:#fff!important}
.fv5 sup{font-size:60%}
.fv5 div, .fv5 h1, .fv5 h2, .fv5 h3, .fv5 h4, .fv5 p, .fv5 img, .fv5 a {-webkit-transition: all 0.3s ease-in-out;  -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;  transition: all 0.3s ease-in-out;}
.fv5 .additionalFeature .widthFullCenter{margin-bottom: 40px;}

.fv5 .ebArrowLinkBG{background:url(/wcsstore/hpusstore/Treatment/smb_LinkArrow.png) no-repeat; display:inline-block; margin:20px 0 15px; padding-left:30px; color:#000; line-height:20px;}
.fv5 .ebArrowLinkBG:hover{color:#0096d6 !important;}
.fv5 .white-text{color:#FFF !important;}

.borderbtnstyle{border:1px solid #0096d6; padding:3% 8%; margin-top:20px; display:inline-block;}
.borderbtnstyle:hover{border:1px solid #0077aa; color:#0077aa;  text-decoration:none !important;}



.fv5 .productGallery img{border:1px solid #ccc;}


/*Hero banner */
.fv5 .herobanner .heroText{margin:4% 0}
.fv5 .herobanner .heroText.dark h2, .fv5 .herobanner .heroText.dark h3, .fv5 .herobanner .heroText.dark p, .fv5 .herobanner .heroText.dark span, .darkText{color:white}
.fv5 .herobanner .MDATagLine{ text-align:right; font-size:14px; font-weight:bold; margin-top:20px}
.fv5 .herobanner h2{font-size:24px !important; margin-bottom:15px; font-weight:normal;}
.fv5 .herobanner h3{font-size:36px; margin-bottom:10px}
.fv5 .herobanner p{margin-bottom:15px; font-size:16px; color:black; line-height:22px;}
.fv5 .herobanner p{font-size:18px; font-weight:100;}
.fv5 .StartingatPriceClass{font-size:12px; color:#767676;}
.fv5 .herobanner.EnvyVanilla{background:url(/wcsstore/hpusstore/Treatment/EnvyVanilla_HeroBanner.jpg) no-repeat top center; height:500px;}


.fv5 .FinalPriceRed{color:#d7410b; font-size:38px; font-weight:100; line-height:36px;}
.fv5 .productGallery img{border:1px solid #ccc;}

/*Full bg banner*/
.fv5 .herobanner.EnvyAllday{background:url(/wcsstore/hpusstore/Treatment/EnvyVanilla_AllDay_BG.jpg) no-repeat center 0; height:749px; background-size:cover; margin:0 0}


/*price css*/
.fv5 .pricing span{color:#5a5a5a; font-size:11px}
.fv5 .pricing strong{color:#d7410b; font-size:36px; line-height:38px; font-weight:100; padding-bottom:10px; display:block}
.fv5 .pricing sup{font-size:70%; position:relative; vertical-align:baseline; bottom:8px}

/*Button New css*/
.fv5 .btn-ms-Hero{background: #D7410B; display: inline-block; font-size:16px; font-weight:bold; padding:12px 20px; color:white; white-space:nowrap; border-radius: 0 5px 0 5px;-moz-border-radius: 0 5px 0 5px; -webkit-border-radius: 0 5px 0 5px;}
.fv5 .btn-ms-Hero:hover{background: #c1401a; text-decoration:none}
.fv5 .btn-ms-Hero.small{padding:15px 25px}
.fv5 .btn-ms-Hero.white{background: #fff; color:#1e9cd5; border:1px solid #e2e2e2}
.fv5 .btn-ms-Hero.white:hover{border-color:#ccc}

/*GALLEY start*/
.fv5 .productGallery{max-width:920px; margin:auto}
.fv5 .productGallery .column, .fv5 .productGallery .row{margin:0; padding:0;}
.fv5 .productGallery img{width:100%;}
.fv5 .productGallery a{display:block; margin:2px; cursor:pointer}
.fv5 .productGallery a:hover:before{content:""; background-color:rgba(0,0,0,.5); background-image:url(/wcsstore/hpusstore/Treatment/gallery_magglass.png); background-position:center; background-repeat:no-repeat; position:absolute; top:2px; left:2px; right:2px; bottom:2px;}
.fv5 .productGallery a.video:hover:before{content:""; background-color:rgba(0,0,0,.5); background-image:url(/wcsstore/hpusstore/Treatment/gallery_newplayButton_79x79.png); background-position:center; background-repeat:no-repeat; position:absolute; top:2px; left:2px; right:2px; bottom:2px;}
.fv5 .tumbImages {width:100%; top:0;}
.fv5 .tumbImages img{max-width:60px;}
.fv5 .tumbImages li{float:left; padding:10px; margin:0 20px; cursor:pointer; height:auto; width:auto; border-radius:0; background-color:white }
.fv5 .tumbImages li.active{border-bottom:1px solid #0096d6;}

.fv5 .reveal-modal.fullbleed{padding:20px; left:0; margin-left:0; width:100%; transition: none; box-shadow:none; -webkit-box-shadow:none}
.fv5 .galleryPadding{padding:3% 0; position:relative}

/*Others css*/
.fv5 .bodyCenterContent{margin:auto; max-width:1000px; clear:both; overflow:hidden; position:relative}
.fv5 .sectionHeading{text-align:center; margin:20px 0; font-size:42px}
.fv5 .newSectionHeading {clear: both; text-align: center; width: 100%; margin: 20px auto; border-bottom:1px solid #000; height:34px}
.fv5 .newSectionHeading span {font-size: 36px; line-height: 42px; font-weight: 100; background-color: #fff; padding: 0 20px;}
.fv5 .newSectionHeading.dark {border-bottom:1px solid #fff;}
.fv5 .newSectionHeading.dark span {color:#fff}
.fv5 .newSectionHeading span sup{font-size:50%; position:relative; vertical-align:baseline; bottom:10px}
.fv5 .sectionHeadingPara{text-align:center; margin:0 5%}
.fv5 .singleProduct{width:75%}

/*Foundation update*/
.orbit-container .orbit-prev, .orbit-container .orbit-next{ background-color:transparent!important; height:37px!important; width:20px; margin-top:-20px!important;}
.orbit-container .orbit-prev{background-image:url(/wcsstore/hpusstore/Treatment/smbIcons_leftArrow_20x37.png)!important; background-repeat:no-repeat!important; left:0 }
.orbit-container .orbit-next{background-image:url(/wcsstore/hpusstore/Treatment/smbIcons_rightArrow_20x37.png)!important; background-repeat:no-repeat!important;}
.orbit-container li{height:auto!important}
.orbit-container li img{margin:auto}
.reveal-modal-bg{z-index:9!important}
.fv5 .orbit-bullets{visibility:visible}

/*Value Prop css*/
.oneplace > a:link, .oneplace a {color: #0096d6;font-size: 0.875em;font-family: "HPSimplified",arial;text-decoration: none;}
#valueproppage{z-index: 9999!important;}

/*Footnotes*/
.fv5 .footNote-hpe {clear: both;font-size: 11px;line-height: 16px; color: #767676;margin: 40px 0 0;padding: 40px; border-top:1px solid #ccc;}
.fv5 .noborder{border:none}
.fv5 .footNote-hpe p{font-size: 11px; margin:20px 0}
.fv5 .footNote-hpe ol {list-style: decimal; margin: 0 15px}
.fv5 .footNote-hpe li {padding-bottom: 10px;list-style: decimal;}


/*Callout section*/
.fv5 .callOutsection{clear:both; overflow:hidden; position:relative}
.fv5 .callOutsection .callOut_bodyCenter{max-width:1000px; margin:auto; position:relative}
.fv5 .callOutsection.EnvyVanilla{background:url(/wcsstore/hpusstore/Treatment/EnvyVanilla_FeatureBG.jpg) no-repeat center top; height:1050px; margin:30px 0 0;}
.fv5 .entCallouts{position:absolute; width:300px}
.fv5 .entCallouts h4{font-size:28px; line-height:30px; font-weight:100}
.fv5 .entCallouts p{color:#787779;}
.fv5 .entCallouts .prodImg{display:none}
			
.fv5 .HeroBottomRightContent{position: absolute; font-size: 12px; color:#767676; right: -5%; bottom: -10%;}
.fv5 .width30{float:left; width:30%; padding:2%;}
.fv5 .width70{float:left; width:70%; padding:2%;}
.fv5 .itemsnew{font-size:28px; font-weight:100; margin:10px 0; padding:25px 10px 10px 90px; background-repeat:no-repeat; min-height:80px}

.OJSeriesTable li{font-size:14px; color:#767676; padding-bottom:15px; padding-right:15px;}


/*You might interested new starts*/
.fv5 .MightIntrstMain{background-color:#efefef;}
.fv5 .MightIntrstMain .newSectionHeading span{background-color:#efefef;}
.fv5 .MightIntrstMain h3{min-height:55px; font-size:28px; font-weight:100;}
.fv5 .MightIntrstMain p{font-size:18px; font-weight:100; line-height:22px;}
.fv5 .MightIntrstMain .Mightinterestbtn{padding:12px 35px; color:#0096d6; border:1px solid #0096d6; border-radius:3px; display:inline-block;}
.fv5 .MightIntrstMain .Mightinterestbtn:hover{color:#006490; border:1px solid #006490; text-decoration:none;}


/*Exact medium*/
@media only screen and (max-width: 64em) {
		.fv5 .sectionHeading{font-size:36px}
		.fv5 .singleProduct{width:100%		
}

@media only screen and (max-width: 1000px) {
	.fv5 .callOutsection{background-image:none!important; height:auto!important}
	.fv5 .entCallouts{position: inherit; clear:both; min-height:240px; height:auto; width:100%!important;}
	.fv5 .entCallouts h4{padding-top:30px}
	.fv5 .entCallouts .prodImg{display:inline-block; width:200px; height:200px; border:1px solid #ccc; border-radius:200px; float:left; margin-right:40px}
	.fv5 .entCallouts .prodImg.EnvyVanilla{background:url(/wcsstore/hpusstore/Treatment/EnvyVanilla_FeatureBG.jpg) no-repeat center center;}
	.fv5 .HeroBottomRightContent{bottom:0; right:0;}
}


/*Exact small*/
@media only screen and (max-width: 51.25em) {
.fv5 .needMoreOptions{padding:0 10%}
.fv5 .bannerForSmall{height:auto!important; background-size:cover!important; padding:10px;}
.fv5 .herobanner .heroText{margin:5% 0; background:rgba(55,55,55,.9); padding:5%;}
.fv5 .EnvyAllday .bodyCenterContent{background:rgba(55,55,55,.5);}
.fv5 .herobanner .heroText.dark{background:rgba(0,0,0,.4);!important}

.fv5 .tumbImages li{padding:20px 0; margin:0 10px}

.fv5 .featuredTextCont{margin-bottom:60%; background:rgba(255,255,255,.7); padding:5%;}
}

@media only screen and (max-width:640px) {
	.fv5 .entCallouts{position: inherit; clear:both; min-height:200px; height:auto; width:100%!important;}
	.fv5 .entCallouts .prodImg{display:inline-block; width:150px; height:150px; border-radius:200px; margin-right:30px}
	.fv5 .entCallouts h4{padding-top:0; font-size:24px; line-height:28px}
}
/*below small*/
@media only screen and (max-width: 40.063em) {

.fv5 .newSectionHeading{border:none; height:auto!important}
.fv5 .newSectionHeading span {background-color:transparent; padding:0}
.fv5 .show-for-smaller{display:inline;}
 }
	 
@media only screen and (max-width: 500px) {
				.fv5 .entCallouts .prodImg{float:none; display:block; margin:30px auto 10px auto; border-radius:10px; width:100%; height:8em}
}

@media only screen and (max-width: 30em) {
.hide-for-tiny{display:none}
.show-for-tiny{display:inline!important}
}