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

/*  $ > Projet

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

div.main {
    padding-top: 0;
	}

/* ======================================== */
/*  banner
/* ======================================== */

.banner_diversion_2017 {
	padding-top: 150px;
	min-height: 540px;
	max-width: 1500px;
	margin: 0 auto;
	background: url("images/bg_banner.jpg") no-repeat center center #f4f3f4;
	}
.banner_diversion_2017 a {
	height: 100%;
	width: 100%;
	}
.banner_diversion_2017 header {
	box-sizing: border-box;
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
	padding: 190px 25% 190px 20px;
	}
.banner_diversion_2017 header h2 {
	font: 20px/1em "FuturaBT-Light", Arial;
	color: #666666;
	text-transform: uppercase;
	}
.banner_diversion_2017 header h1 {
	font: 36px/1.2em "FuturaBT-Bold", Arial;
	color: #008bb0;
	text-transform: uppercase;
	}

/***/

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

	.banner_diversion_2017 {
		padding-top: 80px;
		min-height: 0;
		}
	.banner_diversion_2017 header {
		padding: 120px 40% 120px 20px;
		}
	.banner_diversion_2017 header h1 {
		font-size: 28px;
		}

	}

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

	.banner_diversion_2017 header {
		padding: 50px 20px 220px 20px;
		}
	.banner_diversion_2017 {
		background: url("images/bg_banner.jpg") no-repeat right bottom / 600px auto #f4f3f4;
		}

	}

/* ======================================== */
/*  Hexanav
/* ======================================== */

.banner_diversion_2017 {
	margin-bottom: -155px;
	}
.diversion_2017 .obj_section {
	padding-top: 155px;
	margin-bottom: -155px;
	}
.diversion_2017 .obj_section:last-child {
	margin-bottom: 0;
	}

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

	.banner_diversion_2017 {
		margin-bottom: 0px;
		}
	.diversion_2017 .obj_section {
		padding-top: 0px;
		margin-bottom: 0px;
		}

	}

/* ======================================== */
/*  section
/* ======================================== */

.diversion_2017 .obj_section > div {
	padding: 65px 0;
	background-color: white;
	}
.diversion_2017 .obj_section .ctn_center {
	box-sizing: border-box;
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
	padding: 0 20px;
	}
.diversion_2017 .obj_section .ctn_center > div + div {
	margin-top: 50px;
	}
.diversion_2017 .obj_section .ctn_center > * + * {
	margin-top: 20px;
	}
.diversion_2017 .obj_section header {
	margin: 0;
	padding-bottom: 10px;
	border-bottom: solid 1px #cccccc;
	}
.diversion_2017 .obj_section header h2 {
	font: 26px/1.2em "FuturaBT-Medium", Arial;
	color: #008bb0;
	text-transform: uppercase;
	}
.diversion_2017 .obj_section h3 {
	margin-bottom: 0;
	font: 16px/1.2em "FuturaBT-Bold", Arial;
	color: black;
	text-transform: uppercase !important;
	}
.diversion_2017 .obj_section p {
	margin-bottom: 0;
	font: 16px/1.8em "FuturaBT-Book", Arial;
	color: black;
	}
.diversion_2017 .obj_section em {
	font-family: "FuturaBT-Bold", Arial;
	color: #008bb0;
	}
.diversion_2017 .obj_section a {
	color: black;
	transition: all ease 400ms;
	}
.diversion_2017 .obj_section a:hover {
	color: #008bb0;
	}
.diversion_2017 .obj_section p + p {
	margin-top: 30px;
	}
.diversion_2017 .obj_section ul li {
	position: relative;
	margin-top: 15px;
	padding-left: 12px;
	font: 16px/1.2em "FuturaBT-Book", Arial;
	color: black;
	}
.diversion_2017 .obj_section ul li::before {
	content: "";
	display: block;
	position: absolute;
	top: 6px;
	left: 0;
	height: 4px;
	width: 4px;
	border-radius: 50%;
	background-color: black;
	}
.diversion_2017 .obj_section .ctn_cols {
	font-size: 0;
	text-align: left;
	}
.diversion_2017 .obj_section .ctn_cols .ctn_col {
	display: inline-block;
	vertical-align: top;
	width: calc(95% / 2);
	}
.diversion_2017 .obj_section .ctn_cols .ctn_col + .ctn_col {
	margin-left: 5%;
	}
.diversion_2017 .obj_section .ctn_border {
	padding: 20px;
	border: solid 1px black;
	}
.diversion_2017 .obj_section .ctn_border > * + * {
	margin-top: 10px;
	}
.diversion_2017 .obj_section .ctn_btn .obj_btn {
	font: 16px/1em "FuturaBT-Bold", Arial;
	letter-spacing: 1px;
	color: black;
	text-transform: uppercase;
	}
.diversion_2017 .obj_section .ctn_btn .obj_btn::after {
	content: ">";
	margin-left: 5px;
	font: 16px/1em "FuturaBT-Bold", Arial;
	color: #008bb0;
	}

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

	.diversion_2017 .obj_section br {
		display: none;
		}
	.diversion_2017 .obj_section header h2 {
		font-size: 20px;
		}
	.diversion_2017 .obj_section h3 {
		font-size: 14px;
		}
	.diversion_2017 .obj_section p {
		font-size: 14px;
		}
	.diversion_2017 .obj_section p + p {
		margin-top: 20px;
		}
	.diversion_2017 .obj_section ul li {
		margin-top: 10px;
		font-size: 14px;
		}
}

/***/

.diversion_2017 .section_intro > div {
	background: url("images/bg_section_intro.jpg") no-repeat right center white;
	}
.diversion_2017 .section_intro .ctn_border h3 {
	font: 22px/1em "FuturaBT-Light", Arial;
	}
.diversion_2017 .section_intro .ctn_border h2 {
	font: 32px/1em "FuturaBT-Bold", Arial;
	color: #008bb0;
	}

.diversion_2017 .section_authentic > div {
	background-color: #dce5e7;
	}

.diversion_2017 .section_authorized > div {
	background: url("images/bg_section_authorized.jpg") no-repeat right bottom white;
	}
.diversion_2017 .section_authorized > div > h3 + * {
	margin-top: 10px;
	}
.diversion_2017 .section_authorized .ctn_logo {
	margin-top: 50px;
	}
.diversion_2017 .section_authorized .ctn_logo img {
	display: block;
	max-width: 330px;
	margin-top: 10px;
	}
.diversion_2017 .section_authorized	.threeCol li {
   display: inline-block;
   vertical-align: top;
   min-width: 230px;
   width: 30%;
	}

.diversion_2017 .section_caution > div {
	background-color: #dce5e7;
	}
.diversion_2017 .section_caution .ctn_cols {
	margin-top: 0;
	}
.diversion_2017 .section_caution .ctn_cols .ctn_col {
	width: calc(90% / 3);
	}
.diversion_2017 .section_caution .ctn_btn {
	padding-left: 35%;
	}

.diversion_2017 .section_skinceuticals ul {
	padding-right: 154px;
	background: url("images/v_section_skinceuticals_logo.gif") no-repeat right top white;
	}
.diversion_2017 .section_skinceuticals a {
	color: #008bb0;
	}

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

	.diversion_2017 .section_intro > div {
		background-image: none;
		}
	.diversion_2017 .section_intro .ctn_border h3 {
		font-size: 18px;
		}
	.diversion_2017 .section_intro .ctn_border h2 {
		font-size: 24px;
		}

	.diversion_2017 .section_authorized > div {
		background-image: none;
		}
	.diversion_2017 .section_authorized .ctn_logo img {
		max-width: 280px;
		}

	.diversion_2017 .section_caution .ctn_cols .ctn_col {
		width: 100%;
		}
	.diversion_2017 .section_caution .ctn_cols .ctn_col + .ctn_col {
		margin: 0;
		}
	.diversion_2017 .section_caution .ctn_btn {
		padding-left: 0;
		}

	.diversion_2017 .section_skinceuticals ul {
		padding: 0 0 120px 0;
		background: url("images/v_section_skinceuticals_logo.gif") no-repeat center bottom / auto 100px white;
		}

	}

/* ======================================== */
/*  Popin
/* ======================================== */

.obj_popin .message {
	box-sizing: border-box;
	width: 1180px;
	max-width: 90%;
	padding: 50px;
	}
.obj_popin .message .ctn_cols {
	display: table;
	width: 100%;
	}
.obj_popin .message .ctn_cols .ctn_col {
	display: table-cell;
	}
.obj_popin .message .ctn_cols .ctn_col + .ctn_col {
	padding-left: 30px;
	}
.obj_popin .message .ctn_cols .ctn_col ul li {
	position: relative;
	padding-left: 12px;
	font: 16px/1.4em "FuturaBT-Light", Arial;
	}
.obj_popin .message .ctn_cols .ctn_col ul li::before {
	content: "";
	display: block;
	position: absolute;
	top: 0.7em;
	left: 0;
	height: 4px;
	width: 4px;
	border-radius: 50%;
	background-color: black;
	}

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

	.obj_popin .message {
		width: 300px;
		padding: 50px 0px 50px 20px;
		}
	.obj_popin .message .ctn_scroll {
		position: relative;
		overflow: hidden;
		height: 380px;
		}
	.obj_popin .message .ctn_cols .ctn_col {
		display: block;
		}
	.obj_popin .message .ctn_cols .ctn_col + .ctn_col {
		padding-left: 0px;
		}
	.obj_popin .message .ctn_cols .ctn_col ul li {
		font-size: 13px;
		}

	}