html { font-family: "liberation sans", helvetica, arial, sans-serif; color: #000; background-color: #fff; font-size: 16px;  padding: 0;}

body { margin: 4em; }


h1 { font-size: 240%; font-weight: 700;}

p {font-size: 105%; margin-right: 2em;}

a {color: #000; }
h1  a:link, h1  a:visited {text-decoration: none;}
a:link {  text-decoration: underline; background: transparent; color: #000;  }
a:visited {text-decoration: underline; background: transparent;}
a:hover { color:#fff; text-decoration: none; background-color: #000; }
a:focus { color:#fff; text-decoration: none; background-color: #000; }
a:active { color: #fff; text-decoration: underline; background-color: #000; }

ul {list-style-type: none; margin-top: 2px; margin-left: 0; padding: 0}
dfn {font-weight: 900; font-style: normal; }
blockquote {margin: 4%;height: auto;}
cite {display: block; font-variant: normal; font-weight: 900; text-align: right; }

form {padding: 1ex; margin: 0 auto; background-color: #ddd;  border: 2px solid #bbb;}
fieldset {border: 0;}
label {font-weight: 900; font-size: 1.2em; margin-left: 1em;}
select, textarea,#email,#nom {width: 85%; display: block; margin:1ex 2.6em; font-size: 120%;}
legend {display: none}
textarea:focus, select:focus, input:focus, textarea:active, select:active, input:active {border: 4px solid #aaa;}


#box2, #menu {margin: 3em 5.5em; padding: 0; }
#box1 {width: 23.5em; margin-left:3em;}

@media all and (min-width: 300px) {
#box1 h1:after {display: inline; font-weight: normal; position: absolute; top: 0ex; left:2.3em; font-size: 500%; content: "}";}

/*
blockquote:nth-of-type(1) { height: 22em; overflow-y: hidden; }

blockquote:nth-of-type(3) { height: 25em; overflow-y: hidden; }
blockquote:nth-of-type(1) p, blockquote:nth-of-type(3) p {visibility: hidden; }

blockquote:nth-of-type(1) p em, blockquote:nth-of-type(3) p em {
visibility: visible;
font-size: 1.1em; 
margin: 0; 
width: 60%; height: auto; 
float: left;
}

blockquote:nth-of-type(1) p em {position: relative; left:0em; top: -15em; }
blockquote:nth-of-type(3) p em {position: relative; left:0em; top: -9em; }

blockquote:nth-of-type(1) p:last-child em {top: -39em;}
blockquote:nth-of-type(3) p:last-child em {top: -36em;}
blockquote:nth-of-type(1) cite {
visibility: visible;
font-size: 1.1em; 
text-align: right;
position: relative; top: -34em; 
float: right;
}
blockquote:nth-of-type(3) cite {
visibility: visible;
font-size: 1.1em; 
text-align: right;
position: relative; top: -37.5em; 
float: right;
}

blockquote p em:after {content: " [...]"; white-space: nowrap;}

blockquote:target {height: auto;} 

blockquote:target p { visibility: visible; font-size: 1.1em }

blockquote:target p em {
display: inline; position: static; 
float: none;
}

blockquote:target cite {display: block; position: static;float: none }
blockquote:target p em:after {content:""}
.do {display: none; }
blockquote:target .do {display: inline;}
blockquote:target .up {display: none;}

*/
}

#box1 h2 {display:none;}

/*micro-formats*/
address {font-style: normal;}
.adr span {display: inline;}
div.location {display: inline;}
.org:after {content: ", "}
.locality:after  {content: ". "}
.geo *, span.tel, span.postal-code, span.street-address {display: none !important;}
span.value { display: none !important;}

#menu h2 {color: #ccc;margin-bottom: 2px;}
nav, div#menu {position: absolute; top: -1.8em; left:27em;}
nav ul, div#menu ul {font-size:100%}
nav ul li.here, div#menu ul li.here {text-decoration: none; font-weight: 900; font-size:200%;}

#box2 {width: 42em; margin: 5.5em 3em 0em 3em;}
#box2 h2 {font-size: 220%; font-weight: normal; margin-bottom: 0;}
#box2 h3 {font-size: 180%; font-weight: normal; margin-bottom: 0; display: inline;}
#box2 p {margin-bottom: 1ex;}
#box2 ul {font-size: 105%;}
#box2 ul li {margin-bottom: 1ex;}

a.depiction:link:before,a.depiction:visited:before, a.depiction:hover:before {content: attr(title); display: block; font-size: 10px; text-align: right; width: 18em; position: relative; left: 66em; top: 4em; text-decoration: none; /*float: right;*/ color: #000; margin: 0;}

div.front {float: left; width: 22em;}
div.thumb {margin-left: 1ex; font-size: 0.8em; text-align: center; float: left; width: 24em; margin-top: 1em;}
div.thumb > img {width: 24em; display: block;}
.fe {border: 4px solid #000}
#hal {list-style-type: none;}
#errlist {font-weight: 900;}
label span.mod {font-size: 0.8em; color: #333;}
.err {background-color: #eee; border: 2px solid #bbb; padding: 1ex; margin: auto;}
#os0 {width: 60%;margin-left: 3em; font-size: 110%; display: inline;}
#b1, #b2 {margin: 1ex; float: right; font-weight: 900; font-size: 110%; }
#b2 { float: none; display: inline; margin-left: 0}
#b1:active, #b1:focus, #b2:active, #b2:focus {background-color: #000; color: #fff; border: 2px solid #ccc;}

@media print {
body {font-size: 12pt; font-family: "liberation sans", helvetica, arial, sans-serif; color: #000; background-color: #fff; }
#menu { display: none;}
}
