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

html, body {height:100%;}
html{font-size: 62.5%;}
body{margin: 0 auto;padding: 0;overflow-x:hidden;position: relative;width:100%;background:#fff;font-family: 'Red Hat Text', sans-serif;font-weight:500;color:#000;letter-spacing: 1px}

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

.pad{padding:40px;}
.bigPad{padding:100px;}

a[href]:not([class]) {color:inherit;font-weight: bold; text-decoration: none;transition: all ease-in-out .3s;}
a:focus{outline:0;}
a[href^=tel]{color:inherit;text-decoration:none;} 


img{max-width:100%;}
hr{border:none;border-top:3px dotted #ccc;margin:40px 0}


.center{text-align:center;} .left{text-align:left;} .right{text-align:right;} .justify{text-align:justify;} .uppercase{text-transform:uppercase;}

.block{display:block;}
.inline{display:inline-block}
.none{display:none;} 

.down{margin-bottom:40px;}
.up{margin-top:40px;}

.flt-lf{float:left}
.flt-rg{float:right}
.clear{clear:both;}



/* COULEUR */

.blanc{color:#fff;}
.noir{color:#000;}
.jaune{color:#EFC700}
.rose{color:#E10049}

.bckBlanc{background:#fff;}
.bckpale{background:#F7F5EB;margin:0}
.bckNoir{background:#000;margin:0}

.bckRose{background:rgba(225,0,73,1);margin:0}
.bckJaune{background:rgba(239,199,0,1);margin-top:0}


/* TEXTE */

h1, h2, h3, h4, h5, h6{line-height: 1.4;text-transform:uppercase;letter-spacing: 4px}

h1{font-size:36px;font-weight:700;font-family: 'Barlow Semi Condensed', sans-serif;}.bck{box-shadow: inset 0 -25px 0 rgba(247, 245, 235, 1);}
h2{font-size:20px;font-weight:700;font-family: 'Barlow Semi Condensed', sans-serif;}
h3{font-size:16px;font-weight:300;font-family: 'Barlow Semi Condensed', sans-serif;letter-spacing: 5px}


h4{font-size:15px;font-weight:700;}
h5{font-size:14px;font-weight:700;}
h6{font-size:14px;font-weight:700;font-family: 'Barlow Semi Condensed', sans-serif;}

p.smltitle + h1 {margin:0}p.smltitle.blanc{color:#fff}
.smltitle{text-transform:uppercase;font-size:12px;letter-spacing: 4px;font-weight:700;color:#808080;margin-bottom:0;line-height: 1.5}

p strong{box-shadow: inset 0 -10px 0 rgba(247, 245, 235, 1);}
.blanc p strong{box-shadow: inset 0 -10px 0 rgba(225,0,73, 0.8);}
.bckRose p strong{box-shadow: inset 0 -10px 0 rgba(0, 0, 0, 1);}

*{}
* + * {margin-top: 20px;}
h1 + h2, h2 + h3, h3 + h4, h4 + h5, h5 + h6{margin-top:0}


p, li{font-size:13px;line-height:1.6;}
ul{list-style-type:none;} 
ul li{margin:0 0 5px 0px;}
ul li:before{content:" • ";display: inline-block;font-weight:bold;width: 15px;color:#E10049}


.bt{position:relative;display:block;font-family: 'Barlow Semi Condensed', sans-serif;font-weight: 700;text-transform: uppercase;letter-spacing: 3px;}
.bt a{padding:12px 25px;display:inline-block;text-decoration:none!important;color:#fff;moz-transition:all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
.bt a.bckBlanc{color:#000;}
.bt a.bckJaune:hover{background:#E10049;}
.bt a.bckBlanc:hover{background:#000;color:#fff}



header * + * {margin-top: 0;}
header{width:100%;margin:0;height:100px;z-index:100;background:rgba(0, 0, 0, 0); position: fixed;top: 0;padding:0 30px;font-family: 'Barlow Semi Condensed', sans-serif;-moz-transition:all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
header.sticky{background:rgba(0, 0, 0, 0.85)} header.nav-up {top: -100px;}

.home header .logo img{width:170px;margin-top:20px;moz-transition:all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
.home header.sticky .logo img{width:120px;margin-top:0}

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


#navMenu {position:absolute;top:0;right:20px;}
#navMenu ul{margin:70px 0 0 }
#navMenu ul li{display:inline-block;font-size:12px;line-height:1;margin:0;padding:0 20px 0 0;background:none;text-transform: uppercase;letter-spacing: 3px}
#navMenu ul li:last-child{padding:0}#navMenu ul li:before{content:"";padding:0;}
#navMenu ul li a{color:#fff;text-decoration: none;} 
#navMenu ul li a:hover{border-bottom:4px solid #EFC700;}
#navMenu .btPanier a{position:absolute;top:0;right:40px;background:#E10049;padding:15px 20px;display: block}
#navMenu .btPanier:hover a{background:#EFC700;color:#fff;border:none}
span#menuMob, .closebtn {display:none}


#headhome{position:relative;background:url("../img/fond/head-home.jpg") no-repeat center center / cover fixed ;height:100%;margin:0}
#headhome .container{height:100%;text-align:center;z-index:1;}
#headhome .centerBloc{width:100%; position: absolute; top: 50%; transform: translateY(-50%); }
#headhome h2{font-size:55px;font-weight: 300;}


.bckPanierHome{position:relative;background:url("../img/fond/panier-legume.jpg") no-repeat center center / cover fixed ;margin:0;padding:160px 0 }
.step{margin:40px 0 0 0}
.homePanier{transform:translateY(-160px);margin-bottom:-150px}

.bckKiosque{position:relative;background:url("../img/fond/kiosque-home.jpg") no-repeat center center / cover fixed ;}
.bckKiosque  .contDemi{height:100%;padding:120px 80px}
.bckKiosque .centerBloc{position: absolute;left:0; top: 50%; transform: translateY(-50%);width:100%; padding:120px 80px}

.champignonHome{position:relative;background:url("../img/fond/champignonniere.jpg") no-repeat center center / cover fixed ;margin:0;padding:160px 0 }



.head{max-height:400px;margin:0;height:100%;background-attachment: fixed;background-size: cover;background-repeat: none;background-position: center center}
.head .container{height:100%;text-align:center;z-index:1;}
.head .centerBloc{width:100%; position: absolute; top: 50%; transform: translateY(-50%); padding:0 30px}
.head h1{font-size:45px;}

.fond{min-height:450px;position: relative;width: 100%}
.fond .centerBloc{width:100%; position: absolute;left:0;top: 50%; transform: translateY(-50%);padding:60px }

/* FOOTER */

footer{width:100%;margin:0;background:#000;}
footer a[href]{text-decoration:none!important;moz-transition:all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}
footer a:hover{box-shadow: inset 0 -10px 0 rgba(225,0,73,1);}
.social a{margin-left:20px}

#credits{background:#000;padding:10px 30px;margin:0}
#credits .container *{margin:0}
#credits p, #credits a{margin:0;font-size:11px;color:#aaa}
#credits a{font-size:8px;text-transform:uppercase;text-decoration:none;font-weight: normal;padding:2px 5px 0 0;display:block}
#credits a img{margin:-2px 0 0 5px!important;display:inline-block;vertical-align:middle;}


.fixed{position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 60px;}

.radio-group em, .checkbox-group em{color:#E10049}

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

.pad{padding:30px;}
.bigPad{padding:60px;}

header{padding:0 20px}
#navMenu{right:10px}
#navMenu ul li{font-size:11px;padding:0 0 0 10px;}
#navMenu .btPanier a{right:20px;}
.home header .logo img{width:130px;}

}



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

.contDemi{max-width:100%;}
.pad{padding:20px;}
.bigPad{padding:50px;}

h1, h2, h3, h4, h5, h6{letter-spacing: 3px}
h1{font-size:32px;}.bck{box-shadow: inset 0 -25px 0 rgba(247, 245, 235, 1);}
h2{font-size:20px;}
h3{font-size:14px;letter-spacing:4px}h3 span{display: block;margin:5px 0}
h4{font-size:14px;}
h5{font-size:13px;}
h6{font-size:12px;}

p, li{font-size:12px;}
.smltitle{font-size:10px;letter-spacing: 4px;}


header{height:85px}
.home header.sticky .logo img{width:100px;margin-top:0}

span#menuMob {position:absolute;right:20px;top:20px;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:0px;right: 25px;font-size: 60px;text-decoration: none;color:#fff} 
.overlay-content {position: absolute;top: 50%;transform: translateY(-50%) ;width: 100%;text-align: center;}

#navMenu nav{position:relative;width:100%;height:100%;}
#navMenu ul {margin:0}
#navMenu ul li{display:block;text-align:center;padding:0;transition: 0.3s;font-size:22px;padding:0 0 20px}
#navMenu .btPanier a{position:relative;top:0;right:0;display: inline-block;margin:20px 0 0 }

#headhome h2{font-size:40px;}

.homePanier{max-width:85%;padding:20px}
.champignonHome, .bckKiosque{padding:110px 0}

.head{background-attachment: scroll}
.head h1{font-size:40px;}

.bckPanier .col{width:100%}
.bckPanier .right{text-align: left}

footer{text-align: center}
footer .right{float: none;text-align: center}
footer .social a{display:block;margin:10px auto}

}


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


.pad{padding:20px 15px;}
.bigPad{padding:40px;}



h1{font-size:22px;}
h2{font-size:16px;}
h3{font-size:14px;}
h4{font-size:13px;}
h5{font-size:12px;}
h6{font-size:11px;letter-spacing: 2px}

p, li{font-size:11px;}
.smltitle{font-size:8px;letter-spacing: 2px;}

 header .logo img{width:100px}
 
.head{max-height:300px;}
.head h1{font-size:26px;}

#headhome h2{font-size:30px;}

.homePanier{max-width:85%;padding:10px}
.bckKiosque .contDemi{padding:80px 50px}

	
}