/* Ceci est un fichier CSS, appelé "liens.css" */

body  {
width: 1195px;
margin: auto;
margin-top: 10px; /* espace entre navigateur et en-tête */
margin-bottom: 10px; /* espace entre bas navigateur et pied de page */
background-image: url("medias/hivernal.jpg"); 
}
#en_tete {
width: 1190px;
height: 250px;
background-image: url("medias/banniere.jpg"); 
 }
.image_gauche { /* Titi */
float: left; 
margin-left: 85px;
margin-top: 0px;}
.image_droite { /* Minette */
float: right; 
margin-right: 75px;
margin-top:  0px; }
.image_haut{ /* Lapin */
float: left;
margin-left: 150px;
margin-top: -5px;
}
 a.image2{ /* INFOBULLE */
position: relative;
font-size: 13px;
font-family: Tahoma, Verdana, Serif;
text-align: center;
} 
a.image1{ /* INFOBULLE */
position: relative;
font-size: 13px;
font-family: Tahoma, Verdana, Serif;
text-align: center;
} 
      a.image1 span{ display: none; /* Masquer l'infobulle */ 
   }
      a.image1 span, a.image2 span, a.image3 span{
   background: none; /* Correction d'un bug IE */
   z-index: 500; /* Valeur définie pour ordre d'affichage */
   }
a.image2:hover span { 
	display: block; /* on affiche l'infobulle */
   position: absolute;
   white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
   background: white;
   color: rgb(80,52,209);
   padding: 10px;
   border: 2px solid green;
                }
	a.image1:hover span { 
	display: block; /* on affiche l'infobulle */
   position: absolute;
   white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
   background: white;
   color: rgb(80,52,209);
   padding: 10px;
   border: 2px solid green;
                }			 
a.image1:hover span {margin-left: 615px; margin-top: -297px; /*Gites */
}
	
#menu, #menu ul /* Liste */ 
  {       margin: auto; 
		padding: 0em;
        list-style: none; /* on supprime le style par défaut de la liste */
        line-height:  40px; /* Hauteur du menu et de ses éléments */
        text-align: center; /* on centre le texte qui se trouve dans la liste */
			}
#menu /* Ensemble du menu */
{       font-family: Cambria, Verdana, Arial; 
        font-size: 17px;
										}
#menu a /* Contenu des listes */
{
        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding: 0; /* aucune marge intérieure */
        background-image: url("medias/barremenu.jpg"); /* couleur de fond */        
        color: rgb(114,7,17); /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens */
        width: 170px; /* largeur */
						}
#menu li /* Elements des listes */      
{ 
        float : left; 
		 /* pour IE qui ne reconnaît pas "transparent" */
        border-right: 0; /* on met une bordure verte à droite de chaque élément */
		}
/* IE ne reconnaissant pas le sélecteur ">" */
html>body #menu li
{		
        border-right: 0;
		}
#menu li ul /* Sous-listes */
{ 		position: absolute;
        width: 170px; /* Largeur des sous-listes */
		line-height: 26px; /* Hauteur des sous listes, sous-sous listes */
        left: -999em; /* loin du champ de vision */
		z-index: 1;
			}
#menu li ul li /* Éléments de sous-listes */
{
        /* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
        border-top: 1px solid rgb(193,213,250); /* on met une bordure verte en haut de chaque élément d'une sous liste */
			}
/* IE ne reconnaissant pas le sélecteur ">" */
html>body #menu li ul li                
{
        border-top: 1px solid rgb(193,213,250); /* on met une bordure verte en haut de chaque élément */
		}
#menu li ul ul 
{
        margin    : -26px 0 0 170px; /* On décale les sous-sous-listes pour qu'elles ne soient pas au dessus des sous-listes */ 
        /* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
        border-left     : 1px solid transparent; /* Petite bordure à gauche pour ne pas coller ... */ 
}
/* IE ne reconnaissant pas le sélecteur ">" ... je me répète ;-) */
html>body #menu li ul ul                
{
        border-left     :1px solid transparent; /* on met une bordure transparente sur la gauche de chaque élément */
}
#menu a:hover /* Lorsque la souris passe sur un des liens */    
{
        background: rgb(208,231,79); /* le fond vert pomme */
}
#menu li:hover ul ul, #menu li.sfhover ul ul /* Sous-sous-listes lorsque la souris passe sur un élément de liste */
{
        left: -999em; /* On expédie les sous-sous-listes hors du champ de vision */
	}
#menu li:hover ul, #menu li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul  /* Sous-listes lorsque la souris passe sur un élément de liste ET sous-sous-lites lorsque la souris passe sur un élément de sous-liste */
{
        left: auto; /* Repositionnement normal */
        min-height: 0; /* Corrige un bug sous IE */
}
#corps 
{ width: 1150px;
padding: 20px;
margin-bottom: 0px;
background-color: rgb(208,231,79); /* Couleur du corps, ton vert pomme */
}
 p {
padding: 10px; /* Espacement entre les bannières vertical*/
font-family: verdana, tahoma, serif; 
font-size: 0.9em;
 }
.haut {
float: right;
color: rgb(80,52,209); /* Ton bleu */
padding: 20px;
}
.haut a {text-decoration: none; color: rgb(80,52,209); }
.haut a:hover {background-color: rgb(208,200,221); /* surlignage mauve */ 
}
.icons {
  margin-left: 960px;
}
.dessous {clear: both; 
}
.imagedroite{margin-left: 35px; /* espace entre les 2 bannières horizontal */
}
.imagegauche{margin-right:35px;
}
a img { border: none; /* Pas de bordure autour des images */ 
max-width : 100%;}

h2 { /* Titre principal en haut des pages */ 
padding: 80px;
font-family: georgia, verdana, tahoma, serif;
text-align: center;}

#pied_de_page {
background-image: url("medias/piedepage.jpg"); 
height: 60px;
width: 1190px; }