/***** fonts et reset *****/
@import url('https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre&family=Poppins:wght@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: 600; font-size: 15px;}
ul									{ list-style-type: none;}
body								{ font: 400 14px/28px "poppins"; letter-spacing: 0.5px; color: #000; background: #fff; position: relative;}
body.active_overflow				{ height: 100vh; overflow: hidden;}
a									{ text-decoration: none; color: #0db0ed; position: relative;}
img									{ border: none;}
main 								{ position: relative; z-index: 10;}
#wrapper 							{ min-width: 320px; overflow: hidden; position: relative;}
#wrapper:after						{ width: 90vw; width: 1485px; height: 1485px; background: #182c83; position: absolute; left: calc(50% - 390px); transform: rotate(45deg); top: -1000px;  content: "";}
#wrapper *							{ box-sizing: border-box;}
#footer 							{ position: relative; z-index: 15;}

@media (max-width:1200px) {
#wrapper:after						{ display: none;}
}
@media (max-width:700px) {
body								{ font-size: 13px; line-height: 26px;}
strong, b							{ font-size: 14px;}
}


/***** scollbar *****/
::-webkit-scrollbar 				{ width: 6px; height: 6px; background-color: #fff;}
::-webkit-scrollbar-thumb			{ background-color: #0db0ed;}


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


/***** class *****/
.wrapper 							{ width: 90vw; max-width: 1300px; margin: 0 auto; position: relative;}
.wrapper_large						{ max-width: 1600px;}
.clear								{ clear: both; display: block;}
.anchor								{ position: absolute; left: 0; top: -140px;}
.titre_main	 						{ font: 700 30px/40px "poppins"; text-transform: uppercase; letter-spacing: 0.5px; color: #182c83; position: relative; margin-bottom: 15px;}
.titre_main span					{ font: 500 20px/30px "poppins"; text-transform: none; letter-spacing: 0.5px; color: #000; display: block; padding-top: 5px;}

.sous_titre 						{ font: 500 20px/30px "poppins"; position: relative; color: #182c83; margin-bottom: 15px;}
.chapo		 						{ font: 400 14px/28px "poppins"; }
.chapo span	 						{ display: block; margin-top: 15px;}

.link 								{ font: 500 14px/60px "poppins"; letter-spacing: 0.8px; height: 60px; text-transform: uppercase; display: inline-block; color: #fff; padding: 0 30px;  background: linear-gradient(to top, #0db0ed 0% 50%, #0c1641 50% 100%); background-size: 100% 200%; background-position: 0 100%; cursor: pointer; text-align: center;}

p a                                 { color: #0db0ed; border-bottom: 1px solid transparent;}

.link_plus							{ font: 700 12px/50px "poppins"; letter-spacing: 1px; height: 50px; text-transform: uppercase; display: inline-block; color: #156e63; padding: 0 0 0 65px;}
.link_plus:after					{ width: 50px; height: 50px; border-radius: 5px; background: url("../images/plus_white.svg") 50% no-repeat #ffb941; position: absolute; left: 0; top: 0; content: "";}


.link.green 						{ background-image: linear-gradient(to top, #239e98 0% 50%, #7bb528 50% 100%);}
.bloc_short 						{ max-width: 800px; margin: 0 auto; position: relative;}
.read_more							{ display: inline-block; color: #ae312e; cursor: pointer; transition: color 300ms ease-in-out;}
.hide 								{ display: none;}

@media (min-width:1201px) {
.link:hover 						{ background-position: 0 0; color: #fff;}
.link_plus:hover:after				{ background-color: #156e63;}
p a:hover                           { border-color: #0db0ed;}

}
@media (max-width:2000px) {
.wrapper_large						{ max-width: 1600px;}
}
@media (max-width:1200px) {
.wrapper 							{ min-width: inherit;}
.titre_main	 						{ font-size: 40px; line-height: 48px;}
.sous_titre 						{ font-size: 20px; line-height: 28px;}
.link 								{ line-height: 55px; height: 55px;}
}
@media (max-width:1000px) {
.wrapper 							{ max-width: 750px;}
.titre_main	 						{ font-size: 30px; line-height: 38px;}
.titre_main span					{ font-size: 18px; line-height: 28px;}
}
@media (max-width:600px) {
.wrapper 							{ width: 88vw;}
.titre_main	 						{ font-size: 20px; line-height: 26px; font-weight: 700; margin-bottom: 10px; color: #182c83;}
body                                { font-size: 13px; line-height: 26px;}
.titre_main span					{ font-size: 15px; line-height: 22px; padding-top: 4px; letter-spacing: 0.4px;}
.sous_titre 						{ font-size: 16px; line-height: 24px; margin-bottom: 10px;}
.chapo		 						{ font-size: 13px; line-height: 26px;}
.chapo span	 						{ margin-top: 10px;}
.link 								{ line-height: 50px; height: 50px; padding: 0 20px; background: #0db0ed; font-size: 12px;}
.link_plus							{ line-height: 50px; height: 50px; color: #fff; padding: 0 20px; border-radius: 5px; background: url("../images/arrow_link.svg") right+20px center no-repeat #156e63; width: 100%;}
.link_plus:after					{ display: none;}
}



/***** header et menu *****/
.header 							{ width: 100%; font-size: 0; line-height: 0; letter-spacing: 0; position: fixed; left: 0; top: 0; z-index: 100; text-align: right; background: transparent;}
.header .logo						{ width: 230px; position: absolute; left: 0; top: 20px; z-index: 140; transition: all 300ms ease-in-out;}
.header .logo img					{ width: 100%; height: auto; display: block;}
.header .tel 						{ font-size: 14px; font-weight: 500; line-height: 50px; height: 50px; color: #fff; padding-left: 40px; letter-spacing: 0.6px; background: url("../images/tel_blue.svg") 0 50% no-repeat; position: absolute; right: 0; top: 5px;}

.header .header_nav 				{ display: inline-block; position: relative; padding: 60px 0 30px 0; transition: all 300ms ease-in-out;}
.header .menu>li					{ position: relative; display: inline-block; vertical-align: top; margin-left: 40px;}
.header .menu>li:first-child 		{ margin-left: 0;}
.header .menu>li>a					{ font-size: 13px; line-height: 50px; font-weight: 500; height: 50px; letter-spacing: 0.8px; text-transform: uppercase; color: #fff; display: block;}
.header .menu>li.active>a			{ color: #0db0ed;}
.header .menu>li .link 				{ height: 50px; line-height: 50px; color: #156e63; letter-spacing: 1.6px; background-image: linear-gradient(to top, #fff 0% 50%, #0db0ed 50% 100%);}
.header .menu>li.active .link		{ color: #156e63;}

.header .sub						{ width: 240px; margin-left: -120px; text-align: center; position: absolute; top: calc(100% + 25px); left: 50%; display: block; visibility: hidden; opacity: 0; padding: 20px 0; background: #0c1641;}
.header .sub li						{ width: 100%; margin: 0;}
.header .sub li a					{ width: 100%; font-size: 15px; letter-spacing: 0.6px; line-height: 38px; height: 40px; font-weight: 400; text-transform: none; color: #fff;}
.header .sub li.active a			{ color: #0db0ed;}

.sticky .header 					{ background-color: #fff; box-shadow: 0 0 30px 0 rgb(32 37 43 / 18%);}

@media (max-width:1400px) {
.header .menu>li					{ margin-left: 30px;}
}
@media (min-width:1201px) {
.menu_mobile 						{ display: none;}
.header .menu>li:hover 				{ z-index: 999;}		
.header .tel:hover,
.header .menu>li:hover>a 			{ color: #0db0ed;}
.header .menu>li:hover .link 		{ color: #fff;}
.header .menu>li .sub a:hover 		{ color: #0db0ed;}
.header .menu>li:hover .sub			{ opacity: 1; visibility: visible; z-index: 999;}
.header .sub:before 				{ width: 100%; height: 10px; position: absolute; left: 0; top: -10px; content: "";}
.sticky .header .menu>li>a          { color: #0c1641;}
.sticky .header .menu>li.active>a   { color: #0db0ed;}
.sticky .header .tel                { color: #0c1641;}
.sticky .header .logo				{ width: 150px; top: 18px;}
.sticky .header .header_nav 		{ padding: 25px 0;}
.sticky .header .tel 				{ visibility: hidden; opacity: 0;}
}
@media (max-width:1400px) {
.sticky:not(.scrolling_top) .header .devis 				{ padding-top: 8px; line-height: 19px;}
}
@media (max-width:1200px) {
.menu_mobile						{ width: 70px; height: 100px; display: inline-block; vertical-align: middle; cursor: pointer; position: relative; z-index: 250; margin: 0 -15px; transition: height 300ms ease-in-out;}
.menu_mobile div					{ width: 40px; height: 2px; background: #182c83; position: absolute; right: 50%; top: 50%; margin: -1px -20px 0 0;}
.menu_mobile div:before				{ width: 100%; height: 2px; background: #182c83; position: absolute; right: 0; top: 9px; content: "";}
.menu_mobile div:after				{ width: 100%; height: 2px; background: #182c83; position: absolute; right: 0; top: -9px; 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 							{ padding: 0;}
.header:before						{ display: none;}
.header ::-webkit-scrollbar			{ display: none;}
.header .logo						{ width: 160px; top: 15px; z-index: 250;}
.header .tel 						{ display: inline-block; vertical-align: middle; position: relative; right: auto; top: auto; margin-right: 40px; z-index: 240; color: #182c83;}

.header .header_nav 				{ width: 100%; position: fixed; right: -100%; top: 0; bottom: 0; overflow-y: scroll; z-index: 200; background: #fff;  padding: 180px 0 80px 0; transition: all 300ms ease-in-out 200ms;}
.header .menu  						{ display: block; width: auto; text-align: left; margin: 0 15vw; position: relative; z-index: 100; opacity: 0; transition: all 300ms ease-in-out 0ms;}
.header .menu>li 					{ width: 100%; display: block; margin: 0;}
.header .menu>li:first-child 		{ border: none;}
.header .menu>li:last-child 		{ border: none;}
.header .menu>li>a					{ font-size: 14px; font-weight: 600; transition: none; color: #0c1641;}
.header .menu>li .link 				{ text-align: center; font-weight: 700; margin-top: 20px;}
.header .menu>li>i					{ width: 50px; height: 50px; display: block; margin-top: -50px; position: relative; z-index: 25; float: right; cursor: pointer;}
.header .menu>li>i:after			{ width: 50px; height: 100%; background: url("../images/bottom.svg") 50% no-repeat; background-size: 18px auto; float: right; content: "";}
.header .menu>li>i.active:after 	{ transform: rotate(180deg);}

.header .menu li .sub 				{ width: 100%; position: relative; left: auto; top: auto; margin: 5px 0 25px 0; visibility: visible; opacity: 1; display: none; z-index: 150; text-align: left; padding-left: 20px;}
.header .menu li .sub li  			{ width: 100%;}
.header .menu li .sub li a			{ width: 100%; line-height: 40px; height: 40px;}

.header.active .header_nav 			{ right: 0; transition-delay: 150ms;}
.header.active .menu 				{ opacity: 1; transition-delay: 600ms;}
}
@media (max-width:1000px) {
.header .menu  						{  margin: 0 10vw;}
}
@media (max-width:600px) {
.header 							{ padding: 0;}
.header .logo						{ width: 160px; top: 10px; left: 50%; transform: translateX(-50%);}
.header .tel 						{ width: 50px; font-size: 0; padding: 0; position: absolute; left: 0; top: 25px;}
.header .menu  						{ margin: 0 8vw;}
.header .menu>li>a					{ font-size: 12px; height: 44px; line-height: 44px;}
.header .menu>li .link 				{ margin-top: 15px; background: #fff;}

.header .menu>li>i					{ height: 44px; margin-top: -44px;}
.header .menu>li>i:after			{ width: 40px; background-size: 16px auto;}
.header .menu li .sub li a			{ font-size: 13px;}
}


/***** attente *****/
@media (max-width:1200px) {
.attente.header .tel 				{ margin: 25px 0;}
}
@media (max-width:600px) {
.attente.header .tel 				{ margin: 15px 0;}
}



/***** CTA *****/
.cta 								{ position: relative; display: grid; grid-template-columns: 1fr 1fr; background: #182c83;  overflow: hidden; text-align: center;}
.cta .titre							{ color: #182c83; background: #e6f7fd; font-size: 20px; line-height: 30px; font-weight: 700; text-transform: uppercase; padding:45px 50px; position: relative; z-index: 5; text-align: center;}
.cta .titre:before					{ width: 14px; height: 14px; background: #e6f7fd; transform: rotate(-45deg); position: absolute; right: -7px; top: 50%; margin-top: -7px; content: "";}
.cta .titre span					{ color: #0db0ed;}
.cta .link                          { min-width: 200px; padding: 0 10px;}
.cta .links     				    { position: relative; overflow: hidden; padding: 30px 15px; text-align: center; display: grid; align-items: center; grid-template-columns: auto auto; justify-content: center; gap: 10px;}
.cta .links .tel   					{ display: inline-block; vertical-align: middle;}
.cta .links .tel span       		{ background: url("../images/tel.svg") no-repeat center left; padding-left: 35px;}
.cta .links .mail   			    { display: inline-block; vertical-align: middle;}
.cta .links .mail span				{ background: url("../images/envoyer.svg") no-repeat center left; padding-left: 40px;}

@media (min-width: 1201px){
.cta .links .link:hover 				{ color: #fff;}
}
@media (max-width: 1200px){
.cta 								{ grid-template-columns: auto 1fr;}
}
@media (max-width: 1000px){
.cta 								{ grid-template-columns: 1fr;}
.cta .titre							{ padding: 30px;}
.cta .titre:before					{ right: 48%; margin: 0 7px 0 0; top: auto; bottom: -7px;}
}
@media (max-width: 600px){
.cta 								{ border-radius: 0; text-align: left; margin: 0 -6vw; padding: 40px 6vw 50px;}
.cta .titre							{ color: #fff; font-size: 20px; letter-spacing: .5px;text-transform: uppercase; padding: 0; background: none; margin: -5px 0 20px 0;}
.cta .titre:before					{ display: none;}
.cta .titre span					{ color: #0db0ed;}
.cta .links     					{ padding: 0;display: grid; grid-template-columns:  1fr 1fr ;}
.cta .links .tel span       		{ background: none; padding-left: 0;}
.cta .links .mail   			    { margin-left: 0;}
.cta .links .mail span				{ background: none; padding-left: 0;}
}

@media (max-width:500px) {
.cta .titre                         { font-size: 16px;} 
}


/***** ul list *****/
.ul_list									{ margin: 0 0 20px 0;}
.ul_list li									{ padding: 0 0 0 35px; position: relative; margin-top: 10px; }
.ul_list li::before 						{ content: ""; width: 10px; height: 10px; background-color: #0db0ed; left: 0; position: absolute; transform: rotate(45deg); top: 8px;}
.ul_list li>span							{ display: block; margin-top: 10px;}


@media (min-width:1201px) {
.ul_list li a:hover 						{ color: #0db0ed; border-color: #0c1641;}
}

@media (max-width:600px) {
.ul_list li::before                         { width: 8px; height: 8px; top: 8px; }
.ul_list li                                 { padding-left: 25px;}
}


/***** footer *****/
.footer										{ position: relative; background: #182c83; color: #fff; font-size: 0; padding-top: 90px; z-index: 5;}
.footer .bloc_footer 						{ display: inline-block; vertical-align: top; position: relative; margin-right: 120px; padding-left: 90px;}
.footer .bloc_footer.coordonnees            { padding-top: 20px;}
.footer .bloc_footer p						{ font-size: 13px; margin-top: 10px;}
.footer  .titre_main			            { font-size: 30px; line-height: 40px; color: #fff; margin: 0 0 20px 0;}
.footer .bloc_footer p a  					{ color: #fff;}

.footer .bloc_footer li a                   { color: #fff; }
.footer .bloc_footer li                     { margin-bottom: 7px; font-size: 13px;}
.footer .title_vertical                     { background-color: #0c1641; position: absolute; transform: rotate(-90deg) translateX(-100%); font: 500 14px/60px "poppins"; letter-spacing: 2px; color: #fff;  left: 0; top: 0; text-align: center; padding: 0 40px; text-transform: uppercase; transform-origin: left top;}
.footer	.logos								{ position: absolute; right: 80px; top: 0; display: grid; grid-template-columns: 1fr 1fr; grid-gap: 10px; width: 260px;}
.footer	.logos img							{ width: 100%; height: auto; display: block; border-radius: 5px; padding: 10px; background: #fff;}

.footer	.rs									{ position: absolute; right: 0; top: 0; font-size: 0; line-height: 0; letter-spacing: 0;}
.footer	.rs a								{ width: 50px; height: 50px;display: inline-block; vertical-align: top; margin-right: 10px;}
.footer	.rs .facebook						{ background: url("../images/facebook.svg") 50% no-repeat #0db0ed;}
.footer	.rs .scroll 						{ background: url("../images/scrolltop.svg") 50% 48% no-repeat #0db0ed; margin: 0;}

.footer_bottom   							{ padding: 20px 0; line-height: 0; margin-top: 80px;}
.footer_bottom li 							{ display: inline-block; font-size: 12px; line-height: 20px; margin-right: 30px; letter-spacing: 1px; position: relative;}
.footer_bottom li:after						{ width: 1px; height: 9px; content: ""; position: absolute; right: -15px; top: 5px; background: #fff;}
.footer_bottom li:last-child:after 			{ display: none;}
.footer_bottom li a							{ color: #fff;}

.toponweb									{ display: block; z-index: 85; position: absolute; right: 0; bottom: 0; transition: bottom 300ms ease-in-out;}
.toponweb span								{ width: auto; height: 60px; display: block; padding: 20px; background: linear-gradient(to left, #0c1641 0% 50%, #0db0ed 50% 100%); background-size: 200% 100%; background-position: 100% 0;}
.toponweb img								{ width: 76px; height: auto; display: block; margin: 0 auto; transition: all 300ms ease-in-out;}
.toponweb.show								{ bottom: 0;}

@media (min-width:1201px) {
.footer .bloc_footer a:hover,  
.footer_bottom li a:hover 	 				{ color: #0db0ed;}
.footer	.rs a:hover  						{ background-color: #0c1641;}
.toponweb:hover span						{ background-position: 0 0;}
}
@media (max-width:1200px) {
.toponweb                           { position: absolute;}
.footer .bloc_footer                { margin-right: 40px;}
}
@media (max-width:1000px) {
.footer                             { padding-top: 50px;}
.footer .bloc_footer 				{ margin: 0 0 40px; display: none;}
.footer .bloc_footer.coordonnees    { display: block;  padding: 40px 0 40px 90px;}
.footer .bloc_footer p              { margin: 0;}
}
@media (max-width:600px) {
.footer								{ text-align: center; padding-top: 40px;}
.footer .logo_footer img            { max-width: 165px;}
.footer .bloc_footer.coordonnees    { margin-right: 0; margin-bottom: 25px; padding: 0;}
.footer .title_vertical             { display: none;}
.footer .titre_main                 { font-size: 25px; line-height: 35px; margin-bottom: 15px;}
.footer .bloc_footer .mail,
.footer .bloc_footer .phone         { padding-left: 30px;}
.footer .bloc_footer .phone,
.footer .bloc_footer .mail          { background: #0db0ed; line-height: 50px; height: 50px; font-size: 13px; font-weight: 400; padding: 0 30px; display: block; margin: 10px auto; color: #fff; max-width: 300px; letter-spacing: 0.5px;}
.footer .bloc_footer .localisation  { background: none;}
.footer .bloc_footer .phone         { margin-top: 20px;}    
.rs a                               { width: 50px; height: 50px;}
.footer	.rs							{ position: static; margin-top: 30px;}
.footer .bloc_footer p              { font-size: 13px;}
.footer .rs .facebook               {   background-color:#0db0ed}
.footer_bottom 	 					{ text-align: left; padding: 0 0 50px; margin-top: 40px;}
.footer_bottom li 					{ display: block; margin-right: 0; line-height: 25px; font-size: 10px;}
.footer_bottom li:after				{ display: none;}
}
    

/***** table plus *****/
.table_plus 						{ position: relative; margin: 90px 0 100px;}
.table_plus>a                       { color: #ee4c14;}
.table_plus .item                   { text-align: left; margin-bottom: 10px;} 
.table_plus .hide 					{ padding: 20px 30px ; display: none;}
.table_plus .hide ul 				{ padding-left: 20px;}
.table_plus .titre_main             { margin-bottom: 30px;}
.titre_plus 						{ position: relative; letter-spacing: 0.5px; cursor: pointer; padding: 20px 80px 20px 30px; background: #e6f7fd; color: #182c83; font:  500 16px/30px "Poppins"; transition: all 400ms ease-in-out;}
.titre_plus:before					{ position: absolute; right: 30px; top: 23px; transition: all 400ms ease-in-out;  content: url(../images/plus.svg); line-height: 0;}
.titre_plus.active:before 			{ transform: rotate(45deg);}
@media (min-width:1201px) {
.table_plus>a:hover                 { color: #fff; background: #1b2a40;}
}

@media (max-width:1000px) {
.table_plus                         { margin: 50px 0;}
.table_plus .hide 					{ padding: 40px 0;}
}
@media (max-width:600px) {
.table_plus 						{ margin: 20px 0 50px;} 
.table_plus .titre_main             { margin-bottom: 20px;}
.table_plus .sized					{ margin-bottom: 20px;} 
.table_plus .hide 					{ padding: 20px 0;}
.titre_plus 						{ font-size: 14px; line-height: 22px; padding: 14px 55px 14px 20px; min-height: 50px; display: grid; align-items: center;}
.titre_plus:before                  { right: 20px;}
}

.link-moins,.link-plus              { cursor:pointer; color: #0db0ed; border-bottom: 1px solid transparent;}
.textMore                           { display: none; margin-top: 40px;}
.textMore p:not(:first-of-type)     { margin-top: 15px;}
@media (min-width:1201px) {
.link-moins:hover,.link-plus:hover  { border-color: #0db0ed;}
}