@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:#3C3C3B;}

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

.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;}
.charcoal{color:#333333;}

.bckBlanc{background:#fff;}
.bckJaune{background:#FDD000;}

.bckCharcoal{background:#231F20;color:#9C9B9B}
.jaune{color:#FDD000}


/* TEXTE */
h1, h2, h3, h4, h5, h6{margin:0;line-height:1.1;color:#222;}
h1{font-size:48px;font-weight:400;font-family: 'Oswald', serif;margin-bottom:30px;text-transform:uppercase;}
h2{font-size:28px;font-weight:700;}
h3{font-size:18px;font-weight:700;}
h4{font-size:18px;font-weight:700;}
h5{font-size:17px;font-weight:700;}

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

p, li{font-size:16px;line-height:1.4;margin:0 0 20px}
ul{list-style-type:square} ul li{margin:0 0 10px 20px}
ul.liste{list-style-type:none;}
ul.liste li:before{content:"";display: inline-block;width:30px;height:20px;background: url(../img/picto/liste.svg) no-repeat left center / 20px;vertical-align: middle}
ul.liste li{color:#9C9B9B;font-weight: 700;margin:0 0 7px 0 }


.bt{line-height:1;z-index:99;position:relative;margin:0-auto;display:block;text-align:center}
.bt a {padding:10px 15px 12px;color:#000;border:3px solid #000;display:inline-block;-moz-transition:all 0.2s ease-in-out;transition: all 0.2s ease-in-out; }
.bt a:hover{color:#a8a7a7;border-color:#a8a7a7;}


header{width:100%;z-index:100;background:rgba(255, 255, 255, 1); position: fixed;height:90px;top: 0;-moz-transition:all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
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: -170px;}

header .logo{float:left;width:100%;margin-top:15px}


#navMenu {position:relative;margin: 0 0;display:block;width:100%;}
#navMenu ul li{font-size:16px;line-height:1;margin:0;background:none;margin:0;display:block;text-align:center;padding:0;border:0;float:left}
#navMenu ul li:last-child{padding:0}

span#menuMob, .closebtn {display:none}

#navMenu .smlNav ul {float:right;margin:-30px 200px 0 0;}
#navMenu .smlNav ul li{padding:0 20px 0 0}#navMenu .smlNav ul li:last-child{padding:0}
#navMenu .smlNav ul li:hover{font-weight: 700;color:#FDD000;}
#navMenu .bigNav ul{display:block;position:absolute;top:80px;right:0}
#navMenu .bigNav ul li{padding:20px;background:#231f20;color:#9c9b9b;font-weight: 700}
#navMenu .bigNav ul li:hover{background:#FDD000;color:#fff}

.btSoum{position: absolute;top:25px; right:100px;}
.btSoum a{display:block;width:185px}
.btSoum h6 a{font-size:14px;color:#9c9b9b;font-weight: 700}
.btSoum h6 a span:last-child{font-family: 'Oswald', serif;font-size:26px;color:#3c3c3b;text-transform:uppercase;}
.btSoum h6 a span:first-child{width:40px;height:40px;margin-right:10px;background:url(../img/picto/soumission-jaune.svg) no-repeat center center / 40px;display:block;float:left;vertical-align:middle}

.bloc{background:rgba(64,64,64, 0.9);padding:30px;width:30%;}

/* SLIDER */
.head{position:relative;width:100%;margin:90px auto 0 ;padding: 0 0 ;z-index:0;height:600px; border-bottom:10px solid #FDD000; }
.head {background:url(../img/fond/fond-slide1.jpg) no-repeat center center / cover fixed;padding-top:180px;}
.head .bloc{width:auto;padding:40px 80px 40px 40px;background: none}
.head h2{color:#FDD000;font-size:32px;text-align:center;}.head h2 span{display: block;color:#fff;font-size: 62px; font-family: 'Oswald', serif;text-transform: uppercase}

.imgHome{width:100%;transform: translate(0,-150px);z-index:99;display:block;margin-bottom:-200px}
.imgHome img{display:block;margin:0 auto}

.bckSecteur{background:url(../img/fond/fond-secteur.jpg) no-repeat center center / cover fixed ;min-height:400px}
.secteur img{margin-bottom:15px}
.secteur .col{width:14%}

#service img{display:block;margin:0 auto 20px;height: 100px}
#service h1{margin-bottom:40px}
#service h3 + p{margin:10px 0 0 0} 
.fond{background:#000;padding:25px 15px;min-height:277px}
.fond h3{color:#fff;text-align: left}
.fond p{margin-bottom:0;color:#9C9B9B;text-align: left}
.fondJaune{background:#FDD000;min-height:277px;padding:70px 20px 30px;margin-top:120px;-moz-transition:all 0.4s ease-in-out;transition: all 0.4s ease-in-out;cursor:pointer}
.fondJaune:hover{background:#fff;}
.fondJaune h2{padding-top:40px;color:#fff;margin-bottom:20px;}



.bckHygiene{background:url(../img/fond/fond-hygiene.jpg) no-repeat center center / cover fixed ;padding:60px 0}
.bckHygiene h3{color:#9C9B9B}
.logoHygiene{margin-top:-200px;margin-bottom: 80px}
.hygiene{margin-top:-170px;margin-bottom: 40px}


#soumission h1{margin:30px 0 10px 0}

/* FOOTER */

footer{width:100%;background:#000}
footer h1{margin-bottom:0}
footer .bigPad{padding-bottom:40px}
footer p{margin:5px 0}
footer .fb img{vertical-align:middle;margin-right:5px;}


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

#credits{background:#FDD000;padding:10px 30px;}
#credits p, #credits a{margin:0;font-size:11px;color:#000;text-align:center;text-transform: uppercase;font-weight: 700}
#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}

.btSoum{right:50px}

#navMenu ul li{font-size:14px;}
#navMenu .bigNav ul{top:80px;}
#navMenu .bigNav ul li{padding:20px 15px;}

}


@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:22px;}
h3{font-size:16px;}
h4{font-size:16px;}
h5{font-size:15px;}

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

header{height:70px}
header .logo img{width:160px;}

.btSoum{right:60px;top:15px}
.btSoum h6 a{font-size:12px;}
.btSoum h6 a span:last-child{font-size:20px;}



span#menuMob {position:absolute;right:20px;top:15px;width:40px;height:40px;display:block;background: url("../img/menu-mobile.svg") no-repeat center center / 35px;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.9);overflow-x: hidden;transition: 0.3s;}
.overlay .closebtn {display:block;position: absolute;top:-130px;right: 35px;font-size: 60px;color:#fff} 
.overlay-content {position: relative;top:0;width: 100%;text-align: center;}

#navMenu nav{position:relative;width:100%;height:auto;padding:0 0 0 50px}
#navMenu{background:none;height:100%;}
#navMenu ul li{display:block;text-align:left;padding:0;transition: 0.3s;width:100%;margin:10px 0;font-size:30px}
#navMenu ul li {color:#fff;}

#navMenu .smlNav ul {float:none;margin:0;margin-top:130px}
#navMenu .bigNav ul{position:relative;top:0;right:0}
#navMenu .bigNav ul li{padding:0;background:none;color:#FDD000;}
#navMenu .bigNav ul li:hover{background:none;color:#fff}
#navMenu .smlNav ul li:hover{font-weight:400}


.head{margin-top:70px;height:400px;padding-top:60px}
.head {background:url(../img/fond/fond-slide1.jpg) no-repeat center top / cover scroll;}

.head h2{font-size:28px;}.head h2 span{font-size: 46px; }

.imgHome{transform: translate(0,-100px);margin-bottom:-150px}
.imgHome img{max-width:220px}

.secteur .col{width:33%;margin:0 auto 30px}

.bckSecteur{background:url(../img/fond/fond-secteur.jpg) no-repeat center center / cover scroll ;}
.bckHygiene{background:url(../img/fond/fond-hygiene.jpg) no-repeat center center / cover scroll ;}



#service img{height:auto;}
.fondJaune{margin-top:0;min-height: auto}
.fondJaune h3{margin-bottom:10px}
.fond{min-height:0}


.logoHygiene {margin-top: -120px;margin-bottom:30px;}
.logoHygiene img{width:200px}
.txtHygiene{margin-bottom:250px}
.hygiene{margin-top:-340px}
.hygiene .col{width:33%}
.hygiene .col img{padding:10px}

}


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

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


h1{font-size:24px;}
h2{font-size:15px;}
h3{font-size:13px;}
h4{font-size:13px;}
h5{font-size:12px;}

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

header{height:60px;}
header .logo img{width:130px;}
span#menuMob {top:10px}



.head{margin-top:60px;height:280px;padding-top:60px}
.head .bloc{padding:15px 30px 15px 15px}
.head h2{font-size:20px;}.head h2 span{font-size: 32px; }



.btSoum{right:70px;top:15px}
.btSoum h6 a{font-size:11px;}.btSoum a{width:125px}
.btSoum h6 a span:last-child{font-size:16px;}
.btSoum h6 a span:first-child{width:25px;height:25px;margin-right:10px;background:url(../img/picto/soumission-jaune.svg) no-repeat center center / 25px;}


.imgHome{transform: translate(0,-100px);margin-bottom:-150px}
.imgHome img{max-width:180px}

.hygiene{margin-top:-300px}

.credit {margin-top:20px}
.credit img{max-width:70px}
	
}

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

header .logo img {width: 110px;}
.btSoum h6 a span:first-child{background:none}


}