/* La Voix de l'Enfant
 * style:    original
 * author:   greg@eko-co.fr
 * rev:      27/02 '10
 */

* {
border: 0;
margin: 0;
padding: 0;
}

body {
font: 12px Arial, Verdana, sans-serif;
color: #515151;
background: white;
/* IE */
text-align: center;
}

h1, h2, h3, h4 { margin-top: 1em; margin-bottom: 0.5em; }
h1 { font-size: 1.4em; text-transform: uppercase; }
h2 { font-size: 1.2em; text-transform: uppercase; }
h3 { font-size: 1.2em; margin-left: 1em; font-weight: normal; }
h4 { font-size: 1em; margin-left: 1em; font-style: italic; }
ul, ol, dl { margin: 0.5em 0; padding-left: 2em; }
dt { font-weight: bold; }
p, address { margin: 0.5em 0; }
address { font-style: normal; }
img { border: 0; }
a, a:hover, a:visited { text-decoration: none; color: #f15a22; }
a:hover { color: black; }
input, select, textarea { border: 1px #ccc solid; margin-bottom: 0.1em; }
hr { clear: both; margin: 1em 0; border: 0; height: 1px; background: #f15a22; color: white; }

/* Layout */
#box {
width: 800px;
margin: 0 auto;
padding: 0 20px;
text-align: left;
background: transparent url(back.png) repeat-y left;
}

#header {
border-bottom: 1px black solid;
padding: 1em;
padding-left: 200px;
}
#header address {
font-size: 0.8em;
color: black;
text-align: right;
margin: 0;
margin-bottom: 25px;
}
#header address a { color: #ed2100; }
#header .donate {
margin: 0;
float: right;
position: relative;
top: -10px;
}

#panel {
position: absolute;
top: 0;
width: 171px;
color: white;
padding-top: 280px;
background: transparent url(/img/banner2.jpg) no-repeat top left;
}
#panel p { margin: 1em 12px; }
#panel ul { margin: 1em 0; }
#panel ul { list-style: none; padding: 0; text-transform: uppercase; font-size: 0.8em; }
#panel ul li.active { margin: 4px 0; }
#panel ul li a { display: block; height: 12px; padding: 9px 0 9px 12px; }
#panel ul li.sub a { padding: 5px 0 5px 20px; font-size: .9em; }
#panel ul li a,
#panel ul li a:visited { color: white; }
#panel ul li.active a,
#panel ul li a:hover { font-weight: bold; background: url(hover.png); }
#panel ul li.active a { font-weight: bold; font-size: 1.1em; color: black; }
#panel ul li.sub a { font-size: 1em; }
#panel ul li a:hover { color: black; }

#nav { font-size: 0.8em; padding-left: 180px; color: #f15a22; }
#nav a { color: #515151; }
#nav a:hover { color: #f15a22; }

#content {
padding: 15px;
padding-left: 200px;
clear: right;
height: 850px;
}
html>body #content {
height: auto;
min-height: 850px;
}
#content h1 { background: url(title.jpg); height: 23px; padding: 12px 0 15px 30px; margin: 0 -15px 1em -29px; line-height: 1em; }
#content h1 a { color: #f15a22; }
#content h2 { color: #f15a22; }
#content ul { list-style: square outside; }

#footer { font-size: 0.8em; clear: both; padding: 2em; padding-top: 0; margin: 0; color: white; }


/* Elements */

.encart {
float: right;
clear: right;
width: 203px;
margin: 0 0 1em 1em;
text-align: right;
background: white;
}
.encart div { margin-bottom: 1em; }
.encart h2 { margin: 0; padding: 10px 20px 0 15px; }
.encart dl { list-style: none; padding: 20px; padding-top: 0; margin: 0; }
.encart dt { padding-top: 0.4em; margin-top: 0.4em; }

.news { background: url(news-middle.png) repeat-y right; color: #ecc; }
.news h2 { font-weight: normal; background: url(news-top.png) no-repeat top; }
.news a, .news * a:visited { color: white; }
.news a:hover { color: black; }
.news dl { background: transparent url(news-bottom.png) no-repeat bottom left; }

.over { border-top: 1px #578fbb solid; padding-top: 1em; }
.sfr { font-size: 0.8em; color: red; }
.carole { border: 1px #d0d0d0 solid; border-width: 1px 0; margin-top: 2em; padding: 1em 0; height: 143px; }


/* Classes */

.hidden { display: none; }

.center { text-align: center; }
.small { font-size: 0.8em; }
.big { font-size: 1.2em; }

.border { border: 1px black solid; padding: 1em; margin: 1em 0; }
.blue { color: black; }

.left { float: left; margin-right: 1em; }
.right { float: right; margin-left: 1em; }
.icon { vertical-align: middle; }
.clear { clear: both; }
.cLeft { clear: left; }
.margin { margin-right: 213px; }

.nodots { list-style: none; }
.gotop { clear: right; font-size: 0.8em; padding-right: 10px; background: transparent url(top.png) no-repeat right; }

.info { text-align: right; font-style: italic; }
.link { margin-left: 1em; font-size: 0.9em; font-style: italic; }
.quote { margin: 1em; text-align: center; font-weight: bold; font-size: 1.2em; }
.signature { text-align: right; font-size: 0.9em; font-style: italic; }

dl.table dt, label, span.check { display: block; float: left; clear: left; width: 120px; text-align: right; margin-right: 1em; font-weight: bold; }
dl.table dd { margin-left: 120px; padding-left: 1em; }
span.required { color: red; }

.buttons { margin-top: 2em; }
a.step { display: block; width: 120px; padding: 2px 5px; border: 1px black solid; text-align: center; }
a.step img { vertical-align: middle; padding: 0; }
a.step:hover { background: black; color: white; }

.rolled, .unrolled { padding-left: 12px; background: transparent no-repeat left; }
.rolled { background-image: url(right.png); }
.unrolled { background-image: url(bottom.png); }
ul.entries { padding: 0; list-style: none; display: block; }
ul.entries li { display: block; clear: left; }
ul.entries li.selected input { background: #eee; }
ul.entries li.hidden { display: none; }

.albumBox { padding-top: 1em; clear: left; }
.albumThumb { float: left; width: 100px; text-align: center; padding: 5px; border: 2px black solid; margin-right: 1em; }
.albumBox h2, .albumBox h3 { margin: 0; margin-bottom: 0.5em; }
#photosBox { margin-left: -24px; margin-right: -10px; width: 611px; height: 130px; overflow-x: auto; }
#photosList { display: block; list-style: none; padding: 0; margin: 0; }
#photosList li { display: block; float: left; padding: 3px; }
#photosList a { display: block; text-align: center; border: 2px transparent solid; height: 100px; width: 100px; }
#photosList a.selected { border-color: #f15a22; }
#photoBox { clear: left; padding-top: 1em; text-align: center; }
#photoBox div { text-align: left; margin: 1em 50px; }

.google { display: block; clear: left; height: 3em; padding-left: 90px; background: transparent url(google.gif) no-repeat left; }
.f { display: none; }
.w { float: left; margin-right: 0.5em; }

/* Admin */

#message { font-weight: bold; }
.wait { color: blue; }
.fail { color: red; }
.success { color: green; }

#buttonsBox img { vertical-align: middle; }
#buttonsBox .bold { font-weight: bold; }
#toolFrame { visibility: hidden; position: absolute; top:0; border: 1px navy solid; background: white; width: 1px; height: 1px; }

.edit { width: 300px; float: left; }
.value { width: 240px; float: left; }
label.key { width: 220px; }
label.key input { width: 200px; text-align: right; }
span.edit, label.edit { display: block; clear: none; margin: 0.1em 0; text-align: left; }
.error { border-color: orange; }
.missing { border-color: red; }
.buttons { clear: both; padding-top: 1em; text-align: right; }
.outdent { float: left; position: relative; left: -25px; }


/* Rich Text Edit */

.rteImage { background: white; border: 1px solid white; cursor: pointer; }
.rteImageRaised, .rteImage:hover { background: white; border: 1px outset; cursor: pointer; }
.rteImageLowered, .rteImage:active { background: white; border: 1px inset; cursor: pointer; }

.rteSep { margin: 0 4px 0 4px; width: 1px; height: 25px; }

.rteBack div { display: inline; }
.rteBack select { padding: 0; border: 1px black solid; margin-right: 10px; margin-bottom: 5px; }
.rteBack .label { color: #ccc; }

.rteDiv { margin-top: 1em; }

.rtePalette { width: 154px; height: 104px; visibility: hidden; position: absolute; left: 0; }


/* Debug */

#debug { display: none; position: fixed; left: 0; top: 0; margin: 0; width: 8em; height: 8em; overflow: hidden; opacity: 0.5; border: #ccc dotted; border-width: 0 4px 4px 0; text-align: left; background: white url(debug.png) no-repeat top left; color: black; }
html>body #debug { display: block; }
#debug h2 { margin: 5px 0 0.5em 10px; font-size: 1.2em; }
#debug p { padding: 1em; }
#debug dl { padding: 0.2em 1em; margin: 0; display: block; clear: left; cursor: pointer; }
#debug dt { float: left; margin-right: 1em; color: #555; }
#debug dd { display: none; font-family: monotype; color: #888; }
#debug dd span { display: none; font: 0.8em sans-serif; padding: 0.1em 10em; }
#debug dl:hover { background: #eee; }
#debug dl:hover dd { color: black; }
#debug dl:active dd span { display: block; }
#debug:hover { opacity: 0.9; width: 100%; border-right: 0; padding-bottom: 1em; height: auto; min-height: 7em; }
#debug:hover dd { display: block; }