/*ermettre à IE d'afficher*/
body {
  behavior: url("csshover.htc");
  font-size:12pt;
  font-family: arial, verdana, helvetica, sans-serif, "lucida console";
}

img.gauche {
 border: 1px solid ; 
 width: 50px; 
 height: 50px; 
 float: left; 
 padding-left:0px;

}

h6{
width:auto;
  margin:0px 5px;
  padding:1px;
}

li a h6 {
font-size: 0.85em; 
}

/*mise en forme des liens*/
#menu_dynamique li a {
  display:block;
  height:51px;
  margin:0px 0px;
  text-decoration:none;
  color:#696969;
  background-color:#FFFFFF;
}

/*Position*/
#menu_dynamique {
  width:auto;
  margin:0px 0px;
  padding:0px;
}

/*Menu sous forme de liste*/
#menu_dynamique ul {
  width:265px;
  list-style:none;
  padding:0px;
  margin:0px;
  border-right:1px solid silver;
}

/*La  bordure grise sur la gauche*/
#menu_dynamique ul li {
  width:auto;
  margin-left:0px;
  padding-left:25px;
  text-indent:5px;
  height:52px;
  background:url("bordure.jpg") no-repeat;
}

/*activation / Désactivation de l'affichage des sous-menus*/

/*cacher les zones "indésirables"*/
#menu_dynamique ul li ul {
  display:none;
}

/* la compatibilité avec IE Et position des rectangles gris de survol de droites*/
#menu_dynamique ul li.extend:hover {
  width:240px;
  height:52px;
  overflow:hidden;
  padding-left:25px;
}

/*afficher les zones au survol du lien et de les placer correctement*/
#menu_dynamique ul li:hover ul {
  display:block;
  position:relative;
  padding-left:5px;
  padding-right:0px;
  top:-51px;
  left:190px;
}

/*ajoute aux zones à cacher les sous-sous-menus et leurs descendants*/
#menu_dynamique ul li ul, #menu_dynamique ul li:hover ul li ul, #menu_dynamique ul li:hover ul li:hover ul li ul{
  display:none;
}

/*les zones à afficher*/
#menu_dynamique ul li:hover ul, #menu_dynamique ul li:hover ul li:hover ul, #menu_dynamique ul li:hover ul li:hover ul li:hover ul{
  display:block;
  position:relative;
  top:-53px;
  left:235px;
}

/*triangle noir en bout de ligne*/
#menu_dynamique ul li.extend a {
  background: url("suite.png") right no-repeat;
}

/*spécifier que chaque <li> de classe end des sous-menus ne possède pas d'image de fond (laflèche à droite)*/
#menu_dynamique ul li.extend:hover ul li.end a {
  background-image:none;
}

/*spécifier que chaque <li> de classe end des sous-menus ne possède pas d'image de fond (laflèche à droite)*/
#menu_dynamique ul li.end:hover ul li.end a {
  background-image:none;
}

/*ajouter une petite flèche dans la bordure gauche du menu*/
#menu_dynamique li:hover {
  background:url("fleche_survol2.png") no-repeat;
}

/*Changer la couleur du texte et du fond du lien*/
#menu_dynamique li a:hover {
  color:#3300FF;
  background-color:#cccccc;
}

/*couleur de fond des lignes de classe extend*/
#menu_dynamique ul li.extend:hover a, #menu_dynamique ul li.extend:hover ul li:hover a, #menu_dynamique ul li.extend:hover ul li.extend:hover ul li:hover a, #menu_dynamique ul li.extend:hover ul li.extend:hover ul li.extend:hover ul li:hover a{
  background-color:#cccccc;
}

/*les sous-menus et leurs descendants ne se trouvent pas affublés de cette couleur de fond sans avoir été survolés*/
#menu_dynamique ul li.extend:hover ul li a, #menu_dynamique ul li.extend:hover ul li:hover ul li a, #menu_dynamique ul li.extend:hover ul li.extend:hover ul li:hover ul li a{
  background-color:#FFFFFF;
}

/*la première ligne de chaque liste possèdera une bordure haute et la dernière ligne de chaque ligne possèdera une bordure basse*/
#menu_dynamique li.first{
  border-top:1px solid silver;
}

#menu_dynamique li.last{
  border-bottom:1px solid silver;
}

html > body #menu_dynamique ul li.extend:hover {
  overflow:visible;
}