/* //////////////////////////////////////////////////////////
 *
 * VICHY 2016 - DERMABLEND 3D
 *
 * /////////////////////////////////////////////////////// */
/* =============================== *
 * GENERIQUE BOUTONS
 * =============================== */

.button .btn-bg{background-color:#000;}
.button.has-border{border-color:#000;}

.button.has-border.theme-dermablend.hover .icon svg{fill:#cea57c;}

.button.grey-blue{color:#000;}
.button.grey-blue.has-bg{ background-color:#000; }
.button.white.has-bg{background-color:#000;}

.button.hover .icon svg{fill:#fff;}

.button.has-border.theme-dermablend.hover .icon svg{fill:#cea57c;}

.button.has-border.hover .icon svg{fill:#000;}


/* =============================== *
 * THEME
 * =============================== */
.pg_product-list .page-container {
	background-color: #171717;
}
.theme-dermablend .related-content{
	padding-bottom:80px;
	background-color: #171717;
	}
.related-content .title_string > span,
.obj_prod-before_after .title_string > span{color:#fff; max-width:84%;}
.obj_prod-before_after .title_string > span::before,
.obj_prod-before_after .title_string > span::after,
.related-content .title_string > span::before,
.related-content .title_string > span::after{background-color:rgba(206,165,124,.5);}
.related-content .first-advice p { color: #fff; }
@media screen and (min-width:980px){
	
	.related-content .title_string{
		margin:0 auto;
		padding-top:3.75em;
		padding-bottom:2.25em;
		max-width:40em;
		}
}
/* =============================== *
 * TINT
 * =============================== */
.use-information{margin:2em 0;}
/*.obj_intro-product .skin-tones p{display:block; margin:0 0 10px;}
.obj_intro-product .skin-tones ul{width:100%; max-width:400px;}
.obj_intro-product .skin-tones li{
	max-width:33.333%;
	padding:10px; margin:0 !important;
	}
.obj_intro-product .skin-tones button{width:auto; height:auto; text-indent:0; border:none !important;}
.obj_intro-product .skin-tones button img{max-width:100%;}
.obj_intro-product .skin-tones button span{
	display:block;
	font-size:0.714285em; font-weight: 700;
	text-transform:uppercase;
	}*/
/* =============================== *
 * SHADE MATCH
 * =============================== */
.obj_bloc-shade_match{
	padding:0 2.5%;
	}
.obj_bloc-shade_match .title_string{
	margin-top:0;
	padding-top:3.75em;
	}
.obj_bloc-shade_match .content{
	max-width:1170px;
	margin:0 auto;
	background:#fff;
	}
.obj_bloc-shade_match .obj_shades{
	padding:5% 20px;
	max-width:950px;
	margin:0 auto;
	font-size:0;
	text-align:center;
	}
.obj_bloc-shade_match .obj_shades li{
	display:inline-block;
	width:14.2857142%;
	font-size:14px;
	}
.obj_bloc-shade_match .obj_shades li figure{
	position:relative;
	z-index:0;
	cursor: pointer;
	}
.obj_bloc-shade_match .obj_shades li.active figure{
	z-index:5;
	}
.obj_bloc-shade_match .obj_shades li img{
	max-width:100%;
	position:relative;
	z-index:1;
	-webkit-transition:all 0.2s;
	   -moz-transition:all 0.2s;
			transition:all 0.2s;
	}
.obj_bloc-shade_match .obj_shades li.active img{
	z-index:5;
	border:3px solid #000;
	 
     box-sizing: border-box; 
	-webkit-transform:scale(1.2);
		-ms-transform:scale(1.2);
			transform:scale(1.2);
	}
.obj_bloc-shade_match .obj_shades li figcaption{
	position:relative;
	z-index:0;
	padding:20px 0 0;
	font-size:1.214285em;
	color:#000;
	font-weight:700;
	opacity:0;
	text-transform:uppercase;
	-webkit-transition:all 0.2s;
	   -moz-transition:all 0.2s;
			transition:all 0.2s;
	}
.obj_bloc-shade_match .obj_shades li.active figcaption{
	opacity:1;
	}
	
@media screen and (max-width:767px){
	.obj_bloc-shade_match .obj_shades li{
		width:25%;
		padding-top:20px;
		}
	.obj_bloc-shade_match .obj_shades li figcaption{
		padding:10px 0;
		font-size:0.6875em;
		}
}

/* =============================== *
 * BLOC BEFORE AFTER
 * =============================== */
.pg_product-list .obj_prod-before_after .title_string{
	margin:0 auto;
	padding-top:3.75em;
	padding-bottom:2.25em;
	}
.pg_product-list .obj_prod-before_after{
	background:#171717;
	}
.obj_prod-before_after .content{
	max-width:1170px;
	padding : 70px 0 0;
	margin:0 auto;
	background:#fff;
	text-align:center;
	}
.obj_prod-before_after .t_info{
	padding:40px 0 50px;
	font-size:1.4375em;
	color:#cea57c;
	font-weight:200;
	}
/*  GALLERY BEFORE AFTER */
.obj_prod-before_after .obj_carrousel{
	padding:0 6%;
	margin:0 auto 25px;
	position:relative;
	}
.obj_prod-before_after .obj_carrousel .masque{
	overflow:hidden;
	position:relative;
	}
.obj_prod-before_after .obj_carrousel .items{
	position:absolute;
	width:10000px;
	height:auto;
	}
.obj_prod-before_after .obj_carrousel .item{
	display:inline-block;
	position:relative;
	float:left;
	height:100%;
	padding-bottom:15px;
	min-width:110px;
	text-align:center;
	}
.obj_prod-before_after .obj_carrousel figure{
	position:relative;
	width:100%;
	padding:20px;
	background:rgba(240,240,240,0);
	-webkit-transition:all 0.2s;
	   -moz-transition:all 0.2s;
			transition:all 0.2s;
	}
.obj_prod-before_after .obj_carrousel .item.is-active figure{
	background:rgba(240,240,240,1);
	}
.obj_prod-before_after .obj_carrousel .item figure:after{
	display:block; content:"";
	position:absolute;
	top:100%; left:50%;
	margin:-10px 0 0 -10px;
	width: 0; height: 0;
	border-style: solid;
	border-width: 10px 11px 0 11px;
	border-color: rgba(240,240,240,0) transparent transparent transparent;
	-webkit-transition:all 0.2s;
	   -moz-transition:all 0.2s;
			transition:all 0.2s;
	}
.obj_prod-before_after .obj_carrousel .item.is-active figure:after{
	margin:0 0 0 -10px;
	border-color: rgba(240,240,240,1) transparent transparent transparent;
	}
.obj_prod-before_after .obj_carrousel figure span{
	display:block;
	padding-bottom:200px;
	margin:0 0 25px;
	position:relative;
	width:100%;
	overflow:hidden;
	}
.pg_product-list .obj_prod-before_after .obj_carrousel figure span{
	padding-bottom:120px;
	}
.obj_prod-before_after .obj_carrousel figure img{
	position:absolute;
	top:0; left:50%;
	max-height:200px;
	-webkit-transform:translateX(-50%);
		-ms-transform:translateX(-50%);
			transform:translateX(-50%);
	}
.pg_product-list .obj_prod-before_after .obj_carrousel figure img{
	max-height:120px;
	}
.obj_prod-before_after .obj_carrousel .item figcaption{
	text-transform:uppercase;
	color:#000;
	font-size:1.025em;
	font-weight:600;
	}
	
.obj_prod-before_after .obj_carrousel .nav button{
	position:absolute;
	top:50%;
	width:30px; height:40px;
	margin-top:-20px;
	text-indent:-9999em;
	}
.obj_prod-before_after .obj_carrousel .nav button.prev{
	left:5px;
	}
.obj_prod-before_after .obj_carrousel .nav button.next{
	right:5px;
	}
.obj_prod-before_after .obj_carrousel .nav button:before{
	display:block; content:'';
	width:20px; height:20px;
	margin:-10px 0 0 -10px;
	position:absolute;
	left:50%; top:50%;
	-webkit-transform:rotate(45deg);
		-ms-transform:rotate(45deg);
			transform:rotate(45deg);
	}
.obj_prod-before_after .obj_carrousel .nav button.prev:before{
	border-bottom:2px solid #000;
	border-left:2px solid #000;
	}
.obj_prod-before_after .obj_carrousel .nav button.next:before{
	border-top:2px solid #000;
	border-right:2px solid #000;
	}
.obj_prod-before_after .view .item .obj_before-after{
	max-width:1030px;
	margin:0 6% 5%;
	}
.obj_prod-before_after .view .nav{
	display:none;
	}
	
@media screen and (max-width:767px){
	.obj_prod-before_after .obj_carrousel figure{
		padding:10px;
		}
	.obj_prod-before_after .obj_carrousel figure span{
		padding-bottom:100px;
		}
	.obj_prod-before_after .obj_carrousel figure img{
		max-height:100px;
		}
	.obj_prod-before_after .view{
		margin:0 auto;
		}
	.obj_prod-before_after .view .item .obj_before-after{
		max-width:88%;
		margin:0 auto 6%;
		}
}
/* SLIDER BEFORE AFTER */
.obj_prod-before_after .t_info strong{
	font-weight:500;
	}
.obj_before-after {
	position : relative;
	display:inline-block;
	margin:0 auto;
	}
.obj_before-after .ctn_figure {
	position : relative;
	width : 100%;
	height : auto;
	margin : 0 auto;
	z-index : 1;
	}

.obj_before-after figure {
	width : 100%;
	height : auto;
	overflow : hidden;
	z-index : 1;
	}
.obj_before-after figure + figure { 
	position:  absolute;
	top:0; left:0;
	width : 0;
	height : 100%;
	border-right:3px solid #fff;
	}

.obj_before-after figure img {
	display:block;
	width : auto;
	max-width : 100%;
	}
.obj_before-after figure + figure img { 
	position:absolute;
	left:0;
	max-height : 100%;
	max-width : none;
	}

.obj_before-after .ctn_slider { 
	position:absolute;
	top:0; left:0; bottom:0; right:0;
	z-index:10;
	}

.obj_before-after .ctn_slider p {
	position:absolute;
	z-index:0;
	padding:10px 20px;
	max-width:45%;
	font-size:1.857142em;
	font-weight:500;
	color:#fff;
	text-transform:uppercase;
	background:#cea57c;
	}
.obj_before-after .ctn_slider p.t_before {
	left:0; bottom:15%;
	text-align:left;
	}
.obj_before-after .ctn_slider p.t_after {
	right:0; bottom:14%;
	text-align:right;
	}


.obj_before-after .slider {
	position:absolute;
	top:0; left:0; bottom:0; right:0;
	}

.obj_before-after .ui-slider {
	position : relative;
	height : 100%;
	overflow : hidden;
	}

.obj_before-after .ui-slider-handle {
	position : absolute;
	width : 70px; 
	height : 70px; 
	margin-left : -35px;
	border-radius:50%;
	background : #fff;
	outline:none;
	}
.obj_before-after .ui-slider-horizontal .ui-state-default {
	bottom : 13.5%;
	/*right : 0*/
	}
.obj_before-after .ui-slider-handle span{
	display:block;
	position:absolute;
	top:50%; left:50%;
	}
.obj_before-after .ui-slider-handle span:before,
.obj_before-after .ui-slider-handle span:after{
	display:block; content:"";
	width:14px; height:14px;
	position:absolute; top:50%; left:50%;
	-webkit-transform-origin:center center;
		-ms-transform-origin:center center;
			transform-origin:center center;
	-webkit-transform:rotate(45deg);
		-ms-transform:rotate(45deg);
			transform:rotate(45deg);
	}
.obj_before-after .ui-slider-handle span:before{
	margin:-7px 0 0 -21px;
	border-bottom:3px solid #000;
	border-left:3px solid #000;
	}
.obj_before-after .ui-slider-handle span:after{
	margin:-7px 0 0 5px;
	border-top:3px solid #000;
	border-right:3px solid #000;
	}

@media screen and (max-width:767px){
	.obj_prod-before_after .t_info{
		max-width:84%;
		margin:0 auto;
		padding:20px 0;
		font-size:0.9375em;
		}
	.obj_before-after .ctn_slider p {
		padding:5px 10px;
		font-size:0.8125em;
		}
	.obj_before-after .ui-slider-horizontal .ui-state-default{bottom:8%;}
	.obj_before-after .ui-slider-handle {
		width : 30px; 
		height : 30px; 
		margin-left : -15px;
		}
	.obj_before-after .ui-slider-handle span:before,
	.obj_before-after .ui-slider-handle span:after{
		width:8px; height:8px;
		}
	.obj_before-after .ui-slider-handle span:before{
		margin:-4px 0 0 -10px;
		border-width:0 0 2px 2px;
		}
	.obj_before-after .ui-slider-handle span:after{
		margin:-4px 0 0 0;
		border-width:2px 2px 0 0;
		}
}

/* =============================== *
 * CARROUSEL PRODUITS
 * =============================== */
.theme-dermablend .obj_routine-slider{overflow:hidden;}
.theme-dermablend .obj_routine-slider .routine-info p{line-height:1.25em;}
.theme-dermablend .obj_routine-slider .separator .plus{color:#cea57c;}
.theme-dermablend .obj_routine-slider .separator .bg{color:#000;}

@media screen and (max-width:767px){
	.theme-dermablend .obj_routine-slider .routine-info p{min-height:0;}	
}
/* =============================== *
 * BLOC ATTITUDE
 * =============================== */
.obj_prod-bloc.attitude{
	padding:0 2.5%;
	}
.obj_prod-bloc.attitude .content{
	max-width:1170px;
	margin:70px auto 0;
	padding:5%;
	text-align:center;
	background:#fff;
	}
.obj_prod-bloc.attitude .content p {
	margin:35px 0 0;
	font-size:1.4375em;
	font-weight:500;
	color:#cea57c;
	}
.obj_prod-bloc.attitude .ctn_visuels {
	position:relative;
	width:100%;
	padding-bottom:40.8914%;
	overflow:hidden;
	}
.obj_prod-bloc.attitude .ctn_visuels img {
	position:absolute;
	width:100%;
	top:50%; left:50%;
	-webkit-transform:translate(-50%,-50%);
		-ms-transform:translate(-50%,-50%);
			transform:translate(-50%,-50%);
	}
@media screen and (max-width:767px){
	.obj_prod-bloc.attitude{
		padding:0;
		}
	.obj_prod-bloc.attitude .content{
		width:84%;
		}
	.obj_prod-bloc.attitude .ctn_visuels {
		padding-bottom:60%;
		}
	.obj_prod-bloc.attitude .ctn_visuels img {
		width:150%;
		}
	.obj_prod-bloc.attitude .content p {
		margin:15px 0 0;
		}
	
}

/* =============================== *
 * BLOC ROUTINE
 * =============================== */
.pg_product .obj_routine-slider{
	margin-bottom:0;
	padding-bottom:0;
	}

/* =============================== *
 * BLOC INGREDIENTS
 * =============================== */
.obj_ingredients-slider .ingredient-container li .background .description{height:72%;}
@media screen and (min-width:980px){
	.obj_ingredients-slider .ingredient-container li:before{
		display:block; content:'i';
		position:absolute; top:10px; right:10px;
		width:22px; height:22px;
		padding:0;
		line-height:22px;
		text-align:center;
		color:#fff;
		border:1px solid #fff;
		border-radius:50%;
		z-index:2;
		}
	.obj_ingredients-slider .ingredient-container[data-count="2"] li .background{width:100%;}
	.obj_ingredients-slider .ingredient-container[data-count="2"] li .name,
	.obj_ingredients-slider .ingredient-container[data-count="2"] li:focus .name,
	.obj_ingredients-slider .ingredient-container[data-count="2"] li:hover .name{
		display:block;
		text-shadow:0 2px 3px rgba(0,0,0,.5), 0 0 30px rgba(0,0,0,1), 0 0 50px rgba(0,0,0,1), 0 0 100px rgba(0,0,0,1);
		}
	.obj_ingredients-slider .ingredient-container[data-count="2"] li .background .description{
		left:0; top:100%;
		}
	.obj_ingredients-slider .ingredient-container[data-count="2"] li:focus .background .description,
	.obj_ingredients-slider .ingredient-container[data-count="2"] li:hover .background .description{
		top:0;
		}
	.obj_ingredients-slider .ingredient-container li .background .description{height:100%;}
}
/* =============================== *
 * BLOC TIPS
 * =============================== */
.obj_prod-bloc.tips{
	padding:0 2.5%;
	}
.obj_prod-bloc.tips .content{
	max-width:1170px;
	margin:0 auto;
	background:#fff;
	}
.obj_prod-bloc.tips .content .ctn_table{
	display:table;
	padding:5%;
	width:100%;
	}
.obj_prod-bloc.tips .ctn_player{
	display:table-cell;
	position:relative;
	vertical-align:middle;
	width:60%; height:0;
	padding-bottom:32.5%;
	}
.obj_prod-bloc.tips .obj_player{
	position:absolute;
	top:0; left:0; right:0; bottom:0;
	cursor:pointer;
	}
.obj_prod-bloc.tips iframe.obj_player{
	width:100%;
	height:100%;
	}
.obj_prod-bloc.tips .obj_player::before,
.obj_prod-bloc.tips .obj_player::after{
	content:"";
	left:50%; top:50%;
	z-index:2;
	position:absolute;
	-webkit-transition:all 0.2s;
	   -moz-transition:all 0.2s;
			transition:all 0.2s;
	}
.obj_prod-bloc.tips .obj_player::before{
	background:rgba(0,0,0,.3);
	border-radius:50%;
	height:64px;
	margin:-32px 0 0 -32px;
	width:64px;
	}
.obj_prod-bloc.tips .obj_player::after{
	border-color: transparent transparent transparent #fff;
	border-style: solid;
	border-width: 10px 0 10px 15px;
	margin:-10px 0 0 -6px;
	}
.obj_prod-bloc.tips .obj_player img{
	max-width:100%;
	position:absolute;
	top:50%; left:50%;
	-webkit-transform:translate(-50%,-50%);
		-ms-transform:translate(-50%,-50%);
			transform:translate(-50%,-50%);
	}
.obj_prod-bloc.tips .ctn_tips{
	display:table-cell;
	vertical-align:middle;
	width:40%;
	padding-left:7%;
	}
.obj_prod-bloc.tips .ctn_tips .obj_tip{
	position:relative;
	padding:45px 20% 70px 11%;
	border-left:1px dashed #dfcfbf;
	}
.obj_prod-bloc.tips .ctn_tips .obj_tip + .obj_tip{
	border:none;
	padding-bottom:0;
	}
.obj_prod-bloc.tips .ctn_tips .obj_tip:before{
	display:block; content:'';
	width:6px; height:6px;
	position:absolute;
	left:-5px; top:0;
	border-radius:50%;
	border:2px solid #b99774;
	background:#fff;
	}
.obj_prod-bloc.tips .ctn_tips .obj_tip h3{
	margin:-25px 0 40px;
	font-size:1.5em;
	line-height:1em;
	position:absolute;
	top:0; left:11%;
	z-index:1;
	font-weight:600;
	color:#cea57c;
	}
.obj_prod-bloc.tips .ctn_tips .obj_tip h3 em{
	display:inline-block;
	position:relative;
	left:-20px; top:25px;
	z-index:-1;
	font-style:normal;
	font-weight:300;
	font-size:4.125em;
	line-height:0;
	color:#f8e2cb;
	}
.obj_prod-bloc.tips .ctn_tips .obj_tip p{
	font-style:italic;
	font-size:0.875em;
	color:#666666;
	line-height:1.428571em;
	}
	
@media screen and (max-width:980px){
	.obj_prod-bloc.tips .ctn_tips{
		display:block;
		width:100%;
		padding:45px 10px 45px 30px;
		}
	.obj_prod-bloc.tips .ctn_tips .obj_tip{ padding:25px 10% 30px 10%; }
	.obj_prod-bloc.tips .ctn_tips .obj_tip h3{
		margin:-7px 0 0;
		font-size:1.25em;
		}
	.obj_prod-bloc.tips .ctn_tips .obj_tip h3 em{
		top:10px; left:-15px;
		font-weight:200;
		font-size:2.5em;
		}
}

@media screen and (max-width:767px){
	.obj_prod-bloc.tips{
		padding:0;
		}
	.obj_prod-bloc.tips .content{
		width:84%;
		margin:40px auto 0;
		}
	.obj_prod-bloc.tips .content .ctn_table{
		display:block;
		padding:0;
		}
	.obj_prod-bloc.tips .ctn_player{
		display:block;
		width:100%;
		padding-bottom:54.5%;
		}
	.obj_prod-bloc.tips .obj_player img{
		max-width:100%;
		}
	
}

/* =============================== *
 * BLOC SAVE
 * =============================== */
.obj_prod-bloc.save{
	padding:0 2.5%;
	}
.obj_prod-bloc.save .content{
	max-width:1170px;
	margin:0 auto;
	padding:5%;
	background:#fff;
	text-align:center;
	}
.obj_prod-bloc.save .content p{
	font-size:1em;
	line-height:1.25em;
	}
.obj_prod-bloc.save .content p strong{
	font-weight:700;
	}
.obj_prod-bloc.save .content .cta-container{
	margin:25px auto 0;
	}
.obj_prod-bloc.save .content .ctn_gdpr {
	max-width: 600px;
	margin: 20px auto;
	}
@media screen and (max-width:767px){
	.obj_prod-bloc.save{
		padding:0 8%;
		}
}

/* =============================== *
 * RANGE
 * =============================== */
.theme-dermablend .obj_products-list{padding:0 0 60px; background:#171717;}
.theme-dermablend .obj_products-list + .obj_vmag-push{margin-top:0;}
.theme-dermablend .product-card .details .product-range{ text-transform:uppercase; color:#000;}
.theme-dermablend .product-card .details .product-name{ text-transform:uppercase; color:#cea57c;}
.theme-dermablend .product-card .photo{position:relative;}
.theme-dermablend .product-card .photo figcaption{
	position:absolute;
	top:0; left:0; right:0;
	padding:0 20px;
	font-weight:600;
	line-height:1.125em;
	color:#999999;
	}
.theme-dermablend .product-card.has-full-description:hover .details .full-description,
.theme-dermablend .product-card.has-full-description .details .full-description{
	position:relative; left:auto; right:auto; bottom:0;
	opacity:1; display:block !important;
	height:4em; margin:0;
	-webkit-transform: none;
		-ms-transform: none;
			transform: none;
	}
.theme-dermablend .product-card .details .rating{ padding:10px 0 25px;}
.theme-dermablend .product-card .details .short-description{ margin:10px 0 5px;}
.theme-dermablend .product-card .details .short-description .color-sample{
	display:inline-block;
	height:14px; width:14px;
	margin:0 5px -2px 0;
	}
.product-card.routine-product .cta-container{margin-bottom:3em;}

.obj_prod-before_after{ padding:0 2.5%; }
.obj_prod-before_after .content > h4{
	margin:0 auto 40px;
	padding:10px 20px;
	display:inline-block;
	font-size:1.857142em;
	font-weight:500;
	color:#fff;
	text-transform:uppercase;
	background:#cea57c;
	}
.obj_prod-before_after .btn_more{
	display:block;
	margin:0 0 10px;
	color:#1c213f;
	font-size:1.0625em;
	font-weight:500;
	text-transform:uppercase;
	}
.obj_prod-before_after .btn_more:after{
	display:block; content:'';
	width:14px; height:14px;
	margin:5px auto 0;
	border-right:1px solid #1c213f;
	border-bottom:1px solid #1c213f;
	-webkit-transform:rotate(45deg);
		-ms-transform:rotate(45deg);
			transform:rotate(45deg);
	}
.obj_prod-before_after .obj_routine{overflow:hidden;}
.obj_prod-before_after .obj_routine-slider .separator .bg{color:rgba(255,255,255,0);}
.obj_prod-before_after .obj_routine-slider[data-num-slides="3"] .separator{width:0;}
.obj_prod-before_after .obj_routine-slider[data-num-slides="3"] .product-card{width:100%;}
.obj_prod-before_after .product-card .details .rating{margin-top:20px;}

@media screen and (min-width:980px){
	.obj_prod-before_after .obj_routine-slider[data-num-slides="3"] .product-card{width:33.3333%; max-width:390px;}
}

@media screen and (max-width:767px){
	.obj_prod-before_after{ padding:0; }
	.obj_prod-before_after .content {
		padding: 0;
	}
	.obj_prod-before_after .content > h4 {
		font-size: 1.25em;
		width: 100%;
		margin-bottom: 20px;
	}
	.obj_prod-before_after h4{
		margin:0 6% 20px;
		font-size:0.975em;
		}
	.obj_prod-before_after .btn_more{ margin:0; padding:20px 0; }
		
}
/* =============================== *
 * BLOC PRODUCTS TUTOS
 * =============================== */
.ope_dermablend_3d  .obj_intro-page .wording{ 
	width:30em;
	left:calc(50% - (1170px / 3));
	}
.ope_dermablend_3d  .obj_intro-page .wording h6{ 
	text-transform:uppercase;
	font-size:1.0625em;
	font-weight:700;
	color:#000000;
	}
.ope_dermablend_3d  .obj_intro-page .wording .range-name{
	margin:0;
	font-size:3.75em;
	color:#000000;
	}
.ope_dermablend_3d  .obj_intro-page .wording .range-name em{color:#cea57c;}
.ope_dermablend_3d  .obj_intro-page .wording .range-name sup{
	position:relative;
	top:-0.875em;
	font-size:0.41666em;
	}
.ope_dermablend_3d  .obj_intro-page .wording .range-subtitle{
	margin:0 0 20px;
	font-size:1.125em;
	line-height:1.125em;
	font-weight:700;
	text-transform:uppercase;
	color:#000000;
	}

.ope_dermablend_3d  .obj_intro-page .wording .range-description{
	margin:0 0 5px;
	line-height:1.125em;
	font-size:2em;
	font-weight:100;
	color:#cea57c;
	}
.ope_dermablend_3d  .obj_intro-page .wording .range-description-full{
	color:#000000;
	}
.ope_dermablend_3d  .obj_intro-page .wording .range-description-full strong{
	line-height:1.75em;
	font-weight:700;
	}
.ope_dermablend_3d  .obj_intro-page .wording .button .icon svg{
	fill:#fff;
	}
.ope_dermablend_3d  .obj_intro-page .wording a:hover .button .icon svg,
.ope_dermablend_3d  .obj_intro-page .wording .button:hover .icon svg{
	fill:#000;
	}
	
@media screen and (max-width:980px){
	.ope_dermablend_3d  .obj_intro-page .wording{ 
		left:0;
		padding:0 0 0 5%;
		}
}
@media screen and (max-width:767px){
	.ope_dermablend_3d  .obj_intro-page .wording{ 
		width: 12em;
		}
	.ope_dermablend_3d  .obj_intro-page .wording h6{ 
		font-size:0.9375em;
		}
	.ope_dermablend_3d  .obj_intro-page .wording .range-name{
		margin:0 0 10px;
		font-size:1.8125em;
		}
	.ope_dermablend_3d  .obj_intro-page .wording .range-name sup{font-size:0.3em;}
	.ope_dermablend_3d  .obj_intro-page .wording .range-subtitle{
		margin:0;
		font-size:0.9375em;
		text-transform:none;
		}
	.ope_dermablend_3d  .obj_intro-page .wording .range-description{
		font-size:0.9375em;
		font-weight:700;
		margin-bottom: 15px;
		}
	.ope_dermablend_3d  .obj_intro-page .wording .button{
		text-align:left;
		max-width:90%;
		}
}
/* =============================== *
 * BLOC PRODUCTS TUTOS
 * =============================== */
.obj_products-list .title_string {
	margin:0 auto;
	padding-top:3.75em;
	padding-bottom:2.25em;
	}
.obj_products-list .title_string > span{ max-width:84%; color:#fff; }
.obj_products-list .title_string > span::before, 
.obj_products-list .title_string > span::after{background-color:rgba(206,165,124,.5);}

/*
.obj_products-list li.product-card.stick-right{ margin-right:0; }
.obj_products-list li.product-card.stick-left{ margin-left:0; }
*/

.obj_products-list li.product-card .cta-container{
	margin-top:10px;
	}
/* common */
.obj_products-list li.product-tuto .v_background img,
.obj_products-list li.product-diag .v_background img,
.obj_products-list li.product-gif .photo img{
	left:50%;
	min-height:100%;
	min-height:calc(100% + 2px);
	min-width:100%;
	min-width:calc(100% + 2px);
	position:absolute;
	top:50%;
	-webkit-transform:translate(-50%, -50%);
		-ms-transform:translate(-50%, -50%);
			transform:translate(-50%, -50%);
	}
/* TUTO */
.ope_dermablend_3d .obj_products-list li.product-tuto{
	background-color:#1c213f;
	}
.obj_products-list li.product-tuto blockquote{
	font-size:2.25em;
	font-weight:200;
	}
.obj_products-list li.product-tuto.var_brown_spots{
	margin-left:0;
	}
.obj_products-list li.product-tuto.var_acne{
	margin-right:0;
	}
	
/* GIF */	
.obj_products-list li.product-gif .photo{
	position:absolute;
	top:0; left:0; bottom:0; right:0; 
	height:100%; width:100%;
	overflow:hidden;
	}
/* DIAG */	
.obj_products-list li.product-diag{
	min-height:450px;
	}
.obj_products-list li.product-diag .info-container{
	position:absolute;
	top:0; left:0; bottom:0; right:0;
	z-index:1;
	padding:13.75% 13.75%;
	}
.obj_products-list li.product-diag .info-container .cta-container{
	position:absolute;
	bottom:6.875%; left:13.75%; right:13.75%;
	}
.obj_products-list li.product-diag .info-container p{
	margin:0 0 10px;
	font-size:1em;
	font-weight:700;
	color:#282d48;
	}
.obj_products-list li.product-diag .info-container blockquote{
	font-size:2.25em;
	font-weight:200;
	color:#282d48;
	}
.obj_products-list li.product-diag .v_background{
	position:absolute;
	top:0; left:0; bottom:0; right:0;
	z-index:0;
	overflow:hidden;
	}
	
@media screen and (min-width:980px){
	/*
	.obj_products-list li:not(.stick-right) + li.product-tuto:nth-child(3n),
	.obj_products-list li.stick-right:nth-child(3n){
		clear:left
		}
	.obj_products-list li.product-tuto + .product-card.stick-right{
		margin-left:1.6666%;
		margin-right:0;
		}
	.obj_products-list li.product-tuto + .product-card.stick-left{
		margin-right:1.6666%;
		margin-left:0;
		}
	*/	

	.obj_products-list li.product-tuto.var_brown_spots{
		margin-left:0;
		width:33.333%;
		}
	.obj_products-list li.product-tuto.var_acne{
		margin-right:0;
		width:33.333%;
		}
		
	.obj_products-list li.product-tuto.var_brown_spots:before{
		display:block; content:'';
		width: 0; height: 0;
		position:absolute;
		right:100%; top:50%;
		z-index:2;
		margin-top:-7px;
		border-style: solid;
		border-width: 7px 8px 7px 0;
		border-color: transparent #7d5240 transparent transparent;
		}
		
	.obj_products-list li.product-tuto.var_acne:before{
		display:block; content:'';
		width: 0; height: 0;
		position:absolute;
		left:100%; top:50%;
		z-index:2;
		margin-top:-7px;
		border-style: solid;
		border-width: 7px 0 7px 8px;
		border-color: transparent transparent transparent #d4af90;
		}
}

@media screen and (max-width:979px){
	.obj_products-list li.product-tuto{width:50%;}
	.obj_products-list li.product-tuto.var_acne{clear:left;}
	
}

@media screen and (max-width:749px){
	/*
	.obj_products-list li.product-card.stick-left,
	.obj_products-list li.product-card.stick-right{
		margin-right:auto;
		margin-left:auto;
		}
	.obj_products-list li.product-card.stick-right{
		margin-bottom:0;
		}
	.obj_products-list li.product-card.stick-left{
		margin-top:0;
		}
	*/

	.obj_products-list li.product-tuto {
		width:84%;
		padding-bottom:110%;
		}
	.obj_products-list li.product-tuto .v_background img{
		max-width:100%;
		}
	.obj_products-list li.product-tuto.var_brown_spots,
	.obj_products-list li.product-tuto.var_acne{
		margin-right:auto;
		margin-left:auto;
		}
	.obj_products-list li.product-tuto.var_brown_spots{
		margin-top:0;
		}
	.obj_products-list li.product-tuto.var_brown_spots:before{
		display:block; content:'';
		width: 0; height: 0;
		position:absolute;
		bottom:100%; left:50%;
		z-index:2;
		margin-left:-7px;
		border-style: solid;
		border-width: 0 7px 8px 7px;
		border-color: transparent transparent #634a3f transparent;
		}
	.obj_products-list li.product-tuto.var_acne{
		margin-bottom:0;
		}
	.obj_products-list li.product-tuto.var_acne:before{
		display:block; content:'';
		width: 0; height: 0;
		position:absolute;
		top:100%; left:50%;
		z-index:2;
		margin-left:-7px;
		border-style: solid;
		border-width: 8px 7px 0 7px;
		border-color: #835e45 transparent transparent transparent;
		}
		
	.obj_products-list li.product-diag .info-container{
		padding:10%;
		}
	.obj_products-list li.product-diag .info-container blockquote{
		max-width:160px;
		font-size:1.625em;
		}
	.obj_products-list li.product-diag .v_background img{
		max-width:110%;
		}
}
/* ///////////////////////////////////////////////
 *
 * VICHY 2015 - DIAGNOSTIC CAPILLAIRE
 *
 * //////////////////////////////////////////// */
.pg_diagnostic.theme-dermablend.ope_dermablend_3d{
	background:#f0f0f0;
	}
.pg_diagnostic.result.theme-dermablend.ope_dermablend_3d{
	background:#171717;
	}
.pg_diagnostic.theme-dermablend.ope_dermablend_3d .vichy2015-container{
	background:#f0f0f0;
	}
/* ============================================
 * DIAGNOSTIC
 * ========================================= */
.obj_article.diagnostic.dermablend_3d{
	position:relative;
	z-index:1;
	height:480px;
	overflow:hidden;
	background-color:#f2f2f2;
	margin-bottom:20px;
	height:auto;
	max-width:1170px;
	margin:0 auto;
	background:;
	}
.obj_article.diagnostic.dermablend_3d > header{
	position:absolute;
	z-index:100;
	top:0;
	left:0;
	width:100%;
	height:100%;
	min-height:535px;
	background-color: #e9e9e9;
	background-position: center top;
	background-repeat: no-repeat;
	}
.obj_article.diagnostic.dermablend_3d header > div{
	margin:0 auto;
	padding:0;
	position:absolute;
	left:50%; top:50%;
	max-width:350px;
	-webkit-transform:translateY(-50%);
		-ms-transform:translateY(-50%);
			transform:translateY(-50%);
	}
.obj_article.diagnostic.dermablend_3d header h1{
	font-size:1.875em;
	font-weight:500;
	line-height:1.2666em;
	text-transform:uppercase;
	}

/* */
.obj_article.diagnostic.dermablend_3d .obj_carrousel .item.var_header{
	overflow: hidden;
	background-color: #e9e9e9;
	}
.obj_article.diagnostic.dermablend_3d .var_header > div{
	margin:0 auto;
	padding:0;
	}




.obj_article.diagnostic.dermablend_3d header .ctn_bt{
	margin-top:30px;
	}
.obj_article.diagnostic.dermablend_3d .b_filet::before{
	background:#000 !important;
	}
.obj_article.diagnostic.dermablend_3d .b_filet:hover{
	color:#000 !important;
	}
.obj_article.diagnostic.dermablend_3d .question h5{
	padding:70px 0 50px;
	font-size:1.625em;
	text-align:center;
	text-transform:none;
	}
.obj_article.diagnostic.dermablend_3d .question h5 span{
	position:relative;
	display:block;
	margin:0 auto 20px;
	width:auto;
	float:none;
	background:none;
	color:#cea57c;
	font-size:1.5384em;
	line-height:1em;
	font-weight:200;
	}
.obj_article.diagnostic.dermablend_3d .question h5 span strong{
	font-size:1em;
	font-weight:500;
	}
	
@media screen and (max-width:767px){
	.obj_article.diagnostic.dermablend_3d header > div{
		width:100%;
		left:0; top:330px;
		padding:50px 7.5% 60px;
		-webkit-transform:none;
			-ms-transform:none;
				transform:none;
		background: #fff;
		}
	.obj_article.diagnostic.dermablend_3d header h1 {
		font-size: 2.29em;
		line-height: 1.2em;
		color: #1c213f;
		font-weight: 300;
		}
	.obj_article.diagnostic.dermablend_3d header .ctn_bt {
		margin-top: 22px;
		}	
}
	
/* =====================================================
 * CARROUSEL
 * ================================================== */
.obj_article.diagnostic:not(.result) .obj_carrousel{
	max-width:1180px;
	margin:0 auto;
	}
.obj_article.diagnostic:not(.result) .obj_carrousel .masque{
	height:390px;
	}
.obj_article.diagnostic:not(.result) .obj_carrousel .masque:before,
.obj_article.diagnostic:not(.result) .obj_carrousel .masque:after{
	content:"";
	position:absolute;
	z-index:2;
	height:100%;
	width:110px;
	left:50%;
	}
.obj_article.diagnostic:not(.result) .obj_carrousel .masque:before{
	margin-left:-590px;
	background:linear-gradient(to right, rgba(255,255,255,1) 0, rgba(255,255,255,0) 100%);
	}
.obj_article.diagnostic:not(.result) .obj_carrousel .masque:after{
	margin-left:480px;
	background:linear-gradient(to left, rgba(255,255,255,1) 0, rgba(255,255,255,0) 100%);
	}
.obj_carrousel:not(.result) .item{
	height:auto;
	}
.obj_article.diagnostic:not(.result) .item > div{
	position:relative;
	max-width:960px;
	margin:0 auto;
	padding:0 20px;
	}
.obj_article.diagnosti:not(.result)c .nav{
	position:relative;
	height:90px;
	text-align:center;
	}
.obj_article.diagnostic:not(.result) .nav button{
	height:auto;
	position:absolute;
	top:0;
	min-width:127px;
	}
.obj_article.diagnostic:not(.result) .nav button.b_prev{
	right:50%;
	margin-right:10px;
	padding:0 0 0 27px;
	}
.obj_article.diagnostic:not(.result) .nav button.b_prev:before,
.obj_article.diagnostic:not(.result) .nav button.b_prev:after{
	left:20px;
	}
.obj_article.diagnostic:not(.result) .nav button.b_next{
	padding:0 27px 0 0;
	left:50%;
	margin-left:10px;
	}
.obj_article.diagnostic:not(.result) .nav button.b_next:before,
.obj_article.diagnostic:not(.result) .nav button.b_next:after{
	left:auto;
	right:20px;
	}
.obj_article.diagnostic:not(.result) .nav button.disabled{
	cursor:pointer;
	opacity:1;
	}
.obj_article.diagnostic .obj_carrousel.product{
	padding:0
	}
.obj_article.diagnostic .obj_carrousel.product .nav .prev {
	left: -60px;
	}
.obj_article.diagnostic .obj_carrousel.product .nav .next {
    right: -60px;
	}
	
.obj_article.diagnostic.dermablend_3d .obj_carrousel{
	background:#fff;
	}
.obj_article.diagnostic.dermablend_3d .obj_carrousel .nav{
	margin-top:50px;
	padding:100px 0 0;
	position:relative;
	}
	
@media screen and (max-width:767px){
	.obj_article.diagnostic.dermablend_3d .question h5{
		font-size:1.250em;
		line-height: 1.200em;
		padding: 26px 0 40px;
		}
	.obj_article.diagnostic.dermablend_3d > header{
		background-size:175% auto;
		background-position:left top;
		}
		
	.obj_article.diagnostic header > div{
		padding:0;
		position:relative;
		top:340px; left:auto; width:84%;
		}
	.obj_article.diagnostic header h1{
		font-weight:200;
		}
	.obj_article.diagnostic.dermablend_3d .obj_carrousel {
		background: #f3f4f5;
		}
	.obj_article.diagnostic.dermablend_3d .obj_carrousel .nav{
		margin-top: 30px;
		padding-top: 50px;
		}	
}
	
/* --- ITEM 01 --- */	
.item01 .question .radio{
	font-size:0;
	}	
.item01 .question .radio div{
	display:inline-block;
	width:50%;
	font-size:13px;
	text-align:right;
	vertical-align:top;
	}	
.item01 .question .radio div + div{
	text-align:left;
	}	
.item01 .question .radio label{
	font-size:1.313em;
	line-height: 1.190em;
	font-weight:200;
	}
.item01 .question .radio label strong{
	font-weight:500;
	}
.item01 .question .radio div > span{
	display:block;
	position:relative;
	vertical-align:top;
	margin:0 20px 0 0;
	padding:0 35px 30px 0;
	}
.item01 .question .radio div + div > span{
	margin:0 0 0 20px;
	padding:0 0 30px 35px;
	}
.item01 .question .radio div span[role="radio"]{
	position:absolute;
	top:3px; right:0;
	width:20px; height:20px;
	background:#e1e1e1;
	border-radius:0;
	margin:0;
	border:none;
	}
.item01 .question .radio div + div span[role="radio"]{
	position:absolute;
	top:3px; left:0;
	right:auto;
	}
.item01 .question .radio div span[role="radio"]:after{
	background-color:#cea57c;
	border-radius:0;
	margin:-10px 0 0 -10px;
	width:20px; height:20px;
	}
	
@media screen and (max-width:767px){	
	.item01 .question .radio div,
	.item01 .question .radio div + div{
		display:block;
		width:100%;
		text-align:left;
		}	
	.item01 .question .radio div > span,
	.item01 .question .radio div + div > span{
		margin:0;
		padding:0 0 35px 30px;
		}
	.item01 .question .radio div span[role="radio"],
	.item01 .question .radio div + div span[role="radio"]{
		position:absolute;
		top:0; left:0; right:auto;
		}
	
}

/* --- ITEM 02 --- */	
.item02 .question .radio .ctn_radios {
	position:relative;
	}	
.item02 .question .radio .t_title {
	position:absolute;
	top:50%; right:50%;
	margin-right:210px;
	text-transform:uppercase;
	display:block;
	font-size:1em;
	font-weight:700;
	-webkit-transform:translateY(-50%);
		-ms-transform:translateY(-50%);
			transform:translateY(-50%);
	}	
.item02 .question .radio .ctn_table {
	display:table;
	margin:0 auto 50px;
	}		
.item02 .question .radio .ctn_table > span {
	display:table-cell;
	position:relative;
	width:33.33333333%;
	vertical-align:top;
	}		
.item02 .question .radio span[role="radio"] {
	position:absolute;
	top:0; left:0;
	z-index:0;
	}	
.item02 .question .radio label {
	position:relative;
	display:block;
	z-index:1;
	}	
.item02 .question .radio span[role="radio"] + label:before {
	display:block; content:'';
	position:absolute;
	top:0; left:0; bottom:0; right:0;
	border:3px solid rgba(0,0,0,0);
	-webkit-transition:all 0.2s;
	   -moz-transition:all 0.2s;
			transition:all 0.2s;
	}	
.item02 .question .radio span[aria-checked="true"] + label:before {
	border-color:rgba(0,0,0,1);
	}	
.item02 .question .radio img {
	display:block;
	width:100%;
	max-width:115px;
	}	
	
@media screen and (max-width:767px){
	.item02 .question .radio .t_title {
		position:relative;
		top:auto; right:auto;
		margin:0 0 10px;
		width:100%; text-align:center;
		-webkit-transform:none;
			-ms-transform:none;
				transform:none;
		}		
	.item02 .question .radio .ctn_table {
		margin:0 auto 30px;
		}		
	.item02 .question .radio img {
		max-width:100%;
		}	
}	

/* --- FOOTER--- */
.pg_diagnostic .main-footer{margin-top:90px;} 

@media screen and (max-width:767px){
	.pg_diagnostic .main-footer {
		margin-top: 0;
		}	
}

/* =============================== *
 * RESULT DIAGNOSTIC
 * =============================== */

@media screen and (min-width:1200px){
	.pg_diagnostic.result.ope_dermablend_3d .breadcrumb-container{
		left:50%;
		top:0;
		-webkit-transform:translateX(-50%);
			-ms-transform:translateX(-50%);
				transform:translateX(-50%);
		}
}
@media screen and (min-width:960px){
	.pg_diagnostic.result.ope_dermablend_3d .breadcrumb-container{
		width:100%;
		max-width:1170px;
		position:absolute;
		}
	.pg_diagnostic.result.ope_dermablend_3d .breadcrumb-container .breadcrumb .breadcrumb-item a,
	.pg_diagnostic.result.ope_dermablend_3d .breadcrumb-container .breadcrumb .breadcrumb-item span{ color:#fff; }
	.pg_diagnostic.result.ope_dermablend_3d .breadcrumb-container .breadcrumb .breadcrumb-item svg{ fill:#fff; }
}
 
.pg_diagnostic.result.ope_dermablend_3d .related-content{
	padding-top:115px;
	}
.pg_diagnostic.result.theme-dermablend .related-content{
	padding-bottom:0;
	background-color:#171717;
	}
.pg_diagnostic.result.theme-dermablend .obj_routine-slider .separator .bg{
	color:#000;
	}
.pg_diagnostic.result.theme-dermablend .obj_routine-slider .separator .plus{
	color:#cea57c;
	}

@media screen and (max-width:980px){
	.pg_diagnostic.result.ope_dermablend_3d .related-content{ padding-top:0; }
}

.obj_routine-slider .product-card{
	max-width:100%;
	}
.obj_routine-slider .product-card.double .routine-double{
	font-size:0;
	}
.obj_routine-slider .product-card.double .routine-double .ctn_produit{
	display:inline-block;
	width:50%;
	font-size:16px;
	}
@media screen and (min-width:767px){
	.obj_routine-slider .product-card.double{
		width:48.25%;
		max-width:580px;
		}
	.obj_routine-slider[data-num-slides="4"] .product-card:after,
	.obj_routine-slider[data-num-slides="4"] .product-card.double:after,
	.obj_routine-slider[data-num-slides="4"] .product-card:before,
	.obj_routine-slider[data-num-slides="4"] .product-card.double:before{display:none; padding-bottom:0;}
}


/* --- POPIN VIDEO --- */
.obj_popin > .content > .obj_popin-dermablend3d {
	padding: 0;
	font-size: 0;
	max-width: 640px;
}
.obj_popin-dermablend3d .close svg {
	fill: #fff;
}

/* =====================================================
 * PRODUCTS-TONES
 * ================================================== */
.obj_products-tones{
	margin:0 0 13px;
	padding:52px 25px 27px;
	text-align:center;
	} 
.obj_products-tones > div{
	margin:0 auto;
	max-width:1170px;
	}	
.obj_products-tones header{
	font-size:26px;
	font-weight:300;
	line-height:1.0769230em;
	margin-bottom:26px;
	}	
.obj_products-tones .title{
	font-weight:bold;
	text-transform:uppercase;
	}
.obj_products-tones .tones-list::after{
	clear:both;
	content:"";
	display:block;
	}		
.obj_products-tones .tones-list > li{
	float:left;
	}		
.obj_products-tones a{
	color:#000;
	display:block;
	overflow:hidden;
	padding-top:118.115942%;
	position:relative;
	}	
.obj_products-tones a > div{
	left:2.5%;
	position:absolute;
	right:2.5%;
	top:62.883435%;
	-webkit-transform:translateY(-50%);
		-ms-transform:translateY(-50%);
			transform:translateY(-50%);
	z-index:1;		
	}	
.obj_products-tones .tone{
	font-size:28px;
	font-weight:300;
	line-height:.8571428em;
	margin:0 0 .357142em;
	text-transform:uppercase;
	}	
.obj_products-tones .tone strong{
	font-weight:700;
	}	
.obj_products-tones .tone-link ul{
	line-height:18px;
	margin:0 0 1.111111em;
	min-height:3em;
	}	
.obj_products-tones img{
	height:100%;
	left:50%;
	opacity:.4;
	position:absolute;
	top:0;
	-webkit-transform:translateX(-50%);
		-ms-transform:translateX(-50%);
			transform:translateX(-50%);
	transition:opacity .55s;
	}
.obj_products-tones .button{
	border-color:#f0f0f0;
	}	
/* hover */
.obj_products-tones a:hover img{
	opacity:1;
	}		
/* active */
.obj_products-tones .active::after{
	border:2px solid #000;
	box-sizing:border-box;
	content:"";
	height:100%;
	left:0;
	position:absolute;
	top:0;
	width:100%;
	}
.obj_products-tones .active .cta-container{
	margin:0 auto;
	min-height:40px;
	position:relative;
	width:38px;
	}
.obj_products-tones .active .cta-container::after{
	border-color:#000;
	border-style:solid;
	border-width:0 1px 1px 0;
	content:"";
	left:50%;
	padding-top:100%;
	position:absolute;
	top:20%;
	-webkit-transform:translate(-50%, -50%) rotate(45deg);
		-ms-transform:translate(-50%, -50%) rotate(45deg);
			transform:translate(-50%, -50%) rotate(45deg);
	width:100%;
	}	
.obj_products-tones .active .button{
	display:none;
	}	
.obj_products-tones .active img{
	opacity:1;
	}
/* color */
.obj_products-tones .active.tone-1::after{
	border-color:#dfba6f;
	}
.obj_products-tones .active.tone-2::after{
	border-color:#cf9273;
	}
.obj_products-tones .active.tone-3::after{
	border-color:#8d9664;
	}
.obj_products-tones .active.tone-4::after{
	border-color:#8481bb;
	}

@media screen and (max-width:979px){
	.obj_products-tones .tones-list > li{
		margin:0 0 20px 20px;
		width:calc(50% - 10px);
		}
	.obj_products-tones .tones-list > li:nth-child(odd){
		margin-left:0;
		}
	.obj_products-tones a{
		padding-top:100%;
		}		
	.obj_products-tones a > div{
		top:50%;
		}		
}

@media screen and (max-width:640px){
	.obj_products-tones header{
		font-size:18px;
		}
	.obj_products-tones .tone{
		font-size:19px;
		}	
	.obj_products-tones .tone-link ul{
		font-size:14px;
		line-height:1em;
		}		
	.obj_products-tones .tone-link .button{
		background:none;
		border-width:0;
		color:#000;
		padding-bottom:0;
		padding-top:0;
		}	
	.obj_products-tones .button .btn-bg{
		display:none;
		}	
	.obj_products-tones .active .cta-container{
		min-height:16px;
		width:12px;
		}	
}

@media screen and (max-width:359px){
	.page-container .obj_products-tones .tones-list > li{
		float:none;
		margin:20px auto 0;
		max-width:190px;
		width:auto
		}
	.page-container .obj_products-tones .tones-list > li:first-child{
		margin-top:0;
		}	
}

@media screen and (min-width:980px){
	.obj_products-tones .tones-list > li{
		margin-left:20px;
		width:calc((100% - 60px) / 4);
		}
	.obj_products-tones .tones-list > li:first-child{
		margin-left:0;
		}	
}	

/* =====================================================
 * PROD BLOC PRODUCTS-TONES
 * ================================================== */