@charset "utf-8";

/* alexandre.cc */

a, article, aside, b, blockquote, body, button, div, em, footer, h1, h2, h3, h4, header, img, input, li, nav, p, section, span, strong, textarea, ul{
	padding:0;
	margin:0;
	border:0;
	list-style:none;
	outline:none;
	font-family: 'Cabin', sans-serif;
	font-size:1.4rem;
	color:#221e51;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background:none;
}

html, body{
	display: flex;
	flex-direction: column;
	width:100%;
	min-height:100%;
	font-size:62.5%;
}
body{
	font-weight:300;
	color:#221e51;
}
body#page{ background:url('../img/background-2023.jpg') no-repeat top center #fff;}
body.actualites,
body.article{ background-image: url('../img/background-actualites.jpg') !important;}

a{ text-decoration:none; color:#221e51;}
a:hover{ text-decoration:none; color:#221e51;}

::selection{ background:#ffed00; color:#221e51;}
::-moz-selection{ background:#ffed00; color:#221e51;}

input{ -webkit-appearance:none;}


/* HEADER f8ff2d */

header{
	z-index:9;
	position:fixed;
	width:100%;
}
header.blanc{ background:rgba(255,255,255, 0.95);}
#slide header:hover{ background:rgba(255,255,255, 0.75);}
header nav{
	float:left;
	width:100%;
	padding: 0 20px 0 200px;
	text-align:center;
	display: flex;
}
#home header nav{ padding:0 5%;}
header nav a{
	flex: 1;
	text-align:left;
	padding: 40px 0;
	text-transform:uppercase;
	vertical-align:top;
}
#home header nav a{ padding:40px 0;}
header nav a p{
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 15px 10px;
}
header nav a span{
	padding:0 0 5px;
	font-size: 1rem;
	font-weight:700;
	text-align:left;
	opacity:0.67;
}
header nav a b{
	font-size:1.5rem;
	font-weight:700;
	letter-spacing:-0.05rem;
}
header nav a:hover p, header nav a.actif p{ background:#FFF682;}

.new-header header nav a.actif p {
	padding-left: 2rem;
	background: #fff;
	border-left: 10px solid #FFF682;
}
#contact  header nav a.actif p {
border-left: 10px solid rgba(0,0,0, 0.1);
}

header #logo{
	position:absolute;
	left:0;
	top:0;
}
#home header #logo{ display:none; width:0;}
header #logo a{
	float:left;
	width: 180px;
	height: 145px;
	display: flex;
}
header #logo a span{ display:none;}
header #logo a img{ width: 95%; margin: auto;}


/* SCROLL */

header.blanc #logo a{
	height: 66px;
	padding: 8px 40px;
}
header.blanc #logo a img{
	width: auto;
	height: 50px;
}
header.blanc nav a{
	padding: 0;
	height: 66px;
}


/* OUVRIR - FERMER */

#ouvrir, #fermer{
	display:none;
	z-index:100;
	top:0;
	position:fixed;
	width:60px;
	height:60px;
	text-align:center;
	cursor:pointer;
	background:#fff;
}
#ouvrir div, #fermer div{ width:100%;}
#ouvrir ul, #fermer ul{
	display:inline-block;
	width:26px;
	margin:20px 18px 0 17px;
}
#ouvrir:hover ul{ margin-top:14px;}
#ouvrir ul li, #fermer ul li{
	float:left;
	width:100%;
	height:2px;
	margin:0 0 5px 0;
	background:#221e51;
	overflow:hidden;
}
#ouvrir:hover  ul li.un{ margin:-6px 0 10px 0;}
#ouvrir ul li.quatre{ margin:6px 0 0 0; background:#221e51;}
#ouvrir:hover ul li.quatre{ margin:0 0 0 0;}
#ouvrir:hover  ul li.un, #ouvrir ul li.quatre{opacity:0; -moz-opacity:0; -webkit-opacity:0; filter: alpha(opacity=0);}
#ouvrir:hover ul li.quatre{ opacity:1; -moz-opacity:1; -webkit-opacity:1; filter: alpha(opacity=100);}

#fermer ul li.une{
	margin-top:6px;
	 -ms-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
#fermer ul li.deux{
	margin-top:-6px;
	 -ms-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

#ouvrir div div, #fermer div div{
	display:inline-block;
	width:auto;
}
#ouvrir div div span, #fermer div div span{
	position:absolute;
	margin:-28px 0 0 0;
	font-size:1.6rem;
	font-weight:600;
	color:#fff;
	text-transform:uppercase;
}
#fermer div div span{ margin-top:-14px;}
#ouvrir:hover div div span{ margin-top:-18px;}

#fermer{ display:none;}


header #langues{
	display: flex;
	flex-direction: column;
	position: fixed;
	width: auto;
	top: 0;
	right: 0;
}
header #langues a{
	display: flex;
	justify-content: center;
	width: 73px;
	height: 73px;
	line-height: 73px;
	font-weight: 700;
	color: #27205F;
	background:#f7f7f7;
	cursor: pointer;
}
.new-header header #langues a{ background: #fff;}
header #langues a:hover{
	color: #27205F;
	background: #FEED04;
}
.new-header  header #langues a:hover{ background: #FFF682;}
header #langues a.active{
	color: #fff;
	background: #27205F;
}



/* FOOTER */

footer{
	position:relative;
	float:left;
	width:100%;
	padding:100px 0 0;
	background:#f7f7f7;
}
footer #reseaux{
	float:left;
	width:100%;
	text-align:center;
}
footer #reseaux a{
	display:inline-block;
	margin:0 10px;
	border-radius:30px;
	border:2px solid #221e51;
}
footer #reseaux a:hover{ background:#FFF682; border-color:#FFF682;}
footer #reseaux a img{ float:left; width: 50px;}

footer #adresses, footer #copyright{
	float:left;
	width:100%;
	padding:40px 0;
	text-align:center;
}
footer #adresses, footer #adresses a, footer #copyright, footer #copyright a{
	font-size:1.6rem;
	line-height:2.6rem;
	font-family:'Vollkorn', serif;
}
footer #adresses a{ border-bottom:4px solid #FFF682;}
footer #adresses a:hover{ background:#FFF682;}
footer #copyright a{ border-bottom:1px solid #221e51;}
footer #copyright a:hover, footer #copyright a.actif{ background:#FFF682; border-bottom:1px solid #FFF682;}

footer #top{
	float:left;
	width:100%;
	text-align:center;
}
footer #top img{
	width: 50px;
	border-radius:30px;
	border: 2px solid #221e51;
}
footer #top:hover img{ background:#FFF682; border-color:#FFF682;}





/* ACCUEIL */

body#home{
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	-webkit-background-size:cover;
	background-color: #e9edf6;
	background-image:url('../img/background-home.webp');
}
#introduction{
	position:absolute;
	top:50%;
	margin:-140px 0 0;
	width:100%;
	text-align:center;
}
#introduction img{
	display:inline-block;
	width: 280px;
}
#introduction h1{
	display:inline-block;
	width:100%;
	margin:30px 0 0;
	font-weight:700;
	font-size:6.4rem;
	line-height:6.8rem;
	letter-spacing:-0.01rem;
	color:#fff;
	text-shadow: 3px 3px 33px rgba(0,0,0, 0.33);
}
a#decouvrez{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	padding:40px 0;
	color:#fff;
	font-weight: 700;
	font-size: 1.6rem;
	line-height:2rem;
	text-align:center;
	text-transform:uppercase;
}
a#decouvrez:hover{ color: #FFF682; line-height:3rem;}

/* CONTENT */

section#content{
	width:100%;
	max-width: 1600px;
	min-height: 100vh;
	margin: 0 auto;
	padding:260px 0 80px;
}
section#content #droite, section#content #gauche{
	float: right;
	width: 45%;
}
section#content #gauche{
	float: left;
}
#slide section#content #gauche{
	width: 45vw;
	max-width: 740px;
}
.lequipethm{ width: 60% !important;}
.seniorsadvisors{ width: 35% !important;}

section#content #large{ width:100%;}
section#content article h1{
	float:left;
	width:100%;
	padding:0 0 20px;
	font-size:5.2rem;
	line-height:5.8rem;
}
.article section#content article h1{ max-width: 1020px; margin-left: auto; margin-right: auto;}
section#content article h1.center{ text-align: center;}
section#content article #resume, section#content article #resume p, section#content article #texte, section#content article #texte p, section#content article #texte li, section#content article #texte h2{
	float:left;
	width:100%;
	font-size:2.2rem;
	line-height: 3.2rem;
	font-family:'Vollkorn', serif;
}
section#content article #resume,
section#content article #resume p{ padding:0 0 20px;}

.new-header section#content article #resume{
	margin-bottom: 10vw;
	max-width: 1220px;
	margin-left: auto;
	margin-right: auto;
}
.article section#content article #resume{ max-width: 1020px;}
section#content article.center #resume{
	text-align: center;
}

section#content article #texte, section#content article #texte p, section#content article #texte li, section#content article #texte h2, section#content article #texte a, section#content article #texte span, section#content article #texte em, section#content article #texte u, section#content article #texte strong{
	font-size:1.8rem;
	line-height:2.8rem;
}
section#content article #texte p{ padding-bottom:15px;}
section#content article #texte p b, section#content article #texte p strong, section#content article #texte a, section#content article #texte span, section#content article #texte em, section#content article #texte u{ font-size:1.8rem; font-weight:400; line-height:0rem; font-family:'Vollkorn', serif; border-bottom:4px solid #FFF682;}
section#content article #texte a{  height: auto; text-decoration: none;}
section#content article #texte a:hover{ background:#FFF682; border-bottom-color:#FFF682;}


/* A PROPOS */

section#content article.center ul{
	float: left;
	display: flex;
	width: 100%;
	justify-content: center;
}
section#content article.center ul li{
	display: flex;
	margin: 10px 20px;
}
section#content article.center ul li a{
	height: 4.2rem;
	padding: 0 2rem;
	font-size: 1.8rem;
	line-height: 4.2rem;
	color: #FEED04;
	font-weight: 700;
	text-transform: uppercase;
	background: #27205F;
	border-radius: 4px;
	cursor: pointer;
}

section#content article.center #video{
	display: flex;
	width: 100%;
	max-width: 1120px;
	margin: 0 auto 80px;
}
section#content article.center #video .couverture{
	position: absolute;
	display: flex;
	width: 80%;
	height: 100%;
	max-width: 1120px;
	max-height: 630px;
	z-index: 2;
	background-size: cover;
}
section#content article.center #video .couverture button{
	display: flex;
	margin: auto;
	width: 200px;
	height: 200px;
	background: no-repeat center url('../img/play.png');
	background-color: rgba(255, 255, 255, 0.33);
	border-radius: 100px;
}
section#content article.center #video:hover .couverture button{
	background-color: rgba(255, 255, 255, 0.67);
}

section#content article.center video,
section#content article.center #video iframe{
	display: flex;
	z-index: 1;
	width: 100%;
}
section#content article.center video{
	max-width: 1020px;
	margin: 0 auto;
}

section#content article.center h2{
	text-align: center;
	font-size: 2.6rem;
	line-height: 3.2rem;
	font-weight: 400;
	font-family:'Vollkorn', serif;
}

section#content article.center .segments{
	display: flex;
	justify-content: center;
	flex-direction: column;
}
section#content article.center .segments ol{
	display: flex;
	justify-content: center;
	margin: 3rem 0 0;
}
section#content article.center .segments ol li{
	margin: 0 1rem;

	background: #FEED04;
	border-radius: 0.6rem;
	box-shadow: 0 0 12px rgba(0,0,0, 0.2);
}
section#content article.center .segments ol li a{
	display: flex;
	height: 4.2rem;
	padding: 0 2rem;
	font-size: 1.5rem;
	line-height: 4.2rem;
	color: #27205F;
	font-weight: 700;
	text-transform: uppercase;
}
section#content article.center .segments ol li:nth-child(2) a,
section#content article.center .segments ol li:nth-child(3) a{
	color: #fff;
}
section#content article.center .segments ol li:nth-child(2){
	background: #3B83C7;
}
section#content article.center .segments ol li:nth-child(3){
	background: #27205F;
}
section#content article.center .segments ol li:nth-child(4){
	color: #27205F;
	background: #fff;
}
section#content article.center .segments img{
	margin: 0 auto;
}

section#content article.center .valeurs{
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
}
section#content article.center .valeurs ul{
	flex-grow: 0;
	display: flex;
	width: auto;
	min-width: 420px;
	flex-direction: column;
	margin: 0 3rem;
	box-shadow: 0 0 32px rgba(0,0,0, 0.15);
}
section#content article.center .valeurs ul li{
	margin: 0;
	padding: 2rem 3.6rem;
	line-height: 2.4rem;
	font-weight: 400;
	justify-content: center;
	font-size: 1.8rem;
	font-family:'Vollkorn', serif;
	border-bottom: 1px solid rgba(0,0,0, 0.1);
}
section#content article.center .valeurs ul li:first-child{
	color: #fff;
	font-weight: 700;
	font-size: 1.8rem;
	font-family: 'Cabin', sans-serif;
	text-transform: uppercase;
	background: #27205F;
}
section#content article.center .valeurs ul:last-of-type li:first-child{
	color: #27205F;
	background: #FEED04;
}



/* SURLIGNÉ */
section#content article #texte p{

}
body.article section#content article #texte p{
	display: block;
	flex-direction: row;
	flex-wrap: wrap;
}
section#content article #texte p strong{
	position: relative;
	z-index: 1;
	width: auto;
	margin: 0 auto 0 0;
	flex-grow: 0;
	flex-shrink: 1;
	display: inline-flex;
	flex-direction: column;
	padding: 0 3px;
	border: none;
}
section#content article #texte p strong::after{
	position: absolute;
	z-index: -2;
	content: " ";
	margin: 3px 0 0;
	width: 100%;
	height: 9px;
	background: #FFF682;
	opacity: 0.5;
}

section#content article#large #texte h2{
	text-transform:uppercase;
	font-weight: 700;
	font-size:2.1rem;
	padding:20px 0 30px 0;
}
section#content article#large #texte p{
	line-height:2.8rem;
	text-align: justify;
}
section#content article#large #texte a.lien{
	float:left;
	width:100%;
	padding:20px 0;
	background:none;
	border:none;
}
section#content article#large #texte a.lien span{
	display:inline-block;
	height:40px;
	line-height:40px;
	padding:0 20px;
	font-size:1.4rem;
	font-weight: 700;
	font-family: 'Cabin', sans-serif;
	color:#fff;
	background:#221e51;
	text-transform:uppercase;
	border:none;
	border-radius:5px;
}
section#content article#large #texte a.lien:hover span{ color:#221e51; background:#f0f0f0;}

section#content article#large #texte a.revenir{ margin-top: 20px;}
section#content article#large #texte a.revenir span{
	height: auto;
	line-height: normal;
	padding: 15px 30px;
	color: #221e51;
	background: #fff;
	border: 2px solid #221e51;
}
section#content article#large #texte a.revenir:hover span{
background: #ffed00;
color: #221e51;
	border: 2px solid #ffed00;
}

section#content article #texte ul{
	float:left;
	width:100%;
	padding:10px 0 25px;
}
section#content article #texte ul h2{ font-weight:700;}
section#content article #texte ul li{
	float:left;
	width:90%;
	margin:0 0 0 20px;
	list-style:disc;
}

section#content article #texte .graphique{
	width: 100%;
	max-width: 500px;
	height: auto;
}

section#content #photo{
	float:left;
	width:100%;
	padding:60px 0 0;
}
section#content #photo iframe{
	float:left;
	width: 44vw;
	height: 24.75vw;
	max-width: 720px;
	max-height: 405px;
}
section#content #photo img{
	float:left;
	width:100%;
}
section#content #references{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width:100%;
	padding:40px 10%;
	background:#f7f7f7;
}
section#content #references h2{
	flex-shrink: 0;
	float:left;
	width:100%;
	padding:0 0 30px;
	text-align:center;
	text-transform:uppercase;
	font-size:1.8rem;
	letter-spacing:0.4rem;
}
section#content #references p{
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	width: 48%;
}
section#content #references p strong{
	width: 100%;
	margin-bottom: 10px;
	font-weight: 700;
	text-transform: uppercase;
}
section#content #references p a{
	width: 100%;
	padding:2px 0;
}
section#content #references p a, section#content #references p a span{ font-size:1.6rem; font-family:'Vollkorn', serif; border-bottom:4px solid #f7f7f7;}
section#content #references p a:hover span{
	margin-left:10px;
	border-bottom-color:#d0ecf5;
}

/* SLIDER */

aside#slider{
	position:absolute;
	right:0;
	top:0;
	width:50vw;
	height: 100vh;
	background:#f7f7f7;
}
aside#slider .slides-control{ width: 100% !important;}
aside#slider .slides{
	width:100% !important;
}
aside#slider div.photo{
	position:absolute;
	top:0;
	width:100%;
	height:100%;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	-webkit-background-size:cover;
}
aside#slider div.informations{
	display:none;
	position:absolute;
	bottom:40px;
	width:100%;
	min-height: 560px;
	margin:0;
	padding: 20px 5%;
	background:#fff;
	text-align:center;
}
aside#slider div.informations img{
	display:inline-block;
	z-index:8 !important;
	position:relative !important;
	top:auto !important;
	left:auto !important;
	width:auto !important;
	height:auto !important;
	max-width:40% !important;
}
aside#slider div.informations b, aside#slider div.informations em, aside#slider div.informations p{
	float:left;
	width:100%;
	color:#000;
}
aside#slider div.informations b{
	padding:25px 0 7px;
	font-size:1.5rem;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:0.1rem;
}
aside#slider div.informations em, aside#slider div.informations p{
	padding:0 0 15px;
	line-height:1.6rem;
	font-style:normal;
	font-family:'Vollkorn', serif;
	text-align:center;
}
aside#slider div.informations p{
	font-size:1.5rem;
	line-height:1.8rem;
	padding:0;
}
aside#slider .plus, aside#slider .moins{
	position:absolute;
	right:0;
	width:50px;
	height:50px;
	line-height:48px;
	text-align:center;
	font-size:2.4rem;
	font-weight:700;
	background:#f7f7f7;
	cursor:pointer;
}
aside#slider .plus{ background:#f0f0f0;}
aside#slider .plus{ bottom:40px;}
aside#slider .moins{ top:0; width:40px; height:40px; line-height:38px; color:#fff; background:#ea5555;}
aside#slider .slides:hover .plus{ background:#a6ea55;}
aside#slider .nom{
	position:absolute;
	right:50px;
	bottom:40px;
	width:auto;
	min-width: 180px;
	height:50px;
	padding:0 20px;
	line-height:50px;
	font-size: 1.6rem;
	font-weight:700;
	background:#fff;
}

.slides-pagination, .slides-navigation{
	z-index:8;
	position:absolute;
	bottom:0;
	right:0;
	width:120px;
	padding:5px 20px;
	text-align:right;
}
.slides-pagination{
	z-index:9;
	padding:10px 0 10px 0;
	width:40%;
	margin:0 30% 0 0;
	text-align:center;
}
aside#slider .slides-navigation{ width:100%;}
.slides-pagination a, .slides-navigation a{
	display:inline-block;
	width:10px;
	height:10px;
	margin:5px 4px;
	color:#fff;
	font-size:0;
	border-radius:15px;
	background:#fff;
	opacity:0.5;
	cursor:pointer;
}
.slides-pagination a:hover, .slides-pagination a.current{ opacity:1;}
.slides-navigation a{
	height:30px;
	width:30px;
	margin:0 4px;
	line-height:28px;
	color:#000;
	font-size:1.8rem;
	text-align:center;
	background:#ffed00;
	opacity:1;
}
aside#slider .slides-navigation a.prev{
	position:absolute;
	right:70px;
}
.slides-navigation a:hover{ background:#fff;}
aside#slider #nosreferences{
	z-index:7;
	position:absolute;
	bottom:0;
	width:100%;
	height:40px;
	padding:0 55% 0 20px;
	line-height:40px;
	text-align:left;
	background:#221e51;
}
aside#slider #nosreferences, aside#slider #nosreferences span{
	color:#fff;
	font-size:1.5rem;
	font-weight:700;
	text-transform:uppercase;
}

/* L'ÉQUIPE */


img#portrait{
	display:inline-block;
	max-width:60%;
	margin:40px 0 0;
	border-radius:300px;
}
section#content article #texte h2#tm, section#content article #texte h2{
	padding:40px 0 0;
	font-size:2.1rem;
	font-family: 'Cabin', sans-serif;
	text-transform:uppercase;
}
section#content article #texte h2{ padding-bottom: 20px;}
section#content article #texte p strong.lequipe{
	padding:40px 0 10px;
	text-transform:uppercase;
	font-size:1.8rem;
	line-height:2.4rem;
	font-weight:400;
	font-family:'Vollkorn', serif;
	border:none;
}
section#content article #texte p strong.lequipe::after{ margin-top: 14px;}

#advisors{
	flex-direction: row;
	width: 100% !important;
	justify-content: flex-start;
}
.seniorsadvisors{
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 40px 0 0;
}
.advisors{
	display: flex;
	flex-direction: column;
	width: 60%;
	margin: 0 auto;
	padding: 40px 5% 0;
}
#advisors .advisors{
	width: 30%;
	margin: 0 5% 40px 0;
	padding: 40px 5px 0;
}
#advisors .oui{ display: none;}
#advisors .advisors:last-of-child{ margin-right: 0;}
.advisors:nth-child(3n){ margin-top: 180px;}
.clear{ clear:both;}
.advisors .photo{
	margin: 0 auto;
	width: 10vw;
	height: 10vw;
	border-radius: 10vw;
	background-position: top center;
	background-color: #f7f7f7;
	overflow: hidden;
}
.advisors img{
	float:left;
	width:100%;
}
.advisors h2, .advisors p{
	float:left;
	width:100%;
	padding:20px 0;
	text-align:center;
	text-transform:uppercase;
	font-family:'Vollkorn', serif;
	font-size:1.8rem;
	font-weight:400;
}
.advisors h2{
}
.advisors p{
	font-size:1.5rem;
	line-height: 2.4rem;
	font-style:italic;
	text-transform:none;
	padding:0 0 25px;
}
.advisors p b{ font-size: 1.6rem;}

.advisors .linkedin{
	display: flex;
	margin: 10px auto 40px;
	font-weight: 700;
	font-size: 1.4rem;
	line-height: 2.8rem;
}
.advisors .linkedin span{
	display: flex;
	margin-right: 8px;
	width: 2.8rem;
	height: 2.8rem;
	border: 1px solid #221e51;
	border-radius: 20px;
}
.advisors .linkedin:hover span{
	background: #ffed00;
	border: 1px solid #ffed00;
}
.advisors .linkedin span::before{
	display: flex;
	margin: auto;
	  content: " ";
	  width: 2.8rem;
	  height: 2.8rem;
		background-color: #221e51;
	  -webkit-mask: url(../img/icones-linkedin.svg) no-repeat 50% 50%;
	  mask: url(../img/icones-linkedin.svg) no-repeat 50% 50%;
	  mask-size: 3.2rem auto;
	  -webkit-mask-size: 3.2rem auto;
}


/* A PROPOS */

section#content #references{
	flex-direction: column;
}
section#content #references h2.bleu{
	z-index: 1;
	position: relative;
	width: auto;
	margin: 0 auto;
	padding: 0 10px;
}
section#content #references h2.bleu::after {
    position: absolute;
    z-index: 0;
	left: 0;
    content: " ";
    margin: 13px 0 0;
    width: 100%;
    height: 9px;
    background: rgba(0, 53, 174, 0.33);
    opacity: 0.5;
}
section#content #references div.domaine{
	display: flex;
	margin: 40px 0 0;
}
section#content #references div.domaine strong{
	font-weight: 700;
	font-size: 1.6rem;
	text-transform: uppercase;
	margin-bottom: 5px;
}
section#content #references div.domaine .liens{
	display: flex;
	flex-direction: column;
	margin: auto 0;
}
section#content #references div span.icone{
	flex-shrink: 0;
	margin-right: 30px;
	width: 80px;
	height: 80px;
	background: url(../img/icone-sante.svg) no-repeat center #fff;
	background-size: 70px;
	box-shadow: 7px 7px 0 rgba(26, 51, 111, 0.2);
	border-radius : 40px;
}
section#content #references div span.icone-autres{ background-image: url("../img/icone-domaines.svg");}
section#content #references div p{
	display: flex;
	flex-direction: column;
}
section#content #references div.lien{
	display: block;
	margin: 0;
}
section#content #references div.lien a{
	font-size: 1.5rem;
}





/* TRANSACTIONS */

section#transactions{
	display: flex;
	flex-wrap: wrap;
	float:left;
	width:100%;
	margin:20px 0 0;
}
section#transactions .transaction{
	display: flex;
	position:relative;
	width: 400px;
	height: 400px;
	background:#fafafa;
	overflow: hidden;
}
section#transactions .transaction .ancre{
	position:absolute;
	margin:-190px 0 0;
	width:10%;
	height:1px;
}
section#transactions .transaction .image{
	float:left;
	position:relative;
	width:100%;
}
section#transactions .transaction .image img{
	float:left;
	position:relative;
	width: 100%;
}
section#transactions .transaction .plus, section#transactions .transaction .moins{
	position:absolute;
	right:0;
	bottom:0;
	width:40px;
	height:40px;
	line-height:38px;
	text-align:center;
	font-size:2.4rem;
	font-weight:700;
	background:#f7f7f7;
	cursor:pointer;
}
section#transactions .transaction .moins{ color:#fff; background:#ea5555;}
section#transactions .transaction:hover .plus{ background:#ffed00;}
section#transactions .transaction .informations{
	display:none;
	position:absolute;
	width:100%;
	height:200px;
	padding:0 30px;
	background:#fff;
}
section#transactions .transaction .informations b, section#transactions .transaction .informations em, section#transactions .transaction .informations p{
	float:left;
	width:100%;
	color:#000;
}
section#transactions .transaction .informations b{
	padding:30px 0 15px;
	font-size:1.5rem;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:0.1rem;
}
section#transactions .transaction .informations em{
	padding:0 0 15px;
	line-height:1.6rem;
	font-family:'Vollkorn', serif;
	text-align:left;
}
section#transactions .transaction .informations p{
	padding:0 0 30px;
	font-size:1.5rem;
	line-height:1.8rem;
	font-family:'Vollkorn', serif;
	text-align:left;
}

section#content h2.central{
	float:left;
	width:100%;
	padding:120px 0 60px;
	font-size:2.1rem;
	text-align:center;
	text-transform:uppercase;
	letter-spacing:0.5rem;
}

section#anciennes{
	float:left;
	position:relative;
	width:100%;
}
section#anciennes #slides{ height:240px !important;}
section#anciennes .slides-control, section#anciennes .slides-container{
	position:relative;
	width:100% !important;
	left:0 !important;
}
section#anciennes .slides{
	position:relative;
	width:100% !important;
	left:0 !important;
	height:auto !important;
}
section#anciennes h2, section#anciennes .ancienne{
	float:left;
	width:16.66%;
	height:200px;
	background:#f7f7f7;
}
section#anciennes .n2{ background:#f0f0f0;}
section#anciennes .generique{ background:#221e51;}

section#anciennes h2{
	z-index:2;
	background:#ffed00;
}
section#anciennes h2, section#anciennes .ancienne span{
	line-height:200px;
	font-size:1.5rem;
	text-align:center;
	text-transform:uppercase;
}
section#anciennes .ancienne span{
	float:left;
	width:100%;
}
section#anciennes .generique span{
	color:#fff;
	font-weight:700;
	background:#221e51;
}
section#anciennes img{
	left:0 !important;
	top:0 !important;
	position:relative !important;
	width:100% !important;
	height:auto !important;
	z-index:1 !important;
}
section#anciennes p{
	z-index:2;
	position:absolute;
	bottom:0;
	width:16.66%;
	padding:10px 5px;
	text-align:center;
	font-style:italic;
	font-size:1.3rem;
	line-height:1.5rem;
	background:#f7f7f7;
}
section#anciennes .n2 p{ background:#f0f0f0;}

section#anciennes .slides-navigation{ width:100%; padding: 0; text-align:center;}
section#anciennes .slides-navigation a{ display:inline-block; margin: 10px 0 0;}
section#anciennes .slides-navigation a{ width:40px; height:40px; line-height:38px; border-radius:40px;}
section#anciennes .slides-navigation a:hover{ color:#ffed00; background:#221e51;}
section#anciennes .slides-pagination{ display:none;}

section#anciennes #mobile{ display:none;}


/* ACTUALITÉS */

body.actualites h1{ text-align: center;}
section#articles{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	width:100%;
	padding: 0 5%;
	margin-top: -15vw;
}
section#articles article{
	display: flex;
	margin: 40px auto 40px 0;
	width:45%;
	padding: 0;
	border-radius:4px;
	background:#fff;
	box-shadow: 3px 13px 33px rgba(0,0,0, 0.075);
}
section#articles article.droite{ margin-left: auto; margin-right: 0;}

section#articles article a{
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 40px 25px 20px;
	cursor: pointer;
}

section#articles article a:hover{
	border-radius:4px;
	background: rgba(255, 236, 0, 0.5);
	background: #FFF682;
}

section#articles article div.image{
	padding:0;
}
section#articles article div.image a{
	float:left;
	width:100%;
	text-align:center;
}
section#articles article div.image img{
	display:inline-block;
	width:auto;
	max-width:50%;
	border-radius:400px;
	overflow:hidden;
}

section#articles article h2{
	margin-bottom: 20px;
	font-size: 2.4rem;
	line-height: 3.2rem;
}
section#articles article a:hover h2{

}
section#articles article div.texte{
	display: flex;
	flex-direction: column;
	margin: 0;
	height: 100%;
	width:100%;
}
section#articles article div.texte a{

	width:100%;
	padding:20px 20px 0;
}
section#articles article p, section#articles article span{
	display:inline;
	float:none;
	width:auto;
	margin:0;
	padding:0;
	vertical-align:top;
}
section#articles article p, section#articles article strong, section#articles article em, section#articles article span, section#articles article em, section#articles article a{
	font-size:1.6rem;
	line-height:2.8rem;
}
section#articles article a.lien, section#articles article a.fichier{ float:left; padding:10px 0;}
section#articles article a.fichier{ clear:both; background:url('../img/piece-jointe.png') no-repeat left center; padding-left:25px;}
section#articles article a.lien:hover, section#articles article a.fichier:hover{ text-decoration:underline;}
section#articles article span.date{
	margin: auto 0 0 auto;
	font-style:italic;
	font-size:1.4rem;
	color:#221e51;;
}

section#content article h1.reduit, section#content article .reduit{ width:75% !important;}
section#content article .bulle{
	float:right;
	width:20%;
	padding:0 0 20px;
}
section#content article .bulle img{
	float:left;
	width:100%;
	border-radius:300px;
}

section#content article.article #texte h2{
	font-weight:400;
	padding:20px 0;
	text-transform:uppercase;
}
section#content article.article p#date{
	float:left;
	width:100%;
	text-align:right;
	padding:20px 0 0;
}

aside#autres{
	display: flex;
	justify-content: space-between;
	width:100%;
	padding: 120px 0 80px;
}
aside#autres section#articles article{
	margin: 0 auto;
	width: 30%;
}

aside#autres section#articles article h2{ font-size: 2.1rem; line-height: 2.8rem;}
aside#autres section#articles article p{ font-size: 1.5rem; line-height: 2.6rem;}
aside#autres section#articles article span.date{ margin: auto auto 0 0; padding-top: 10px;}


body.article #content{
	max-width: 1000px;
}
body.article section#content article #resume p{
	line-height: 3.6rem;
}
body.article section#content article.article p#date{ font-size: 1.6rem;}



/* NOS TRANSACTIONS */

.nos-transactions #content{
	padding-bottom: 0;
	width: 100%;
}
/*
.nos-transactions footer{ background: #fff;}*/

#nos-transactions{
	display: flex;
	flex-direction: column;
	width: 100%;
	margin-top: -15vw;
}
#nos-transactions #sante,
#nos-transactions #autres{
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	padding: 40px 5%;
}
#nos-transactions #selection{
	display: flex;
	width: 100%;
	flex-shrink: 0;
	height: 80px;
	padding: 16px 30px;
	margin-bottom: 80px;
	background: #221e51;
	border-radius: 3px;
}
#nos-transactions #selection form{
	display: flex;
	width: 100%;
}
#nos-transactions #selection strong,
#nos-transactions #selection select,
#nos-transactions #selection input{
	display: flex;
	font-weight: 700;
	font-size: 1.6rem;
	height: 48px;
	line-height: 48px;
}
#nos-transactions #selection strong{
	margin-right: 16px;
	text-transform: uppercase;
	font-size: 1.4rem;
	letter-spacing: 0.15rem;
}
#nos-transactions #selection strong,
#nos-transactions #selection input{
	color: #fff;
	background: #221e51;
}
#nos-transactions #selection select{
	flex-grow: 0;
	padding: 0 18px;
	margin-right: 30px;
}
#nos-transactions #selection input{
	margin-left: 20px;
	text-transform: uppercase;
	cursor: pointer;
	padding: 0 30px;
	color: #221e51;
	background: #fff;
	border-radius: 3px;
}
#nos-transactions #selection input:hover{
	color: #221e51;
	background: #ffed00;
}


#nos-transactions article{
	display: flex;
	flex-direction: column;
	width: 22.5%;
	margin-right: 3.333%;
	margin-bottom: 80px;
	background: #fff;
	box-shadow: 8px 10px 2px rgba(0,0,0, 0.0666);
	border-radius: 3px;
	overflow: hidden;
}
#nos-transactions article:nth-of-type(4n){ margin-right: 0;}
#nos-transactions article a{
	position: relative;
	width: 100%;
	height: 100%;
	margin: 0;
}
#nos-transactions article .informations,
article#transaction .informations{
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	height: 100%;
	margin: 0;
}
#nos-transactions article .informations strong,
#nos-transactions article .informations em,
#nos-transactions article .informations span,
article#transaction .informations strong,
article#transaction .informations em,
article#transaction .informations span{
	width: 100%;
	font-weight: 700;
	text-align: center;
	font-size: 1.8rem;
	height: 60px;
	line-height: 60px;
}
#nos-transactions article .informations strong,
article#transaction .informations strong{
	color: #fff;
	background: #221e51;
}
#nos-transactions article .informations p,
article#transaction .informations p{
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin: 0 0 auto;
}
article#transaction .details p b,
#nos-transactions article .informations p b{
	display: flex;
	width: 100%;
	justify-content: center;
	min-height: 66px;
	line-height: 2.8rem;
	text-transform: uppercase;
	font-weight: 700;
	margin: 40px auto;
	padding: 0 20px;
	color: #121212;
	font-size: 1.8rem;
	text-align: center;
}
#nos-transactions article .informations em,
article#transaction .informations em{
	text-transform: uppercase;
	font-style: normal;
	font-size: 1.6rem;
}
#nos-transactions article img,
article#transaction .informations img{
	width: auto;
	margin: 40px auto;
	height: 66px;
}
#nos-transactions article .informations span,
article#transaction .informations span{
	margin: auto auto 0;
	width: 90%;
	border-top: 1px solid rgba(0,0,0, 0.1);
}
#nos-transactions article .resume{
	top: 0;
	height: 100%;
	position: absolute;
	display: flex;
	flex-direction: column;
	justify-content: center;
	opacity: 1;
	width: 100%;
	padding: 2.8rem 2.8rem 0;
	font-size: 1.6rem;
	background: #f7f7f7;
	opacity: 0;
}
#nos-transactions article a:hover .resume{ opacity: 1;}
#nos-transactions article .resume div{
	margin: 0 0 auto;
}
#nos-transactions article .resume p{
	margin: 0;
	padding: 2.8rem 0rem 0;
}
#nos-transactions article .resume p:first-of-type{ padding-top: 0;}
#nos-transactions article .resume p,
#nos-transactions article .resume p strong,
#nos-transactions article .resume p b{
	font-size: 1.6rem;
	line-height: 2.6rem;
}
#nos-transactions article .resume p b,
#nos-transactions article .resume p strong{ font-weight: 700;}
#nos-transactions article a button{
	margin: auto 2.8rem 2.8rem;
	font-weight: 700;
	text-transform: uppercase;
	text-align: center;
	font-size: 1.4rem;
	height: 48px;
	line-height: 48px;
	color: #fff;
	background: #221e51;
	padding:  0 30px;
	cursor: pointer;
}
#nos-transactions article a button:hover{
	color: #221e51;
	background: #ffed00;
}

#nos-transactions #autres{
	display: flex;
	width: 100%;
	padding: 120px 5% 40px;
	background: rgba(0,0,0, 0.05);
	background: #f7f7f7;
}
#nos-transactions #autres h2{
	width: 100%;
	flex-shrink: 0;
	text-align: center;
	text-transform: uppercase;
	font-size: 2.1rem;
	margin-bottom: 80px;
}


/* Page des transactions */

.transaction section#content{
	padding-top: 160px;
}

article#transaction{
	display: flex;
	flex-direction: column;
}
article#transaction .resume{
	background-size: cover;
	$background-position: center;
	margin-bottom: 40px;
	background-color: #221e51;
}
article#transaction .resume,
article#transaction .resume .noir{
	display: flex;
	flex-direction: column;
	width: 100%;
}
article#transaction .resume .noir{
	padding: 20vh 5vw 7.5vh;
	color: #fff;
	background: rgba(0,0,0, 0.4);
}
article#transaction .resume h1,
article#transaction .resume strong,
article#transaction .resume p{
	color: #fff;
}
article#transaction .resume strong{
	font-size: 2.1rem;
	font-weight: 700;
	margin-bottom: 2.8rem;
}
article#transaction .resume p{
	font-size: 1.8rem;
	line-height: 3.2rem;
	margin-top: 2.8rem;
}
article#transaction .details{
	position: relative;
	padding: 50px 38% 5vh 5vw;
}
article#transaction .details p{
	font-size: 1.8rem;
	line-height: 2.8rem;
	margin-bottom: 2.8rem;
}
article#transaction .details p.accroche{
	font-weight: 700;
	font-size: 2.4rem;
	line-height: 3.2rem;
	margin-bottom: 3.2rem;
}
article#transaction .details p strong{
	font-size: inherit;
	line-height: inherit;
	font-weight: 700;
}

article#transaction #cartouche{
	position: absolute;
	top: 40px;
	right: 5vw;
	width: 30%;
	border-left: 1px solid rgba(0,0,0, 0.1);
	border-bottom: 1px solid rgba(0,0,0, 0.1);
	box-shadow: 8px 10px 2px rgba(0,0,0, 0.0666);
}


/* EQUIPE */
.equipe #large{
	display: flex;
	flex-direction: column;
}
section#lequipe{
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	max-width: 1420px;
	padding: 0 5vw;
	margin: 20px auto 0;
}
section#lequipe article{
	display: flex;
	margin: 0 5% 40px 0;
	width: 30%;
	background: #f7f7f7;
}
section#lequipe article:nth-child(3n){ margin-right: 0;}
section#lequipe article:hover{
	background: #fff;
  box-shadow: 8px 10px 2px rgba(0,0,0, 0.0666);
}
section#lequipe article .background-cover{
	width: 33%;
	height: 100%;
	min-height: 200px;
}
section#lequipe article .informations{
	display: flex;
	flex-direction: column;
	width: 67%;
	padding: 30px 20px;
}
section#lequipe article .informations h2 a{
	font-size: 2.4rem;
}
section#lequipe article .informations h2 a:hover{
	color: #ffed00;
}
section#lequipe article .informations strong{
	display: flex;
	margin: 0.8rem 0 2.4rem;
	font-size: 1.8rem;
}

section#lequipe article .informations a.email,
section#lequipe article .informations a.telephone{
	display: flex;
	width: auto;
	margin-right: auto;
	font-size: 1.6rem;
	height: 3.2rem;
	line-height: 3.2rem;
	margin-left: 5rem;
	border-bottom: 4px solid rgba(255, 255, 255, 0);
}
section#lequipe article .informations a.email:hover,
section#lequipe article .informations a.telephone:hover{
	border-bottom: 4px solid #ffed00;
}
section#lequipe article .informations a.email{ margin-bottom: 1.4rem;}

section#lequipe article .informations a.email::before,
section#lequipe article .informations a.telephone::before{
	content: " ";
	display: flex;
	width: 4.8rem;
	height: 3.2rem;
	margin-left: -5.6rem;
	background-color: #221e51;
	-webkit-mask: url(../img/icone-email.svg) no-repeat 50% 50%;
	mask: url(../img/icone-email.svg) no-repeat 50% 50%;
	mask-size: 2.2rem auto;
	-webkit-mask-size: 2.2rem auto;
}

section#lequipe article .informations a.telephone::before{
	-webkit-mask: url(../img/icone-telephone.svg) no-repeat 50% 50%;
	mask: url(../img/icone-telephone.svg) no-repeat 50% 50%;
	mask-size: 2rem auto;
	-webkit-mask-size: 2rem auto;
}

#equipe{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 0 5vw;
	margin: 0 auto;
	max-width: 1220px;
}
#equipe .titre{
	padding-right: 25vw;
}
#equipe .titre strong{
	font-size: 2.8rem;
}
#equipe .photo{
	top: 0;
	right: 0;
	position: absolute;
	width: 20vw;
	max-width: 320px;
	background: #221e51;
  box-shadow: 8px 10px 2px rgba(0,0,0, 0.0666);
}
#equipe .photo .background-cover{
	display: flex;
	width: 20vw;
	max-width: 320px;
	height: 30vw;
	max-height: 450px;
	background-position: top center;
}
#equipe .photo a{
	display: flex;
	width: 100%;
	height: 56px;
	line-height: 56px;
	padding: 0 20px;
	color: #fff;
	font-weight: 700;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
#equipe .photo a:hover{
	color: #221e51;
	background: #f7f7f7;
}
#equipe .photo a.email::before,
#equipe .photo a.telephone::before{
	content: " ";
	display: flex;
	width: 56px;
	height: 56px;
	background-color: #fff;
	-webkit-mask: url(../img/icone-email.svg) no-repeat 50% 50%;
	mask: url(../img/icone-email.svg) no-repeat 50% 50%;
	mask-size: 24px auto;
	-webkit-mask-size: 24px auto;
}

#equipe .photo a.telephone::before{
	-webkit-mask: url(../img/icone-telephone.svg) no-repeat 50% 50%;
	mask: url(../img/icone-telephone.svg) no-repeat 50% 50%;
	mask-size: 22px auto;
	-webkit-mask-size: 22px auto;
}
#equipe .photo a.email:hover::before,
#equipe .photo a.telephone:hover::before{
	background-color: #221e51;
}
#equipe .biographie{
	display: flex;
	flex-direction: column;
	width: 60%;
	margin: 3.2rem 0 0;
}
#equipe .biographie p,
#equipe .biographie li{
	margin-bottom: 3.2rem;
	font-size: 1.8rem;
	line-height: 3.2rem;
}
#equipe .biographie ul{
	margin-bottom: 2.4rem;
}
#equipe .biographie li{
	margin-bottom: 0.8rem;
	list-style: disc;
	margin-left: 1.8rem;
}



/* CONTACT */

#contact section#content{
	display: flex;
	width: 100%;
	min-height: 100vh;
	padding: 0;
}

#contact section#content #coordonnees{
	width: 50%;
	margin: auto 0 auto;
	padding: 0 2% 0 15%;
}
#contact section#content #formulaire{
	display: flex;
	flex-direction: column;
	z-index:1;
	margin: 0;
	width:50%;
	min-height:100vh;
	padding: 0 5%;
	background:#FFF682;
}
#contact section#content form{
	width: 100%;
	margin: auto;
}
#contact section#content .oui form, #contact section#content .non form{ margin-top: 0;}
#contact section#content .non{ background:#f14747 !important;}
#contact section#content .oui{ background:#41af4e !important;}

#contact section#content #coordonnees h1{ padding:0 0 50px;}

#contact section#content #coordonnees p#adresses{ padding:40px 0;}
#contact section#content #coordonnees p#adresses, #contact section#content #coordonnees p#adresses a{ font-size:2rem; line-height:2.6rem;}
#contact section#content #coordonnees p#adresses a{ float:left; margin-right:40px; border-bottom:4px solid #FFF682;}
#contact section#content #coordonnees p#adresses a.sans{ border: none;}
#contact section#content #coordonnees p#adresses a:hover{ background:#FFF682;}
#contact section#content #coordonnees p#adresses a.lien{
	float:left;
	margin:-20px 5px 0;
	border-radius:30px;
	background:#f7f7f7;
	border:none;
}
#contact section#content #coordonnees p#adresses a.lien:hover{ background:#FFF682;}
#contact section#content #coordonnees p#adresses a.lien img{ float:left; width: 50px;}

#contact section#content #formulaire form{
	float:left;
	width:100%;
	padding:50px 0 0;
}
#contact section#content #formulaire input, #contact section#content #formulaire textarea{
	float:left;
	width:100%;
	height:60px;
	line-height:60px;
	padding:0 4%;
	margin:0 0 20px;
	font-size:2.1rem;
	color:#000000;
	background:#ffed00;
	background:rgba(0,0,0, 0.1);
}
#contact section#content .non input, #contact section#content .non textarea{ background:#fff !important;}
#contact section#content .non input.rouge, #contact section#content .non textarea.rouge{ color:#c20000 !important; font-weight:700; border:2px dashed #c20000; background:#ffb8b8 !important;}
#contact section#content .oui input, #contact section#content .oui textarea{ color:#221e51 !important; background:#fff !important;}


#contact section#content #formulaire input:hover, #contact section#content #formulaire textarea:hover, #contact section#content #formulaire input:focus, #contact section#content #formulaire textarea:focus{
	color:#221e51;
	background:#fff;
}
#contact section#content #formulaire textarea{
	height:160px;
	padding:15px 4%;
	line-height:3.2rem;
}
#contact section#content #formulaire input#submit{
	float:right;
	width:auto;
	padding:0 50px;
	color:#221e51;
	font-size:1.6rem;
	font-weight:700;
	font-family: 'Cabin', sans-serif;
	text-transform:uppercase;
	background:#fff;
}
#contact section#content #formulaire input#submit:hover, #contact section#content #formulaire input#submit:focus{
	color:#fff;
	background:#221e51;
	cursor:pointer;
}

#contact section#content #formulaire #message{
	width:100%;
	margin: auto auto 0;
}
#contact section#content #formulaire #message p{
	float:left;
	width:100%;
	padding:20px 5%;
	text-align:center;
	color:#fff;
	font-size:1.6rem;
	background:#f14747;
	background:rgba(0,0,0, 0.2);
}

a#credits{
	z-index:2;
	position:absolute;
	width:25px;
	height:25px;
	bottom:20px;
	right:20px;
	opacity:0.6;
}
a#credits:hover{ opacity:1;}
a#credits img{ width:100%;}







/* New header */

body.new-header{
	background: #fff !important;
}


#contact section#content article #resume{
	margin-bottom: 0;
}

/* New header */
body.new-header header{
	max-width: 1920px;
	margin: 0 auto;
	margin-left: -960px;
	left: 50%;
}
body.new-header header #langues{
	right: 50%;
	margin-right: -960px;
}


body.new-header section#content{
	width: 100%;
	max-width: 1920px;
	padding-top: 0;
}
body.new-header #intro{
	display: flex;
	width: 100%;
	flex-direction: column;
	padding: 260px 5vw 0;
	background: url('../img/background-2025.svg') no-repeat bottom center #F9F9FB;
	background-size: 100% auto;
}
.new-header section#content article #resume {
  margin-bottom: 22vw;
}

.new-header section#content article .textes{
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 1020px;
	margin: 0 auto;
}
section#lequipe,
.new-header section#content article .textes-mt,
.article section#content article .textes{ margin-top: -15vw;}
.new-header section#content article.center h2{
	position: relative;
	width: auto;
	margin: 0 auto 40px;
	font-family: 'Cabin', sans-serif;
	font-weight: 700;
	text-transform: uppercase;
}
.new-header section#content article.center h2::before,
.new-header section#content article.center h2::after{
	position: absolute;
	content: " ";
	display: flex;
	width: 22px;
	height: 22px;
	left: -28px;
	top: 28px;
	background-color: #FFEC00;
	-webkit-mask: url(../img/plus.svg) no-repeat 50% 50%;
	mask: url(../img/plus.svg) no-repeat 50% 50%;
	mask-size: 22px auto;
	-webkit-mask-size: 22px auto;
}
.new-header section#content article.center h2::after{
	right: -28px;
	left: auto;
	top: -22px;
	background-color: #D4D2DF;
}
.actualites section#content article.center h2::before,
.actualites section#content article.center h2::after{
	display: none;
}

section#content article.center video{
	margin-bottom: 80px;
}

.new-header section#content article p{
	font-size: 2.1rem;
	line-height: 3.2rem;
	font-family:'Vollkorn', serif;
	margin-bottom: 3.2rem;
}
.new-header section#content article p:last-of-type{ margin-bottom: 0;}

.new-header section#content article .textes2{
	flex-direction: row;
}
.new-header section#content main,
.new-header section#content aside{
	display: flex;
	flex-direction: column;
	width: 60%;
	padding-right: 4rem;
}
.new-header section#content aside{
	width: 40%;
	padding: 4rem 5rem;
	background: #F9F9FB;
}
.new-header section#content article.center h3{
	margin-bottom: 3.2rem;
	font-size: 2.4rem;
	font-weight: 700;
}
.new-header section#content aside img{
	width: 100%;
	height: auto;
	margin-bottom: 3rem;
}




.background-cover{
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	-webkit-background-size:cover;
}



/* RESPONSIVE */

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


	/* New header */
	body.new-header header{
		max-width: 100%;
		margin-left: 0;
		left: 0;
	}
	body.new-header header #langues{
		right: 0;
		margin-right: 0;
	}

}

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

	.advisors .photo{ width: 11vw; height: 11vw;}
}

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

	section#content{ width: 90vw; }
	#slide section#content #gauche{ width: 40vw;}

	section#transactions .transaction{
		width: 22.5vw;
		height: 22.5vw;
	}
}
@media only screen and (max-width : 1599px) {

	html, body{ font-size:62%;}

	#contact section#content #coordonnees{ padding-left:12%;}
	.advisors .photo{ width: 12vw; height: 12vw;}
}
@media only screen and (max-width : 1499px) {

	html, body{ font-size:61%;}

	#contact section#content #coordonnees{ padding-left:10%;}
	article.lequipethm{ padding-right:0;}
}
@media only screen and (max-width : 1399px) {

	html, body{ font-size:60%;}

	header nav a b.not{ text-transform:none;}
	#contact section#content #coordonnees{ padding-left:8%;}
	.advisors .photo{ width: 13vw; height: 13vw;}
	section#articles article{ width: 47%;}

	#nos-transactions article .resume { padding: 2.1rem 2.1rem 0;}
	#nos-transactions article .resume p{ padding-left: 1rem; padding-right: 1rem;}
	#nos-transactions article .resume p, #nos-transactions article .resume p strong{ font-size: 1.6rem;}
}
@media only screen and (max-width : 1299px) {

	html, body{ font-size:59%;}

	header nav a b{ font-size:1.5rem;}
	#contact section#content #coordonnees{ padding-left:7%;}
	.advisors .photo{ width: 14vw; height: 14vw;}

	header #logo a{ width: 130px;}

	#nos-transactions article:nth-of-type(4n),
	#nos-transactions article {
	  width: 31%;
	  margin-right: 3.5%;
	}
	#nos-transactions article:nth-of-type(3n) {
	  margin-right: 0;
	}

	section#lequipe article{ width: 45%; margin-right: 0;}
	section#lequipe article:nth-of-type(2n){ margin-left: 10%;}
	section#lequipe article:nth-of-type(3n){ margin-right: 0;}
	#equipe .photo{ width: 25vw;}
	#equipe .photo .background-cover{ width: 100%; height: 33vw;}
}
@media only screen and (max-width : 1199px) {

	html, body{ font-size:58%;}

	header nav{ padding-left: 130px; padding-right: 10px;}
	header #logo a{ width: 140px; padding: 40px 15px;}
	header #logo a img{ width: 80%;}
	header nav a{ padding:50px 0;}
	header nav a b.not{ text-transform:uppercase;}

	#slide section#content #gauche{ width:47%;}
	section#content #droite, section#content #gauche{ width:47%;}
	section#content article h1{ font-size:5.2rem; line-height:5.2rem;}
	#contact section#content #coordonnees{ padding-left:5%;}
	section#transactions .transaction{ width: 30vw; height: 30vw;}

	#advisors .advisors{
		width: 45%;
		margin-right: 10%;
	}


	section#content article.center #video,
	section#content article.center #video .couverture,
	section#content article.center #video iframe{
		width: 80vw;
		height: 45vw;
	}

}
@media only screen and (max-width : 1099px) {

	html, body{ font-size:57%;}

	header nav a b{ font-size:1.4rem; letter-spacing:-0.05rem;}
	#home header nav a b{ font-size:1.5rem;}
	header nav a span{ letter-spacing:0;}


	section#lequipe article{ width: 47%;}
	section#lequipe article:nth-of-type(2n){ margin-left: 6%;}


		.new-header section#content article .textes{
			padding: 0 5vw;
		}

}
@media only screen and (max-width : 999px) {

	html, body{ font-size:56%;}


	#introduction h1{ margin:30px 0 0; font-size:5.6rem; line-height:6rem;}
	section#content #droite{ width:55%;}
	section#content #gauche{ width:40%;}
	section#content article h1{ font-size:4.6rem; line-height:4.6rem;}
	section#anciennes #slides{ height:540px !important;}
	section#anciennes h2, section#anciennes .ancienne, section#anciennes p{ width:33.33%;}
	section#anciennes .l1 p{ bottom:50%;}

	aside#autres section#articles article{ width: 45%;}
	aside#autres section#articles article.droite{ display: none;}

	#nos-transactions article:nth-of-type(3n),
	#nos-transactions article:nth-of-type(4n),
	#nos-transactions article {
	  width: 45%;
	  margin-right: 10%;
	}
	#nos-transactions article:nth-of-type(2n) {
	  margin-right: 0;
	}

	section#content article.center .valeurs{
		flex-direction: column;
	}
	section#content article.center .valeurs ul{
		max-width: 600px;
		margin: 0 auto 40px;
	}

	#nos-transactions #selection{ height: auto;}
	#nos-transactions #selection form{
		flex-direction: column;
	}
	#nos-transactions #selection strong{
		height: auto;
		line-height: 3.2rem;
		margin-bottom: 1.2rem;
	}
	#nos-transactions #selection select {
	margin-bottom: 2.4rem;
}
	#nos-transactions #selection input {
		margin-left: 0;
	}
}
@media only screen and (max-width : 899px) {

	html, body{ font-size:55%;}

	header nav{ padding-left:90px;}
	header #logo a img{ width:60%;}
	header nav a{ padding:40px 0;}
	#home header nav a b{ letter-spacing:-0.06rem;}
	#home header nav a b.not{ text-transform:none;}
	#contact section#content #coordonnees{ padding-left:4%;}
	section#anciennes #slides{ height:520px !important;}
	.advisors .photo{ width: 16vw; height: 16vw;}


		#equipe .photo{ width: 30vw;}
		#equipe .photo .background-cover{ height: 40vw;}

		section#content article.center .segments ol{
			flex-wrap: wrap;
			margin-top: 1rem;
		}
		section#content article.center .segments ol li{
			margin-top: 2rem;
		}
}
@media only screen and (max-width : 799px) {

	html, body{ font-size:54%;}

	body#page{ background-image:url('../img/background-home-mobile-2023.jpg');}

	header{ z-index:99; height:61px; background:#fff; border-bottom:1px solid #f0f0f0;}
	header.ouvert{ height:100%;}
	header nav, #home header nav{ display:none; padding:60px 0 0; height:100%;}
	header nav p, #home nav p{ width:100%;}
	#home header nav a, header nav a{ width:100%; text-align:center; padding:0; border-bottom:1px solid #f0f0f0;}
	#home header nav a.dernier, header nav a.dernier{ border:none;}
	header nav a p{ text-align:center;}
	header nav a span, header nav a b{ display:inline-block; width:100%; text-align:center;}
	header nav a span, #home header nav a span{ font-size:1.4rem; padding:0;}
	header nav a b, header nav a b.not, #home header nav a b, #home header nav a b.not{ font-size:2.4rem; text-transform:uppercase; padding:0;}
	header #logo, #home header #logo{ width:100%; text-align:center; display:block;}
	header #logo a{ width:100%; padding: 0 96px 0 60px; height:61px; border-bottom:1px solid #f0f0f0;}
	header #logo a img{ display:none;}
	header #logo a span{ display:inline-block; width:100%; height:60px; line-height:60px;}
	header #logo a span b{ font-weight:700; font-size:1.6rem; line-height:0.3rem; text-transform:uppercase; border-bottom:4px solid #fff;}
	header #logo a:hover span b{ border-bottom-color:#ffed00;}

	header nav a p{
		display: flex;
		padding-top: 4vh;
		padding-bottom: 4vh;
	}
	header nav a span, #home header nav a span{
		font-size: 1.5rem;
	}
	header nav a b, header nav a b.not, #home header nav a b, #home header nav a b.not{
		font-size: 2.4rem;
	}


	header #langues{
		flex-direction: row;
	}
	header #langues a{
		width: 48px;
		height: 60px;
		line-height: 60px;
	}

	#ouvrir{ display:block;}
	section#content{ padding:120px 0 40px;}
	section#content #droite, section#content #gauche{ width:100%;}
	section#content article h1{ font-size:4.2rem; line-height:4.2rem;}
	section#content #gauche .photo{ padding-top:20px;}
	#contact section#content #coordonnees{ padding-left:10%;}

	#slide section#content{ padding-left:8%; padding-right:8%;}
	#slide section#content #gauche{ width:100%;}
	aside#slider{ position:relative; float:left; width:100%; height: 50vh; top:auto; right:auto; margin:40px 0 0;}
	aside#slider #slides{ height:50vh !important;}
	aside#slider .slides{ height:50vh !important;}
	aside#slider div.photo{ position:relative; float:left;}

	img#portrait{ max-width:40%;}
	.seniorsadvisors{ padding:20px 0 0;}
	.advisors .photo{ width: 25vw; height: 25vw; border-radius: 25vw;}
	section#transactions .transaction{ width: 40vw; height: 40vw;}
	section#anciennes #slides{ height:440px !important;}
	section#articles article{ width:100%;}
	aside#autres section#articles article { width:45%;}
	aside#autres section#articles article.centre{ margin:0; float:right;}
	aside#autres section#articles article.droite{ display:none;}


	body.Equipe section#content{
		display: flex;
		flex-direction: column;
	}
	body.Equipe section#content #gauche,
	body.Equipe section#content #droite{
		width: 100% !important;
	}



		section#lequipe article{ width: 100%;}
		section#lequipe article:nth-of-type(2n){ margin-left: 0%;}
		section#lequipe article .background-cover{ width: 30vw; min-height: 30vw;}



	#advisors{ flex-wrap: wrap;}
	.seniorsadvisors{
		flex-direction: row;
		width: 100% !important;
		justify-content: flex-start;
	}
	#advisors .advisors {
		width: 45%;
		margin-right: 10%;
		padding-left: 0;
		padding-right: 0;
	}
#advisors .advisors:nth-of-type(2n) { margin-right: 0;}

	#advisors .oui{ display: flex;}
	body.Equipe section#content #droite{ display: none;}


	#contact section#content #coordonnees, #contact section#content #formulaire{ width:100%; padding:40px 10%; margin:0;}
	#contact section#content #coordonnees{ padding-top:120px;}
	#contact section#content #coordonnees h1{ padding-bottom:30px;}
	#contact section#content #coordonnees p#adresses{ padding:20px 0;}
	#contact section#content #formulaire{ position:relative; float:left;}
	#contact section#content #formulaire form{ padding:0;}


	body.new-header #intro{
		padding-top: 22vw;
	}

	section#content article.center #resume ul{
		flex-direction: column;
	}
	section#content article.center ul li{
		margin-left: auto;
		margin-right: auto;
	}
	section#content article.center ul li a{
		height: auto;
		line-height: 2.1rem;
		padding: 1rem 2rem;
	}

	#contact section#content{
		flex-direction: column;
	}
	#contact section#content #formulaire{
		min-height: auto;
	}

}
@media only screen and (max-width : 699px) {


	header nav a span, #home header nav a span{ font-size:1.3rem;}
	header nav a b, header nav a b.not, #home header nav a b, #home header nav a b.not{ font-size:2.1rem;}
	section#anciennes #slides{ height:380px !important;}

	#nos-transactions article {
	  width: 100% !important;
	  margin-right: 0% !important;
	}
	#nos-transactions article .informations p b{
		line-height: normal;
		min-height: auto;
		margin: 40px auto 0;
	}
	#nos-transactions article .informations p b.nom2{ margin: 0 auto 40px;}
	#nos-transactions article .informations em, article#transaction .informations em{
		margin: 40px 0;
	}
	#nos-transactions article img{ margin-top: 0;}
	#nos-transactions article img:first-of-type{ margin-top: 40px; margin-bottom: 0;}

	#equipe .titre{
		padding-right: 0;
	}
	#equipe .photo{
		position: relative;
		margin-top: 20px;
		width: 50vw;
	}
	#equipe .photo .background-cover {
    height: 50vw;
  }
	#equipe .biographie{ width: 100%;}
	#equipe .photo a{ padding-left: 6px; padding-right: 6px;}

	section#content article.center #video .couverture button {
	  width: 20vw;
	  height: 20vw;
		background-size: 10vw;
	}

	article#transaction .details{
		display: flex;
		flex-direction: column;
		padding-top: 0;
		padding-right: 5vw;
	}
	article#transaction .details p{ order: 3;}
	article#transaction .details p.accroche{
		order: 2;
		width: 100%;
	}
	article#transaction #cartouche{
		top: 0;
		left: 5vw;
		margin-bottom: 60px;
		position: relative;
		order: 1;
		width: 90%;
	}

	.new-header section#content main, .new-header section#content aside{ width: 100%;}
	.new-header section#content aside{ margin-top: 4rem;}
	.new-header section#content article .textes2{ flex-direction: column;}

}
@media only screen and (max-width : 599px) {

	html, body{ font-size:53%;}

	header nav a span, #home header nav a span{ font-size:1.2rem;}
	header nav a b, header nav a b.not, #home header nav a b, #home header nav a b.not{ font-size:1.8rem;}
	body#home{ background-image:url('../img/background-home-mobile.webp');}
	section#content{ width: 86vw; padding-top:100px;}
	#contact section#content #coordonnees{ padding-left:5%;}
	#home header #logo a span b{ display:none;}

	#introduction{ margin:-100px 0 0;}
	#introduction img{ width:120px;}
	#introduction h1{ margin:40px 0 0; font-size:4.8rem; line-height:5.2rem;}
	#slide section#content{ padding-left:4%; padding-right:4%;}
	aside#slider #slides{ height:50vh !important;}
	aside#slider .slides{ height:50vh !important;}
	.slides-pagination a{ margin-left:3px; margin-right:2px;}
	.slides-navigation{ padding-right:15px;}
	/*aside#slider div.photo{ position:relative; float:left; height:250px;}*/
	aside#slider div.informations b{ padding-top:15px;}
	#contact section#content #coordonnees{ padding-top:100px; padding-bottom:20px;}
	#contact section#content #formulaire{ padding-left:5%; padding-right:5%;}

	.slides-navigation { padding: 5px 10px;}

	.slides-navigation a {
	  height: 24px;
	  width: 24px;
	  margin: 0 3px 3px;
	  line-height: 23px;
	}
	aside#slider .slides-navigation a.prev {
  right: 50px;
}

.slides-pagination a{
  width: 6px;
  height: 6px;
  margin: 7px 3px;
}



	img#portrait{ max-width:50%;}
	.advisors .photo{ width: 33vw; height: 33vw;}
	aside#autres section#articles article { width:100%; margin-bottom: 40px !important;}
	aside#autres section#articles article.droite{ display:block; margin-bottom: 0 !important;}

	section#transactions .transaction{ width: 43vw; height: 43vw;}

	section#anciennes h2, section#anciennes .ancienne, section#anciennes p{ width:50%;}
	section#anciennes .t1 p{ bottom:66.67%;}
	section#anciennes .t2 p{ bottom:33.33%;}

	section#anciennes #slides{ height:460px !important;}
	section#anciennes #slides{ display:none;}
	section#anciennes #mobile{ display:block;}
	section#anciennes .ancienne{ position:relative;}
	section#anciennes .t1 p, section#anciennes .t2 p, section#anciennes .l1 p, section#anciennes p{ width:100%; bottom:0;}
	section#anciennes h2{ clear:both;}
	section#anciennes h2.fonce{ border-top:1px solid #dfe700;}
	section#anciennes h2, section#anciennes .ancienne { height:150px; line-height:150px;}

	section#content article.center .valeurs ul{ width: 100%; min-width: auto;}
	section#content article.center .valeurs ul li{ text-align: center;}

	section#content article.center .segments img{ width: 90vw;}
}
@media only screen and (max-width : 499px) {

	header nav a span, #home header nav a span{ font-size:1.1rem;}
	header nav a b, header nav a b.not, #home header nav a b, #home header nav a b.not{ font-size:1.6rem;}
	#contact section#content #formulaire input#submit{ width:100%; text-align:center;}
	section#transactions .transaction{ width: 86vw; height: 86vw;}
	aside#slider #nosreferences span{ display:none;}

	section#lequipe article{ margin-bottom: 30px;}
	section#lequipe article .background-cover{ width: 35vw; min-height: 35vw; background-position: top center;}
	section#lequipe article .informations{ padding: 24px 16px;}

}
@media only screen and (max-width : 449px) {

	#contact section#content #coordonnees p#adresses a#linkedin{ clear:both;}
	#contact section#content #coordonnees p#adresses a.lien{ margin-top:20px;}

	section#lequipe article .background-cover{ width: 40vw; min-height: 40vw;}
}
@media only screen and (max-width : 399px) {

	html, body{ font-size:52%;}

	header nav a span, #home header nav a span{ font-size:1rem;}
	header nav a b, header nav a b.not, #home header nav a b, #home header nav a b.not, header #logo a span b{ font-size:1.5rem;}

	#introduction{ margin:-100px 0 0;}
	#introduction img{ width:100px;}
	#introduction h1{ font-size:4.4rem; line-height:4.5rem;}
	a#decouvrez{ padding-bottom:20px;}
	a#credits{ display:none;}
	img#portrait{ max-width:80%; margin-left:10%;}
	.advisors{ width:100%;}
	.advisors .photo{ width: 38.7vw; height: 38.7vw;}
	section#content article h1.reduit, section#content article .reduit{ width:100% !important;}
	section#content article .bulle{ float:left; width:40%; text-align:center; padding:20px 0;}
	aside#slider #nosreferences{ font-size:1.4rem; padding-right:60%; letter-spacing:-0.05rem;}
	aside#slider .slides-navigation a.prev{ right:40px;}
	aside#slider .slides-navigation{ padding-left:5px; padding-right:5px;}

}
@media only screen and (max-width : 349px) {

	header nav a span, #home header nav a span{ font-size:0.9rem;}
	header nav a b, header nav a b.not, #home header nav a b, #home header nav a b.not, header #logo a span b{ font-size:1.4rem;}

	section#content #references{ flex-direction: column;}
	section#content #references p{ width: 100%; margin-bottom: 20px;}
	section#content #references p:last-child{ margin-bottom: 0;}

	#advisors, .seniorsadvisors{
		flex-direction: column;
	}

	#advisors .advisors ,
	 .advisors {
		width: 100%;
		margin-right: 0;
	}
	.advisors h2{
		min-height: auto;
	}

}
@media only screen and (max-width : 299px) {

	html, body{ font-size:50%;}

	aside#slider #nosreferences{ font-size:0;}
	.slides-pagination { margin:0; width:50%; text-align:left; right:auto; left:10px;}
	.advisors .photo{ width: 66vw; height: 66vw; border-radius: 33vw;}
}


/* HEIGHTS */

@media only screen and (max-height : 699px) {

	#introduction h1{ margin-top:30px;}
}

@media only screen and (max-height : 599px) {

	#introduction h1{ margin-top:20px;}
}

@media only screen and (max-height : 499px) {

	#introduction h1{ margin-top:15px;}
}

/* TRANSITIONS */

a, a *,
input, select,
.t33{-webkit-transition: all 0.33s cubic-bezier(0.86, 0, 0.07, 1);-moz-transition: all 0.33s cubic-bezier(0.86, 0, 0.07, 1); -ms-transition: all 0.33s cubic-bezier(0.86, 0, 0.07, 1); -o-transition: all 0.33s cubic-bezier(0.86, 0, 0.07, 1); transition: all 0.33s cubic-bezier(0.86, 0, 0.07, 1);
}

#nos-transactions article .resume
{-webkit-transition: all 0.66s cubic-bezier(0.86, 0, 0.07, 1);-moz-transition: all 0.66s cubic-bezier(0.86, 0, 0.07, 1); -ms-transition: all 0.66s cubic-bezier(0.86, 0, 0.07, 1); -o-transition: all 0.66s cubic-bezier(0.86, 0, 0.07, 1); transition: all 0.66s cubic-bezier(0.86, 0, 0.07, 1);
}