body
{
    font-size:10pt;
    font-family:sans-serif;
    margin:0 auto;
    padding:0;
    background:#668877;
    color:white;
    background:#339966 url(../images/v3-bandeau-vert.jpg) 350px 0px repeat;
}

#bandeau
{
    position:relative;
    display:block;
    color:white;
    background:#339966 url(../images/v3-bandeau-vert.jpg) 350px 0px repeat;
    border-bottom:1px solid #004444;
    padding:1em 0 4.5em 0;
    width:100%;
    z-index:100;
}

#pied
{
    position:relative;
    display:block;
    border-top:1px solid #004444;
    padding:2em;
}

#pied a
{
    color:white;
}

#pied a:hover
{
    color:white;
    text-decoration:underline;
}


#contenu
{
    display:table;
    width:100%;
    padding:0;
    color:#222222;
    background:white;
}

/*
 * Bandeau
 */
#titre
{
    padding:0 2em;
    display:block;
}

#titre a
{
    color:white;
}

#titre .titre
{
    position:relative;
    font-size:20pt;
    font-family:serif;
    font-weight:bold;
}

#titre .soustitre
{
    font-size:16pt;
    font-family:serif;
    font-style:italic;
}

#bandeau .logo
{
    display:none;
    position:absolute;
    bottom:-25px;
    right:0;
    width:250px;
    height:211px;
    background:url(../images/v3-crieur.png);
}
/*
ul.nav li {
    list-style:none;
    float:left;
}
*/


#topnav
{
    display:block;
    position:absolute;
    top:0;
    right:50px;
}

#raccourci
{
    padding:0.5em;
    margin:0;
    background:#ced;
    -moz-opacity:0.9;
    opacity:0.9;
    -moz-border-radius:0 0 1em 1em;
    border-radius:0 0 1em 1em;
    -moz-box-shadow: 0px 0px 15px black;
    -webkit-box-shadow: 0px 0px 15px black;
    box-shadow: 0px 0px 15px black;
    display:block;
    font-size:9pt;
}
#raccourci li
{
    display:inline;
    margin:0 0.5em;
}

#raccourci li a
{
}

/*
 * Menu déroulants v2
 */

#nav2
{
    width:100%;
    position:absolute;
}

#nav2 ul
{
   margin: 0;
   padding: 0.5em 1em;
   list-style: none;
}

#nav2 li
{
    margin: 0pt;
    padding: 0pt;
    list-style: none;
    display: block;
    float:left;
    width: 20%;
}

#nav2 ul a
{ 
    margin: 1em;
    padding: 1em;
    background: white none repeat scroll 0% 0%;
    opacity: 0.75;
    -moz-box-shadow: 0 0 10px #002222;
    -webkit-box-shadow: 0 0 10px #002222;
    box-shadow: 0 0 10px #002222;
    display: block;
    background:#004444;
    color:white;
    font-weight: bold;
    text-shadow: 1px 1px 2px #000;
    position:relative;
    -moz-border-radius:0.5em 0.5em 0em 0em;
    -webkit-border-radius:0.5em 0.5em 0em 0em;
    border-radius:0.5em 0.5em 0em 0em;
    line-height:1em;
}

#nav2 .deroule-self a
{
    background:#000000;
}


#nav2 ul a:hover
{
    background:#000000;
}

#nav2 ul li:hover a
{
    background:#000000;
    opacity: 1;
    -moz-border-radius:0.5em 0.5em 0em 0em;
    -webkit-border-radius:0.5em 0.5em 0em 0em;
    border-radius:0.5em 0.5em 0em 0em;
}

#nav2 ul li:hover ul a
{
    background:#004444;
    -moz-border-radius:0em;
    -webkit-border-radius:0em;
    border-radius:0em;
}

#nav2 ul li:hover ul a:hover
{
    background:#000000;
}


#nav2 ul ul a
{
    text-shadow: none;
    position:auto;
    margin: 0em;
    padding: 0.3em 1em;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    display: block;
    color:white;
    font-weight: normal;
    -moz-text-shadow: none;
    -webkit-text-shadow: none;
    text-shadow: none;
    font-size:9pt;
    white-space:normal;
    line-height:normal;
}

#nav2 ul ul
{
    padding:0;
    margin:0 1em;
    top:-1em;
    -moz-box-shadow: 0 0 10px #002222;
    -webkit-box-shadow: 0 0 10px #002222;
    box-shadow: 0 0 10px #002222;
    position:relative;
    min-width:0;
    -moz-border-radius:0 0 0.5em 0.5em;
    -webkit-border-radius:0 0 0.5em 0.5em;
    border-radius:0 0 0.5em 0.5em;
    padding-bottom:0.6em;
    background:#004444;
    -moz-opacity: .95;
    -webkit-opacity: .95;
    opacity: .95;
}

#nav2 ul ul li
{
    margin: 0pt;
    padding: 0pt;
    list-style: none;
    display: block;
    float: none;
    width: auto;
}

/*
 * Menu déroulants
 */

#nav
{
    display:block;
    position:absolute;
    right:50px;
    bottom:0px;
    color: #229a76;
}

.nav a
{
    text-decoration:none;
}

.nav,
.nav ul, .nav li
{
    margin:0;
    padding:0;
}

.nav .deroule ul
{
    display:none;
}

.nav .deroule:hover ul
{
    display:block;
}


#nav-atelier .deroule,
#nav .deroule
{
    line-height:2.4em;
    padding:0em 0.4em;
    font-weight:bold;
    -moz-border-radius:0.5em 0.5em 0 0;
    -webkit-border-radius:0.5em 0.5em 0 0;
    border-radius:0.5em 0.5em 0 0;
    border-left:1px solid #002222;
    border-right:1px solid #002222;
    border-top:1px solid #002222;
    border-bottom:1px solid #004444;
    min-width:9em;
    text-align:center;
    background:#44aa88;
    color:#022;
    bottom:-1px;
    margin-right:0.5em;
}

#nav-atelier .deroule-self,
#nav .deroule-self
{
    background:#004444;
    color:white;
    text-shadow: 1px 1px 2px #000;
    -webkit-text-shadow: 1px 1px 2px #000;
    -moz-text-shadow: 1px 1px 2px #000;
}

#nav-atelier .deroule:hover,
#nav .deroule:hover 
{
    background:#004444;
    color:white;
    text-shadow: 1px 1px 2px #000;
    -webkit-text-shadow: 1px 1px 2px #000;
    -moz-text-shadow: 1px 1px 2px #000;
}

.nav,
.nav ul
{
    text-align:left;
}

.nav li
{
    position:relative;
    float:left;
    display:block;
}

.nav li a
{
    color:inherit;
    white-space:nowrap;
}

.nav li ul
{
    text-align:left;
    display:block;
    position:absolute;
    top:100%;
    z-index:50;
    min-width:100%;
}

#nav-atelier li ul,
#nav li ul
{
    left:-1px;
    line-height:1em;
    background:white;
    color:#006633;
    border-top:3px solid #004444;
    border-left:1px solid #002222;
    border-right:1px solid #002222;
    border-bottom:1px solid #002222;
    -moz-border-radius:0em 0em 1em 1em;
    -webkit-border-radius:0em 0em 1em 1em;
    border-radius:0em 0em 1em 1em;
    text-shadow: 1px 1px 0px #EEE;
}

.nav li ul li
{
    display:block;
    float:none;
    width:auto;
}

#nav-atelier li ul li a,
#nav li ul li a
{
    display:block;
    padding:0.3em 0.5em;
    white-space:nowrap;
    color:inherit;
    font-weight:normal;
}

#nav-atelier li ul li a:hover,
#nav li ul li a:hover
{
    color:black;
}

#raccourci .recherche form
{
    display:inline;
    margin:0em;
    padding:0em;
}

#raccourci .recherche p,
.nav .recherche p
{
    margin:0em;
    padding:0em;
    white-space:nowrap;
    display:inline;
}

#raccourci .recherche input.champs,
.nav .recherche input.champs
{
    width:8em;
}

#raccourci .recherche input.bouton,
.nav .recherche input.bouton
{
    width:2em;
}
/*
 * Colonne
 */

.colonne
{
    display:table-cell;
    width:50%;
    padding-bottom:1.5em;
}

.centree
{
    background:white;
    width:100%;
}

.untier
{
    width:33.3%;
    background:#eee;
    border-left:#ddd solid 1px;
    border-right:#ddd solid 1px;
}

.untier .inc-colonne
{
    background:#eee;
}

.deuxtiers
{
    width:66.6%;
}

.centree .inc-colonne
{
    max-width: 60em;
    padding: 1em 2em;
}

.deuxtiers .inc-colonne
{
    padding: 1em 2.5em;
}



.inc-colonne
{
    margin:0 auto;
    max-width:80em;
    min-height:25em;
    padding: 1em 2em;
    position:relative;
}

.debut-ligne
{
    clear:both;
}

.clear
{
    clear:both;
}

h3.clear
{
    padding-top:2em;
}

/*
 * Divers
 */

p
{
    text-align:justify;
}

small
{
    color:#888;
}

a
{
    color:#006666;
    text-decoration:none;
}

a:hover
{
    color:green;
}

#contenu li > p
{
    text-align:left;
}

#contenu p
{
    line-height:1.5em;
}

#contenu li a,
#contenu p a
{
    border-bottom:#006666 dotted 1px;
}

#contenu li a:hover,
#contenu p a:hover
{
    border-bottom-style:solid;
    border-bottom-color:green;
}

#contenu .listeFichiers li a
{
    border-bottom:none;
}

#contenu ul
{
    overflow:hidden;
}

#contenu li
{
}

a img
{
    border:0;
    vertical-align:middle;
}

h1
{
    font-size:18pt;
    margin-bottom:1em;
    margin-top:1em;
    position:relative;
}

h1 .sur-titre
{
    position:absolute;
    top:-1.2em;
    font-size:10pt;
    font-variant:small-caps;
    font-weight:normal;
    color:#ccc;
}

h1 + .soustitre
{
    margin-top:0;
    margin-bottom:0;
    position:relative;
    top:-1.5em;
}

h1 + .soustitre,
h1 .soustitre
{
    font-size:11pt;
    color:#aaa;
}

h1.titre-colonne
{
    margin-left:0.5em;
}

h2
{
    clear:both;
    font-size:14pt;
    position:relative;
    padding-top:1.5em;
}

h2:first-child
{
    padding-top:0em;
}

h2 + .soustitre
{
    font-size:11pt;
    color:#aaa;
    margin-top:0;
    margin-bottom:0;
    position:relative;
    top:-1.1em;
}

h1 + .soustitre + p,
h2 + .soustitre + p
{
        margin-top:0;
}

.untier h2
{
    font-weight:bold;
    font-size:11pt;
    text-shadow: 0px 0px 2px #bbb;
    white-space:nowrap;
}

h2 .rss
{
    float:right;
    top:0.5em;
    font-size:9pt;
    font-weight:normal;
}

h3
{
    font-size:inherit;
}

h3 + .soustitre
{
    font-size:10pt;
    color:#aaa;
    margin-top:0;
    margin-bottom:0;
    position:relative;
    top:-1.1em;
}

h3 a .nombre
{
    color:#bbbbbb;
}

table.tracker td
{
    padding-top:0.5em;
    padding-bottom:0.5em;
}

table
{
    margin:1em auto;
    width:100%;
    border-collapse:collapse;
}

table table
{
    margin:0;
    width:100%;
}

table th
{
    border-top:1px solid #999;
    border-bottom:1px solid #999;
    text-align:left;
    background:#EEE;
    padding:0.3em 0.4em;
    white-space:nowrap;
}

table td
{
    border-top:1px solid #DDD;
    border-bottom:1px solid #DDD;
    padding:0.2em 0;
}

table .num
{
    text-align:center;
}

table .droite
{
    text-align:right;
}

table table td
{
    border:none;
}

table tr:hover
{
    background:#FAFAFA;
}

form
{
    width:100%;
    margin:0;
    padding:0;
}

.form td
{
    margin:0;
    padding:0;
}

.sysPubli .basePaneau,
.form textarea,
.form input,
.form select
{
    margin:0;
    padding:0;
    font-size:10pt;
    font-family:sans;
    position:relative;
    width:100%;
}


.sysPubli table.form
{
    width:100%;
}

.sysPubli table.form td
{
    border:none;
}



.sysPubli .basePaneau
{
    border-top:2px solid green;
    border-bottom:2px solid green;
}

.sysPubli .basePaneau label
{
    font-weight:bold;
}
.sysPubli .baseSelection
{
    overflow:auto;
    margin:0;
    padding:0;
    margin-top:1em;
    padding-left:1em;
}

.sysPubli .baseSelection li
{
    display:block;
    float:left;
    margin:0;
    padding:0;
}

#contenu .sysPubli .baseSelection li a
{
    display:block;
    text-decoration:none;
    padding:0.2em 0.5em;
    border-top:1px solid #ddd;
    border-right:1px solid #ddd;
    border-left:1px solid #ddd;
    border-bottom:none;
    background:#eee;
}

#contenu .sysPubli .baseSelection li a.selected
{
    background:green;
    color:white;
    border-color:green;
}

#contenu .sysPubli .baseSelection li a:hover
{
    background:green;
    color:white;
    border-color:green;

}

.form textarea
{
    height:30em;
}
/*
 * Liste liens
 */
h2.liste-liens,
h3.liste-liens
{
    border-bottom:1px solid lightgrey;
}

#contenu ul.liste-liens
{
    padding:0;
    margin:0;
    list-style:none;
    padding-left:20px;
}

#contenu ul.liste-liens li
{
    padding:0;
    margin:0.5em 0;
    list-style:outside;
    list-style-image:url(../images/li.png);
    /*border-left:0.35em solid lightgrey;*/
    position:relative;
    left:0em;
}

#contenu ul.liste-liens li:hover
{
    list-style-image:url(../images/li.png);
    list-style-image:url(../images/li-hover.png);
    /*border-left:0.35em solid #006666;*/
}

#contenu ul.liste-liens li.sel
{
    /*border-left:0.35em solid #006666;*/
    list-style-image:url(../images/li.png);
    list-style-image:url(../images/li-sel.png);
}



#contenu ul.liste-liens li a
{
    border:none;
    padding:0;
}

ul.liste-liens .sous-titre
{
    font-size:9pt;
    position:relative;
    top:-0.25em;
    color:#999;
}

td .sous-titre
{
    font-size:8pt;
    position:relative;
    top:-0.2em;
    color:#aaa;
}



/*
 * Ressources
 */

.livreImage,
.filmImage
{
    float:left;
    margin-right:1em;
    margin-bottom:1em;
    border:1px solid #bbb;
}

.description,
.film .contenu,
.livre .contenu
{
    overflow:auto;
}

.livre, .film, .texte, .citation, .lien
{
    clear:left;
    padding:2em 0;
    position:relative;
}

.listeFichiers
{
    overflow:auto;
    margin-top:1em;
    font-weight:bold;
}

.listeFichiers ul
{
    list-style:none;
    text-align:center;
    margin:1em 0;
    padding:0;
}

.listeFichiers li
{
    float:left;
}

.listeFichiers a
{
    font-weight:normal;
    display:block;
    width:16em;
    font-size:9pt;
    overflow:hidden;
}

/* Selection theme */

#contenu div.selectionTheme
{
    display:block;
    padding:0.2em 0;
    margin-bottom:2em;
}

#contenu div.selectionTheme .blocs a
{

    text-decoration:none;
    color:#888;
    display:block;
    width:14em;
    float:left;
    text-align:left;
    margin:4px; 
    padding:0;
    border:1px solid #ddd;
    background: #FAFAFA;

    height:80px;
    position:relative;
    display:block;
    overflow:hidden;
    vertical-align: middle;

}

#contenu div.selectionTheme .blocs  a.selected
{
    color:#AA0000;  
    border:1px solid black;
    background: none;
}

#contenu div.selectionTheme .blocs  a:hover
{
    border:solid 1px #000000;
    background:#00AA00;
    color:#FFFFFF;
    cursor:pointer;
}

#contenu div.selectionTheme .blocs a .txt 
{
    display: block;
    overflow:auto;
}

/* vertical centering burk */

#contenu div.selectionTheme .blocs a .txt .outer 
{
display: table;
#display: block;
height: 80px;
#position: absolute;
#top:0;
#left:0;
overflow: hidden;
width:100%;
}

#contenu div.selectionTheme .blocs a .txt .inner
{
display: block;
#position: relative;
#top: -50%;
}
#contenu div.selectionTheme .blocs a.avecvignette .txt .inner
{
#padding-left:80px;
}
#contenu div.selectionTheme .blocs a.avecvignette .txt .middle
{
    text-align:left;
}
#contenu div.selectionTheme .blocs a .txt .middle
{
#position: relative;
#top: 50%;
display: table-cell;
#display: block;
#padding-left:0.5em;
vertical-align: middle;
width:100%;
text-align:center;
}


#contenu div.selectionTheme .blocs a .img 
{
    display: block;
    float:left;
    width:80px;
    height:80px;
}

#contenu div.selectionTheme .blocs a img 
{
    width:80px;
    height:80px;
}

#contenu div.selectionTheme .blocs a.avecvignette .txt 
{
    padding-left:0.25em;
    text-align:left;
}

#contenu div.selectionTheme label a
{
    font-weight:bold;
    text-decoration:none;
}

/*  illustrations  */

.illustration,
.illustration p
{
    text-align:center;
}
.illustrationListe
{
    background:white;
}

.illustrationListe a img
{
    border:solid 1px #000000;
}

.illustrationListe a:hover img
{
    border:solid 1px #000000;
}

.illustrationListe .item,
.illustrationListe.item
{
  float:left;
  margin-right:10px;
  margin-bottom:10px;
}

.illustrationListe .legend
{
   display:block;
   font-size:9pt;
   line-height:90%;
}

.illustrationListe .finListe
{
  clear:left;
}

/*  Citation  */

.citation
{
    padding:0 1em 1em 1em;
    margin:2em 0em;
    border:1px solid #ddd;
    background:#FAFAFA;
}

.citationContenu
{
    margin-top:1em;
    margin-bottom:1em;
    color:#222222;
  line-height:150%;
}

.citationContenu:first-letter
{
  font-weight:bold;
  font-size:150%;
}
.citationSource
{
  text-align:right;
  color:#883355;
}



/* Atelier spécifique */

#nav-atelier
{
    display:block;
    position:absolute;
    top:0;
    left:0;
}

#nav-atelier .deroule
{
    color:white;
    background:black;
    border-color:black;
    border-radius:0;
    -moz-border-radius:0;
    margin:0 0.25em;
    line-height:1.5em;
    padding:0 0.25em;
    bottom:auto;
}
#nav-atelier .deroule ul
{
    border-top-color:black;
}

#nav-atelier .deroule:hover
{
    text-shadow: 0px 0px 10px white;
}

.listeFichiers li
{
        position:relative;
}

.listeFichiers a.modifier,
div > a.modifier
{
        position:absolute;
        top:0.5em;
        right:1em;
        width:auto;
}

div.citation  a.modifier
{
        position:absolute;
        top:-0.8em;
        right:-0.8em;
}



h1 > a.modifier,
h2 > a.modifier
{
        float:right;
}

a.modifier
{
        width:auto;
        font-size:12pt;
        background:black;
        color:white;
        font-weight:bold;
        padding:0.25em 0.38em;
        -moz-border-radius:1em;
        border-radius:1em;
        -moz-box-shadow: 0px 0px 5px black;
        text-shadow: 0px 0px 3px;
}
a.modifier:hover
{
        color:green;
}

.citationContenu:before,
.citationContenu:after
{
        text-shadow:0 0 5px #ccc;
        color:#CCC;
        position:absolute;
        font-weight:bold;
        font-size:36pt;
        font-family:serif;
}

.citationContenu:before
{
        content:'«';
        left:-0.65ex;
        top:-0.15ex;
}
.citationContenu:after
{
        content:'»';
        right:-0.65ex;
        bottom:-0.15ex;
}

#bandeau.accueil
{
    padding-bottom:0em;
}

#menu-accueil
{
    position:relative;
    padding: 0.5em 1em;
}
#menu-accueil ul
{
   margin: 0;
   padding: 0;
   list-style: none;
   display: block;
   overflow:hidden;
   width:100%;
}

#menu-accueil li
{
    margin: 0pt;
    padding: 0pt;
    list-style: none;
    display: block;
    float:left;
    max-width: 20%;
    min-width: 9em;
}

#menu-accueil ul a
{ 
    margin: 1em;
    padding: 1em;
    background: white none repeat scroll 0% 0%;
    -moz-opacity: 0.75;
    -webkit-opacity: 0.75;
    opacity: 0.75;
    -moz-box-shadow: 0 0 10px #002222;
    -webkit-box-shadow: 0 0 10px #002222;
    box-shadow: 0 0 10px #002222;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    border-radius:0.5em;
    display: block;

    position:relative;
    background:#004444;
    color:white;
    line-height:1em;
    min-height:5em;
}

#menu-accueil ul a:hover
{
    background:#000000;
}

#menu-accueil ul a:after
{
    content:'…';
    font-weight:bold;
    position:absolute;
    bottom:.25em;
    right:.25em;
    opacity:0.5;
}

#menu-accueil ul a .titre
{ 
    font-weight: bold;
    text-shadow: 1px 1px 2px #000;
    line-height:1.5em;
    position:relative;
    top:-0.25em;
}

#menu-accueil ul a .resume
{
    font-size: x-small;
}

.une
{
    position:absolute;
}


/* Pour les texte en html
 */

.html-contenu h1 {
    
}

.html-contenu img {
    text-align:center;
    margin:2.5em auto;
    display:block;
}

.html-contenu .cartouche {
    margin-bottom:5em;
}

.html-contenu .cartouche h1 {
    text-align:center;
}

.html-contenu .cartouche .resume {
    margin:5em auto;
    max-width:40em;
}
.html-contenu .cartouche .auteur {
    text-align:center;
}

.html-contenu .cartouche .sous-titre {
    text-align:center;
}