/* C'est évident ? mobile */
html, body, header, #access, #content, #sidebar, footer, div, img, iframe{margin:0;padding:0;border:0;vertical-align:baseline;}
html, body{font-size:112%;line-height:1.6em;font-family:Lucida grande,Verdana,Lucida,Helvetica,sans-serif;font-style:normal;font-weight:normal;color:#333;text-align:center;}
body{background-image:none;background:#cbf;} /* fd violet sombre */
header,#content,#sidebar,footer,img{position:relative;visibility:visible;}
#access{position:absolute;visibility:visible;}
header{background:#cbf;z-index:1;}
header img{float:none;width:100%;max-width:1260px;margin:0 auto;padding:0;z-index:1;}
#access{left:68%;top:0;padding:0.5em 5%;z-index:3;}
#content{margin:1em 0 0 0;padding:1em 3% 0 3%;min-height:20em;border:none;background-color:#fff;z-index:6;}
#sidebar{margin:0;padding:1em 1%;z-index:5;}
footer{padding:0.5em 5%;background:#cbf;z-index:1;} /* orange */
h1, h2, h3{font-weight:normal;margin:1em 0 0.5em 0;text-align:left;color:#444;}
h1{font-size:1.3em;line-height:1.2em;}
h2{font-size:1.2em;}
h2.com{margin:1em 0 0.5em 5%;}
#sidebar h2{width:74%;border:1px solid #000;}
h3{font-size:1.1em;margin:0 0 0.5em 5%;}
h3.b{font-weight:bold;}
p{margin:0;padding:0 0 0.5em 0;text-indent:2%;text-align:justify;color:#000;}
p.date, p.com{font-size:0.9em;font-style:italic;padding:0 0 2em 0;text-indent:0;text-align:left;line-height:1.4em;}
p.it,p.img,p.imgf{margin:0;font-style:italic;font-family:Georgia,Times New Roman,New York,serif;text-indent:0;}
p.it,p.img{text-align:center;}
p.imgf{margin:0 0 2em 0;text-align:left;}
p.resum{font-size:0.9em;text-indent:0;text-align:left;color:#730;}
p.haut{padding:0.5em 0;text-indent:0;text-align:center;border-top:1px solid #560;}
#access{font-size:1.1em;text-align:right;}
footer p{padding:0 5% 0 0;font-size:1em;text-align:right;}
iframe{width:560px;height:315px;margin:3em 0 1em 7%;}
img{float:none;width:100%;margin:0 auto;padding:0;max-width:500px;}
img.mille{max-width:1024px;}
img.huit{max-width:802px;}
img.six{max-width:640px;}
img.quatno{max-width:400px;}
img.quatre,img.trois,img.dcq,img.deux,img.cq{float:left;width:45%;height:auto;margin:0 2% 0.8em 0;padding:0.5em 0;}
img.quatre{max-width:400px;}
img.trois{max-width:300px;}
img.dcq{max-width:250px;}
img.deux{max-width:200px;}
img.cq{max-width:140px;}
ul, ol{margin:0 9% 1em 0;padding:0;list-style:none;}
ul.img{margin:0.5em 3% 1em 3%;}
ul li,ol li{margin-left:2%;padding:0 0 0.7em 2%;text-align:left;text-indent:0;list-style-position:inside;}
ul.recette li{padding:0 0 0.3em 2%;}
ul li{list-style-image:url(i/carvio.gif);}
ul li.it,ol li.it{font-size:0.95em;font-style:italic;}
ol li{list-style-type:decimal;}
ol.comment li{font-style:italic;color:#555;font-size:0.9em;}
#sidebar ul{margin:0;}
#sidebar ul li{margin-left:7%;padding:0 0 1em 0;text-align:left;line-height:1.7em;}
a{font-weight:normal;text-decoration:none;}
a.leger{font-weight:normal;}
header h1 a, #sidebar a{font-weight:bold;}
a:link,a:visited{color:#50a;} /* violet */
header h1 a:link, header h1 a:visited{color:#fffa00;} /* jaune */
#access a:link, #access a:visited{color:#dcf;} /* brun sombre */
a:focus, a:hover, a:active{color:#777;}
header h1 a:focus, header h1 a:hover, header h1 a:active{color:#ddc;}
#access a:focus, #access a:hover, #access a:active{color:#fef;}
h2, #footer{clear:both;}

@media screen and (max-width:669px){body{}
iframe{width:400px;height:225px;}
header h1{font-size:1.3em;}
}
@media screen and (min-width:1300px){body{}
#sidebar{position:absolute;top:0;left:1%;width:22%;margin:15em 0 0 0;border:1px solid #560;}
#content{margin:1em 10% 0 28%;border:1px solid #560;}
#access a{font-size:0.8em;font-weight:normal;}
#access a:link, #access a:visited{color:#854;}
#access a:focus, #access a:hover, #access a:active{color:#da9;}
h1{font-size:1.7em;}
h2{font-size:1.3em;}
ul li,ol li{margin:0;}
#sidebar ul li{font-size:0.92em;margin-left:0;}
}
@media screen and (min-width:1300px) and (max-width:1799px){body{font-size:130%;}
#access{left:55%;}
header h1{font-size:1.9em;}
}
@media screen and (min-width:1800px) and (max-width:2499px){body{font-size:145%;line-height:1.5em;}
#access{left:40%;}
header h1{font-size:2.4em;}
}
@media screen and (min-width:2500px){body{font-size:160%;line-height:1.4em;}
#access{left:25%;}
header h1{font-size:2.5em;}
#sidebar{width:18%;}
#content{margin:1em 14% 0 24%;}
}