body, html{
	overflow-x:hidden;
}

/*----------------------------------*/
@font-face {
	font-family: "Gotham Cond A";
font-style: normal;
font-weight: 400;
	src: url('font/gothamcondensed-book-webfont.ttf') format('ttf'), url('font/gothamcondensed-book-webfont.woff2') format('woff2'), url('font/gothamcondensed-book-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'MoonFlower';
	src: url('font/moon_flower-webfont.ttf') format('ttf'), url('font/moon_flower-webfont.woff2') format('woff2'), url('font/moon_flower-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'MoonFlowerBold';
	src: url('font/moon_flower_bold-webfont.ttf') format('ttf'), url('font/moon_flower_bold-webfont.woff2') format('woff2'), url('font/moon_flower_bold-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
/*----------------------------------------*/
/*.MyContent {
	width: 100%;
	display: block;
	position: relative;
	max-width: 1250px;
	min-width: 375px;
	margin-left: auto;
	margin-right: auto;
	font-family: "Gotham SSm book A", "Gotham SSm book B", Gotham, Helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 1.4em;
	color: #000;
	text-align: center;
}*/
.MyContent {
	width: 100%;
	display: block;
	position: relative;
	max-width: 1250px;
	min-width: 375px;
	margin-left: auto;
	margin-right: auto;
	font-family: "Gotham SSm book A", "Gotham SSm book B", Gotham, Helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 1.4em;
	color: #000;
	text-align: center;
	/*margin-bottom:-120px;*/
}
@media only screen and (min-width:1024px) {
.BlockMyClarinsPDP-1{
	background-color:#fa364a;
	padding-left:400px;	
	margin-left:auto;
	margin-right:auto;
	height:334px;
	display:flex;
	position:relative;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	box-sizing:border-box;
	width:100%;
	max-width:1250px;
	margin-top: 100px;
}
.BlockMyClarinsPDP-1::after{
	content:" ";
	background-color:#fa364a;
	height:334px;
	position:absolute;
	width:100vw;
	left:100%;
	top:0;
}
.BlockMyClarinsPDP-1::before{
	content:" ";
	background-image:url(img/BlockMyClarinsPDP-1.png);
	position:absolute;
	width:451px;
	height:557px;
	left:-100px;
	top:-130px;
}
}
@media only screen and (max-width:1024px) {
.BlockMyClarinsPDP-1::before{
	left:0px;
}
}
/*.BlockMyClarinsPDP-2 h2,
.BlockMyClarinsPDP-1 h2{
	color: #FFF;
	text-align: center;
	margin: 0;
	padding: 0;
	font-family: "Gotham Cond A", "Gotham Cond B";
	font-style: normal;
	font-weight: 400;
	font-size: 50px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	font-weight: normal;
	line-height: 1em;
	max-width:450px;
	margin-left:auto;
	margin-right:auto;
}*/
.BlockMyClarinsPDP-2 h2,
.BlockMyClarinsPDP-1 h2{
	color: #FFF;
	text-align: center;
	margin: 0;
	padding: 0;
	font-family: "Gotham Cond A", "Gotham Cond B";
	font-style: normal;
	font-weight: 400;
	font-size: 50px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	font-weight: normal;
	line-height: 1em;
	max-width:754px;
	margin-left:auto;
	margin-right:auto;
}
@media only screen and (max-width:1024px) {
.BlockMyClarinsPDP-2 h2,
.BlockMyClarinsPDP-1 h2{
	color: #FFF;
	text-align: center;
	margin: 0;
	padding: 0;
	font-family: "Gotham Cond A", "Gotham Cond B";
	font-style: normal;
	font-weight: 400;
	font-size: 50px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	font-weight: normal;
	line-height: 1em;
	max-width:574px;
	margin-left:auto;
	margin-right:auto;
}}
@media only screen and (max-width:1023px) {
.BlockMyClarinsPDP-2 h2,
.BlockMyClarinsPDP-1 h2{
		font-size:24px;
		max-width:240px;
}
}
@media only screen and (max-width:761px) {
.BlockMyClarinsPDP-2 h2{
		font-size:24px;
		max-width:240px;
}
}
/*.BlockMyClarinsPDP-2{
	background-image:url(img/BlockMyClarinsPDP-2.jpg);
	width:100%;
	max-width:1250px;
	margin-left:auto;
	margin-right:auto;
	background-position:bottom center;
	padding-top:70px;
	box-sizing:border-box;
	padding-bottom:331px;
	background-repeat:no-repeat;
	position:relative;
}*/
.BlockMyClarinsPDP-2{
	background-image:url(img/BlockMyClarinsPDP-2.jpg);
	width:100%;
	max-width:1250px;
	margin-left:auto;
	margin-right:auto;
	background-position:bottom center;
	padding-top:70px;
	box-sizing:border-box;
	padding-bottom:331px;
	background-repeat:no-repeat;
	position:relative;
	margin-bottom:-120px;
}
@media only screen and (max-width:1023px) {
.BlockMyClarinsPDP-1{
	background-image:url(img/BlockMyClarinsPDP-1-mobile.jpg);
	width:100%;
	max-width:375px;
	margin-left:auto;
	margin-right:auto;
	background-position:bottom center;
	padding-top:30px;
	box-sizing:border-box;
	margin-top:30px;
	padding-bottom:482px;
	background-repeat:no-repeat;
	position:relative;
}
.BlockMyClarinsPDP-2{
	background-image:url(img/BlockMyClarinsPDP-2-mobile.jpg);
	width:100%;
	max-width:375px;
	margin-left:auto;
	margin-right:auto;
	background-position:bottom center;
	padding-top:30px;
	box-sizing:border-box;
	padding-bottom:251px;
	background-repeat:no-repeat;
	position:relative;
}	
}
.BlockMyClarinsPDP-2 h2{
		max-width:500px;
}

.BlockMyClarinsPDP-2 .TextLink, 
.BlockMyClarinsPDP-1 .TextLink {
	margin: 0;
	padding: 0;
	margin-top:10px;
}
.BlockMyClarinsPDP-2 .TextLink a, 
.BlockMyClarinsPDP-1 .TextLink a {
	text-decoration: none;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	color: #FFF;
	font-size: 11px;
	text-transform: uppercase;
	border-bottom: 1px solid #FFF;
	line-height: 1em;
}

.BlockMyClarinsPDP-2 .ingredient-name{
	position:absolute;
	margin:0;
	
	font-size:18px;
	font-family: "Gotham Cond A", "Gotham Cond B";
}
/*#ingredient-name-1{
	margin-right: 405px;
	text-align: right;
	right: 50%;
	bottom: 388px;
}*/
#ingredient-name-1{
	margin-right: 405px;
	text-align: right;
	right: 50%;
	bottom: 369px;
}
#ingredient-name-2{
	margin-right: 345px;
	text-align: left;
	right: 50%;
	bottom: 268px;
	width: 80px;
}
/*#ingredient-name-3 {
	margin-right: 135px;
	text-align: left;
	right: 50%;
	bottom: 225px;
	width: 80px;
}*/
#ingredient-name-3 {
	margin-right: 135px;
	text-align: left;
	right: 50%;
	bottom: 214px;
	width: 80px;
}
#ingredient-name-4 {
	margin-right: 70px;
	text-align: left;
	right: 50%;
	bottom: 10px;
	width: 80px;
}
#ingredient-name-5 {
	margin-right: -30px;
	text-align: left;
	right: 50%;
	bottom: 60px;
	width: 80px;
}
/*#ingredient-name-6 {
	margin-left: 300px;
	text-align: left;
	left: 50%;
	bottom: 275px;
	width: 80px;
}*/
#ingredient-name-6 {
	margin-left: 300px;
	text-align: left;
	left: 50%;
	bottom: 262px;
	width: 80px;
}
#ingredient-name-7 {
	margin-left: 515px;
	text-align: left;
	left: 50%;
	bottom: 178px;
	width: 50px;
}
.ingredient-mentions{
	margin:0;
	font-size:14px;
	position:absolute;
	bottom:5px;
	left:50%;
	margin-left:420px;
	font-family: "Gotham Cond A", "Gotham Cond B";
}
@media only screen and (max-width:1023px) {
.BlockMyClarinsPDP-2 .ingredient-name,
.BlockMyClarinsPDP-2 .ingredient-mentions{
	display:none;
}	
	
}
@media only screen and (max-width:761px) {
	/*.MyContent{
		left: -25px;
	}*/
	.MyContent{
		/*left: -25px;*/
	}
}
.BlockMyClarinsPDP-1::before{
	top: -115px;
}
