div {

}

img {
    border: 0;
}	

body {
	margin:0px;
	padding:0px;
	font-family:verdana, arial, helvetica, sans-serif;
	color:#333;
	background: url(fond7.jpg) fixed no-repeat center center;	
}

img.border_image {
 border: 1px solid #666666;
}
table.grid tr td {
	text-align:center;
	font-size: 80%;
}

h1 {
	color:#333;
	font:24px/24px verdana, arial, helvetica, sans-serif;
	font-weight:900;
	margin-top:0px;
	}
h2 {
	color:#333;
	font:14px verdana, arial, helvetica, sans-serif;
	font-weight:700;
	margin:30px 0px 10px 0px;
	text-align:center;
	text-decoration:underline;
	}
h3 {
	color:#666;
	font-size:11px;
	font-weight:800;
	margin:6px 0px 3px 0px;
	}
	
/*h2 {
	margin:0px 0px 15px 0px;
	padding:0px;
	font-size:21px;
	line-height:28px;
	font-weight:900;
	color:black;
	}*/
	
	

p {
	font:13px verdana, arial, helvetica, sans-serif;
	margin:0px 0px 10px 0px;
	padding:0px;
	}
	
#Contenu>p {margin:0px;}
#Contenu>p+p {text-indent:30px;}

.rouge {
	color:red;
}

a {
	color:#09c;
	font-size:12px;
	text-decoration:none;
	font-weight:600;
	font-family:verdana, arial, helvetica, sans-serif;
	}
a:link {color:#09c;}
a:visited {color:#07a;}
a:hover {background-color:#eee;}

#Header a, #Header a:link, #Header a:visited, #Header a:active, #Header a:focus, #Header a:hover {
	text-decoration:inherit;
	background-color:transparent;
	color:inherit;
	font-size:inherit;
	font-family:inherit;
	font-weight:inherit;
}
#Header a small:hover, #Header a:link small:hover, #Header a:visited small:hover, #Header a:active small:hover, #Header a:focus small:hover, #Header a:hover small:hover, #Header small a:hover {
	color:white;
}
#Header {
	font-size:24px;
	margin:0px;
	padding:17px 0px 8px 20px;
	/* For IE5/Win's benefit height = [correct height] + [top padding] + [top and bottom border widths] */
/*	height:33px; /* 14px + 17px + 2px = 33px */
	border-style:solid;
	border-color:black;
	border-width:1px 0px; /* top and bottom borders: 1px; left and right borders: 0px */
	line-height:0px/*11px*/;
	/*background-color:  #CCCC99;	*/
	height:40px;
	color:black;
	font-weight:bold;
/*	/*height:10px;*/
	background: url(fond.jpg) fixed no-repeat center center;
/*	background: url(../images/header2.jpg) left top no-repeat;*/
/*	position:relative; */
	/*background-image:url('images/home.png');
	background-repeat:no-repeat;
	background-position: 5px 10px;*/

/* Here is the ugly brilliant hack that protects IE5/Win from its own stupidity. 
Thanks to Tantek Celik for the hack and to Eric Costello for publicizing it. 
IE5/Win incorrectly parses the "\"}"" value, prematurely closing the style 
declaration. The incorrect IE5/Win value is above, while the correct value is 
below. See http://glish.com/css/hacks.asp for details. */
	voice-family: "\"}\"";
	voice-family:inherit;
	/*height:14px; *//* the correct height */
	}
/*no I've heard this called the "be nice to Opera 5" rule. Basically, it feeds correct 
length values to user agents that exhibit the parsing error exploited above yet get 
the CSS box model right and understand the CSS2 parent-child selector. ALWAYS include
a "be nice to Opera 5" rule every time you use the Tantek Celik hack (above). */
body>#Header {height:30px;}


#Section {
	
	font-size: 17px;
	margin:-5px 0px 0px 0px;
	padding:0px;
	
	color: #467 ; 
}

.images{
	text-align:center;
}


.Contenu {
	margin:0px;/* 100px 40px 205px;*/
	padding:0px;
	border:none;/*1px solid black;*/
	padding:15px;
	/*background-color:  white;*//*#CCCCFF ;*/
/*	position:relative;*/
}



#Menu {
	position:absolute;
	top:90px;
	left:20px;
	width:172px;
	padding:10px;
	background-color: #A6F5A6; /* #BCECBC ; /*#B1F1B1 #cdb #245 #eee #245 #E1D4C0  #776 #689 #9df #467 #E1D4C0  *//*#FFFF99;*/
	border:1px dashed #999;
	line-height:17px;
	
/* Again, the ugly brilliant hack. */
	voice-family: "\"}\"";
	voice-family:inherit;
	width:150px;
}
/* Again, be nice to Opera 5. */
body>#Menu {width:150px;}

/* " */

#Menu h1{	
	font-size:15px;
	padding-top:0px;
	padding-bottom:0px;
	color:black;
}


.centre {text-align: center}
.centre img {margin: 0 auto;} 

/* Centrer un tableau Ie # firefox ..*/
.ctable {margin-left: auto; margin-right: auto; text-align:center;} 

#buttons {
    float: right;
}

#footer {
    margin: 0;
    margin-top: 30px;
    margin-left: 100px;
    margin-right: 100px;
    padding: 0;
    padding-top: 10px;
    border-top: dashed 1px  #646464 ;
}

#footer p {
    margin: 0;
    padding: 2px;
    color: #bbb;
    font-size: 11px;
    font-style: oblique;
}

#date {
    margin: 0;
    padding: 0;
    margin-bottom:15px;
}

#date p {
    margin: 0;
    margin-left: 100px;
    padding: 2px;

    color: #bbb;
    font-size: 11px;
    font-style: oblique;
}

/**********************************************/


.tb {
  width: 50%; /* La largeur c'est pour le test, mais ça montre qu'il est aussi possible de la spécifier en CSS */
  border: 1px dashed gray; /* Et on met une jolie bordure originale autour du tableau */
  text-align:center;
/*  text-align:center;*/
}

.tb caption {
  text-align: center; /* Classique : texte centré */
  font-style: italic; /*             en italique  */
  font-weight: bold;  /*             en gras      */
  font-size: 13px;
/*  color: #cdb; /*#BCECBC /*#0066CC; */    /*             et en bleu   */
}


.tb th { /* Préférable à thead car offre plus de possibilités */
  background-color: #B1F1B1;/*#D3E2ED;*/ /* Chaque case d'en-tête aura un fond bleu */
  color: gray40;             /* Et un gris un peu plus foncé que la moyenne */
}

.tb td {
	  border:1px solid;
  /*border: 1px inset gray;*/ /* Vous pouvez essayer de décommenter : cela produit un affichage classique des cases */
}



/*--------- Style for data pages --------------->*/
.data {
	margin:0px;
	padding:0px;
	/*background-image:url(graphics/bg_leaf2.gif);
	background-repeat:no-repeat;
	background-position:top right;*/
	background-color: white;
	color:black;
}

#title {
	margin:35px 100px 0px 100px;
	padding:0px;
}

.dataContent {
	margin:0px 100px 25px;
	padding:20px;
	color:black;
	background-color :   #CCCCFF;  /*#eee*/
	border:1px dashed black;
}

/* Style pour menu navigation des dates */
.navigation-dates {
	/* Comme la class Contenu pour les marges */
	margin:0px 400px 10px 205px;
	border:1px solid black;
	padding: 5px;/*15px;*/
	background-color:  #E3E6ED ;
	display: block;
/*	text-decoration: underline;*/

}

/* Style pour menu du calendrier jour */
.jour {
	/* Comme la class Contenu pour les marges */
	margin:0px 400px 40px 205px;
	border:1px solid black;
	padding: 5px;/*15px;*/
	background-color:  #E3E6ED ;
	display: block;
/*	text-decoration: underline;*/

}


.imb {
 list-style-type : none;
}
#liste-enligne {
    border: 1px solid #000;
    margin: 2em;
    width: 80%;
    padding: 5px;
    font-family: Verdana, sans-serif;
   }
#liste-enligne div {
    display: inline;
   }

#liste-enligne p {
    display: inline;
   }

#liste-enligne ul, #liste-enligne li {
    display: inline;
    margin: 0;
    padding: 0;
    color: #339;
    font-weight: bold;
   }




/**********************************************
*
* Calendrier
* Ait Elhaj Brahim
* Version adoptée : Lundi 28 novembre 2005
*
* Classes à utiliser différentes pour tableaux jour ou tableaux mois/semaine
*/




body 
	{/*	background: white /*#E3E6ED*/ ;*/	font: 12px "trebuchet MS", arial, helvetica, sans-serif;	margin: 0;	padding: 0;}

.centre-cal{
	width:600px;
	margin:0px 0px 0px 205px;
/*	margin-right: auto;
	margin-left:auto; */
}


#ap-calendrier {
	padding: 5px;
	width: 655px;
	border: 1px solid #777;
	/*margin-left:auto; 
	margin-right: auto;*/
	
	margin:0px 50px 40px 205px;
/*	margin:10px 50px 40px 250px;*/
/*	margin-top: 20px;*/

	/*margin-left:auto; 
	margin-right: auto;	*/
}


/*
ap-calendrier ul {
	margin: 0;
	padding: 0;
	height:200px;
}
*/


#ap-calendrier ul.ap-ligne,#ap-calendrier #ap-libelle, #ap-calendrier #ap-libelle-day{
	margin: 0;
	padding: 0;
	height:65px;
/*	width : 250px; */
}

/* Les libellés */
#ap-libelle, #ap-libelle-day, #ap-libelle-week {
/*	width: 400px;*/
	padding: 0px;
}





ul.ap-ligne, ul.ap-ligne-day, ul.ap-ligne-week {
	clear: left;
/*	width: 300px;*/
	padding: 0 5px;
} 

/*
* ici sont définis la hauteur de toutes les lignes
* la longueur des cases qui ne sont pas des titres 
*/
#ap-libelle li, ul.ap-ligne li, #ap-libelle-day li, ul.ap-ligne-day li {
	border: 1px solid #fff;
	list-style-type: none;
	margin: 1px 1px 0 0; 
	padding: 0;
/*	width : 350px; BON POUR UN JOUR */
	width :84px;
	height: 63px;
	float : left;
	text-align: center;
	line-height: 20px;
}

/*
* ici sont définis la hauteur de toutes les lignes
* la longueur des cases qui ne sont pas des titres 
*/
#ap-libelle-week li, ul.ap-ligne-week li{
	border: 1px solid #fff;
	list-style-type: none;
	margin: 1px 1px 0 0; 
	padding: 0;
/*	width : 350px; BON POUR UN JOUR */
	width :560px;
	height: 40px;
	float : left;
	text-align: center;
	line-height: 20px;
}



#ap-calendrier #ap-libelle li,#ap-calendrier #ap-libelle-day li,#ap-calendrier #ap-libelle-week li {
	background: #CCCC99;/*#DDDDDD;*/
	list-style-type: none;
	color: #443C60;
}

ul.ap-ligne li, ul.ap-ligne-day li, ul.ap-ligne-week li {
	background: #fff;
	color: #443C60;
	/* ICI */
}


/* Longueur de ligne pour un jour */
#ap-libelle-day li, ul.ap-ligne-day li{
	width: 574px;
}

#ap-calendrier #ap-libelle-week , #ap-calendrier ul.ap-ligne-week {
	height:30px;
/*	width : 250px; */
}

#ap-calendrier ul.ap-ligne-week,#ap-calendrier #ap-libelle, #ap-calendrier #ap-libelle-day{
	margin: 0;
	padding: 0;
	height:65px;
/*	width : 250px; */
}

/********************* TABLEAU VUE FERME DU SART ********* ************* *******************/
/*li, ul.ap-ligne-week li{*/

.groupe{ 
	border: 1px solid black;
/*	list-style-type: none;*/
	margin: 1px 1px 0 0; 
	margin:0px 50px 40px 205px;
	padding: 0;
/*	width : 350px; BON POUR UN JOUR */
	width :560px;
	text-align:center;
/*	height: 40px;*/
/*	float : left;
	text-align: center;
	line-height: 20px;*/
}

.titre{
	background-color:#CCCC99;
}

.matin {
	border: 1px  solid black; 
	background-color:#DBE9CD;
	width:250px;
/*	margin: 1px 1px 10px 0px; */
}

.midi {
	border: 1px solid black; 
	background-color:#FFCC66; /*#90D454 #DBE9CD #0080C0 #DDDDDD #FFCC66 #FF9900 #E4EFDA*/
}


#navlist li
{
	display: inline;
	list-style-type: none;
	padding-right: 1px;
}

/************** *************** *************** ******************/



/****************************************************/
/* hauteur d'une ligne pour la vue jour */
#ap-calendrier ul.ap-ligne-day li{
	height:20px; 	
}


#ap-calendrier ul.ap-ligne-day{
	margin: 1px 1px 1px 1px ;
	padding: 0px;
	height:95px;
	border: 1px solid black;	
}



/*
* longueur des cases qui sont des titres
* Colonne gauche de taille réduite pour un jour
*/
#ap-calendrier ul.ap-ligne-day li.ap-noItem{
	height:82px;	
}

/******************************************************/

/*
* longueur des cases qui sont des titres
* Colonne gauche de taille réduite 
*/
#ap-calendrier li.ap-noItem{
	width : 40px; 
}


/* Couleur des cases selon présence d'événement ou pas .... */
ul.ap-ligne li.ap-itemNoEvent, ul.ap-ligne-week li.ap-itemNoEvent{
	/*background-color: #DDDDDD; *//*#99CCFF ;#E3E6ED*/
/*	border: 1px solid #0080C0;	*/
	border: 1px solid black;
/*	width : 400px; 
/*	height:50px;*/
}

ul.ap-ligne-day li.ap-itemNoEvent {
	border: 1px dashed #DDDDDD;
}


ul.ap-ligne li.ap-itemSelectedItem, ul.ap-ligne-day li.ap-itemSelectedItem,
ul.ap-ligne-week li.ap-itemSelectedItem{
	background-color: #DDDDDD;
	border: 1px solid #0080C0;	
/*	width : 400px; 
/*	height:50px;*/
}

ul.ap-ligne li.ap-itemExistingItem, ul.ap-ligne-day li.ap-itemExistingItem,
ul.ap-ligne-week li.ap-itemExistingItem  {
	background-color: #DBE9CD;
	border: 1px solid #90D454; 
/*	border-right:1px solid #90D454;
	border-left:1px solid #90D454;
	margin:0;*/
	
	/*width : 400px; */
	
/*	height:50px;*/
}



ul.ap-ligne li.ap-itemExistingItem2, ul.ap-ligne-day li.ap-itemExistingItem2,
ul.ap-ligne-week li.ap-itemExistingItem2 {
	background-color: #FFCC66;
	border: 1px solid #FF9900;
	/*width : 400px; */
	
/*	height:50px;*/
}


ul.ap-ligne li.ap-itemExistingItem a, ul.ap-ligne-day li.ap-itemExistingItem a,ul.ap-ligne li.ap-itemExistingItem2 a, ul.ap-ligne-day li.ap-itemExistingItem2 a,
ul.ap-ligne-week li.ap-itemExistingItem a,ul.ap-ligne-week li.ap-itemExistingItem2 a{
/*	display: block;*/
	text-decoration: underline;
}

/* Couleur Hyperliens des evenements */
ul.ap-ligne li.ap-itemExistingItem a:hover, ul.ap-ligne-day li.ap-itemExistingItem a:hover,
ul.ap-ligne li.ap-itemExistingItem2 a:hover, ul.ap-ligne-day li.ap-itemExistingItem2 a:hover,
ul.ap-ligne-week li.ap-itemExistingItem a:hover,ul.ap-ligne-week li.ap-itemExistingItem2 a:hover{
	background-color: #E4EFDA;
}



/* Moment Courant */
ul.ap-ligne li.ap-itemCurrentItem, ul.ap-ligne-day li.ap-itemCurrentItem, ul.ap-ligne-week li.ap-itemCurrentItem{
	background-color: #FCF1E2;
	border: 1px solid #EAB159;
}