body {
/*	font-size: 10px; NL */
	font-size: x-small;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #002252;
	margin-top: 0px;
	margin-bottom: 0px;
	background-color: #ecebe3;
}
 

a	{
	color: #3d739b;
}

a:hover {
	color: #002252;	
}

/* mise en évidence. */
strong
{
	/*  On spécifie le font-weight pcq rien indique que le navigateur DOIT faire le rendu 
		en gras. On spécifie aussi la font-family, parce que avec certaines fonte présentes
		dans la simulation, le gras ne se démarque pas du texte normal.
	*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
}

/* Style pour liens inactifs.   Ce style est appliqué au texte qui remplace un lien lorsque ce dernier est désactivé. */
.LienInactif 
{
   text-decoration: none;
}

/* Indicateur de postback asynchrone en cours (Chargement...)*/
div.progression
{
	width: 200px;
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: #8ca9c2;
	border: solid 1px #b1c8d8;
	color: #FFF;
	vertical-align: middle;
	text-align: center;
	right: 10px;
	bottom: 10px;
	position: fixed;
	z-index: 1000;
	font-size: 10px;
}

p.intro {
	width: 590px;
	text-align: justify;
	margin: 10px 0px 10px 0px;
}


p.msg_inscription {/* message dans le formulaire d'inscription*/
	width: 700px;
	margin-bottom: 20px;
}

p.identite_inscription {/* nom et dossier de la personne à inscrire */
	font-size: 11px;
	font-weight: bold;
	color: #c94b01;
	text-transform: uppercase;
	line-height: 20px;
	border-bottom: 1px solid #c94b01;
	max-width: 600px;	
}

p.tarif_inscription {
	font-size: 11px;
	font-weight: bold;
	color: #c94b01;
	text-transform: uppercase;
}

p.msg_reservation {/* message dans le formulaire de réservation*/
	width: 700px;
	margin-bottom: 20px;
}

p.identite_reservationTete {/* nom et dossier de la personne qui réserve */
	font-size: 11px;
	font-weight: bold;
	color: #c94b01;
	text-transform: uppercase;
	margin-left: 125px;
	line-height: 20px;
	border-bottom: 1px solid #c94b01;
	width: 828px;
	margin-bottom: 25px;
}

p.identite_reservationForm {/* nom et dossier de la personne qui réserve */
	margin-top: 25px;
	font-size: 11px;
	font-weight: bold;
	color: #c94b01;
	text-transform: uppercase;
	line-height: 20px;
	border-bottom: 1px solid #c94b01;
	max-width: 700px;	
}

p.cout_reservation {
	font-size: 11px;
	font-weight: bold;
	color: #c94b01;
	text-transform: uppercase;
}

p.msg_cartemembre {/* message dans le formulaire d'inscription*/
	width: 700px;
	margin-bottom: 20px;
}

p.identite_cartemembre {/* nom et dossier de la personne à inscrire */
	font-size: 11px;
	font-weight: bold;
	color: #c94b01;
	text-transform: uppercase;
	line-height: 20px;
	border-bottom: 1px solid #c94b01;
	max-width: 600px;	
}

p.tarif_cartemembre {
	font-size: 11px;
	font-weight: bold;
	color: #c94b01;
	text-transform: uppercase;
}


p.instruction {
	width: 600px;
	margin-bottom: 20px;
	text-align: justify;
}

div.instruction 
{
	margin: 0px 0px 20px 0px;
	padding: 0px 0px 0px 0px;
	text-align: justify;
}

table#Detail div.instruction table
{
	margin: 0px 0px 0px 0px;
	border-collapse: collapse;	
}

table#Detail div.instruction table th {
	text-align: left;
	white-space:normal;
	padding: 0px 0px 0px 0px;
}
table#Detail div.instruction table td
{
	text-align: left;
	white-space:normal;
	padding: 0px 0px 0px 0px;
}

table#Detail p.instruction table
{
	margin: 0px 0px 0px 0px;
	border-collapse: collapse;	
}


table#Detail p.instruction table th {
	text-align: left;
	white-space:normal;
	padding: 0px 0px 0px 0px;
}

table#Detail p.instruction table td
{
	text-align: left;
	white-space:normal;
	padding: 0px 0px 0px 0px;
}


/* Paragraphe message d'erreur. */
p.erreur {
	color: #B50000;
	width: 600px;
	font-weight: bold;
}

/* Paragraphe message de succès. */
p.valide  {
	color: #5d8b01;
	width: 600px;
	font-weight: bold;
}

/* Paragraphe d'avertissement (resultats tronques) */
p.avertissement {
	width: 600px;
	color: #c94b01;
	font-weight: bold;
}

p.unCritere {
	width: 600px;
	color: #c94b01;
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
	margin: 0px 0px 5px 0px;
}

/* Messages relatifs aux résultats de recherche. */
p.resultatRecherche
{
	width: 550px;
	margin: 10px 0px 10px 0px;
	text-align: justify;
}
p.panier
{
	width: 550px;
	margin: 10px 0px 10px 0px;
	text-align: justify;	
}

.Important,
table#Ludik_page table.tabDonnees tr td.Important
{
	color: #c94b01; 
}

span.annule {
	color: #c94b01;
	font-weight: bold;
	text-transform: uppercase;
}

span.complet {
	color: #5A7C16;
	font-weight: bold;
	text-transform: uppercase;
}

span.DetailStatutComplet 
{
   color: #5A7C16;
	font-weight: bold;
	text-transform: uppercase;
}

span.identique {
text-transform:uppercase;
color: #0988ca;
}

span.enfant {
text-transform:uppercase;
color: #af8401;
}

/* Span message d'erreur. */
span.erreur {
	color: #FF0000;
}

/* Span message de succès. */
span.valide  {
	color: #5D8B01;
}

/* Span message d'avertissement font-weight: bold; ?*/
span.avertissement {
	color: #c94b01;
}

span.activites
{
	font-size: 10px;
	font-variant: normal;
}

/* Pour aligner les données numériques à droite. */
.numerique 
{
	text-align: right;
}
/* Pour aligner les montants à droite. */
.monetaire,
table#Ludik_page td.monetaire
{
	text-align: right;
	white-space: nowrap;
}

.ListeAttente {
	   color: #c94b01;
	}

ul li {
	list-style: none;
}


input {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-seri;
	font-size: 10px;
	color: #002252;	
}

/* titre principal en vert */
h1 {
	font-size: 17px;
	font-weight: bold;
	color: #5d8b01;
	margin: 5px 0px 5px 0px;
	/* clear: both; Pour que le menu d'aide en ligne fasse descendre le titre, si il est trop long.*/
}

/* sous-titres avec ligne verte en-dessous*/
h2	{
	font-size: 11px;
	font-weight: bold;
	color: #3d739b;
	text-transform: uppercase;
	line-height: 20px; 
	border-bottom: 1px solid #8cb33e;
	width: 100%;
/*NL*/  margin-bottom: 10px; 	
}

div.HautPage 
{
	float: left;
	margin-top: 30px;
	padding-top: 3px;
	border-top: 1px solid #8cb33e;
	/*width: 580px;*/
	width: 100%;
	text-align: right ;
	}
	
	div.HautPage a 
	{
		color: #002252;
		text-transform: uppercase;
		text-decoration: none;
	}
	div.HautPage a:hover
	{
		text-decoration: underline;	
	}
	
 	div.HautPage img
 	{
		margin-left: 10px;
		vertical-align: middle;
		cursor:pointer;
	}



/* Tableau principal qui délimite la largeur, la couleur de fond blanche pour tout le contenu*/
table#Ludik_page {
	width: 975px;
	height: 650px;
	
	border-left: 1px #b9ccdb solid;
	border-right: 1px #b9ccdb solid;
	
	text-align: left;
	margin-top: 0px;
	
	background-color: #FFF;
	background: url(images/BG_page.gif) repeat-x #FFF;
}

		table#Ludik_page td 
		{
			padding-bottom: 10px;
			vertical-align: top;
		}
		
		
		table#Ludik_page td table tr td{
			padding-bottom: 0px;/*PM -- firefox fix*/
		}
		
table#Ludik_page td.imageCell
{
	text-align: center;	
}
/* Fin : Tableau principal **********************/

/* Éléments de contrôle des zones de la page. */

/* Zone du fil d'arianne. */
div#Ludik_zoneFilArianne
{
	float: left;
	clear: left;
	width: 590px;
	padding: 0px 12px 0px 146px;
	overflow: hidden;
	/*height: 20px;*/
}
/* Zone des messsages aux utilisateurs. */
div#Ludik_zoneMessages
{
	float: left;
	clear: left;
	width: 590px;
	padding: 0px 0px 0px 146px;
	overflow: hidden;
}
/* Zone du titre */
div#Ludik_zoneTitre
{
	float: left;
	clear: left;
	width: 590px;
	padding: 0px 0px 0px 146px;
	overflow: hidden;
}

/* Zone du message d'instruction. */
div#Ludik_zoneInstructions
{
	float: left;
	clear: left;
	width: 590px;
	padding: 0px 0px 0px 146px;
	overflow: hidden;	
}

/* RDA-9348 */
/* Zone des cartes crédit disponibles (affichées dans le panier.) */
div#Ludik_zoneCartesCreditsDisponibles
{
	float: left;
	clear: left;
	width: 590px;
	padding: 0px 0px 0px 146px;
	overflow: hidden;	
}

div#Ludik_zoneCartesCreditsDisponibles table td
{
	vertical-align:middle;
}

/* FIN: Éléments de contrôle des zones de la page. ***************** */


/* Tableau qui contient le generique de bas de page */
table#Ludik_basDePage {
		width: 985px;
		border-left: 1px #b9ccdb solid;
		border-right: 1px #b9ccdb solid;
		padding: 5px 15px 5px 15px;  
		background: url(images/Ludik_bgBasPage.gif) repeat-x;
		height: 57px;
	}
	
	table#Ludik_basDePage td {
	vertical-align: bottom;
	text-align: right;

	}

	table#Ludik_basDePage a {
		text-decoration: none;
		color: #002252;
	}
	
	table#Ludik_basDePage a:hover {
		text-decoration: underline;
	}
			table#Ludik_basDePage div.OptionLogos {
				float: left;
				height: 46px;
			}
					table#Ludik_basDePage div.OptionLogos img.M2e{
						background: url(../Img/LogoM2e.gif) no-repeat left top;
						width: 77px;
						height: 46px;
					}
					
					table#Ludik_basDePage div.OptionLogos img.Grics{
						background: url(../Img/LogoGrics.gif) no-repeat left top;
						width: 52px;
						height: 46px;
					}


/* Fin : Tableau qui contient le generique de bas de page */




/* Banniere du haut *****************************/
div#Ludik_banniere {
	background: url(images/Ludik_Banniere.gif) no-repeat;
	width: 983px;
	height: 130px;
	overflow: hidden;
}

			/*  Tableau pour mettre le logo d'une ville et/ou le nom d'un arrondissement*/
			div#Ludik_banniere TABLE.OptionsBanniere
			{
				float: right;
				clear:both;
				margin: 0px 15px 0px 0px;
				width: 185px;
				height: 121px;
				}
				
						/*  La classe Options fait afficher le background du tableau et permet l'affichage
						du nom d'arrondissement et/ou du logo d'une ville  */
						div#Ludik_banniere TABLE.Options
						{
							background:  url(images/BG_OptionsBanniere.gif) no-repeat;
							/*Remplacer par cette ligne pour cacher la bannière.*/
							/*background:  url(../Img/spacer.gif) no-repeat;*/
						}
					
							
				/* spécifique à l'identification d'un arrondissement*/
				/* Pour cacher la ligne qui présente le nom de l'arrondissement.
				div#Ludik_banniere TABLE.Options tr.Arrondissement
				{
					display: none;
					}*/
				div#Ludik_banniere TABLE.Options td.Arrondissement
				{
					padding: 7px 7px 0px 7px;
					text-align: right;
					font-weight: bold;
					text-transform: uppercase;
					color: #fed980;
					}
				/* spécifique pour le logo d'une ville */
				div#Ludik_banniere TABLE.Options td.LogoVille
				{
					height: 90px;
					vertical-align: top;
					background: url(../perso/logo.gif) no-repeat center center;
					/*Remplacer par cette ligne pour cacher la bannière.*/
					/*background:  url(../Img/spacer.gif) no-repeat;*/
				}
				div#Ludik_banniere TABLE.Options td.LogoVille a
				{
					text-decoration: none;
				}
				div#Ludik_banniere TABLE.Options td.LogoVille img, div#Ludik_banniere TABLE.Options td.LogoVille a img
				{
					width: 100%;
					height: 100%;
				}
					
						/* Si on n'affiche pas de logo de la ville Pour le cas où on voudrait 
						afficher un arrondissement sans mettre de logo de ville */
						div#Ludik_banniere TABLE.OptionsBanniere .NonLogoVille
						{
							background: url(images/spacer.gif) no-repeat center top;
							height: 100%;
						}

/* Fin bannière ************************************/

div#Ludik_contenu 
{
	/* La combinaison "float: left" avec "clear: both" cause problème avec 
	   ie6 et le treeview de telerik. "clear: both" est important pour l'alignement,
	   alors que "float: left" est la valeur par défaut dans la plupart des navigateurs. */
	/*float: left;*/
	clear: both;
	width: 825px;
	padding-left: 146px;
	padding-right: 12px;
	overflow: hidden;
}
/**************************************************/

div#Ludik_filAriane {
	color: #3d739b;
	margin-top: 5px;
	padding-bottom: 5px;
	}


/*************************************************************************************************************/
/*-------------------------------------------------------
  DeBUT - Menu principal  -  directement sous la banniere
---------------------------------------------------------*/
	#Ludik_Menu
	{
		float: left;
		clear: both;
		background: url(images/Ludik_ImgGaucheMenu.gif) no-repeat left top;
		padding: 0px 0px 0px 146px;
		overflow: hidden;
		
		margin: 0px 0px 0px 0px;
		height: 31px;
		}
	
	
	#Ludik_Menu ul {
			float: left;
			clear:left;
			margin: 0px;
			padding: 0px;
			/* Cache ce qui n'est pas dans les limites. Pour firefox et IE*/		
			overflow: hidden;
			/* Cache ce qui n'est pas dans les limites. Pour IE*/
			height: 31px;
			}
			
			#Ludik_Menu ul li {
				float: left;
				border-left: 1px solid #FFF;
				border-right: 1px solid #aec1d1;
				padding: 0px;
				height: 31px;
				}
			
				#Ludik_Menu ul a {
					float: left;
					height: 31px;
					padding-top: 8px;
					padding-left: 5px;
					padding-right: 5px;
					font-size: 10px;
					text-transform: capitalize;
					font-variant: small-caps;
					font-weight: bold;
					color: #002252;
					text-decoration: none;
				}
				
				#Ludik_Menu a:hover, #Ludik_Menu a.actif{
					background:  url(../Img/bg_menuActif.gif) repeat-x;
				     }					
						 

/*  FIN MENU PRINCIPAL *******************************************************************************************/


/*  Menu AIDE EN LIGNE  *********/
div#Ludik_MenuAide {
	float: right;
	width: 191px;
	background: url(../Img/BG_MenuAide.gif) repeat-y;
	padding-top: 7px;
	padding-left: 0px;
	margin: 0px 11px 0px 0px;
	}

div#Ludik_MenuAide strong
{
	font-weight: bold;
	font-size: 11px;
	color: #aad141;
	text-transform: uppercase;
	padding: 0px 2px 2px 34px;
	}

	div#Ludik_MenuAide ul 
	{
		width: 170px;
		padding: 0px;
		margin: 8px 10px 5px 16px;
		}
		
	div#Ludik_MenuAide ul li {
		background: url(../Img/Puce_MenuAide.gif) no-repeat left 4px;
		padding: 1px 2px 5px 18px;
		margin-top: 2px;
		}
			
	div#Ludik_MenuAide a {
		color: #cae3f6;
		text-decoration: none;
		}
	
	div#Ludik_MenuAide a:hover {
		text-decoration: underline;
		}
				/*  pour le bas du menu aide avec les coins arrondis*/
				div#Ludik_MenuAide div.BasMenu {
					height: 17px;
					width: 191px;
					padding: 0px;
					margin: 0px;
					background: url(../Img/Bas_MenuAide.gif) no-repeat bottom;
					}
					
/*  Fin Menu AIDE EN LIGNE  *********/


/* Bloc qui regroupe les éléments pour la Recherche par mot cle et par critères*/
div#Ludik_chercher {
	float: left;
	width: 720px;
	}
	
div#Ludik_chercher h3 {
font-size: 10px;
margin-bottom: 6px;
}	

/* ce div englobe la recherche par date et la recherche par période */
/* ce div est important pour délimiter la zone et permettre l'alignement du bouton "rechercher" */
div#Ludik_chercher div.Espaces 
{
	clear:both;
	margin: 0px 0px 0px 0px;
	width: 580px;
	padding:0px;
}



div#Ludik_chercher div.Espaces div.DateOption /* Choix : par date ou par intervalle */
{
	clear: both;
	padding: 2px 0px 2px 0px;
	margin-left: -3px;
}

div#Ludik_chercher div.Espaces div.Date {/* Dans la recherche d'espace par date*/
float: left;
clear:right;
margin: 0px 15px 0px 0px;
/*width: 195px; PM: on ne veux pas que le texte wrap si trop long. */
padding-left: 1px;
}

div#Ludik_chercher div.Espaces div.Date table.dateSelection
{
	border-collapse: collapse;	
}
div#Ludik_chercher div.Espaces div.Date table.dateSelection tr th
{
	margin: 0px	0px 0px 0px;
	padding: 0px 0px 0px 0px;
}				

div#Ludik_chercher div.Espaces div.Periode {/* Dans la recherche d'espace par Période*/
float: left;
clear:right;
margin: 0px 25px 0px 15px;
padding-left: 1px;
}

div#Ludik_chercher div.Espaces div.Periode  table.heuresSelection
{
	border-collapse: collapse;	
}

div#Ludik_chercher div.Espaces div.Periode  table.heuresSelection tr th
{
	margin: 0px	0px 0px 0px;
	padding: 0px 0px 0px 0px;
}

div.Periode p {
width: 300px;
}

	div#Ludik_chercher div.Limiter{
	float:left;
	clear:left;
	margin-left:0px;
	padding-left: 0px;
    padding-top: 0px;
	width: 580px;
	}
	
	div#Ludik_chercher div.Limiter h2
	{
		width: 580px;
	}
	
	
		/* Le menu associé à la liste de critères pour limiter la recherche*/
		ul#Menu_Selection {
			float: left;
			margin: 0px 0px 0px 0px;
			width: 195px;
			padding-left: 0px;
			}
		
			ul#Menu_Selection li{
				margin: 0px;
				padding: 0px;
				background: url(../Img/Puce_MenuListe.gif) no-repeat left 4px;
				padding: 1px 13px 5px 12px;
				}
				

			ul#Menu_Selection a {
				text-decoration: none;
				}
			ul#Menu_Selection li#actif  a
			{
				text-transform: uppercase;
			}
				
			ul#Menu_Selection a:hover {
				text-decoration: underline;
				}
				
				
		/* le bloc contenant les critères à sélectionner*/		
		div#Contenu_Selection {
		float: left;
		clear:none;
		width: 360px;
		min-height: 134px;
		background: #f6f5f0;
		border: 1px solid #c7d7e2;
		margin: 0px 0px 0px 0px;
		padding: 5px 3px 5px 20px;
		font-weight: bold;
		}
		
			div#Contenu_Selection h1{
			font-size: 10px;
			color: #3d739b;
			}
			
			div#Contenu_Selection select {
			font-family: Verdana, Arial, Helvetica, sans-serif;
			font-size: 10px;
			}
/* Fin : Groupe Recherche  */


/* Tableau qui affiche les critères de sélection choisis */
table#Ludik_selection {
	float: right;
	clear: none;
	position:relative;
	left: 30px;
	top: 0px;
	border: dotted 1px #6290b2;
	width: 210px;
	max-width: 210px;
	padding: 0px 0px 0px 0px;
	margin: 0px -210px 15px 0px;
	background-color: #FFF;
	
}

/* Tableau qui affiche les critères de sélection choisis, dans le contexte de bulle (à la page de résultats). */
table.bulle table#Ludik_selection
{
	border: none;
	margin: 0px 0px 0px 0px;
	left: 0px;
}
	table.bulle tr td.TitreBulle,
	table#Ludik_page table.tabDonnees table.bulle tr td.TitreBulle
	{
		text-align: left;
		font-size: 11px;
		text-transform:uppercase;
		color: #002252;
		padding: 4px 5px 2px 13px;
		font-weight: bold;
	}

	table#Ludik_selection th 
	{
		text-align: left;
		font-size: 11px;
		text-transform:uppercase;
		color: #002252;
		padding: 13px 5px 2px 13px;
	}
	
		table#Ludik_selection td {
		padding: 4px 5px 2px 13px;
	}
		table#Ludik_selection td div
		{
			padding: 0px 0px 0px 0px;
		}
		
			table#Ludik_selection td p {
			font-size: 10px;
			color: #3d739b;
			margin: 0px;
		}
		
			table#Ludik_selection td ul 
			{
				margin: 0px;
				padding-left: 10px;
			}			

				table#Ludik_selection td ul li 
				{
					font-size: 10px;
					color: #002252;
					background: url(../Img/ic_li_selection.gif) no-repeat 0px 7px;
					padding: 1px 0px 1px 7px;
				}
/* Fin : Tableau qui contient la selection des criteres */

/* Tableau qui affiche les conditions dans la bulle des conditions*/
table#Ludik_conditions {
	float:left;
	clear:right;
	position:relative;
	left: 30px;
	top: 0px;
	border: dotted 1px #6290b2;
	width: 210px;
	max-width: 210px;
	padding: 0px 0px 0px 0px;
	margin: 0px -210px 0px 0px;
	background-color: #FFF;
	
}

table.bulle table#Ludik_conditions
{
	border: none;
	margin: 10px 0px 10px 0px;
	left: 0px;
}
		table#Ludik_conditions td {
		padding: 4px 5px 2px 13px;
	}
	
/* Fin : Tableau qui affiche les conditions dans la bulle des conditions.*/


/* Début des styles pour les pages de résultats et de détails *************************************************************/
	
	/* ---------------------------------------------------
	 Menu contextuel 
	 ----------------------------------------------------*/
	div#Ludik_MenuContextuel{/* ce div limite la largeur et définit la ligne verte du bas*/
	float:left;
	border-bottom: 1px solid #8cb33e;
	padding-top: 0px; 
	padding-bottom: 0px; 
	margin-left: 146px;
	width: 828px;
	}

		/* un regroupement de boutons du menu contextuel*/
		.Menu_GrpActions {
			float: left;
			clear:right;
			margin: 0px 0px 0px 0px;
			width: 276px;
			padding-left: 0px;
			padding-right: 0px;
			margin-left:0px;
			}
			
			.Menu_GrpActions .TitreAction {
				float:left;
				font-weight:bold;
				padding: 1px 12px 5px 0px;
				}
		
         .Menu_GrpActions ul{
        		float: left;
				max-width: 220px; 
        		margin-top: 0px;
        		margin-left: 0px;
        		padding-left: 0px;
        		}
 
		
					.Menu_GrpActions li{
						margin: 0px;
						padding: 0px;
						background: url(../Img/Puce_MenuListe.gif) no-repeat left 4px;
						padding: 1px 1px 5px 12px;
						white-space: normal;
						width: 175px;
						}
						
					.Menu_GrpActions a {
						text-decoration: none;
						}
						
					.Menu_GrpActions a:hover {
						text-decoration: underline;
						}
						
					.Menu_GrpActions .LienInactif 
					{
					   text-decoration: none;
					   color: Silver;
					}
					   
	/* Fin Menu contextuel *************************************************************************/

/* Élément caché qui permet de remonter lorsque on change de page dans les résultats de recherche. 
   NE PAS MODIFIER! */
span#PostionHaut
{
	float:left;
	clear:both;
	height: 0px;
	visibility: hidden;
}

	/* --------------------------------------------------------------------------------
	 Affichage des données dans les tableaux et navigation de type précédent/suivant
	 ---------------------------------------------------------------------------------*/
			/* Le DIV qui permet l'affichage des données sur toute la largeur */
			/* les tableaux de résultats, détails, ect... seront englobés dans ce DIV */
			
			div#Ludik_Donnees {
			margin-left: -122px;
			width: 950px;
			padding: 0px;
			margin-top: 10px;
			margin-bottom: 10px;
			}			
					/* navigation pour passer d'une page de résultat à l'autre*/
					div#Ludik_Donnees table.tabDonneesPager{
						margin-top: 0px;
						margin-bottom: 0px;
						border: none;
						float: right;
						clear:left;
						}	
					
					/*  Navigation de type précédent/suivant  sert dans l'affichage des pages de détail par exemple */
						div.navPrecSuiv {
						margin: 10px 0px 10px 0px;
						clear: both;
						font-size: 11px;
						text-transform: uppercase;			
						}
				
							div.navPrecSuiv div.prec {/* le bouton précédent */
								float:left;
								background:url(../Img/bt_precedent.gif) left no-repeat;
								padding: 5px 5px 5px 30px;
							}
							
							div.navPrecSuiv div.suiv {/* le bouton suivant */
								float:right;
								background:url(../Img/bt_suivant.gif) right no-repeat;
								padding: 5px 30px 5px 5px;
							}
					
							div.navPrecSuiv a {
								color: #3d739b;
								text-decoration: none;
							}		
								div.navPrecSuiv a:hover {					
									color: #002252;
									text-decoration: underline;
								}

/* ************ Tableau des données ********************************/


div#Ludik_Donnees table.tabDonnees {
	width: 950px;
	margin-bottom: 10px;
	margin-top: 10px;
	clear:both;
	}
	
	table.tabDonnees {
	   background-color :#b1c8d8;
	   border-top: #B1C8D8 solid 1px;/* PM */
	   border-left: #B1C8D8 solid 1px;
	}
	
	div#Ludik_Donnees table.tabDonnees .LienInactif 
	{
	}

	table.tabDonnees tr.titre th,
	table.Ludik_Form table.tabDonnees tr.titre th
	{
		border-right:#B1C8D8 solid 1px;
		border-bottom:#B1C8D8 solid 1px;
		background-color : #002252;
		padding: 6px 0px 6px 0px;
		color: #aad141;
		font-size: 11px;
		text-transform: uppercase;
		text-align: center;
		white-space: nowrap;
		}
	
	table.tabDonnees tr th,
	table.Ludik_Form table.tabDonnees tr th
	{
		border-right:#B1C8D8 solid 1px;
		border-bottom:#B1C8D8 solid 1px;
		background-color: #8ca9c2;
		padding: 3px 3px 3px 5px;
		color: #FFF;
		font-size: 10px;
		vertical-align: top;
		text-align: left; /*pour opera*/
		white-space: nowrap;
		text-transform: none;
	}
	
		table.tabDonnees tr th a{
			text-decoration: underline;
			color: #FFF;
		}
		
		/* Fleches haut/bas indicants le tri. */
		table.tabDonnees tr th img.OrdreTri
		{
			margin-left: 3px;
			vertical-align: bottom;
		}
	
	table#Ludik_page table.tabDonnees tr td {
		padding: 3px 3px 3px 5px;
		background-color: #f7f7f0;
		color: #002252;
		font-family: Arial, Helvetica, sans-serif;
		vertical-align: text-top;
		font-size: 10px;
		letter-spacing: 1px;
	}
	
	table.tabDonnees tr td.monetaire
	{
		white-space: nowrap;	
	}
	
	table.tabDonnees tr td.standard
	{
		border-right:#B1C8D8 solid 1px;
		border-bottom:#B1C8D8 solid 1px;
	}
	
	table#tabEspace
	{
		border-bottom:#e0ded5 solid 1px;
		border-left:#FFFFFF solid 1px;
		border-top:#FFFFFF solid 1px;
		border-right:#FFFFFF solid 1px;
	}
	
	table#tabEspace td
	{
	   border-right:#FFFFFF solid 1px;
	}
	
	table#tabEspacePeriode td
	{
		border-top: 1px dotted #6290b2;
	}
	
	table#tabEspace th
	{
	   border-right:#FFFFFF solid 1px;
	   border-top:#e0ded5 solid 1px;
	}
	
	table#tabEspacePeriode td
	{
		border-right:#e0ded5 solid 1px;
	}
	
	table#tabEspacePeriode td table tr td
	{
		padding-left: 0px;
		padding-right: 0px;	
	}
	
	table#tabEspacePeriode td table tr td.monetaire
	{
		padding-left: 5px;
	}

	table.tabDonnees tr td.noborder 
	{
		border: none;
	}
	
	table.tabDonnees tr td.borderbottom
	{
		border-bottom :#B1C8D8 solid 1px;
	}
	
	table.tabDonnees tr td.borderright
	{
		border-right:#B1C8D8 solid 1px;
	}
	
	
	table.tabDonnees tr td span {
		font-family: Arial, Helvetica, sans-serif;
	}

   table.tabDonnees tr td span.ListeAttente {
	   color: #c94b01;
	}
	
	table.tabDonnees tr td.acces, table.tabDonnees tr th.acces{
		text-align: center;
		padding: 3px;
	}		
			
					
		/*    la légende du tableau  */
			div#Ludik_Legende{/* ce div limite la largeur */
			float:left;
			padding-top: 0px;	
			width: 828px;
			}

/*NL*/			div#Ludik_Legende h2 {
/*NL*/				padding: 0px;
/*NL*/				margin-bottom: 0px;
/*NL*/				margin-top: 0px;
/*NL*/				}

/* Fin des styles pour les pages de résultats et de détails ***************************************************************/

/* Informations contact ***************************************/

ul.listeCommunication{
	margin: 5px 5px 5px 15px; 
	padding: 0px;
}

	ul.listeCommunication li{
		padding:3px 0px 5px 20px;
	}

ul.listeCommunication li.telephone
{
	background: url(../Img/ic_telephone.gif) no-repeat 0 0;
	white-space: nowrap;
}
			
ul.listeCommunication li.telecopieur{
	background: url(../Img/ic_fax.gif) no-repeat 0 0;
	white-space: nowrap;
}

ul.listeCommunication li.internet
{
	background: url(../Img/ic_internet.gif) no-repeat 0 0;
}
			
ul.listeCommunication li.courriel
{
	background: url(../Img/ic_courriel.gif) no-repeat 0 0;
}

ul.listeCommunication li.adresse
{
	background: url(../Img/ic_poste.gif) no-repeat 0 0;
}
ul.listeCommunication li.localisation
{
	background: url(../Img/ic_localisations.gif) no-repeat 0 0;
}
ul.listeCommunication li.warning
{
	background: url(../Img/ic_warning.gif) no-repeat 0 0;
}

/* ------------------------------------------------- */
/*  Tableau pour le formulaire d'inscription - Activités groupes */
/* ------------------------------------------------- */

table#Ludik_Inscription {
	float:left;
	clear:both;
	width: 828px;
	border: 1px solid #8cb33e;
	margin-top: 30px;
	}

		table#Ludik_Inscription tr th{
			background: #002252;
			color: #aad141;
			text-transform: uppercase;
			font-size: 17px;
			padding: 4px 16px 4px 16px;
			}
			
		table#Ludik_Inscription td.inscription {
			padding: 4px 16px 4px 16px;
			}
			
			
			table#Ludik_Inscription p.identite_inscription {
					min-width: 100%;
					}

		table#Ludik_Inscription table.Dossiers, table#Ludik_Inscription table.Dossier.HorairesVariables  {
		   float: right;
		   width: 750px;
			margin-bottom: 10px;
			margin-top: 10px;
			clear:both; 
			background:#b1c8d8;
			}
					 

		table#Ludik_Inscription table.Dossiers tr th, table#Ludik_Inscription table.HorairesVariables tr th
		{			
		   background:#002252;
		   padding: 4px 8px 4px 8px;
		   color: #aad141;
		   font-size: 11px;
		   text-transform: uppercase;
		   text-align: center;
		   white-space: normal;
		   font-weight: normal;		   
		}			
		
      table#Ludik_Inscription table tr th.EnteteFormulaireNombrePersonnes
      {
         width: 10%;
      }

      table#Ludik_Inscription table tr th.EnteteFormulaireEffacer
      {
         width: 4%;
      }
      table#Ludik_Inscription table tr th.EnteteFormulaireAliasAmi
      {
         width: 25%;
      }
      table#Ludik_Inscription table tr td select.ListeAliasAmi
      {
         width:80%;
      }
      table#Ludik_Inscription table tr th.EnteteFormulaireNumeroPersonne
      {
         width: 15%;         
      }      
      table#Ludik_Inscription table tr th.EnteteFormulaireNumeroIdentification
      {
         width: 15%;
      }
      table#Ludik_Inscription table tr th.EnteteFormulaireValidationMessage
      {
         width: 30%;
      }
      
	  table#Ludik_Inscription table.Dossiers, table#Ludik_Inscription table.HorairesVariables
	  {
		border-left: #B1C8D8 solid 1px;
		border-top: #B1C8D8 solid 1px;
		width: 100%;
		border-collapse: collapse;
	  }

		table#Ludik_Inscription table.Dossiers td.standard, table#Ludik_Inscription table.HorairesVariables td.standard {
            padding: 3px 3px 3px 5px; 
            background-color: #f7f7f0; 
            color: #002252; 
            font-family: Arial, Helvetica, sans-serif; 
            vertical-align: top; 
            text-align: center;
            font-size: 10px; 
            letter-spacing: 1px; 
            white-space: normal;
            border-right:#B1C8D8 solid 1px;
			border-bottom:#B1C8D8 solid 1px;
			}			

      table#Ludik_Inscription table td.infos {
			padding-left: 20px;
			font-size: 9px;
			width: 220px;
			vertical-align: top;
			}

		table#Ludik_Inscription table td.celluleEffacer
		{
		   padding: 3px 0px 3px 0px; 
		   letter-spacing: 0px; 
		}
		
		table#Ludik_Inscription table td.celluleNomPersonne
		{
		   text-align: left;
		}
			
			table#Ludik_Inscription p.identite_inscription {
					width: 100%;
					}
	
					table#Ludik_Inscription table.Confirmation  {
						float: right;
						width: 700px;
						margin-bottom: 0px;
						background-color: Transparent;
						border-bottom-style: none;
						}
					table#Ludik_Inscription h2 {
						margin-bottom: 4px;
						margin-top: 10px;
						}
				
					table#Ludik_Inscription table.Confirmation td {
						text-align: left;
						padding: 2px 10px 2px 0px;
						font-weight: bold;
						background-color: Transparent;
						border-bottom-style: none;
						}


					table#Ludik_Inscription table.Confirmation td.infos {
						text-align: left;
						font-size: 9px;
						width: 100%;
						font-weight: normal;
						padding: 12px 10px 2px 0px;
						font-style: italic;
						}


/* ------------------------------------------------- */
/* FIN  Tableau pour le formulaire d'inscription - Activités groupes */
/* ------------------------------------------------- */

/* ------------------------------------------------- */
/*  Tableau pour le formulaire de réservation - Espaces */
/* ------------------------------------------------- */

table#Ludik_Reservation {
	float:left;
	clear:both;
	width: 828px;
	border: 1px solid #8cb33e;
	margin-top: 30px;
	}

		table#Ludik_Reservation tr th{
			background: #002252;
			color: #aad141;
			text-transform: uppercase;
			font-size: 17px;
			padding: 4px 16px 4px 16px;
			}
			
			
		table#Ludik_Reservation td {
			padding: 4px 16px 4px 16px;
			}
			
			
			table#Ludik_Reservation p.identite_inscription {
					min-width: 100%;
					}

		table#Ludik_Reservation table.Dossiers {
		    float: right;
		    width: 750px;
		    border-left: 1px solid #B1C8D8;
		    border-top: 1px solid #B1C8D8;
			margin-bottom: 10px;
			margin-top: 10px;
			clear:both; 
			background:#b1c8d8;
			border-collapse: collapse;
			}
					 

		table#Ludik_Reservation table tr th 
		{			
		   background:#002252;
		   padding: 4px 8px 4px 8px;
		   color: #aad141;
		   font-size: 11px;
		   text-transform: uppercase;
		   text-align: center;
		   white-space: normal;
		   font-weight: normal;		   
		}
		
      table#Ludik_Reservation table tr th.EnteteFormulaireNombrePersonnes
      {
         width: 0%;
      }

      table#Ludik_Reservation table tr th.EnteteFormulaireEffacer
      {
         width: 4%;
      }
      table#Ludik_Reservation table tr th.EnteteFormulaireAliasAmi
      {
         width: 25%;
      }
      table#Ludik_Reservation table tr td select.ListeAliasAmi
      {
         width:80%;
      }
      table#Ludik_Reservation table tr th.EnteteFormulaireNumeroPersonne
      {
         width: 20%;
      }      
      table#Ludik_Reservation table tr th.EnteteFormulaireNumeroIdentification
      {
         width: 20%;
      }
      table#Ludik_Reservation table tr th.EnteteFormulaireValidationMessage
      {
         width: 31%;
      }

		table#Ludik_Reservation table.Dossiers td.standard {
            padding: 3px 3px 3px 5px; 
            background-color: #f7f7f0;
            border-bottom: 1px solid #B1C8D8;
            border-right: 1px solid #B1C8D8;
            color: #002252; 
            font-family: Arial, Helvetica, sans-serif; 
            vertical-align: top; 
            text-align: center;
            font-size: 10px; 
            letter-spacing: 1px; 
            white-space: normal;
			}			

      table#Ludik_Reservation  table.Dossiers td.infos {
			padding-left: 20px;
			font-size: 9px;
			width: 220px;
			vertical-align: top;
			}

		table#Ludik_Reservation table td.celluleEffacer
		{
		   padding: 3px 0px 3px 0px; 
		   letter-spacing: 0px; 
		}
		
		table#Ludik_Reservation table td.celluleNomPersonne
		{
		   text-align: left;
		}
		
		table#Ludik_Reservation input.bt_soumettre
		{
		   margin-left: 39px;
			margin-bottom: 20px;
		}
			
			table#Ludik_Reservation p.identite_inscription {
					width: 100%;
					}
	
					table#Ludik_Reservation table.Confirmation  {
						float: right;
						width: 700px;
						margin-bottom: 0px;
						background-color: Transparent;
						border-bottom-style: none;
						}
					table#Ludik_Reservation h2 {
						margin-bottom: 4px;
						margin-top: 10px;
						}
				
					table#Ludik_Reservation table.Confirmation td {
						text-align: left;
						padding: 2px 10px 2px 0px;
						font-weight: bold;
                  background-color: Transparent;
						border-bottom-style: none;

						}
					
					table#Ludik_Reservation table.Confirmation td.infos {
						text-align: left;
						font-size: 9px;
						width: 100%;
						font-weight: normal;
						padding: 12px 10px 2px 0px;
						font-style: italic;
						}


/* ------------------------------------------------- */
/* FIN  Tableau pour le formulaire de réservation - Espaces  */
/* ------------------------------------------------- */

/* *************************
	Début - tableau de Ludik_Form
**************************/

table.Ludik_Form {
	float:left;
	clear:both;
	width: 828px;
	border: 1px solid #8cb33e;
	margin-top: 30px;
	}

		table.Ludik_Form tr th{
			background: #002252;
			color: #aad141;
			text-transform: uppercase;
			font-size: 17px;
			padding: 4px 16px 4px 16px;
			text-align: left;
			}
			
			
		table.Ludik_Form td {
			padding: 4px 16px 4px 16px;
			}
			
			
			table.Ludik_Form p.identite_inscription {
					min-width: 100%;
					}


		table.Ludik_Form table 
		{
		    width: 100%;
			}
	
		table#Ludik_page table.Ludik_Form table td 
		{
            text-align: center;
			}

		table.Ludik_Form table.tabDonnees
		{
			border-collapse: collapse;		
		}
		table.Ludik_Form table td.celluleEffacer
		{
		   padding: 3px 0px 3px 0px; 
		   letter-spacing: 0px; 
		}
		
		table.Ludik_Form table td.celluleNomPersonne
		{
		   text-align: left;
		}
		
		table.Ludik_Form input.bt_soumettre,
		table.Ludik_Form input.bt_annuler,
		table.Ludik_Form input.bt_confirmer
		{
			margin-left: 0px;
			margin-bottom: 20px;
		}
		
/* FIN Tableau de Ludik_Form
*************************/


/*  Detail d'un espace  *************************************************/
table#Detail {
	border: dotted 1px #6290b2;
	width: 100%;
	height: 100%;
	background: #FFF;

	}

	table#Detail h1
	{
	margin-top:0px;
	margin-bottom:0px;
	font-size: 17px;
	font-weight: bold;
	color: #5d8b01;
	line-height: 20px;
	border-bottom: 1px solid #8cb33e;
	width: 100%;	
	}
	
	table#Detail tr li.Impression
	{
	   margin-bottom:-20px;
	}
	
	table#Detail ul.Impression
      {
            padding-top: 0px;
      }
      
      table#Detail table.tabDonnees
      {
            margin-top: 0px;
      }


/*
	table#Detail .Menu_GrpActions {
			float: right;
			clear:left;
			margin: 0px 0px 0px 0px;
			width: 130px;
			padding: 10px 0px 0px 0px;
			margin-left:0px;
			}
*/			
	table#Detail td {
		vertical-align: top;
		color: #3d739b;
		font-size: 10px;
		padding: 2px 10px 2px 10px;
		
		}

		
	
		table#Detail td.fermer {
			background: url(../Img/bt_fermer.gif) no-repeat right top;
			text-align: right;
			padding: 2px 18px 2px 0px;
			font-size: 9px;
			font-weight: bold;
			text-transform: uppercase;
			letter-spacing: normal;
			}
			
		table#Detail td.fermer a {
			color: #002252;
			text-decoration: none;
			}
			
		table#Detail td.fermer a:hover {
			text-decoration: underline;
			}		
		
		table#Detail td img {
			margin-right: 3px;
			margin-bottom: 1px;
			margin-top: 1px;
			vertical-align: middle;
			}
			
/*  FIN Detail d'un espace  *************************************************/

/* Sommaire des espaces *****************/


 table#Detail table.tabDonnees {
		width: 100%;
		margin-top: 10px;
		margin-bottom: 30px;
		background: #FFF;
		padding:0px;
		}
		
		
	table#Detail table.tabDonnees tr th
	{
		background: #8ca9c2;
		padding: 3px 5px 3px 5px;
		color: #FFF;
		font-size: 11px;
		vertical-align: top;
		text-align: left;
		white-space: nowrap;
		border-top: none;
		border-bottom: none;
		border-left: none;
		border-right:#FFFFFF solid 1px;
		font-variant: small-caps;
		white-space: normal;
		width: 250px;
		}
							
	table#Detail table.tabDonnees td.IdEspace{
		vertical-align: top;
		padding-bottom: 10px;
		padding-left: 2px;
		padding-right: 2px;
		font-size: 9px;
		}
										
		table#Detail table.tabDonnees td.IdEspace table {
			border:0px;	
			}
										
		table#Detail table.tabDonnees td.IdEspace table tr.titre th{
			text-transform: uppercase;
			/*height: 34px;*/
			font-size: 9px;
			color: #3d739b;
			background: transparent;
			border:0px;
			border-bottom: 1px dotted #6290b2;
			}
										
						
		table#Detail table.tabDonnees td.IdEspace table tr td{
			font-size: 9px;
			border:0px;
			}
		
	table#Detail table.tabDonnees td.Cout {
		vertical-align: top;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-weight: bold;
		font-size: 11px;
		padding: 6px 5px 3px 5px;
		text-align: right;
		white-space: nowrap;
		}
		
	table#Detail table.tabDonnees td.retirer {
		vertical-align: top;
		text-align: center;
		padding-top: 2px;
		}
	
	
	table#Detail table.tabDonnees img {
		text-align: center;
		padding: 0px 2px 0px 0px;
		}
		
		
		/* tableau contenant dates coordonnées etc. et les Notes spéciales et Directives d'inscription */
		table#Detail table.tabDonnees table
		{
			border-left: 1px solid #e0ded5;
			border-bottom: 1px solid #e0ded5;
			border-top: 1px solid #e0ded5;
			
			width: 100%;
			}
			
			table#Detail table.tabDonnees table table
		   {
		      border:none;
			   }
			   
			table#Detail table.tabDonnees table table tr td
		   {
		      border:none;
			   }
			   
			   table#Detail table.tabDonnees table table tr td.monetaire
		   {
		     		   
			   	text-align: right;
	         white-space: nowrap;
			   }
			   
			   table#Detail table.tabDonnees table tr td.numerique
		   {
		     		   
			   	text-align: right;
	         white-space: nowrap;
			   }
	
		
			   table#Detail table.tabDonnees table table tr td#Total
			   {
		      border-top: 1px solid #e0ded5;
			   }
   									
			table#Detail table.tabDonnees table tr th {
				font-family:Verdana, Arial, Helvetica, sans-serif;
				background-color: #eae8de;
				border-left: 0px;
				border-right: 1px solid #e0ded5;
				padding: 3px 3px 3px 3px;
				color: #002252;
				font-size: 9px;
				text-transform: uppercase;
				vertical-align: top;
				text-align: left; 
				white-space: nowrap;
				}
				
				table#Detail table.tabDonnees table tr.titre th 
				{
					font-family:Verdana, Arial, Helvetica, sans-serif;
					background: #bdcdda; 	
					color: #002252;
					padding: 3px 3px 3px 3px;
					font-size: 11px;
					text-align: left;
					border-bottom: 1px solid #FFF;
					border-top: 1px solid #FFF;
					}
					
					span.type {
					color: #3d739b;
					font-size: 9px;
					}
								
			table#Detail table.tabDonnees table.detailTable tr td {
				line-height: 15px;
				
				border-top: 1px dotted #6290b2;
				border-bottom: 0px;
				border-left: 0px;
				border-right: 1px solid #e0ded5;
				
				background: transparent;
				font-size: 9px;
				vertical-align: top;
				text-align: left;
				padding: 3px 5px 0px 3px;
				}
				
				table#Detail table.tabDonnees table td img {padding:0px; margin-bottom: 1px; margin-top:0px;
				vertical-align: middle;}
				
							table.tabDonnees table td table {
							margin: 0px;
							padding:0px;
						
							}
														
							table.tabDonnees table td table td{
							line-height: 12px;
							padding: 0px 0px 0px 0px;
							border: 0px;
							}
			
			
			/* la TD Prenez note  ---     */
			table#Detail table.tabDonnees table td.Note {
				background: #FFF;
				padding-top: 0px;
				line-height: 12px;
				border-right:#e0ded5 solid 1px;
				}
			
			table#Detail table.tabDonnees table td.Note p {
				margin: 4px -3px 4px 0px;
				}
			
			table#Detail table.tabDonnees table td.Note p.Titre {
				padding: 2px 0px 2px 2px;
				font-family:Verdana, Arial, Helvetica, sans-serif;
				font-weight: bold;
				background: #eae8de;
				width: 100%;
				}
			/*  Fin de la TD Prenez note --- */
			
			
			/* la TD pour les instructions d'inscription  */
			table#Detail table.tabDonnees table td.Directives {
				background: #FFF;
				padding-top: 0px;
				line-height: 12px;
				border-right:#e0ded5 solid 1px;
				}
			
			table#Detail table.tabDonnees table td.Directives p {
				margin: 4px -3px 4px 0px;
				}
			
			table#Detail table.tabDonnees table td.Directives p.Titre {
				padding: 2px 0px 2px 2px;
				font-family:Verdana, Arial, Helvetica, sans-serif;
				font-weight: bold;
				background: #cbd8e4;
				width: 100%;
				}
			/* fin de la TD pour les instructions d'inscription  */
			
			/* tableau contenant dates coordonnées etc. et les Notes spéciales et Directives d'inscription */
		table.detailTable
		{
			border-left: 1px solid #e0ded5;
			border-bottom: 1px solid #e0ded5;
			border-top: 1px solid #e0ded5;
			
			width: 100%;
			}
									
			 table.detailTable tr th {
				font-family:Verdana, Arial, Helvetica, sans-serif;
				background: #eae8de;
				border-left: 1px solid #FFF;
				border-right: 1px solid #e0ded5;
				padding: 3px 3px 3px 3px;
				color: #002252;
				font-size: 9px;
				text-transform: uppercase;
				vertical-align: top;
				text-align: left; /*pour opera*/
				white-space: nowrap;
				}
				
				table.detailTable tr.titre th {
					font-family:Verdana, Arial, Helvetica, sans-serif;
					background: #bdcdda; 	
					color: #002252;
					padding: 3px 3px 3px 3px;
					font-size: 11px;
					text-align: left;
					border-bottom: 1px solid #FFF;
					border-top: 1px solid #FFF;
					}
					
					span.type {
					color: #3d739b;
					font-size: 9px;
					}
								
			table.detailTable tr td {
				line-height: 15px;
				
				border-top: 1px dotted #6290b2;
				border-bottom: 0px;
				/*border-left: 1px solid #FFF;*/
				border-right: 1px solid #e0ded5;
				
				background: transparent;
				font-size: 9px;
				vertical-align: top;
				text-align: left;
				padding: 3px 5px 0px 3px;
				}
				
				table.detailTable td img {padding:0px; margin-bottom: 1px; margin-top:0px;
				vertical-align: middle;}
				
							/* Petit tableau pour lister les détails des tarifs */
							table.detailTable td table {
							margin: 0px;
							padding:0px;
						
							}
														
							table.detailTable td table td{
							line-height: 12px;
							padding: 0px 0px 0px 0px;
							border: 0px;
							}
							
							
							
							/* ------------------------------------------------ */
						
/*     fin sommaire des espaces  *********** */


/* Tableau des dates d'inscriptions *************************************/

table.DatesInscriptionsCompact, table.DatesInscriptions, table.tabDonnees tr td table.DatesInscriptions
{
	border-left: 1px solid #e0ded5;
	border-bottom: 1px solid #e0ded5;
	border-top: 1px solid #e0ded5;
	
	width: 100%;
	border-collapse: collapse;
}

table.DatesInscriptionsCompact tr th, table.DatesInscriptions tr th, table.tabDonnees table.DatesInscriptions tr th
{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	background: #eae8de;
	border-left: 1px solid #e0ded5;
	border-right: 1px solid #e0ded5;
	border-bottom: none;
	border-top: none;
	padding: 3px 3px 3px 3px;
	color: #002252;
	font-size: 9px;
	text-transform: uppercase;
	vertical-align: top;
	text-align: left; /*pour opera*/
	white-space: nowrap;
}

table.DatesInscriptionsCompact tr td, table.DatesInscriptions tr td, table.tabDonnees tr td table.DatesInscriptions tr td
{
	line-height: 15px;
				
	border-top: 1px dotted #6290b2;
	border-right: 1px solid #e0ded5;
	border-bottom: none;
	border-left: none;
	
	background: transparent;
	font-size: 9px;
	vertical-align: top;
	text-align: left;
	padding: 3px 5px 0px 3px;
}

table.DatesInscriptionsCompact tr td.inner, table.DatesInscriptions tr td.inner, table.tabDonnees tr td table.DatesInscriptions tr td.inner
{
	border-top: 1px solid #e0ded5;
}
table.DatesInscriptionsCompact tr td.Periode
{
	width: 40%;
	font-variant: small-caps;
}
table.DatesInscriptionsCompact tr td.Clientele, table.DatesInscriptions tr td.Clientele, table.tabDonnees tr td table.DatesInscriptions tr td.Clientele
{
	white-space: nowrap;
}
table.DatesInscriptionsCompact tr td.Dates, table.DatesInscriptions tr td.Dates, table.tabDonnees tr td table.DatesInscriptions tr td.Dates
{
	white-space: nowrap;
}
table.DatesInscriptions tr td.Lieu, table.tabDonnees table.DatesInscriptions tr td.Lieu
{
	white-space: nowrap;
	font-variant: small-caps;
}

/*DIV qui contient les images identifiants les inscriptions permises pour résidents/nonrésidents.*/
div.ListeImagesInscription
{
	width: 15px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;	
}
div.ListeImagesInscription img, div.ListeImagesInscription input
{
	clear: both;
	margin: 5px 0px 0px 0px;
}

/* FIN Tableau des dates d'inscriptions *************************************/

/* Zone de saisie des mots clés ********************************/
input.mot_cle
{
	width: 200px;
}

/* Wrappers pour les boutons rechercher.*/
div.bt_rechercher_wrapper_haut
{
	/*display: none; pour enlever le bouton de la page.*/
	clear: left;
	float: right;
	/*
	height: 100%;
	vertical-align: bottom;*/
}
div.bt_rechercher_wrapper_bas
{
	/*display: none; pour enlever le bouton de la page. */
	float: left; 
	clear:both; 
	width: 100%; 
	text-align: right;
}

/* ----------------------------------------------------- */
/* FIN  Tableau pour le formulaire de Cartes de membres  */
/* ----------------------------------------------------- */

/*  Boutons de type input   ***************************************************************************/
input.bt_rechercher{ 
	background-image: url(../Img/bt_rechercher.gif);
	background-repeat: no-repeat;
	width: 108px;
	height: 23px;
	}
	

input.bt_precedent{
	background-image: url(../Img/bt_precedent.gif);
	background-repeat: no-repeat;
	width: 30px;
	height: 15px;
	}
	
	
input.bt_suivant{
	background-image: url(../Img/bt_suivant.gif);
	background-repeat: no-repeat;
	width: 30px;
	height: 15px;
	}

input.bt_soumettre{
	background-image: url(../Img/bt_soumettre.gif);
	background-repeat: no-repeat;
	margin-top: 10px;
	margin-right: 30px;
	width: 108px;
	height: 23px;
	}
	
input.bt_valider{
	background-image: url(../Img/bt_valider.gif);
	background-repeat: no-repeat;
	margin-top: 10px;
	margin-right: 30px;
	width: 108px;
	height: 23px;
	}

input.bt_confirmer{
	background-image: url(../Img/bt_confirmer.gif);
	background-repeat: no-repeat;
	margin-top: 10px;
	margin-right: 30px;
	width: 108px;
	height: 23px;
	}
	
input.bt_annuler{
	background-image: url(../Img/bt_annuler.gif);
	background-repeat: no-repeat;
	margin-top: 10px;
	margin-right: 30px;
	width: 108px;
	height: 23px;
	}

input.bt_info
{
	background-image: url(../DepotFichier/ImgLegende/ic_infoAdr.gif);
	background-repeat: no-repeat;
	width: 15px;
	height: 15px;
}

input.bt_retirer
{
   background-image: url(../DepotFichier/ImgLegende/ic_retirer.gif);
   background-repeat: no-repeat;
	width: 20px;
	height: 24px;
}

input.bt_effacer, img.bt_effacer
{
	background-image: url(../DepotFichier/ImgLegende/ic_effacer.gif);
	background-repeat: no-repeat;
	width: 14px;
	height: 15px;
}

input.bt_historique
{
	background-image: url(../DepotFichier/ImgLegende/ic_HistoStatut.gif);
	background-repeat: no-repeat;
	width: 15px;
	height: 15px;
}

a.toggle
{
	text-decoration: none;
	cursor: pointer;
	vertical-align: bottom;
}
a.toggle img
{
	width: 14px;
	height: 14px;
	border: none;
	background-image: url(../Img/moins.gif);	
}
a.closed img
{
	background-image: url(../Img/plus.gif);
}

/* Styles pour les contrôles de télérik ***********************************/

/* -- DatePicker / Calendrier / TimePicker -- */

/* Le wrapper */
.Ludik_picker
{
	vertical-align: bottom;
}

/*Zone de saisie du datepicker*/
.Ludik_input /* Copie de input, permet d'appliquer les style aux contrôles de télérik */
{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #002252;
}

/* Bouton permettant d'afficher le calendrier ou le sélecteur d'heures */
.Ludik_popup_bt
{
	padding: 0px 0px 0px 0px;
	
	text-decoration:none;
	outline:none;/*FF*/
	position:relative;/*FF*/
	cursor: pointer;/*Opera*/
	z-index:2;/*Opera*/
}
.Ludik_popup_bt img
{
	margin: 1px 0px 0px 5px;
}

/* Le calendrier. */
.Ludik_calendar
{
	background-color: #ffffff;
	border: 1px solid #b1c8d8;
	width: 160px;
}

/* Le conteneur interne du calendrier. */
.Ludik_cal_container
{
	width: 100%;
	padding: 1px 1px 1px 1px;
	text-align: center;
}

/* Le tableau de navigation rapide mois/années */
.Ludik_cal_fast_nav
{
	background-color: #ffffff;
	border: 1px solid #b1c8d8;
	width: 160px;
	padding: 2px 2px 2px 2px;
}
.Ludik_cal_fast_nav td
{
	border: 1px solid #ffffff;
}
/* rcSelected: classe de l'élément sélectionné. */
.Ludik_cal_fast_nav td.rcSelected
{
	background-color: #b1c8d8;
	border: 1px solid #b1c8d8;
}
.Ludik_cal_fast_nav a
{
	text-decoration: none;
	color: #000000;
}

/* Le titre, qui contient l'année et les boutons de navigation. */
.Ludik_cal_title
{
	background: #002252;
	color: #aad141;
	
	text-transform: uppercase;
	text-align: center;
	font-weight: bold;
	white-space: nowrap;	
	
	height: 18px;
	width: 100%;
}
/* les boutons de navigation entre les mois. */
.Ludik_cal_title table tr td img
{
	margin-top: 2px;
}
.Ludik_cal_title a
{
	color: #aad141;
	text-decoration: none;
}

/* Le tableau principal du calendrier, qui contient la grilles avec les jours. */
.Ludik_cal_maintable
{
	width: 100%;
	border-collapse: separate;
	text-align: center;
}

/* En tête comprenant le nom des jours (d l m m j v s) et les numéros de semaines. */
.Ludik_cal_header
{
}
/* thead .Ludik_cal_header: jours. */
thead .Ludik_cal_header
{
	background-color: #eae8de;
	border-bottom: 1px solid #b1c8d8;
	text-transform: uppercase;
}

/* Les jours du calendrier - général */
.Ludik_cal_gen_days
{
	text-align: center;
	text-decoration: none;
	color: #000000;
	border: 1px solid #ffffff;
}
.Ludik_cal_gen_days a
{
	text-decoration: none;
	color: #000000;
	font-weight: normal;
}

/* Les jours de semaine (lun @ vend) */
.Ludik_cal_normal_days
{
	
}
.Ludik_cal_normal_days a
{
	
}

/* Les jours de fin de semaine */
.Ludik_cal_weekend_days
{
}
.Ludik_cal_weekend_days a
{
}

/* Les jours des mois suivant/précédent le mois affiché. */
.Ludik_cal_other_month
{
}
.Ludik_cal_other_month a
{
}

/* Les jours lorsque la souris passe au-dessus */
.Ludik_cal_days_hover
{
	border: 1px solid #b1c8d8;
}
.Ludik_cal_days_hover a
{
}

/* Les jours non disponibles. */
.Ludik_cal_outofrange_days
{
	color: #d9d7cd;
	font-weight: lighter;
}

/* Les jours sélectionnés. */
.Ludik_cal_selected_days
{
	background-color: #b1c8d8;
	border: 1px solid #b1c8d8;
}
.Ludik_cal_selected_days a
{
}

/* -- Time Picker -- */
.LudikTimeView
{
	border: 1px solid #eae8de;
}
.Ludik_time_head
{
	background: #002252;
	color: #aad141;
	
	text-transform: uppercase;
	text-align: center;
	font-weight: bold;
	white-space: nowrap;	
	
	height: 18px;
	width: 100%;
}
.Ludik_time_foot
{
	background-color: #eae8de;
}
.LudikTime
{
	background-color: #ffffff;
	border: 1px solid #ffffff;
	padding: 2px 2px 2px 2px;
}
.LudikTimeAlt
{
	background-color: #ffffff;
	border: 1px solid #ffffff;
	padding: 2px 2px 2px 2px;
}
.Ludik_time_over
{
	background-color: #b1c8d8;
	border: 1px solid #ffffff;
	padding: 2px 2px 2px 2px;
}

/* -- TreeView -- */

/* L'arborescence. */
.LudikTreeView
{}
/* Les éléments de l'arborescence. */
.LudikTreeNode {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	color: #002252;
	border-style: none;
	white-space: normal;
	background-image: none;
	background-color: #F6F5F0;
}


.LudikTreeNodeSelected span.LudikTreeNode
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	color: #002252;
	
	border-style: none;
	border-color: #F6F5F0;
	background-image: none;
	background-color: #F6F5F0;
}

.LudikTreeNodeHovered span.LudikTreeNode:hover
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	color: #002252;
	
	border-style: solid;
	border-color: #F6F5F0;
	background-image: none;
	background-color: Transparent;
}

.rtMinus,
.rtPlus
{
	background-image: url(../Img/PlusMinus.png);	
}

.LudikTreeView .rtLines .rtLI
{
   background:url('../Img/NodeSpan.gif') repeat-y 0 0;
}
.LudikTreeView .rtLines .rtFirst
{
   background:url('../Img/FirstNodeSpan.gif') no-repeat 0 1.273em;
}
.LudikTreeView .rtLines .rtLast,
.LudikTreeView .rtLines .rtLast .rtUL
{
   background:none;
}
.LudikTreeView .rtLines .rtTop
{
   background:url('../Img/TopLine.gif') 0 0 no-repeat;
}
.LudikTreeView .rtLines .rtLast .rtTop
{
   background:url('../Img/SingleLine.gif') 0 0 no-repeat;
}
.LudikTreeView .rtLines .rtMid
{
   background:url('../Img/MiddleLine.gif') 0 0 no-repeat;
}
.LudikTreeView .rtLines .rtBot
{
   background:url('../Img/BottomLine.gif') 0 0 no-repeat;
} 

/* FIN - Styles pour les contrôles de télérik ***********************************/

/*   BULLE  *************************************************/
table.bulle {
	border: dotted 1px #6290b2;
	width: 220px;
	background: #FFF;
	border-collapse: collapse;
	}

	table.bulle tr td
	{
		background-color: #fff;
	}
	table.bulle tr td.bulleContenu 
	{
		border: none;
		background-color: #fff;
	}
	
	table.bulle tr td.bulleContenu div {
		color: #3d739b;
		font-size: 10px;
		padding: 10px;
		background-color: #fff;
		}
	table.bulle tr td.bulleContenu div div 
	{
		padding: 0px;
	}
		table#Ludik_page table.tabDonnees tr td table.bulle tr td.fermer,
		table.bulle tr td.fermer {
			background: url(../Img/bt_fermer.gif) no-repeat 99% 1px;
			text-align: right;
			padding: 2px 18px 0px 0px;
			font-size: 9px;
			font-weight: bold;
			text-transform: uppercase;
			border: none;
			letter-spacing: normal;
			vertical-align: top;
			}
		
		table#Ludik_page table.tabDonnees tr td table.bulle tr td.fermer a,	
		table.bulle tr td.fermer a {
			color: #002252;
			text-decoration: none;
			font-weight: bold;
			font-family: Verdana, Arial, Helvetica, Sans-Serif;
			}
			
		table#Ludik_page table.tabDonnees tr td table.bulle tr td.fermer a:hover,
		table.bulle tr td.fermer a:hover {
			text-decoration: underline;
			font-weight: bold;
			}
		/*
		table.bulle td img {
			margin-right: 3px;
			margin-bottom: 1px;
			margin-top: 1px;
			vertical-align: middle;
			}	*/
/*  FIN BULLE  *************************************************/


/* Impression détail */
ul.Impression
{
   /* pour firefox */
   padding-top: 1px;

}	

li.Impression
{
      white-space: nowrap;
		margin-top: 10px;
		margin-bottom: -10px;
		background: url(../Img/Puce_MenuListe.gif) no-repeat left 4px;
		padding: 1px 1px 5px 12px;
		}
		
/* *************************************************
Pour la version préparation seulement
*************************************************/
.PanelPrepClearSession,
.PanelPrepChangerLangue,
.PanelPrepEvalTarif,
.PanelPrepEvalLocGeo
{
	width: 100%;
	padding: 2px 2px 2px 2px;
	margin-bottom: 5px;
	text-align: right;
}

.PanelPrepClearSession, 
.PanelPrepChangerLangue
{
	text-align: left;	
}