/***** fonts et reset *****/
@import url('https://fonts.googleapis.com/css?family=Barlow:400,500,600,700&display=swap');

body, ul, li, ol, form, h1, h2, h3, h4, h5, h6, div, span, p { padding:0; margin:0; border:0; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; text-size-adjust: none;}
article, aside, dialog ,figcaption, figure, footer, header, hgroup, main, nav, section { display: block;}  
input, textarea						{ -webkit-appearance: none; -ms-appearance: none; appearance: none; -moz-appearance: none; -o-appearance: none; border-radius: 0;}
*          							{ outline: none;}
strong, b							{ font-weight: 500;}
ul									{ list-style-type: none;}
body								{ font: 500 16px/30px "Barlow"; letter-spacing: 0.4px; color: #000; background: #fff; position: relative;}
body.active_overflow				{ height: 100vh; overflow: hidden;}
a									{ text-decoration: none; position: relative; color: #000;}
img									{ border: none;}
main 								{ position: relative; z-index: 10;}
#wrapper 							{ min-width: 320px; overflow: hidden; position: relative;}
#wrapper *							{ box-sizing: border-box;}
#footer 							{ position: relative; z-index: 15;}


/***** scollbar *****/
::-webkit-scrollbar 				{ width: 10px; height: 10px; background-color: #444;}
::-webkit-scrollbar-thumb			{ background-color: #0082c2;}


/***** transition *****/
@media (min-width:1201px) {
.link, .slick-arrow, :before, :after, a, a span, .sub { transition: all 400ms ease-in-out;}
}


/***** class *****/
.wrapper 							{ width: 90vw; min-width: 1080px; max-width: 1200px; margin: 0 auto; position: relative;}
.clear								{ clear: both; display: block;}
.titre_main	 						{ font: 700 30px/40px "Barlow"; position: relative; color: #1e2b50; margin-bottom: 20px; text-transform: uppercase;}
.titre_main span					{ color: #0082c2; }
.sous_titre 						{ font: 500 20px/30px "Barlow"; color: #0082c2; position: relative; margin-bottom: 20px;}
.sous_titre span.date  { font: 400 16px/30px "Barlow"; color: #44444480;}
.chapo		 						{ font: 500 16px/30px "Barlow";}
.link 								{ font: 700 13px/58px "Barlow"; letter-spacing: 0.6px; border-radius: 5px; text-transform: uppercase; height: 60px; border: none; display: inline-block; vertical-align: middle; color: #fff; padding: 0 30px; background: linear-gradient(to top, #1e2b50 0% 50%, #0082c2 50% 100%); background-size: 100% 200%; background-position: 0 100%;}

@media (min-width:1201px) {
.link:hover 						{ background-position:0 0; }
.second_link.active:hover,                  
.second_link:hover                  { color: #ffffff; }
}
@media (max-width:1200px) {
.wrapper 							{ min-width: inherit; max-width: 800px;}
}
@media (max-width:1000px) {
.titre_main	 						{ font-size: 22px; line-height: 32px;}
}
@media (max-width:600px) {
.wrapper 							{ width: 85vw;}
.titre_main	 						{ font-size: 24px; line-height: 34px;}
.sous_titre							{ font-size: 18px; line-height: 28px;}
.link 								{ padding: 0 25px;}
}


/***** header et menu *****/
.header 							{ width: 100%; background: #fff; font-size: 0; line-height: 0; text-align: right; position: absolute; left: 0; top: 0; z-index: 120; transition: 300ms ease-in-out; transition-property: margin, box-shadow;}
.header .logo						{ width: 285px; position: absolute; left: 5vw; top: 22px; z-index: 120;}
.header .logo img					{ width: 100%; height: auto;}
.header_top 						{ position: absolute; top: 20px; right: 5vw; transition: margin 400ms ease-in-out; background: transparent; z-index: 100;}
.header_top .lang					{ width: 55px; display: inline-block; vertical-align: middle; position: relative; text-align: left; font: 500 14px/30px "Barlow"; color: #264575; background: url("../images/arrow_sub.svg") 100% 48% no-repeat; padding: 0 0 0 15px; margin-left: 25px;  transition: 400ms all ease-in-out; }
.header_top .lang div				{ position: absolute; left: 0; right: -5px; top: 100%; background: #1e2b50; opacity: 0; visibility: hidden; padding: 10px 15px; border-radius: 5px; transition: all ease-in-out 400ms;}
.header_top .lang a,
.header_top .lang span 				{ position: relative; display: block; color: #264575;}
.header_top .lang a 				{ color: #fff;}
.header_top .lang:hover div 		{ opacity: 1; visibility: visible;}
.header_nav							{ position: relative;}
.menu_top							{ display: inline-block; padding-top: 20px; margin-right: 5vw; margin-bottom: -10px; padding-right: 80px;}
.menu_top li						{ display: inline-block; vertical-align: middle; position: relative; margin-left: 30px;}
.menu_top li:after					{ width: 1px; height: 11px; content: ""; position: absolute; right: -16px; top: 9px; background: #ccc;}
.menu_top li:last-child:after 		{ display: none;}
.menu_top li a						{ font: 500 14px/30px "Barlow"; color: #6f6f6f; height: 30px; display: block;}
.menu_top li.active a				{ color: #0082c2;}
.menu								{ position: relative; padding-right: 5vw;}
.menu li							{ display: inline-block; vertical-align: middle; position: relative; margin-left: 50px;}
.menu li i              			{ display: inline-block; vertical-align: middle; margin-left: 10px;}
.menu li i:before       			{ content: url("../images/arrow_sub.svg");}
.menu>li>a							{ font: 700 16px/80px "Barlow"; letter-spacing: 1px; color: #1e2b50; text-transform: uppercase; height: 80px; display: inline-block; vertical-align: middle; transition-property: color, background, height, line-height;}
.menu>li.active>a 					{ color: #0082c2;}
.sub								{ width: 220px; position: absolute; top: 100%; left: 50%; margin-left: -110px; display: block; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; overflow: hidden;}
.sub.sized							{ width: 320px; margin-left: -160px;}
.sub li								{ width: 100%; margin: 0;}
.sub li a							{ display: block; width: 100%; font: 500 16px/48px "Barlow"; height: 50px; background: #1e2b50; color: #fff; padding: 0 30px; text-align: center;}
.sub li.active a					{ background: #0082c2;}

.sticky .header 					{ box-shadow: 0 0 30px 0 rgba(0,0,0,0.1); position: fixed;}

@media (min-width:1201px) {
.menu .vue_mobile,
.menu_mobile 						{ display: none;}
.sub 								{ display: block !important; visibility: hidden; opacity: 0;}
.lang a:hover,
.menu_top li a:hover,
.menu>li:hover>a					{ color: #0082c2;}
.menu li:hover .sub					{ opacity: 1; visibility: visible; z-index: 999;}
.sub li a:hover						{ background: #0082c2; }

.sticky .header						{ margin-top: -40px;}
.sticky .header .logo				{ width: 200px; top: 52px;}
.sticky .header_nav .menu>li>a		{ height: 80px; line-height: 80px;}
}
@media (max-width:1200px) {
.menu_mobile						{ width: 80px; height: 80px; display: inline-block; vertical-align: middle; cursor: pointer; position: relative; margin: 0 -25px; transition: height 400ms ease-in-out;}
.menu_mobile div					{ width: 30px; height: 2px; background: #0082c2; position: absolute; right: 50%; top: 50%; margin: -1px -15px 0 0;}
.menu_mobile div:before				{ width: 100%; height: 2px; background: #2c4e83; position: absolute; right: 0; top: 8px; content: "";}
.menu_mobile div:after				{ width: 100%; height: 2px; background: #2c4e83; position: absolute; right: 0; top: -8px; content: "";}
.menu_mobile.active div				{ height: 0;}
.menu_mobile.active div:before		{ top: 0; transform: rotate(45deg);}
.menu_mobile.active div:after		{ top: 0; transform: rotate(-45deg);}
.header .logo						{ width: 205px; top: 12px;}
.header ::-webkit-scrollbar			{ display:none;}
.header_top							{ position: relative; top: auto; right: auto; padding-right: 5vw; display: block;}
.header_top .lang					{ margin: 0 30px 0 0; background-position: 100% 50%;}
.header_nav 	  					{ width: 100%; height: 100vh; border-top: 80px solid #fff; background: #151e38; position: absolute; right: -120%; top: 0; overflow-y: scroll; display: grid; grid-template-rows: auto auto 1fr; align-items: start; grid-gap: 30px; padding: 0 5vw; transform: skewX(20deg); transition: all 600ms ease-in-out 400ms;}
.menu_top							{ text-align: left; padding: 0; margin: 30px 0 0 0; grid-row: 2; transition: all 400ms ease-in-out 0ms; opacity: 0;}	
.menu_top li 						{ display: block; margin: 0;}
.menu_top li:after					{ display: none;}
.menu_top li a						{ color: #fff; font-size: 16px; line-height: 40px; letter-spacing: 0.6px; height: auto;}
.menu  								{ grid-row: 1; padding: 5vw 0 0 0; text-align: left; opacity: 0; margin-top: 30px; transition: all 400ms ease-in-out 100ms;}
.menu li 							{ display: block; margin: 0;}
.menu>li>a							{ font-size: 20px; line-height: 50px; font-weight: 600; letter-spacing: 1.2px; height: auto; color: #fff;}
.menu li i							{ width: 100%; height: 50px; position: absolute; left: 0; top: 0; margin: 0;}
.menu li i:before       			{ position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.sub 								{ width: auto; position: relative; left: auto; top: auto; padding: 20px 0; margin: 15px 0; background: #1e2b50; border-radius: 5px; display: none;}
.sub.sized							{ width: auto; margin-left: 0;}
.sub li a							{ font-size: 16px; line-height: 38px; height: 40px; background: none; text-align: left;}
.sub li.active a					{ background: none; color: #0082c2;}
.header_nav.active					{ right: 0; transform: skewX(0deg); transition-delay: 0ms;}
.header_nav.active .menu 			{ opacity: 1; margin: 0; transition-delay: 600ms;}
.header_nav.active .menu_top		{ opacity: 1; margin: 0; transition-delay: 700ms;}
}
@media (max-width:1050px) {
.header_nav 	  					{ transform: skewX(15deg);}
}
@media (max-width:700px) {
.header_nav 	  					{ transform: skewX(10deg); right: -130%;}
}
@media (max-width:600px) {
.menu_mobile						{ height: 70px;}
.header .logo						{ width: 170px; left: 7.5vw; top: 10px;}
.header_top							{ padding-right: 7.5vw;}
.header_nav 	  					{ border-width: 70px; padding: 0 7.5vw;}
.menu  								{ padding: 7.5vw 0 0 0;}
.menu>li>a							{ font-size: 18px;}
.sub 								{ padding: 15px 0; margin: 10px 0;}
.sub li a							{ padding: 8px 7.5vw; height: auto; line-height: 24px;}
}
@media (max-width:400px) {
.header .logo						{ width: 155px;}
}


/***** annonce *****/
.annonce							{ background: #1e2b50; color: #fff; text-align: center; padding: 0 5vw; line-height: 0;}
.annonce p							{ font: 500 16px/24px "barlow"; padding: 12px 0 14px 0;}
.annonce p a						{ color: #0685c3;}

@media (min-width:1201px) {
.annonce p a:hover					{ color: #fff;}
}
@media (max-width:600px) {
.annonce							{ padding: 0 7.5vw;}
.annonce p							{ font-size: 14px; line-height: 22px; letter-spacing: 0.6px;}
}


/***** footer *****/
.footer								{ width: 100%; position: relative; padding-top: 100px; color: #fff; background: #1e2b50; font-size: 0; z-index: 5; overflow: hidden;}
.footer:before              		{ width: 522px; height: 580px; position: absolute; left: -180px; top: -60px; background: url("../images/star.svg") 50% / cover no-repeat; opacity: 0.1; content: "";}
.footer .logo			            { font: 700 30px/30px "Barlow"; color: #fff; text-transform: uppercase; margin-bottom: 20px;}
.footer .logo span	            	{ color: #0082c2;}
.footer .logo span:last-child	    { font-size: 15px; color: #fff;}
.footer .bloc_footer 				{ display: inline-block; vertical-align: top; margin-right: 100px;}
.footer .bloc_footer.image			{ margin-right: 0;}
.footer .bloc_footer p				{ font-size: 16px;}
.footer .bloc_footer p a			{ color: #fff;}
.footer .bloc_footer .mail  	    { margin: 20px 0 5px 0;}
.footer .bloc_footer .mail a	    { color: #0082c2;}
.footer .bloc_footer .tel			{ margin-top: 15px;}
.footer .bloc_footer li a			{ color: #fff; font-size: 16px; line-height: 40px; background:url("../images/list_arrow.svg") 0 50% no-repeat; padding-left: 20px;}
.footer	.rs							{ position: absolute; right: 0; top: 0;}
.footer	.rs a						{ width: 60px; height: 60px; display: inline-block; vertical-align: middle; margin-left: 10px; border-radius:5px;}
.footer	.rs .linkedin				{ background: url(../images/linkedin.svg) 50% no-repeat #0082c2; margin: 0;}
.footer	.rs .facebook				{ background: url(../images/facebook.svg) 50% no-repeat #0082c2;}
.footer	.rs .scroll					{ background: url(../images/scrolltop.svg) 50% no-repeat #151e38;}
.footer_bottom   					{ padding: 20px 0; line-height: 0; margin-top: 80px;}
.footer_bottom li 					{ display: inline-block; font-size: 13px; line-height: 30px; letter-spacing: 0.6px; margin-right: 25px; position: relative;}
.footer_bottom li:after				{ width: 1px; height: 9px; content: ""; position: absolute; right: -13px; top: 11px; background: #0082c2;}
.footer_bottom li:last-child:after 	{ display: none;}
.footer_bottom li a					{ color: #fff;}
.toponweb							{ display: block; z-index: 85; position: fixed; right: 0; bottom: -65px; transition: bottom 400ms ease-in;}
.toponweb span						{ width: auto; display: block; padding: 20px; background: linear-gradient(to left, #151e38 0%, #151e38 50%, #0082c2 50%, #0082c2 100%); background-size: 200% 100%; background-position: 100% 0;}
.toponweb img						{ width: 76px; height: auto; display: block; margin: 0 auto;}
.toponweb.show						{ bottom: 0;}

@media (min-width:1201px) {
.footer .bloc_footer p a:hover,
.footer .bloc_footer li a:hover,
.footer_bottom li a:hover			{ color: #0082c2;}
.footer .bloc_footer .mail a:hover  { color: #fff;}
.footer	.rs .facebook:hover,
.footer	.rs .linkedin:hover         { background-color: #151e38;}
.footer	.rs .scroll:hover			{ background-color: #0082c2;}
.toponweb:hover span				{ background-position: 0 0;}
}
@media (max-width:1200px) {
.footer .logo			            { margin-bottom: 40px;}
.footer .bloc_footer 				{ margin-right: 80px;}
}
@media (max-width:1000px) {
.footer								{ padding-top: 80px;}
.footer ul.bloc_footer 				{ display: none;}
.footer .bloc_footer 				{ margin-right: 60px;}
.footer_bottom   					{ margin-top: 60px;}
.footer_bottom 	 					{ margin-top: 40px;}
.footer_bottom li 					{ display: block; margin-right: 0; line-height: 26px;}
.footer_bottom li:after				{ display: none; }
}
@media (max-width:600px) {
.footer								{ padding-top: 60px;}
.footer:before 						{ display: none;}
.footer .logo			            { font-size: 24px; line-height: 30px; margin-bottom: 15px;}
.footer .logo span:last-child	    { font-size: 13px;}
.footer	.rs							{ position: static; margin-top: 30px;}
.footer_bottom 	 					{ margin: 10px 0;}
.footer .bloc_footer.image          { margin-top: 50px;}
}




