@charset "utf-8";
/* CSS Document */
/* Feuille de style qui définit un style identique au style général mais avec un fond noir et des caractères blanc pour plus d'accéssibilité */


body  { /* attributs de style du corps de la page */
	margin: 0;
	padding: 0;
	text-align: left; /*centre le conteneur dans les navigateurs IE 5.x. Le texte est ensuite aligné à gauche (valeur par défaut) dans le sélecteur #container */
	color: #FFF; /* couleur de la police par défaut */
}

.thrColLiqHdr #container { /* attributs de style du container global de la page */
	width: 1024px;  /* charte graphique */
	background: #000; /* couleur du fond */
	/*margin: 0 auto; /* les marges automatiques (et dotées d'une largeur positive) centrent la page */
	border: 1px solid  #FFF; /* bordure */
	text-align: left;  /* texte aligné à gauche par défaut dans le containers */
	} 

.thrColLiqHdr #sidebar1 { /* Attributs de style du menu latéral gauche */
	float: left; /* Cet élément doit précéder dans le code source tout élément à côté duquel il doit être positionné */
	width: 228px; /* largeur du menu lateral gauche (charte graphique) */
	background: #000; /* Couleur arriere plan du menu lateral gauche RVB 242/246/239 correspond a #F2F6EF Hexadecimal (charte graphique) */
	/*height:780px;*/
	padding-top:20px; /* espace entre le contenu et le bor superieur du container */
	height:auto;  /* hauteur du container variable en fonction du contenu */
	border-bottom:1px solid #FFF ;
	border-right:1px solid #FFF;

}

.thrColLiqHdr #sidebar2 { /* Attributs de style du menu latéral droit */
	float: right; /* Cet élément doit précéder dans le code source tout élément à côté duquel il doit être positionné */
	width: 195px;  /* largeur = place restante après application de la largeur du menu gauche (charte graphique) et du logo bandeau */
	background:#000; /* couleur du fond blanche (charte graphique) */
	padding: 15px 0; /* le remplissage en haut et en bas crée un espace visuel à l'intérieur de cet élément div */
	border-left: 1px solid #FFF ; /* bordure de 1px de couleur RVB 173/177/150 correspond a #ADB196 en hexadecimal (charte graphique) */
	/*height:740px; /* charte graphique */
    height:auto; /* hauteur du container variable en fonction du contenu */
	padding-top:50px; /* espacement entre le contenu et le bord superieur du container (charte graphique) */
	border-bottom:1px solid #FFF ;
}

.thrColLiqHdr #mainContent { /* Attributs de style du container central de la page (zone modifiable du template) */
	margin: 0 0px 0 233px;
 /* les marges droite et gauche de cet élément div créent les deux colonnes extérieures su les deux côtés de la page. Quelle que soit la taille du contenu dans les éléments div des encadrés, l'espace des colonnes reste préservé. Vous pouvez supprimer cette marge gauche si vous souhaitez que le texte de l'élément div #mainContent remplisse l'espace des encadrés lorsque le contenu de ces derniers se termine. */
	width: 580px; /* Identique  à la largeur du bandeau logo - la largeur des marges */
	padding-top: 0px;
	height:auto; /* hauteur du container variable en fonction du contenu */
}

.thrColLiqHdr #footer { /* attributs de style du containeur du pied de page */
	padding: 0 10px; /* ce remplissage correspond à l'alignement à gauche des éléments des div qui apparaissent au-dessus. */
	background: #000; /* couleur du fond (charte graphique) */
	color:#FFF; /* couleur police (charte graphique) */
	text-decoration:none;  /* pour annuler le soulignement par défaut des liens */
	font-style:none; /* pour annuler le soulignement par défaut des liens */
	font-family : Arial; /* police (charte graphique) */
    font-size : 12pt; /* taille police (charte graphique) */
	border-top:1px solid #FFF; /* bordure du container (charte graphique) */
	padding-top:2px; /* espace entre la bordure et le contenu */
} 

.liens_pied_page{ /* attributs de style des liens contenus dans le pied de page */
	color:#FFF; /* couleur police (charte graphique) */
	text-decoration:none; /* pour annuler le soulignement par défaut des liens */
	font-style:none; /* pour annuler le soulignement par défaut des liens */
	font-family : Arial; /* type police = Arial , charte graphique*/
    font-size : 12pt; /* taille police (charte graphique) */
}

.liens_pied_page:hover{  /* modification des attributs de style des liens contenus dans le pied de page */
	/*color:#000; /* changement de couleur des liens du footer lorsqu'on passe dessus avec la sourie */
	background-color:#000; /* modification de la couleur du fond sur lequel se trouve le lien */
	color: #F90; /* changement de couleur de la police */
}

.thrColLiqHdr #footer p { /* attributs de style des paragraphes contenu dans le pied de page */
	margin: 0; /* la mise à zéro de la marge du premier élément du pied de page permet d'éviter une possible disparition de la marge (espace entre les éléments div) */
	padding: 10px 0; /* l'utilisation d'un remplissage pour cet élément crée un espace, tout comme une marge l'aurait fait, mais en évitant le risque de disparition de la marge */
}

.clearfloat { /* cette classe doit être placée pour un élément div ou break et doit être l'élément final avant la balise de fin d'un conteneur qui doit contenir entièrement des éléments flottants */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

.Liens_menu_gauche_principal { /*  Attributs de style des Liens principaux du menu latéral gauche (liens de couleurs Grise) */ 
	font-size:14pt; /* taille police =  14pt (charte graphique) */
	font:Arial, Helvetica, sans-serif; /* Police = Arial (charte graphique) */
	color:#FFF; /* Police de couleur 124/124/124 RVB (charte graphique) (correspond à #7C7C7C en Hexadecimal */
	text-decoration:none; /* Pour éviter que les liens soient soulignés par défaut */
}

.Liens_menu_gauche_principal:hover { /* Modification des attributs de style des Liens principaux du menu latéral quand on passe dessus avec la sourie */ 
	/*color: #000; /* changement de couleur de la police */
	background-color:#000; /* modification de la couleur du fond sur lequel se trouve le lien */
	color:#F90; /* modification de la couleur du lien */
}

.Liens_menu_gauche_secondaire { /* Attributs de style des Liens secondaires du menu latéral gauche (liens de couleurs Bleue) */ 
	font-size:11pt; /* taille police  */
	font:Arial, Helvetica, sans-serif; /* Police = Arial (charte graphique) */
	color:#FFF; /* Police de couleur 40/146/10 RVB (charte graphique) (correspond à #2892D2 en Hexadecimal */
	text-decoration:none; /* Pour éviter que les liens soient soulignés par défaut */
	line-height:28px; /* espacement entre les liens secondaires */
}

.Liens_menu_gauche_secondaire:hover { /* Modification des attributs de style des liens secondaires du menu latéral quand on passe dessus avec la sourie */ 
	/*color: #000; /* changement de couleur de la police */
	color: #F90; /* modification de la couleur du lien */
	background-color:#000; /* modification de la couleur du fond sur lequel se trouve le lien */
}

.paragraphe_menu_lateral_droit{ /* attributs de style des textes du menu lateral de droite */
	font-size:12pt; /* taille police = 12pt (charte graphique) */
	font:Arial, Helvetica, sans-serif; /* Police = Arial (charte graphique) */
	color:#FFF; /* Police de couleur 124/124/124 RVB (charte graphique) (correspond à #7C7C7C en Hexadecimal */
	text-decoration:none; /* Pour éviter que les liens soient soulignés par défaut */
	padding-left:12px; /* positionnement comme dans la charte graphique */
	text-align:justify;
}

.thrColLiqHdr #cadre_recrutement{	/* définit les attributs de style du cadre recrutement du menu latéral droit */
	margin-top:267px;	/* on éloigne le cadre des éléments supérieurs contenus dans le menu */
	height:250px;	/* hauteur du cadre recrutement */
	background-image:url(../Imgs/milieu-cadre-recutement.png); /* arriere plan définit par une image */
}

.image { /* classe "image" pour que le texte se mette a coté des images et pas en dessous */
	float: left;  /* l'image est positionnée sur le côté gauche du conteneur ou elle se trouve */
	margin: 0 6px 6px 0; /* on définit les marges entre l'image et les éléments qui viendront entourer celle-ci */
} 

.lien_contenu_principal{
	font-size:12pt; /* taille police  */
	font:Arial, Helvetica, sans-serif; /* Police = Arial (charte graphique) */
	color:#FFF; /* Police de couleur 40/146/10 RVB (charte graphique) (correspond à #2892D2 en Hexadecimal */
	text-decoration:none; /* Pour éviter que les liens soient soulignés par défaut */
	line-height:28px; /* espacement entre les liens secondaires */
}

.lien_contenu_principal:hover{
	background-color:#000;
	color:#F90; /* Police de couleur 40/146/10 RVB (charte graphique) (correspond à #2892D2 en Hexadecimal */															
}

.tableau_membres {
border:  2px solid #FFF;
border-collapse: collapse;
width: auto;
}
.cellule_entete_tableau_membre {
font-size:12pt; /* taille police = 12pt (charte graphique) */
font:Arial, Helvetica, sans-serif; /* Police = Arial (charte graphique) */
color: #FFF; /* Police de couleur 124/124/124 RVB (charte graphique) (correspond à #7C7C7C en Hexadecimal */
border: thin solid #FFF;
width: auto;
padding: 5px;
background-color: #000;
}
.cellule_tableau_membres {
font-size:12pt; /* taille police = 12pt (charte graphique) */
font:Arial, Helvetica, sans-serif; /* Police = Arial (charte graphique) */
color:#FFF; /* Police de couleur 124/124/124 RVB (charte graphique) (correspond à #7C7C7C en Hexadecimal */
border: thin solid #FFF;
width: auto;
padding: 5px;
text-align: center;
background-color: #000;
}


.info {
   position: relative;
   color: #FFF;
   text-decoration: none;
   font-size:20px;
   border-bottom: 1px #FFF dotted; /* on souligne le texte */
}
.info span {
   display: none; /* on masque l'infobulle */
}
.info:hover {
   background: none; /* correction d'un bug IE */
   z-index: 500; /* on définit une valeur pour l'ordre d'affichage */

   cursor: help; /* on change le curseur par défaut en curseur d'aide */
}
.info:hover span {
   display: inline; /* 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é */

   top: 30px; /* on positionne notre infobulle */
   left: 20px;

   background:#000;

   color: #FFF;
   padding: 3px;

   border: 1px solid #FFF;
   border-left: 4px solid #FFF;
}

.infobulle{
	position: absolute;	
	visibility : hidden;
	border: 5px double #FFF;
	padding: 10px;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 12pt;
	background-color: #000;
	color:#FFF;
}