@charset "utf-8";
/* CSS Document */

/*********************************************/
/*        feuille de style reset             */
/*********************************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}

table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
/*********************************************/


/*********************************************/
/* Styles globaux                            */
/*********************************************/
body {
	font-family: Trebuchet MS, verdana, arial, sans-serif;
	font-size: 11px;
	background-image: url(../images/fond.jpg);
	color: #667072;
	position:relative;
	top:0;
	left:0;
	z-index:0;
	line-height: normal;
}

a {
	text-decoration: none;
	color: #667072;
}

a:hover {
	text-decoration: underline;
}

.spacer {
	clear: both;
}

p {
 	padding: 0 10px 0 10px;
}
ul.spip {
  padding: 5px 8px 5px 20px;
  list-style: square;
}
li.spip {
  padding: 10px 0 10px 0;
  margin-bottom:5px;
}
ol.spip {
  padding: 5px 8px 5px 20px;
}

.formulaire_menu_lang {
	margin: 230px 10px 5px 0; 
	padding: 0; 
	border: 0; 
	text-align: right; 
}

form {
	font-family: verdana, arial, sans-serif;
	font-size: 12px;
	color: #667072;
}
fieldset {
	padding:10px;
	margin-bottom:10px;
	width:auto;
	width:100%;
}
legend {
	color:#667072;
	font-weight:bold
}
label {
	margin-top:10px;
	font-family: verdana, arial, sans-serif;
	font-size: 12px;
}
label.inline {
	display:inline
}
input[type="text"] {
	border:1px solid #99cc33;
	background-color:#F7FFC4;
	font-family: verdana, arial, sans-serif;
	font-size: 11px;
	color: #667072;
	margin-top:5px;
}
input[type=radio] {
	margin-right:5px;
	background-color:transparent;
	border:none;
}
select, option {
	background-color:#F7FFC4;
	font-family: verdana, arial, sans-serif;
	color: #667072;
	margin-top:5px;
}
textarea {
	border:1px solid #99cc33;
	background-color:#F7FFC4;
	font-family: verdana, arial, sans-serif;
}
input[type=submit], input[type=reset] {
	border:2px outset #690;
	background-color:#99cc33;
	font-weight:bold;
	color:white;
	cursor:pointer;
}
input[type=submit]:hover, input[type=reset]:hover {
	border:2px outset #F7FFC4;
	background-color:#F7FFC4;
	color:#99cc33;
}
input[type=submit]:active, input[type=reset]:active {
	border:2px inset #690;
	background-color:#99cc33;
	color:white;
} 
.erreur_message {
	color:#C63;
} 
.reponse_formulaire_ok, .reponse_formulaire_erreur {
	font-weight:bold;
	color:#C63;
} 
/************************************************/
/* Styles specifiques a des parties du site     */
/************************************************/


/* Calage du site */
#page {
	width: 990px;
	margin: 0 auto;
	background-color: white;
}

/**
 * Entete du site et pied de page
 */

#pied
{
	margin: auto;
	padding: 5px 0 0 0;
	height: 40px;
	width: 98%;
	border-top: dotted #99cc33 1px;
	text-align:center;
	clear:both;
}
 
#entete {
	padding: 0;
	height: 220px;
	width: 100%;
	font-size: 12px;
}
	
	#bandeauAnimation {
		position: absolute;
		width: 990px;
		height: 210px;
		top: 0px;
		left: 0;
	}

	/* Filet vert en haut de l'entete */
	#enteteFilet {
	height: 10;
	background-color: #99cc33;
	}

	/* logo du site */
	#logo a {
		display: block;
		width: 124px;
		height: 165px;
		position: absolute;
		top: 17px;
		left: 30px;
	}

	#logo span {
		display: none;
	}

	/* Menu */
	#menu {
		width: 990px;
		height: 30px;
		margin: 0 0 0 0;
		position: absolute;
		top: 200px;
		left: 0;
		border-bottom: solid #99cc33 1px;
		border-top: solid #99cc33 1px;
	}

		/* Selecteur des menus */
		#menuSelector {
			margin-top: 0px;
			float: left;
		}

			#menuSelector li {
				margin-left: 0px;
				float: left;
			}

			#menuSelector img {
				border: 0;
			}
		
			#menuSelector ul li img {
				width:198px;
				height:30px;
			}
										
/** Fin de l'entete **/

/** 
 *Contenu central de la page
 */
#content {
	font-family: verdana, arial, sans-serif;
	clear: none;
	padding: 0 10px 0 10px;
	text-align: left;
	background-image: url(../images/fond_corps.jpg);
}

/**
 * Fil d'ariane
 */
	#ariane {
		float: left;
		width: 770px;
		margin-bottom: 10px;
		margin-top: 15px;
		border-bottom: dotted #99cc33 1px;
	}

	#ariane ul {
		width: auto;
		width: 100%;
		float: left;
		display: block;
		margin-bottom: 3px;
	}

	#ariane li {
		display: inline;
		font-weight: bolder;
		padding-top: 5px;
	}
		
	#ariane span {
		font-weight: normal;
		padding: 0 9px 0 0;
		background-image: url('../images/arrow_right.gif');
		background-repeat: no-repeat;
		background-position: 100% 50%;
	}
	
/** Fin du fil d'ariane **/
	
/**
 * colonne de gauche
 */ 
#leftCol {
	float: left;
	position: absolute;
	width: 180px;
	top: 270px;
	left: 10px;
	}
		
		#leftCol .menu2 {
			color: #9933ff;
		}
		#leftCol .menu3 {
			color: #0099ff;
		}
		#leftCol .menu4 {
			color: #ffcc00;
		}
		#leftCol .menu5 {
			color: #ff3366;
		}
		#leftCol .menu6 {
			color: #ff9900;
		}		
		
		#smenu ul
		{
			margin    	:   0;
			padding   	:   0;
			width     	:   178px;
			font-size 	:   11px;
			font-weight	: 	bold;
		}	

		#smenu ul li 
		{						  
  			list-style-type   :  none;            
  			margin-bottom     :  1px;  
			
		}
		#smenu ul li a {
			width             	:   auto !important;   /* excepté IE6 et inférieur */						
  			width             	:   100%;              /* largeur interprétée par IE6 et inférieur */
			height				:	20px;
  			padding           	:   4px 2px 4px 2px;               
  			text-decoration   	:   none;              
  			display           	:   block;
		}	
		
		#smenu .menu1 a {
			background-color: #99cc33;
			color: white;
		}
		#smenu .menu2 a {
			background-color: #9933ff;
			color: white;
		}
		#smenu .menu3 a {
			background-color: #0099ff;
			color: white;
		}
		#smenu .menu4 a {
			background-color: #ffcc00;
			color: white;
		}
		#smenu .menu5 a {
			background-color: #ff3366;
			color: white;
		}
		#smenu .menu6 a {
			background-color: #ff9900;
			color: white;
		}		
		
		#smenu .menu1 a:hover {
			background-color: #99cc33;
			color: white;
			font-style: italic;
		}
		#smenu .menu2 a:hover {
			background-color: #9933ff;
			color: white;
			font-style: italic;
		}
		#smenu .menu3 a:hover {
			background-color: #99ccff;
			color: white;
			font-style: italic;
		}
		#smenu .menu4 a:hover {
			background-color: #ffcc00;
			color: white;
			font-style: italic;
		}
		#smenu .menu5 a:hover {
			background-color: #ff3366;
			color: white;
			font-style: italic;
		}
		#smenu .menu6 a:hover {
			background-color: #ff9900;
			color: white;
			font-style: italic;
		}
		
		#smenu .menuactif1 a {
			background-color: #99cc33;
			color: white;
			font-style: italic;
		}
		#smenu .menuactif2 a {
			background-color: #9933ff;
			color: white;
			font-style: italic;
		}
		#smenu .menuactif3 a {
			background-color: #0099ff;
			color: white;
			font-style: italic;
		}
		#smenu .menuactif4 a {
			background-color: #ffcc00;
			color: white;
			font-style: italic;
		}
		#smenu .menuactif5 a {
			background-color: #ff3366;
			color: white;
			font-style: italic;
		}
		#smenu .menuactif6 a {
			background-color: #ff9900;
			color: white;
			font-style: italic;
		}
		
		#article ul		{			   
  			margin    :   0;              
  			padding   :   0;             
  			width     :   178px;          
  			font-size :   11px;
			font-weight: normal;
		}	

		#article ul li 
		{						  
  			list-style-type   :  none;            
  			margin-bottom     :  1px;            
		}
		#article ul li a {
			width             :   auto !important;   /* excepté IE6 et inférieur */						
  			width             :   100%;              /* largeur interprétée par IE6 et inférieur */
  			padding           :   4px 2px 4px 8px;               
  			text-decoration   :   none;              
  			display           :   block;
		}	
		
		#article .menu1 a {
			background-color: #CF9;
			color: #690;
			font-style: normal;
		}
		#article .menu2 a {
			background-color: #cc99ff;
			color: #606;
			font-style: normal;
		}
		#article .menu3 a {
			background-color: #99ccff;
			color: #60C;
			font-style: normal;
		}
		#article .menu4 a {
			background-color: #ffff66;
			color: #963;
			font-style: normal;
		}
		#article .menu5 a {
			background-color: #FCC;
			color: #ff3366;
			font-style: normal;
		}
		#article .menu6 a {
			background-color: #ffcc66;
			color: #F30;
			font-style: normal;
		}		

		#article .menu1 a:hover {
			background-color: #CF9;
			color: #690;
			font-style: italic;
		}
		#article .menu2 a:hover {
			background-color: #cc99ff;
			color: #606;
			font-style: italic;
		}
		#article .menu3 a:hover {
			background-color: #99ccff;
			color: #60C;
			font-style: italic;
		}
		#article .menu4 a:hover {
			background-color: #ffff66;
			color: #963;
			font-style: italic;
		}
		#article .menu5 a:hover {
			background-color: #FCC;
			color: #ff3366;
			font-style: italic;
		}
		#article .menu6 a:hover {
			background-color: #ffcc66;
			color: #F30;
			font-style: italic;
		}
		
		#article .menuactif1 a {
			background-color: #CF9;
			color: #690;
			font-style: italic;
		}
		#article .menuactif2 a {
			background-color: #cc99ff;
			color: #606;
			font-style: italic;
		}
		#article .menuactif3 a {
			background-color: #99ccff;
			color: #60C;
			font-style: italic;
		}
		#article .menuactif4 a {
			background-color: #ffff66;
			color: #963;
			font-style: italic;
		}
		#article .menuactif5 a {
			background-color: #FCC;
			color: #ff3366;
			font-style: italic;
		}
		#article .menuactif6 a {
			background-color: #ffcc66;
			color: #F30;
			font-style: italic;
		}
/** Fin colonne de gauche **/

/**
 * Colone de droite
 */
#rightCol {
	clear: none;
	position: absolute;
	float: right;
	width: 180px;
	height : 700px;
	overflow : hidden;
	padding:10px 0px 10px 0px;
	font-size: 12px;
	right: 10px;
	top: 270px;
}

	#rightCol a {
		text-decoration:underline;
	}
	
	#rightCol .section a {
		text-decoration:none;
	}
	
	#rightCol .section a:hover {
		text-decoration:underline;
	}
	
	#rightCol div.section {
		padding-bottom:1em;
		background-image: url('../images/dot_green.gif');
		background-repeat: repeat-x;
		background-position: 0 100%;
	}

	#rightCol .section h2 {
		font-size:1.3em;
		margin-top:1em;
		margin-bottom:1em;
		font-weight:bold;
		background-repeat: no-repeat;
		background-position: 0 60%;
		padding-left: 10px;
		color:#99cc33;
	}
	
	#rightCol h2 {
		font-size:1.3em;
		margin-top:1em;
		margin-bottom:1em;
		font-weight:bold;
	}
		
/**
 * Affichage principal
 */
 
#homemain {
	font-size: 15px;
	margin-right: 180px;
	margin-bottom: 20px;
	padding: 1px 0 0 0 0;
}
	#homemain p {
		font-size: 15px;
		padding-left: 5px;
		margin-right: 5px;
	}

#main {
	font-size: 12px;
	margin-left: 200px;
	margin-right: 200px;
	margin-bottom: 30px;
	padding: 1px 0 20px 0;
}
	#main img {
	border: solid #667072 1px;	
}

		#main ul .mmenu1 {
			color: #99cc33;
			list-style-image: url(../images/icone_feuille1.jpg);
		}
		#main ul .mmenu2 {
			color: #9933ff;
			list-style-image: url(../images/icone_feuille2.jpg);
		}
		#main ul .mmenu3 {
			color: #0099ff;
			list-style-image: url(../images/icone_feuille3.jpg);
		}
		#main ul .mmenu4 {
			color: #ffcc00;
			list-style-image: url(../images/icone_feuille4.jpg);
		}
		#main ul .mmenu5 {
			color: #ff3366;
			list-style-image: url(../images/icone_feuille5.jpg);
		}
		#main ul .mmenu6 {
			color: #ff9900;
			list-style-image: url(../images/icone_feuille6.jpg);
		}
	#main h1 {
		font-size: 18px;
		font-weight: bold;
		color: #99cc33;
		margin-bottom: 10px;
	}
	
	#main .mmenu1,
	#main .mmenu2,
	#main .mmenu3,
	#main .mmenu4,
	#main .mmenu5 {
		line-height:30px;
	}

		#main .mmenu1 {
			color: #99cc33;
		}
		#main .mmenu2 {
			color: #9933ff;
		}
		#main .mmenu3 {
			color: #0099ff;
		}
		#main .mmenu4 {
			color: #ffcc00;
		}
		#main .mmenu5 {
			color: #ff3366;
		}
		#main .mmenu6 {
			color: #ff9900;
		}
	
	#main a {
		text-decoration: underline;
		color: #99cc33;
	}
	#main a:hover {
		text-decoration: none;
	}
	
	#main p {
		font-size: 12px;
		padding: 5px 5px 5px 5px;
		margin-right: 5px;
	}
	#main strong {
		font-weight: bold;
	}
	#main h2 {
		font-size: 14px;
		color: #99cc33;
		margin-top: 20px;
		margin-bottom: 10px;
		font-weight: normal;
	}
	
		#main h2 .mmenu1 {
			background-image: url('../images/folder_violet.gif');
			color: #9933ff;
		}
		#main h2 .mmenu2 {
			background-image: url('../images/folder_blue.gif');
			color: #0099ff;
		}
		#main h2 .mmenu3 {
			background-image: url('../images/folder_yellow.gif');
			color: #ffcc00;
		}
		#main h2 .mmenu4 {
			background-image: url('../images/folder_pink.gif');
			color: #ff3366;
		}
		#main h2 .mmenu5 {
			background-image: url('../images/folder_orange.gif');
			color: #ff9900;
		}
		#main .mainContent {
			margin-right: 10px;
		}
	
/***********************************************/
/* Styles pour les boites de la page d'accueil */
/***********************************************/

/* Colonnes contenant les boites */

#frontBoxList .frontBoxCol {
	width: 245px;
	height: 470px;
	float: left;
	margin-left: 10px;
	margin-top: 20px;
	margin-bottom: 20px;
}

#frontBoxList .frontBoxCol.first {
	margin-left: 15px;
}
#frontBoxList .frontBoxCol.last {
	margin-right: 5px;
}

	/* Boites dans leur ensemble */
	.frontBox {
		margin-bottom: 10px;
	}

	/* titres des boites */
	#frontBoxList h2 {
		color: #99cc33;
		background-repeat: no-repeat;
		background-position: 0 0;
		font-size: 20px;
		//font-weight: bold;
		padding-top: 1px;
		height: 14px;
		padding-left: 10px;
		margin: 0;
		border: none;
	}
	
	#frontBoxList p {
		font-size: 12px;
	}
	
		/* Contenu des boites */
		#frontBoxList .boxContent {
			width: 216px;
			height: 470px;
			border-style: dotted;
			border-width: 1px;
			border-color: #99cc33;
			padding: 5px 8px 5px 8px;
			font-size:0.9em;
		}
			/* Couleurs de fond specifique pour chaque boite */
			#frontBox1 .boxContent {
				background-color: #eafdc5;
			}
			#frontBox2 .boxContent {
				background-color: #fafcc9;
			}
			#frontBox3 .boxContent {
				background-color: #e5d3fb;
			}
			
			#frontBoxList .boxContent img {
				float:left;
				margin-left: 8px;
				margin-bottom: 10px;
				width:200px;
				height:200px;
			}
	
			#frontBoxList .boxContent a {
				margin-left: 8px;
				margin-right: 8px;
			}
/* Fin des boites de l'accueil */

