/*-----------------------------
		GENERAL
-----------------------------*/

/*:root {
	--black: #053372;
	--trueBlack: #000000;
	--blue: #069fd9;
	--purple: #4c5099;
	--lightGrey: #f8fcfd;
	--pink: #b02096;
	--boxShadow: 0px 0px 20px 5px rgba(0,0,0,0.025);
	--lightBoxShadow: 0px 0px 3px 1px rgba(0,0,0,0.15);
}
*/

html, body {
	max-width: 100vw;
	overflow-x: hidden;
}

body {
	color: #053372;
	font-family: 'Poppins', sans-serif;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
	font-weight: 400;
	font-size: 14px;
	background-color: #fff;
	padding-top: 170px;
}
	@media screen and (max-width: 1050px) { body { padding-top: 150px; } }
	@media screen and (max-width: 830px) { body { padding-top: 100px; } }
	@media screen and (max-width: 450px) { body { padding-top: 90px; } }

/*******************
	helpers
*******************/

.blue {
	color: #069fd9;
}

.bg-blue {
	background-color: #069fd9;
	color: #ffffff;
}
.bg-grey {
	background-color: #f8fcfd;
}
.bg-purple {
	background-color: #4c5099;
	color: #ffffff;
}
.bg-lightGrey {
	background-color: #f8fcfd;
}
.bg-white {
	background-color: #ffffff;
	color: #053372;
}

.btn { font-weight: 600; padding: 1.05em 2.25em; }

.btn-big { font-weight: 700; font-size: 2.5em; }
.btn-wide { padding: 0.33em 2.66em; }

.btn-white {
	background-color: #fff;
	border-color: #fff;
	color: #4c5099;
}
.btn-white:hover {
	background-color: #4c5099;
	border-color: #4c5099;
	color: #fff;
}

.btn-purple {
	background-color: #4c5099;
	border-color: #4c5099;
	color: #fff;
}
.btn-purple:hover {
	background-color: transparent;
	color: #4c5099;
}

.btn-blue {
	background-color: #069fd9;
	border-color: #069fd9;
	color: #fff;
}
.btn-blue:hover {
	background-color: transparent;
	color: #069fd9;
}


.title.huge > * {
	font-size: calc(3em + 1.55vw * 1);
	line-height: 1.25em;
	font-weight: 800;
}
.title.big > * {
	font-size: 2.5em;
	line-height: 1.25em;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}
.title.medium > * {
	font-size: 2.6em;
	line-height: 1.25em;
	font-weight: 700;
}
.title.small > * {
	font-size: 1.43em;
	line-height: 1.2em;
	font-weight: 700;
}
.pretitle > * {
	font-size: 1.285em;
	line-height: 1.25em;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.15em;
}
.pretitle + .title {
	margin-top: 1.5em;
}
	@media screen and (max-width: 500px) {
		.title.huge > * { font-size: 2.2em; }
		.title.big > * { font-size: 1.8em; }
		.title.medium > * { font-size: 1.8em; }
	}

.text > * {
	margin-bottom: 18px;
}
.text p, .text ul, .text ol {
	line-height: 1.45em;
}
.text ul, .text ol {
	margin-left: 1em;
}
.text > h1:not(:first-child),
.text > h2:not(:first-child),
.text > h3:not(:first-child),
.text > h4:not(:first-child) {
	margin-top: 36px;
}
.text > h1 {
	font-size: 2em;
	font-weight: 700;
}
.text > h2 {
	font-size: 1.5em;
	font-weight: 700;
}
.text > h3 {
	font-size: 1.33em;
	font-weight: 600;
}
.text > h4 {
	font-size: 1.15em;
	font-weight: 500;
}

/*******************
	QUICK ACCESS
*******************/

.quick-access {
	z-index: 899;
	position: fixed;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
}
.quick-access ul {
	list-style-type: none;
	text-align: right;
}
.quick-access li {
	position: relative;
	text-transform: uppercase;
	background-color: #069fd9;
	color: #fff;
	text-align: center;
	margin: 0.5em 0 0.5em auto;
	padding: 0.75em 0.5em;
	width: 6em;
	font-size: 0.7em;
	font-weight: 600;
	transition: 0.1s;
}
.quick-access li:hover {
	padding-right: 1.5em;
	width: 7.5em;
}
.quick-access .icon img {
	width: 3em;
	height: 3em;
	object-fit: contain;
	object-position: center;
	filter: brightness(0) invert(1);
	margin-bottom: 0.5em;
}
.quick-access .icon img[src*="phone"] {
	width: 2.5em;
}
.quick-access .icon img[src*="devis"] {
	position: relative;
	left: 0.5em;
}
	
	@media screen and (max-width: 600px) {
		.quick-access { font-size: 0.8em; }
	}

/*******************
	HEADER
*******************/

header {
	z-index: 999;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #fff;
}
header .top {
	padding: 1em 0;
}
header .logo img {
	width: 41em;
	transition: 0.5s;
}
body.scrolled header .logo img { width: 30em; }
header .ctas {
	text-align: right;
}
header .cta {
	flex: 1;
	position: relative;
	padding: 0.5em 3em;
	flex-grow: 0;
}
header .cta:not(:first-child) {
	border-left: #f8fcfd 1px solid;
}
header .cta .picto {
	flex: 0 0 2.5em;
}
header .cta .content {
	padding: 0 2em 0 0.85em;
	text-align: left;
	line-height: 1.5em;
	font-weight: 700;
	font-size: 1.15em;
	white-space: nowrap;
}
header .cta span {
	color: #4c5099;
	opacity: 0.7;
}

.main-header .menu > .wrapper { padding-left: 0; padding-right: 0; }

header .menu {
	position: relative;
	top: 2em;
	margin-top: -2em;
}
header .menu nav {
	position: relative;
	text-align: right;
	background-color: #4c5099;
	color: #fff;
}
@media screen and (min-width: 1170px) {
	header .menu nav::before {
		content: '';
		position: absolute;
		top: 0;
		right: 100%;
		height: 100%;
		width: calc((100vw - 1200px) / 2);
		background-color: #4c5099;
	}
	body:not(.page-template-page-accueil) header .menu nav::after {
		content: '';
		position: absolute;
		top: 0;
		left: 100%;
		height: 100%;
		width: calc((100vw - 1200px) / 2);
		background-color: #4c5099;
	}
}
header .menu nav > ul {
	list-style-type: none;
}
header .menu nav > ul > li {
	display: inline-block;
}
header .menu nav > ul > li.current-menu-item,
header .menu nav > ul > li.active {
	background-color: #069fd9;
}
header .menu nav > ul > li > a {
	position: relative;
	display: block;
	font-size: 1.05em;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	padding: 1.5em 3em 1.5em 2em;
}
header .menu nav > ul > li > a::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 1em;
	width: 0.8em;
	height: 0.8em;
	margin-top: -0.5em;
	background: url(../img/icon-down-arrow.svg) no-repeat center;
	background-size: contain;
	filter: brightness(0) invert(1);
	transition: 0.3s;
}
header .menu nav > ul > li:hover > a {
	background-color: #069fd9;
}


header .menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	overflow: visible;
	background-color: #069fd9;
	color: #fff;
	padding: 2em 2em 2em calc(20% + 4em);
	text-align: left;
	display: none;
	opacity: 0;
}
header .menu nav > ul > li:hover .sub-menu {
	display: block;
	opacity: 1;
}
@media screen and (min-width: 1200px) {
	header .menu .sub-menu::before {
		content: '';
		position: absolute;
		top: 0;
		right: 100%;
		height: 100%;
		width: calc((100vw - 1200px) / 2);
		background-color: #069fd9;
	}
}
header .sub-menu .ill {
	position: absolute;
	top: 0;
	right: 80%;
	width: calc(((100vw - 1170px) / 2) + 20%);
	height: 100%;
}
@media screen and (max-width: 1200px) {
	header .menu .sub-menu { padding: 2em; }
	header .sub-menu .ill {
		display: none;
	}
}
header .sub-menu .intro {
	display: inline-block;
	background-color: rgba(255,255,255,0.75);
	color: #053372;
	padding: 0.5em 1em;
	border-radius: 0.15em;
	text-align: left;
	margin-bottom: 2em;
}
header .sub-menu .intro p {
	margin-bottom: 0;
}
header .sub-menu .twoCols > div {
	flex: 48%;
}
header .sub-menu .title > * {
	font-size: 1.125em;
	margin-bottom: 1.5em;
	font-weight: 600;
}
header .sub-menu ul {
	list-style-type: none;
	text-align: left;
}
header .sub-menu li {
	position: relative;
	display: inline-block;
	width: 49%;
	margin-bottom: 1em;
	padding-left: 1.5em;
	font-size: 1.125em;
}
header .sub-menu .twoCols li {
	display: block;
	width: 100%;
}
header .sub-menu li::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 0em;
	width: 0.8em;
	height: 0.8em;
	margin-top: -0.5em;
	background: url(../img/icon-down-arrow.svg) no-repeat center;
	background-size: contain;
	filter: brightness(0) invert(1);
	transform: rotate(270deg);
	transition: 0.3s;
}
header .sub-menu li:hover a, header .sub-menu a.active {
	text-decoration: underline;
}

@media screen and (min-width: 1550px) {
	header .ctas .cta:last-child {
		display: none;
	}
	.private-access {
		position: absolute;
		top: 1.75em;
		right: 10px;
		width: calc(((100vw - 1200px) / 2) - 20px);
	}
	body.page-template-page-accueil .private-access {
		top: 50%;
		transform: translateY(-50%);
	}
	.private-access img {
		max-width: 10em;
	}
}
@media screen and (max-width: 1550px) {
	header .private-access { display: none; }
	header .cta.private { width: 10em; flex: 0 0 14em; }
	header .cta { padding: 0.5em 1.5em; }
}
@media screen and (max-width: 1150px) {
	header .ctas { font-size: 0.9em; }
	header .cta .content { font-weight: 600; }
}
@media screen and (max-width: 1050px) {
	header .ctas .cta:not(:last-child) { font-size: 0.9em; }
	header .cta .content { font-weight: 500; }
	header .ctas .cta:last-child { border: none; }
	header .menu { font-size: 0.9em; }
}
@media screen and (max-width: 950px) {
	header .menu { font-size: 0.8em; }
}
@media screen and (max-width: 900px) {
	header .ctas .cta:not(:last-child) { display: none; }
	header .logo img, body.scrolled header .logo img {
		max-width: 41em;
		width: 100%;
	}
}
@media screen and (max-width: 830px) {
	header .ctas .cta:last-child { display: none; }
	header .main-header .menu { display: none; }
}
@media screen and (max-width: 450px) {
	header .logo img, body.scrolled header .logo img {
		max-width: 18em;
		width: 100%;
	}
}



.call-mobile-menu {
	position: absolute;
	top: 50%;
	right: 30px;
	transform: translateY(-50%);
}
	@media screen and (min-width: 829px) {
		.call-mobile-menu { display: none; }
	}
.morphing-button {
	display: block;
	padding: 0.5em;
	text-transform: uppercase;
	font-weight: 700;
}
.morphing-button span {
	position: relative;
	top: -2px;
	display: inline-block;
	width: 1.25em;
	height: 0;
	margin-left: 0.5em;
	vertical-align: middle;
	border-bottom: currentColor 2px solid;
	transition: 0.1s;
}
.morphing-button span::before {
	content: '';
	position: absolute;
	top: -6px;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: currentColor;
	transition: 0.3s;
}
.morphing-button span::after {
	content: '';
	position: absolute;
	top: 6px;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: currentColor;
	transition: 0.3s;
}
.w-mobile-menu .morphing-button span {
	top: -1px;
	border-color: transparent;
}
.w-mobile-menu .morphing-button span:before {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(45deg);
}
.w-mobile-menu .morphing-button span:after {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-45deg);
}


.mobile-menu {
	z-index: 999;
	position: fixed;
	top: 0;
	left: -40em;
	width: 25em;
	max-width: 80%;
	height: 100%;
	max-height: 100%;
	overflow-y: hidden;
	background-color: #fff;
	box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.15);
	text-align: left;
	padding: 3em;
	transition: 0.3s;
}
	.mobile-menu:hover {
		max-height: 4000%;
		overflow-y: auto;
	}
	.w-mobile-menu .mobile-menu {
		left: 0;
	}

.mobile-menu .logo {
	max-width: 14em;
	margin-bottom: 2em;
}
.mobile-menu .contacts-nav {
	right: 0;
}
.mobile-menu .contacts-nav li {
	display: block;
	padding: 0;
	margin-bottom: 0.5em;
}
.mobile-nav {
	margin-top: 1.5em;
	margin-bottom: 1.5em;
}
.mobile-nav ul {
	list-style-type: none;
}
.mobile-nav li:not(:last-child) {
	border-bottom: currentColor 1px solid;
}
.mobile-nav li a {
	display: block;
	padding: 1em 0;
}

.mobile-menu .toggle-parent > li.menu-item-has-children > a { display: none; }

.mobile-menu li a img { max-height: 1.25em; }

/*******************
	FOOTER
*******************/

body > footer {
	position: relative;
	overflow: hidden;
	background-color: #0d8cc1;
	color: #fff;
}
body:not(.page-template-page-accueil) > footer {
	padding-top: 4em;
}

body > footer > .ill {
	z-index: 1;
	position: absolute;
	top: -15vw;
	left: 0;
	margin-left: -25vw;
	width: calc(300px + 40vw);
	height: calc(300px + 40vw);
	background: url(../img/icon-pp-white.svg) no-repeat center;
	background-size: contain;
	opacity: 0.02;
	animation: blink 5s infinite alternate;
}

body > footer > .wrapper {
	z-index: 2;
}


footer .agences {
	background-color: #fff;
	color: #053372;
	margin-left: -1em;
	margin-right: -1em;
	width: calc(100% + 2em);
	padding: 2.5em 3.5em;
}
footer .agences .agence {
	flex: 0 0 25%;
	padding: 1em;
	text-align: left;
}
@media screen and (max-width: 1150px) {
	footer .agences {
		padding: 2.5em 2em;
	}
}
@media screen and (max-width: 1100px) {
	footer .agences .agence {
		flex: 0 0 50%;
	}
}
@media screen and (max-width: 600px) {
	footer .agences .agence {
		flex: 0 0 100%;
	}
}
footer .agence .title > * {
	font-size: 1.4em;
	font-weight: 600;
	margin-bottom: 0.75em;
}
footer .agence p {
	line-height: 1.7em;
	font-weight: 500;
}
footer .agence a {
	color: #069fd9;
}

.the-footer {
	margin-top: 4em;
}
.the-footer > .flex > div {
	flex: 0 0 50%;
	margin-bottom: 2em;
}

.footer-sitemap {
	text-align: left;
}
footer .logo img {
	width: 30em;
	margin-left: -0.6em
}

.footer-nav ul {
	list-style-type: none;
	margin-left: 4em;
	margin-top: 3em;
	border-left: currentColor 1px solid;
	padding-left: 1em;
}
.footer-nav li {
	line-height: 1.5em;
	margin-bottom: 0.5em;
}
.footer-nav li img {
	max-width: 3em;
	max-height: 1.25em;
	object-fit: contain;
	object-position: center;
	filter: brightness(0) invert(1);
}
.footer-nav ul ul {
	display: none;
	margin-top: 0.5em;
	margin-left: 0;
	border: none;
}

.toggle-parent li.menu-item-has-children.active ul {
	display: block;
}

.footer-news {
	text-align: left;
	min-width: 1px;
	padding-top: 4em;
}
.footer-news > p {
	margin-top: 1em;
	text-align: right;
}
.footer-news > p > a {
	text-decoration: underline;
}
.news-slider-wrapper {
	padding: 2em;
	background-color: rgba(255,255,255,0.3);
}
.news-slide {
	font-size: 0.8em;
}
.news-slide .date {
	opacity: 0.9;
	font-size: 1.7em;
}
.news-slide .title > * {
	font-size: 1.7em;
	font-weight: 600;
	line-height: 1.25em;
	margin: 0.75em auto;
}
.news-slide .text {
	font-size: 1.35em;
	line-height: 1.4em;
}
.news-slide .action {
	margin-top: 2em;
	font-size: 1.1em;
}

.news-slider .slick-dots {
	text-align: right;
	list-style-type: none;
	position: absolute;
	bottom: 1em;
	right: 1em;
}
.slick-dots li {
	display: inline-block;
	padding: 0.25em;
}
.slick-dots li button {
	font-size: 0;
	padding: 0;
	width: 14px;
	height: 14px;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	background-color: rgba(255,255,255,0);
	border: currentColor 1px solid;
	transition: 0.3s;
}
.slick-dots li:hover button {
	background-color: rgba(255,255,255,0.5);
}
.slick-dots li.slick-active button {
	background-color: rgba(255,255,255,1);
}


@media screen and (max-width: 1000px) {
	.footer-sitemap {
		padding-right: 4em;
	}
}
@media screen and (max-width: 750px) {
	.the-footer > .flex > div { flex: 0 0 100%; }
	.footer-sitemap {
		padding-right: 0;
	}
	.footer-news { padding-top: 0; }
}


footer .mentions {
	z-index: 2;
	position: relative;
	border-top: rgba(255,255,255,0.5) 1px solid;
	padding: 2em 0;
}
@media screen and (max-width: 500px) {
	footer .mentions .flex { flex-wrap: wrap; }
	footer .mentions .flex > div {
		flex: 0 0 100%;
	}
	footer .mentions .flex > div:last-child {
		margin-top: 1.5em;
	}
}


/*******************
	HOME
*******************/


.home-intro {
/*	margin-top: -2.25em;
*/}

.home-intro .ill:after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #4fa3d2;
	opacity: 0.6;
}

.home-intro .content {
	padding-top: 10em;
	padding-bottom: 13em;
	color: #fff;
	text-align: left;
}
.home-intro .content > div { padding-right: 2.25em; }
.home-intro .content .pretitle {
	margin-bottom: 3em;
}
.home-intro-btn {
	margin-top: 7em;
}
.home-intro-btn > .btn {
	font-weight: 700;
	font-size: 1.25em;
}

.home-intro h1 {
	max-width: 850px;
}



.home-pres {
	padding: 5.8em 0 5.2em 0;
	background-color: #f8fcfd;
}

.home-pres aside {
	flex: 0 0 30em;
	background-color: #069fd9;
	color: #fff;
	text-align: left;
	padding: 2.5em 3.5em 0 3.5em;
	margin-top: -12.3em;
}
.home-pres aside .pretitle {
	margin-bottom: 2em;
}
.home-pres aside .separator {
	margin-top: 3em;
	margin-bottom: 3em;
}
.home-pres aside .text {
	font-size: 1.14em;
}
.home-pres aside .text p {
	line-height: 1.85em;
}
.home-pres aside .btn {
	margin-top: 5em;
	margin-bottom: -1em;
}

.home-pres aside .btn:hover {
	background-color: #fff;
}

.home-values {
	flex: 1;
	text-align: left;
	padding-left: 4em;
}
.home-value {
	flex: 0 0 50%;
	margin-bottom: 1.5em;
}
.grid .home-value:nth-child(odd) {
	padding-right: 4%;
}
.grid .home-value:nth-child(even) {
	padding-left: 4%;
}
.home-value .picto {
	flex: 0 0 4.5em;
}
.home-value .content {
	padding: 0 0 1em 1.5em;
}
.home-value .content p {
	margin-top: 0.5em;
	font-size: 1.14em;
	line-height: 1.6em;
}

@media screen and (max-width: 1050px) {
	.home-values { font-size: 0.9em; }
	.home-pres aside { flex: 0 0 25em; }
}
@media screen and (max-width: 950px) {
	.home-value .picto { flex: 0 0 3em; }
}
@media screen and (max-width: 850px) {
	.home-value { flex: 0 0 100%; margin-bottom: 2em; }
	.grid .home-value:nth-child(odd) {
		padding-right: 0;
	}
	.grid .home-value:nth-child(even) {
		padding-left: 0;
	}
}
@media screen and (max-width: 750px) {
	.home-pres > .wrapper > .flex { flex-wrap: wrap; }
	.home-pres aside { flex: 0 0 100%; }
	.home-values { margin-top: 4em; flex: 0 0 100%; font-size: 1em; padding-left: 0; }
}

@keyframes blink {
	from { opacity: 0.02; }
	to { opacity: 0.2; }
}


.home-products {
	padding: 7.5em 0;
}
@media screen and (min-width: 1000px) {
	.home-products > .ill {
		z-index: 1;
		position: absolute;
		top: -13vw;
		right: 0;
		margin-right: -25vw;
		width: calc(300px + 40vw);
		height: calc(300px + 40vw);
		background: url(../img/icon-pp.svg) no-repeat center;
		background-size: contain;
		opacity: 0.02;
		animation: blink 5s infinite alternate;
	}
}
.home-products > .wrapper {
	z-index: 2;
}

.home-products .intro {
	text-align: left;
}
.home-products .intro > div:last-child {
	font-size: 1.14em;
	line-height: 1.25em;
}
@media screen and (min-width: 900px) {
	.home-products .intro > div:first-child {
		flex: 0 0 47%;
		border-right: currentColor 3px solid;
		text-align: right;
		padding-right: 2em;
	}
	.home-products .intro > div:first-child > div {
		margin-top: -0.5em;
		margin-bottom: -0.5em;
	}
	.home-products .intro > div:last-child {
		flex: 0 0 53%;
		padding-left: 2em;
	}
}
@media screen and (max-width: 900px) {
	.home-products .intro { display: block; margin-bottom: -4em; }
}

.home-products .grid {
	margin-top: 7em;
	margin-left: -2em;
	margin-right: -2em;
	width:calc(100% + 4em);
}
.home-products .product-card {
	position: relative;
	flex: 0 0 calc(50% - 4em);
	margin: 2em;
}
.product-card {
	background-color: #fff;
	box-shadow: 0px 0px 20px 5px rgba(0,0,0,0.025);
}
.product-card > .ill {
	position: absolute;
	top: 0;
	left: 0;
	width: 40%;
	height: 100%;
}
.product-card .content {
	padding: 2em 2em 2em 45%;
	text-align: left;
}
.product-card span.btn {
	position: absolute;
	bottom: 0;
	left: 0;
	font-size: 0.85em;
}
.product-card .title > * {
	font-size: 1.285em;
	font-weight: 700;
	text-transform: uppercase;
	line-height: 1.15em;
}
.product-card ul {
	z-index: 3;
	position: relative;
	margin: 2em 0 0 1em;
	line-height: 1.5em;
}
.product-card ul li {
	margin-bottom: 0.5em;
}
.product-card ul li a:hover {
	text-decoration: underline;
}

@media screen and (max-width: 1100px) and (min-width: 850px) {
	.product-card > .ill {
		top: 0;
		left: 0;
		width: 100%;
		height: 10em;
	}
	.product-card .content {
		padding: 12em 2em 2em 2em;
	}
	.product-card span.btn {
		bottom: auto;
		top: 10em;
		transform: translateY(-50%);
	}
}
@media screen and (max-width: 850px) {
	.home-products .product-card { flex: 0 0 calc(100% - 4em); }
}
@media screen and (max-width: 550px) {
	.product-card > .ill {
		top: 0;
		left: 0;
		width: 100%;
		height: 10em;
	}
	.product-card .content {
		padding: 12em 2em 2em 2em;
	}
	.product-card span.btn {
		bottom: auto;
		top: 10em;
		transform: translateY(-50%);
	}
}


.home-numbers {
	background-color: #4c5099;
	color: #fff;
	padding-top: 7em;
}

.home-numbers > .ill {
	z-index: 1;
	position: absolute;
	top: -18vw;
	left: 0;
	margin-left: -25vw;
	width: calc(300px + 40vw);
	height: calc(300px + 40vw);
	background: url(../img/icon-pp-white.svg) no-repeat center;
	background-size: contain;
	opacity: 0.02;
	animation: blink 5s infinite alternate;
}

.home-numbers > .wrapper {
	z-index: 2;
}

.home-numbers .grid {
	margin-left: -2em;
	margin-right: -2em;
	width: calc(100% + 4em);
	margin-bottom: 4em;
}

.number {
	flex: 0 0 25%;
	padding: 2em;
}
.number .the-number {
	position: relative;
	font-size: 4.25em;
	font-weight: 600;
	margin-bottom: 0.25em;
}
@media screen and (max-width: 1000px) {
	.number { font-size: 0.85em; }	
}
@media screen and (max-width: 900px) {
	.number .the-number { font-size: 3em; }	
}
@media screen and (max-width: 750px) {
	.number { font-size: 0.75em; }	
}
@media screen and (max-width: 600px) {
	.home-numbers .grid { flex-wrap: wrap; }
	.number { flex: 0 0 50%;}
}
.number .the-number::after {
	content: '+';
	position: absolute;
	top: -0.25em;
	left: 100%;
	font-size: 0.85em;
	font-weight: 600;
}
	.grid .number:nth-child(1) .the-number::after {
		color: #46deb1;
	}
	.grid .number:nth-child(2) .the-number::after {
		color: #ffff6a;
	}
	.grid .number:nth-child(3) .the-number::after {
		color: #1e93c3;
	}
	.grid .number:nth-child(4) .the-number::after {
		color: #b02096;
	}
.number .the-legend {
	display: block;
	font-size: 1.45em;
	font-weight: 500;
	opacity: 0.8;
}

.home-numbers .action {
	z-index: 3;
	position: relative;
	margin-top: 4em;
	margin-bottom: -2em;
}
.home-numbers .action .btn:hover {
	background-color: #fff;
	border-color: #fff;
}



.home-testimonials {
	position: relative;
	overflow: hidden;
	padding: 14.4em 0 12em 0;
}
.home-testimonials > .ill {
	z-index: 1;
	transition: 6s;
}
.home-testimonials.reveal > .ill {
	transform: scale(1.2) rotate(5deg);
}
.home-testimonials .ill:after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #4c5099;
	opacity: 0.26;
}
.home-testimonials .content {
	z-index: 2;
	position: relative;
}
.testi-slider .slick-track {
	display: flex;
}
.testi-slider .testi-box-wrapper {
	display: flex;
	height: inherit;
	padding: 1em;
}
.testi-slider .testi-box {
	height: inherit;
}
.testi-box {
	background-color: #fff;
	padding: 4.5em 3.5em;
	box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.15);
}
.testi-box .testi {
	font-size: 1.7em;
	line-height: 1.5em;
	margin-bottom: 2em;
}
.testi-box .signature {
	display: inline-block;
	position: relative;
	padding-left: 3em;
	text-align: left;
	line-height: 1.5em;
	color: #666666;
	max-width: 17em;
	margin: auto;
}
.testi-box .signature::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 2em;
	height: 4em;
	background: url(../img/icon-quote.png) no-repeat center top;
	background-size: contain;
}
.testi-box .signature p.author {
	font-weight: 700;
	text-transform: uppercase;
	color: #4c5099;
}
.testi-slider .slick-dots {
	text-align: right;
	padding: 2em 0.5em 1em 0.5em;
}
.testi-slider .slick-dots li {
	padding: 0 0.5em;
}
.testi-slider .slick-dots li button {
	border: transparent 4px solid;
	background-color: #fff;
	height: 18px;
	width: 18px;
	background-clip: padding-box;
}
.testi-slider .slick-dots li.slick-active button {
	border-color: #fff;
	background-color: transparent;
}

	@media screen and (max-width: 400px) {
		.testi-slider {
			width: calc(100% + 4em);
			margin-left: -2em;
			margin-right: -2em;
		}
	}


.home-partners {
	padding: 5em 0;
}
.partners-slider .slick-slide img {
	margin: auto;
	max-width: 80%;
}
.partners-slider .slick-track {
	display: flex;
}
.partners-slider .slick-slide {
	display: flex;
	height: inherit;
	padding: 1em;
}
.partners-slider > button {
	background-color: #fff;
	color: #4c5099;
}
.partners-slider > button:hover {
	background-color: #4c5099;
	color: #fff;
}



/*******************
   PAGE ASSURANCES
*******************/

.half-section .ill {
	position: relative;
	flex: 0 0 50%;
}
/*.page-template-page-pp .half-section .ill {
	background: #f8fcfd;
}
.page-template-page-pp .half-section .ill img {
	object-position: top center;
}*/
.half-section .content {
	flex: 0 0 50%;
	text-align: left;
}
.half-section .inner {
	max-width: calc(1200px / 2);
	padding: 8em 2em 0 6em;
}
.half-section .text {
	font-size: 1.4285em;
	margin: 2em 0;
}
.half-section .buttons {
	margin-left: -1em;
	margin-bottom: -1em;
}
.half-section .buttons > div {
	padding: 1em;
}

	@media screen and (max-width: 1100px) {
		.half-section .ill { flex: 1; }
		.half-section .content { flex: 0 0 550px; }
	}
	@media screen and (max-width: 900px) {
		.half-section .ill { flex: 0 0 100%; height: 40vh; }
		.page-template-page-pp .half-section .ill { height: auto; }
		.page-template-page-pp .half-section .ill > .fulldiv { position: relative; }
		.page-template-page-pp .half-section .ill > .fulldiv > img { position: relative; width: 100%; height: auto; }
		.half-section .content { flex: 0 0 100%; }
		.half-section .inner { max-width: 100%; padding: 4em 2em; }
	}


.page-products-details {
	margin: 8em 0;
}
@media screen and (min-width: 1000px) {
	.page-products-details > .ill {
	    z-index: 1;
	    position: absolute;
	    bottom: -30vw;
	    right: 0;
	    margin-right: -25vw;
	    width: calc(300px + 40vw);
	    height: calc(300px + 40vw);
	    background: url(../img/icon-pp.svg) no-repeat center;
	        background-size: auto;
	    background-size: contain;
	    opacity: 0.02;
	    animation: blink 5s infinite alternate;
	}
}
.products-details {
	text-align: left;
}
.products-details .tabs {
	z-index: 2;
	position: relative;
	flex: 0 0 250px;
	font-size: 0.9em;
	text-align: left;
	background-color: #fff;
	box-shadow: 0px 0px 20px 5px rgba(0,0,0,0.025);
}
.products-details .tabs ul {
	list-style-type: none;
	font-size: 1.7em;
	font-weight: 700;
	text-transform: uppercase;
	line-height: 1.25em;
}
.products-details .tabs a {
	position: relative;
	display: block;
	padding: 1.3em 1.15em;
}
.products-details .tabs ul li:first-child a {
	padding-bottom: calc(1.3em + 3px);
}
.products-details .tabs ul li:not(:first-child) a::before {
	content: '';
	position: absolute;
	top: -3px;
	left: 0;
	width: 100%;
	height: 3px;
	background-color: #069fd9;
	opacity: 0.4;
	transition: 0.5s;
}
.products-details .tabs ul li:not(:first-child) a.active::before {
	opacity: 1;
}
.products-details .tabs a.active {
	color: #fff;
	background-color: #069fd9;
}

.products-details .panels {
	z-index: 1;
	position: relative;
	flex: 1;
	background-color: #fff;
	box-shadow: 0px 0px 20px 5px rgba(0,0,0,0.025);
}
.products-details .panel {
	display: none;
	padding: 3em;
	font-size: 1.2857em;
}
.products-details .panel.active {
	display: block;
}
.panel .text h1,
.panel .text h2,
.panel .text h3,
.panel .text h4,
.panel .text h5 {
	color: #b02096;
	font-weight: 700;
}
.panel a {
	text-decoration: underline;
}
.panel ul {
	list-style-type: none;
	margin-left: 0;
}
.panel li {
	position: relative;
	padding-left: 1.5em;
}
.panel ul li:not(:last-child) {
	margin-bottom: 0.35em;
}
.panel li::before {
	content: '';
	position: absolute;
	top: 0.15em;
	left: 0;
	display: block;
	width: 1em;
	height: 1em;
	background: url(../img/icon-circle-check.svg) no-repeat center;
	background-size: contain;
}
.panel li ul {
	margin-top: 0.25em;
}
.panel li li { padding-left: 1em; }
.panel li li:before {
	content: '';
	position: absolute;
	top: 0.55em;
	left: 0;
	display: block;
	width: 0.4em;
	height: 0.4em;
	background: #b02096;
	background-size: contain;
	border-radius: 50%;
}

	@media screen and (max-width: 1100px) {
		.products-details-table {
			width: calc(100% + 4em);
			margin-left: -2em;
			margin-right: -2em;
		}
		.products-details .tabs {
			flex: 0 0 200px;
			font-size: 0.8em;
		}
	}
	@media screen and (max-width: 700px) {
		.products-details .tabs {
			flex: 0 0 150px;
			font-size: 0.6em;
		}
		.products-details .panel {
			padding: 1.5em;
			font-size: 1.1em;
		}
	}
	@media screen and (max-width: 700px) {
		.products-details .tabs {
			flex: 0 0 100%;
		}
		.products-details .panels {
			flex: 0 0 100%;
		}
	}



.page-product-ill-cta {
	margin-bottom: 8em;
}
.ill-cta .content {
	z-index: 3;
	position: relative;
	padding-top: 6em;
	padding-bottom: 6em;
	color: #fff;
}
.ill-cta .content p {
	font-size: 3.9em;
	line-height: 1.15em;
}
.ill-cta .content p:last-child {
	font-size: 2.4em;
	line-height: 1.3em;
}
.ill-cta .action {
	z-index: 3;
	position: relative;
	top: 2em;
	margin-top: -2em;
}
.ill-cta .action .btn:hover {
    background-color: #fff;
    border-color: #fff;
}
.ill-cta .overlay {
	background-color: #4c5099;
	opacity: 0.5;
}

	@media screen and (max-width: 750px) {
		.ill-cta .content p { font-size: 2em; line-height: 1.25em; }
		.ill-cta .action { font-size: 0.8em; font-weight: 600; }
	}
	@media screen and (max-width: 470px) {
		.ill-cta .action { font-size: 0.7em; font-weight: 600; }
	}
	@media screen and (max-width: 470px) {
		.ill-cta .action .btn { margin-left: -2em; margin-right: -2em; width: calc(100% + 4em); padding: 1em; }
	}

.page-avantages {
	text-align: left;
	margin-bottom: 4em;
}
.avantages-layout {
	width: calc(100% + 5em);
	margin-left: -2.5em;
	margin-right: -2.5em;
	text-align: left;
}
.avantage {
	flex: 0 0 33.333%;
	padding: 2.5em;
}
.avantage .icon img {
	width: 4em;
	height: 4em;
	object-position: center;
	object-fit: contain;
}
.avantage .title {
	margin: 1em 0;
	font-size: 1.4285em;
	font-weight: 700;
	text-transform: uppercase;
}
.avantage .text {
	font-size: 1.285em;
	line-height: 1.4em;
}

	@media screen and (max-width: 900px) {
		.avantage { flex: 0 0 50%;  }
	}
	@media screen and (max-width: 600px) {
		.avantage { flex: 0 0 100%;  }
	}



/*******************
   PAGE PP
*******************/

.page-team-section {
	margin-top: 8em;
	text-align: left;
}
@media screen and (min-width: 1000px) {
	.page-team-section > .ill {
	    z-index: 1;
	    position: absolute;
	    bottom: -20vw;
	    right: 0;
	    margin-right: -25vw;
	    width: calc(300px + 40vw);
	    height: calc(300px + 40vw);
	    background: url(../img/icon-pp.svg) no-repeat center;
	        background-size: auto;
	    background-size: contain;
	    opacity: 0.02;
	    animation: blink 5s infinite alternate;
	}
}
.team-layout {
	z-index: 2;
	position: relative;
	text-align: center;
}
.team-layout .member {
	order: 2;
}
.team-layout .member {
	flex: 0 0 33.33%;
}
.team-layout.open .member {
	flex: 0 0 25%;
}
.team-layout.open .member.active {
	order: 1;
	flex: 0 0 100%;
}

	@media screen and (max-width: 900px) {
		.team-layout.open .member { flex: 0 0 33.33%; }
	}
	@media screen and (max-width: 700px) {
		.team-layout .member { flex: 0 0 50%; }
		.team-layout.open .member { flex: 0 0 50%; }
	}
	@media screen and (max-width: 500px) {
		.team-layout .member { flex: 0 0 100%; }
		.team-layout.open .member { flex: 0 0 100%; }
	}


.member .thumb {
	flex: 0 0 100%;
	padding: 2em 1em;
	cursor: pointer;
}
.member.active .thumb {
	flex: 0 0 33.33%;
}
.member .thumb .ill {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 100%;
	overflow: hidden;
	border-radius: 50%;
}
.member .thumb .ill img { object-position: top center; transition: 0.3s; }
.member:not(.active):hover .thumb .ill img {
	transform: scale(1.1);
}
.member .thumb .content {
	padding: 2em 0 1em 0;
}
.member.active .thumb .content { display: none; }
.member .name {
	font-size: 1.4285em;
	font-weight: 700;
	text-transform: uppercase;
	line-height: 1.25em;
	margin-bottom: 0.25em;
}
.member .position {
	font-weight: 500;
	line-height: 1.4em;
}
.member:not(.active) > .content {
	display: none;
}
.member.active .content {
	flex: 1;
}

.member > .content {
	position: relative;
	padding: 4em;
	text-align: left;
}
.member .close {
	position: absolute;
	display: block;
	top: 4em;
	right: 4em;
	width: 2em;
	height: 2em;
}
.member .close::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 2px;
	transform: translate(-50%, -50%) rotate(45deg);
	background-color: currentColor;
}
.member .close::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 2px;
	transform: translate(-50%, -50%) rotate(-45deg);
	background-color: currentColor;
}
.member > .content .position {
	margin-bottom: 1em;
}
.member .contacts a {
	display: inline-block;
	padding: 0.25em 1em 0.25em 0;
}
.member .contacts img {
	height: 1em;
}
.member .text {
	margin-top: 2em;
}


	@media screen and (max-width: 900px) {
		.member.active .thumb { flex: 0 0 25%; }
		.member.active .thumb .content { display: none; }
	}
	@media screen and (max-width: 700px) {
		.member > .content { padding: 2em; }
	}
	@media screen and (max-width: 550px) {
		.member:not(.active) .thumb .ill { width: 200px; padding-bottom: 200px; left: 50%; margin-left: -100px; }
		.member.active > .thumb { flex: 0 0 100%; max-width: 40%; }
		.member.active > .content { flex: 0 0 100%; }
	}




.page-pp-services {
	margin-top: -6em;
}
.services-layout {
	padding: 0 1.5em;
}
.services-layout .service {
	flex: 0 0 25%;
	padding: 1.5em;
}
.service .inner {
	height: 100%;
	background-color: #fff;
	box-shadow: 0px 0px 20px 5px rgba(0,0,0,0.025);
}
.service .ill {
	position: relative;
	flex: 0 0 10vw;
}
.service .content {
	padding: 3em 3em 2em 3em;
}
.service .content .title > * {
	font-size: 1.14em;
	text-transform: uppercase;
}
.service .text {
	margin-top: 2em;
	text-align: left;
	line-height: 1.5em;
	font-size: 1.14em;
}
.service .text p, .service .text ul {
	line-height: 1.75em;
}
.service .content .text img.alignright {
	float: right;
}

	@media screen and (max-width: 1300px) {
		.services-layout .service { flex: 0 0 50%; }
		.service .ill { flex: 0 0 15vw; }
	}
	@media screen and (max-width: 700px) {
		.services-layout .service { flex: 0 0 100%; }
		.service .ill { flex: 0 0 25vw; }
	}

.page-pp-values {
	margin: 8em 0;
}
.values-layout {
	position: relative;
	background-color: #f8fcfd;
}
.values-layout .ill {
	position: absolute;
	top: 0;
	right: 0;
	width: 40%;
	height: 100%;
}
.values-layout .flex > div {
	flex: 0 0 50%;
}
.values-layout .content {
	padding: 8em 4em 8em 0;
	text-align: left;
}
.values-layout .text {
	font-size: 1.15em;
}
.values-layout .text p {
	line-height: 1.75em;
}
.values-layout .tabs {
	position: relative;
}
@media screen and (min-width: 900px) {
	.values-layout .tabs > div {
		position: absolute;
		top: 0;
		left: 0;
		padding: 8em 0 8em 4em;
	}
}
.values-layout .tabs ul {
	list-style-type: none;
	background-color: #fff;
	box-shadow: 0px 0px 20px 5px rgba(0,0,0,0.025);
	text-align: left;
	max-width: 400px;
}
.values-layout .tabs li {
	padding: 1.5em 1.5em 1.5em 3em;
	border-left: #fff 4px solid;
	cursor: pointer;
	transition: 0.3s;
}
.values-layout .tabs li.active {
	background-color: #f8fcfd;
	border-left-color: #4c5099;
}
.values-layout .tabs li:not(:last-child) {
	border-bottom: #f8fcfd 1px solid;
}
.values-layout .tabs li span {
	display: block;
	font-size: 1.285em;
	text-transform: uppercase;
	font-weight: 700;
	line-height: 1.25em;
	letter-spacing: 2px;
}
.values-layout .tabs li p {
	margin-top: 1em;
	font-size: 1em;
	line-height: 1.75em;
	opacity: 1;
	transition: font-size 0.3s, opacity 0.3s 0.3s;
}
.values-layout .tabs li:not(.active) p {
	font-size: 0;
	opacity: 0;
	transition: font-size 0.3s 0.1s, opacity 0.1s;
}
	@media screen and (max-width: 900px) {
		.values-layout { padding-top: 10vh; }
		.values-layout .ill { left: 0; width: 100%; height: 40vh; }
		.values-layout .flex > div { flex: 0 0 100%; }
		.values-layout .tabs { order: 1; padding: 2em; }
		.values-layout .content { order: 2; padding: 2em; }
	}
	@media screen and (max-width: 550px) {
		.values-layout .tabs { padding: 2em 0; }
		.values-layout .content { padding: 2em 0; }
	}

/*******************
 	FAQ
*******************/

.page-product-faq {
	margin-bottom: 8em;
	text-align: left;
}
.page-product-faq .faq-line {
	font-size: 1.15em;
}

.faq-layout {
	text-align: left;
}
@media screen and (max-width: 700px) {
	.faq-layout { margin: 0 -2em; width: calc(100% + 4em); }
}
.faq-line {
	border-bottom: rgba(0,0,0,0.05) 1px solid;
}
.faq-layout .faq-line:first-child {
	border-top: rgba(0,0,0,0.05) 1px solid;
}
.faq-line .the-question {
	position: relative;
	font-size: 1.1em;
	padding: 1.2em 1em 1em 6em;
	line-height: 1.33em;
	cursor: pointer;
}
	.faq-line .the-question::before {
		content: '';
		z-index: 1;
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: 4em;
		background-color: #f9f9f9;
		opacity: 1;
		border-right: #f9f9f9 1px solid;
		transition: 0.3s;
	}
		.faq-line.closed .the-question::before {
			opacity: 0.2;
			border-right: #ccc 1px solid;
		}
	.faq-line .the-question::after {
		content: '';
		z-index: 2;
		position: absolute;
		top: 50%;
		left: 1em;
		width: 2em;
		height: 1.15em;
		margin-top: -0.55em;
		background: url(../img/icon-faq.svg) no-repeat center;
		background-size: contain;
		transform: rotate(0deg);
		opacity: 1;
		transition: 0.3s;
	}
		.faq-line.closed .the-question::after {
			transform: rotate(180deg);
			opacity: 0.2;
		}
.faq-line .the-question h3 {
	font-weight: 500;
}
.faq-line .the-answer {
	font-size: 0.9em;
	background: #f9f9f9;
	padding: 2em 3em;
	color: #666;
	line-height: 1.6em;
	transition: 0.3s;
}
.faq-line .the-answer a {
	text-decoration: underline;
}
.faq-line .the-answer p { margin-bottom: 0.5em; }
	.faq-line.closed .the-answer {
		padding: 0 3em;
		max-height: 0;
		overflow: hidden;
	}


/*******************
 	POPUP
*******************/

.popup {
	z-index: -1;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	visibility: hidden;
	opacity: 0;
}
.popup .overlay {
	z-index: 1;
	background: rgba(0,0,0,0);
	transition: 0.3s;
}
.popup > .content {
	z-index: 2;
	top: 50%;
	left: 10%;
	width: 80%;
	height: 80%;
	overflow: auto;
	background: #fff;
	box-shadow: 0px 0px 20px 5px rgba(0,0,0,0.025);
	opacity: 0;
	transition: 0.6s;
}

	.popup.active { z-index: 1001; visibility: visible; opacity: 1; }
	.popup.active .overlay { background: rgba(0,0,0,0.6); }
	.popup.active > .content { top: 10%; opacity: 1; }

.popup > .content .title {
	background: #4c5099;
	color: #fff;
	padding: 2em;
	transition: 0.3s;
}
.popup#devis.send > .content .title { background-color: #069fd9; }
.popup > .content .wrapper {
	padding: 2em;
	text-align: left;
}

.popup .close-button {
	z-index: 3;
	position: fixed;
	top: calc(10% + 2em);
	right: calc(10% + 2em);
	opacity: 0;
}
	.popup.active .close-button {
		opacity: 1;
		transition: 0.5s 0.5s;
	}
.popup .cross {
	position: relative;
	display: block;
	width: 3em;
	height: 3em;
	background: #4c5099;
	color: #fff;
	border-radius: 50%;
	transition: 0.5s;
}
.popup .cross::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 60%;
	height: 2px;
	background-color: currentColor;
	transform: translate(-50%, -50%) rotate(45deg);
}
.popup .cross::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 60%;
	height: 2px;
	background-color: currentColor;
	transform: translate(-50%, -50%) rotate(-45deg);
}
.popup .cross:hover {
	transform: rotate(180deg);
}


/*******************
 	CONTACT FORM
*******************/

.contact-form {
/*	font-size: 0.9em;
*/}
.contact-form input:not([type="submit"]), .contact-form textarea {
	font-family: 'Poppins', sans-serif;
	font-size: 1em;
	line-height: 1.4em;
	border: none;
	border-bottom: currentColor 1px solid;
	display: block;
	width: 100%;
	padding: 0.5em 0 1.5em 0;
	margin-top: 1.75em;
	margin-bottom: 0.25em;
}
.contact-form textarea {
	height: 8.8em;
	background-color: #fafafa;
	padding: 0.5em 1em;
}

.contact-form input[type="submit"] {
	font-family: 'Poppins', sans-serif;
	font-size: 1.1em;
	transition: 0.3s;
	background-color: #4c5099;
	border: #4c5099 1px solid;
	color: #fff;
	margin-top: 1.75em;
}
.contact-form input[type="submit"]:hover {
	background-color: transparent;
	color: #4c5099;
}



/*******************
 	News
*******************/


.blog-grid {
}
.blog-grid.flex__2cols.more-gap > div {
	padding-bottom: 5em;
}
.blog-box {
	position: relative;
	height: 100%;
	background-color: #fff;
}
.blog-box .ill {
	position: relative;
	flex: 0 0 0;
	padding-bottom: 50%;
	overflow-y: hidden;
}
	.blog-box .ill.video {
		padding-bottom: 55%;
	}
.blog-box .content {
	flex: 1 0 auto;
	text-align: left;
	padding: 2.33em;
}
.blog-box .meta {
	font-size: 0.95em;
	line-height: 1.25em;
	color: #838383;
	margin-bottom: 1em;
}
.blog-box h2 {
	margin-bottom: 0.75em;
}
.blog-box .excerpt {
	color: #838383;
	line-height: 1.4em;
	font-size: 1.05em;
}
.blog-box .action {
	flex: 0 0 4em;
	text-align: left;
	padding: 1em 2.33em 2.33em 2.33em;
}
.blog-box .action a {
	font-size: 0.9em;
	text-transform: uppercase;
}


.blog-post {
	text-align: left;
}
.blog-post--header {
	max-width: 1200px;
	margin: auto;
	padding: 0 2em;
}
.blog-post h1 {
	font-size: 2em;
	font-weight: 700;
	line-height: 1.25em;
	margin-bottom: 1.5em;
}
.blog-post .meta {
	font-size: 1.2em;
}
.blog-post .meta a {
	color: currentColor;
}
.blog-post .meta a:hover {
	color: #1e8cbe;
}
.blog-post--ill {
	position: relative;
	height: 0;
	padding-bottom: 40%;
	overflow: hidden;
	margin-bottom: 3em;
}
.blog-post--ill.video {
	padding-bottom: 56.25%;
}
.blog-post--content {
	max-width: 850px;
	padding: 0 2em;
	margin: auto;
}



/*******************
 	Agences & Map
*******************/

.page-agences-list > .wrapper,
.page-agences-map > .wrapper {
	padding: 0;
}
.page-agences-list {
	text-align: left;
}
.agences-title, .agences-contact {
	flex: 0 0 100%;
}
.agence-title {
	flex: 0 0 25%;
	background-color: #069fd9;
	color: #fff;
	padding: 7em 2em 2em 2em;
	box-shadow: -5px -5px 30px 10px rgba(0,0,0,0.1);
}
.agence-title h4,
.agence-contact .titles h4 {
	font-size: 1.33em;
	font-weight: 600;
	margin-bottom: 0.66em;
	line-height: 1.15em;
}
.agence-title p,
.agence-contact .titles p {
	font-size: 1.125em;
	text-transform: uppercase;
	line-height: 1.55em;
}
.agence-contact {
	flex: 0 0 25%;
	background-color: #fff;
	padding: 2.2em 2em 3em 2em;
	box-shadow: -5px 5px 30px 10px rgba(0,0,0,0.1);
}
.agence-contact .titles { margin-bottom: 1em; }
.agence-contact p {
	font-size: 1.075em;
	line-height: 1.6em;
	font-weight: 500;
}
.agence-contact a {
	color: #069fd9;
}

	@media screen and (max-width: 1250px) {
		.agence-contact a {
		  /* These are technically the same, but use both */
		  overflow-wrap: break-word;
		  word-wrap: break-word;

		  -ms-word-break: break-all;
		  /* This is the dangerous one in WebKit, as it breaks things wherever */
		  word-break: break-all;
		  /* Instead use this non-standard one: */
		  word-break: break-word;

		  /* Adds a hyphen where the word breaks, if supported (No Blink) */
		  -ms-hyphens: auto;
		  -moz-hyphens: auto;
		  -webkit-hyphens: auto;
		  hyphens: auto; }
		}

	@media screen and (max-width: 850px) {
		.agences-title { flex: 0 0 40%; }
		.agences-contact { flex: 0 0 60%; }
		.agence-title, .agence-contact { flex: 0 0 100%; height: 200px; padding: 3em 2em 2em 2em; }
	}
	@media screen and (min-width: 500px) {
		.agences-contact .titles { display: none; }
	}
	@media screen and (max-width: 500px) {
		.agences-title { display: none; }
		.agences-contact { flex: 0 0 100%; }
		.agence-contact { padding: 2em; height: auto; }
	}

.map {
	height: 600px;
	box-shadow: 0 30px 30px 10px rgba(0,0,0,0.1);
}
.marker {
  background-image: url('../img/map-marker.svg');
  background-size: 70% auto;
  background-position: center;
  background-repeat: no-repeat;
  width: 50px;
  height: 50px;
  background-color: #fff;
  border-radius: 50%;
  cursor: pointer;
}
.mapboxgl-popup {
  max-width: 200px;
}
.mapboxgl-popup-content {
  text-align: center;
  font-family: 'Poppins', sans-serif;
  line-height: 1.4em;
  font-size: 14px;
}
.mapboxgl-popup-content h3 {
	font-size: 1.2em;
	font-weight: 600;
	margin-bottom: 0.5em;
}



@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */
	picture.cover { overflow: hidden; }
	picture.cover > img {
		position: absolute;
		top: 50%;
		left: 50%;
		width: auto;
		min-width: 100%;
		height: auto;
		min-height: 100%;
		transform: translate(-50%, -50%);
	}
	.product-card picture.cover > img { min-width: 200%; }
	header .logo img { width: 30em; }
	header .ctas,
	header .cta { flex: 1 1 0px; }
	.home-value { flex: 0 0 45%; }
	.home-products .product-card { flex: 0 0 40%; }
	footer .agences .agence { flex: 0 0 22%; }
}