/* ceci est un fichier css, appelé "vignettes.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;
}
#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 marron*/
        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 */
			}
#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 bleue 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 bleue 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(241,250,165); /* le fond en jaune pale */
}
#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: 0;
background-color: rgb(241,250,165); /* couleur du corps JAUNE PALE */
}
.dessous {
clear: both; 
}
p { /* espace bas entre vignettes et "haut infos"  pour écrire un texte sous les vignettes finales */
padding: 15px;
margin-bottom: 20px;
font-family: verdana, tahoma, serif; 
font-size: 0.9em;
} 
 .vignette02{/* Vignettes verticales */
position: absolute;
padding-left: 961px;
margin-top: -280px; 
}
.vignette01  { /* vignettes horizontales haut */
position: absolute;
padding-left: 70px;
margin-top: -390px; 
}
.vignette03{ /* vignettes horizontales bas */
position: absolute;
padding-left: 12px;
margin-top: 307px; 
}
.imageflottantedroite {
float: right;
padding-right: 75px;
margin-bottom: 15px;
 }
.imageflottantegauche 
{ padding-left: 95px;
float: left;
margin-bottom: 15px;
 }
h4{
color: rgb(80,52,209); font-size: 0.9em; font-family: verdana, tahoma; text-decoration: none; text-align: center;margin-top: -35px;
 }
h2 {
text-align: center;
padding: 85px; /* espace entre le haut de la page et le titre */ 
}
#Bigimg {/* Gère l'emplacement "Cliquez sur les vignettes pour un agrandissement Constantia14 */ 
position: absolute;
padding-left: 100px;
top: 930px; /* espace en haut entre les petites vignettes et la grande image */
 }
.ici2 {color: rgb(80,52,209); text-align: center; margin-top: -55px; /* Plus petite page */ }
.ici2 a {text-decoration: none; color: rgb(80,52,209); text-align: center;
}
.haut, .infos {
float: right;
margin-bottom: -55px;
font-size: 14px;
color: rgb(80,52,209); /* Ton bleu */
}
.haut a, .infos a{text-decoration: none; color: rgb(80,52,209); }
.haut a:hover, .infos a:hover {background-color: rgb(208,200,221); /* surlignage mauve */ 
}
a img
{
border: none; /* Pas de bordure autour des images */
max-width : 100%;
}
#pied_de_page
{
background-image: url("medias/piedepage.jpg"); 
height: 60px;
width: 1190px; }