html, body {margin:0px;min-height:100%;width:100%;font-family:Verdana,Tahoma,Helvetica,Arial,Sans-serif;}
h1, h2, h3, h4, h5, h6 {margin:0;padding:0;border:0;vertical-align:baseline;}
img, video {max-width:100%;height:auto;border:0;} 
#global{max-width:1200px;margin:0 auto;height:auto;overflow:auto;}
a {color:#000;text-decoration:none;} 
a.ex1:link, a.ex1:hover, a.ex1:focus, a.ex1:active, a.ex1:visited {color:#000;text-decoration:underline;}
h1 {text-align:center;color:#E30513;} 
.bandeau{width:100%;}
.truc {width:100%;background-color:#FFF981;text-align:center;padding:10px;margin:20px 0;}
.trag {width:100%;background-color:#FFF9A5;text-align:left;padding:5px;margin:10px 0;}
.sticky {position:fixed;top:0px;width:100%;}
.sticky + .bandeau {padding-top:0;}
.Styleh1{font-size:2.1em;color:#E30513;text-align:center;}
.Styleh2 {font-size:1.5em;color:#CC1413;text-align:center;}
#haut {height:74px;max-width:1200px;display:flex;justify-content:space-between;background:#efefef;align-items:center;/*border:1px solid red; */}
#logo {order:1;display:block;flex:initial;margin:0 15px 0 70px;}
#panier {margin-right:20px;order:3;}
.content {max-width:100%;margin:15px 0;padding:5px 10px;}
.content2 {max-width:100%;margin:0 auto;padding:5px 10px;text-align:center;border:1px solid black}
.bloc1 {display:block;min-width:300px;float:none;}
.bloc2 {display:bloc;min-width:300px;float:none;}
.bloc3 {display:inline-block;padding:8px 40px;border:3px solid red;border-radius:5px;margin:15px 10px;}
.bloc4 {display:inline-block;padding:5px 10px;border:2px solid red;margin:15px 10px;}
.eclate {width:95%;display:flex;flex-flow:row wrap}
.eclate li {padding:5px;list-style:none;background:#ddd;margin:5px;}
#table1 {width:100%;border:1px solid black;border-collapse:collapse;}
#table1 td{padding:5px;margin:0;width:50%;border:1px solid black;}


nav {background:#B0C4DE;position:absolute;top:0;left:0;height:auto;width:280px;left:-900px;z-index:99;transition:left 0.75s;order:0;font-size:1em;line-height:30px;}
#nav-left ul {list-style-type:none;padding:0;margin:10px 0 0 0;}
#nav-left li {border-bottom:1px solid grey;width:200px;padding:0;}
#nav-left li:last-child {border-bottom:none;}
#nav-left ul li a {display:block;text-align:center;}
#nav-left ul li a:hover {background:#c00;color:#fff;font-weight:bold;font-weight:bold;}
#nav-left:target {left:0;transition:left 0.75s;}
#menu-left:not(target) {cursor:pointer;position:absolute;left:20px;top:20px;font-size:28px;line-height:28px;font-weight:bold;user-select:none;}

.open-menu, #nav-left:target ~ * .close-menu {display:block;}
.close-menu, #nav-left:target ~ * .open-menu {display:none;}/**/
.flexcontno {display:flex;justify-content:space-around;flex-flow:row nowrap;max-width:100%;margin:20px}
.flexcontwrap {display:flex;justify-content:space-around;max-width:100%;flex-flow:row wrap;align-items:center;margin:20px}


#bas{clear:both;height:80px;background-color:#dedede;text-align:center;font-size:0.8em;color:#666;padding:10px;}
#bas a{text-decoration:underline;color:#;}

@media only screen and (min-width:640px) {
.bloc1 {display:table-cell;float:left;}
.bloc2 {display:table-cell}

}


@media only screen and (min-width:740px) {
#logo {display:block;flex:initial;order:0;padding:0;margin:0 12px; }
nav {display:flex;justify-content:center;height:33px;font-size:1em;line-height:33px;order:1;position:static;background:0;}
#nav-left ul{list-style:none;display:flex;witdh:100%;margin:0;padding:0 2px;}
#nav-left li:first-child {display:none;}
#nav-left li:last-child {border-bottom:2px solid #606060;}
#nav-left a {display:block;padding:0;}
#nav-left li {background:#ccd;border-radius:5px;margin:0 1%;padding:0;width:76px;border-bottom:2px solid #606060;}
#nav-left li> a:hover {border-radius:5px;border-bottom:2px solid #606060;}
#menu-left {display:none}
}
@media only screen and (min-width:840px) {
#nav-left li {width:90px;}
}
@media only screen and (min-width:1024px) {
#nav-left li {width:100px;}
}
