body,
html {
	margin: 0;
	padding: 0;
	overflow-x: hidden;
	width: 100%;
}

.MyContent a {
	outline: 0;
}

.MyContent {
	width: 100%;
	display: block;
	position: relative;
	max-width: 1250px;
	min-width: 320px;
	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;
}

@media only screen and (max-width:1249px) {
	.MyContent {
		overflow: hidden;
	}
}

@media only screen and (max-width:761px) {
	.MyContent {
		overflow: visible;
	}

	body,
	html {
		overflow: visible;
	}
}

.MyContent * {
	-webkit-user-select: none;
	/* Chrome, Opera, Safari */
	-moz-user-select: none;
	/* Firefox 2+ */
	-ms-user-select: none;
	/* IE 10+ */
	user-select: none;
	/* Standard syntax */
}

.MyContent .MyBlock {
	display: block;
	width: 100%;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.MyContent .anchor-name {
	display: none;
}

.MyContent h1 {
	display: inline-block;
	font-family: ClarinsRegular, Clarins;
	font-size: 50px;
	font-weight: normal;
	line-height: 1em;
	margin: 0;
	padding: 0;
	position: relative;
	text-align: center;
	z-index: 1;
}

.MyContent .HiddenText {
	display: none;
}

.MyContent h1 span {
	display: inline-block;
}

@media only screen and (max-width:761px) {
	.MyContent h1 {
		font-size: 35px;
	}
}

.MyContent .BtnLink {
	margin: 0;
	padding: 0;
	font-size: 0;
}

.MyContent .BtnLink a {
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	font-size: 11px;
	/*border-bottom: 1px solid #e5e5e5;*/
	text-transform: uppercase;
	color: #FFF;
	text-decoration: none;
	position: relative;
	background-color: #000;
	padding: 18px 30px;
	display: inline-block;
	line-height: 14px;
}

.MyContent .TextLink a {
	text-decoration: none;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	color: #000;
	font-size: 11px;
	text-transform: uppercase;
	border-bottom: 1px solid #eee;

}

.MyContent .VideoLink {

	margin: 20px 0;
}

.MyContent .VideoLink a {
	display: inline-block;
	position: relative;
	z-index: 1;
}

.MyContent .VideoLink a img {
	display: block;
	position: relative;
	max-width: 100%;
}

.MyContent .VideoLink a::after {
	content: " ";
	position: absolute;
	display: block;
	bottom: 15px;
	left: 15px;
	width: 50px;
	height: 50px;
	background-image: url("img/video-play.png");
	background-repeat: no-repeat;
}


.BeautyRoutine-slider {
	display: flex;
	justify-content: center;
}

/*------------------------------------------------------------*/
.MyContent .Bottom p {
	margin: 40px;
}

.MyContent .Sticky {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 2000;
	width: 100%;
	height: 76px;
	border-top: #eeeeee 1px solid;
	border-bottom: #eeeeee 1px solid;
	background: linear-gradient(0deg, #FFFFFF 0%, #FFFFFF 80%, #eeeeee 100%);
	clear: both;
	display: flex;
	justify-content: center;
	align-items: center;
}

.MyContent .Sticky p {
	margin: 0px;
}

.MyContent .Sticky p:nth-child(1) img {
	height: 60px;
	width: auto;
	margin-left: 20px;
}

.MyContent .Sticky p:nth-child(2) {
	text-align: left;
	padding-left: 20px;
	flex: 1;
	font-size: 12px;
}

@media only screen and (max-width:761px) {
	.MyContent .Sticky {
		flex-wrap: wrap;
		height: 150px;
	}

	.MyContent .Sticky p:nth-child(1) img {
		margin-left: 0px;
	}

	.MyContent .Sticky p:nth-child(2) {
		font-size: 10px;
		line-height: 12px;
		padding-left: 10px;
	}

	.MyContent .Sticky p:nth-child(3) {
		flex-basis: 80px;

	}

	.MyContent .Sticky div:nth-child(4) {
		flex-basis: 100%;
		text-align: center;

	}

	.MyContent .Sticky .product-quickshop {
		display: inline-block;
	}
}

/*------------------------------------------------------------*/

@media only screen and (max-width:761px) {
	.MyContent .jcarousel-pagination {
		bottom: 0px;
		margin: 0 !important;
	}

	.MyContent .jcarousel {
		padding-bottom: 40px;
	}
}

/*------------------------------------------------------------*/
.MyContent .MyFirstScreen {
	text-align: center;
}

@media only screen and (min-width:1250px) {
	.MyContent .MyFirstScreen {
		text-align: center;
		width: 2000px;
		margin-left: -375px;
	}
}

.MyContent .MyFirstScreen h1 {
	font-size: 60px;
	font-weight: normal;
	font-family: ClarinsRegular, Clarins;
	color: #000;
	padding: 0;
	border-bottom: 0px solid;
	display: block;
	margin: 20px;
	margin-bottom: 0;
}

@media only screen and (max-width:761px) {
	.MyContent .MyFirstScreen h1 {
		font-size: 40px;
		margin-bottom: 10px;
	}
}

.MyContent .MyFirstScreen p {
	font-size: 12px;
	font-weight: normal;
	font-family: "Gotham SSm book A", "Gotham SSm book B", Gotham, Helvetica, Arial, sans-serif;
	color: #000;
	margin: 0;
	padding: 0;
	display: block;
	margin-left: 20px;
	margin-right: 20px;
}

#HeaderAnim {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	flex-direction: column;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	height: 406px;
	background-color: #CCC;
}

#HeaderAnim div {
	text-align: center;
	overflow: hidden;
	flex-basis: 203px;
	width: 312px;
	position: relative;
	background-repeat: no-repeat;
	background-position: center center;
	transition: background-color 0.5s ease-in-out, background-image 0.5s ease-in-out;
}

#HeaderAnim div:nth-child(1) {
	width: calc(50% - 312px);
	background-position: top 27px right 105px;
}

#HeaderAnim div:nth-child(2) {
	width: calc(50% - 312px);
	background-position: bottom 38px right 105px;
}

#HeaderAnim div:nth-child(3) {
	background-position: top 27px center;
}

#HeaderAnim div:nth-child(4) {
	background-position: bottom 38px center;
}

#HeaderAnim div:nth-child(5) {
	background-position: top 27px center;
}

#HeaderAnim div:nth-child(6) {
	background-position: bottom 38px center;
}

#HeaderAnim div:nth-child(7) {
	width: calc(50% - 312px);
	background-position: top 27px left 105px;
}

#HeaderAnim div:nth-child(8) {
	width: calc(50% - 312px);
	background-position: bottom 38px left 105px;
}

@media only screen and (max-width:1249px) {
	#HeaderAnim div:nth-child(1) {
		width: 33.33%;
		background-position: top 30px center;
	}

	#HeaderAnim div:nth-child(2) {
		width: 33.33%;
		background-position: bottom 30px center;
	}

	#HeaderAnim div:nth-child(3) {
		width: 33.33%;
		background-position: top 30px center;
	}

	#HeaderAnim div:nth-child(4) {
		width: 33.33%;
		background-position: bottom 30px center;
	}

	#HeaderAnim div:nth-child(5) {
		width: 33.33%;
		background-position: top 30px center;
	}

	#HeaderAnim div:nth-child(6) {
		width: 33.33%;
		background-position: bottom 30px center;
	}

	#HeaderAnim div:nth-child(7) {
		width: 33.33%;
		background-position: bottom 30px center;
	}

	#HeaderAnim div:nth-child(8) {
		width: 33.33%;
		background-position: bottom 30px center;
	}
}

@media only screen and (max-width:520px) {
	#HeaderAnim {
		height: 76vw;
	}

	#HeaderAnim div {
		background-size: 18vw auto;
		flex-basis: 38vw;
	}
}

.PCK1 {
	background-image: url(img/product-header-1.png);
	background-color: #d8ae7a;
}

.PCK2 {
	background-image: url(img/product-header-2.png);
	background-color: #be0f34;
}

.PCK3 {
	background-image: url(img/product-header-3v2.png);
	background-color: #f6a8b5;
}

.PCK4 {
	background-image: url(img/product-header-4.png);
	background-color: #009fe3;
}

.PCK5 {
	background-image: url(img/product-header-5.png);
	background-color: #3db8a8;
}

.PCK6 {
	background-image: url(img/product-header-3v2.png);
	background-color: #eb595e;
}

.PCK7 {
	background-image: url(img/product-header-7.png);
	background-color: #af7353;
}

.PCK8 {
	background-image: url(img/product-header-1.png);
	background-color: #d2a599;
}

.MyContent .MyFirstScreen p.BtnLink {
	padding-top: 25px;
	margin-bottom: 50px;
}

@media only screen and (max-width:1249px) {
	.MyContent .MyFirstScreen p.BtnLink {
		padding-top: 15px;

	}
}

/*--------------------------------------------------------------*/
.MyContent .NavContainer {
	padding-bottom: 0px;
	z-index: 2;
	position: relative;
	background-color: #FFF;
}

@media only screen and (max-width:761px) {
	.MyContent .NavContainer {
		min-height: 72px;
		margin-top: 0px;
		/*border-top: 2px solid #CCC;*/
	}

	.MyContent .NavContainer h1 {
		top: 36px;
		padding: 0px;
		width: calc(100% - 140px);
		font-size: 11px;
		font-family: "Gotham SSm book A", "Gotham SSm book B", Gotham, Helvetica, Arial, sans-serif;
		text-transform: uppercase;
		position: absolute;
		left: 70px;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
	}
}

.MyContent .NavContainer .BreadCrumb {
	/*padding: 20px;*/
	text-align: center;
	display: block;
	font-size: 0px;
}

.MyContent .NavContainer .BreadCrumb .NavBullet {
	color: #be0f34;
	text-decoration: none;
	font-size: 14px;
	position: relative;
	display: inline-block;
	border-radius: 50%;
	border: 1px solid #be0f34;
	background-color: #FFF;
	text-align: center;
	width: 24px;
	height: 24px;
	line-height: 24px;
	margin-left: 9px;
	margin-right: 9px;
}

.MyContent .NavContainer .BreadCrumb .NavBullet::before {
	content: " ";
	right: 100%;
	position: absolute;
	width: 10px;
	height: 1px;
	bottom: 50%;
	background-color: #be0f34;
}

.MyContent .NavContainer .BreadCrumb .NavBullet:first-child::before {
	display: none;
}

.MyContent .NavContainer .BreadCrumb .NavBullet::after {
	content: " ";
	left: 100%;
	position: absolute;
	width: 10px;
	height: 1px;
	bottom: 50%;
	background-color: #be0f34;
}

.MyContent .NavContainer .BreadCrumb .NavBullet:last-child::after {
	display: none;
}

.MyContent .NavContainer .BreadCrumb .Selected {
	color: #FFF;
	background-color: #be0f34;
	width: 34px;
	height: 34px;
	line-height: 34px;
	margin-left: 5px;
	margin-right: 5px;
}

.MyContent .NavContainer .BreadCrumb .LipsPicto {
	background-image: url(img/lips.svg);
	background-size: 22px 22px;
	background-position: center center;
	background-repeat: no-repeat;
}

.MyContent .NavContainer .BreadCrumb .LipsPicto.Selected {
	background-image: url(img/lips-white.svg);
	background-size: 22px 22px;
	background-position: center center;
	background-repeat: no-repeat;
}

.MyContent .HomeBtn {
	display: block;
	padding: 20px;
}

.MyContent .HomeBtn a {
	font-size: 60px;
	font-family: ClarinsRegular, Clarins;
	color: #000;
	border-bottom: 0px solid;
	line-height: 1em;
	text-decoration: none;

}

@media only screen and (max-width:761px) {
	.MyContent .HomeBtn a {
		font-size: 40px;
	}
}

.MyContent .HomeBtn img {
	display: block;
	position: relative;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;

}

.MyContent .ScreenContainer {
	width: 100vw;
	margin-left: calc(625px - 50vw);
	background-color: #FFF;
	display: block;
	min-height: 690px;
	position: relative;
	overflow: hidden;
	z-index: 1;
	-webkit-backface-visibility: hidden;
}

@media only screen and (max-width:1249px) {
	.MyContent .ScreenContainer {
		width: 100%;
		margin-left: 0;
		min-height: 690px;
	}
}



@media only screen and (max-width:761px) {
	.MyContent .ScreenContainer {
		/*	width: 1250px;*/
		margin-left: 0;
		min-height: 10px;
		height: auto !important;
	}
}

.MyContent .ScreenBlock {
	position: absolute;
	top: 0px;
	left: calc(50% - 625px);
	width: 1250px;
	opacity: 0;
	display: block;
	-webkit-transition: left ease-in-out 1s, opacity ease-in-out 0.5s;
	transition: left ease-in-out 1s, opacity ease-in-out 0.5s;
	z-index: 2;
	overflow: hidden;
	height: 100%;
	-webkit-transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	transform: translateZ(0);
	backface-visibility: hidden;
}

.MyContent .ScreenBlock .Wrapper {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translateX(-50%) translateY(-50%) translateZ(0);
	transform: translateX(-50%) translateY(-50%) translateZ(0);
	max-width: 1250px;
	width: 100%;

	/*-------------------------*/
	top: 0;
	-webkit-transform: translateX(-50%) translateZ(0);
	transform: translateX(-50%) translateZ(0);
}

@media only screen and (max-width:1024px) {
	.MyContent .ScreenBlock .Wrapper {
		top: 0;
		-webkit-transform: translateX(-50%) translateZ(0);
		transform: translateX(-50%) translateZ(0);

	}
}

.MyContent .ScreenBlock .Wrapper ul.PolaListe {
	display: block;
	width: 100%;
	text-align: center;
	font-size: 0;
	padding: 0;
	margin: 0;
	max-width: 996px;
	margin-left: auto;
	margin-right: auto;
}

@media only screen and (max-width:1023px) {
	.MyContent .ScreenBlock .Wrapper ul.PolaListe {
		max-width: 720px;
	}
}

@media only screen and (max-width:761px) {
	.MyContent .ScreenBlock .Wrapper ul.PolaListe {
		max-width: 320px;
	}
}

.MyContent .ScreenBlock .Wrapper ul.PolaListe li {
	display: inline-block;
	width: auto;
	vertical-align: top;
	font-size: 11px;
	position: relative;
	text-align: center;
}

.MyContent .ScreenBlock h2 {
	margin: 0;
	padding: 40px;
	font-family: ClarinsRegular, Clarins;
	font-size: 22px;
	line-height: 1em;
	font-weight: normal;
	display: block;
	text-align: center;
}

@media only screen and (max-width:761px) {
	.MyContent .ScreenBlock h2 {
		font-size: 18px;
		padding: 20px;
	}
}

.MyContent .BackgroundVisual {
	width: 100%;
	width: 1250px;
	max-width: 1250px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	height: 100%;
	position: relative;
	-webkit-transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	transform: translateZ(0);
	backface-visibility: hidden;
}

@media only screen and (max-width:1249px) {
	.MyContent .BackgroundVisual {
		margin-left: calc(50% - 625px);
	}
}

@media only screen and (max-width:761px) {
	.MyContent .BackgroundVisual {
		display: none !important;
	}
}

.MyContent .BackgroundVisual div {
	position: absolute;
	left: calc(50% - 625px);
	top: 0px;
	opacity: 0;
	z-index: 1;
	-webkit-transition: all ease-in-out 1s;
	transition: all ease-in-out 1s;
	height: 100%;
	width: 1250px;
}

@media only screen and (max-width:1023px) {
	.MyContent .BackgroundVisual div {
		-webkit-transition: none;
		transition: none;
	}
}

.MyContent .BackgroundVisual div img {
	display: block;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
	height: 100%;
}

@media only screen and (max-width:761px) {
	.MyContent .BackgroundVisual div img {
		height: auto;
	}
}

.MyContent .BackgroundVisual div img.js-loaded {
	width: auto;
}

.MyContent .BackgroundVisual div.Animated {
	top: 0%;
	left: calc(50% - 1000px);
	width: 2000px;
	background-color: #c7b19e;
	text-align: center;
}

.MyContent .BackgroundVisual div.Animated img:last-child {
	display: block;
	max-width: 100%;
	position: absolute;
	top: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}

@keyframes FadeIn {
	0% {
		opacity: 0;
	}

	40% {
		opacity: 0;
	}

	50% {
		opacity: 1;
	}

	98% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

.MyContent .ScreenBlock[data-selected="0"] {
	left: 100%;
	left: calc(50% - 625px);
}

@keyframes hideFromRight {
	0% {
		left: calc(50% - 625px);
		opacity: 1;
	}

	99% {
		left: 100%;
		opacity: 0;
	}

	100% {
		left: calc(50% - 625px);
		opacity: 0;
	}
}

@keyframes hideFromLeft {
	0% {
		left: calc(50% - 625px);
		opacity: 1;
	}

	99% {
		left: -1250px;
		opacity: 0;
	}

	100% {
		left: calc(50% - 625px);
		opacity: 0;
	}
}

.MyContent .ScreenBlock[data-selected="hideFromRight"] {
	animation: hideFromRight 0.5s ease-in-out;
}

.MyContent .ScreenBlock[data-selected="hideFromLeft"] {
	animation: hideFromLeft 0.5s ease-in-out;
}

.MyContent .ScreenBlock[data-selected="1"] {
	left: calc(50% - 625px);
	opacity: 1;
	z-index: 3;
}

.MyContent a.PolaroidBtn {
	font-size: 0px;
	background-color: #FFF;
	padding: 0px;
	display: inline-block;
	padding-bottom: 60px;
	position: relative;
	box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
	margin: 2px;
	opacity: 0;
	transform: translateX(100%);
	transition: opacity ease-in-out 0.2s, transform ease-in-out 0.8s;
}

.MyContent ul li:nth-child(1) a.PolaroidBtn {
	transition-delay: 0.4s;
}

.MyContent ul li:nth-child(2) a.PolaroidBtn {
	transition-delay: 0.8s;
}

.MyContent ul li:nth-child(3) a.PolaroidBtn {
	transition-delay: 1.2s;
}

.MyContent ul li:nth-child(4) a.PolaroidBtn {
	transition-delay: 1.6s;
}

.MyContent ul li:nth-child(5) a.PolaroidBtn {
	transition-delay: 2s;
}

.MyContent ul li:nth-child(6) a.PolaroidBtn {
	transition-delay: 2.4s;
}

.MyContent ul li:nth-child(7) a.PolaroidBtn {
	transition-delay: 2.6s;
}

.MyContent ul li:nth-child(8) a.PolaroidBtn {
	transition-delay: 2.8s;
}

.MyContent ul+ul li:nth-child(1) a.PolaroidBtn {
	transition-delay: 1.6s;
}

.MyContent ul+ul li:nth-child(2) a.PolaroidBtn {
	transition-delay: 2s;
}

.MyContent ul+ul li:nth-child(3) a.PolaroidBtn {
	transition-delay: 2.4s;
}

@media only screen and (max-width:761px) {}

.MyContent .ScreenBlock[data-selected="1"] a.PolaroidBtn {
	opacity: 1;
	transform: translateX(0);
}

@media only screen and (max-width:761px) {
	.MyContent .ScreenBlock[data-selected="1"] a.PolaroidBtn {
		animation-name: AnimPolaFromLeft;
		animation-duration: 1s;
		animation-timing-function: ease-in-out;
		animation-fill-mode: both;
	}

	.MyContent ul li:nth-child(1) a.PolaroidBtn {
		animation-delay: 0.4s;
	}

	.MyContent ul li:nth-child(2) a.PolaroidBtn {
		animation-delay: 0.6s;
	}

	.MyContent ul li:nth-child(3) a.PolaroidBtn {
		animation-delay: 0.8s;
	}

	.MyContent ul li:nth-child(4) a.PolaroidBtn {
		animation-delay: 1s;
	}

	.MyContent ul li:nth-child(5) a.PolaroidBtn {
		animation-delay: 1.2s;
	}

	.MyContent ul li:nth-child(6) a.PolaroidBtn {
		animation-delay: 1.4s;
	}

	.MyContent ul li:nth-child(7) a.PolaroidBtn {
		animation-delay: 1.6s;
	}

	.MyContent ul li:nth-child(8) a.PolaroidBtn {
		animation-delay: 1.8s;
	}

}

@keyframes AnimPolaFromLeft {
	0% {
		transform: translateX(100%);
		opacity: 0;
	}

	100% {
		transform: translateX(0);
		opacity: 1;
	}
}

@media only screen and (max-width:761px) {
	.MyContent a.PolaroidBtn {
		max-width: 150px;
		transition: none;
		/*padding:0;*/
	}

}

.MyContent a.PolaroidBtn img {
	display: block;
	position: relative;
	max-width: 100%;
	max-width: 240px;
	transform: scale(1);
	transition: transform 0.5s ease-in-out;
}

@media only screen and (max-width:1024px) {
	.MyContent a.PolaroidBtn img {
		max-width: 245px;

	}

}

@media only screen and (max-width:761px) {
	.MyContent a.PolaroidBtn img {
		max-width: 100%;

	}

}

.MyContent a.PolaroidBtn span {
	overflow: hidden;
	display: inline-block;
	font-size: 0;
	line-height: 0;
	vertical-align: middle;
}

.MyContent a.PolaroidBtn:hover::before {
	content: " ";
	border: 2px solid #000;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 4;
	box-sizing: border-box;
}

.MyContent a.PolaroidBtn:hover img {

	transform: scale(1.05);
}

.MyContent a.PolaroidBtn span.TextPola {
	font-size: 11px;
	display: block;
	line-height: 16px;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	position: absolute;
	padding: 10px;
	bottom: 30px;
	-webkit-transform: translateY(50%);
	transform: translateY(50%);
	text-align: center;
	text-decoration: none;
	color: #FFF;
	left: 0;
	text-transform: uppercase;
	width: calc(100% - 20px);
}

.MyContent #Texture-01 {
	width: 1600px;
	height: 773px;
	left: calc(50% - 800px);
	top: 0;
}

/*///////////////////////////////////////////////////////////*/

/*----------------------- SCREEN - 02 ----------------------*/
/*
.MyContent .AnimScreen-02 #Texture-01 {
	display: block;
	opacity: 1;
	top: calc(50% - 170px);
	top:0;
}
*/
/*
@media only screen and (max-width:761px) {
.MyContent .AnimScreen-02 #Texture-01 {
}
}*/


.MyContent .Screen-02 .Wrapper ul li:nth-child(1) .PolaroidBtn {
	background-color: #fcbb7f;
}

.MyContent .Screen-02 .Wrapper ul li:nth-child(1) .PolaroidBtn::before {
	border-color: #fcbb7f;
}

.MyContent .Screen-02 .Wrapper ul li:nth-child(2) .PolaroidBtn {
	background-color: #f198c1;
}

.MyContent .Screen-02 .Wrapper ul li:nth-child(2) .PolaroidBtn::before {
	border-color: #f198c1;
}

.MyContent .Screen-02 .Wrapper ul li:nth-child(3) .PolaroidBtn {
	background-color: #f8bc9d;
}

.MyContent .Screen-02 .Wrapper ul li:nth-child(3) .PolaroidBtn::before {
	border-color: #f8bc9d;
}

.MyContent .Screen-02 .Wrapper ul li:nth-child(4) .PolaroidBtn {
	background-color: #be0f34;
}

.MyContent .Screen-02 .Wrapper ul li:nth-child(4) .PolaroidBtn::before {
	border-color: #be0f34;
}

@media only screen and (max-width:1023px) {
	.MyContent .Screen-02 .Wrapper ul {
		max-width: 480px;
	}
}

/*----------------------- SCREEN - 03 ----------------------*/
@media only screen and (min-width:1024px) {
	.MyContent .Screen-03 .Wrapper ul.PolaListe {
		max-width: 1000px;
	}

}

@media only screen and (max-width:1023px) {
	.MyContent .Screen-03 .Wrapper ul.PolaListe {
		max-width: 760px;
		padding-bottom: 40px;
	}

	.MyContent .Screen-03 .Wrapper ul.PolaListe .PolaroidBtn img {
		max-width: 240px;
	}
}

@media only screen and (max-width:761px) {

	.MyContent .Screen-03 .Wrapper ul.PolaListe .PolaroidBtn img {
		max-width: 100%;
	}
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(1) .PolaroidBtn {
	background-color: #009fe3;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(1) .PolaroidBtn::before {
	border-color: #009fe3;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(2) .PolaroidBtn {
	background-color: #eb595e;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(2) .PolaroidBtn::before {
	border-color: #eb595e;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(3) .PolaroidBtn {
	background-color: #3db8a8;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(3) .PolaroidBtn::before {
	border-color: #3db8a8;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(4) .PolaroidBtn {
	background-color: #c20430;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(4) .PolaroidBtn::before {
	border-color: #c20430;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(5) .PolaroidBtn {
	background-color: #f6a8b5;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(5) .PolaroidBtn::before {
	border-color: #f6a8b5;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(6) .PolaroidBtn {
	background-color: #d8ae7a;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(6) .PolaroidBtn::before {
	border-color: #d8ae7a;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(7) .PolaroidBtn {
	background-color: #c0968b;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(7) .PolaroidBtn::before {
	border-color: #c0968b;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(8) .PolaroidBtn {
	background-color: #fa7c50;
}

.MyContent .Screen-03 .Wrapper ul li:nth-child(8) .PolaroidBtn::before {
	border-color: #fa7c50;
}

/*----------------------- SCREEN - 04 ----------------------*/
.MyContent .Screen-09 .Wrapper .ProductInfos h3,
.MyContent .Screen-09 .BeautySchool span.num,
.MyContent .Screen-09 .BeautyRoutine h4 span.num {
	color: #d8ae7a;
}

.MyContent .Screen-09 .Wrapper .BeautyTips h3,
.MyContent .Screen-09 .Wrapper .CheckBox {
	background-color: #d8ae7a;
}

.MyContent .Screen-09 .Wrapper .BeautyTips {
	border-color: #d8ae7a;
	background-image: url(img/Product-01-Tips-Background-1.jpg), url(img/Product-01-Tips-Background-2.jpg);
	background-position: bottom left, top right;
	background-repeat: no-repeat, no-repeat;

}

.MyContent .Screen-09 .Wrapper .Packshot span {
	width: 28%;
	text-align: left;
	top: 15%;
}

@media only screen and (max-width:761px) {
	.MyContent .Screen-09 .Wrapper .Packshot span {
		width: 20%;
		text-align: left;
		top: 0%;
	}
}

.MyContent .Screen-09 .Wrapper .BeautyTips p.Ingredient:nth-child(1) {
	width: 100px;
	text-align: right;
	top: 15px;
	right: 200px;
}

.MyContent .Screen-09 .Wrapper .BeautyTips p.Ingredient:nth-child(2) {
	width: 100px;
	text-align: left;
	bottom: 125px;
	left: 140px;
}

/*----------------------- SCREEN - 05 ----------------------*/
.MyContent .Screen-08 .Wrapper .ProductInfos h3,
.MyContent .Screen-08 .BeautySchool span.num,
.MyContent .Screen-08 .BeautyRoutine h4 span.num {
	color: #f6a8b5;
}

.MyContent .Screen-08 .Wrapper .BeautyTips h3,
.MyContent .Screen-08 .Wrapper .CheckBox {
	background-color: #f6a8b5;
}

.MyContent .Screen-08 .Wrapper .BeautyTips {
	border-color: #f6a8b5;
	background-image: url(./img/Product-02-Tips-Background-1_v2.jpg), url(./img/Product-02-Tips-Background-2.jpg);
	background-position: top left, bottom right;
	background-repeat: no-repeat, no-repeat;

}

.MyContent .Screen-08 .Wrapper .Packshot span {
	width: 28%;
	text-align: left;
	top: 50%;
}

@media only screen and (max-width:761px) {
	.MyContent .Screen-08 .Wrapper .Packshot span {
		width: 28%;
		text-align: left;
		top: 15%;
	}
}



.MyContent .Screen-08 .Wrapper .Packshot span:nth-child(2) {
	width: 33%;
	text-align: left;
	top: 41%;
}

.MyContent .Screen-08 .Wrapper .Packshot span:nth-child(3) {
	width: 64%;
	text-align: left;
	top: 88%;
}

.MyContent .Screen-08 .Wrapper .BeautyTips p.Ingredient:nth-child(1) {
	width: 100px;
	text-align: left;
	top: 270px;
	left: 70px;
}

.MyContent .Screen-08 .Wrapper .BeautyTips p.Ingredient:nth-child(2) {
	width: 100px;
	text-align: right;
	bottom: 25px;
	right: 240px;
}

.MyContent .Screen-08 .BeautyTips .WrapperTips p.Text,
.MyContent .Screen-08 .BeautyTips .WrapperTips p.TextLink {
	width: 206px;
}

.MyContent .Screen-08 .BeautyTips .WrapperTips p.TextLink a::after {
	display: block;
	height: 5px;
	content: " ";
}

/*----------------------- SCREEN - 06 ----------------------*/
.MyContent .Screen-04 .Wrapper .ProductInfos h3,
.MyContent .Screen-04 .BeautySchool span.num,
.MyContent .Screen-04 .BeautyRoutine h4 span.num {
	color: #009fe3;
}

.MyContent .Screen-04 .Wrapper .BeautyTips h3,
.MyContent .Screen-04 .Wrapper .CheckBox {
	background-color: #009fe3;
}

.MyContent .Screen-04 .Wrapper .BeautyTips {
	border-color: #009fe3;
	background-image: url(img/Product-03-Tips-Background-1.jpg), url(img/Product-03-Tips-Background-2.jpg);
	background-position: top left, bottom right;
	background-repeat: no-repeat, no-repeat;

}

.MyContent .Screen-04 .Wrapper .Packshot span {
	width: 18%;
	text-align: left;
	top: 80%;
}

@media only screen and (max-width:761px) {
	.MyContent .Screen-04 .Wrapper .Packshot span {
		width: 200px;
		text-align: center;
		top: calc(100% - 16px);
	}
}

.MyContent .Screen-04 .Wrapper .BeautyTips p.Ingredient:nth-child(1) {
	width: 100px;
	text-align: left;
	top: 255px;
	left: 30px;
}

.MyContent .Screen-04 .Wrapper .BeautyTips p.Ingredient:nth-child(2) {
	width: 100px;
	text-align: right;
	bottom: 25px;
	right: 150px;
}

.MyContent .Screen-04 .BeautyTips .WrapperTips p.Text,
.MyContent .Screen-04 .BeautyTips .WrapperTips p.TextLink {
	width: 236px;
}

.MyContent .Screen-04 .BeautyTips .WrapperTips p.TextLink a::after {
	display: block;
	height: 5px;
	content: " ";
}

/*----------------------- SCREEN - 07 ----------------------*/
.MyContent .Screen-06 .Wrapper .ProductInfos h3,
.MyContent .Screen-06 .BeautySchool span.num,
.MyContent .Screen-06 .BeautyRoutine h4 span.num {
	color: #3db8a8;
}

.MyContent .Screen-06 .Wrapper .BeautyTips h3,
.MyContent .Screen-06 .Wrapper .CheckBox {
	background-color: #3db8a8;
}

.MyContent .Screen-06 .Wrapper .BeautyTips {
	border-color: #3db8a8;
	background-image: url(img/Product-04-Tips-Background-1.jpg), url(img/Product-04-Tips-Background-2.jpg);
	background-position: top left, bottom right;
	background-repeat: no-repeat, no-repeat;

}

.MyContent .Screen-06 .Wrapper .Packshot span {
	width: 30%;
	text-align: left;
	top: 80%;
}

@media only screen and (max-width:761px) {
	.MyContent .Screen-06 .Wrapper .Packshot span {
		width: 20%;
		text-align: left;
		top: 80%;
	}
}

.MyContent .Screen-06 .Wrapper .BeautyTips p.Ingredient:nth-child(1) {
	width: 100px;
	text-align: left;
	top: 65px;
	left: 30px;
}

.MyContent .Screen-06 .Wrapper .BeautyTips p.Ingredient:nth-child(2) {
	width: 100px;
	text-align: right;
	bottom: 65px;
	right: 180px;
}

.MyContent .Screen-06 .BeautyTips .WrapperTips p.Text,
.MyContent .Screen-06 .BeautyTips .WrapperTips p.TextLink {
	width: 236px;
}

.MyContent .Screen-06 .BeautyTips .WrapperTips p.TextLink a::after {
	display: block;
	height: 5px;
	content: " ";
}

/*----------------------- SCREEN - 08 ----------------------*/
.MyContent .Screen-07 .Wrapper .ProductInfos h3,
.MyContent .Screen-07 .BeautySchool span.num,
.MyContent .Screen-07 .BeautyRoutine h4 span.num {
	color: #be0f34;
}

.MyContent .Screen-07 .Wrapper .BeautyTips h3,
.MyContent .Screen-07 .Wrapper .CheckBox {
	background-color: #be0f34;
}

.MyContent .Screen-07 .Wrapper .BeautyTips {
	border-color: #be0f34;
	background-image: url(img/Product-05-Tips-Background-1.jpg);
	background-position: bottom right;
	background-repeat: no-repeat;

}

.MyContent .Screen-07 .Wrapper .Packshot span {
	width: 30%;
	text-align: left;
	top: 80%;
}

@media only screen and (max-width:761px) {
	.MyContent .Screen-07 .Wrapper .Packshot span {
		width: 18%;
		text-align: left;
		top: 80%;
	}

}

.MyContent .Screen-07 .Wrapper .BeautyTips p.Ingredient:nth-child(1) {
	width: 100px;
	text-align: left;
	top: 255px;
	left: 30px;
}

.MyContent .Screen-07 .Wrapper .BeautyTips p.Ingredient:nth-child(2) {
	width: 100px;
	text-align: right;
	bottom: 25px;
	right: 150px;
}

.MyContent .Screen-07 .BeautyTips .WrapperTips {
	max-width: 555px;
	margin-left: 0;
	text-align: right;
}

.MyContent .Screen-07 .BeautyTips .WrapperTips p.Text,
.MyContent .Screen-07 .BeautyTips .WrapperTips p.TextLink {
	width: 236px;
}

.MyContent .Screen-07 .BeautyTips .WrapperTips p.TextLink a::after {
	display: block;
	height: 5px;
	content: " ";
}

/*----------------------- SCREEN - 09 ----------------------*/
.MyContent .Screen-05 .Wrapper .ProductInfos h3,
.MyContent .Screen-05 .BeautySchool span.num,
.MyContent .Screen-05 .BeautyRoutine h4 span.num {
	color: #eb595e;
}

.MyContent .Screen-05 .Wrapper .BeautyTips h3,
.MyContent .Screen-05 .Wrapper .CheckBox {
	background-color: #eb595e;
}

.MyContent .Screen-05 .Wrapper .BeautyTips {
	border-color: #eb595e;
	background-image: url(img/Product-06-Tips-Background-1.jpg), url(img/Product-06-Tips-Background-2.jpg);
	background-position: top left, bottom right;
	background-repeat: no-repeat, no-repeat;

}

.MyContent .Screen-05 .Wrapper .Packshot span {
	width: 20%;
	text-align: left;
	top: 27%;
}

@media only screen and (max-width:761px) {
	.MyContent .Screen-05 .Wrapper .Packshot span {
		width: 18%;
		text-align: left;
		top: 0%;
	}
}

.MyContent .Screen-05 .Wrapper .BeautyTips p.Ingredient:nth-child(1) {
	width: 100px;
	text-align: left;
	top: 85px;
	left: 70px;
}

.MyContent .Screen-05 .Wrapper .BeautyTips p.Ingredient:nth-child(2) {
	width: 100px;
	text-align: right;
	bottom: 25px;
	right: 240px;
}

.MyContent .Screen-05 .BeautyTips .WrapperTips p.Text,
.MyContent .Screen-05 .BeautyTips .WrapperTips p.TextLink {
	width: 236px;
}

.MyContent .Screen-05 .BeautyTips .WrapperTips p.TextLink a::after {
	display: block;
	height: 5px;
	content: " ";
}



/*----------------------- SCREEN - 10 ----------------------*/
.MyContent .Screen-10 .Wrapper .ProductInfos h3,
.MyContent .Screen-10 .BeautySchool span.num,
.MyContent .Screen-10 .BeautyRoutine h4 span.num {
	color: #dbb9b0;
}

.MyContent .Screen-10 .Wrapper .BeautyTips h3,
.MyContent .Screen-10 .Wrapper .CheckBox {
	background-color: #dbb9b0;
}

.MyContent .Screen-10 .Wrapper .BeautyTips {
	border-color: #eb595e;
	background-image: url(img/Product-07-Tips-Background-1.jpg), url(img/Product-07-Tips-Background-2.jpg);
	background-position: top left, bottom right;
	background-repeat: no-repeat, no-repeat;

}

@media only screen and (min-width:762px) {
	#Phyto-Serum {
		overflow: hidden;
	}

	#Phyto-Serum img {
		margin-right: -50%;
	}
}


.MyContent .Screen-10 .Wrapper .Packshot span {
	width: 30%;
	text-align: right;
	top: 80%;
	right: 50%;
}

.MyContent .Screen-10 .WrapperTips {
	max-width: 700px !important;

}

.MyContent .Screen-10 .WrapperTips p.Visual {
	padding: 30px;
	height: 280px;
	max-width: 606px !important;

}


@media only screen and (max-width:761px) {
	.MyContent .Screen-10 .Wrapper .Packshot span {
		width: 18%;
		text-align: left;
		top: 0%;
		right: 40%;
	}

	.MyContent .Screen-10 .WrapperTips p.Visual {
		height: 180px;
	}

	.MyContent #Phyto-Serum {
		transform: translate(50px, 0);
	}

}

.MyContent .Screen-10 .Wrapper .BeautyTips p.Ingredient:nth-child(1) {
	width: 100px;
	text-align: left;
	top: 85px;
	left: 70px;
}

.MyContent .Screen-10 .Wrapper .BeautyTips p.Ingredient:nth-child(2) {
	width: 100px;
	text-align: right;
	bottom: 25px;
	right: 150px;
}

.MyContent .Screen-10 .red {
	color: #be0f34;
}

@media only screen and (min-width:1024px) {

	.MyContent .Screen-10 .BeautyTips .WrapperTips p.Text,
	.MyContent .Screen-10 .BeautyTips .WrapperTips p.TextLink {
		width: 336px;
	}
}

.MyContent .Screen-10 .BeautyTips .WrapperTips p.TextLink a::after {
	display: block;
	height: 5px;
	content: " ";
}

/*----------------------- SCREEN - 11 ----------------------*/
.MyContent .Screen-11 .Wrapper .ProductInfos h3,
.MyContent .Screen-11 .BeautySchool span.num,
.MyContent .Screen-11 .BeautyRoutine h4 span.num {
	color: #eb595e;
}

.MyContent .Screen-11 .Wrapper .BeautyTips h3,
.MyContent .Screen-11 .Wrapper .CheckBox {
	background-color: #eb595e;
}

.MyContent .Screen-11 .Wrapper .BeautyTips {
	border-color: #eb595e;
	background-image: url(img/Product-08-Tips-Background-1.jpg), url(img/Product-08-Tips-Background-2.jpg);
	background-position: top left -65px, bottom right;
	background-repeat: no-repeat, no-repeat;
}

.MyContent .Screen-11 .BeautyTips .WrapperTips p.Visual {
	width: auto;
}

@media only screen and (max-width:761px) {
	.MyContent .Screen-11 .BeautyTips .WrapperTips p.Visual {
		width: auto;
		margin-bottom: 15px;
	}
}

.MyContent .Screen-11 .Wrapper .BeautyTips .WrapperTips {
	height: 320px;
	max-width: 846px;

}

@media only screen and (max-width:761px) {
	.MyContent .Screen-11 .Wrapper .BeautyTips .WrapperTips {
		height: auto;
	}
}

.MyContent .Screen-11 .Wrapper .Packshot span {
	width: 30%;
	text-align: left;
	top: 57%;
}

@media only screen and (max-width:761px) {
	.MyContent .Screen-11 .Wrapper .Packshot span {
		width: 48%;
		text-align: left;
		top: 0%;
	}
}

.MyContent .Screen-11 .Wrapper .BeautyTips p.Ingredient:nth-child(1) {
	width: 200px;
	text-align: left;
	top: 60px;
	left: 130px;
}

.MyContent .Screen-11 .Wrapper .BeautyTips p.Ingredient:nth-child(2) {
	width: 100px;
	text-align: right;
	bottom: 25px;
	right: 140px;
}

.MyContent .Screen-11 .BeautyTips .WrapperTips p.Text,
.MyContent .Screen-11 .BeautyTips .WrapperTips p.TextLink {
	width: 306px;
}

@media only screen and (max-width:761px) {

	.MyContent .Screen-11 .BeautyTips .WrapperTips p.Text,
	.MyContent .Screen-11 .BeautyTips .WrapperTips p.TextLink {
		width: auto;
	}
}

.MyContent .Screen-11 .BeautyTips .WrapperTips p.TextLink a::after {
	display: block;
	height: 5px;
	content: " ";
}

/*--------------------------------------------------------*/
@media only screen and (max-width:761px) {
	.MyContent .ScreenBlock {
		position: relative !important;
		top: auto !important;
		left: auto !important;
		width: 100% !important;
		display: none;
		padding-bottom: 30px;
		-webkit-transition: none;
		transition: none;
		height: auto;
	}

	.MyContent .ScreenBlock[data-selected="1"] {
		top: auto !important;
		left: auto !important;
		opacity: 1;
		z-index: 3;
		display: block;
	}

	.MyContent .ScreenBlock .Wrapper {
		position: relative !important;
		top: auto !important;
		left: auto !important;
		-webkit-transform: none !important;
		transform: none !important;
		width: 100%;
	}
}

.MyContent .Action {
	display: none;
}

/*----------------------- SCREEN - PRODUCTS ----------------------*/
.MyContent .ProductScreen[data-selected="1"] {
	height: auto;
	position: relative;
	-webkit-transform: none;
	transform: none;
	width: 100%;
	left: auto;
}

.MyContent .ProductScreen[data-selected="1"] .Wrapper {
	position: relative;
	-webkit-transform: none;
	transform: none;
	margin-left: auto;
	margin-right: auto;
	left: auto;
}

.MyContent .Packshot {
	position: relative;
	display: inline-block;
	vertical-align: middle;
}

.MyContent .Packshot img {
	position: relative;
}

@media only screen and (max-width:1023px) {
	.MyContent .Packshot img {
		max-width: 350px;
	}
}

@media only screen and (max-width:761px) {
	.MyContent .Packshot {
		margin-left: auto;
		margin-right: auto;
		max-width: 375px;
		display: block;
		width: calc(100% - 100px);
		padding-left: 120px;
		padding-bottom: 20px;
	}

	.MyContent .Packshot img {
		max-width: 100%;
	}
}

.MyContent .Packshot span {
	position: absolute;
	font-size: 12px;
	right: 0;
	top: 0;
	line-height: 1em;
}

@media only screen and (max-width:761px) {
	.MyContent .Packshot span {
		font-size: 10px;
	}
}

.MyContent .ProductInfos {
	vertical-align: middle;
	position: relative;
	display: inline-block;

	max-width: 407px;
	text-align: left;
	margin: 20px;
}

@media only screen and (max-width:1023px) {
	.MyContent .ProductInfos {
		max-width: 350px;
	}
}

@media only screen and (max-width:761px) {
	.MyContent .ProductInfos {
		margin-top: 0;
		margin-left: auto;
		margin-right: auto;
		display: block;
		width: calc(100% - 40px);
	}
}

.MyContent .ProductInfos h3 {
	margin: 0;
	padding: 0;
	font-size: 30px;
	border-bottom: 0px solid;
	text-transform: none;
	line-height: 1em;
	font-weight: normal;
	font-family: ClarinsRegular, Clarins;
	padding-bottom: 20px;
}

@media only screen and (max-width:761px) {
	/*.MyContent .ProductInfos h3 {
		position: absolute;
		right: 50%;
		text-align: right;
		top: -120px;
		transform: translateY(-100%)
	}*/

	.MyContent .ProductInfos h3 {
		position: absolute;
		right: 50%;
		text-align: right;
		bottom: calc(100% + 160px);
		top: auto;
	}

	.MyContent .ProductInfos .Price {
		position: absolute;
		right: 50%;
		text-align: right;
		top: -90px;
		transform: translateY(-100%)
	}

	.MyContent .ProductInfos .BtnLink {
		position: absolute;
		right: 50%;
		text-align: right;
		/* top: -15px; */
		/* transform: translateY(-100%); */
		bottom: calc(100% + 110px);
	}
}

.MyContent .ProductInfos .Text {
	margin: 0px;
	padding: 0px;
	padding-top: 20px;
}

@media only screen and (max-width:761px) {
	.MyContent .ProductInfos .Text {
		padding-top: 20px;
		text-align: center;
	}
}

.MyContent .ProductInfos .Title {
	margin: 0px;
	text-transform: uppercase;
	padding-top: 20px;
	padding-bottom: 20px;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
}

.MyContent .ProductInfos ul.CheckBox {
	font-size: 14px;
	color: #FFF;
	padding: 20px;
	margin: 0;
	list-style: none;
	box-sizing: border-box;
	padding-top: 12px;
}

@media only screen and (max-width:761px) {
	.MyContent .ProductInfos ul.CheckBox {
		max-width: 760px;
	}
}

.MyContent .ProductInfos ul.CheckBox li {
	display: block;
	text-align: left;
	padding-left: 40px;
	background-image: url(img/checkbox.png);
	background-repeat: no-repeat;
	background-position: top left;
	font-size: 14px;
	padding-top: 8px;
	margin-top: 8px;


}

.MyContent .BeautySchool {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}

@media only screen and (max-width:761px) {
	.MyContent .BeautySchool {
		margin-left: 20px;
		margin-right: 20px;
	}
}

.MyContent .BeautySchool h3 {
	margin: 0;
	padding: 20px;
	font-size: 50px;
	border-bottom: 0px solid;
	text-transform: none;
	line-height: 1em;
	font-weight: normal;
	font-family: ClarinsRegular, Clarins;
	color: #000;
	flex-basis: 100%;
	box-sizing: border-box;

}

@media only screen and (max-width:761px) {
	.MyContent .BeautySchool h3 {
		font-size: 40px;
	}
}

.MyContent .BeautySchool p.Text {
	margin: 0;
	padding: 20px;
	flex-basis: 100%;
	box-sizing: border-box;
	padding-top: 0;
}

.MyContent .BeautySchool img {
	display: block;
}



.MyContent .BeautyRoutine {
	width: 100%;
}


.MyContent .BeautyRoutine h3 {
	margin: 0;
	padding: 0;
	font-size: 50px;
	border-bottom: 0px solid;
	text-transform: none;
	line-height: 1em;
	font-weight: normal;
	font-family: ClarinsRegular, Clarins;
	color: #000;
	padding-bottom: 10px;
}

.MyContent .BeautyRoutine h4 {
	margin: 0;
	font-size: 35px;
	font-family: ClarinsRegular, Clarins;
	color: #000;
	border-bottom: 0px solid;
	line-height: 1em;
	font-weight: normal;
	display: block;
	clear: both;
}

.MyContent .BeautyRoutine h4 span.num {
	font-family: "Gotham SSm book A", "Gotham SSm book B", Gotham, Helvetica, Arial, sans-serif;
}

.MyContent .BeautyRoutine p {
	font-size: 14px;
	margin: 20px;
}

.MyContent .BeautyRoutine p.PackshotRoutine {
	margin: 0px;
	min-width: 320px;
	height: 230px !important;
	display: block;
	position: relative;
	font-size: 0;
	padding: 0;
}

.MyContent .BeautyRoutine p.Text {
	min-height: 40px;
}

@media only screen and (max-width:1023px) {
	.MyContent .BeautyRoutine p.PackshotRoutine {
		position: relative !important;
		height: 220px !important;
		min-width: 240px !important;
		display: block !important;
		float: none !important;
		clear: both !important;
		border: 1px solid #FFF;
		padding: 0 !important;
		font-size: 0;
	}
}

@media only screen and (max-width:1024px) {
	.MyContent .BeautyRoutine p.PackshotRoutine {
		display: block !important;
		width: 100%;
	}
}

.MyContent .BeautyRoutine p.PackshotRoutine img {
	margin: 0 !important;
	padding: 0 !important;
	width: 192px !important;
	height: 230px !important;
	left: calc(50% - 96px) !important;
	position: absolute !important;
	float: none !important;
	display: block !important;
	bottom: 0 !important;
}

.MyContent .BeautyRoutine p[data-width="300"] img {
	width: 237px !important;
	left: calc(50% - 118px) !important;
}

.MyContent .BeautyRoutine p[data-width="280"] img {
	width: 222px !important;
	left: calc(50% - 111px) !important;
}

.MyContent .BeautyRoutine p[data-width="260"] img {
	width: 206px !important;
	left: calc(50% - 103px) !important;
}

.MyContent .BeautyRoutine p[data-width="340"] img {
	width: 269px !important;
	left: calc(50% - 134px) !important;
}

.MyContent .ScreenBlock .Wrapper ul.HowToThumbs {
	margin: 0;
	padding: 0;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	width: 263px;
	margin-left: 10px;
}

@media only screen and (max-width:761px) {
	.MyContent .ScreenBlock .Wrapper ul.HowToThumbs {
		display: none;
	}

}

.MyContent .ScreenBlock .Wrapper ul.HowToThumbs li {
	margin: 5px;
	padding: 0;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	justify-content: flex-start;
	align-items: flex-end;
	font-size: 14px;
}

@media only screen and (min-width:762px) {
	.MyContent .ScreenBlock .Wrapper ul.HowToThumbs li:first-child {
		margin-top: 0px
	}

}

.MyContent .ScreenBlock .Wrapper ul.HowToThumbs li span {
	margin-left: 5px;
	margin-right: 5px;
	display: inline-block;
}

.MyContent .ScreenBlock .Wrapper ul.HowToThumbs li p {
	margin: 0;
	padding: 0;
}

@media only screen and (max-width:1023px) {
	.MyContent .ScreenBlock .Wrapper ul.HowToThumbs li p {
		margin: 0;
		padding: 0;
		display: block;
		position: relative;
		border: 1px solid #fff;
	}

}

/*
@media only screen and (max-width:1024px) {
	.MyContent .BeautyRoutine p.PackshotRoutine {
		margin-right: -120px !important;

	}
}
*/
.MyContent .BeautyTips {
	border: 2px solid;
	max-width: 970px;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 90px;
	position: relative;
}

.MyContent .BeautyTips h3 {
	border-radius: 50%;
	width: 118px;
	height: 118px;
	color: #FFF;
	margin-top: -60px;
	text-align: center;
	font-size: 25px;
	display: -webkit-flex;
	display: flex;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0;
	font-family: ClarinsRegular, Clarins;
	font-weight: normal;
	justify-content: center;
	align-items: center;
	line-height: 1em;
}

.MyContent .BeautyTips .WrapperTips {
	padding: 30px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	height: 280px;
	justify-content: center;
	align-items: center;
	max-width: 606px;
	margin-left: auto;
	margin-right: auto;
}

@media only screen and (max-width:761px) {
	.MyContent .BeautyTips .WrapperTips {
		max-width: 280px;
		-webkit-flex-wrap: nowrap;
		flex-wrap: nowrap;
		height: auto;
	}

	.MyContent .BeautyTips .WrapperTips img {
		max-width: 100%;
	}
}

.MyContent .BeautyTips .WrapperTips p.Visual {
	margin: 0;
	display: inline-block;
	max-width: 222px;
}

.MyContent .BeautyTips .WrapperTips p.Text {
	margin: 0;
	display: inline-block;
	text-align: left;
	width: 306px;
}

@media only screen and (max-width:761px) {
	.MyContent .BeautyTips .WrapperTips p.Text {
		text-align: center;
		width: auto;
	}
}

.MyContent .BeautyTips .WrapperTips p.TextLink {
	margin: 0;
	display: inline-block;
	text-align: left;
	width: 306px;
	padding-top: 20px;
}

@media only screen and (max-width:761px) {
	.MyContent .BeautyTips .WrapperTips p.TextLink {
		text-align: center;
		width: auto;
	}
}

.MyContent .BeautyTips p.Ingredient {
	position: absolute;
	font-size: 12px;
	text-align: left;
	margin: 0;
	line-height: 1em;
}

@media only screen and (max-width:1023px) {
	.MyContent .BeautyTips {
		width: calc(100% - 40px);
		background-image: none !important;
	}

	.MyContent .BeautyTips p.Ingredient {
		display: none;
	}
}

/*----------------------------------------------------*/

.MyContent .TextEnd {
	padding: 30px;
	text-align: center;
	margin: 0px;
	/*margin-top: 30px;*/
}

@media only screen and (max-width:1023px) {
	.MyContent .TextEnd {
		margin-top: 10px;
		padding-top: 10px;
	}
}

@media only screen and (max-width:761px) {
	.MyContent .TextEnd {
		margin-top: 10px;
		padding-top: 10px;
	}
}

.MyContent .TextEnd a {
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	font-size: 11px;
	border: 2px solid #e5e5e5;
	text-transform: uppercase;
	color: #000;
	text-decoration: none;
	position: relative;
	background-color: #FFF;
	padding: 11px 30px;
	display: inline-block;
	line-height: 14px;
	margin-top: 10px;
}

.link-day {
	position: absolute;
	width: 50%;
	height: 40%;
	top: 18%;
	left: 24%;
}

.link-night {
	position: absolute;
	width: 50%;
	height: 40%;
	bottom: 5%;
	left: 14%;
}

/*****DTW CUSTOM*****/
/*
@media only screen and (max-width:1023px) {
	.MyContent .BeautyRoutine p.PackshotRoutine {
		margin-right: 0px !important;
	}

	.MyContent .Screen-10 .jcarousel ul {
		margin-left: -15px;
	}
}

@media only screen and (max-width:1024px) {
	.MyContent .BeautyRoutine p.PackshotRoutine img {
		margin: 0 auto;
	}

	.MyContent .BeautyRoutine p.PackshotRoutine {
		margin-right: 0px !important;
	}

	.MyContent .BeautyRoutine {
		margin: 0 auto;
	}
}

@media only screen and (max-width:1023px) and (min-width: 762px) {
	.MyContent .Screen-11 .BeautyRoutine h4 {
		min-height: 72px;
	}
}
*/

/*****DTW CUSTOM*****/
/*
.MyContent .BeautyRoutine p.Text {
	min-height: 58px;
}

.product-tile .product-quickshop .quickviewText:hover {
	color: white;
}

*/