
/***********************************feuille de styles avec TOUT les styles***********************************/

/**/
* {font-family: comic sans ms;}
html
	{	 
	height: 100%;
	}
	
body 	/**/
		{
		background-color: black;
		text-align: center; 
		height: 100%;
		margin-top: 0px;
		}
		
#corps 	/**/
		{
		min-height: 100%;
		text-align: left; 
		margin: auto;
		width: 780px; 
		height: auto;
		position:relative;
		background-color: white;
		padding-left: 5px;
		padding-right: 5px;
		}
		
div /**/
	{
	margin-top:0px;
	}
	
a  /*design des liens*/
	{
	color:black;
	text-decoration: none;
	}	
a:hover	/*Quand le visiteur passe sur le lien avec sa souris*/
		{
		text-decoration: underline;
		color: black;
		}
	
h1  /*titres de la page de tarif pour le taleau*/
	{
	font-size: 15pt;
	}
	
h2	/*titres des paragraphes de chaque page (projet péda,...)*/
	{
	font-size: 25pt;
	color: blue;
	text-align: center;
	border-color: red;
	}

p 	/*les paragraphes*/
	{
	padding: 1em;/*alinéa*/
	}
	
table, tr, td /*tableau */
			{
			border-style: solid;
			border-width: 1px;
			}

			
			
/***********************************  DESIGN des class des    DIV   ***********************************/
#milieu 
		{
		overflow: auto;
		padding-bottom: 90px;
		}
				
#contenu
		{
		position: relative;
		float: right;
		/*background-color:yellow;*/
		width: 580px;
		}

#menu_accueil
		{

		background-color: #50d721;
		padding-left: 5px;
		padding-right: 5px;
		margin-bottom: 100px;
		margin-right: 100px;
		position:relative;
		float: left;
		width: 190px;
		line-height: 25px;
		border-radius: 10px 10px; 
		-moz-border-radius: 10px;
		}
#menu
		{
		background-color: #50d721;
		padding-left: 5px;
		padding-right: 5px;
		position:relative;
		float: left;
		width: 100px;
		text-align:center;
		line-height: 25px;
		border-radius: 10px 10px; 
		-moz-border-radius: 10px;
		}
		
#bandeau
		{
		height:150px;
		}
	
#contenupage /*contenu de toutes les pages SAUF celle de l'accueil*/
				{
				margin-top:60px;
				}

#cadrecontact /*bandeau du pied de page*/
				{
				background-color:#50d721;
				bottom: 0px;
				height:80px;
				position: absolute;
				left: 40px;
				right: 40px;
				border-radius: 10px 10px; 
				-moz-border-radius: 10px;
				}
				
				
			
#tableau_accueil_mpv /*tableau : accueil de loisirs mercredis et petites vacances*/
					{
					text-align: center;
					line-height: 20px;
					clear: both;
					}

#com_mpv /*commentaire pour l'accueil MPV*/					
		{
		position: relative;
		float: right;
		text-align: center;
		width: 220px;
		}
		
#tableau_accueil_CEJ /*tableau : Contrat Enfance Jeunesse (accueil de loisirs mercredis et petites vacances) */
					{
					text-align: center;
					position: relative;
					right: 0px;
					}

#tableau_accueil_perisco/*tableau : accueil périscolaire*/
						{
						text-align: center;
						position: relative;
						margin-left: 20px;
						}

#tableau_perisco_CEJ/*tableau : Contrat Enfance Jeunesse (accueil périscolaire) */
						{
						text-align: center;
						position: relative;
						margin-left: 30px;
						}
	
#tableau_anim_petit
					{
					border-width:0px;
					}

#tableau_anim_grand
					{
					border-width:0px;
					}
					
#tableau_anim
					{
					border-width:0px;
					}

#groupe_periscolaire
					{
					margin-top: 100px;
					}
/***********************************  DESIGN des images   ***********************************/
#logo
				{
				position: absolute;
				left: 20px;
				}
				
#gif_euro
			{
			position: absolute;
			width: 70px;
			height: 70px;
			top: 200px;
			right: 50px;
			}

#img_euro
			{
			position: relative;
			float: right;
			}
			
#img_projetpeda
				{
				position: absolute;
				left: 550px;
				top: 240px;				
				}

#photo_accueil {

				position: relative;
				float: right;
				}	
				
.bandeau /*le bandeau de haut de page */
		{		
		position: relative;
		clear: left, right;
		}
					
.bienvenue	/*le logo des zébulons dans la page et non dans le titre*/
		{
		position: relative;
		float: right;
		padding-right: 50px;
		}
		
/***********************************  DESIGN des class des    propriétés   ***********************************/
	
	
.NoteJour	{
			position: relative;
			float: right;
			margin-top: 10px;
			margin-right: 50px;
			margin-bottom: 50px;
			text-align: center;
			border:none;
			}	
			
.titreNoteJour	
				{
				width: 400px;
				color: red;
				border-color: red;	
				border-width: 2px;				
				}
				
.commentaires
				{
				color: red;
				}
				
.soustitre_tableau 
					{
					color: purple;
					padding: 2px;
					}

.titretableaupeda 	/*titre du tableau de la page pédagogique*/
					{
					
					text-align: center;
					font-size: 16pt;
					border-width: thick;
					}
					
.objectifsgeneraux	/*différents sujets du tableau pédagogique */
					{
					text-align: center;
					color: red;
					}
.intro   /*l'intro de la page d'accueil*/
		{
		color: black;
		font-style: italic;
		font-family: sans-serif;
		width: 400px;
		text-align: justify;
		text-indent: 2em;
		padding-left: 1em;
		clear: left;
		}
	
.citation 	/**/
			{
			text-align: center;
			font-size: 15pt;
			color: #50d721;
			font-family: comic sans ms;
			}
			
.cadrecontact 	/*le contenu du bas de page*/
				{
				border-style: none;
				border-color: #50d721;
				text-align: center;
				clear: left, right;
				padding-top: 0px;
				}
		
.question 	/**/
			{
			text-decoration:underline;
			}
			
.tarifnet 
			{
			background-color: #d8ced7;
			}
			
.document_telechargeable
						{
						text-align: center;
						font-size:3em;
						}