/*Nouveau CSS cree en Octobre 2013 avec menus dynamiques
/*NOTES : (ici notes d'utilisation)
//modif le 27/06/2016 rajout de z-index: 10; sur toutes les valeurs des menus



/* Styles Communs */
/*texte par defaut sur le fond du docuement*/
body {background-color: #84A7BA; margin-left: 0; margin-right: 0; margin-top: 0; font: 15px Verdana, Arial, Helvetica, sans-serif; color: #444444; text-align: center;}

div {width: 100%; height: 100%; text-align:left ;}
td {font: 15px Arial, Helvetica, sans-serif; text-align: justify;}
a {text-decoration: none; color: #3366CC; font: 13px Verdana, Arial, Helvetica, sans-serif; font-weight: bold;}
a:hover {text-decoration: underline;}
a.images {text-decoration: none;}
a.images:hover {text-decoration: none;}
.conteneur {width: 900px; background-color: #FFFFFF;}
p{margin: 5px; text-align: justify;}
ul {list-style: square;}
img {border-width: 0px;}
span {text-align: justify;}
h1 {font-family: Arial, Helvetica, sans-serif; font-size: 15px; font-weight: bold; text-align: left; text-indent: 5px; color: rgb(42, 42, 42);}

h2 {font-family: Arial, Helvetica, sans-serif; font-size: 15px; font-weight: bold; text-align: left; text-indent: 5px; color: rgb(42, 42, 42);}


/*styles de texte*/
.texte_12_noir_gras_left{ text-align: left; color: #000000; font: 12px Arial, Helvetica, sans-serif; font-weight:bold; }
.Gros_titre_Rouge{ text-align:center; color:Red; font: 33px Arial, Helvetica, sans-serif; font-weight:bold; }
.Lien_gris{text-decoration: none; color: #444444; font: 11px Arial, Helvetica, sans-serif; font-weight: bold;}
/*Cree pour le tag cloud*/
.Lien_gris_fin{text-decoration: none; color: #444444; font: 16px Arial, Helvetica, sans-serif; font-weight: normal;}
.Prix {font-size: 16px; font-weight: bold; color: #009900;}

.Entete_Tableau { font-family: Arial,Helvetica,sans-serif; font-size: 12px; color: #ffff00; background-color: #4678B6; font-weight:bold; letter-spacing: 1px; text-indent: 5px;}
.Titre_paragraphe {text-align: left; font-weight: bold; font-family: Arial,Helvetica,sans-serif; color: rgb(0, 0, 153); font-size: 12px; letter-spacing: 1px;}
.SousTitre_paragraphe {text-align: left; font-weight: bold; font-family: Arial,Helvetica,sans-serif; color: rgb(51, 51, 255); font-size: 12px; letter-spacing: 1px;}
.Note_rouge {text-align: left; font-weight: bold; font-family: Arial,Helvetica,sans-serif; color: rgb(204, 0, 0); font-size: 15px;}

/*Utilise par les menus*/
/* Main menu */
.Header_MainMenu_Onglet {float:left; background: #FFFFFF url('http://www.aragonsoft.com/interface/onglet_fond.gif') repeat-x left top;}
.Header_MainMenu_Onglet ul {margin:0 0 0 0;	padding: 0 10px 10px 0; list-style:none;}
.Header_MainMenu_Onglet li {float: left; margin: 0; padding: 0 0 0 3px; width: auto;}
.Header_MainMenu_Onglet a {float:none; display:block; padding: 5px 0px 4px 0px; font: 10px Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color:#FFFFFF; text-align: center;}
/*.Header_MainMenu_Onglet a:hover {text-decoration: none;}*/
.Header_MainMenu_Onglet_Gauche {background: url('http://www.aragonsoft.com/interface/onglet_left.gif') no-repeat left bottom; width: 10px;}
.Header_MainMenu_Onglet_Gauche_on {background: url('http://www.aragonsoft.com/interface/onglet_left_on.gif') no-repeat left bottom; width: 10px;}
.Header_MainMenu_Onglet_Milieu {background:url('http://www.aragonsoft.com/interface/onglet_middle.gif') repeat-x left bottom;}
.Header_MainMenu_Onglet_Milieu_on {background: url('http://www.aragonsoft.com/interface/onglet_middle_on.gif') repeat-x left bottom;}
.Header_MainMenu_Onglet_Droite {background: url('http://www.aragonsoft.com/interface/onglet_right.gif') repeat-x left bottom; width: 10px;}
.Header_MainMenu_Onglet_Droite_on {background: url('http://www.aragonsoft.com/interface/onglet_right_on.gif') repeat-x left bottom; width: 10px;}

.Header_MainMenu_LienSousMenu {font: 10px Verdana, Arial, Helvetica, sans-serif; color: #FFFFFF; font-weight: normal;}
.Header_MainMenu_LienSousMenu:hover{}
.Header_MainMenu_LienSousMenu_on {font: 10px Verdana, Arial, Helvetica, sans-serif; color: #FFFFFF; font-weight: bold;}
.Header_MainMenu_LienSousMenu_on:hover{}
#Header_MainMenu_SubMenu {text-align: left; float: left; background-color:#001B6D; height: 15px;}/* padding: 5px 0 5px 0;}*/
/*NOTE la couleur de fond du sous menu peut etre remplacee par une image */
/*/////////////////////////////////////*/

/*Elements du header */
.Header_HeaderContainer {background-color: #DCDCDC;}

/*styles pieds de page
/* Footer */
.Footer {color: #FFFFFF; background-color: #001B6D; text-align: center; padding: 2px 0 2px 0;}
.Footer_Lien{color: #FFFFFF; font-weight: normal;}



/*menu deroulant version simple les sous menus font la meme largeur que les menus*/
#menu, #menu ul /* Liste */    
{
        padding : 0; /* pas de marge intérieure */
        margin : 0; /* ni extérieure */
        /*margin:50px 50px 50px 50px;	padding: 50px 50px 50px 50px;*/
        list-style : none; /* on supprime le style par défaut de la liste */
        line-height : 21px; /* on définit une hauteur pour chaque élément */
        text-align : center; /* on centre le texte qui se trouve dans la liste */
        z-index: 10;
}
 
#menu /* Ensemble du menu */
{
        font-weight : bold; /* on met le texte en gras */
        font-family : Arial; /* on utilise Arial, c'est plus beau ^^ */
        font-size : 12px; /* hauteur du texte : 12 pixels */
        z-index: 10;
}
 
#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 */
        
        /*margin:50px 50px 50px 50px;	*/
        padding: 5px 2px 5px 2px;
        background : #00b2eb; /* couleur de fond */       
        color : #ffffff; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 107px; /* largeur*/
        z-index: 10;
}
 
#menu li /* Elements des listes */     
{ 
        float : left; 
        /* pour IE qui ne reconnaît pas "transparent" */
        border-right : 1px solid #fff; /* on met une bordure blanche à droite de chaque élément */
        z-index: 10;
}
 
/* IE ne reconnaissant pas le sélecteur ">" */
html>body #menu li
{
        border-right: 1px solid transparent ; /* on met une bordure transparente à droite de chaque élément */
        z-index: 10;
}
 
#menu li ul /* Sous-listes */
{ 
        position: absolute; /* Position absolue */
        width: 107px; /* Largeur des sous-listes */
        left: -999em; /* Hop, on envoie loin du champ de vision */
        z-index: 10;
}
 
 
#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 #fff; /* on met une bordure blanche en haut de chaque élément d'une sous liste */
        z-index: 10;
}
 
/* IE ne reconnaissant pas le sélecteur ">" */
html>body #menu li ul li                
{
        border-top : 1px solid transparent; /* on met une bordure transparente en haut de chaque élément */
        z-index: 10;
}
 
#menu li ul ul 
{
        margin    : -22px 0 0 107px ; /* 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 #fff ; /* Petite bordure à gauche pour ne pas coller ... */  
        z-index: 10;   
}
 
/* 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 */
        z-index: 10;
}

#menu a:hover /* Lorsque la souris passe sur un des liens */   
{
        color: #ffffff; /* On passe le texte en ... */
        background: #003deb; /* ... et au contraire, le fond en  */
        z-index: 10;
}

#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 */
        z-index: 10;
}
 
#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 */
        z-index: 10;
}


/*menu2 deroulant utilise avec sous_menu2 permet d'avoir des sous-menus plus longs que le menu*/
/*si besoin on peut creer menu3 et sous-menu3 pour faire un encore plus long*/
/*par contre il ne faut pas melanger les menu dans une page car le decalage des sous menu est dans menu et il faut donc le sous-menu corresponant*/
#menu2, #menu2 ul /* Liste */    
{
        padding : 0; /* pas de marge intérieure */
        margin : 0; /* ni extérieure */
        /*margin:50px 50px 50px 50px;	padding: 50px 50px 50px 50px;*/
        list-style : none; /* on supprime le style par défaut de la liste */
        line-height : 21px; /* on définit une hauteur pour chaque élément */
        text-align : center; /* on centre le texte qui se trouve dans la liste */
        z-index: 10;
}
 
#menu2 /* Ensemble du menu2 */
{
        font-weight : bold; /* on met le texte en gras */
        font-family : Arial; /* on utilise Arial, c'est plus beau ^^ */
        font-size : 12px; /* hauteur du texte : 12 pixels */
        z-index: 10;
}
 
#menu2 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 */
        
        /*margin:50px 50px 50px 50px;	*/
        padding: 5px 2px 5px 2px;
        background : #00b2eb; /* couleur de fond */       
        color : #ffffff; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 107px; /* largeur*/
        z-index: 10;
}
 
#menu2 li /* Elements des listes */     
{ 
        float : left; 
        /* pour IE qui ne reconnaît pas "transparent" */
        border-right : 1px solid #ffffff; /* on met une bordure blanche à droite de chaque élément */
        z-index: 10;
}
 
/* IE ne reconnaissant pas le sélecteur ">" */
html>body #menu2 li
{
        /*border-right: 1px solid transparent ;*/ /* on met une bordure transparente à droite de chaque élément */
        z-index: 10;
}
 
#menu2 li ul /* Sous-listes */
{ 
        position: absolute; /* Position absolue */
        width: 107px; /* Largeur des sous-listes */
        left: -999em; /* Hop, on envoie loin du champ de vision */
        z-index: 10;
}
 
 
#menu2 li ul li /* Éléments de sous-listes */
{
        /* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
        border-top : 1px solid #ffffff; /* on met une bordure blanche en haut de chaque élément d'une sous liste */
        z-index: 10;
}
 
/* IE ne reconnaissant pas le sélecteur ">" */
html>body #menu2 li ul li                
{
        /*border-top : 1px solid transparent;*/ /* on met une bordure transparente en haut de chaque élément */
        z-index: 10;
}
 
#menu2 li ul ul 
{
        margin    : -22px 0 0 190px ; /* 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 #ffffff ; /* Petite bordure à gauche pour ne pas coller ... */   
        z-index: 10;  
}
 
/* IE ne reconnaissant pas le sélecteur ">" ... je me répète ;-) */
html>body #menu2 li ul ul                
{
        /*border-left     : 1px solid #ffffff ;*/ /* on met une bordure transparente sur la gauche de chaque élément */
        z-index: 10;
}

#menu2 a:hover /* Lorsque la souris passe sur un des liens */   
{
        color: #ffff00; /* On passe le texte en ... */
        background: #003deb; /* ... et au contraire, le fond en  */
        z-index: 10;
}

#menu2 li:hover ul ul, #menu2 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 */
        z-index: 10;
}
 
#menu2 li:hover ul, #menu2 li li:hover ul, #menu2 li.sfhover ul, #menu2 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 */
        z-index: 10;
}






/*sous-menu2 deroulant*/
#sous-menu2, #sous-menu2 ul /* Liste */    
{
        padding : 0; /* pas de marge intérieure */
        margin : 0; /* ni extérieure */
        /*margin:50px 50px 50px 50px;	padding: 50px 50px 50px 50px;*/
        list-style : none; /* on supprime le style par défaut de la liste */
        line-height : 21px; /* on définit une hauteur pour chaque élément */
        text-align : center; /* on centre le texte qui se trouve dans la liste */
        z-index: 10;
}
 
#sous-menu2 /* Ensemble du sous-menu2 */
{
        font-weight : bold; /* on met le texte en gras */
        font-family : Arial; /* on utilise Arial, c'est plus beau ^^ */
        font-size : 12px; /* hauteur du texte : 12 pixels */
        z-index: 10;
}
 
#sous-menu2 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 */
        
        /*margin:50px 50px 50px 50px;	*/
        padding: 5px 2px 5px 2px;
        background : #00b2eb; /* couleur de fond */       
        color : #ffffff; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 200px; /* largeur*/
        z-index: 10;
}
 
#sous-menu2 li /* Elements des listes */     
{ 
        float : left; 
        /* pour IE qui ne reconnaît pas "transparent" */
        border-right : 1px solid #ffffff; /* on met une bordure blanche à droite de chaque élément */
        z-index: 10;
}
 
/* IE ne reconnaissant pas le sélecteur ">" */
html>body #sous-menu2 li
{
        border-right: 1px solid #ffffff ; /* on met une bordure transparente à droite de chaque élément */
}
 
#sous-menu2 li ul /* Sous-listes */
{ 
        position: absolute; /* Position absolue */
        width: 200px; /* Largeur des sous-listes */
        left: -999em; /* Hop, on envoie loin du champ de vision */
        z-index: 10;
}
 
 
#sous-menu2 li ul li /* Éléments de sous-listes */
{
        /* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
        border-top : 1px solid #ffffff; /* on met une bordure blanche en haut de chaque élément d'une sous liste */
        z-index: 10;
}
 
/* IE ne reconnaissant pas le sélecteur ">" */
html>body #sous-menu2 li ul li                
{
        border-top : 1px solid #ffffff; /* on met une bordure transparente en haut de chaque élément */
        z-index: 10;
}
 
#sous-menu2 li ul ul 
{
        margin    : -22px 0 0 200px ; /* 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 #fff ; /* Petite bordure à gauche pour ne pas coller ... */ 
        z-index: 10;    
}
 
/* IE ne reconnaissant pas le sélecteur ">" ... je me répète ;-) */
html>body #sous-menu2 li ul ul                
{
        border-left     : 1px solid #ffffff ; /* on met une bordure transparente sur la gauche de chaque élément */
        z-index: 10;
}

#sous-menu2 a:hover /* Lorsque la souris passe sur un des liens */   
{
        color: #ffff00; /* On passe le texte en ... */
        background: #003deb; /* ... et au contraire, le fond en  */
        z-index: 10;
}

#sous-menu2 li:hover ul ul, #sous-menu2 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 */
        z-index: 10;
}
 
#sous-menu2 li:hover ul, #sous-menu2 li li:hover ul, #sous-menu2 li.sfhover ul, #sous-menu2 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 */
        z-index: 10;
}