BODY
{
     width: 985px;
     margin: auto;
     margin-top: 20px;
     margin-bottom: 20px;
     font: 14px serif;
     color: white;
     background:#4B6E98;
}

div
{
	/*border: lime solid;*/
}

#conteneur
{
     width: 985px;
     margin-left: auto;
     margin-right: auto;
}

#top
{
     height:170px;
     border-top: #85A5B2 ridge;
     border-left: #85A5B2 ridge;
     border-right: #85A5B2 ridge;
     background: url(images/header.jpg) no-repeat;
}

.logo
{
     margin-top:5px;
     margin-left:5px;
}

.droite
{
     margin-top:20px;
     margin-right:20px;
     float:right;
}

#attention
{
     width: 175px;
     float:right;
     margin-right:20px;
}
#rappels
{
     float:right;
     margin-right:20px;
}

#menud
{
     float:right;
     width: 200px;
}
#menug
{
     float:left;
     width: 200px;
}

.info
{
     background: url(images/corps1.jpg) no-repeat 0 0 navy;
     border:#85A5B2 ridge;
     margin-top:5px;
}

#corps
{
     width: 768px;
     margin-top: 5px;
     background: url(images/corps1.jpg) no-repeat 0 0 navy;
     border: #85A5B2 ridge;
     float:right;
 }
 
#piedpage
{
     width: 985px;
     clear:both;
     float:left;
     margin-left: 20px;
     margin-top: 20px;
}

.logo
{
     width: 200px;
     float:left;
     text-align: center;
}
.corps p
{
     margin-left: 3em;
     margin-right: 3em;
}
.corps li
{
     margin-left: 6em;
     margin-right: 3em;
}
.corps a
{
     color: #eeeeee;
}

.info a /*liens qui se trouvent dans le menu*/
{
     color: #ffffff;
}
.info p /*paragraphe qui se trouvent dans le menu info*/
{
     margin-left: 20px;
}
.mentions p /*mentions légales*/
{
     margin-left: 3em;
     margin-right: 3em;
}
.mentions li
{
     margin-left: 6em;
}
p
{
     margin-top: 1em;
     margin-left: 5em;
     color: #ffffff;
     text-align: justify;
}
p.note
{
     font: 11px serif;
     color: #ffffff;
}
h1
{
     font-weight: bold;
     color: #ffff00;
     text-align: center;
}
h2
{
     text-align: center;
     color: #ffd700;
     text-decoration: underline;
}
h3
{
     margin-left: 6em;
}
h4
{
     text-align: center;
     text-decoration: underline;
}
table
{
     margin:auto;
}

#menug a {
     display: block ;
     text-decoration: none ;
}
#menug a:hover, #menug a:focus, #menug a:active {
     color: #900 ;
     text-decoration: underline ;
}
#menud a {
     display: block ;
     text-decoration: none ;
}
#menud a:hover, #menud a:focus, #menud a:active {
     color: #900 ;
     text-decoration: underline ;
}
.droite {
     text-align : right;
}
.milieu {
     text-align : center;
}
.souligne {
     text-decoration : underline;
}
.img_aideopto {
     width : 410px;
     height : 159px;
     border : 0px solid #b0c2e6;
}
img {
     border : 0px;
}
.rouge {
     color : #ff0000;
     font: 14px serif;
}
rouge {
     color : #ff0000;
     font: 17px serif;
}

#menuhoriz {
     height: 33px;
     border-bottom: #85A5B2 ridge;
     border-left: #85A5B2 ridge;
     border-right: #85A5B2 ridge;
     background:navy;
     background: url(images/bg_menu.gif) repeat 0 -30px ; /* On met une image de background, que l'on positionne à 0px du bord gauche et 0px du bord haut */
}
ul#menu_horizontal {
     width : 980px;
     height : 25px;
     display:inline;
     list-style-type : none; /* Car sinon les puces se placent n'importe où */
}
ul#menu_horizontal li {
     display: block ; /* On passe les liens en éléments de type block pour leur donner des propriétés de taille */
     color: #dadad6 ;
     line-height: 30px ;

     text-decoration: none ;
     background: url(images/bg_menu.gif) 0 -30px ; /* On met une image de background, que l'on positionne à 0px du bord gauche et 0px du bord haut */
     border: 0px solid #dbd ;
}
li.bouton_gauche {
     float : left;
}
li.bouton_droite {
     float : right;
}
ul#menu_horizontal li a
{
     display: block ; /* On passe les liens en éléments de type block pour leur donner des propriétés de taille */
     line-height: 30px ;
     color: #dadad6 ;
     text-indent: 5px ; /* On décale le texte de 25px du bord gauche */
     text-decoration: none ;
     background: url(images/bg_menu.gif) no-repeat 0 -30px ; /* On met une image de background, que l'on positionne à 0px du bord gauche et 0px du bord haut */
     border: 0px solid #dbd ;
}

ul#menu_horizontal li a:hover
{
     color: white ;
     background: url(images/bg_menu.gif) no-repeat 0 0 ; /* Et ici on décale l'image du background de 30px vers le haut pour laisser apparaître la 2eme partie de l'image */
     border: 0px solid #f97 ;
}
.info li
{
      margin-left: -1em;
}