@charset "UTF-8";
/* CSS Document */

html{font-size: 62.5%;}
body{margin: 0 auto;padding: 0;overflow-x:hidden;position: relative;width:100%;background:#fff;font-family: 'Open Sans', sans-serif;font-weight:400;color:#393c3f;}

.container, .contDemi, .smlCont{position:relative;display:block;margin:0 auto;padding:0 80px;width:100%}
.container{max-width:1200px;}
.contDemi{max-width:600px;}
.smlCont{max-width:800px;}

.pad{padding-top:40px;padding-bottom:40px}
.Bigpad{padding-top:100px;padding-bottom:100px}


a[href^=tel]{color:inherit;text-decoration:none;} a{text-decoration:none;color:inherit;cursor:pointer}a:focus{outline:0;}
img{max-width:100%;}
hr{border:0;border-bottom:1px dotted #ccc;margin:40px 0}

.ancre{padding-top:50px;margin-top:-50px;}/* hauteur du header*/

.center{text-align:center;} .left{text-align:left;} .right{text-align:right;} .justify{text-align:justify;} .uppercase{text-transform:uppercase;}
.none{display:none;} .block{display:block;}
.down{margin-bottom:30px;}.up{margin-top:30px;}
.flt-left{float:left}.flt-right{float:right}.clear{clear:both;}


/* COULEUR */

.blanc{color:#fff;}
.bleu{color:#03acee;}
.rouge{color:#e12f0c;}

.bckCharcoal{background:#393c3f;}
.bckBleu{background:#03acee;}
.bckpale{background:#f1f1f1;}
.bckBlanc{background:#fff;}

.bckCharcoal p, .bckCharcoal li{color:#a4a6a9;}


/* TEXTE */
h1, h2, h3, h4, h5, h6{margin:0;line-height:1.2;}
h1{font-size:40px;font-weight:700;text-transform:uppercase;font-family: 'Oswald', sans-serif;}
h2{font-size:20px;font-weight:700;}
h6{font-size:18px;font-weight:700;}

h1 + p, h3 + p, h4 + p, h5 + p, h6 + p, h1 + ul, h3 + ul, h4 + ul, h5 + ul, h6 + ul{margin-top:20px}
h2 + p, h2 + ul{margin-top:5px}

p, li{font-size:16px;line-height:1.4;margin:0 0 20px}
ul{list-style-type: disc;} ul li{margin:0 0 0 15px;}

.bt{line-height:1;z-index:99;position:relative;display:block;margin-top:30px}
.bt a {padding:15px 15px;color:#fff;display:inline-block;text-align:center;-moz-transition:all 0.2s ease-in-out;transition: all 0.2s ease-in-out;font-weight:300;background:#e12f0c;}
.bt a:hover{color:#fff;background:#03acee;}


header{width:100%;z-index:100;background:rgba(255, 255, 255, 1); position: fixed;height:130px;top: 0;-moz-transition:all 0.4s ease-in-out;transition: all 0.4s ease-in-out;border-bottom:5px solid #03acee}
header.sticky{background:rgba(255, 255, 255, 1);-webkit-box-shadow: 0px 2px 5px 0px rgba(50, 50, 50, 0.25);-moz-box-shadow:0px 2px 5px 0px rgba(50, 50, 50, 0.25);box-shadow:0px 2px 5px 0px rgba(50, 50, 50, 0.25);} header.nav-up {top: -250px;}

header .logo{float:left;padding:0 0 0 60px}
header .logo img{max-width:100%;padding:20px 0 0;display:block;margin:0 auto}
header .imghead img{margin-top:35px;margin-right:-4px;float:right}


#navMenu {position:relative;margin: 0 0;display:block;}
#navMenu ul{float:right;margin-top:96px;}
#navMenu ul li{font-size:16px;line-height:1;margin:0;background:none;display:block;padding:0 20px 0 0;display:inline-block}
#navMenu ul li a{color:#222;padding:10px 10px} #navMenu ul li a:hover, #navMenu ul li a.active{background:#e12f0c;color:#fff}
span#menuMob, .closebtn {display:none}


/* SLIDER */
.head{position:relative;width:100%;margin:0 auto 0 ;padding: 0 0 ;z-index:0;height:530px; }
.head img{position:;width:100%;}
.head .bloc{float:left;padding:122px 80px;background:url(../img/picto/bulle-head.svg) no-repeat left bottom / 100% auto;margin:115px 0 0 60px}
.head .bloc h2{font-size:45px;font-family: 'Oswald', sans-serif;text-transform:uppercase;color:#fff;}
.head .bloc p{font-size:36px;font-size:' Open Sans' sans-serif;color:#fff;line-height:1.1;}
.head .title{float:left;display:block;width:35%;padding: 270px 0 0 5%;}
.head .title h3{font-size:22px;font-weight:400}

.bottomImg{position:absolute;left:0;width:100%;bottom:-20px;}
.bottomImg img{display:block;margin:0 auto}

.video{display:block;margin:40px auto 0}
.video iframe {max-width:100%}

.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	margin-top:30px;
	overflow: hidden;
}

.video-container iframe,  
.video-container object,  
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.page  > .container.Bigpad{padding-top:150px}


/* FOOTER */

footer{width:100%;}
footer p{margin:5px 0}

.credit p, .credit img{display:inline-block;vertical-align:text-top;text-align:right}
.credit p{line-height:1.1;color:#94d4f3;}
.credit img{margin-left:20px}

#credits{background:#393c3f;padding:10px 30px;margin-top:-3px}
#credits p, #credits a{margin:0;font-size:11px;color:#fff;text-align:center}
#credits a{font-size:10px;text-transform:uppercase;letter-spacing:1px;padding-top:2px;display:block}


@media only screen and (max-width: 1024px) {
	
.container, .contDemi{padding-left:50px;padding-right:50px}

header{height:110px}
header .imghead img{width:200px;margin-top:30px}
#navMenu ul{margin-top:80px;}
header .logo {padding-left:40px}
header .logo img{width:235px}

#navMenu ul li{font-size:14px;padding:0 15px 0 0;}
.head{height:480px}
.head .bloc {padding: 90px 36px;margin-left:40px}
.head .title{width:30%;padding: 240px 0 0 2%;}
.head .title h3{font-size:18px;}


}

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

.container, .contDemi{padding:0 40px;}
.pad{padding-top:30px;padding-bottom:30px}
.Bigpad{padding-top:60px;padding-bottom:60px}


h1{font-size:32px;}
h2{font-size:18px;}
h6{font-size:16px}

p, li{font-size:14px;margin:15px 0;}
li{margin:5px 0}


header{height:90px;}
header .logo {padding-left:20px}
header .logo img{width:180px}
header .imghead {display:none}


span#menuMob {position:absolute;right:20px;top:25px;width:45px;height:40px;display:block;background: url("../img/menu-mobile.svg") no-repeat center center / 45px;cursor:pointer}
.open .overlay{width:100%} .overlay{height:100%;width:0;position:fixed;z-index:1;top:0;left:0;background: rgba(0,0,0, 0.75);overflow-x: hidden;transition: 0.3s;}
.overlay .closebtn {display:block;position: absolute;top:20px;right: 25px;font-size: 60px;color:#fff;} .overlay-content {position: relative;top: 25%;width: 100%;text-align: center;}

#navMenu nav{position:relative;width:100%;height:100%;}
#navMenu ul li{display:block;text-align:center;padding:0;transition: 0.3s;margin-bottom:20px;font-size:24px}#navMenu ul li a{color:#fff;}


.head{height:320px;}
.head .bloc{margin-top:0;padding:134px 31px 62px;margin:0 20px;}
.head .bloc h2{font-size:30px;}
.head .bloc p{font-size:24px;}
.head .title{width:100%;float:none;padding: 100px 10px 0;}
.head .title h3{font-size:14px;}


.bottomImg{position:relative;bottom:-20px}

.credit{margin-top:20px;padding-top:30px}
.credit.flt-left{float:none;display:block}
.credit p{margin-top:20px}

footer .Bigpad{padding-bottom:30px}

.page  > .container.Bigpad{padding-top:100px}

}

@media only screen and (max-width: 530px) {.head .title h3{font-size:12px;}	}


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

.container, .contDemi{padding:0 30px;}
.pad{padding-top:25px;padding-bottom:25px}
.Bigpad{padding-top:50px;padding-bottom:50px}


h1{font-size:24px;}
h2{font-size:16px;}
h6{font-size:14px;}

p, li{font-size:13px;}

header{height:70px;}
header .logo img{width:140px;padding:13px 0 0}
span#menuMob{top:15px}

.head{height:240px;}
.head .bloc{margin-top:0;padding:100px 11px 33px;margin:0 10px}
.head .bloc h2{font-size:20px;}
.head .bloc p{font-size:14px;}
.head .title{padding: 60px 10px 0;}
.head .title h3{font-size:11px;}


footer{padding:30px 20px}

.page  > .container.Bigpad{padding-top:80px}



}