@charset "UTF-8";

@keyframes main-menu-appears{
    from
    {
        top: -150px;
    }
    to
    {
        top: 0;
    }
}

/* CLASSES GÉNÉRALES
----------------------------------------*/

html, body{
	text-align:				    center;
	padding:				    0;
	margin:					    0;
    background:                 #ffffff;
}

body{
    font-smoothing:             antialiased;
    -o-font-smoothing:          antialiased;
    -ms-font-smoothing:         antialiased;
    -moz-font-smoothing:        antialiased;
    -webkit-font-smoothing:     antialiased;
}

p, div, section, header, menu, header, span, a, img, table, form, td, tr, li, ul, h1, h2, h3, h4, iframe{
	padding:				    0;
	margin:					    0;	
}

h1{
    font-size:                  60px;
    line-height:                65px;
    font-family:                Montserrat, Arial;
    font-weight:                700;
    color:                      #26445f;
    text-align:                 center;
    text-transform:             uppercase;
    margin:                     0 0 45px;
    padding:                    0 0 22px;
	position: 					relative;
}

h1:after{
	position: 					absolute;
	width: 						465px;
	height: 					2px;
	background: 				#e3e3e3;
	content: 					'';
	left: 						0;
	right: 						0;
	margin: 					auto;
	bottom: 					0;
}

body.home h1{
	opacity: 					0;
	z-index: 					-1;
	position: 					fixed;
	top: 						0;
	left: 						0;
	height: 					0;
	width: 						0;
	overflow: 					hidden;
}

h2{
	color:                      #d5b120;
	font-family:                Montserrat, Arial;
    font-weight:               	500;
	font-size:                  22px;
    line-height:                25px;
   	text-align:                 left;
   	padding:                    0;
   	margin:						0 0 30px 0;
   	text-transform:             uppercase;
}

a,
a:link,
a:active
a:visited{
	text-decoration:		    none;
	border:					    none;
	color:                      #26445f;
    transition:                 all 0.3s;
}

a:hover{
	color: 						#ebc902;
}

a img{
	border:					    none;	
}

li{
    list-style:                 url(../img/list.png) inside;
}

img{
    border:                     none;
    vertical-align:             top;
}

a.editor-button,
button.editor-button,
span.editor-button a{
    appearance:                 none;
    -webkit-appearance:         none;
    border:                     0;
    border-radius:              0;
    cursor:                     pointer;
    text-decoration:            none;
    height:                     40px;
    line-height:                40px;
    display:                    inline-block;
    padding:                    0 49px 0 26px;
    box-sizing:                 border-box;
    font-weight:                600;
    text-transform:             none;
    font-size:                  18px;
    color:                      #fff;
    width:                      auto;
    text-align:                 left;
	border: 					0;
	border-radius: 				0;
    vertical-align:             top;
    transition:                 all 0.3s;
    background:                 url(../img/bt-next.png) no-repeat right 30px center #365e82;
}

a.editor-button:hover,
button.editor-button:hover,
span.editor-button a:hover{
    background-color: 			#ebc900;
}

/* NAVIGATION
----------------------------------------*/

#bt-nav{
	height: 					54px;
	width: 						54px;
	position: 					fixed;
	cursor: 					pointer;
	right: 						6vw;
	bottom: 					105px;
	z-index: 					998;
	background: 				#fff;
    transition:                 all 0.3s;
    opacity:                    0;
	display: 					flex;
}

#bt-nav.active{
    opacity:                    1;   
}

#bt-nav i{
	content: 					url(../img/up.png);
	transition: 				all 0.3s;
	margin: 					auto;
}

#bt-nav:hover{
	background: 				#ebc900;
}

#bt-nav:hover i{
	filter: 					brightness(0) invert(1);
}

/* HEADER
----------------------------------------*/

header{
    width:                      100%;
    height:                     auto;
    position:                   absolute;
    top:                        0;
    left:                       0;
    z-index:                    900;
    text-align:                 center;
    padding-top:                55px;
}

header.fixed{
    position:                   fixed;  
	background: 				#fff;
    animation-duration:         1s;
    animation-name:             main-menu-appears;
    animation-iteration-count:  1;
    box-shadow:                 0 0 10px -5px rgba(74, 74, 74, 0.8);
	padding-top: 				10px;
}

header .editor-container{
	padding-bottom: 			0;
}

header.fixed .editor-container{
	padding-bottom: 			10px;
}

header .logo img{
	margin: 					0;
	max-width: 					100%;
	padding-top: 				10px;
}

body.page header .logo img{
	width: 						290px;
	padding-top: 				0;
	margin-top: 				-30px;
}

@media screen AND (max-width: 1280px){
	body.page header .logo img{
		width: 						220px;
		margin-top: 				-45px;
	}
}

header.fixed .logo{
	display: 					none;
}

header .phone{
	background: 				#f2f2f2;
	height: 					37px;
	line-height: 				37px;
	font-size: 					20px;
	color: 						#26445f;
	font-weight: 				600;
	padding: 					0 22px;
	float: 						right;
	margin-right: 				62px;
}

header .phone i{
	content: 					url(../img/icon-phone.png);
	display: 					inline-block;
	margin-right: 				11px;
}

header.fixed .menus{
	width: 						auto;
	float: 						none;
}

/* MENU
----------------------------------------*/

#bt-menu{
	float: 						right;
	margin-top: 				9px;
	height: 					19px;
	width: 						auto;
	cursor: 					pointer;
	text-decoration: 			none;
	position: 					relative;
	z-index: 					401;
}

#bt-menu>div{
	display: 					inline-block;
	position: 					relative;
	width: 						39px;
	vertical-align: 			top;
}

#bt-menu>div span{
	background: 				#fff;
	width: 						39px;
	height: 					3px;
	left: 						0;
	top: 						0;
	position: 					absolute;
	transition: 				all 0.3s;
}

header.fixed #bt-menu>div span{
	background: 				#181818;
}

#bt-menu>div span:nth-child(2){
	top: 						8px;
}

#bt-menu>div span:nth-child(3){
	top: 						16px;
}

#bt-menu.active>div span{
	background: 				#181818;
}

#bt-menu.active>div span:nth-child(1){
	top: 						9px;
	transform: 					rotate(45deg);
}

#bt-menu.active>div span:nth-child(2){
	width: 						65px;
	left: 						54px;
	height: 					2px;
}

#bt-menu.active>div span:nth-child(3){
	top: 						9px;
	transform: 					rotate(-45deg);
}

#bt-menu p{
	display: 					inline-block;
	line-height: 				19px;
	color: 						#fff;
	font-size: 					20px;
	font-weight: 				500;
	text-transform: 			uppercase;
	margin-left: 				15px;
	vertical-align: 			top;
	transition: 				all 0.3s;
}

header.fixed #bt-menu p{
	color: 						#181818;
}

#bt-menu.active p{
	color: 						#ebc900;
}

#bt-menu:hover p{
	color: 						#ebc900;
}

header #main-menu{
	display: 					none;
	position: 					fixed;
	top: 						-100vh;
	left: 						0;
	margin: 					auto;
	right: 						0;
	width: 						100vw;
	height: 					100vh;
	background: 				#fff;
	flex-direction: 			column;
	justify-content: 			center;
	z-index: 					400;
}

header #main-menu>ul{
    width:                      500px;
    text-align:                 left;
    height:                     auto;
	opacity: 					0;
	margin: 					auto;
}

header #main-menu>ul>li{
    width:                      auto;
    display:                    block;
    position:                   relative;
	padding-bottom: 			20px;
}

header #main-menu>ul>li + li{
	margin-top: 				20px;
}

header #main-menu>ul>li>a{
    color:                      #26445f;
    font-size:                  27px;
    text-transform:             uppercase;
	display: 					inline-block;
    text-decoration:            none;
    font-weight:                600;
}

header #main-menu>ul>li:after{
	position: 					absolute;
	bottom: 					0;
	left:						0;
	width: 						90px;
	height: 					2px;
	background: 				#ebc900;
	content: 					'';
}

header #main-menu>ul>li.current_rubrique>a,
header #main-menu>ul>li:hover>a{
    color:                      #ebc900;
}

header #main-menu>ul>li>ul{
	display: 					block;
	margin-top: 				15px;
}

header #main-menu>ul>li>ul>li{
	display: 					block;
}

header #main-menu>ul>li>ul>li + li{
	margin-top: 				20px;
}

header #main-menu>ul>li>ul>li>a{
	display: 					inline-block;
	font-size: 					23px;
	color: 						#ebc900;
	line-height: 				26px;
	font-weight: 				500;
	text-decoration: 			none;
	text-transform: 			uppercase;
}

header #main-menu>ul>li>ul>li>a:hover,
header #main-menu>ul>li>ul>li.current_rubrique>a{
	color: 						#ebc900;
}

header #main-menu>ul>li>ul>li>ul{
	display: 					block;
	margin-top: 				12px;
}

header #main-menu>ul>li>ul>li>ul>li{
	display: 					block;
}

header #main-menu>ul>li>ul>li>ul>li + li{
	margin-top: 				5px;
}

header #main-menu>ul>li>ul>li>ul>li>a{
	font-size: 					19px;
	color: 						#376085;
	text-align: 				left;
	display: 					inline-block;
	padding-left: 				20px;
	background: 				url(../img/list.png) no-repeat left top 5px;
	margin-left: 				20px;
}

/* BANNIÈRE
----------------------------------------*/

section#banniere{
    width:                      auto;
	position: 					relative;
}

section#banniere .mask{
	position: 					absolute;
	z-index: 					1;
	left: 						0;
	top: 						0;
	max-width: 					822px;
	width: 						43vw;
	height: 					100%;
	background: 				url(../img/mask-banner.png) no-repeat left top;
	background-size: 			100% auto;
}

section#banniere>img{
	max-width: 					100%;
}

.banner-content{
	position: 					absolute;
	left: 						0;
	right: 						0;
	top: 						0;
	height: 					100% !important;
	display: 					flex;
	flex-direction: 			column;
	justify-content: 			flex-end;
	padding-bottom: 			19vh;
	box-sizing: 				border-box;
	z-index: 					2;
}

.banner-content .slogan{
	font-size: 					4.15vw;
    line-height: 				4.3vw;
	color: 						#fff;
	text-align: 				left;
	margin: 					0 0 0 auto;
	width: 						50%;
	text-shadow: 				5px 5px 15px rgba(0, 0, 0, 0.7);
}

.banner-content .slogan span{
	display: 					block;
	font-size: 					6.24vw;
    line-height: 				5vw;
	font-weight: 				700;
	text-align: 				left;
}

.banner-content a{
	position: 					relative;
	margin: 					60px 0 0 auto;
	text-decoration: 			none;
}

.banner-content a span{
	height: 					48px;
	line-height: 				48px;
	background: 				url(../img/bt-next.png) no-repeat right 22px center #ebc900;
	font-size: 					20px;
	color: 						#fff;
	font-weight: 				600;
	padding: 					0 44px 0 27px;
	position: 					relative;
	display: 					block;
	z-index: 					2;
	transition: 				all 0.3s;
}

.banner-content a:hover span{
	background-color: 			#26445f;
}

.banner-content a:before{
	position: 					absolute;
	z-index: 					1;
	left: 						5px;
	top: 						0;
	width: 						calc(100% - 10px);
	height: 					100%;
	background: 				#fff;
	transform: 					rotate(-3deg);
	content: 					'';
}

/* CONTAINER PRINCIPAL
----------------------------------------*/

section#body{
	margin-top: 				-13vh;
	position: 					relative;
	z-index: 					2;
}

section#body>.wrapper{
	position: 					relative;
	padding-top: 				40px;
}

body.page section#body>.wrapper{
	padding-top: 				70px;
}

section#body>.wrapper .editor-container{
	position: 					relative;
	z-index: 					2;
}

section#body>.wrapper:before{
	position: 					absolute;
	width: 						90vw;
	left: 						calc((90vw - 100%) / -2);
	top: 						0;
	height: 					100%;
	background: 				#f8f8f9;
	content: 					'';
}

@media screen AND (max-width: 1180px){
	section#body>.wrapper:before{
		width: 						95vw;
		left: 						calc((95vw - 100%) / -2);
	}
}

@media screen AND (max-width: 1024px){
	section#body>.wrapper:before{
		width: 						100vw;
		left: 						calc((100vw - 100%) / -2);
	}
}

body.home section#body h2{
	font-size:                  60px;
    line-height:                65px;
    font-family:                Montserrat, Arial;
    font-weight:                700;
    color:                      #26445f;
    text-align:                 center;
    text-transform:             uppercase;
    margin:                     0 0 45px;
    padding:                    0 0 22px;
	position: 					relative;
	border: 					0;
}

body.home section#body h2:after{
	position: 					absolute;
	width: 						465px;
	height: 					2px;
	background: 				#e3e3e3;
	content: 					'';
	left: 						0;
	right: 						0;
	margin: 					auto;
	bottom: 					0;
}

#main-content{
	padding-bottom: 			90px;
}

body.home #main-content{
	margin-bottom: 				75px;
}

body.home #main-content h2{
	text-align: 				left !important;
	font-size: 					3.1vw !important;
	line-height: 				normal !important;
	margin-bottom: 				20px !important;
}

body.home #main-content h2:first-line{
	color: 						#376085;
	font-weight: 				400;
	font-size: 					2.4vw !important;
}

body.home #main-content h2:after{
	width: 						100% !important;
}

.home-bloc-blanc{
	margin-bottom: 				60px;
}

body.home #main-content .gros-texte-bleu{
	font-size: 					1.4vw;
}

body.home section#body .editor-container{
	padding-bottom: 			0;
}

@media screen AND (max-width: 1180px){
	.photos-vignettes:before{
		width: 						95vw !important;
		left: 						calc((95vw - 100%) / -2) !important;
	}
}

@media screen AND (max-width: 1024px){
	.photos-vignettes:before{
		width: 						100vw !important;
		left: 						calc((100vw - 100%) / -2) !important;
	}
}

/* FOOTER
----------------------------------------*/

footer{
    position:                   relative;
    bottom:                     0;
    left:                       0;
    height:                     auto;
    background:                 #e3e3e8;
    z-index:                    100;
    width:                      100%;
    padding:                    30px 0 0;
}

footer .editor-container{
	padding-bottom: 			20px;
}

footer .wrapper{
	position: 					relative;
}

.social-medias{
    text-align:                 left;
    margin-top:                 25px;
}

.social-medias p{
	font-size: 					16px;
	font-weight: 				600;
	color: 						#26445f;
	text-transform: 			none;
	display: 					inline-block;
	margin-right: 				10px;
	vertical-align: 			top;
	height: 					24px;
	line-height: 				24px;
}

.social-medias a{
    display:                    inline-block;
    height:                     24px;
    width:                      24px;
    transition:                 none;
    background-size:            auto;
    background-position:        center;
	background-repeat: 			no-repeat;
	vertical-align: 			top;
}

.social-medias a + a{
	margin-left: 				10px;
}

.social-medias a.bt-fb{
    background-image:           url(../img/icon-fb.png);
}

.social-medias a.bt-linkedin{
    background-image:           url(../img/icon-linkedin.png);
}

.social-medias a.bt-insta{
    background-image:           url(../img/icon-instagram.png);
}

.social-medias a:hover{
    filter: 					brightness(0) invert(1);
}

.block-contact{
	text-align: 				left;
}

.block-contact p{
	font-size: 					16px;
	font-weight: 				400;
	color: 						#26445f;
	margin-bottom: 				5px;
}

.block-contact .title{
	font-weight: 				700;
	color: 						#d5b120;
}

.block-contact .phone{
	margin-bottom: 				8px;
	padding-left: 				27px;
	background: 				url(../img/icon-phone.png) no-repeat left top 2px;
}

.block-contact .mail{
	padding-left: 				27px;
	background: 				url(../img/icon-mail.png) no-repeat left top 5px;
}

.block-contact .adress{
	padding-left: 				27px;
	background: 				url(../img/icon-adress.png) no-repeat left top 2px;
}

footer .contact{
	padding-top: 				15px;
	text-align: 				right;
}

footer .contact p{
	font-size: 					20px;
	text-transform: 			uppercase;
	color: 						#376085;
	font-weight: 				500;
	margin-bottom: 				12px;
}

footer .bottom{
    position:                   relative;
	color: 						#a8a8ab;
}

footer .bottom ul{
    display:                    block;
    text-align:                 right;
}

footer .bottom ul li{
    display:                    inline-block;
}

footer .bottom ul li + li:before{
    content:                    '-';
    margin:                     0 5px;
    display:                    inline-block;
    color:                      #a8a8ab;
    font-size:                  13px;
}

footer .bottom ul li a{
    font-size:                  13px;
    color:                      #a8a8ab;
    text-decoration:            none;
}

footer .bottom ul li a:hover,
footer .bottom ul li.current_rubrique a{
    color:                      #26445f;
}

footer .bottom>div img{
    vertical-align:             middle;
    margin-left:                3px;
    margin-top:                 -2px;
}

footer .bottom .credits{
	text-align: 				right;
	font-size: 					13px;
}

/* QUICK CONTACT
----------------------------------------*/

#bt-contact{
    position:                   relative;
    background:                 url(../img/bt-next.png) no-repeat right 25px center #26445f;
    z-index:                    900;
	font-size: 					20px;
	color: 						#fff;
	font-weight: 				600;
	text-transform: 			uppercase;
	text-decoration: 			none;
    width:                      auto;
    right:                      0px;
    height:                     48px;
	line-height: 				48px;
	padding: 					0 50px 0 30px;
    cursor:                     pointer;
	float: 						right;
	transition: 				background 0.3s;
}

#bt-contact:hover{
	background-color: 			#ebc900;
}

#bt-contact.fixed{
	bottom: 					0;
	position: 					fixed;
}

#quick-contact{
	background: 				rgba(2, 2, 2, 0.8);
	width: 						100%;
	height: 					100%;
	position: 					fixed;
	z-index: 					999;
	opacity: 					0;
	display: 					none;
	flex-direction: 			column;
	justify-content: 			center;
	top: 						0;
	left: 						0;
}

#quick-contact .form{
	width: 						960px;
	height: 					auto;
	background: 				#fff;
	margin: 					auto;
	box-sizing: 				border-box;
	padding: 					50px 65px;
	position: 					relative;
	opacity: 					0;
}

#quick-contact .form .editor-block-contact{
	border-left: 				1px solid #eeeeee;
}

#quick-contact .form .close-button{
	width: 						30px;
	height: 					30px;
	position: 					absolute;
	cursor: 					pointer;
	background: 				url(../img/cancel.png) no-repeat center;
	background-size: 			16px auto;
	top: 						10px;
	right: 						10px;
	opacity: 					0.7;
	transition: 				all 0.5s;
	cursor: 					pointer;
}

#quick-contact .form .close-button:hover{
	opacity: 					1;
}

#quick-contact .editor-block-contact-text,
#quick-contact .editor-block-contact-area{
	background: 				#f8f8f9;
}

/* MESSAGE POPIN
----------------------------------------*/

.popin{
    position:                       fixed;
    top:                            0;
    left:                           0;
    width:                          100%;
    height:                         100%;
    z-index:                        100000;
    background:                     rgba(0, 0, 0, 0.8);
    display:                        flex;
    flex-direction:                 column;
    align-content:                  center;
    align-items:                    center;
}

.popin>div{
    position:                       relative;
    width:                          400px;
    text-align:                     center;
    background:                     #fff;
    height:                         auto;
    margin:                         auto;
    padding:                        25px;
}

.popin>div form{

}

.popin>div p.message{
    width:                          auto;
    height:                         auto;
    text-align:                     left;
    margin-bottom:                  25px;
}

.popin.question_window>div p.message{
    text-align:                     center;
}

.popin>div input[type=text]{
    width:                          100%;
    margin-bottom:                  35px;
}

.popin .editor-button + .editor-button{
	margin-left: 					40px;
}

/* RESPONSIVE
----------------------------------------*/

.main-container{
	width: 						auto;
}

.wrapper{
	width: 						75%;
	max-width: 					1440px;
	min-width: 					960px;
	margin-left: 				auto;
	margin-right: 				auto;
	height: 					auto;
	clear: 						both;
}

.wrapper-full{
	width: 						100%;
	max-width: 					none;
	overflow-x: 				hidden;
}

.editor-container{
	width: 						auto;
	margin-left: 				-40px;
	margin-right: 				-40px;
	clear: 						both;
    padding-bottom:             20px;
}

.editor-container:after{
    clear:                      both;
    content:                    '';
    display:                    block;
    height:                     0;
}

.editor-col{
	padding: 					0 40px;
	width: 						100%;
	box-sizing: 				border-box;
	-webkit-box-sizing: 		border-box;
	text-align: 				left;
    display:                    block;
}

.editor-col-1{
	float: 						left;
	width: 						8.3333%;
}

.editor-col-2{
	float: 						left;
	width: 						16.6666%;
}

.editor-col-3{
	float: 						left;
	width: 						25%;
}

.editor-col-4{
	float: 						left;
	width: 						33.3333%;
}

.editor-col-5{
	float: 						left;
	width: 						41.6666%;
}

.editor-col-6{
	float: 						left;
	width: 						50%;
}

.editor-col-7{
	float: 						left;
	width: 						58.3333%;
}

.editor-col-8{
	float: 						left;
	width: 						66.6666%;
}

.editor-col-9{
	float: 						left;
	width: 						75%;
}

.editor-col-10{
	float: 						left;
	width: 						83.3333%;
}

.editor-col-11{
	float: 						left;
	width: 						91.6666%;
}

.editor-col-12{
	float: 						none;
	width: 						100%;
	clear: 						both;
}


@media screen AND (max-width: 1440px){
	.editor-col-md-3{
		width: 						25%;
	}
	
	.editor-col-md-6{
		width: 						50%;
	}
	
	.editor-col-md-12{
		width: 						100%;
		float: 						none;
	}
}

@media screen AND (max-width: 1024px){
	.editor-container{
		margin-left: 				-30px;
		margin-right: 				-30px;
	}

	.editor-col{
		padding: 					0 30px;
	}
}

@media screen AND (max-width: 960px){
	.wrapper{
		min-width: 					0;	
	}
	
	.editor-container{
		margin-left: 				-15px;
		margin-right: 				-15px;
	}
	
	.editor-col{
		padding: 					0 15px;	
		float: 						none !important;
		width: 						auto !important;
	}
}

@media screen AND (max-width: 768px){
	.editor-col{
		width: 						100%;
		float: 						none;
		padding: 					0;
	}
	
	.wrapper{
		width: 						auto;
		min-width: 					none;
		padding: 					20px;
	}
	
	.editor-container{
		margin-left: 				0;
		margin-right: 				0;
}