/*body, html {
	overflow-x: hidden;
	width: 100%;
	margin:0;
}
.breadcrumb {
display:none;
}
#main {
    margin-top:0px;
}
*/
@media only screen and (max-width:761px) {
.MyContent  .product-quickshop .swatchesCircle img {
	top: 8.5px!important;
	width: 24px!important;
}
}
.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;
}
.MyContent img{
	display: block;
	position: relative;
}
.MyContent h1 {

	margin: 0 auto;

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

}

@media only screen and (max-width:761px) {
.MyContent h2 {
	margin: 0;
	display: block;
	padding-bottom: 0;
}
}
.MyContent p.TextLink{
	padding:0;
	margin:0;
}
.MyContent p.TextLink span,
.MyContent p.TextLink a {
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	font-size: 11px;
	border-bottom: 1px solid #000;
	text-transform: uppercase;
	color: #000;
	text-decoration: none;
	position: relative;
	padding:0;
	font-weight:bold;
}


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


/*-------------------------------------------------------*/
#BLOCK-CATEGORY{
	
}

#BLOCK-CATEGORY .TextIntro{
	margin:0;
	padding-left:20px;
	padding-right:20px;
}

@media only screen and (max-width:761px) {
#BLOCK-CATEGORY{
	background: linear-gradient(to bottom, #FFFFFF,#FFFFFF 80px,#eeeeee 140px, #eeeeee );
}
}

#BLOCK-CATEGORY .Logo{
	display:block;
	margin-left: auto;
	margin-right: auto;
}

@media only screen and (max-width:761px) {
#BLOCK-CATEGORY .Logo{
	max-width:264px;
}
}
#BLOCK-CATEGORY .CategoryMosaic{
	display:flex;
	justify-content:center;
	align-items:center;
	flex-wrap:wrap;
	max-width:1210px;
	margin-left:auto;
	margin-right:auto;
	padding:20px;
	padding-top:0px;
	padding-bottom:0px;
}
@media only screen and (max-width:761px) {
#BLOCK-CATEGORY .CategoryMosaic{
	background-color:#eeeeee;
	padding:5px;
	flex-direction:column;
	
}
}
#BLOCK-CATEGORY .CategoryMosaic .Category{
	margin:20px;
	max-width:363px;
	position:relative;
	margin-bottom:30px;
	background-color:#fff;
	cursor:pointer;

	
}
@media only screen and (min-width:1024px) {
#BLOCK-CATEGORY .CategoryMosaic .Category {
min-height: 340px;
}
}
@media only screen and (max-width:1023px) {
#BLOCK-CATEGORY .CategoryMosaic .Category {
	margin: 15px;
	max-width: 334px;
	margin-bottom: 30px;
}
}
@media only screen and (max-width:761px) {
#BLOCK-CATEGORY .CategoryMosaic .Category{
	margin:5px;
	padding:10px;
	flex:1;
	width:calc(100% - 30px);
	max-width:761px;
}
}
#BLOCK-CATEGORY .CategoryMosaic .Category figure{
	display:block;
	margin:0;
	padding:0;
	overflow:hidden;
}

#BLOCK-CATEGORY .CategoryMosaic .Category figure img{
	max-width:100%;
	transition:transform ease-in-out 0.5s;
	transform:scale(1);
}
#BLOCK-CATEGORY .CategoryMosaic .Category:hover figure img{
	transform:scale(1.05);
}
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox{
	background-color:#fff;
	margin:0px;
	bottom:-23px;
	position:absolute;
	left:30px;
	width:calc(100% - 60px);
	text-align:center;
}
@media only screen and (max-width:761px) {
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox{
	background-color:#fff;
	margin:0px;
	bottom:50%;
	left:104px;
	width:calc(100% - 114px);
	text-align:center;
	transform:translateY(50%);
}	
}
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox h3{
	margin:0;
	padding:0;
	font-family:ClarinsRegular, Clarins;
	font-size:30px;
	color:#000;
	font-weight:normal;
	line-height:1em;
	
}
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox h3 a:hover{
	color:#000;
}

@media only screen and (max-width:761px) {
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox h3{
	font-size:25px;
}
}
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .NumQuestions{
	margin:0;
	padding:15px;
	color:#be0f34;
	font-weight:bold;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	font-size: 11px;
	text-transform: uppercase;
	padding-bottom:5px;
}
@media only screen and (max-width:761px) {
	#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .NumQuestions{
	padding:0px;
}
}
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .BtnLink{
	margin:0;
	margin-top:18px;
	
}
@media only screen and (max-width:761px) {
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .BtnLink{
	display:none!important;
}
}
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .BtnLink span,
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .BtnLink a {
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	font-size: 11px;
	text-transform: uppercase;
	color: #FFF;
	text-decoration: none;
	position: relative;
	background-color: #000;
	padding: 18px 30px;
	display: inline-block;
	line-height: 14px;
	border:2px solid #FFF;
	transition:ease-in-out 0.5s; 
}
#BLOCK-CATEGORY .CategoryMosaic .Category:hover  .InfosBox .BtnLink span,
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .BtnLink a:hover {
	color: #000;
	background-color: #FFF;
	border:2px solid #8b8b8b;
}
/*-------------------------------------------------------*/
#BLOCK-CATEGORY-LINKS {
		
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic{
	display:flex;
	justify-content:center;
	align-items:center;
	flex-wrap:wrap;
	max-width:1182px;
	margin-left:auto;
	margin-right:auto;
	padding:20px;
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category{
	margin:6px;
	max-width:185px;
	position:relative;
	margin-bottom:30px;
	cursor:pointer;
}
@media only screen and (max-width:1024px) and (min-width:1023px) {
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category {
	max-width:150px;
}
}
@media only screen and (max-width:761px) {
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category {
	max-width:185px;
	  width: calc(50% - 12px);
	  margin-bottom: 6px;
}
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category figure{
	display:block;
	margin:0;
	padding:0;
	max-height:131px;
	overflow:hidden;
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category figure img{
	max-width:100%;
	transform:scale(1);
	transition:transform ease-in-out 0.2s;
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category:hover figure img{
	transform:scale(1.1);
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category .InfosBox{
	background-color:#f0f2f6;
	margin:0px;
	text-align:center;
	height:40px;
	display:flex;
	justify-content:center;
	align-items:center;
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category .InfosBox h3{
	margin:0;
	padding:0;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	font-size:16px;
	color:#000;
	font-weight:normal;
	line-height:1em;
	
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category .InfosBox h3 a:hover{
	color:#000;
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category .InfosBox .NumQuestions{
	display:none;
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category .InfosBox .BtnLink{
	display:none;
}

/*-------------------------------------------------------*/
#BLOCK-QUESTIONS{
	padding-top:50px;	
	position:relative;
}
#BLOCK-QUESTIONS .jcarousel-pagination{
	bottom:-10px;
}
@media only screen and (max-width:1023px) {
#BLOCK-QUESTIONS{
	margin-bottom:40px;
}
}
@media only screen and (max-width:761px) {
#BLOCK-QUESTIONS{
	background: linear-gradient(to bottom, #eeeeee, #FFFFFF 50px, #FFFFFF );
}
}
.QuestionsMosaic{
	display:flex;
	justify-content:left;
	align-items:stretch;
	flex-wrap:wrap;
	max-width:1005px;
	margin-left:auto;
	margin-right:auto;
	padding:20px;
	width:100%;
	box-sizing:border-box;
	
}


.QuestionsMosaic .content-asset{
	flex-basis:33.33%;
	max-width: 333px;
}
.Question{
	margin:0px;
	max-width:333px;
	text-align:left;
	padding:20px;
	box-sizing:border-box;
	flex-basis:33.33%;
	min-height:250px;
	cursor:pointer;
}

.QuestionsMosaic .content-asset .Question{
	min-height:100%;
}
@media only screen and (max-width:1023px) {
.QuestionsMosaic .content-asset,
.Question {
	/* min-height: 300px; */
	margin: 0px;
	max-width: 760px;
}
.QuestionsMobileSlider{
	margin-top:20px;
}
}
@media only screen and (max-width:761px) {
.QuestionsMosaic .content-asset,
.Question {
	/* min-height: 300px; */
	margin: 0 20px;
	max-width: 760px;
}
.QuestionsMobileSlider{
	margin-top:20px;
}
}
.Question[data-category="sun"]{	
	background-color:#fff482;
}
.Question[data-category="face"]{	
	background-color:#fde6d4;
}
.Question[data-category="men"]{	
	background-color:#d8eafa;
}
.Question[data-category="body"]{	
	background-color:#f1c6a4;
}
.Question[data-category="makeup"]{	
	background-color:#fbe4ea;
}
.Question[data-category="ingredients"]{	
	background-color:#e2f7e9;
}
@media only screen and (max-width:1023px) {
/*.QuestionsMobileSlider li:nth-child(2n) .Question {
	background-color:#fff;
}*/
.QuestionsMobileSlider{
	margin-top:20px;
}
}
.Question h3{
	margin:0;
	padding:0;
	font-family:ClarinsRegular, Clarins;
	font-size:29px;
	color:#000;
	font-weight:normal;
	line-height:1em;
	position:relative;
}
.Question h3 a:hover{
		color:#000;
}
.Question h3::before {
    content: "“";
	font-size: 75px;
	line-height: 1em;
	height: 40px;
	width:30px;
	text-align: left;
	font-family: ClarinsRegular,Clarins;
	color: #FFF;
	overflow: hidden;
	display: inline-block;
	
}

.Question h3::after{
	content: "”";
	font-family:ClarinsRegular,Clarins;
}
.Question p.TextLink a {
	font-size:12px;
}
/*-------------------------------------------------------*/
.CategoryHeader{
	width:1600px;
	margin-left:calc(50% - 800px);
	position:relative;
}
@media only screen and (max-width:1249px) {
.CategoryHeader{
	width:100%;
	margin-left:0;
}	
.CategoryHeader img {
	margin-left: calc(50% - 800px);
}
}

@media only screen and (max-width:761px) {
.CategoryHeader img {
	margin-left: calc(50% - 280px);
	width: 750px;
}
}
.CategoryHeader .TextContent{
	background-color:#fff;
	position:absolute;
	left:50%;
	max-width:546px;
	padding:40px;
	box-sizing:border-box;
	top:50%;
	transform:translateY(-50%);
}
.CategoryHeader .TextContent p{
	margin:0;
}
@media only screen and (max-width:1249px) {
.CategoryHeader .TextContent{
	width:calc(50% - 40px);
}
}
@media only screen and (max-width:1023px) {
.CategoryHeader .TextContent{
	padding:30px;
}
}
@media only screen and (max-width:761px) {
.CategoryHeader .TextContent{
	transform:none;
	position:relative;
	top:auto;
	left:auto;
	padding:20px;
	max-width:761px;
	width:100%;
	padding-bottom:0px;
}
}
.MyContent .CategoryHeader  h1 {
	display: inline-block;
	font-family: ClarinsRegular, Clarins;
	font-size: 35px;
	font-weight: normal;
	line-height: 1em;
	margin: 0;
	padding: 0;
	position: relative;
	text-align: center;
	z-index: 1;
	padding-bottom:8px;

}

@media only screen and (max-width:761px) {
.MyContent .CategoryHeader  h1 {
		margin: 0 20px;
}
}
/*-------------------------------------------------------*/
.QuestionsFilter{
	font-size:0;
	padding:30px;
	padding-bottom:10px;
}
.QuestionsFilter a{
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	font-size:11px;
	border:2px solid #e5e5e5;
	line-height:26px;
	padding-left:12px;
	padding-right:12px;
	display:inline-block;
	text-decoration:none;
	text-transform:uppercase;
	color:#000;
	margin:3px;
	background-color:#FFF;
}
.QuestionsFilter a:hover{
	color:#FFF;
	background-color:#000;
}
.QuestionsFilter a.Selected{
	border:2px solid #000;
}

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

.QuestionsMobileSlider ul{
	margin:0 auto;
	list-style:none;
	padding:0;
	
}
.QuestionsMobileSlider ul li{
	padding:0;
	margin-bottom:20px;
}
@media only screen and (min-width:1024px) {
.QuestionsDesktopSlider {
	width: 1000px;
	margin: 0 auto;
}
.QuestionsDesktopSlider ul li {
	/*width:1000px;*/
}
}
@media only screen and (max-width:1023px) {
.QuestionsDesktopSlider {
	display:none;
}
}
.QuestionsDesktopSlider ul{
	margin:0 auto;
	list-style:none;
	padding:0;
	
}
/*.QuestionsDesktopSlider ul li{
	padding:0;
	display:flex;
	flex-wrap:wrap;
	
}*/
/*-------------------------------------------------------*/
#BLOCK-QUESTIONS-CATEGORY{
	position:relative;
	display:block;
	margin-bottom:40px;
}
#BLOCK-QUESTIONS-CATEGORY .QuestionsMosaic {
	display:none;
}
#BLOCK-QUESTIONS-CATEGORY .jcarousel .QuestionsMosaic {
	width:1000px;
	display:flex;
	box-sizing: border-box;
}
@media only screen and (max-width:1023px) {
#BLOCK-QUESTIONS-CATEGORY .jcarousel .QuestionsMosaic {
	width:760px;
}	
}
#BLOCK-QUESTIONS-CATEGORY .jcarousel-control-prev,
#BLOCK-QUESTIONS-CATEGORY .jcarousel-control-next {
	display:inline-block;
	width:28px;
	height:28px;
	line-height:28px;
	font-size:16px;
	border:#e5e5e5 2px solid;
	border-radius:0;
	box-shadow:none;
	text-shadow:none;
	background-color:#fff;
	color:#000;
	position:relative;
	left:auto;
	top:auto;
	right:auto;
}
#BLOCK-QUESTIONS-CATEGORY .jcarousel-control-prev.hidden-arrow,
#BLOCK-QUESTIONS-CATEGORY .jcarousel-control-next.hidden-arrow {
	display:none;

}	

@media only screen and (max-width:761px) {
#BLOCK-QUESTIONS-CATEGORY .jcarousel-control-prev,
#BLOCK-QUESTIONS-CATEGORY .jcarousel-control-next {
	display:none;

}	
}

#BLOCK-QUESTIONS-CATEGORY  .jcarousel-pagination div,
#BLOCK-QUESTIONS-CATEGORY  .jcarousel-pagination a,
#ROUTINE-PRODUCT-JCAROUSEL .jcarousel-pagination div,
#ROUTINE-PRODUCT-JCAROUSEL .jcarousel-pagination a{
	cursor:pointer;
}

@media only screen and (min-width:761px) {
#BLOCK-QUESTIONS-CATEGORY  .jcarousel-pagination div,
#BLOCK-QUESTIONS-CATEGORY  .jcarousel-pagination a{
	display:inline-block;
	width:26px;
	height:26px;
	line-height:26px;
	font-size:14px;
	border:#fff 2px solid;
	border-radius:0;
	box-shadow:none;
	text-shadow:none;
	background-color:#fff;
	color:#000;
	position:relative;
	left:auto;
	top:auto;
	right:auto;
	text-indent: 0;
	margin: 2px;
	cursor:pointer;
}

#BLOCK-QUESTIONS-CATEGORY .jcarousel-pagination div.active,
#BLOCK-QUESTIONS-CATEGORY .jcarousel-pagination a.active{
	background-color:#e5e5e5;
	
}
}
#BLOCK-QUESTIONS-CATEGORY  .jcarousel-pagination{
	bottom:auto;
	position:relative;
	left:auto;
	right:auto;	
	display:inline-block;
	transform:none;
	min-width: 0;
}

@media only screen and (max-width:1023px) {
	#BLOCK-QUESTIONS-CATEGORY .QuestionsMosaic {
		width:730px;
	}
}
@media only screen and (max-width:761px) {
	#BLOCK-QUESTIONS-CATEGORY .QuestionsMosaic {
		width:calc(100vw - 40px);
	}
}
#BLOCK-QUESTIONS-CATEGORY .Question:nth-child(2n){
	background-color:#fff;
}

#BLOCK-QUESTIONS-CATEGORY .Question[data-category="sun"]:nth-child(2n) h3::before{	
	color:#fff482;
}
#BLOCK-QUESTIONS-CATEGORY .Question[data-category="face"]:nth-child(2n) h3::before{	
	color:#fde6d4;
}
#BLOCK-QUESTIONS-CATEGORY .Question[data-category="men"]:nth-child(2n) h3::before{	
	color:#d8eafa;
}
#BLOCK-QUESTIONS-CATEGORY .Question[data-category="body"]:nth-child(2n) h3::before{	
	color:#f1c6a4;
}
#BLOCK-QUESTIONS-CATEGORY .Question[data-category="makeup"]:nth-child(2n) h3::before{	
	color:#fbe4ea;
}
#BLOCK-QUESTIONS-CATEGORY .Question[data-category="ingredients"]:nth-child(2n) h3::before{	
	color:#e2f7e9;
}

/*-------------------------------------------------------*/
#BLOCK-RELATED-CONTENTS{
		padding-top:50px;
		position:relative;
}

.RelatedContentMosaic{
/*	display:flex;
	justify-content:center;
	align-items:flex-start;
	flex-wrap:wrap;*/
	max-width:1210px;
	margin-left:auto;
	margin-right:auto;
	padding:0px;
	padding-top:0;
	/*width: calc(100% - 40px);*/
}

.RelatedContentMosaic .RelatedContent .Title{
	margin:0;
	padding:0;
	font-family:ClarinsRegular, Clarins;
	font-size:30px;
	color:#000;
	font-weight:normal;
	line-height:1em;
	position:relative;
	margin-bottom:10px;
}
.RelatedContentMosaic .RelatedContent span{
	position:relative;
}

.RelatedContentMosaic .RelatedContent span img{
	position:absolute;
	left:-20px;
	bottom:-2px;
}
.RelatedContentMosaic .RelatedContent figure{
	margin:0px;
	padding:0;
	overflow:hidden;

}


.RelatedContentMosaic .RelatedContent figure img{
	max-width:100%;
	transition:transform ease-in-out 0.5s;
	transform:scale(1);
}
.RelatedContentMosaic .RelatedContent:hover figure img{
	transform:scale(1.05);
}
.RelatedContentMosaic .RelatedContent{
	margin:20px;
	max-width:363px;
	text-align:left;
	box-sizing:border-box;
	position:relative;
	cursor:pointer;
	
}

.RelatedContentMosaic .RelatedContent .InfosBox{
	background-color:#fff;
	margin:0px;
	bottom:20px;
	position:absolute;
	left:20px;
	width:calc(100% - 40px);
	text-align:center;
	padding:20px;
	box-sizing:border-box;
	min-height:120px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}
@media only screen and (max-width:1249px) {
	.RelatedContentMosaic .RelatedContent .Title{
		font-size:25px;
	}
	.RelatedContentMosaic .RelatedContent .Title img{
		max-width:140px;
	}
}
@media only screen and (max-width:1023px) {
#BLOCK-RELATED-CONTENTS{
	padding-top:20px;	
	padding-bottom:0px;
}	
.RelatedContentMosaic {
	padding: 0;
	width: calc(100% - 40px);
	margin: 20px;
	margin-bottom: 0;
}
.RelatedContentMosaic .RelatedContent{
	margin:0px auto; 
	margin-bottom:40px;
}
.RelatedContentMosaic .jcarousel-pagination{
	bottom:10px;
}
}
/*@media only screen and (max-width:761px) {
	#BLOCK-RELATED-CONTENTS{
			padding-top:20px;	
	}	
	.RelatedContentMosaic .RelatedContent{
		margin:5px;
	}
	
	.RelatedContentMosaic .RelatedContent .Title{
		font-size:20px;
	}
	.RelatedContentMosaic .RelatedContent .Title img{
		max-width:140px;
	}
	.RelatedContentMosaic .RelatedContent figure{
		height:230px;
	}
	.RelatedContentMosaic .RelatedContent .InfosBox {
		bottom: 5px;
		left: 5px;
		width: calc(100% - 10px);
		padding: 10px;
		min-height:80px;
	}
}*/
#BLOCK-QUESTIONS-ROUTINE {
	margin-top:40px;
	margin-bottom:40px;
}
@media only screen and (max-width:761px) {
	#BLOCK-QUESTIONS-ROUTINE {
	margin-top:20px;
	margin-bottom:20px;
}
}
#BLOCK-QUESTIONS-ROUTINE .Visual{
	padding-bottom:10px;
	padding-top:20px;
}
#BLOCK-QUESTIONS-ROUTINE .ProductName{
	font-family:ClarinsRegular, Clarins;
	font-size:18px;
	padding:20px;
	padding-top:0px;
	padding-bottom:10px;
	min-height:60px;
}
#BLOCK-QUESTIONS-ROUTINE .Price{
	padding-bottom:10px;
}
#BLOCK-QUESTIONS-ROUTINE .Visual img{
	display:block;
	margin:0 auto;
}

.Article-FAQ{
	display:flex;
	justify-content:center;
	align-items:flex-start;
	flex-wrap:wrap;
}
@media only screen and (max-width:761px) {
	.Article-FAQ {
		flex-direction:column;
			align-items:center;
	}
}
.Article-FAQ h1{
	text-align:center;
	display:block;
	font-family:ClarinsRegular, Clarins;
	font-size:50px;
	line-height:1em;
	font-weight:normal;
	margin:0;
	padding:0 20px;
	box-sizing:border-box;
	width:100%;
	flex-basis:100%;
	padding-bottom: 15px;
}
@media only screen and (max-width:761px) {
	.Article-FAQ h1{
		font-size:35px;
		padding-bottom: 10px;

	}
}
.Article-FAQ .TextContent{
	flex:1;
	text-align:left;
	padding-top:40px;
	padding-right:40px;
	box-sizing:border-box;
}
@media only screen and (max-width:761px) {
	.Article-FAQ .TextContent{
	text-align:center;
	padding:20px;
}
}
.Article-FAQ .TextContent h2{
	margin:0;
	padding-bottom:15px;
	font-weight:normal;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	font-size: 18px;
	line-height: 1.4em;
	color: #000;
	text-align: left;

}
.Article-FAQ .TextContent a{
	text-decoration:underline;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	text-transform:uppercase;
	font-size:11px;
}
.Article-FAQ .TextContent p{ 
	margin:0;
}
.Article-FAQ .TextContent p+h2{ 
	margin-top:30px;
}
.Article-FAQ .VisualContent{
	max-width:465px;
}
.Article-FAQ .VisualContent img{
	max-width:100%;
	cursor:pointer;
}
@media only screen and (max-width:1023px) {
	.Article-FAQ .VisualContent {
		max-width: 355px;
	}
}

@media only screen and (max-width:761px) {
	.Article-FAQ .Packshot{
		padding:0 20px;
		margin:0 auto;
	}
	.Article-FAQ .VisualContent{
	/*order:2;*/
	}
	.Article-FAQ .TextContent h2{
		text-align:center;
	}
}
.Article-FAQ h1 img{
	margin:0 auto;
	display:block;
}

.MyContent .ShareLink{
position: absolute;
top: 50%;
right: 20px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
margin: 0;
}

@media only screen and (max-width:761px) {
.MyContent .ShareLink{
position: relative;
top: auto;
right: auto;
-webkit-transform: none;
transform: none;
margin: 0;
text-align:center;
margin-top:20px;
}
}
/*-----------------------------*/
.st_facebook_custom {
	background: url("img/facebook.svg") no-repeat scroll left top transparent;
	background-size: 100% auto;
	padding:0;
	display:inline-block;
	cursor: pointer;
	width: 30px;
	height: 30px;
	margin-right:5px;
}
.st_twitter_custom {
	background: url("img/twitter.svg") no-repeat scroll left top transparent;
	background-size: 100% auto;
	padding: 0;
	width: 30px;
	height: 30px;
	display:inline-block;
	cursor: pointer;
		margin-right:5px;
}
.st_pinterest_custom {
	background: url("img/pinterest.svg") no-repeat scroll left top transparent;
	background-size: 100% auto;
	padding: 0;
	width: 30px;
	height: 30px;
	display:inline-block;
	cursor: pointer;
}

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

.MyContent .Article-Breadcrumb{
	padding:20px;
	position:relative;
	padding-top:0;
}
.MyContent .Article-Breadcrumb p.TextLink{
	display:block;
	position:relative;
	line-height:50px;
	text-align:center;
	
}
.MyContent .Article-Breadcrumb p.TextLink img{
	display: block;
	position: relative;
	margin: 0 auto;
	max-width: 100%;
}
@media only screen and (max-width:761px) {
.MyContent .Article-Breadcrumb p.TextLink img {

	margin-bottom: 20px;
}

}

@media only screen and (max-width:761px) {
.MyContent .Article-Breadcrumb p.TextLink a{
	/*	margin:0;
		padding:20px;
		text-align:left;
		border:1px solid #e7e7e7;
		line-height:1em;*/
}
.MyContent .Article-Breadcrumb p.TextLink a span{
		display:none;
}
}

@media only screen and (max-width:1023px) {
#ROUTINE-PRODUCT-JCAROUSEL {
	padding-bottom:40px;
}
#ROUTINE-PRODUCT-JCAROUSEL .jcarousel-pagination{
	bottom:0;
}
}


@media only screen and (max-width:761px) {
.product-quickshop{
	display:inline-block;
}
}
/*-------------------------------------------------------*/
/*-------------------------------------------*/
.MyContent #Transversal-Push {
	position:relative;
	
}

.MyContent #Transversal-Push  h2 {
	margin: 0;
	font-family: ClarinsRegular, Clarins;
	font-size: 35px;
	line-height: 35px;
	color: #000;
	font-weight: normal;
	padding: 0;
	padding-top: 20px;

}

@media screen and (max-width: 761px) {
.MyContent #Transversal-Push  h2 {
	margin-left: 20px;
	margin-right: 20px;
}
}

.MyContent #Transversal-Push .jcarousel {
	margin-left: auto;
	margin-right: auto;
	width: 970px;
}
@media screen and (max-width: 1023px) {
	.MyContent #Transversal-Push .jcarousel {
	width: 590px;
}

}

.MyContent #Transversal-Push .products-pagination.jcarousel-control-next, 
.MyContent #Transversal-Push .products-pagination.jcarousel-control-prev{
	top:calc(50% - 35px);
	display:none;
	
}
@media screen and (max-width: 1023px) {
.MyContent #Transversal-Push .products-pagination.jcarousel-control-next, 
.MyContent #Transversal-Push .products-pagination.jcarousel-control-prev{
	display:block;
	
}
}
@media screen and (max-width: 761px) {
.MyContent #Transversal-Push .products-pagination.jcarousel-control-next, 
.MyContent #Transversal-Push .products-pagination.jcarousel-control-prev{
	display:none;
	
}
}
.MyContent #Transversal-Push .products-pagination.jcarousel-control-next{
	right:20px;
}
.MyContent #Transversal-Push .products-pagination.jcarousel-control-prev{
	left:20px;
	
}
@media screen and (max-width: 761px) {
.MyContent #Transversal-Push .jcarousel {
	width: 290px;
	padding-bottom:40px;
}
.MyContent #Transversal-Push .jcarousel-pagination {
	display:block;
	bottom:0;
}
}
.MyContent #Transversal-Push ul {
	display: block;
	
	text-align: center;
	position: relative;
	margin-bottom: 60px;
}

.MyContent #Transversal-Push ul li {
	font-size: 0;
	border: 2px solid #e5e5e5;
	cursor: pointer;
	display: inline-block;
	margin: 20px;
	max-width: 284px;
	min-height: 410px;
	padding-bottom: 50px;
	text-align: left;
	vertical-align: top;
	/*width: calc(50% - 40px);*/
	position:relative;
}
.MyContent #Transversal-Push ul li img {
	max-width: 100%;
}
@media screen and (max-width: 1023px) {
.MyContent #Transversal-Push ul li  {
	margin: 5px;
	/*width: calc(33% - 14px);*/
	margin-top:20px;
}
}

.MyContent #Transversal-Push ul li p.Text {
	margin: 0;
	font-family: ClarinsRegular, Clarins;
	font-size: 28px;
	line-height: 1em;
	color: #000;
	padding: 0;
	padding-bottom: 10px;
	font-weight: normal;
	padding-left: 20px;
	padding-right: 20px;
	min-height: 100px;
}

.MyContent #Transversal-Push ul li p.Title {
	color: #be0f34;
	text-transform: uppercase;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	margin: 0;

	font-size: 11px;
	padding: 20px;
	padding-bottom: 10px;
}

.MyContent #Transversal-Push ul li p.text-link {
	bottom: 20px;
	font-size: 11px;
	line-height: 14px;
	margin: 0;
	padding: 20px;
	position: absolute;
		padding-bottom:8px;
}

.MyContent #Transversal-Push ul li p.text-link a {
	text-transform: uppercase;
	color: #000;
	text-decoration: none;
	border-bottom: #d5d5d5 1px solid;
}


@media screen and (max-width: 350px) {
.MyContent #Transversal-Push ul li p.Text {
	font-size: 20px;
}
}

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


@media only screen and (max-width:1023px) {
.MyContent .QuestionsMobileSlider{
	display:block!important;
}
.MyContent .QuestionsMosaic:not(.QuestionsMosaicData)  {
	display:none!important;
}
.MyContent #BLOCK-QUESTIONS .jcarousel-pagination{
display:block!important;
}
}

@media only screen and (min-width:1024px) {
.MyContent .QuestionsMobileSlider{
	display:none!important;
}
.MyContent .QuestionsMosaic:not(.QuestionsMosaicData) {
	display:flex!important;
}
.MyContent #BLOCK-QUESTIONS .jcarousel-pagination{
		display:none!important;
}
}

#ROUTINE-PRODUCT-JCAROUSEL[data-displayed-items="2|2|1"]{
	max-width:700px;
	margin:0 auto;
}

/*--------- DTW -------------*/

@media only screen and (max-width: 761px) {
	.MyContent h2 {
		padding-bottom: 10px;
	}
}
@media only screen and (max-width: 768px){
	.Question{
		min-height: 0px;
	}
	.Question h3{
		font-size: 27px;
	}
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.QuestionsMosaic {
	flex-wrap: wrap;
}
.QuestionsMosaic {
	padding: 0px;
}
}



/*Quickshop*/
.product-tile{
  margin-left: auto;
  margin-right: auto;
}

@media only screen and (max-width:761px) {
  .product-tile{
    display: none;
  }
}

/*body, html {
  overflow-x: hidden;
  width: 100%;
  margin:0;
}
.breadcrumb {
display:none;
}
#main {
    margin-top:0px;
}
*/
@media only screen and (max-width:761px) {
.MyContent  .product-quickshop .swatchesCircle img {
  top: 8.5px!important;
  width: 24px!important;
}
}
.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;
}
.MyContent img{
  display: block;
  position: relative;
}
.MyContent h1 {

  margin: 0 auto;

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

}

@media only screen and (max-width:761px) {
.MyContent h2 {
  margin: 0;
  display: block;
  padding-bottom: 0;
}
}
.MyContent p.TextLink{
  padding:0;
  margin:0;
}
.MyContent p.TextLink span,
.MyContent p.TextLink a {
  font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
  font-size: 11px;
  border-bottom: 1px solid #000;
  text-transform: uppercase;
  color: #000;
  text-decoration: none;
  position: relative;
  padding:0;
  font-weight:bold;
}


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


/*-------------------------------------------------------*/
#BLOCK-CATEGORY{
  
}

#BLOCK-CATEGORY .TextIntro{
  margin:0;
  padding-left:20px;
  padding-right:20px;
}

@media only screen and (max-width:761px) {
#BLOCK-CATEGORY{
  background: linear-gradient(to bottom, #FFFFFF,#FFFFFF 80px,#eeeeee 140px, #eeeeee );
}
}

#BLOCK-CATEGORY .Logo{
  display:block;
  margin-left: auto;
  margin-right: auto;
}

@media only screen and (max-width:761px) {
#BLOCK-CATEGORY .Logo{
  max-width:264px;
}
}
#BLOCK-CATEGORY .CategoryMosaic{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  max-width:1210px;
  margin-left:auto;
  margin-right:auto;
  padding:20px;
  padding-top:0px;
  padding-bottom:0px;
}
@media only screen and (max-width:761px) {
#BLOCK-CATEGORY .CategoryMosaic{
  background-color:#eeeeee;
  padding:5px;
  flex-direction:column;
  
}
}
#BLOCK-CATEGORY .CategoryMosaic .Category{
  margin:20px;
  max-width:363px;
  position:relative;
  margin-bottom:30px;
  background-color:#fff;
  cursor:pointer;

  
}
@media only screen and (min-width:1024px) {
#BLOCK-CATEGORY .CategoryMosaic .Category {
min-height: 340px;
}
}
@media only screen and (max-width:1023px) {
#BLOCK-CATEGORY .CategoryMosaic .Category {
  margin: 15px;
  max-width: 334px;
  margin-bottom: 30px;
}
}
@media only screen and (max-width:761px) {
#BLOCK-CATEGORY .CategoryMosaic .Category{
  margin:5px;
  padding:10px;
  flex:1;
  width:calc(100% - 30px);
  max-width:761px;
}
}
#BLOCK-CATEGORY .CategoryMosaic .Category figure{
  display:block;
  margin:0;
  padding:0;
  overflow:hidden;
}

#BLOCK-CATEGORY .CategoryMosaic .Category figure img{
  max-width:100%;
  transition:transform ease-in-out 0.5s;
  transform:scale(1);
}
#BLOCK-CATEGORY .CategoryMosaic .Category:hover figure img{
  transform:scale(1.05);
}
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox{
  background-color:#fff;
  margin:0px;
  bottom:-23px;
  position:absolute;
  left:30px;
  width:calc(100% - 60px);
  text-align:center;
}
@media only screen and (max-width:761px) {
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox{
  background-color:#fff;
  margin:0px;
  bottom:50%;
  left:104px;
  width:calc(100% - 114px);
  text-align:center;
  transform:translateY(50%);
} 
}
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox h3{
  margin:0;
  padding:0;
  font-family:ClarinsRegular, Clarins;
  font-size:30px;
  color:#000;
  font-weight:normal;
  line-height:1em;
  
}
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox h3 a:hover{
  color:#000;
}

@media only screen and (max-width:761px) {
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox h3{
  font-size:25px;
}
}
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .NumQuestions{
  margin:0;
  padding:15px;
  color:#be0f34;
  font-weight:bold;
  font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  padding-bottom:5px;
}
@media only screen and (max-width:761px) {
  #BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .NumQuestions{
  padding:0px;
}
}
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .BtnLink{
  margin:0;
  margin-top:18px;
  
}
@media only screen and (max-width:761px) {
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .BtnLink{
  display:none!important;
}
}
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .BtnLink span,
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .BtnLink a {
  font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  color: #FFF;
  text-decoration: none;
  position: relative;
  background-color: #000;
  padding: 18px 30px;
  display: inline-block;
  line-height: 14px;
  border:2px solid #FFF;
  transition:ease-in-out 0.5s; 
}
#BLOCK-CATEGORY .CategoryMosaic .Category:hover  .InfosBox .BtnLink span,
#BLOCK-CATEGORY .CategoryMosaic .Category .InfosBox .BtnLink a:hover {
  color: #000;
  background-color: #FFF;
  border:2px solid #8b8b8b;
}
/*-------------------------------------------------------*/
#BLOCK-CATEGORY-LINKS {
    
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  max-width:1182px;
  margin-left:auto;
  margin-right:auto;
  padding:20px;
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category{
  margin:6px;
  max-width:185px;
  position:relative;
  margin-bottom:30px;
  cursor:pointer;
}
@media only screen and (max-width:1024px) and (min-width:1023px) {
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category {
  max-width:150px;
}
}
@media only screen and (max-width:761px) {
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category {
  max-width:185px;
    width: calc(50% - 12px);
    margin-bottom: 6px;
}
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category figure{
  display:block;
  margin:0;
  padding:0;
  max-height:131px;
  overflow:hidden;
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category figure img{
  max-width:100%;
  transform:scale(1);
  transition:transform ease-in-out 0.2s;
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category:hover figure img{
  transform:scale(1.1);
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category .InfosBox{
  background-color:#f0f2f6;
  margin:0px;
  text-align:center;
  height:40px;
  display:flex;
  justify-content:center;
  align-items:center;
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category .InfosBox h3{
  margin:0;
  padding:0;
  font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
  font-size:16px;
  color:#000;
  font-weight:normal;
  line-height:1em;
  
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category .InfosBox h3 a:hover{
  color:#000;
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category .InfosBox .NumQuestions{
  display:none;
}
#BLOCK-CATEGORY-LINKS .CategoryMosaic .Category .InfosBox .BtnLink{
  display:none;
}

/*-------------------------------------------------------*/
#BLOCK-QUESTIONS{
  padding-top:50px; 
  position:relative;
}
#BLOCK-QUESTIONS .jcarousel-pagination{
  bottom:-10px;
}
@media only screen and (max-width:1023px) {
#BLOCK-QUESTIONS{
  margin-bottom:40px;
}
}
@media only screen and (max-width:761px) {
#BLOCK-QUESTIONS{
  background: linear-gradient(to bottom, #eeeeee, #FFFFFF 50px, #FFFFFF );
}
}
.QuestionsMosaic{
  display:flex;
  justify-content:left;
  align-items:stretch;
  flex-wrap:wrap;
  max-width:1005px;
  margin-left:auto;
  margin-right:auto;
  padding:20px;
  width:100%;
  box-sizing:border-box;
  
}


.QuestionsMosaic .content-asset{
  flex-basis:33.33%;
  max-width: 333px;
}
.Question{
  margin:0px;
  max-width:333px;
  text-align:left;
  padding:20px;
  box-sizing:border-box;
  flex-basis:33.33%;
  min-height:250px;
  cursor:pointer;
}

.QuestionsMosaic .content-asset .Question{
  min-height:100%;
}
@media only screen and (max-width:1023px) {
.QuestionsMosaic .content-asset,
.Question {
  /* min-height: 300px; */
  margin: 0px;
  /*max-width: 760px;*/
  max-width: auto;
}
.QuestionsMobileSlider{
  margin-top:20px;
}
.Question{
  max-width:100%;
}
}
@media only screen and (max-width:761px) {
.QuestionsMosaic .content-asset,
.Question {
  /* min-height: 300px; */
  margin: 0 20px;
  max-width: 760px;
}
.QuestionsMobileSlider{
  margin-top:20px;
}
}
.Question[data-category="sun"]{ 
  background-color:#fff482;
}
.Question[data-category="face"]{  
  background-color:#fde6d4;
}
.Question[data-category="men"]{ 
  background-color:#d8eafa;
}
.Question[data-category="body"]{  
  background-color:#f1c6a4;
}
.Question[data-category="makeup"]{  
  background-color:#fbe4ea;
}
.Question[data-category="ingredients"]{ 
  background-color:#e2f7e9;
}
@media only screen and (max-width:1023px) {
/*.QuestionsMobileSlider li:nth-child(2n) .Question {
  background-color:#fff;
}*/
.QuestionsMobileSlider{
  margin-top:20px;
}
}
.Question h3{
  margin:0;
  padding:0;
  font-family:ClarinsRegular, Clarins;
  font-size:29px;
  color:#000;
  font-weight:normal;
  line-height:1em;
  position:relative;
}
.Question h3 a:hover{
    color:#000;
}
.Question h3::before {
    content: "“";
  font-size: 75px;
  line-height: 1em;
  height: 40px;
  width:30px;
  text-align: left;
  font-family: ClarinsRegular,Clarins;
  color: #FFF;
  overflow: hidden;
  display: inline-block;
  
}

.Question h3::after{
    content: "”";
  font-family:ClarinsRegular,Clarins;
}
.Question p.TextLink a {
  font-size:12px;
}
/*-------------------------------------------------------*/
.CategoryHeader{
  width:1600px;
  margin-left:calc(50% - 800px);
  position:relative;
}
@media only screen and (max-width:1249px) {
.CategoryHeader{
  width:100%;
  margin-left:0;
} 
.CategoryHeader img {
  margin-left: calc(50% - 800px);
}
}

@media only screen and (max-width:761px) {
.CategoryHeader img {
  margin-left: calc(50% - 280px);
  width: 750px;
}
}
.CategoryHeader .TextContent{
  background-color:#fff;
  position:absolute;
  left:50%;
  max-width:546px;
  padding:40px;
  box-sizing:border-box;
  top:50%;
  transform:translateY(-50%);
}
.CategoryHeader .TextContent p{
  margin:0;
}
@media only screen and (max-width:1249px) {
.CategoryHeader .TextContent{
  width:calc(50% - 40px);
}
}
@media only screen and (max-width:1023px) {
.CategoryHeader .TextContent{
  padding:30px;
}
}
@media only screen and (max-width:761px) {
.CategoryHeader .TextContent{
  transform:none;
  position:relative;
  top:auto;
  left:auto;
  padding:20px;
  max-width:761px;
  width:100%;
  padding-bottom:0px;
}
}
.MyContent .CategoryHeader  h1 {
  display: inline-block;
  font-family: ClarinsRegular, Clarins;
  font-size: 35px;
  font-weight: normal;
  line-height: 1em;
  margin: 0;
  padding: 0;
  position: relative;
  text-align: center;
  z-index: 1;
  padding-bottom:8px;

}

@media only screen and (max-width:761px) {
.MyContent .CategoryHeader  h1 {
    margin: 0 20px;
}
}
/*-------------------------------------------------------*/
.QuestionsFilter{
  font-size:0;
  padding:30px;
  padding-bottom:10px;
}
.QuestionsFilter a{
  font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
  font-size:11px;
  border:2px solid #e5e5e5;
  line-height:26px;
  padding-left:12px;
  padding-right:12px;
  display:inline-block;
  text-decoration:none;
  text-transform:uppercase;
  color:#000;
  margin:3px;
  background-color:#FFF;
}
.QuestionsFilter a:hover{
  color:#FFF;
  background-color:#000;
}
.QuestionsFilter a.Selected{
  border:2px solid #000;
}

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

.QuestionsMobileSlider ul{
  margin:0 auto;
  list-style:none;
  padding:0;
  
}
.QuestionsMobileSlider ul li{
  padding:0;
  margin-bottom:20px;
}
@media only screen and (min-width:1024px) {
.QuestionsDesktopSlider {
  width: 1000px;
  margin: 0 auto;
}
.QuestionsDesktopSlider ul li {
  /*width:1000px;*/
}
}
@media only screen and (max-width:1023px) {
.QuestionsDesktopSlider {
  display:none;
}
}
.QuestionsDesktopSlider ul{
  margin:0 auto;
  list-style:none;
  padding:0;
  
}
/*.QuestionsDesktopSlider ul li{
  padding:0;
  display:flex;
  flex-wrap:wrap;
  
}*/
/*-------------------------------------------------------*/
#BLOCK-QUESTIONS-CATEGORY{
  position:relative;
  display:block;
  margin-bottom:40px;
}
#BLOCK-QUESTIONS-CATEGORY .QuestionsMosaic {
  display:none;
}
#BLOCK-QUESTIONS-CATEGORY .jcarousel .QuestionsMosaic {
  width:1000px;
  display:flex;
  box-sizing: border-box;
}
@media only screen and (max-width:1023px) {
#BLOCK-QUESTIONS-CATEGORY .jcarousel .QuestionsMosaic {
  width:760px;
} 
}
#BLOCK-QUESTIONS-CATEGORY .jcarousel-control-prev,
#BLOCK-QUESTIONS-CATEGORY .jcarousel-control-next {
  display:inline-block;
  width:28px;
  height:28px;
  line-height:28px;
  font-size:16px;
  border:#e5e5e5 2px solid;
  border-radius:0;
  box-shadow:none;
  text-shadow:none;
  background-color:#fff;
  color:#000;
  position:relative;
  left:auto;
  top:auto;
  right:auto;
}
#BLOCK-QUESTIONS-CATEGORY .jcarousel-control-prev.hidden-arrow,
#BLOCK-QUESTIONS-CATEGORY .jcarousel-control-next.hidden-arrow {
  display:none;

} 

@media only screen and (max-width:761px) {
#BLOCK-QUESTIONS-CATEGORY .jcarousel-control-prev,
#BLOCK-QUESTIONS-CATEGORY .jcarousel-control-next {
  display:none;

} 
}

#BLOCK-QUESTIONS-CATEGORY  .jcarousel-pagination div,
#BLOCK-QUESTIONS-CATEGORY  .jcarousel-pagination a,
#ROUTINE-PRODUCT-JCAROUSEL .jcarousel-pagination div,
#ROUTINE-PRODUCT-JCAROUSEL .jcarousel-pagination a{
  cursor:pointer;
}

@media only screen and (min-width:761px) {
#BLOCK-QUESTIONS-CATEGORY  .jcarousel-pagination div,
#BLOCK-QUESTIONS-CATEGORY  .jcarousel-pagination a{
  display:inline-block;
  width:26px;
  height:26px;
  line-height:26px;
  font-size:14px;
  border:#fff 2px solid;
  border-radius:0;
  box-shadow:none;
  text-shadow:none;
  background-color:#fff;
  color:#000;
  position:relative;
  left:auto;
  top:auto;
  right:auto;
  text-indent: 0;
  margin: 2px;
  cursor:pointer;
}

#BLOCK-QUESTIONS-CATEGORY .jcarousel-pagination div.active,
#BLOCK-QUESTIONS-CATEGORY .jcarousel-pagination a.active{
  background-color:#e5e5e5;
  
}
}
#BLOCK-QUESTIONS-CATEGORY  .jcarousel-pagination{
  bottom:auto;
  position:relative;
  left:auto;
  right:auto; 
  display:inline-block;
  transform:none;
  min-width: 0;
}

@media only screen and (max-width:1023px) {
  #BLOCK-QUESTIONS-CATEGORY .QuestionsMosaic {
    width:730px;
  }
}
@media only screen and (max-width:761px) {
  #BLOCK-QUESTIONS-CATEGORY .QuestionsMosaic {
    width:calc(100vw - 40px);
  }
}
#BLOCK-QUESTIONS-CATEGORY .Question:nth-child(2n){
  background-color:#fff;
}

#BLOCK-QUESTIONS-CATEGORY .Question[data-category="sun"]:nth-child(2n) h3::before{  
  color:#fff482;
}
#BLOCK-QUESTIONS-CATEGORY .Question[data-category="face"]:nth-child(2n) h3::before{ 
  color:#fde6d4;
}
#BLOCK-QUESTIONS-CATEGORY .Question[data-category="men"]:nth-child(2n) h3::before{  
  color:#d8eafa;
}
#BLOCK-QUESTIONS-CATEGORY .Question[data-category="body"]:nth-child(2n) h3::before{ 
  color:#f1c6a4;
}
#BLOCK-QUESTIONS-CATEGORY .Question[data-category="makeup"]:nth-child(2n) h3::before{ 
  color:#fbe4ea;
}
#BLOCK-QUESTIONS-CATEGORY .Question[data-category="ingredients"]:nth-child(2n) h3::before{  
  color:#e2f7e9;
}

/*-------------------------------------------------------*/
#BLOCK-RELATED-CONTENTS{
    padding-top:50px;
    position:relative;
}

.RelatedContentMosaic{
/*  display:flex;
  justify-content:center;
  align-items:flex-start;
  flex-wrap:wrap;*/
  max-width:1210px;
  margin-left:auto;
  margin-right:auto;
  padding:0px;
  padding-top:0;
  /*width: calc(100% - 40px);*/
}

.RelatedContentMosaic .RelatedContent .Title{
  margin:0;
  padding:0;
  font-family:ClarinsRegular, Clarins;
  font-size:30px;
  color:#000;
  font-weight:normal;
  line-height:1em;
  position:relative;
  margin-bottom:10px;
}
.RelatedContentMosaic .RelatedContent span{
  position:relative;
}

.RelatedContentMosaic .RelatedContent span img{
  position:absolute;
  left:-20px;
  bottom:-2px;
}
.RelatedContentMosaic .RelatedContent figure{
  margin:0px;
  padding:0;
  overflow:hidden;

}


.RelatedContentMosaic .RelatedContent figure img{
  max-width:100%;
  transition:transform ease-in-out 0.5s;
  transform:scale(1);
}
.RelatedContentMosaic .RelatedContent:hover figure img{
  transform:scale(1.05);
}
.RelatedContentMosaic .RelatedContent{
  margin:20px;
  max-width:363px;
  text-align:left;
  box-sizing:border-box;
  position:relative;
  cursor:pointer;
  
}

.RelatedContentMosaic .RelatedContent .InfosBox{
  background-color:#fff;
  margin:0px;
  bottom:20px;
  position:absolute;
  left:20px;
  width:calc(100% - 40px);
  text-align:center;
  padding:20px;
  box-sizing:border-box;
  min-height:120px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
}
@media only screen and (max-width:1249px) {
  .RelatedContentMosaic .RelatedContent .Title{
    font-size:25px;
  }
  .RelatedContentMosaic .RelatedContent .Title img{
    max-width:140px;
  }
}
@media only screen and (max-width:1023px) {
#BLOCK-RELATED-CONTENTS{
  padding-top:20px; 
  padding-bottom:0px;
} 
.RelatedContentMosaic {
  padding: 0;
  width: calc(100% - 40px);
  margin: 20px;
  margin-bottom: 0;
}
.RelatedContentMosaic .RelatedContent{
  margin:0px auto; 
  margin-bottom:40px;
}
.RelatedContentMosaic .jcarousel-pagination{
  bottom:10px;
}
}
/*@media only screen and (max-width:761px) {
  #BLOCK-RELATED-CONTENTS{
      padding-top:20px; 
  } 
  .RelatedContentMosaic .RelatedContent{
    margin:5px;
  }
  
  .RelatedContentMosaic .RelatedContent .Title{
    font-size:20px;
  }
  .RelatedContentMosaic .RelatedContent .Title img{
    max-width:140px;
  }
  .RelatedContentMosaic .RelatedContent figure{
    height:230px;
  }
  .RelatedContentMosaic .RelatedContent .InfosBox {
    bottom: 5px;
    left: 5px;
    width: calc(100% - 10px);
    padding: 10px;
    min-height:80px;
  }
}*/
#BLOCK-QUESTIONS-ROUTINE {
  margin-top:40px;
  margin-bottom:40px;
}
@media only screen and (max-width:761px) {
  #BLOCK-QUESTIONS-ROUTINE {
  margin-top:20px;
  margin-bottom:20px;
}
}
#BLOCK-QUESTIONS-ROUTINE .Visual{
  padding-bottom:10px;
  padding-top:20px;
}
#BLOCK-QUESTIONS-ROUTINE .ProductName{
  font-family:ClarinsRegular, Clarins;
  font-size:18px;
  padding:20px;
  padding-top:0px;
  padding-bottom:10px;
  min-height:60px;
}
#BLOCK-QUESTIONS-ROUTINE .Price{
  padding-bottom:10px;
}
#BLOCK-QUESTIONS-ROUTINE .Visual img{
  display:block;
  margin:0 auto;
}

.Article-FAQ{
  display:flex;
  justify-content:center;
  align-items:flex-start;
  flex-wrap:wrap;
}
@media only screen and (max-width:761px) {
  .Article-FAQ {
    flex-direction:column;
      align-items:center;
  }
}
.Article-FAQ h1{
  text-align:center;
  display:block;
  font-family:ClarinsRegular, Clarins;
  font-size:50px;
  line-height:1em;
  font-weight:normal;
  margin:0;
  padding:0 20px;
  box-sizing:border-box;
  width:100%;
  flex-basis:100%;
  padding-bottom: 15px;
}
@media only screen and (max-width:761px) {
  .Article-FAQ h1{
    font-size:35px;
    padding-bottom: 10px;

  }
}
.Article-FAQ .TextContent{
  flex:1;
  text-align:left;
  padding-top:40px;
  padding-right:40px;
  box-sizing:border-box;
}
@media only screen and (max-width:761px) {
  .Article-FAQ .TextContent{
  text-align:center;
  padding:20px;
}
}
.Article-FAQ .TextContent h2{
  margin:0;
  padding-bottom:15px;
  font-weight:normal;
  font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
  font-size: 18px;
  line-height: 1.4em;
  color: #000;
  text-align: left;

}
.Article-FAQ .TextContent a{
  text-decoration:underline;
  font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
  text-transform:uppercase;
  font-size:11px;
}
.Article-FAQ .TextContent p{ 
  margin:0;
}
.Article-FAQ .TextContent p+h2{ 
  margin-top:30px;
}
.Article-FAQ .VisualContent{
  max-width:465px;
}
.Article-FAQ .VisualContent img{
  max-width:100%;
  cursor:pointer;
}
@media only screen and (max-width:1023px) {
  .Article-FAQ .VisualContent {
    max-width: 355px;
  }
}

@media only screen and (max-width:761px) {
  .Article-FAQ .Packshot{
    padding:0 20px;
    margin:0 auto;
  }
  .Article-FAQ .VisualContent{
  /*order:2;*/
  }
  .Article-FAQ .TextContent h2{
    text-align:center;
  }
}
.Article-FAQ h1 img{
  margin:0 auto;
  display:block;
}

.MyContent .ShareLink{
position: absolute;
top: 50%;
right: 20px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
margin: 0;
}

@media only screen and (max-width:761px) {
.MyContent .ShareLink{
position: relative;
top: auto;
right: auto;
-webkit-transform: none;
transform: none;
margin: 0;
text-align:center;
margin-top:20px;
}
}
/*-----------------------------*/
.st_facebook_custom {
  background: url("img/facebook.svg") no-repeat scroll left top transparent;
  background-size: 100% auto;
  padding:0;
  display:inline-block;
  cursor: pointer;
  width: 30px;
  height: 30px;
  margin-right:5px;
}
.st_twitter_custom {
  background: url("img/twitter.svg") no-repeat scroll left top transparent;
  background-size: 100% auto;
  padding: 0;
  width: 30px;
  height: 30px;
  display:inline-block;
  cursor: pointer;
    margin-right:5px;
}
.st_pinterest_custom {
  background: url("img/pinterest.svg") no-repeat scroll left top transparent;
  background-size: 100% auto;
  padding: 0;
  width: 30px;
  height: 30px;
  display:inline-block;
  cursor: pointer;
}

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

.MyContent .Article-Breadcrumb{
  padding:20px;
  position:relative;
  padding-top:0;
}
.MyContent .Article-Breadcrumb p.TextLink{
  display:block;
  position:relative;
  line-height:50px;
  text-align:center;
  
}
.MyContent .Article-Breadcrumb p.TextLink img{
  display: block;
  position: relative;
  margin: 0 auto;
  max-width: 100%;
}
@media only screen and (max-width:761px) {
.MyContent .Article-Breadcrumb p.TextLink img {

  margin-bottom: 20px;
}

}

@media only screen and (max-width:761px) {
.MyContent .Article-Breadcrumb p.TextLink a{
  /*  margin:0;
    padding:20px;
    text-align:left;
    border:1px solid #e7e7e7;
    line-height:1em;*/
}
.MyContent .Article-Breadcrumb p.TextLink a span{
    display:none;
}
}

@media only screen and (max-width:1023px) {
#ROUTINE-PRODUCT-JCAROUSEL {
  padding-bottom:40px;
}
#ROUTINE-PRODUCT-JCAROUSEL .jcarousel-pagination{
  bottom:0;
}
}


@media only screen and (max-width:761px) {
.product-quickshop{
  display:inline-block;
}
}
/*-------------------------------------------------------*/
/*-------------------------------------------*/
.MyContent #Transversal-Push {
  position:relative;
  
}

.MyContent #Transversal-Push  h2 {
  margin: 0;
  font-family: ClarinsRegular, Clarins;
  font-size: 35px;
  line-height: 35px;
  color: #000;
  font-weight: normal;
  padding: 0;
  padding-top: 20px;

}

@media screen and (max-width: 761px) {
.MyContent #Transversal-Push  h2 {
  margin-left: 20px;
  margin-right: 20px;
}
}

.MyContent #Transversal-Push .jcarousel {
  margin-left: auto;
  margin-right: auto;
  width: 970px;
}
@media screen and (max-width: 1023px) {
  .MyContent #Transversal-Push .jcarousel {
  width: 590px;
}

}

.MyContent #Transversal-Push .products-pagination.jcarousel-control-next, 
.MyContent #Transversal-Push .products-pagination.jcarousel-control-prev{
  top:calc(50% - 35px);
  display:none;
  
}
@media screen and (max-width: 1023px) {
.MyContent #Transversal-Push .products-pagination.jcarousel-control-next, 
.MyContent #Transversal-Push .products-pagination.jcarousel-control-prev{
  display:block;
  
}
}
@media screen and (max-width: 761px) {
.MyContent #Transversal-Push .products-pagination.jcarousel-control-next, 
.MyContent #Transversal-Push .products-pagination.jcarousel-control-prev{
  display:none;
  
}
}
.MyContent #Transversal-Push .products-pagination.jcarousel-control-next{
  right:20px;
}
.MyContent #Transversal-Push .products-pagination.jcarousel-control-prev{
  left:20px;
  
}
@media screen and (max-width: 761px) {
.MyContent #Transversal-Push .jcarousel {
  width: 290px;
  padding-bottom:40px;
}
.MyContent #Transversal-Push .jcarousel-pagination {
  display:block;
  bottom:0;
}
}
.MyContent #Transversal-Push ul {
  display: block;
  
  text-align: center;
  position: relative;
  margin-bottom: 60px;
}

.MyContent #Transversal-Push ul li {
  font-size: 0;
  border: 2px solid #e5e5e5;
  cursor: pointer;
  display: inline-block;
  margin: 20px;
  max-width: 284px;
  min-height: 410px;
  padding-bottom: 50px;
  text-align: left;
  vertical-align: top;
  /*width: calc(50% - 40px);*/
  position:relative;
}
.MyContent #Transversal-Push ul li img {
  max-width: 100%;
}
@media screen and (max-width: 1023px) {
.MyContent #Transversal-Push ul li  {
  margin: 5px;
  /*width: calc(33% - 14px);*/
  margin-top:20px;
}
}

.MyContent #Transversal-Push ul li p.Text {
  margin: 0;
  font-family: ClarinsRegular, Clarins;
  font-size: 28px;
  line-height: 1em;
  color: #000;
  padding: 0;
  padding-bottom: 10px;
  font-weight: normal;
  padding-left: 20px;
  padding-right: 20px;
  min-height: 100px;
}

.MyContent #Transversal-Push ul li p.Title {
  color: #be0f34;
  text-transform: uppercase;
  font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
  margin: 0;

  font-size: 11px;
  padding: 20px;
  padding-bottom: 10px;
}

.MyContent #Transversal-Push ul li p.text-link {
  bottom: 20px;
  font-size: 11px;
  line-height: 14px;
  margin: 0;
  padding: 20px;
  position: absolute;
    padding-bottom:8px;
}

.MyContent #Transversal-Push ul li p.text-link a {
  text-transform: uppercase;
  color: #000;
  text-decoration: none;
  border-bottom: #d5d5d5 1px solid;
}


@media screen and (max-width: 350px) {
.MyContent #Transversal-Push ul li p.Text {
  font-size: 20px;
}
}

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


@media only screen and (max-width:1023px) {
.MyContent .QuestionsMobileSlider{
  display:block!important;
}
.MyContent .QuestionsMosaic:not(.QuestionsMosaicData)  {
  display:none!important;
}
.MyContent #BLOCK-QUESTIONS .jcarousel-pagination{
display:block!important;
}
}

@media only screen and (min-width:1024px) {
.MyContent .QuestionsMobileSlider{
  display:none!important;
}
.MyContent .QuestionsMosaic:not(.QuestionsMosaicData) {
  display:flex!important;
}
.MyContent #BLOCK-QUESTIONS .jcarousel-pagination{
    display:none!important;
}
}

#ROUTINE-PRODUCT-JCAROUSEL[data-displayed-items="2|2|1"]{
  max-width:700px;
  margin:0 auto;
}

/*--------- DTW -------------*/

@media only screen and (max-width: 761px) {
  .MyContent h2 {
    padding-bottom: 10px;
  }
}
@media only screen and (max-width: 768px){
  .Question{
    min-height: 0px;
  }
  .Question h3{
    font-size: 27px;
  }
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.QuestionsMosaic {
  flex-wrap: wrap;
}
.QuestionsMosaic {
  padding: 0px;
}
}

/***EDITS***/
/*#BLOCK-QUESTIONS-ROUTINE .ProductName{
  min-height: 100px;
}*/

/* style.css | https://staging-clarinschina-ecommera.demandware.net/on/demandware.static/-/Library-Sites-clarins-v3/en_AU/v1668690428632/content/Beauty-FAQ/style.css */

.QuestionsMosaic {
  justify-content: left;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active){
  .QuestionsFilter{
    padding: 28px;
  }
  .Question{
    max-width: 330px;
  }
  #BLOCK-CATEGORY-LINKS .CategoryMosaic .Category{
    width: 50%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1023px){
  .Question{
    min-height: 290px;
  }
}

.MyContent #Transversal-Push ul li p.Text{
  font-size: 27px;
}


/*Quickshop*/
.product-tile{
  margin-left: auto;
  margin-right: auto;
}


@media only screen 
and (min-device-width : 834px) and (max-device-width : 1112px) 
and (orientation : landscape) {
  /* #BLOCK-CATEGORY-LINKS .CategoryMosaic .Category{
    margin: -5px;
  } */
   .Article-FAQ .TextContent{
    margin-left: 40px;
  }
  body,
  html {
    width: 100%;
    overflow-x: hidden !important;
  }
  #main:not(.main-homepage) {
      padding-left: 0 !important;
      padding-right: 0 !important;
  }
}



@media only screen 
and (min-device-width : 834px) and (max-device-width : 1112px) 
and (orientation : portrait) {
  .Question{
    min-height: 180px;
    max-width: 850px;
  }
  .Article-FAQ .TextContent{
    margin-left: 40px;
  }
}


@media only screen and (max-width:761px) {
  .product-tile{
    display: none;
  }
}

@media only screen and (max-width:1024px) {
/* .QuestionsMosaic { */
    /* justify-content: left !important; */
/* } */
}



@media (max-width: 480px) {body,
  html {
    width: 100%;
    overflow-x: hidden !important;
  }
  #main:not(.main-homepage) {
      padding-left: 0 !important;
      padding-right: 0 !important;
  }}