/* CSS Association Rouge Marine */
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.7em;
margin: 8px;
padding: 0;
background-color:#000000;
}

#header_accueil {
height:70px;
background-color: #2F1720;
margin-top: 0;
}

#header {
height:50px;
background-color: #2F1720;
margin-top: 0;
}

#headerPopup {
height:36px;
background-color: #2F1720;
margin-top: 0;
}

#haut_accueil {
height: 8px;
background-image: url(images/bandelette_chrome.gif);
margin-top: 0;
}

#haut {
height: 28px;
background-color:#2F1720;
margin-top: 0;
}

#conteneur {
position: absolute;
width:98%;
background-color:#2F1720;
}

#centre {
margin-left: 110px;
margin-right: 110px;
margin-top: 0;
background-color:#602020;
}

#gauche {
position: absolute;
left:0;
width: 110px;
}
#droite {
position: absolute;
right:0;
width: 110px;
}

#pied {
height: 30px;
background-image: url(images/bande_anneau.gif);
}

.date {   /* Conteneur du bloc de la date */
float: right;
margin-top: 2px;
margin-right: 2px;
font-size: 9px;
font-weight: bold;
color: #E9AD71;
text-align: center;
}

.temperatures{   /* Conteneur du bloc contenant l'imagette de haut à droite  */
float: right;
margin-top: 5px;
margin-right:5px;
border: 0;
}

.drapeau{   /* Conteneur du bloc contenant le drapeau */
float: right;
margin-top: 5px;
margin-right:15px;
border: 0;
}

.image1{   /* Conteneur du bloc contenant la 1ere imagette à gauche */
float: left;
margin-top: 15px;
margin-left: 2px;
}

.image2{   /* Conteneur du bloc contenant les images*/
float: left;
margin-top: 15px;
margin-left: 2px;
}
.image5{   /* Conteneur du bloc contenant le logo Robinson.DOO */
float: left;
margin-top: 8px;
margin-left: 8px;
}
.image7{   /* Conteneur du bloc contenant le logo Robinson.DOO */
float: left;
margin-top: 5px;
margin-left: 8px;
}

.image3{   /* Conteneur du bloc contenant l'imagette de haut à droite  */
float: right;
margin-top: 30px;
margin-right:2px;
}

.image4{   /* Conteneur du bloc contenant les imagettes suivantes*/
float: right;
margin-top: 38px;
margin-right: 2px;
}

.image6{   /* Conteneur du bloc contenant le logo Rouge Marine*/
float: right;
margin-top: 20px;
margin-right: 8px;
}
.image8{   /* Conteneur du bloc contenant le logo Rouge Marine*/
float: right;
margin-top: 10px;
margin-right: 8px;
}

h1 {
font-size: 24px;
text-align: center;
color: #501820; /*Marron */
font-weight: bold;
margin-left:  10px;
margin-top: 3px;
margin-bottom: 3px;
}

h2 {
font-size: 18px;
text-align: center;
color: #F9D33D ;/* jaune vif */
font-weight: bold;
margin-top: 3px;
margin-bottom: 3px;
}

h3 {
font-size: 14px;
text-align: left;
color: #F9D33D ;/* jaune vif */
font-weight: bold;
margin-left:  10px;
margin-top: 3px;
margin-bottom: 3px;
}

h4 {
font-size: 14px;
text-align: left;
color: #501820; /* Marron */
font-weight: bold;
margin-left:  10px;
margin-top: 3px;
margin-bottom: 3px;
}

h5 {
color: #D6DDE4; /* chrome */ 
text-align:center;
text-decoration: none;
font-size: 11px;
margin-top: 3px;
margin-bottom: 3px;
}

h6 {
margin: 1px 1px  1px  0;
text-align: center;
font-size: 9px;
color:#D6DDE4; /* blanc */
font-weight:  bold;
}

p {
margin: 3px 3px  3px  10px;
text-align: justify;
font-weight:  bold;
color: #D6DDE4; /* chrome */
}

a:link{
font-size: 11px;
font-weight: bold; 
color: #F9D33D;
text-decoration: underline;
}/*jaune*/ 

a:hover {
font-size: 11px;
font-weight: bold; 
text-decoration: none;
color: #8ECA79;/*vert */
}

a:visited{
font-weight: bold;
font-size: 11px;
text-decoration: underline;
color: #F28F46;
} /*orange */


.adresse {
font-size: 11px;
margin-top: 3px;
margin-bottom: 3px;
text-align: center;
color: #F9D33D;/*jaune */  
font-weight: bold;
}

.adresse2 {
font-size: 11px;
font-weight: bold;
margin-top: 3px;
margin-bottom: 3px;
text-align: center;
color:  #8A350B;/*rouge marron du centre */ 
}

.texte_accueil {
font-size: 12px;
text-align: left;
color: #501820; /* Marron */
font-weight: bold;
margin-left:  10px;
margin-top: 3px;
margin-bottom: 3px;
}

.texte {
font-size: 12px;
text-align: left;
color: #77AAD6; /* bleu*/
font-weight: bold;
margin-left:  3px;
margin-top: 3px;
margin-bottom: 3px;
}

.tel {
font-size: 11px;
margin-top: 3px;
margin-bottom: 3px;
text-align: center;
color:  #F9D33D;/*jaune */  
font-weight: bold;
}
 
 
#menuHaut {  /*Position du conteneur du menu haut*/ 
position: absolute;
top:50px;
left: 108px;
z-index:100;
width: 100%;
}

dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}

#menuHaut dl { /*Position, largeur et couleur des Blocs des boutons menus du haut */ 
float: left;
width: 97px;
cursor: pointer;
text-align: center;
height: 23px;
background-image:  url(images/bouton.gif);
margin: 2px;
}

#menuHaut dl a {/*Description du texte dans les  blocs des boutons de nav en haut */
text-decoration: none;
font-size: 12px;
color: #8A350B;/*rouge marron du centre */ 
display: block;
height: 100%;
}  

#menuHaut dl a:hover {
color: #8A350B;/*rouge marron du centre */ 
text-decoration: none;
} 
 
#menuHaut dt {
cursor: pointer;
color: #F9D33D; /* jaune vif */
text-decoration: none;
font-size: 12px;
font-weight: bold;
text-align: center;
height: 23px;
}
#menuHaut dd {
text-decoration: none;
font-size: 12px;
display: block;
}
/*C'est a partir d'ici qu'on change les couleurs de fond et du texte et la taille du texte*/ 
#menuHaut li {
text-align: center;
height: 23px;
background-image:  url(images/bouton.gif);
}
#menuHaut li a, #menuHaut dt a {
text-decoration: none;
font-size: 12px;
color: #D6DDE4;/*blanc */ 
display: block;
height: 100%;
}  

#menuHaut li a:hover, #menuHaut dt a:hover {
color: #8A350B;/*rouge marron du centre */ 
font-size: 12px;
text-decoration: none;
background-image:  url(images/bouton2.gif);
}