/* CSS Document */


/* la page et le body */
/* ----------------------------------- */

img { 
  border : 0 ;   /* pour l'esthétique */
    }

#page { 
  width : 80% ;   /* largeur de la page mini pour tenir les deux blocs */
  margin: 8px auto; /* marges autour de la page */
  background-color : #FF6600 ;    /* orange*/ 
  margin-right : auto ;   /* centrage  */
  margin-left : auto ;   /* du div global */
  _text-align : left ;    /* on rétablit l'alignement par défaut (cf. body) */
  border: 2px solid #ff6600;  /* bordure autour si on en veut */
      }
	  
body {
  background-color: #666666; /* gris */
  margin : 0px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 11px;
  _text-align : center ;  /* centrage du div global */
     }


h3 {	
	font-family: Arial, Helvetica, sans-serif;	
	font-size: 1.15em;	
	background-color: #006666;  	
	color: #DCDCDC
	}	
	
.detailText {
	font:11px arial;
	color:#ffffff;
	line-height:16px;
	letter-spacing:.1em;
	}	

.bodytexte {
	color:#000000; /* couleur font des textes */
	line-height:12px;
	letter-spacing:.2em;
	margin-top:0px;
	font-family: arial;
	font-size: 10px;
	}
	
.Style1 {font-size: 11}	

.Style3 {
	font-size: 14px;
	font-family: "Lucida Bright";
	font-weight: bold;
}
	 
#entete {         /* bandeau du haut contenant l'image et logo */ 
  position: relative;
  height : 130px ;    /* hauteur de entete */
        }
	   
.barregrise  {  /* barre grise de separation */
   margin-left: 50px;
   width:500px;
   height:2px;
       }
	   	   
.imgagauche {
  display : block ;
  float : left ; 
             }

.imgagauche {  /* positionnement et taille */
  margin-right: 10px;
  margin-left: 10px;
  margin-bottom: 5px;
  height:130px;
  width:85px;
            }
			
.gdimgagauche {  /* positionnement et taille */
  margin-right: 10px;
  margin-left: 10px;
  margin-bottom: 5px;
  height:260px;
  width:320px;
            }			
			
			
.imgadroitevert  {
   display: block;
   float:inherit;
   margin-right: 5px;
   margin-bottom: 5px;
   height:130px;
   width:85px;
            }

.imgadroitehor  {
   display: block;
   float:inherit;
   margin-right: 5px;
   margin-bottom: 5px;
   height:100px;
   width:130px;
            }
			
.imgauteur    {
   margin-top: 3px;
   margin-bottom: 3px;
   height:130px;
   width:85px;
            }	
			
							
li {
  list-style-position : inside ;
  margin : 0 ;
  padding : 0 ;
    }
			
.texte {
  position:relative;
  padding: 10px 25px 10px 23px; 
       }

.texte p {
  margin-top:5px;
  margin-bottom:5px;
         }

.texte p {
  margin-top:5px;
  margin-bottom:5px;
         }

.texte ul {
  margin-left: 10px;
  margin-top: 2px;
  margin-bottom: 2px;
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 5px;
  list-style-position: outside;
}			   
		
/*  -----------------------------------------------  */

A:link {
	COLOR: #0000CC; TEXT-DECORATION: none	    }
A:active {
	COLOR: #ff6600; TEXT-DECORATION: none
         }
A:visited {
	COLOR: #0000cc; TEXT-DECORATION: none
         }
A:hover {
	COLOR: #ffffff; BACKGROUND-COLOR: #9e0a00
         }
.lien  {
    position:relative;
    padding: 3px 3px 0px 3px; /* taille du cadre coloré quand survol du lien */
	color:#0000CC;
	border-bottom-style:dotted;
       }

/*  -----------------------------------------------  */

/* navigation */
/* le menu horizontal sous l'entete */

div#navigation
  {
  font-family: arial;
  font-weight: bold;
  background: #ff6600; /* couleur fond barre du menu */
  right: 0px;
  margin: 0;
  padding: 10px;
  /* border: 2px solid #222; */
  }

div#navigation ul
  {
  display: inline;
  margin: 0;
  padding: 0;
  list-style: none;
  border: solid 1px #642;
  }

div#navigation h2
  {
  border: solid 1px #642;
  padding: 4px;
  text-align: center;
  }

div#navigation ul li
  {
  display: inline;
  margin: 0;
  }

div#navigation ul li a
  {
  color: #000000;  /* couleur font menu */
  background: #ffc;
  margin: 0;
  padding: 2px 5px 2px 5px;
  text-decoration: none;
  }

div#navigation ul li a:hover
  {
  background: #e8db6f;
  border-bottom: solid 9px #ffc;
  }

/* le pied de page */ 

#piedpage {
  height: 20px;
  padding : 5px 0 0 0 ; 
  margin : 0 ; 
  background-color: #666666; /* meme couleur que le fond général */
  font-size: xx-small;
  text-align : center ; 
}


/* autre methode pour faire des angles arrondis */
/* ne marche qu avec firefox */
.arrondi   {
-moz-border-radius:20px;
    }
	
	
/* infobulle dynamique */

.link_bulle {
cursor: default;
color: blue;
border-bottom: 1px dotted gray;
}

.infos_bulle {
z-index: 550;
position: absolute;
top: -999px;
visibility: hidden;
font: normal 10px Verdana, Arial;
color: red;
padding: 8px;
border: 1px solid #ccc;
background-color: #D3FB64;
opacity: 0.9;
-moz-opacity: 0.9;
filter: alpha(opacity=90); 
}

/* Infos bulles */

A.tooltip EM {
DISPLAY: none
}
A.tooltip:hover {
BORDER-RIGHT: 0px; BORDER-TOP: 0px; Z-INDEX: 500; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px; POSITION: relative; TEXT-DECORATION: none
}
A.tooltip:hover EM {
BORDER-RIGHT: #bbb 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #bbb 1px solid; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: #ff5000; LEFT: -260px; PADDING-BOTTOM: 5px; BORDER-LEFT: #bbb 1px solid; WIDTH: 280px; COLOR: #000; PADDING-TOP: 5px; BORDER-BOTTOM: #bbb 1px solid; FONT-STYLE: normal; POSITION: absolute; TOP: -25px
}
A.tooltip:hover EM SPAN {
BORDER-RIGHT: 0px; PADDING-RIGHT: 0px; BORDER-TOP: 0px; PADDING-LEFT: 0px; BACKGROUND: url(image-infobulle.gif); LEFT: -15px; PADDING-BOTTOM: 0px; MARGIN: 0px; BORDER-LEFT: 0px; WIDTH: 11px; PADDING-TOP: 0px; BORDER-BOTTOM: 0px; POSITION: absolute; TOP: -7px; HEIGHT: 7px
}


/* Popup des images quand passage du curseur souris */

A.pop EM {
DISPLAY: none
}
A.pop:hover {
BORDER-RIGHT: 0px; BORDER-TOP: 0px; Z-INDEX: 600; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px; POSITION: relative; TEXT-DECORATION: none
}
A.pop:hover EM {
BORDER-RIGHT: medium none; PADDING-RIGHT: 5px; BORDER-TOP: medium none; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: #b0c4de; LEFT: -10px; PADDING-BOTTOM: 5px; MARGIN-LEFT: 25%; BORDER-LEFT: medium none; WIDTH: 230px; COLOR: #000; PADDING-TOP: 5px; BORDER-BOTTOM: medium none; FONT-STYLE: normal; POSITION: absolute; TOP: -80px
}
A.pop:hover EM SPAN {
BORDER-RIGHT: 0px; PADDING-RIGHT: 0px; BORDER-TOP: 0px; PADDING-LEFT: 0px; LEFT: 10px; PADDING-BOTTOM: 0px; MARGIN: 0px; BORDER-LEFT: 0px; WIDTH: 11px; PADDING-TOP: 0px; BORDER-BOTTOM: 0px; POSITION: absolute; TOP: -7px; HEIGHT: 7px