* { 
font-size: 88%;
font-family: "freesans", "liberation sans", "helvetica", "arial", sans-serif;
box-sizing: border-box !important;
}
body { 
padding: 0px;
margin: 1ex auto;
width: 96%;
}
strong { 
font-size: 1.4em;
}
pre { 
font-size: 1.1em;
}
em { 
font-size: 1.1em;
}
abbr { 
text-decoration: none;
}
div#head { 
position: absolute;
left: 0.3em;
top: 1.2em;
margin: 0.3em 0em;
height: 12em;
padding: 0ex;
width: 28em;
}
div#head h1 { 
float: left;
width: auto;
margin: 1ex 0.5ex 1ex 0ex;
font-size: 2em;
line-height: 90%;
height: 20%;
padding: 0ex;
}
h1 > span { 
font-size: 0.6em;
margin-left: 0px;
display: block;
text-align: right;
color: #223300;
}
h1 a { 
text-decoration: none;
color: #332200;
}
div#menu { 
position: absolute;
left: 19em;
top: 1.5em;
width: 62em;
margin-top: 1.5em;
margin-left: 1.5ex;
padding: 0ex;
border-left: 3px solid #000000;
font-size: 0.7em;
}

code, kbd { 
font-variant: small-caps;
}
code::after { 
content: ">";
}
code::before { 
content: "<";
}

#menu ul { 
margin: 0px;
padding: 0px;
font-size: 1.7em;
width: 100%;
}
#menu ul li { 
display: inline;
margin: 0ex 0.5ex;
padding: 2px;
}
#menu ul li a:link, #menu ul li a:visited { 
text-decoration: none;
font-weight: 700;
color: #442200;
padding-top: 1px;
}
#menu ul li a:hover { 
background-color: #223300;
color: #ffffff;
text-decoration: underline overline;
}
li#here { 
display: inline;
line-height: 30%;
font-size: 1.5em;
}
ul#sb { 
margin-right: 4em;
padding: 0ex;
list-style: none;
float: left;
font-size: 50%;
border-top: 2px solid #000000;
width: 96%;
}
ul#sb li { 
display: block;
float: left;
width: 8.5em;
height: 4.7em;
margin: 0em;
padding: 1ex;
vertical-align: top;
line-height: 100%;
}
ul#sb li a:link, ul#sb li a:visited { 
display: inline;
text-decoration: none;
color: #000000;
font-weight: 700;
width: 9em;
height: 4.7em;
padding: 2px;
margin: 0px;
}
ul#sb li a:hover, ul#sb li a:active, ul#sb li a:focus { 
background-color: #332200;
color: #ffffff;
}
#content { 
clear: both;
font-size: 140%;
position: relative;
top: 9.2em;
margin: 2em auto;
width: 80%;
padding: 0em 1em;

}

h2 { 
font-size: 2.4em;
font-weight: 400;
line-height: 100%;
padding: 0px;
color: #225500;
}
h2 span { 
font-size: 1ex;
color: #552200;
font-weight: 700;
display: block;
}
h3 { 
font-size: 2em;
font-weight: 400;
line-height: 80%;
color: #222200;
}
h4 { 
font-weight: 400;
font-size: 1.8em;
line-height: 100%;
clear: both;
padding: 0px;
color: #552200;
margin-left: 1.6em;
}
p { 
font-size: 1.1em;
margin: 2ex 2em 1ex;
color: #000000;
widows: 3;
orphans: 3;
line-height: 150%;
}

div#content > ul, div#content > ol { 
margin-left: 3em;
font-size: 1.2em;

}
div#content > ol li, div#content > ul li  { 
margin-bottom: 1.5ex;
}
#content p > a { 
font-size: 105%;
}
hr { 
text-align: center;
width: 80%;
color: #442200;
clear: both;
}
a:link, a:visited { 
font-weight: 700;
color: #442200;
}
a:hover, a:focus, a:active, #content a:hover, #content a:focus, #content a:active { 
text-decoration: underline overline;
color: #ffffff;
background-color: #442200;
}
.imleft { 
float: left;
width: 18em;
margin: 1em;
border: 3px solid #223300;
}
.imlefts { 
float: left;
width: 4em;
margin: 1ex;
border: 3px solid #223300;
}
.imright { 
float: right;
width: 18em;
margin: 1em;
border: 3px solid #223300;
}
.imrights { 
float: right;
width: 4em;
margin: 1ex;
border: 3px solid #223300;
}
.ccbadge {
width: 6em;
}
div.update { 
border-top: 6px solid #552200;
border-bottom: 6px solid #552200;
width: 70%;
margin: 1em auto;
padding: 1ex;
}
div.update p { 
width: 90%;
margin: 1ex auto;
}
p.update { 
border-right: 3px solid #552200;
width: auto;
padding: 1ex;
margin: 2ex;
}
blockquote { 
border: 2px solid #552200;
background-color: #ddddbb;
padding: 0ex;
margin: 1ex auto;
clear: right;
width: 70%;
}
cite{ 
font-variant: normal;
font-weight: 900;
}

blockquote p > cite {
display: block;
text-align: right;
clear: both;
}
pre {
width: 36em;
white-space: pre-wrap;
}
ul.articles { 
list-style: none;
margin: 1ex auto !important;
width: 80%;
border-top: 2px solid #552200;
border-bottom: 2px solid #552200;
clear: both;
}
ul.articles li { 
width: 90%;
padding: 1ex;
margin-bottom: 2em;
font-size: 65%;
}
ul.articles li > blockquote { 
padding: 0px;
margin: 1ex 1ex 1ex -1em;
}
h2#resp { 
font-size: 1.8em;
margin-top: 1.5em;
}
div.pag { 
margin: 1em auto;
padding: 0ex;
font-size: 1em;
height: 4em;
text-align: center;
}
p + div.pag { 
text-align: right;
height: 2em;
margin-bottom: 0px;
}
ul.articles + div.pag { 
text-align: center;
width: 70%;
}
div.pag h2 { 
font-size: 80%;
margin-bottom: 0px;
color: #223300;
float: none;
width: 100%;
height: auto;
text-align: center;
display: inline;
}
div.pag ul { 
margin: 1ex auto;
display: inline;
text-align: center;
}
div.pag ul li { 
display: inline;
padding: 1ex;
font-size: 110%;
}
div.pag ul li.here { 
font-weight: 700;
font-size: 230%;
}
h3.da { 
font-weight: 400;
font-size: 1.6em;
line-height: 100%;
vertical-align: top;
text-align: left;
}
span.pr { 
display: block;
color: #225500;
font-weight: 700;
font-size: 80%;
}
span.comm { 
color: #663300;
font-weight: 700;
font-size: 105%;
margin-left: 1em;
}
ul.articles li > p.det { 
margin-top: 0px;
margin-left: 5em;
padding-top: 0px;
vertical-align: top;
}
p.ve > * { 
font-size: 0.8em;
}
ol.ve li { 
display: inline;
}
p.det > span.pr { 
font-size: 90%;
}
blockquote.det { 
border: none;
padding: 0px;
margin-top: -1.5em;
vertical-align: top;
width: 48em;
}

table { 
width: 100%;
margin: 1ex auto;
font-size: 100%;
border-spacing: 0px;
border-collapse: collapse;
}
span.value { 
display: none;
}
tr {
padding: 2em;
border-bottom: 1px solid silver;
}

thead tr > th { 
color: #225500;
font-weight: 400;
font-size: 1.3em;
text-align: center;
border-bottom: 2px solid #552200;
vertical-align: top;
}
td.det { 
width: 40%;
}
td.det > span {
font-size: 1.1em;
}
td.pr { 
text-align: center;
font-size: 1.1em;
color: #552200;
font-weight: 700;
}
th.da { 
font-weight: 400;
font-size: 1.1em;
color: #000000;
text-align: left;
border: none;
padding-left: 1ex;
}
td { 
vertical-align: top;
padding: 4px;
}
tr:nth-child(2n) { 
background-color: #efefef;
}

/*micro-formats*/
address {font-style: normal; font-size: 1em;}
.adr > span {display: block; font-size: 1.1em;}
.geo > * {display: none;}
#og  {display: none;}


div#addr {
width: 25em;
height: 20em;
float: left;
padding: 0;
font-size: 0.6em;
}
div#map {
width: 30em;
height: 20em;
float: left;
border: 3px solid #223300;
margin: 1em;
}
div#map ~ p {
clear: both;
padding: 1em;
font-size: 1.2em;
}

div.thumb { 
margin: 2em auto;
font-size: 0.8em;
text-align: center;
vertical-align: top;
width: 14em;
}
div.thumb img { 
width: 14em;
display: block;
margin: 0 auto;
border: 2px solid #225500;
}
.exa { 
text-align: center;
width: 50%;
margin: 1em auto;
border: 2px solid #442200;
background-color: #dddddd;
font-size: 1.3em;
padding: 1ex;
}
sup, sub { 
font-size: 58%;
}
form { 
padding: 1ex;
margin: 0px auto;
background-color: #dddddd;
border: 2px solid #bbbbbb;
width: 80%;
}
.shop { 
background-color: #ffffff;
border: none;
width: 12em;
float: right;
}
table.shop {float:left; width: 26em;}
table.shop tr {height: 5em;}

table.shop td {width: 6em;}
table.shop td.desc {width: 12em;}
table.shop td.price {font-weight: 400;}

.list {
background-color: #ffffff;
width: 18em;
float: right;
border-left: 2px solid silver;
padding-left: 1ex;
}

.list > * {border: none;  background-color: transparent; font-size: 120%; float: left;}
#cart > table {width: 18em; border-spacing: 0px; border-collapse: collapse;}
#cart table > tr {height: 2em;}
#cart table tr > th {text-align: left; font-weight: 400; vertical-align: top; font-size: 1.1em}
#cart table > td { vertical-align: middle; }
.rem {width: 10em; }

.lipo {
border-bottom: 2px solid #000;
background-color: #cdcdcd;
}

.lito {
border-bottom: 2px solid #000;
background-color: #fff;
}

a.addbut {text-decoration: none; color: #060; font-size: 3em;}
a.addbut:hover { content: '\BB'; text-decoration: none !important; background-color: transparent !important; color: #2a0 !important;}
a.rembut {text-decoration: none; color: #600; font-size: 3em; }
a.rembut:hover { content: '\AB'; text-decoration: none !important; background-color: transparent !important; color: #a20 !important;}
.buybut { 
font-size: 1.6em;
display: inline;
}
fieldset { 
border: none;
}
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: 1.2em;
}
legend { 
display: none;
}
textarea:focus, select:focus, input:focus, textarea:active, select:active, input:active { 
border: 4px solid #aaaaaa;
}
.fe { 
border: 4px solid #000000;
}
#hal { 
list-style-type: none;
}
#errlist { 
font-weight: 900;
margin-left: 8em;
font-size: 1em;
}
label span.mod { 
font-size: 0.8em;
color: #552200;
}
.err { 
background-color: #ffdd00;
border: 2px solid #552200;
padding: 1ex;
margin: 1ex auto;
width: 80%;
font-size: 1em;
clear: both;
}

#posted, .point { 
background-color: #dddddd;
border: 2px solid #000;
padding: 1ex;
margin: 1ex auto;
width: 80%;
font-size: 1em;
clear: both;
}


h2 + .note { 
/*background-color: #ffdd00;
border: 2px solid #552200;*/
padding: 1ex;
margin: 1ex;
margin-bottom: 2em;
width: 20em;
font-size: 1em;

}
.smallerr { 
font-size: 0.7em;
width: 90%;
}
#os0 { 
width: 60%;
margin-left: 3em;
font-size: 1.2em;
}
#b1, #b2 { 
margin: 1ex;
float: right;
font-weight: 900;
font-size: 1.2em;
}
#b2 { 
float: none;
display: inline;
margin-left: 0px;
}
#b1:active, #b1:focus, #b2:active, #b2:focus { 
background-color: #003300;
color: #ffffff;
border: 2px solid #ddff00;
}
object.svgplay { 
float: left;
margin: 2px;
width: 30%;
vertical-align: top;
padding: 0px;
height: 100%;
}
object.svgplay > p, object.svgplay > span { 
font-size: 1.2ex;
}
div#svdes { 
font-size: 0.95em;
margin: 0px;
}
form#sel { 
background-color: inherit;
border: 2px dashed #cccccc;
float: left;
width: 40%;
font-size: 90%;
height: 18.6em;
margin: 0px;
}
audio { 
width: 7.5em;
vertical-align: middle;
margin-top: -1ex;
margin-left: 1ex;
}
#sel input { 
height: 3em;
width: 3em;
font-size: 1em;
}
div#dis { 
float: left;
margin-top: 0px;
margin-right: 0px;
margin-left: 0px;
width: 58%;
border: 2px dashed #dddddd;
height: 20em;
margin-bottom: 1em;
}
div.audplay { 
clear: both;
width: 58em;
margin: 1em auto;
}
div.audplay + p { 
clear: both;
}
object.miniplay { 
display: inline;
vertical-align: middle;
width: auto;
}
#foot { 
position: relative;
top: 9em;
border-top: 2px solid #442200;
margin: 3.5em auto;
width: 50%;
padding: 1ex;
font-size: 1.5em;
text-align: center;
clear: both;
}
#foot h2 { 
display: none;
width: auto;
}
#foot ul { 
margin: 1ex auto;
width: 40%;
display: inline;
}
#foot ul li { 
margin-left: 0;
display: inline;
padding: 1ex;
}

@media all and (min-width: 800px) {
div#head h1 { 
font-size: 3em;
}
div#menu { 
left: 24.5em;
top: 1.5em;
width: 60em;
margin-top: 1.5em;
padding: 0ex;
border-left: 3px solid #000000;
font-size: 0.8em;
}
ul#sb li { 
float: none;
display: inline-block;
}
ul#sb li a:link, ul#sb li a:visited { 
display: block;
}
h2 > span { 
font-size: 1ex;
color: #552200;
font-weight: 700;
display: block;
}
h3 { 
max-width: 60%;
font-weight: 400;
line-height: 80%;
margin: 3ex 0.4ex 0.3ex 0.5ex;
clear: left;
}
h3.da { 
margin: 0ex 1ex 0ex 0ex;
vertical-align: top;
padding: 1ex 1ex 0ex;
}

}

@media all and (min-width: 1152px) {
* { font-size: 94%}
div#head {left: 4em;}
div#menu {left: 33em; width: 72em;}
}
