html, body, header, article, nav, footer{margin:0; padding:0; border:0; vertical-align:baseline;}
body{font-family:Arial, Helvetica, sans-serif; font-size:118%; font-style:normal; font-weight:normal; color:#000; text-align:left; text-decoration:none; background-image:none;}
#medieval{background-color:#b9cf23;}
#histoire{background-color:#d3bbff;}
#cuisine{background-color:#fc3;}
#assoc{background-color:#eed;}
#mots{background-color:#fff;}
div, img{margin:0; padding:0;}
img{background-color:#fff;}
#sidebar, #lang{position:absolute; visibility:visible;}
#access, #header, #logo, #menu2, #content, footer{position:relative; visibility:visible;}
header{width:94%; padding:0.5em 1%; text-align:left; z-index:2;}
header div, header h1{display:inline-block; vertical-align:top;}
#logo{padding:0 0 0.5em 0; z-index:4;}
#access{left:5%; top:0; z-index:5;}
#menu2{width:60%; padding:0 0 0 2%; z-index:5;}
#content{min-height:53em; margin:0 4% 0 22%; padding:1em 3%; background-color:#fff; z-index:1;}
#sidebar{left:0; top:9em; width:15%; margin:0 2% 0 0; padding:0.5em 2%; z-index:3;}
#lang{left:78%; top:0.6em; width:20%; z-index:5;}
footer{width:74%; padding:0.5em 3% 0 20%; z-index:2;}
h1, h2, h3, h4{font-weight:bold; padding:0;}
h1{font-size:1.4em; margin:0 22% 0.6em 0;}
header h1{margin:0; padding:0.7em 1%; font-size:1.4em;}
h1.st{margin-bottom:0;}
h1.c, h1.c2{font-size:1.5em; font-weight:normal; text-align:center; margin:0;}
h1.c2{margin:7em 0 1em 0;}
h2{font-size:1.2em; margin:0 22% 0.5em 0;}
h2.let{margin-bottom:0;}
h2.c{text-align:center; margin:0; }
h2.c1, h2.c2{text-align:center; margin:1em 0;}
h2.c2{font-size:1.4em; font-weight:normal; margin:2em 0 1em 0;}
h2.pub{text-align:center; margin:1em 10%; padding:0.5em; border:0.2em solid #c60; color:#c60;}
h2.trait{padding-top:1em; border-top:0.1em solid #000;}
h3{font-size:1.1em; margin:0 0 0.4em 0; text-align:center;}
h3.let{text-align:center; margin:0;}
h4{font-size:1em; margin:0 0 0.3em 0;}
#article h2{font-size:1.1em; text-align:center; margin:0 0 0.5em 0;}
#article h3{font-size:1.1em; text-align:left; margin:0 0 0.4em 0;}
#article h4{font-size:1.1em; margin:0 0 0.3em 0;}
p{font-size:1em; padding:0 0 0.7em 0; text-indent:0;}
header p{margin:0.5em 0 0 0; padding:0; font-size:0.9em;}
header p.mensit{font-size:1.15em;}
p.let{padding:0;}
p.d{text-align:right;}
p.c{text-align:center;}
#prehisto p.c, p.let{margin:0;}
p.v{font-size:0.9em; color:#260;}
p.b{font-size:0.9em; color:#206;}
p.o{font-size:0.9em; color:#620;}
#recettes p.o{font-size:1em}
p.img, p.imc, p.imd{font-size:0.9em;}
p.imc, p.imcp{text-align:center; padding:0 10%;}
p.imd{text-align:right;}
p.imglet, p.imclet, p.imdlet{font-size:0.9em; margin:0;}
p.imclet{text-align:center;}
p.imdlet{text-align:right;}
p.navig{padding:1em 0 0.7em 0; font-size:0.9em;}
#content p.haut{font-size:0.9em; text-align:center; padding:1em 0 0 0;}
footer p{font-family:Times new roman, Times, Book antiqua, Century schoolbook, serif; font-size:0.9em; text-align:right;}
a{font-weight:normal; text-decoration:none;}
a.gras{font-weight:bold;}
a:link, a:visited{color:#309;}
header a.access:link, header a.access:visited, #sidebar a.access:link, #sidebar a.access:visited{color:#aaa;}
a:focus, a:hover, a:active{color:#97b;}
a.lien:link, a.lien:visited{color:#309;}
a.lien:focus, a.lien:hover, a.lien:active{color:#97b;}
img{display:block; max-width:150px; height:auto; margin:0 auto; padding:0.5em 0;}
#logo img{max-width:358px;}
img.mille{max-width:1024px;}
img.huit{max-width:800px;}
img.six{max-width:625px;}
img.cinq, img.g-cinq, img.d-cinq{max-width:500px;}
img.quatre, img.g-quatre, img.d-quatre{max-width:400px;}
img.trois, img.g-trois, img.d-trois{max-width:300px;}
img.deux, img.g-deux, img.d-deux{max-width:200px;}
img.ctoct, img.g-ctoct, img.d-ctoct{max-width:180px;}
img.ctvg, img.g-ctvg, img.d-ctvg{max-width:120px;}
img.cent, img.g-cent, img.d-cent{max-width:100px;}
img.oct, img.g-oct, img.d-oct{max-width:80px;}
img.cq, img.g-cq, img.d-cq {max-width: 50px;}
#lang img{display:inline-block; max-width:50px; padding:0 4%;}
#fb img{max-width:40px;}
img.pays{display:inline-block; margin:0; padding:0 2%; max-width:30px;}
img.g, img.g-cinq, img.g-quatre, img.g-trois, img.g-deux, img.g-ctoct, img.g-ctvg, img.g-cent, img.g-oct, img.g-cq{float:left; width:50%; margin:0 4% 0.6em 0;}
img.mille, img.huit, img.six, img.cinq, img.quatre, img.trois, img.deux, img.ctoct, img.ctvg, img.cent, img.oct, img.cq{width:100%;}
img.d, img.d-cinq, img.d-quatre, img.d-trois, img.d-deux, img.d-ctoct, img.d-ctvg, img.d-cent, img.d-oct, img.d-cq{float:right; width:50%; margin:0 0 0.6em 4%;}
ul, ol, li{margin:0; padding:0;}
li{background:none; list-style-type:none;font-size:1em;}
#content ul, #content ol{margin:0 1% 1em 2%; padding:0; list-style:none;}
#mots ul{margin:0; padding:1em; list-style:none;}
#content ol li{background:none; list-style-position:inside; list-style-type:decimal;}
#content li, #mots li{margin:0 0 0.5em 0; padding:0 0 0.7em 1.2%;}
#assoc ul li{list-style-image:url(../i/ca.gif);}
#medieval ul li{list-style-image:url(../i/cav.gif);}
#histoire ul li{list-style-image:url(../i/cab.gif);}
#cuisine ul li{list-style-image:url(../i/cao.gif);}
#content li.o{list-style-image:url(../i/cao.gif); font-size:0.9em;}
header ul, footer ul{margin:0.5em 0;}
header ul li, footer ul li{display:inline-block;width:16%;padding:0.5em 0;vertical-align:top; text-align:center;font-size:0.9em;}
#list ul li{font-size:0.9em;}
#content ul.top{margin:0;}
#content ul.top li{display:inline-block;margin:0; padding:0.5em 1%; list-style:none;}
#content ul ul, #content ol ul{margin:0.8em 0 0.3em 1%; padding:0;}
#content li li{list-style-position:inside; margin:0 0 0.3em 0; padding:0 0 0.7em 0; background:none; list-style-type:circle;}
span{color:#885; font-size:3em;}
#medieval span{color:#380;}
#histoire span{color:#70d;}
#cuisine span{color:#950;}
#sidebar h1{margin: 0;padding:0 0 0.3em 0;font-weight:normal;text-align:center;font-size:0.85em;}
#sidebar p{margin:0.7em 0 0.9em 0;text-align:center;font-size:0.85em;}
#sidebar ul, #sidebar ol{margin:0; padding:0; list-style:none;}
#sidebar ul li, #sidebar ol li{margin:0 0 0.2em 0; padding:0 0 0.5em 0; font-size:0.9em; text-align:center; list-style:none; background:none;}
#sidebar ol li{list-style-type:decimal;}
#sidebar ul ul{margin:0.5em 0 0.3em 1%; padding:0;}
#sidebar li li{margin:0; padding:0 0 0.2em 0;}
#sidebar a{font-weight:bold;}
#sidebar a:link, #sidebar a:visited{color:#005;}
#sidebar a:hover, #sidebar a:active{color:#996;}
hr.menu{margin:0 0 2em 0;}
#content p.haut{clear:both;}
@media screen and (max-width:1099px){*{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;}
table, td, textarea, input, iframe, object, embed, video{max-width:100%;}
textarea, table, td, th{-webkit-hyphens:auto; -moz-hyphens:auto; -ms- hyphens:auto; -o- hyphens:auto; hyphens:auto; word-wrap:break-word;}
header{width:100%; margin:0; padding: 0;}
#logo{width:50%;}
#menu2{width:100%;}
#content{margin:0;}
#sidebar{position:relative; top:0; width:92%; margin:0; padding:1em 3%;}
footer{width:96%; padding:0.5em 3% 0 0;}
p{margin:0 0 1em 0;}
header a.access:link, header a.access:visited, #sidebar a.access:link, #sidebar a.access:visited{font-weight:normal; color:#309;}
#sidebar ul li, #sidebar ol li{font-size:1em;}
footer ul{margin:0.5em 0 1em 0;}
 }
@media screen and (max-device-width:768px) and (orientation:landscape){html{-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;}
 }
@media screen and (max-width:439px){body{font-size:85%;}
header ul li, footer ul li{width:30%;}
header h1{padding:0 3%;}
img.g, img.g-cinq, img.g-quatre, img.g-trois, img.g-deux, img.g-ctoct, img.g-ctvg, img.g-cent, img.g-oct, img.d, img.d-cinq, img.d-quatre, img.d-trois, img.d-deux, img.d-ctoct, img.d-ctvg, img.d-cent, img.d-oct{width:40%;}
img.six, img.cinq, img.quatre{max-width:90%;}
#lang img, #fb img{max-width:40%;}
img.pays{max-width:10%;}
 }
@media screen and (min-width:440px) and (max-width:609px){body{font-size:90%;}
header ul li, footer ul li{width:20%;}
header h1{padding:0 3%}
img.cinq{max-width:80%;}
img.six{max-width:97%;}
#lang img, #fb img{max-width:40%;}
img.pays{max-width:10%;}
 }
@media screen and (min-width:610px) and (max-width:819px){body{font-size:95%;}
#logo{width:40%;}
 }
@media screen and (min-width:820px) and (max-width:1099px){body{font-size:105%;}
#logo{width:30%;}
 }
@media screen and (min-width:1100px) and (max-width:1459px){body{font-size:100%;}
#logo{width:25%;}
#menu2{width:60%;}
 }
@media screen and (min-width:1960px){body{font-size:140%;}
 }