#hero {
	background: linear-gradient(to bottom right, #88f1e3, #e8e148);
//	max-height: 850px;
	padding-top:70px;
	overflow:hidden;
}

.hero-image {
	float:right;
	width:55%;
	max-height: 850px;
	margin-right:-15%;
}

@media (max-width:650px) {
	.hero-image {
		float:none;
		width:90%;
	}
}

.hero-image img {
	width: 90%;
	margin: 4% 5% -5px 0;
	max-width:1000px;
}

@media (max-width:1000px) {
.hero-image img {
padding-top:11vw;
}
}

@media (max-width:650px) {
.hero-image img {
width: 135%;
margin: -7% 0% -45vw 21vw;
}
}

.hero-text {
	position: absolute;
	right: 38%;
	left:4%;
	text-align:center;
}

@media (max-width:1200px) {
	.hero-text {
		right: 38%;
	}
}

@media (max-width:1000px) {
	.hero-text {
		margin-bottom: 45px;
	}
}

@media (max-width:650px) {
	.hero-text {
		position: relative;
		right: unset;
		text-align: center;
		left:0;
	}
}

#homepage h1 {
	color:#FFF;
	font-family: FuturaPTCond-ExtraBoldObl;
	font-size: 90px;
	line-height: 80px;
	margin-bottom: 40px;
	text-align:center;
	//transform: skewY(-8deg);
}

@media (max-width:1200px) {
	#homepage h1 {
		margin-bottom: 30px;
	}
}

@media (max-width:1000px) {
	#homepage h1 {
		font-size: 60px;
		line-height: 50px;
	}
}

@media (max-width:650px) {
	#homepage h1 {
		padding: 30px 0 0;
		margin-top:0;
		text-align:center;
	}
}

#hero h3 {
	color:#0E5B62;
	padding-top: 0 !important;
	margin: 0;
	max-width:650px;
	text-align:left;
}

@media (max-width:1800px) {
	#hero h3 {
//		font-size: 34px;
//		line-height:47px;
	}
}

@media (max-width:1200px) {
	#hero h3 {
//		font-size: 30px;
//		line-height:41px;
		padding: 1% 10%;
	}
}

@media (max-width:1000px) {
	#hero h3 {
		font-size: 17px;
		line-height:23px;
		padding: 1% 5% !important;
	}
}

.homepage-hero-cta {
color:#FFF;
background-color:#FF01AA;
margin:2vw 0 2vw;
float:left;
}

.readers-2021-container {
text-align: center;
padding: 0 !important;
max-width: 15vw;
margin-right:18%;
float:right;
}

@media (max-width:1000px) {
.readers-2021-container {
width: 100%;
max-width: 28%;
margin-right:10%;
margin-top:4vw;
}
}

@media (max-width:650px) {
.readers-2021-container {
float:left;
margin:2vw 65% -30vw 5%;
}
}

.readers-2021-container img {
width:auto;
max-width:100%;
}

#homepage .heading-large {
display:block;
color:#fff;
font-size:125px;
line-height:100px;
transform: skewY(-8deg);
}

@media (max-width:1100px) {
#homepage .heading-large {
font-size:11.15vw;
line-height:8.9vw;
}
}

@media (max-width:650px) {
#homepage .heading-large {
//font-size:68px;
font-size:18vw;
//line-height:55px;
line-height:14vw;
}
}

#homepage .heading-small {
display:block;
color:#fff;
font-size:84px;
line-height:74px;
transform: skewY(-8deg);
}

@media (max-width:1100px) {
#homepage .heading-small {
font-size:7.6vw;
line-height:6.75vw;
}
}

@media (max-width:650px) {
#homepage .heading-small {
//font-size:48px;
font-size:13vw;
//line-height:40px;
line-height:12vw;
}
}

#homepage h2 {
	font-family: FuturaPTCond-ExtraBoldObl;
	font-size: 48px;
	line-height: 43px;
	margin-bottom: 0px;
}

@media (max-width:800px) {
	#homepage h2 {
		margin-top:25px;
		margin-bottom:29px;
	}
}

@media (max-width:650px) {
	#homepage h2 {
		font-size: 42px;
		line-height:38px;
	}
}

#homepage h3 {
font-size: 19px;
line-height: 26px;
font-weight: normal;
padding: 50px 30px 1% 5%;
font-family: AvenirLTPro-Roman;
max-width:410px;
}

@media (max-width:1100px) {
#homepage h3 {
font-size: max(16px,1.7vw);
line-height: max(20px,2.25vw);
padding:2vw 4vw 1vw 1vw;
}
}

@media (max-width:650px) {
#homepage h3 {
font-size: 16px;
line-height: 22px;
text-align:left;
}
}

#prettiest-module {
	position:relative;
	width: 100%;
	display: inline-block;
	background-image: url('/images/prettiest-module-bg.png');
	background-size: cover;
	background-position: 70% 75%;
	height: 820px;
}

@media (max-width:780px) {
	#prettiest-module {
		text-align:center;
		background-position: 62% 75%;
	}
}

.prettiest-module-text {
	position: absolute;
	left: 19%;
	top: 13%;
}

@media (max-width:1200px) {
	.prettiest-module-text {
		left: 14%;
	}
}

@media (max-width:780px) {
	.prettiest-module-text {
		position: relative;
		left:unset;
		top:1%;
	}
}

#X_prettiest-module h3 {
	color:#FFF;
	font-family: AvenirLTPro-Roman;
	font-size: 18px;
	line-height: 36px;
	margin-bottom: 18px;
}

@media (max-width:650px) {
	#X_prettiest-module h3 {
		font-size: 17px;
		line-height: 23px;
		margin-bottom: 18px;
	}
}

.prettiest-module-image {
	position: absolute;
	right: 28%;
}

@media (max-width:1200px) {
	.prettiest-module-image {
		right: 15%;
	}
}

@media (max-width:780px) {
	.prettiest-module-image {
		position: relative;
		right:unset;
	}
}

.prettiest-module-image img {
	height: 459px;
	padding-top: 187px;
	background-image: url('/images/shadow.png');
	background-position: 100% 105.25%;
	background-size: 100%;
	background-repeat: no-repeat;
	padding-left: 96px;
	padding-right: 96px;
}

@media (max-width:780px) {
	.prettiest-module-image img {
		height: 350px;
		padding-top: 60px;
		background-position: 100% 112%;
	}
}

.batiste-button, .batiste-button:hover {
	margin: 10px 0;
	padding: 9px;
	text-align: center;
	border-radius: 1px;
	text-decoration: none;
	font-family: FuturaPTCond-BoldObl;
	font-size: 14px;
	min-width:133px;
	display: inline-block;
}

@media (max-width:650px) {
.batiste-button, .batiste-button:hover {
font-size:20px;
padding: 7px 18px 9px;
border-radius:2px;
}
}

.batiste-button {
	background-color: white;
}

.scroll-with-it {
color:#0E5B62;
position:absolute;
z-index:1;
margin-top:-23px;
}

@media (max-width:1150px) {
.scroll-with-it {
margin: -4vw auto 0;
text-align: center;
width: 100%;
}
}

.scroll-with-it-sticker {
font-family: FuturaPTCond-ExtraBoldObl;
transform: skewY(-8deg);
background-color:#fff;
padding:10px 20px;
font-size:24px;
float:left;
margin:0px 15px 0 7vw;
}

@media (max-width:1150px) {
.scroll-with-it-sticker {
float: none;
width: max-content;
margin: auto;
}
}

.scroll-with-it-instructions {
float:right;
font-weight:bold;
}

@media (max-width:1150px) {
.scroll-with-it-instructions {
float: none;
margin: 20px auto;
}
}

@media (max-width:1150px) {
.scroll-with-it-buffer {
padding:2vw 0;
}
}

@media (max-width:650px) {
.scroll-with-it-buffer {
padding:35px 0;
}
}

#ready-in-minutes {
	//background: linear-gradient(to bottom right, #F08D9F, #F2C4C9);
	position:relative;
}

@media (max-width:650px) {
#ready-in-minutes {
//height: 736px;
padding: 12vw 0 14vw;
}
}

#product-promo-module {
	background-image: url('/images/backgrounds/homepage-best-got-better-bg.jpg') !important;
	background-size: cover !important;
	background-position: bottom;
	position:relative;
}

@media (max-width:650px) {
#product-promo-module {
background-position: 65% 60%;
background-size: auto 145% !important;
height: 736px;
}
}

.product-promo-left {
	text-align:left;
	//transform: skewY(-8deg);
	width:36%;
	padding:7% 0 6% 13%;
}

.product-promo-right {
	float:right;
	right:11%;
	position: absolute;
	//transform: translateY(-50%) skewY(-8deg);
	width: 39%;
	top: 80px;
	left: 55%;
	text-align: center;
}

@media (max-width:650px) {
	.product-promo-left, .product-promo-right {
		width:90%;
		padding:unset;
		margin:auto;
		position: relative;
		float: none;
		right: unset;
		top: unset;
		left:unset;
	}
	
	#product-promo-module .product-promo-left {
		padding-top:15vw;
		text-align:center;
	}

	.product-promo-right {
		//padding-bottom:68%;
	}
}

#homepage .product-promo-left h2, #homepage .product-promo-right h2 {
	font-size: 7vw;
	line-height: 6vw;
	margin-top:0;
	color:#FCF450;
}

@media (max-width:650px) {
	#homepage .product-promo-left h2, #homepage .product-promo-right h2 {
		font-size: 16vw;
		line-height: 13vw;
		text-align:center;
	}
}

.iframe-container {
position: relative;
padding-bottom:56.25%;
height: 0;
}

.iframe-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

#X_product-promo-module h3 {
font-size:18px;
line-height:29px;
}

@media (max-width:650px) {
#X_product-promo-module h3 {
line-height:24px;
text-align:left;
margin:3vw auto;
width:86%;
}
}

@media (min-width:1401px) {
	.product-promo-left span, .product-promo-right span {
		display:block;
	}
}

#product-promo-module .batiste-button {
float:right;
}

@media (max-width:650px) {
#product-promo-module .batiste-button {
float:none;
margin-bottom:33vw;
}
}

#live-batiste {
	position:relative;
	background-image: url('/images/live-batiste-homepage-bg.jpg');
	background-size: cover;
	background-position: 50% 100%;
	height: 60vw;
	max-height: 820px;
	margin-top:-6px;
}

@media (max-width:650px) {
	#live-batiste {
		height: 607px;
		background-size: auto 50%;
		background-repeat: no-repeat;
		background-color: rgb(62, 87, 116);
	}
}

#live-batiste div {
	text-align: right;
    background: linear-gradient(to left, rgba(10, 65, 90, .5) 48%,rgba(10, 65, 90, 0) 55%);
    height: 100%;
    padding-right: 12%;
}

@media (max-width:650px) {
	#live-batiste div {
		text-align: center;
		right: auto;
		top: 0;
		width: 90%;
		height:607px;
		padding: 5%;
		background: linear-gradient(rgb(10, 65, 90) 47%,rgba(62, 87, 116, 0) 65%);
	}
}

#live-batiste h2 {
padding-top: 10vw;
margin-top: 0;
}

@media (max-width:650px) {
#live-batiste h2 {
padding-top: 25px;
}
}

#live-batiste h3 {
float: right;
padding: 0px 30px 0 50px;
width: 42%;
}

@media (max-width:650px) {
#batiste-nation h3 {
width: 90%;
}
}

#live-batiste a {
clear:both;
float: right;
margin-right:4vw;
}

@media (max-width:650px) {
#live-batiste a {
clear:both;
float: none;
}
}

#X_live-batiste h3 {
	font-family: AvenirLTPro-Roman;
	font-size: 18px;
	line-height: 29px;
//	margin-bottom: 65px;
}

@media (max-width:650px) {
	#X_live-batiste h3 {
		font-size: 17px;
		line-height: 23px;
//		margin-bottom: 20px;
	}
}

#batiste-nation {
	position:relative;
	background-image: url('/images/batiste-nation-bg.jpg');
	background-size: cover;
	background-position: 35% 100%;
	height: 60vw;
	max-height: 820px;
	margin-top:-6px;
}

@media (max-width:650px) {
	#batiste-nation {
		height: 607px;
		background-size: auto 50%;
		background-repeat: no-repeat;
		background-color: rgb(70, 108, 97);
	}
}

.batiste-nation-inner {
background: linear-gradient(to left, rgba(70, 108, 97, .65) 48%,rgba(70, 108, 97, 0) 55%);
padding-right: 12%;
height: 100%;
padding-top: 0;
text-align: right;
}

@media (max-width:650px) {
	.batiste-nation-inner {
		text-align: center;
		right: auto;
		top: 0;
		width: 90%;
		height:607px;
		padding: 5%;
		background: linear-gradient(rgb(70, 108, 97) 48%,rgba(70, 108, 97, 0) 55%);
	}
}

#batiste-nation h2 {
padding-top: 10vw;
margin-top: 0;
}

@media (max-width:650px) {
#batiste-nation h2 {
padding-top: 25px;
}
}

#batiste-nation h3 {
float: right;
padding: 0px 30px 0 50px;
width: 42%;
}

@media (max-width:650px) {
#batiste-nation h3 {
width: 90%;
}
}

.batiste-nation-perks-cta {
clear:both;
float:right;
padding-right:4vw;
}

@media (max-width:650px) {
.batiste-nation-perks-cta {
padding-right:0;
}
}

.batiste-nation-perk {
	display:table-cell;
	vertical-align:middle;
	padding:0 3px;
}


#so-many-choices {
	text-align:center;
	background-image: url('/images/so-many-choices-homepage-bg.jpg');
	margin-top:-5px;
	background-size: cover;
	background-position: 50% 0;
	overflow:hidden;
}

.smc-header {
	font-family: FuturaPTCond-ExtraBoldObl;
	font-size:48px;
	transform: skewY(-8deg);
	display: inline-block;
	margin-top: 175px;
}

@media (max-width:800px) {
	.smc-header {
		font-size:30pt;
		margin: 80px 0 25px;
		line-height: 36px;
		width: 95%;
	}
}

.product-lineup {
	max-width: 90%;
	padding-bottom:10px;
}

@media (max-width:700px) {
	.product-lineup {
		position:relative;
		//left:-44%;
		max-width:100%;
	}
}

.faqs-header {
	font-family: FuturaPTCond-ExtraBoldObl;
	font-size:36pt;
	color:#4AB9C3;
	padding: 90px 0 10px;
	display: inline-block;
}

@media (max-width:800px) {
	.faqs-header {
		font-size: 30pt;
		width: 60%;
		line-height: 27pt;
		padding: 100px 0 10px;
	}
}

.faqs-subhead {
	font-family: AvenirLTPro-Roman;
	font-size:18px;
	color:#5B9398;
	font-weight:bold;
	padding-bottom: 30px;
	display: inline-block;
}

@media (max-width:800px) {
	.faqs-subhead {
		font-size: 17px;
		display: inline-block;
		width: 60%;
		line-height: 23px;
		padding: 0 0 35px;
		margin-bottom: 18px;
	}
}

#faqs-outer-module {
	text-align:center;
}

#faqs-inner-module {
	margin:auto;
	width:80%;
	float:none;
}

.faqs-module-widget {
	float:left;
	width:30%;
	padding:1%;
}

@media (max-width:800px) {
	.faqs-module-widget {
		float:none;
		margin: auto;
		width: 100%;
	}
}

#faqs-inner-module img {
	max-width:100%;
}

.hair-benefits-product {
	text-align:center;
	padding:50px 0;
	background-size:cover !important;
}

.hair-benefits-product img {
	max-width:20%;
	height:auto;
	margin:auto;
}

.hair-benefits-product:hover img {
	max-width:80%;
}

.hb-hydrating {
	background:url('/images/backgrounds/hb-hydrating.jpg');
}

.hb-hydrating:hover {
	background:url('/images/backgrounds/hb-hydrating_rollover.jpg');
}

.hb-volumizing {
	background:url('/images/backgrounds/hb-volumizing.jpg');
}

.hb-volumizing:hover {
	background:url('/images/backgrounds/hb-volumizing_rollover.jpg');
}

.hb-defrizzing {
	background:url('/images/backgrounds/hb-defrizzing.jpg');
}

.hb-defrizzing:hover {
	background:url('/images/backgrounds/hb-defrizzing_rollover.jpg');
}

.hb-hydrating:hover .hb-image, .hb-volumizing:hover .hb-image, .hb-defrizzing:hover .hb-image {
	display:none;
}

.hb-hydrating .hb-text, .hb-volumizing .hb-text, .hb-defrizzing .hb-text {
	display:none;
}

.hb-hydrating:hover .hb-text, .hb-volumizing:hover .hb-text, .hb-defrizzing:hover .hb-text {
	display:block;
}

.hb-label {
	display:inline-block;
	background:#fff;
	padding: 15px;
	margin-top:35px;
	font-family: FuturaPTCond-ExtraBoldObl;
}