/***** fonts et reset *****/
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;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; font-size: 17px;}
ul									{ list-style-type: none;}
body								{ font: 500 15px/30px "Quicksand"; letter-spacing: 0.6px; color: #000; background: #fff; position: relative;}
body.active_overflow				{ height: 100vh; overflow: hidden;}
a									{ text-decoration: none; color: #000; position: relative;}
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;}

@media (max-width:600px) {
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: #2b7172;}


/***** 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: 1200px; margin: 0 auto; position: relative;}
.wrapper_large						{ max-width: 1600px;}
.clear								{ clear: both; display: block;}
.anchor								{ position: absolute; left: 0; top: -140px;}
.titre_cap							{ font: 500 12px/20px "Quicksand"; text-transform: uppercase; letter-spacing: 4px; color: #90cfd3; position: relative; margin-bottom: 15px; display: block;}
.titre_main	 						{ font: 500 30px/40px "Quicksand"; color: #f08a44; position: relative; margin-bottom: 15px;}
.titre_main.line:after				{ width: 40px; height: 5px; border-radius: 5px; display: block; background: #90cfd3; margin: 30px 0 25px 0; content: "";}
.sous_titre 						{ font: 500 20px/30px "Quicksand"; color: #f08a44; position: relative; margin-bottom: 15px;}
.chapo		 						{ font: 500 15px/30px "Quicksand"; margin-bottom: 15px;}
.chapo span	 						{ display: block; margin-top: 15px;}
.link 								{ font: 500 15px/58px "Quicksand"; height: 60px; border-radius: 25em; letter-spacing: 0.6px; display: inline-block; color: #fff; padding: 0 30px; background: linear-gradient(to top, #2b7172 0% 50%, #f08a44 50% 100%); background-size: 100% 200%; background-position: 0 100%;}
.quote 								{ position: relative;}
.quote:after						{ width: 40px; height: 20px; background: url("../images/quote.svg") 50% no-repeat; position: absolute; left: -40px; top: -20px; content: "";}
.quote:before						{ width: 40px; height: 20px; background: url("../images/quote.svg") 50% no-repeat; position: absolute; right: -40px; bottom: -20px; content: "";}
.green_color 						{ color: #2b7172;}
.orange_color 						{ color: #f08a44;}

@media (min-width:1201px) {
.link:hover 						{ background-position: 0 0;}
}
@media (max-width:1200px) {
.titre_cap							{ margin-bottom: 10px;}
.titre_main	 						{ font-size: 25px; line-height: 35px;}
.titre_main.line:after				{ margin: 25px 0 20px 0;}
.sous_titre 						{ font-size: 18px; line-height: 28px;}
}
@media (max-width:1000px) {
.wrapper 							{ max-width: 750px;}
.titre_main	 						{ font-size: 26px; line-height: 36px;}
}
@media (max-width:600px) {
.wrapper 							{ width: 86vw;}
.titre_cap							{ font-size: 10px; line-height: 16px;}
.titre_main	 						{ font-size: 20px; line-height: 28px; margin-bottom: 10px;}
.titre_main.line:after				{ display: none;}
.sous_titre 						{ font-size: 16px; line-height: 24px; margin-bottom: 10px;}
.chapo		 						{ font-size: 13px; line-height: 26px; margin-bottom: 10px;}
.chapo span	 						{ margin-top: 10px;}
.link 								{ font-size: 13px; line-height: 48px; height: 50px; padding: 0 25px;}
}


/***** 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; padding-bottom: 15px; background: #fff; transition: all 300ms ease-in-out;}
.header .logo							{ width: 168px; position: absolute; left: 0; top: 30px; z-index: 205; transition: all 300ms ease-in-out;}
.header .logo img						{ width: 100%; height: auto; display: block;}
.header .link							{ position: absolute; right: 0; top: 60px; line-height: 50px; height: 50px;}
.header .langs  						{ position: absolute; right: 0; top: 8px;}
.header .langs a						{ font: 500 14px/40px "Quicksand"; letter-spacing: 0.6px; height: 40px; display: inline-block; color: #2b7172; z-index: 10; text-transform: uppercase; font-weight: 600;}

.header .header_nav 					{ display: block; position: relative;}

.header .menu_top						{ padding: 8px 12px 12px 0; position: relative;}
.header .menu_top>li 					{ position: relative; display: inline-block; vertical-align: top; margin-right: 40px;}
.header .menu_top>li:after				{ width: 1px; height: 10px; content: ""; position: absolute; right: -20px; top: 16px; background: #2b7172;}
.header .menu_top>li a					{ font: 500 14px/40px "Quicksand"; letter-spacing: 0.6px; height: 40px; display: block; color: #2b7172;}
.header .menu_top>li.active>a 			{ color: #f08a44;}

/*
.header .menu_top>li:last-child 		{ margin-right: 0;}
.header .menu_top>li:last-child:after 	{ display: none;}
*/

.header .menu 							{ padding-right: 220px; margin-top: -10px; position: relative;}
.header .menu>li						{ display: inline-block; vertical-align: middle; margin-left: 40px; position: relative;}
.header .menu>li a						{ font: 500 17px/70px "Quicksand"; letter-spacing: 0.6px; height: 70px; display: block; color: #2b7172;}
.header .menu>li.active>a				{ color: #f08a44;}

@media (min-width:1201px) {
.menu_mobile 							{ display: none;}
.header .menu_top>li a:hover,
.header .menu>li:hover>a,	
.header .sub li a:hover 				{ color: #f08a44;}

.sticky .header										{ box-shadow: 0 5px 40px 0 rgb(144 207 211 / 20%);}
.sticky:not(.scrolling_top) .header					{ top: -50px; padding-bottom: 0;}
.sticky:not(.scrolling_top) .header .logo			{ width: 130px; top: 65px;}
.sticky:not(.scrolling_top) .header .menu>li>a 		{ line-height: 88px; height: 90px;}
.sticky:not(.scrolling_top) .header .link 			{ top: 70px;}
.sticky:not(.scrolling_top) .header .menu_top .sub 	{ opacity: 0; visibility: hidden;}
}
@media (max-width:1400px) {
.header .menu>li						{ margin-left: 25px;}
}
@media (max-width:1350px) {
.header .menu>li a						{ font-size: 15px;}
}
@media (max-width:1200px) {
.header  								{ padding-bottom: 0;}
.header ::-webkit-scrollbar 			{ display: none;}
.header .logo							{ width: 140px; top: 20px;}
.header .link							{ position: relative; right: auto; top: auto; vertical-align: middle; margin-right: 5vw; z-index: 205;}

.header .langs  						{ position: absolute; right: 5vw; margin-right: 260px; top: 30px; z-index: 205; opacity: 0; visibility: hidden; transition: all 300ms ease-in-out 0ms;}
.header .langs a						{ font-size: 16px; width: 40px; height: 40px; line-height: 38px; border-radius: 50%; background: #fff; text-align: center;}

.menu_mobile							{ width: 60px; height: 100px; display: inline-block; vertical-align: middle; cursor: pointer; position: relative; z-index: 250; margin: 0 -10px; transition: height 300ms ease-in-out;}
.menu_mobile div						{ width: 40px; height: 2px; background: #2b7172; position: absolute; right: 50%; top: 50%; margin: -1px -20px 0 0;}
.menu_mobile div:before					{ width: 100%; height: 2px; background: #2b7172; position: absolute; right: 0; top: 8px; content: "";}
.menu_mobile div:after					{ width: 100%; height: 2px; background: #2b7172; 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 .header_nav 					{ width: 100%; height: 100vh; position: fixed; right: -100%; top :0; overflow-y: scroll; padding: 0; z-index: 200; background: #fff; border-top: 100px solid #d7ecee; display: grid; grid-template-rows: auto 1fr; grid-gap: 40px; padding: 5vw; transition: all 500ms ease-in-out 300ms;}
.header .menu_top						{ position: relative; right: auto; top: auto; grid-area: 2; text-align: left; border-top: 2px solid #d7ecee; padding-top: 35px; opacity: 0; transition: all 300ms ease-in-out 0ms;}
.header .menu_top>li 					{ display: block; margin: 0;}
.header .menu_top>li:after				{ display: none;}
.header .menu_top>li a					{ font-size: 16px; line-height: 40px; height: auto;}

.header .menu  							{ display: block; text-align: left; padding: 0; position: relative; z-index: 100; opacity: 0; transition: all 300ms ease-in-out 0ms;}
.header .menu>li 						{ display: block; margin: 0; position: relative;}
.header .menu>li>a						{ font-size: 20px; line-height: 60px; height: 60px; transition: none;}
.header .menu>li>i						{ width: 40px; height: 40px; display: block; margin-top: -50px; position: relative; z-index: 5; float: right;}
.header .menu>li>i:after				{ width: 40px; height: 100%; border-radius: 50%; background: url("../images/arrow_sub.svg") 50% 55% no-repeat #2b7172; float: right; content: "";}
.header .menu>li>i.active:after 		{ transform: rotate(180deg);}

.header .menu .sub 						{ width: 100%; position: relative; left: auto; top: auto; padding: 20px 40px; margin: 10px 0 30px 0; background: #d7ecee; visibility: visible; opacity: 1; box-shadow: none; text-align: left; display: none;}
.header .menu .sub ul					{ padding: 0;}
.header .menu .sub li					{ width: 100%; margin: 0; position: relative;}
.header .menu .sub li:after				{ display: none;}

.header.active .langs 					{ opacity: 1; visibility: visible; transition-delay: 400ms;}
.header.active .header_nav 				{ right: 0; transition-delay: 0ms;}
.header.active .menu_top,
.header.active .menu					{ opacity: 1; transition-delay: 400ms;}
}
@media (max-width:1000px) {
.header .header_nav 					{ padding: 7vw 5vw;}
}
@media (max-width:600px) {
.header .logo							{ width: 100px; top: 15px;}
.header .link							{ width: 46px; height: 46px; padding: 0; font-size: 0; background: url("../images/tel_white.svg") 50% no-repeat #2b7172; border-radius: 50%; margin-right: 7.5vw;}
.header .langs  						{ right: 7vw; margin-right: 105px; top: 14px; z-index: 205; opacity: 0; visibility: hidden; transition: all 300ms ease-in-out 0ms;}
.header .langs a						{ font-size: 14px; width: 46px; height: 46px; line-height: 44px;}
.menu_mobile							{ height: 74px;}
.menu_mobile.active div					{ transform: scale(0.9);}
.header .header_nav 					{ border-width: 74px; padding: 40px 7vw 100px 7vw; grid-gap: 30px;}
.header .menu_top						{ padding-top: 25px;}
.header .menu_top>li a					{ font-size: 14px; line-height: 36px;}
.header .menu>li>a						{ font-size: 16px; line-height: 50px; height: 50px;}
.header .menu>li>i						{ height: 36px; margin-top: -43px;}
.header .menu>li>i:after				{ width: 36px; background-size: 14px auto; background-position: 50% 52%;}
.header .menu .sub 						{ padding: 15px 25px; margin: 10px 0 20px 0; border-radius: 7px;}
.header .menu .sub ul					{ grid-template-columns: 1fr;}
.header .menu .sub li a					{ font-size: 13px; height: 35px; line-height: 35px;}
}



/***** ul list *****/
.ul_list								{ margin-bottom: 15px;}
.ul_list li								{ padding: 5px 0 5px 20px; position: relative;}
.ul_list li:before						{ position: absolute; left: 0; top: 17px; width: 6px; height: 6px; border-radius: 50%; background: #90cfd3; content: "";}

@media (max-width:600px) {
.ul_list								{ margin-bottom: 10px;}
.ul_list li								{ padding-left: 16px;}
.ul_list li:before						{ width: 5px; height: 5px;}
}


/***** ul check *****/
.ul_check								{ margin-bottom: 15px; padding-top: 5px;}
.ul_check li							{ position: relative; padding-left: 30px; background: url("../images/list_check.svg") 0 7px no-repeat; margin-top: 8px;}
.ul_check li:first-child				{ margin-top: 0;}



/***** avis *****/
.avis .row 								{ background: #fff; box-shadow: 0 15px 40px 0 rgb(144 207 211 / 30%); border-radius: 20px; padding: 50px 60px; position: relative; height: 100%;}
.avis .row:before 						{ width: 40px; height: 20px; background: url("../images/quote.svg") 50% no-repeat; position: absolute; left: 60px; top: -10px; content: "";}
.avis .author							{ color: #f08a44; margin-top: 15px; line-height: 26px;}

@media (max-width:1200px) {
.avis .row 								{ box-shadow: 0 10px 30px 0 rgb(144 207 211 / 30%); padding: 40px;}
.avis .row:before 						{ left: 40px;}
}
@media (max-width:600px) {
.avis .row 								{ box-shadow: none; border-radius: 10px; padding: 25px 30px;}
.avis .row:before 						{ left: 25px 30px;}
.avis .author							{ margin-top: 10px; line-height: 22px;}
}


/***** faq *****/
.show_hide                        	{ position: relative; margin: 25px 0;}
.show_hide .item                  	{ margin-top: 15px;}
.show_hide .titre                 	{ position: relative; cursor: pointer; padding: 20px 80px 20px 35px; font: 500 15px/24px "Quicksand"; background: #2b7172; color: #fff; overflow: hidden; border-radius: 25em; transition: all 300ms ease-in-out;}
.show_hide .titre:after          	{ width: 20px; height: 20px; background: url(../images/plus.svg) 50% no-repeat; border-radius: 50%; position: absolute; right: 30px; top: 50%; margin-top: -10px; transition: all 300ms ease-in-out; content: "";}
.show_hide .titre.active   			{ background-color: #76bfc1;}
.show_hide .titre.active:after   	{ transform: rotate(45deg);}
.show_hide .hide                  	{ padding: 30px 35px 20px 35px; display: none;}
.show_hide .hide p 					{ margin-bottom: 15px;}
.show_hide .hide :last-child 	 	{ margin-bottom: 0;}

@media (min-width:1201px) {
.show_hide .titre:hover 			{ background-color: #76bfc1;}
}
@media (max-width:600px){
.show_hide                        	{ margin: 15px 0;}
.show_hide .item                  	{ margin-top: 10px;}
.show_hide .titre                 	{ padding: 15px 75px 15px 25px; font-size: 13px; line-height: 22px; border-radius: 8px;}
.show_hide .titre:after          	{ right: 25px;}
.show_hide .hide                  	{ padding: 20px 20px 10px 20px; display: none;}
.show_hide .hide p 					{ margin-bottom: 10px;}
}



/***** cta *****/
.cta 								{ position: relative; text-align: center; margin: 100px 0 120px 0;}
.cta .titre_main					{ margin: 5px 0 10px 0;}
.cta div 							{ font-size: 20px; margin: 0;}
.cta div a  						{ display: inline-block;}
.cta div a span						{ color: #000;}

@media (min-width:1201px) {
.cta div a:hover,
.cta div a:hover span	 			{ color: #f08a44;}
}
@media (max-width:1400px) {
.cta 								{ margin: 80px 0 100px 0;}
}
@media (max-width:1200px) {
.cta 								{ margin: 70px 0 80px 0;}
.cta img 							{ width: auto; height: 80px;}
.cta div 							{ font-size: 18px;}
}
@media (max-width:1000px) {
.cta 								{ margin: 60px 0 70px 0;}
}
@media (max-width:600px) {
.cta 								{ margin: 30px 0 40px 0;}
.cta img 							{ height: 50px;}
.cta div 							{ font-size: 0;}
.cta .titre_main					{ margin: 5px 0;}
.cta div a  						{ font: 500 13px/48px "Quicksand"; height: 50px; border-radius: 25em; letter-spacing: 0.6px; display: inline-block; color: #fff; text-align: center; background: #2b7172; width: 160px; margin-top: 10px;}
.cta div a span						{ display: none;}
}



/***** footer *****/
.footer								{ position: relative; background: #2b7172; color: #fff; font-size: 0; padding-top: 110px; overflow: hidden;}
.footer:after						{ width: 335px; height: 360px; background: url("../images/shape_c.svg") 50% no-repeat; position: absolute; right: -150px; top: -150px; opacity: 0.25; content: "";}
.footer:before						{ width: 335px; height: 360px; background: url("../images/shape_c.svg") 50% no-repeat; position: absolute; left: -150px; bottom: -150px; opacity: 0.25; transform: scaleX(-1); content: "";}

.footer .bloc_footer 				{ display: inline-block; vertical-align: top;}
.footer .bloc_footer img			{ display: block; margin-bottom: 35px;}
.footer .bloc_footer p				{ font-size: 15px; line-height: 26px; letter-spacing: 0.8px; margin-top: 15px;}

.footer .bloc_footer p a			{ color: #fff; padding-left: 30px; display: inline-block;}
.footer .bloc_footer p a.tel		{ background: url("../images/tel.svg") 0 52% no-repeat;}
.footer .bloc_footer p a.email		{ background: url("../images/email.svg") 1px 52% no-repeat;}

.footer ul.bloc_footer     			{ margin: 70px 0 0 90px;}
.footer ul.bloc_footer li   		{ margin-bottom: 2px;}
.footer ul.bloc_footer li a 		{ font-size: 14px; line-height: 36px; letter-spacing: 0.6px; padding: 5px 0 5px 20px; background: url("../images/list_footer.svg") 0 52% no-repeat; color: #fff;}

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

.footer .certi 						{ background: #fff; padding: 30px; border-radius: 20px; text-align: center; display: inline-block; margin: 80px 0 0 100px; position: relative; z-index: 10;}
.footer .certi span					{ display: block; font-size: 15px; line-height: 20px; font-weight: 700; letter-spacing: 0.4px; color: #000; margin-bottom: 10px;}
.footer .certi img					{ display: block;}

.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: 0.8px; position: relative;}
.footer_bottom li a 				{ color: #fff;}
.footer_bottom li:after				{ width: 1px; height: 9px; content: ""; position: absolute; right: -15px; top: 5px; background: #76bfc1;}
.footer_bottom li:last-child:after 	{ display: none;}

.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, #fff 0% 50%, #d7ecee 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_bottom li a:hover, 			
.footer .bloc_footer li a:hover, 
.footer .bloc_footer p a:hover	 	{ color: #76bfc1;}
.footer	.rs a:hover  				{ background-color: #d7ecee25;}
.toponweb:hover span				{ background-position: 0 0;}
}
@media (max-width:1400px) {
.footer								{ padding-top: 100px;}
}
@media (max-width:1200px) {
.footer								{ padding-top: 80px;}
.footer:before						{ display: none;}
.footer ul.bloc_footer     			{ display: none;}
.footer .certi 						{ padding: 25px; border-radius: 15px; margin: 60px 0 0 80px;}
.footer .certi img					{ width: 120px; height: auto; display: block; margin: 0 auto 5px auto;}
.footer_bottom   					{ margin-top: 70px;}
}
@media (max-width:1000px) {
.footer								{ padding-top: 70px;}
.footer:after						{ display: none;}
.footer .certi 						{ width: 180px; padding: 30px 20px; display: block; margin: 50px 0 0 0;}
.footer_bottom   					{ margin-top: 40px;}
}
@media (max-width:600px) {
.footer								{ padding-top: 40px;}
.footer .bloc_footer 				{ width: 100%;}
.footer .bloc_footer img			{ margin-bottom: 25px; width: 100px; height: auto;}
.footer .bloc_footer p				{ font-size: 13px; line-height: 24px; margin-top: 10px;}

.footer	.rs							{ position: static; margin: 40px auto 25px auto;}
.footer	.rs a						{ width: 46px; height: 46px;}
.footer	.rs .scroll 				{ float: right;}

.footer .certi 						{ width: 160px; padding: 25px 15px; display: block; margin: 40px 0 0 0; border-radius: 10px;}
.footer .certi span					{ font-size: 12px; margin-bottom: 10px;}
.footer .certi img					{ width: 90px; margin-bottom: 0;}

.footer_bottom 	 					{ text-align: left; margin-top: 30px; padding: 0 0 20px 0;}
.footer_bottom li 					{ display: block; margin: 0; font-size: 11px; line-height: 26px;}
.footer_bottom li:after				{ display: none;}
}