html
{
	font-size		: 100%;
	font-family 	: Cambria;		/* Police appliquée à l'ensemble du site, sauf pour les éléments qui n'héritent pas de leurs parents (input, select ...) */
}
body
{
	/*overflow		: hidden;		/* Les dépacements de bloc ne sont pas affichés */
	height			: 100%;		/* Affichage optimal en hauteur */
	width			: 100%;		/* Et en largeur */
	margin			: 0px;		/* Pas de marge extérieure */
	padding			: 0px;		/* Pas de marge intérieure */
	background		: url("../images/Greg.gif") no-repeat fixed 30px 150px;
	font-size		: .75em;
}
.important								/* Tous les mots désignés importants sont affichés différemment */
{
	color			: #FF0000;
}
.t_important
{
	color			: #FF0000;		/* Police en rouge */
	font-variant	: small-caps;	/* Titre en petites majuscules */
	font-weight		: bold;
}
.clignotant
{
	color			: #FF0000;
	font-weight		: bold;
	text-decoration	: blink;
}
.t_important_bis
{
	color			: #80FFFF;		/* Police en cyan clair */
	font-variant	: small-caps;	/* Titre en petites majuscules */
	font-weight		: bold;
}

#entete
{
	position		: absolute;		/* La position du bloc entete est déterminée par rapport aux bords de l'écran */
	top				: 5px;			/* En haut de l'écran mais avec une marge de 5 pixels autour */
	left			: 5px;
	right			: 5px;
	height			: 150px;		/* Pour une hauteur de 150 pixels */
	z-index			: 3;			/* Rang de superposition (au dessus de 1) */
}
#entete table 	/* Table contenant les logos */
{
	width			: 100%;			/* Espacement sur la largeur complète de l'écran */
	border-collapse	: collapse;		/* Pas d'espace entre les cellules du tableau */
	text-align		: center;		/* Pour centrer les logos */
}
#entete img
{
	border			: 0px;			/* Pas de bord autour des liens des logos */
	height			: 110px;		/* Hauteur des images limitée à 110 pixels */
}
/***** Menus déroulants rouge (partie publique) et vert (partie réversée avec le préfixe 'r_'	*****/
/*** Partie commune des menus A REVOIR***/
#menu ,
#r_menu								/* Définition des attributs commun à tous les menus */
{
	width			: 790px; 		/* Largeur du menu */
}
#menu,
#menu ul,
#r_menu,
#r_menu ul 							/* Définition du premier niveau du menu : soit c'est un lien direct, soit un sous-menu dans une liste */
{
	padding			: 0px; 			/* Important pour les listes : pas de marge intérieure */
	margin			: auto;			/* Auto pour centrer le menu mais ne marche pas avec IE */
	list-style		: none; 		/* Pas de puce dans les listes */
	line-height		: 20px; 		/* 20 pixels de hauteur pour les choix du menu */
	text-align		: center; 		/* Texte des menus centré */
}
#menu a,
#r_menu a /* Contenu des listes */
{
	display			: block;		/* on change le type d'élément, les liens deviennent des balises de type block */
	padding			: 0px;			/* aucune marge intérieure */
	color			: #FFFFFF;		/* couleur du texte */
	text-decoration : none;			/* on supprime le style par défaut des liens (la plupart du temps = souligné) */
	width			: 156px;		/* largeur */
	font-style		: italic;
}
#menu li,
#r_menu li /* Elements des listes */      
{ 
	float			: left; 
	border			: 1px solid #000000; /* on met une bordure noire autour de chaque élément */
}

#menu li ul,
#r_menu li ul /* Sous-listes */
{ 
	position		: absolute; /* Position absolue */
	width			: 156px; /* Largeur des sous-listes */
	left			: -999em; /* Hop, on envoie loin du champ de vision */
}
#menu li ul li,
#r_menu li ul li /* Éléments de sous-listes */
{
}
#menu li ul ul,
#r_menu li ul ul
{
	margin    		: -21px 0 0 156px ; /* On décale les sous-sous-listes pour qu'elles ne soient pas au dessus des sous-listes */ 
}
#menu a:hover,#r_menu a:hover /* Lorsque la souris passe sur un des liens */    
{
	color			: #0000FF; /* Change la couleur des textes */
	font-weight		: bold; /* on met le texte en gras */
	font-style		: normal;
}
#menu li:hover ul ul,
#menu li.sfhover ul ul,
#r_menu li:hover ul ul,
#r_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,
#r_menu li:hover ul,
#r_menu li li:hover ul,
#r_menu li.sfhover ul,
#r_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		: 0px; /* Corrige un bug sous IE */
}
/*** Fin de la partie commune ***/
/*** Spécification des couleurs de chaque menu ***/
#menu a								/*Lien  */
{
	background-color: #FF4040; 		/* Couleur de fond rouge foncé */
}
#r_menu a							/* Contenu des listes */
{
	background-color: #048C04; 		/* couleur de fond */        
}
#menu a:hover /* Lorsque la souris passe sur un des liens */    
{
	background-color: #FF8080; /* Change la couleur de fond des textes */
}
#r_menu a:hover /* Lorsque la souris passe sur un des liens */    
{
	background-color: #00C000; /* Change la couleur de fond des textes */
}
/*** Fin de la spécification des couleurs ***/
#menu a.titre_menu
{
	color			: #FFFFFF;
	background-color: #CE0000;
	font-style		: italic;
}
#r_menu a.r_titre_menu
{
	color			: #FFFFFF;
	background-color: #000000;
	font-style		: italic;
}

#menu a.titre_menu:hover
{
	color			: #0000FF;
	background-color: #FF4040;
	font-style		: normal;
}
#r_menu a.r_titre_menu:hover
{
	color			: #0000FF;
	background-color: #004040;
	font-style		: normal;
}
#menu a.choix_2_menu
{
	background-color: #FF8080;
}
#menu a.choix_2_menu:hover
{
	color			: #0000FF;
	background-color: #FFC0C0;
	font-style		: normal;
}
/***** Fin des menues déroulants *****/


#corps
{
	position		: absolute;		/* La position du bloc corps est déterminée par rapport aux bords de l'écran */
	top				: 155px;		/* Démarre à 155 pixels du haut (150+5 de marge) */
	left			: 5px;			/* 0 pixel de la gauche */
	right			: 5px;			/* 0 pixel de la droite */
	bottom			: 77px;			/* 77 pixel du bas (66 de pied + 2*2 de bordure + 5 de marge en bas + 2 marge en haut)  */
	overflow		: auto;			/* Ajout automatique d'ascenseur lorsque la zone d'affichage est trop petite */
	z-index			: 1;			/* Rang de superposition (le + petit est en dessous) */
}
 
#pied_page
{
	position		: absolute;		/* La position du bloc pied_page est déterminée par rapport aux bords de l'écran */
	bottom			: 5px;			/* Démarre à 5 pixels du bas de l'écran (marge de5 px autour) */
	left			: 5px;
	right			: 5px;
	height			: 66px;			/* Pour une hauteur de 66 pixels */
	text-align		: center;
	color			: #FFFFFF;
	background-color: #CE0000;
	border			: 2px solid #000000; /* Cadre noir de 2 pixels d'épaisseur */
}
#pied_page table 	/* Table contenant les bannières des partenaires */
{
	width			: 100%;
/*	font-size 		: 12px;*/
	font-style		: italic;
	color			: #FFFFFF;
	text-align		: center;	/* Pour centrer les bannières */
}

#actu
{
	width			: 780px;
	margin			: auto;
}

.tab_rouge_gauche,
.tab_vert_centre,
.tab_gauche,
.tab_rouge_centre,
.tab_formulaire,
.tab_courriel
{
	margin			: auto;
	border			: 3px solid #CE0000;
	border-collapse	: collapse;
/*	font-size 		: 12px; */
	color			: #0000C0;
	background-color: #FFFFFF;
	z-index			: 2;			/* Rang de superposition (le + petit est en dessous) */
	text-align		: left;
}
.tab_vert_centre
{
	text-align		: center;
	border			: 3px solid #048C04;	/* Bord en vert foncé */
}
.tab_vert_centre th
{
	font-weight		: normal;			/* Pas de police en normal */
	color			: #FFFFFF;			/* Police en blanc */
	background-color: #048C04;			/* Fond en vert foncé */
}
.tab_rouge_centre
{
	text-align		: center;
}
.tab_formulaire
{
	text-align		: right;
}

.tab_tournoi
{
	margin			: auto;
	border			: 1px solid #0000C0;
/*	font-size 		: 14px; */
	color			: #0000C0;
	background-color: #FFFFFF;
	z-index			: 2;			/* Rang de superposition (le + petit est en dessous) */
	text-align		: center;
}
.tab_tournoi th
{
	color			: #FFFFFF;
	background-color: #0000C0;
}
.tab_identification
{
	margin			: auto;
	border			: 1px solid #0000C0;
/*	font-size 		: 14px; */
	color			: #0000C0;
	background-color: #FFFFFF;
	z-index			: 2;			/* Rang de superposition (le + petit est en dessous) */
	text-align		: center;
}
.tab_identification th
{
	color			: #FFFFFF;
	background-color: #0000C0;
}
.tab_identification a
{
	display			: block;
	padding			: 0px;
	background-color: #0000C0;
	color			: #FFFFFF;
	font-variant	: small-caps;	/* Titre en petites majuscules */
}
.tab_identification a:link 
{
	text-decoration	: none;
	color			: #FFFFFF;
}
.tab_identification a:active 
{
	text-decoration	: none;
}
.tab_identification a:visited 
{
	text-decoration	: none;
	color			: #FFFFFF;
}
.tab_identification a:hover 
{
	color			: #CE0000; 
	background-color: #0000C0;
	text-decoration	: none; 
}
.tab_rouge_gauche caption,
.tab_rouge_centre caption,
.tab_gauche caption,
.tab_courriel caption,
.tab_formulaire caption
{
	font-variant	: small-caps;	/* Titre en petites majuscules */
	font-weight		: bold;
	font-size 		: 14px; 
	text-align		: left;
}

.tab_rouge_centre th,
.tab_gauche th,
.tab_formulaire th
{
	border			: 1px solid #CE0000;
	color			: #FFFFFF;
	background-color: #CE0000;
	text-align		: center;
}
.tab_courriel th
{
	border			: 1px solid #CE0000;
	color			: #FFFFFF;
	background-color: #CE0000;
}
.tab_courriel td
{
	vertical-align	: top;
}
.tab_rouge_centre td,
.tab_gauche td
{
	border			: 1px solid #CE0000;
}

.tab_rouge_centre a:link ,
.tab_rouge_centre a:visited ,
.tab_gauche a:link ,
.tab_gauche a:visited 
{
	text-decoration	: none;
	color			: #0000FF;
	font-style		: italic;
}
.tab_rouge_centre a:hover ,
.tab_gauche a:hover 
{
	color			: #0000FF; 
	text-decoration	: none; 
	font-style		: normal;
	font-weight		: bold; /* on met le texte en gras */
}
.tab_rouge_gauche fieldset
{
	margin			: 3px 5px 3px 5px;			/* Marge de 3 px en dessous et au dessus de  chaque bloc d'informations et de 5 px sur les côtés*/
	border			: #CE0000 1px solid;		/* Cadre rouge autour de chaque bloc d'informations */
	padding			: 10px 20px;				/* Marge à gauche et à droite entre le texte et le cadre de 30px et de 10px entre le haut et le bas */
}

.tab_rouge_gauche fieldset legend					/* Titre du bloc */
{
	padding			: 0 10px;					/* Marge à gauche et à droite entre le texte et le cadre */
	border			: #CE0000 1px solid;		/* Cadre rouge autour du titre du bloc */
	background-color: #CE0000;					/* Fond de cadre rouge */
	color			: #FFFFFF;					/* Titre du bloc en blanc */
}
.tab_rouge_gauche fieldset b						/* Redéfinition des textes en BLOLD */
{
	color			: #FFFF80;					/* Police en jaune clair */
}

.apercu_photo
{
	height			: 100px;
	border			: 0px;
}
#legende_photo
{
	font-size 		: 14px;
}
#photo_affichee
{
	width			: 100%;
	border			: 0px;
}

#calendrier table
{
	text-align		: center;
	vertical-align	: middle;
	border			: 2px solid #CE0000;
/*	font-size 		: 12px;*/
	color			: #0000C0;
}
#calendrier td
{
	width			: 18px;
	height			: 18px;
	background-color: #FFFFFF;
}
#calendrier td.fleches 
{
	font-size		: 18px;		/* Flèches un peu plus grandes que le texte */
	font-weight		: bold;
}
#calendrier td.mois_annee
{
	font-size		: 14px;
	font-weight		: bold;
}
#calendrier td.jours 
{
	border			: 1px solid #CE0000;
	color			: #CE0000;
}
#calendrier td.jour_clique
{
	border			: 1px solid #0000FF;
	background-color: #0000FF;
}
#calendrier td.aujourdhui 
{
	border			: 1px solid #CE0000;
	font-weight		: bold;
	font-size		: 14px;
}
#calendrier td.aujourdhui_clique
{
	border			: 1px solid #0000FF;
	font-weight		: bold;
	font-size		: 14px;
	background-color: #0000FF;
}
#calendrier td.cases_vides 
{
	border			: 1px solid #F5F5F5;
	color			: #C0C0C0;
}
#calendrier a
{
	display			: block;
	padding			: 0px;
	background-color: #FFFFFF;
	color			: #CE0000;
}
#calendrier a:link 
{
	text-decoration	: none;
	color			: #CE0000;
}
#calendrier a:active 
{
	text-decoration	: none;
}
#calendrier a:visited 
{
	text-decoration	: none;
	color			: #CE0000;
}
#calendrier a:hover 
{
	color			: #0000FF; 
	background-color: #FF8080;
	text-decoration	: none; 
	font-weight		: bold; /* on met le texte en gras */
}

.liste_cercle
{
	list-style-type	: circle;
}
#courriel_titre,#courriel_corps,#courriel_expediteur
{
/*	font-size 		: 12px; */
	color			: #00C000;
	background-color: #FFFFFF;
	border			: 1px solid #CE0000;
}
#btn_envoyer
{
/*	font-family 	: Cambria;
	font-size 		: 14px; */
	color			: #FFFFFF;
	background-color: #CE0000;
	border			: 3px outset #CE0000;
}
.btn_retour
{
/*	font-family 	: Cambria;
	font-size 		: 14px; */
	color			: #FFFFFF;
	background-color: #CE0000;
	border			: 3px outset #CE0000;
	text-decoration	: none; 
}
.commentaire
{
/*	font-size 		: 10px; */
	font-style		: italic;
	color			: #CE0000;
}
.titre_lien
{
	font-variant	: small-caps;	/* Titre en petites majuscules */
	font-weight		: bold;
/*	font-size 		: 14px; */
	font-style		: normal;
	color			: #0000C0;
}
/* Couleurs de fond des cellules du planning de l'année en fonction de la salle de réception*/
.salle0		/* Pas de rencontre, pas de modification de la couleur de fond mais il faut que la classe salle0 existe pour ne pas avoir d'erreur (la couleur est déterminé par le n° de la salle) */
{
}
.salle1		/* Rencontres en extérieure, pas de modification de la couleur de fond sinon on ne s'y retrouve plus mais même chose que pour les week-end sans rencontre, il faut que la classe salle1 existe */
{
}
.salle2
{
	background-color: #FFFF80;	/* Jaune */
}
.salle3
{
	background-color: #80FF80;	/* Verts */
}
.salle4
{
	background-color: #80FFFF;	/* Cyan */
}
.salle5
{
	background-color: #FF8080;	/* Rouge */
}
.salle6
{
	background-color: #8080FF;	/* Bleu */
}
.salle7
{
	background-color: #C0C0C0;	/* Gris */
}
.salle8
{
	background-color: #FF80FF;	/* Magenta */
}

/***** Tableaux imbriqués pour entête fixe et lignes défilantes (vert)	*****/
/*** Redéfinition des styles du div ENTETE PIED FIXE ***/
.entete_pied_fixe_vert table				/* Redéfinition des tables de ENTETE PIED FIXE */
{
	color			: #FFFFFF;			/* Police en blanc */
	border-collapse	: collapse;			/* Pas d'espace entre les cellules du tableau */
	border			: 0; 				/* Pas de bordure autour du tableau */
	background-color: #048C04;			/* Couleur de fond vert foncé */
	width			: 1000px;			/* Largeur du tableau extérieur doit être plus grand de 20 px (largeur de l'ascenseur vertical) par rapport à celui de l'intérieur  */
	margin			: auto;				/* Centre le tableau */
	table-layout	: fixed;
}
.entete_pied_fixe_vert table caption		/* Redéfinition des titres des tables de ENTETE PIED FIXE */
{
	font-size 		: 16px; 
	font-variant	: small-caps;		/* Titre en petites majuscules */
	font-weight		: bold;
	color			: #008000;			/* Police en vert */
}
.entete_pied_fixe_vert table th,			/* Redéfinition des cellules (titres et données) des tables de ENTETE PIED FIXE */
.entete_pied_fixe_vert table td
{
	border			: 1px solid #FFFFFF;/* on met une bordure blanche autour de chaque élément */
	font-weight		: normal;			/* Pas de police en gras pour les titre de colonnes */
}
.entete_pied_fixe_vert select,			/* Redéfinition des listes déroulantes et des boutons de formulaires de ENTETE PIED FIXE */
.entete_pied_fixe_vert input[type="submit"]
{
	font-family		: Cambria;			/* Les select et input n'héritent pas de la police de leurs parents */
	color			: #FFFFFF;			/* Police en blanc */
	border			: 1px solid #FFFFFF;/* Tour en blanc  */
	background-color: #006000;			/* Fond en vert foncé */
}
.entete_pied_fixe_vert select:hover,
.entete_pied_fixe_vert input[type="submit"]:hover,
.entete_pied_fixe_vert select:focus,
.entete_pied_fixe_vert input[type="submit"]:focus
{
	background-color: #00C000;			/* Au survol de la souris, les listes et les boutons de formulaires "s'allument" avec un vert plus clair */
}
.entete_pied_fixe_vert input[type="submit"]
{
	font-variant	: small-caps;		/* Libellé des boutons en petites majuscules */
	cursor			: pointer;			/* Curseur en forme de main au passage de la souris au dessous des boutons */
}
.entete_pied_fixe_vert img				/* Les images ont une taille définie pour ne pas avoir des lignes de hauteur/largeur différentes (dépendantes de l'image sinon) */
{
	width			: 18px;				/* Même taille que les boutons des formulaires (input) */
	height			: 18px;
	vertical-align	: middle;			/* Elles sont centrées verticalement */
}
.entete_pied_fixe_vert a					/* Police en blanc, comme si de rien n'était, pour les liens de tris */
{
	color			: #FFFFFF;
}
.entete_pied_fixe_vert a:link,
.entete_pied_fixe_vert a:active,
.entete_pied_fixe_vert a:visited			/* Pas de distinction particulière des liens au repos, au clic et une fois visité */
{
	text-decoration	: none;
}
.entete_pied_fixe_vert a:hover,			/* Au survol, on indique qu'une interaction est possible avec une couleur différente */
.entete_pied_fixe_vert a:focus
{
	color			: #00C000;			/* Vert plus clair que le fond */
	font-weight		: bold;				/* Texte en gras */
}
.entete_pied_fixe_vert input[type="submit"]:disabled
{
	background-color: #80AA80;			/* Couleur de fond gris/vert foncé */
	font-style		: italic;			/* Libellé en italique */
	cursor			: default;			/* Curseur par défaut pour ne pas signaler l'interactivité */
}
/*** Fin de la redéfinition des styles de ENTETE PIED FIXE  ***/
/*** Redéfinition des styles du div CORPS DEFILANT ***/
.corps_defilant_vert
{
	height			: 400px;			/* Hauteur du tableau/div qui affiche les données */
	overflow		: auto;				/* Ajoute automatiquement l'ascenseur dans le tableau/div interrieur lorsque la zone d'affichage est trop petite */
}
.corps_defilant_vert table				/* Redéfinition des tables de CORPS DEFILANT */
{
	width			: 980px;			/* Largeur du tableau intérieur, obligatoirement plus petite de 20 px que celui de l'extérieur pour afficher l'ascenseur */
	border-collapse	: collapse;			/* Pas d'espace entre les cellules du tableau */
	table-layout	: fixed;

	border			: 0;
	color			: #0000C0;			/* Police en bleu */
	background-color: #FFFFFF;
	text-align		: center;
}
.corps_defilant_vert input[type="submit"]				/* Redéfinition des boutons de formulaire du CORPS DEFILANT */
{
	border			: 1px solid transparent;/* Un cadre transparent de 1 px est utilisé pour que le cadre de survol ne masque pas une partie de l'image des boutons */
	width			: 18px;				/* Les images des boutons font 16 * 16, pour avoir un cadre de 1 px d'épaisseur, il faut définir un cadre de 18 * 18 */
	height			: 18px;
	background-color: transparent;		/* La transparence contenu dans le format des images de fond des boutons est respectée */
}
.corps_defilant_vert input[type="submit"]:hover,
.corps_defilant_vert input[type="submit"]:focus
{
	border			: 1px solid #6060FF;		/* Au survol de la souris, un cadre bleu clair entoure le bouton */
	background-color: #A0A0FF;					/* et la couleur de fond devient bleue très clair */
}
.corps_defilant_vert a
{
	color			: #0000C0;			/* Police en bleu */
}
/*** Fin de la redéfinition des styles du CORPS DEFILANT ***/
.ligne_paire_vert 						/* Les lignes paires sont affichées dans une couleur de fond différente pour faciliter la lecture du tableau */
{
	background		: #DCFFDC;			/* vert très clair */
}
.ligne_impaire_vert 						/* Les lignes impaires sont affichées dans une autre couleur de fond */
{
	background		: #F5F5F5;			/* gris très clair */
}
.ligne_importante_vert					/* Les lignes importantes sont signalées d'une autre façon */
{
	background		: #FFDCDC;			/* rouge très clair */
}
.ligne_paire_vert:hover,
.ligne_impaire_vert:hover,
.ligne_importante_vert:hover			/* La ligne survolée est affichée d'une couleur différente des 3 autres déjà utilisées pour l'affichage */
{
	background		: #DCDCFF;			/* bleu très clair */
}
/***** Fin tableaux imbriqués (vert) *****/
/***** Tableaux imbriqués pour entête fixe et lignes défilantes (rouge)	*****/
/*** Redéfinition des styles du div ENTETE PIED FIXE ***/
.entete_pied_fixe_rouge table				/* Redéfinition des tables de ENTETE PIED FIXE */
{
	color			: #FFFFFF;			/* Police en blanc */
	border-collapse	: collapse;			/* Pas d'espace entre les cellules du tableau */
	border			: 0; 				/* Pas de bordure autour du tableau */
	background-color: #CE0000;			/* Couleur de fond rouge foncé */
	width			: 1000px;			/* Largeur du tableau extérieur doit être plus grand de 20 px (largeur de l'ascenseur vertical) par rapport à celui de l'intérieur  */
	margin			: auto;				/* Centre le tableau */
	table-layout	: fixed;
	text-align		: center;
}
.entete_pied_fixe_rouge table caption		/* Redéfinition des titres des tables de ENTETE PIED FIXE */
{
	font-size 		: 16px; 
	font-variant	: small-caps;		/* Titre en petites majuscules */
	font-weight		: bold;
	color			: #0000C0;			/* Police en bleu foncé */
}
.entete_pied_fixe_rouge table th,			/* Redéfinition des cellules (titres et données) des tables de ENTETE PIED FIXE */
.entete_pied_fixe_rouge table td
{
	border			: 1px solid #FFFFFF;/* on met une bordure blanche autour de chaque élément */
	font-weight		: normal;			/* Pas de police en gras pour les titre de colonnes */
}
.entete_pied_fixe_rouge select,			/* Redéfinition des listes déroulantes et des boutons de formulaires de ENTETE PIED FIXE */
.entete_pied_fixe_rouge input[type="submit"],
.entete_pied_fixe_rouge input[type="checkbox"]
{
	font-family		: Cambria;			/* Les select et input n'héritent pas de la police de leurs parents */
	color			: #FFFFFF;			/* Police en blanc */
	border			: 1px solid #FFFFFF;/* Tour en blanc  */
	background-color: #A00000;			/* Fond en rouge foncé */
}
.entete_pied_fixe_rouge select:hover,
.entete_pied_fixe_rouge input[type="submit"]:hover,
.entete_pied_fixe_rouge input[type="checkbox"]:hover,
.entete_pied_fixe_rouge select:focus,
.entete_pied_fixe_rouge input[type="submit"]:focus,
.entete_pied_fixe_rouge input[type="checkbox"]:focus
{
	background-color: #FF4040;			/* Au survol de la souris, les listes et les boutons de formulaires "s'allument" avec un rouge plus clair */
}
.entete_pied_fixe_rouge input[type="submit"],
.entete_pied_fixe_rouge input[type="checkbox"]
{
	font-variant	: small-caps;		/* Libellé des boutons en petites majuscules */
	cursor			: pointer;			/* Curseur en forme de main au passage de la souris au dessous des boutons */
}
.entete_pied_fixe_rouge a					/* Police en blanc, comme si de rien n'était, pour les liens de tris */
{
	color			: #FFFFFF;
}
.entete_pied_fixe_rouge a:link,
.entete_pied_fixe_rouge a:active,
.entete_pied_fixe_rouge a:visited			/* Pas de distinction particulière des liens au repos, au clic et une fois visité */
{
	text-decoration	: none;
}
.entete_pied_fixe_rouge a:hover,			/* Au survol, on indique qu'une interaction est possible avec une couleur différente */
.entete_pied_fixe_rouge a:focus
{
	color			: #00C000;			/* Rouge plus clair que le fond */
	font-weight		: bold;				/* Texte en gras */
}
/*** Fin de la redéfinition des styles de ENTETE PIED FIXE  ***/
/*** Redéfinition des styles du div CORPS DEFILANT ***/
.corps_defilant_rouge
{
	height			: 400px;			/* Hauteur du tableau/div qui affiche les données */
	overflow		: auto;				/* Ajoute automatiquement l'ascenseur dans le tableau/div interrieur lorsque la zone d'affichage est trop petite */
}
.corps_defilant_rouge table				/* Redéfinition des tables de CORPS DEFILANT */
{
	width			: 980px;			/* Largeur du tableau intérieur, obligatoirement plus petite de 20 px que celui de l'extérieur pour afficher l'ascenseur */
	border-collapse	: collapse;			/* Pas d'espace entre les cellules du tableau */
	table-layout	: fixed;

	border			: 0;
	color			: #0000C0;			/* Police en bleu */
	background-color: #FFFFFF;
}
.corps_defilant_rouge input[type="submit"]				/* Redéfinition des boutons de formulaire du CORPS DEFILANT */
{
	border			: 1px solid transparent;/* Un cadre transparent de 1 px est utilisé pour que le cadre de survol ne masque pas une partie de l'image des boutons */
	width			: 18px;				/* Les images des boutons font 16 * 16, pour avoir un cadre de 1 px d'épaisseur, il faut définir un cadre de 18 * 18 */
	height			: 18px;
	background-color: transparent;		/* La transparence contenu dans le format des images de fond des boutons est respectée */
}
.corps_defilant_rouge input[type="submit"]:hover,
.corps_defilant_rouge input[type="submit"]:focus
{
	border			: 1px solid #6060FF;		/* Au survol de la souris, un cadre bleu clair entoure le bouton */
	background-color: #A0A0FF;					/* et la couleur de fond devient bleue très clair */
}
/*** Fin de la redéfinition des styles du CORPS DEFILANT ***/
.ligne_paire_rouge 						/* Les lignes paires sont affichées dans une couleur de fond différente pour faciliter la lecture du tableau */
{
	background		: #FFDCDC;			/* bleu très clair */
}
.ligne_impaire_rouge 					/* Les lignes impaires sont affichées dans une autre couleur de fond */
{
	background		: #F5F5F5;			/* gris très clair */
}
.ligne_importante_rouge					/* Les lignes importantes sont signalées d'une autre façon */
{
	background		: #FFDCDC;			/* rouge très clair */
}
.ligne_paire_rouge:hover,
.ligne_impaire_rouge:hover,
.ligne_importante_rouge:hover			/* La ligne survolée est affichée d'une couleur différente des 3 autres déjà utilisées pour l'affichage */
{
	background		: #DCDCFF;			/* bleu très clair */
}
/***** Fin tableaux imbriqués (rouge) *****/
/*** Styles communs à tous les tableaux imbriqués ***/
.ordre_croissant,
.ordre_decroissant:hover				/* Affiche le sens du tri pour la colonne triée en sens croissant et le futur sens, au survol, pour la colonne déjà triée en sens décroissant */
 { 
	padding-right	: 15px;				/* Marge sur la droite pour que l'image de fond ne vienne pas en superposition du texte */
	background		: transparent url("../images/s_asc.png") right no-repeat;	/* Alignement à droite de l'image : correspond à la marge disponible */
}
.ordre_decroissant,
.ordre_croissant:hover					/* Affiche le sens du tri pour la colonne triée en sens décroissant et le futur sens, au survol, pour la colonne déjà triée en sens croissant */
 {
	padding-right	: 15px;
	background		: transparent url("../images/s_desc.png") right no-repeat;
}

.btn_consulter							/* Les boutons ont chacuns leur propre image sans tenir compte de leurs héritages précédents */
{
	background		: url("../images/btn_consulter.png") no-repeat center center;
}
.btn_modifier
{
	background		: url("../images/btn_modifier.png") no-repeat center center;
}
.btn_supprimer
{
	background		: url("../images/btn_supprimer.png") no-repeat center center;
}
.col_gauche								/* Certaines colonnes ont leurs données alignées à gauche, les autres sont par défaut centrées */
{
	text-align		: left;
}
/*** Fin des styles communs à tous les tableaux imbriqués ***/
/***** Formulaire de fiche (vert)	*****/
.CadreFormFicheVert 						/* Bloc qui contient le formulaire */
{
	width			: 65%;				/* Le bloc ne prend pas la totalité de la page */
	margin			: auto;				/* Pour centrer le bloc */
	margin-bottom	: 10px;				/* Marge de 10 px en dessous du bloc */
	padding			: 5px 30px;			/* Marge intérieure de 5px en haut et en bas et de 30 px à gauche et à droite */
	font-size		: 1.2em;			/* Taille de la police 20% plus grosse que la normale */
	color			: #0000C0;			/* Police en bleu */
	border			: #006000 1px solid;/* Cadres vert autour du bloc */
}
.CadreFormFicheVert legend				/* Titre du bloc/formulaire */
{
	border-left		: #006000 1px solid;/* Trait de la même couleur (vert foncé) que le cadre sur les côtés gauche et droit du titre */
	border-right	: #006000 1px solid;
	padding			: 0 10px;			/* Marge à gauche et à droite entre le texte et le cadre du titre */
}
.FormFicheVert
{
	font-size		: .8em;				/* Taille de police normale dans le formulaire */
}
.FormFicheVert p							/* Paragraphes entre chaque champs de saisie */
{
	margin			: 2px 2px 0px 2%;	/* 2 px de marge en haut et en bas, 2 à gauche et 2% à droite (pour ajuster les espaces avec les boutons d'aides), entre les paragraphes */
}
.FormFicheVert fieldset						/* Blocs d'informations communes, interne au formulaire */
{
	margin			: 5px 0;			/* Marge de 5 px en dessous et au dessus de  chaque bloc d'informations */
	border			: #006000 1px solid;/* Cadre vert foncé autour de chaque bloc d'informations */
}
.FormFicheVert fieldset legend				/* Titre du bloc */
{
	padding			: 0 10px;			/* Marge à gauche et à droite entre le texte et le cadre */
	border			: #006000 1px solid;/* Cadre vert foncé autour du titre du bloc */
	color			: #006000;			/* Titre du bloc en vert foncé */
}
.FormFicheVert label						/* Libellé des champs de saisie */
{
	background-color: #DCFFDC;			/* Fond en vert clair */
	display			: block;			/* Transforme le label 'inline' en 'bloc' pour pouvoir lui appliquer une largeur*/
	width			: 39%;				/* Les libellés font 39% de la largeur du formulaire */
	float			: left;				/* Aligne les éléments à gauche, ici les champs label */
	padding-right	: 1%;				/* Marge de 1% de la largeur à droite entre le bord et le texte */
	text-align		: right;			/* Aligne le texte à droite (les "cellules" sont elles alignés à gauche avec la même largeur */
	letter-spacing	: 1px;				/* Espace les textes pour une meilleure lisibilité */
	border			: #DCFFDC 2px solid;/* Cadre vert clair pour ajuster l'affichage : cela permet d'aligner les labels avec les champs tout en ayant les textes centrer */
}
.FormFicheVert label:hover
{
	font-weight		: bold;					/* Au survol, les libellés deviennent gras */
}
.FormFicheVert input,						/* Redéfinition des champs de saisie et des listes déroulantes */
.FormFicheVert select,
.FormFicheVert textarea
{
	width			: 53%;				/* Les champs font 53% de la largeur du formulaire (pour qu'il n'y ait pas de décalage en cas de résolution faible style 800*600 */
	margin-left		: 1%;				/* Marge de 1% de la largeur à gauche entre le bord et le texte */
	border			: #C0FFC0 1px solid;/* Cadre vert clair autour des champs */
	font-family 	: Cambria;			/* Les select et input n'héritent pas de la police de leurs parents */
	color			: #0000C0;			/* Police bleue */
}

.FormFicheVert textarea
{
	resize			: none;
	font-size		: 1em;				/* Taille de police normale dans le formulaire */
}
.FormFicheVert input:hover,
.FormFicheVert select:hover,
.FormFicheVert textarea:hover
{
	background-color: #F0F0FF;			/* Au survol , la couleur de fond des champs de saisie et des listes déroulante est bleue clair */

}
.FormFicheVert input:focus,
.FormFicheVert select:focus,
.FormFicheVert textarea:focus
{
	background-color: #FFE0E0;			/* Lorsqu'ils ont le focus, la couleur de fond est rouge clair */

}
.FormFicheVert input[disabled],			/* Définition des champs de saisie et des listes déroulantes grisés */
.FormFicheVert select[disabled],
.FormFicheVert textarea[disabled],
.FormFicheVert input[readonly],			/* Définition des champs de saisie et des listes déroulantes en lecture seule */
.FormFicheVert select[readonly],
.FormFicheVert textarea[readonly]
{
	background-color: #E9E9E9;			/* Fond en gris clair */
	font-style		: italic;
}

.FormFicheVert input[type="submit"]		/* Définition des boutons "submit" */
{
	font-family		: Cambria;			/* Les select et input n'héritent pas de la police de leurs parents */
	font-variant	: small-caps;		/* Libellé des boutons en petites majuscules */
	color			: #FFFFFF;			/* Police en blanc */
	border			: #004000 1px solid;/* Cadre vert foncé autour des boutons */
	width			: 20%;
	background-color: #006000;			/* Fond en vert foncé mais moins que le cadre */
	cursor			: pointer;			/* Curseur en forme de main au passage de la souris au dessous des boutons */
}

.FormFicheVert input[type="submit"]:hover
{
	background-color: #00C000;			/* Bouton vert foncé mais plus clair au survol */
}
/***** Fin de formulaire de fiche (vert)	*****/
/***** Formulaire de fiche (rouge)	*****/
.CadreFormFicheRouge 						/* Bloc qui contient le formulaire */
{
	width			: 50%;				/* Le bloc ne prend pas la totalité de la page */
	margin			: auto;				/* Pour centrer le bloc */
	margin-bottom	: 10px;				/* Marge de 10 px en dessous du bloc */
	padding			: 0 30px;			/* Marge intérieure de 0 en haut et en bas et de 30 px à gauche et à droite */
	font-size		: 1.2em;			/* Taille de la police 20% plus grosse que la normale */
	color			: #0000C0;			/* Police en bleu */
	border			: #CE0000 2px solid;/* Cadres rouge autour du bloc */
}
.CadreFormFicheRouge legend				/* Titre du bloc/formulaire */
{
	border-left		: #CE0000 2px solid;/* Trait de la même couleur (rouge foncé) que le cadre sur les côtés gauche et droit du titre */
	border-right	: #CE0000 2px solid;
	padding			: 0 10px;			/* Marge à gauche et à droite entre le texte et le cadre du titre */
}
.FormFicheRouge
{
	font-size		: .8em;				/* Taille de police normale dans le formulaire */
}
.FormFicheRouge p							/* Paragraphes entre chaque champs de saisie */
{
	margin			: 4px 4px;			/* 2 px de marge en haut et en bas, 0 à gauche et à droite, entre les paragraphes */
}
.FormFicheRouge fieldset						/* Blocs d'informations communes, interne au formulaire */
{
	margin			: 5px 0;			/* Marge de 5 px en dessous et au dessus de  chaque bloc d'informations */
	border			: #CE0000 1px solid;/* Cadre rouge foncé autour de chaque bloc d'informations */
}
.FormFicheRouge fieldset legend				/* Titre du bloc */
{
	padding			: 0 10px;			/* Marge à gauche et à droite entre le texte et le cadre */
	border			: #CE0000 1px solid;/* Cadre rouge foncé autour du titre du bloc */
	color			: #CE0000;			/* Titre du bloc en rouge foncé */
}
.FormFicheRouge label						/* Libellé des champs de saisie */
{
	background-color: #FFDCDC;			/* Fond en rouge clair */
	display			: block;			/* Transforme le label 'inline' en 'bloc' pour pouvoir lui appliquer une largeur*/
	width			: 40%;				/* Les libellés font 40% de la largeur du formulaire */
	float			: left;				/* Aligne les éléments à gauche, ici les champs label */
	padding-right	: 2px;				/* Marge de 2px à droite entre le texte du label et son cadre en couleur de fond */
	text-align		: right;			/* Aligne le texte à droite (les "cellules" sont elles alignés à gauche avec la même largeur */
	letter-spacing	: 1px;				/* Espace les textes pour une meilleure lisibilité */
	border			: #FFDCDC 2px solid;/* Cadre rouge clair pour ajuster l'affichage : cela permet d'aligner les labels avec les champs tout en ayant les textes centrer */
}
.FormFicheRouge label:hover
{
	font-weight		: bold;					/* Au survol, les libellés deviennent gras */
}
.FormFicheRouge input,						/* Redéfinition des champs de saisie et des listes déroulantes */
.FormFicheRouge select
{
	width			: 57%;				/* Les champs font 58% de la largeur du formulaire (39+1+58+1<>100% : il manque 1% mais j'ignore pourquoi !!!) */
	margin-left		: 4px;				/* Marge de 4px au centre, entre le label et le champ de saisie */
	border			: #FFDCDC 1px solid;/* Cadre rouge clair autour des champs */
	font-family 	: Cambria;			/* Les select et input n'héritent pas de la police de leurs parents */
	color			: #0000C0;			/* Police bleue */
}
.FormFicheRouge input:hover,
.FormFicheRouge select:hover
{
	background-color: #F0F0FF;			/* Au survol , la couleur de fond des champs de saisie et des listes déroulante est bleue clair */

}
.FormFicheRouge input:focus,
.FormFicheRouge select:focus
{
	background-color: #E0FFE0;			/* Lorsqu'ils ont le focus, la couleur de fond est vert clair */

}
.FormFicheRouge input[disabled],			/* Définition des champs de saisie et des listes déroulantes grisés */
.FormFicheRouge select[disabled]
{
	background-color: #E9E9E9;			/* Fond en gris clair */
	font-style		: italic;
}

.FormFicheRouge input[type="submit"]		/* Définition des boutons "submit" */
{
	font-family		: Cambria;			/* Les select et input n'héritent pas de la police de leurs parents */
	font-variant	: small-caps;		/* Libellé des boutons en petites majuscules */
	color			: #FFFFFF;			/* Police en blanc */
	border			: #FFFFFF 3px double;/* Cadre blanc foncé autour des boutons */
	width			: 20%;
	background-color: #A00000;			/* Fond en rouge foncé mais moins que le cadre */
	cursor			: pointer;			/* Curseur en forme de main au passage de la souris au dessous des boutons */
}

.FormFicheRouge input[type="submit"]:hover
{
	background-color: #FF4040;			/* Bouton rouge foncé mais plus clair au survol */
}
/***** Fin de formulaire de fiche (rouge)	*****/

.boutons_a_droite						/* Aligne à droite les boutons de validations du formulaire pour les exclure de l'ancrage du float */
{
	text-align		: right;
}
.textes_feminins
{
	color			: #FFC0FF;			/* Police en rose */
}
.textes_masculins
{
	color			: #80FFFF;			/* Police en bleu */
}
/***** Formulaire des événements (vert)	*****/

/***** Fin de formulaire des événements (vert)	*****/
a.info_bulle
{
	position		: relative;
	text-decoration	: none;
}
a.info_bulle img
{
	width			: 18px;				/* Même taille que les boutons des formulaires (input) */
	height			: 18px;
	vertical-align	: bottom;			/* Images alignées sur le bas */
	text-align		: right;
	border			: 0px; 				/* Pas de cadre autour des images du lien */
}
a.info_bulle span.titre,
a.info_bulle span.corps
{
	display			: none; 			/* Par défaut, l'infobulle est invisible. */
}
a.info_bulle:hover
{
	background		: none; 			/* Correction d'un bug d'Internet Explorer. */
	z-index			: 500; 				/* On définit une valeur pour l'ordre d'affichage. */
	cursor			: help; 			/* Curseur d'aide au survol de la zone d'aide */
}
a.info_bulle:hover span.titre
{
	width			: 140px;
	display			: inline; 			/* On rend visible 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		: #006000;			/* Jaune aide */
	color			: #FFFFC0;			/* Vert foncé */
	padding			: 3px;
	border			: 1px solid #006000;
	border-radius	: 5px 5px 0px 0px;
	font-variant	: small-caps;	/* Titre en petites majuscules */
	font-weight		: bold;
	text-align		: center;
}
a.info_bulle:hover span.corps
{
	width			: 140px;
	display			: inline; 			/* On rend visible 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				: 52px; 			/* On positionne notre infobulle. */
	left			: 20px;
	background		: #FFFFC0;			/* Jaune aide */
	color			: #006000;
	padding			: 3px;
	border			: 1px solid #006000;
/*	border-left		: 4px solid #006000;*/
	border-radius	: 0px 0px 5px 5px;
}


/**** Style du calendrier PopUp en Javascript qui permet la saisie d'une date ****/
#CalendrierPopup
{
    position		: absolute;					/* Pour positionner le calendrier juste en dessous du champ de saisie date */
	text-align		: center;					/* Centre les chiffres dans les cases "jour" */
	border			: 1px solid #4040FF;		/* Cadre bleu pour délimiter le calendrier */
	background		: #FFFFFF;					/* Fond du calendrier blanc */
}
#CalendrierPopup table
{
	color			: #FF20FF;					/* Police en rose (jour de la semaine et mois et année affichées */
	border-collapse	: collapse;					/* Les bordures des cellules sont communes */
}
#CalendrierPopup a
{
	display			: block;					/* Affichage des liens sous forme de block : ce qui permet de les ajouters les uns à la suite des autres, de donner une dimension ... */
	margin			: 0px;						/* Pas de marge extérieure */
	padding			: 1px;						/* Marge intérieur de 1 px pour un affichage centré au survol */
	border			: 1px solid transparent;	/* Bord de 1 px invisible pour éviter des modifications d'affichage des cases au survol */
	text-decoration	: none; 					/* Pas de distinction particulières des liens (par défaut soulignés) */
}
#CalendrierPopup a:hover 						/* Au survol des liens */
{
	color			: #FFFFFF;					/* Police blanche */
	background-color: #8080FF;					/* Fond bleu/violine */
	border			: 1px solid #0000C0;		/* Cadre bleu foncé */
}
#CalendrierPopup th
{
	background-color: #C0D9FB;					/* Colonne de titre en fond bleu clair */
}

#CalendrierPopup td
{
	background-color: #FFFFFF;					/* Cellules sur fond blanc */
	width			: 24px;						/* avec une taille de 24 x 20 px */
	height			: 20px;
}
#CalendrierPopup td.jour_clique,
#CalendrierPopup td.aujourdhui_clique			/* Le jour sélectionné est affiché différemment des autres jours du calendrier */
{
	border			: 1px solid #CE0000;		/* cadre rouge */
	background-color: #FFF0F0;					/* fond blanc légèrement rouge */
}
#CalendrierPopup td.aujourdhui ,
#CalendrierPopup td.aujourdhui_clique			/* La date du jour est signalée par un affichage en gras, discret */
{
	font-weight		: bold;
}
#CalendrierPopup td.cases_vides,					/* Les jours des mois précédent et suivant ont une police gris clair (ils sont inactifs) */
#CalendrierPopup td.cases_vides_we
{
	color			: #C0C0C0;
}
#CalendrierPopup td.week_end,
#CalendrierPopup td.cases_vides_we				/* Les jours de week-end sont affichés avec un fonc bleu pâle (même ceux des mois adjacents */
{
	background-color: #D4E4FB;
}
/**** Fin du style Calendrier PopUp ****/