body {
  background-color: #fff;
  color: #000;
  
  border-color: black;
  
  /* centrage horizontal */
  text-align: center;
  font-family: Arial,Helvetica,sans-serif;
  font-size: medium;
  
  padding: 0;
  margin: 0;
}

em {font-size: 100%}
img {border: 0;}

a {text-decoration: none; color: #000;}
a:hover {text-decoration: underline;}
h1 a {
  font-family:'Times New Roman',Times,serif;
  font-size: 18pt;
  color: #fff;
}
h1 a:hover {color: #d2b4b6; text-decoration: none;}

.spacer {clear: both;}
.clearleft {clear: left;}
.clearright {clear: right;}
.floatleftintext {float: left; padding-right: 10px; padding-top: 10px;}
.floatrightintext {float: right; padding-left: 10px; padding-top: 10px;}
.transparent80 {
    /* attention : pour IE, l'élément transparent doit avoir une largeur spécifiée */
    filter: alpha(opacity=80);  
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    opacity: 0.8;
}

#conteneur {
  /* centrage horizontal  */
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  width: 750px;
  background-repeat: no-repeat;
}

#plan ul li h3 {padding-top: 1.2em;}
#plan ul li ul {padding-top: 0;}
#plan ul li ul li {font-weight: bold;}

#accueil #conteneur {
  margin-top: 50px;
  width: 782px;
}
#accueil h1 {
  margin-top: 145px;
  margin-left: 8px;
}
#en-tete h1 {
  background-color: #681718;
  border-style: solid;
  border-width: 0 0 11px 0;
  margin: 0;
  padding: 10px 0 10px 6px;
}
#en-tete h1 a {
  font-size: 16pt;
}
#questions #conteneur {
  background-image: url(images/fond-themes.png);
}
#reponses #conteneur {
  background-image: url(images/fond-fiches.png);
  background-repeat: repeat-y;
}

#accueil #cadre {
  background-image: url(images/fond-accueil.jpg);
  background-repeat: no-repeat; 
  height: 428px;
  width: 750px;
  
  border: 16px solid black;
}
#entree-dossier {
  background-image: url(images/petite-croix.png);
  background-repeat: no-repeat; 
  background-position: center right;
  padding: 4px 22px 4px 4px;
  font-weight: bold;
  text-decoration: underline;
  float: right;
  margin-top: 40px;
  margin-right: 40px;
  font-size: 80%;
  min-height: 17px
}
a:hover#dossier {text-decoration: none;}

#questions #en-tete {
}
#reponses #en-tete {
}

#contenu {
 background-position: top left;
 padding: 0;
 }
 
#questions #contenu {
 height: 1100px;
 background-image: url(images/jube-md.jpg);
 background-repeat: no-repeat; 
 margin-top: -39px; /* permet de caler le titre (h2) par dessus le contenu */
 position: relative;
 z-index: 0;
}

#reponses #contenu {
 background-image: url(images/fond-reponses.jpg);
 background-repeat: repeat-y;
 min-height: 500px;
}
 
 #pied {  
  clear: both;
  text-align: right;
  float: right;
  font-size: 70%;
  
  border: 16px solid black;
  border-top: 0;
  padding: 5px 10px;
}

#accueil #pied {
  margin: -16px 0 0 0;
  background-color: #833134;
  color: white;
}

#pied a {color: white;}

a.collection-integrale {
/*
  background-color: black;
  color: #fac74d !important;*/
  font-weight: bold;
  background-image: url(images/fleche-collection.gif);
  background-position: center right;
  background-repeat: no-repeat;
  padding: 0px 10px 0px 2px;
  min-height: 10px;
}

#en-tete #pied {
  padding-top: 2px;
  padding-bottom: 2px;
  margin: -9px 0 0 0;
  border-width: 0 0 8px 11px;
  background-color: #e2cfd1;
  color: #681718;
  z-index: 2;
  position:relative;
}
#en-tete #pied a {color: #681718;}

#logo-lectura {
  float: right;
  margin-top: 5px;
  margin-right: 5px;
}

#bandeau-menu {
  border-style: solid;
  border-width: 0 0 11px 0;
  height: 197px;
  width: 750px;
  background-image: url(images/parchemin-rose.jpg);
  background-repeat: no-repeat;
  z-index: 1;
  padding-top: 2px;
}
#reponses #bandeau-menu {
  height: 65px;
  background-image: url(images/parchemin-rose-fin.jpg);
}
#bandeau-menu a#current {}

.croix {
  background-repeat: no-repeat;
  min-height: 42px;
  min-width: 42px;
}
#questions a.croix {background-position: center left;}

.croix.jaune, .croix.moyen-age {background-image: url(images/croix-jaune.png);}
.croix.bleue, .croix.passions {background-image: url(images/croix-bleue.png);}
.croix.verte, .croix.edition {background-image: url(images/croix-verte.png);}
.croix.rouge, .croix.techniques {background-image: url(images/croix-rouge.png);}

#bandeau-menu div {
  font-weight: bold;
  margin: 0 0 0 5px;
  padding: 15px 0;
}
#bandeau-menu a, #bandeau-menu h2 a {font-size: 10.5pt; font-weight: bolder; padding: 12px 0 15px 48px; margin: 0;}
#bandeau-menu h2 {line-height: 1em; margin: 0;}
#reponses h2 {padding-top: 10px;}
#reponses h4 {text-align: center;}


#contenu {padding: 0 49px;}
#questions #contenu {padding-top: 59px} /* permet d'éviter que le contenu soit écrasé par le titre (h2)  + padding de 20px */

/* titre des pages de questions et de réponses */
#questions h2 {
  width: 100%;
  height: 25px;
  margin: 0;
  text-align: center;
  font-size: 12pt;
  font-weight: bold;
  background-color: #e2cfd1;
  padding: 9px 0 4px 0;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  position: relative;
  z-index: 1;
}

h3 {
  font-size: 105%;
  line-height: 1.2em;
}

#techniques h3 {line-height: 1.3em;}

#reponses h3 {
  margin: 0;
  position: relative;
  left: 10px;
}

#reponses #retour-theme {
  border: 1px solid black;
  float: left;
  margin-top: -1px;
  margin-left: -49px;
}
.indication {
  font-style: italic;
  font-weight: bold;
  font-size: 80%;
  padding-top: 5px;
  padding-left: 5px;
  zoom: 1;
}

.indication p.legende {padding-top: 0px; margin-top: 0; text-align: center;}
#questions .indication {
  float: left; 
  padding-left: 40px;
}
#questions .indication.imageblock {padding-left: 65px;}
#ange.indication {float: right; padding-left: 0;}

/* libellé des questions */
#questions .question h3 {
  display: block;
  background-position: top left;
  padding: 48px 0 0 48px;
  margin: 0;
  zoom: 1;
}

#questions .question {
  padding-top: 0;
  clear: right;
}
#reponses .question {padding-top: 10px;}

.reponse {
  clear: left;
  text-align: justify;
  padding-top: 15px;
}
.reponse p {text-indent: 3em;}

.question a.lienreponse {
  float: right;
  z-index: 3;
}

#questions #moyen-age {margin-top: 55px;}
#questions #moyen-age #q1 {width: 625px; padding-top: 20px;}
#questions #moyen-age #q2 {width: 490px; padding-left: 100px; padding-top: 45px;}
#questions #moyen-age #q3 {width: 621px; padding-left: 30px; padding-top: 40px;}
#questions #moyen-age #q4 {width: 555px; padding-left: 0px; padding-top: 20px;}

#questions #passions {margin-top: 30px;}
#questions #passions #q1 {width: 625px;}
#questions #passions #q2 {width: 510px; padding-left: 55px;}
#questions #passions #q3 {width: 510px; float: right;}
#questions #passions #q4 {width: 460px; padding-left: 25px;}
#questions #passions #q5 {width: 450px;}
#questions #passions #q6 {width: 585px; padding-left: 35px;}

#questions #edition {margin-top: 80px;}
#questions #edition #q1 {width: 605px; padding-left: 35px;}
#questions #edition #q2 {width: 340px; padding-top: 20px; padding-left: 125px;}
#questions #edition #q3 {width: 570px; padding-top: 40px; padding-left: 50px;}
#questions #edition #q4 {padding: 50px 10px 0 10px;}

#questions #techniques {margin-top: 10px;}
#questions #techniques #q1 {width: 585px; padding-left: 35px;}
#questions #techniques #q2 {width: 450px;}
#questions #techniques #q3 {width: 610px; padding-left: 25px;}
#questions #techniques #q4 {width: 510px; float: right; padding-top: 20px;}
#questions #techniques #q5 {width: 510px; padding-left: 55px;}
#questions #techniques #q6 {width: 625px;}