body, html{
	margin:0;
	padding:0;
	overflow-x:hidden;
	scroll-behavior: smooth;
}
.breadcrumb{
	display:none;
}
#main:not(.main-homepage) {
    margin-top: 0px;
}
.MyContent {
	width: 100%;
	display: block;
	position: relative;
	max-width: 1250px;
	min-width: 320px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
.MyContent p{
	margin:0 auto;
	font-family: "Gotham SSm book A", "Gotham SSm book B", Gotham, Helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 1.4em;
}
.MyContent img{
	display:block;
	position: relative;
	max-width:100%;
}
.MyContent .MyBlock {
	display:block;
	
}
@media only screen and (min-width:1250px) {
.MyContent .MyBlock {
		margin-left:calc(625px - 50vw + 10px);
		width:calc(100vw - 20px);
}
}
@media only screen and (max-width:761px) {
.MyContent .product-quickshop{
	display:inline-block!important;
}
}
.MyContent .Wrapper {
	display:block;
	position:relative;
	text-align:center;
}

.MyContent .InlineBlock {
	display: inline-block;
	margin:20px;
	vertical-align:middle;
}
.MyContent  .Text{
	position:relative;
	display:block;
	margin:0 auto;
}
.MyContent h1 {
	display:block;
	font-family: ClarinsRegular, Clarins;
	font-size: 60px;
	font-weight: normal;
	line-height: 1em;
	margin: 0;
	padding: 0;
	position: relative;
	text-align: center;
	padding-bottom:17px;

}
@media only screen and (max-width:761px) {
.MyContent h1 {
	font-size: 40px;
	padding:0px 20px;
	padding-bottom:17px;
	
}
}
.MyContent  #BLOCK-TITLE{
margin-top:40px;
}

.MyContent  #BLOCK-TITLE p.Text{
	font-size:17px;
}

.MyContent  .BtnLink{
	margin:0;
	margin-top:18px;
}

.MyContent  .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 #000;
	transition:ease-in-out 0.5s; 
}
.MyContent .BtnLink a:hover {
	color: #000;
	background-color: #FFF;
	border:2px solid #8b8b8b;
}
.MyContent .Mentions {
	opacity:0.5;
	font-size:11px;
	padding-top:10px;
}
.AnchorBlock{
	height:50px;
	margin-top:-50px;
}
/*-----------------------------------------------*/
.Mosaic{
	display:flex;
	width:calc(100vw - 10px);
	flex-wrap:wrap;
	margin: 0 auto;

}
#MOSAIC-ANIM{
	margin-top:calc(-2 * (100vw - 10px) / 7);
}
@media only screen and (min-width:1250px) {
	.Mosaic{
		display:flex;
		margin-left:calc(-0.5 * (100vw - 10px - 1250px));
	}	
}
@media only screen and (max-width:761px) {
	.Mosaic{
		width:100vw;
	}	
}
.Mosaic div{
	display:block;
	flex-basis:calc((100vw - 10px) / 7);
	height:calc((100vw - 10px) / 7);
	background-repeat:no-repeat;
	background-size:cover;
	margin-left:-1px;
}

.Mosaic .M-01{background-image:url(img/anim-vignette-01.png);}
.Mosaic .M-02{background-image:url(img/anim-vignette-02.png);}
.Mosaic .M-03{background-image:url(img/anim-vignette-03.png);}
.Mosaic .M-04{background-image:url(img/anim-vignette-04.png);}
.Mosaic .M-05{background-image:url(img/anim-vignette-05.png);}
.Mosaic .M-06{background-image:url(img/anim-vignette-06.png);}
.Mosaic .M-07{background-image:url(img/anim-vignette-07.png);}
.Mosaic .M-08{background-image:url(img/anim-vignette-08.png);}
.Mosaic .M-09{background-image:url(img/anim-vignette-09.png);}
.Mosaic .M-10{background-image:url(img/anim-vignette-10.png);}
.Mosaic .M-11{background-image:url(img/anim-vignette-11.png);}
.Mosaic .M-12{background-image:url(img/anim-vignette-12.png);}
.Mosaic .M-13{background-image:url(img/anim-vignette-13.png);}
.Mosaic .M-14{background-image:url(img/anim-vignette-14.png);}


@media only screen and (max-width:1023px) {
.Mosaic div{
	flex-basis:calc((100vw - 21px) / 5);
	height:calc((100vw - 21px) / 5);
}
#MOSAIC-ANIM{
	margin-top:calc(-2 * (100vw - 21px) / 5);
}
.Mosaic .M-06,
.Mosaic .M-07,
.Mosaic .M-13,
.Mosaic .M-14{
	display:none;
}

}

@media only screen and (max-width:761px) {
.Mosaic div{
	flex-basis:calc(100vw / 3);
	height:calc(100vw / 3);
}
#MOSAIC-ANIM{
	margin-top:calc(-2 * 100vw / 3);
}
.Mosaic .M-04,
.Mosaic .M-05,
.Mosaic .M-06,
.Mosaic .M-07,
.Mosaic .M-11,
.Mosaic .M-12,
.Mosaic .M-13,
.Mosaic .M-14{
	display:none;
}

}
#MOSAIC-ANIM .M-01,
#MOSAIC-ANIM .M-08,
#MOSAIC-ANIM .M-03,
#MOSAIC-ANIM .M-10,
#MOSAIC-ANIM .M-05,
#MOSAIC-ANIM .M-12,
#MOSAIC-ANIM .M-07,
#MOSAIC-ANIM .M-14{
	animation:fadeInItem_2 8s ease-in-out infinite
}

#MOSAIC-ANIM .M-02,
#MOSAIC-ANIM .M-09,
#MOSAIC-ANIM .M-04,
#MOSAIC-ANIM .M-11,
#MOSAIC-ANIM .M-06,
#MOSAIC-ANIM .M-13{
	animation:fadeInItem_1 8s ease-in-out infinite
}

@keyframes fadeInItem_1{
	0%{
		opacity:0;
	}
	25%{
		opacity:0;
	}
	30%{
		opacity:1;
	}
	75%{
		opacity:1;
	}
	80%{
		opacity:0;
	}
	100%{
		opacity:0;
	}
}
@keyframes fadeInItem_2{
	0%{
		opacity:0;
	}
	50%{
		opacity:0;
	}
	55%{
		opacity:1;
	}

	95%{
		opacity:1;
	}
	100%{
		opacity:0;
	}
}
ul.Nav{
	display:flex;
	width:100%;
	max-width:1250px;
	margin: 0 auto;
	list-style:none;
	padding:0;
	margin-top:40px;
		
}

ul.Nav li{
	display:block;
	margin:0;
	padding:0;
	flex-basis:25%;
	text-align:center;
	background-repeat:no-repeat;
	background-position:top center;
	border:1px solid #FFF;
	box-sizing:border-box;
}
@media only screen and (max-width:761px) {
ul.Nav li{
	background-size: 180px auto;
}
}
ul.Nav li a{
	display:flex;
	margin:0;
	padding:15px;
	justify-content:center;
	align-items:flex-start;
	/*padding-top:80px;*/
	text-transform:uppercase;
	color:#fff;
	text-decoration:none;
		font-family: "Gotham SSm book A", "Gotham SSm book B", Gotham, Helvetica, Arial, sans-serif;
		font-size:14px;
}
@media only screen and (max-width:761px) {
ul.Nav li a {
	padding: 5px;
	padding-top: 45px;
	font-size: 11px;
	background-size:auto 80%;
}
}
/*---------------------------------------------------------*/
ul.Nav .NavLink-01{background-image:url(img/nav-01.png);}
ul.Nav .NavLink-02{background-image:url(img/nav-02.png);}
ul.Nav .NavLink-03{background-image:url(img/nav-03.png);}
ul.Nav .NavLink-04{background-image:url(img/nav-04.png);}
/*---------------------------------------------------------*/
.BlockItem{
	max-width:1250px;

	margin: 40px auto;
	box-sizing:border-box;
	padding:25px;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;
}
.BlockItem .VisualContent{
	order:1;
	position:relative;
	display:block;
	flex-basis:50%;
	max-width:568px;
}
@media only screen and (max-width:1023px) {
	.BlockItem .VisualContent{
		align-self:flex-end;
		flex-basis:50%;
	}
}
@media only screen and (max-width:761px) {
	.BlockItem .VisualContent{
		align-self:auto;
		flex-basis:100%;
	}
}
.BlockItem .VisualContent img{
	position:relative;
	display:block;
	max-width:100%;
}
.BlockItem .VisualContent .IngredientName{
	margin:0;
	position:absolute;
	display:block;
	font-size:12px;
}
@media only screen and (max-width:1023px) {
.BlockItem .VisualContent .IngredientName{
	font-size:10px;
}	
}
.BlockItem .MainContent{
	order:2;
	flex-basis:calc(50% - 25px);
	text-align:left;
	color:#FFFFFF;
	margin-left:25px;
	margin-top:20px;
	margin-bottom:20px;
}
.BlockItem .MainContent .Text {
	max-width:460px;
	display: inline-block;
}
.BlockItem .MainContent .Price {
	font-family: "Gotham SSm book A", "Gotham SSm book B", Gotham, Helvetica, Arial, sans-serif;
	font-size:16px;
	padding-top:20px;
}
.BlockItem .MainContent h2 {
	display: inline-block;
	font-family: ClarinsRegular, Clarins;
	font-size: 50px;
	font-weight: normal;
	line-height: 1em;
	margin: 0;
	padding: 0;
	position: relative;
	z-index: 1;
	padding-bottom:16px;
}
@media only screen and (max-width:1023px) {
	.BlockItem .MainContent  {
		flex-basis:calc(48% - 11px);
	}
	.BlockItem .MainContent h2 {
			font-size:35px;
	}
}
@media only screen and (max-width:761px) {
	.BlockItem .MainContent{
		flex-basis:100%;
		margin-left:0;
		text-align:center;
	}
}
.Routine h3 {
	display: inline-block;
	font-family: ClarinsRegular, Clarins;
	font-size: 30px;
	font-weight: normal;
	line-height: 1em;
	margin: 0;
	padding: 0;
	position: relative;
	z-index: 1;
	padding-bottom:16px;
}
@media only screen and (max-width:761px) {
.Routine h3 {
	padding-left:20px;
	padding-right:20px;
	}
}
.Routine .ProductBlock .ProductPrice {
	font-size: 15px;
	text-align:center;
	padding-top:10px;
	padding-bottom:20px;
}
.Routine .ProductBlock .Packshot img {
	display:block!important;
	margin:0 auto!important;
	
}
.Routine .ProductBlock .ProductName {
	font-size: 15px;
	text-align:center;
	padding:0px 20px;
	margin:0 auto;
	display:block;
	max-width:220px;
	min-height: 60px;
}

.BlockItem .TipsContent{
	background-color:#FFFFFF;
	box-sizing:border-box;
	padding:25px;
	text-align:center;
	order:3;
	flex-basis:100%;
}
.BlockItem .TipsContent h3 {
	display:block;
	font-family: ClarinsRegular, Clarins;
	font-size: 35px;
	font-weight: normal;
	line-height: 1em;
	margin: 0;
	padding: 0;
	position: relative;
	z-index: 1;
	padding-bottom:16px;
	background-repeat:no-repeat;
	background-position:top center;
	padding-top:50px;
}
.BlockItem .TipsContent p {
	max-width:920px;
	display:block;
	margin:0 auto;
}

/*---------------------------------------------------------*/
#BLOCK-MIRACLE-PRODUCT-01{
	background-color:#ff883c;
}
#BLOCK-MIRACLE-PRODUCT-01 .TipsContent h3{
	color:#ff883c;
	background-image:url(img/picto-01.png);
}
#BLOCK-MIRACLE-PRODUCT-01 .IngredientName{
	top:29%;
	left:86%;
}
/*---------------------------------------------------------*/
#BLOCK-MIRACLE-PRODUCT-02{
	background-color:#f977b4;
}
#BLOCK-MIRACLE-PRODUCT-02 .TipsContent h3{
	color:#f977b4;
	background-image:url(img/picto-02.png);
}
#BLOCK-MIRACLE-PRODUCT-02 .IngredientName{
	top:60%;
	left:80%;
}
/*---------------------------------------------------------*/
#BLOCK-MIRACLE-PRODUCT-03{
	background-color:#3dbfd9;
}
#BLOCK-MIRACLE-PRODUCT-03 .TipsContent h3{
	color:#3dbfd9;
		background-image:url(img/picto-03.png);
}
#BLOCK-MIRACLE-PRODUCT-03 .IngredientName{
	top:45%;
	left:75%;
	text-align:left;
}
/*---------------------------------------------------------*/
#BLOCK-MIRACLE-PRODUCT-04{
	background-color:#fbb0df;
}
#BLOCK-MIRACLE-PRODUCT-04 .TipsContent h3{
	color:#fbb0df;
	background-image:url(img/picto-04.png);
}
#BLOCK-MIRACLE-PRODUCT-04 .IngredientName{
	top:55%;
	left:78%;
}
/*-------------------------------------------*/

.MyContent #Transversal-Push h2{
	color:#000;
	font-family:ClarinsRegular, Clarins;
	font-size:35px;
	line-height:1em;
	font-weight:normal;
	margin:0;	
	box-sizing:border-box;
	padding-top:40px;
	padding-bottom: 20px;
}
@media screen and (max-width: 761px) {
.MyContent #Transversal-Push h2{
	padding-top:20px;
	font-size:30px;
}
}
.MyContent #Transversal-Push {
	position:relative;
	padding-bottom:20px;
}
.MyContent #Transversal-Push .jcarousel {
	margin-left: auto;
	margin-right: auto;
	width: 915px;
}
@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: 10px;
	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;
}
}

.MyContent #Transversal-Push ul li h3 {
	margin: 0;
	font-family: ClarinsRegular, Clarins;
	font-size: 28px;
	line-height: 28px;
	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;
	min-height:30px;
}
.MyContent #Transversal-Push ul li p.Text {
	color: #8b8b8b;
	margin: 0;
	font-size: 11px;
	padding: 20px;
	padding-top: 0px;
	padding-bottom: 10px;
	line-height: 14px;
}
.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;
}

.MyContent .MobileVisual{
	display:none;
}
@media only screen and (max-width:761px) {	
	.MyContent .VisualContent{
	display:none;
}
		.MyContent .MobileVisual{
	display:block;
	margin:15px auto;

}
	.MyContent .MobileVisual{
	display:block;
}
	.MyContent .MobileVisual img{
	display:block;
	max-width:100%;
	margin:0 auto;
}
}
@media only screen and (max-width:761px) {		
.MyContent .ProductBlock {
	padding-bottom:30px;
}
	.MyContent .jcarousel-pagination {
	bottom:0px;
}
	
}
@media only screen and (max-width: 762px){
.product-quickshop .swatchesCircle img {
top: 8.5px; 
  width: auto; 
}
}
@media only screen and (max-width: 1024px){
.Mosaic {
	margin: 0px 9px 0px;
}
}

@media only screen and (max-width: 667px){
.Mosaic {
	margin: 0px 2px 0px;
}
}

@media screen and (min-width: 768px) and (max-width: 1023px){
.Mosaic {
	margin: 0px 15px 0px;
}
}

@media only screen and (max-width:1023px) {
	.BlockItem {
		padding: 15px;
	}

}