/* ----- STYLE INITIALIZATION ------- */

* { font-family: Verdana, Arial, Helvetica, sans-serif; text-align: left;}

p, a, ul, li, ol, input, select, textarea, div, h1, h2, h3, h4, h5, h6 {
	font-size: 11px;
	color:black;
	}
	
.alert {color:red;}

p, a, ul, li, ol, h1, h2, h3, h4, h5, h6 {
	margin:0;
	padding:0;
	border: 0;
	}
	
table, div, img, td, form {
	margin: 0 auto;
	padding:0;
	border: 0;
	}
	
img {text-align: center; }
	
table, div, form {text-align: center; display: block;}
	
td	{ vertical-align: middle; padding: 2px 5px;}

input { margin: 2px 0;}
	
/* ----- MAIN LAYOUT ------- */

body, html { margin:0; padding:0; width:100%; height:100%; }

	#space	{ background: #cccccc; }
	#info		{ background: #eeeeee; }

#container	{
	width: 750px;
	margin: 15px auto;
	border: solid black 1px;
	background: white url('img/fond.gif') repeat-y ;
	}

	
#header	{
	position: relative;
	width: 100%;
	background-color: #99CCFF;
	border-bottom: solid 1px black;
	}

	#menu {
		position: absolute;
		top: 124px;
		left: 85px;
	}

	#login {
		position: absolute;
		text-align: right;
		top: 92px;
		right: 10px;
		color: white;
	}
	
	#title	{
		width: 100%;
		border-top: 1px solid gray;
		background: #eeeeee;
		text-align:center;
		}

#leftnav	{
	float: left;
	width: 140px;
	padding: 15px;
	}

#content	{
	margin-left: 170px;
	}

	#warning {
				background-color: red;
				text-align: center;
				margin-bottom: 15px;
				padding:5px;
				border-top: 1px dashed black;
				border-bottom: 1px dashed black;
				}
				
	#main	{
		margin-right: 170px;
		padding: 15px;
		}
				
	#notes	{
		float: right;
		width: 140px;
		padding: 15px;
		}

#footer	{
	clear: both;
	border-top: solid gray 1px;
	text-align:center;
	line-height: 250%;
	background: #eeeeee;
	color: #003366;
	font-size: 10px;
	}


/*------ img/blocs style definition -----*/

div.photo	{
	margin: 0 0 15px 0;
	border: 1px solid gray;
	padding: 10px 0;
	text-align:center;
	background-color: white;
	}
 
img.logo	{ float: left; margin: 0 5px 5px 0;}

/* table		{ margin:0 auto 10px auto; border: solid 1px gray;} */

.form_box		{
	margin-bottom: 5px;
	background-color: #eee;
	border-left: solid 1px gray;
	border-right: solid 1px gray;
	border-bottom: solid 1px gray;
	width: auto;
	text-align: center;
	}

.form_title	{ 
	background-color: #ccc; 
	margin: 0; 
	padding: 5px 0; 
	border-bottom: solid 1px black;
	border-top: solid 1px black;
	text-align: center; 
	font-weight: bold; 
	color: #003366;
	}
	
.form_title_active	{ 
	background-color: #99ccff; 
	margin: 0; 
	padding: 5px 0; 
	border-bottom: solid 1px black;
	border-top: solid 1px black;
	text-align: center; 
	font-weight: bold; 
	color: #003366;
	}
	
/*------ form as table -----*/
	
	.form_table { border:0; margin: 10px 5px; width: auto; }
	.form_table td { font-size: 10px;}
	.form_table td.field { text-align: right; width: 120px;}
	.form_table td.field_needed { text-align: right; width: 120px; color: #990000;}
	.form_table td.field_text { text-align: right; vertical-align: top; width: 100px; color: #990000;}

	form > input, div > input { margin-bottom:10px;}
	input.fillit { border: solid 1px gray; padding: 3px; background-color: white;}
	input.fillit:focus { background-color: #99ccff; }
	
/*------ text/link style definition -----*/

a			{ color: #006486; font-weight: bold; text-decoration: underline; }
a:visited	{ color: #006486; }
a:active	{ color: #006486; }
a:hover		{ color: #003366; }

h2 a{
	font-weight: bold;
	font-size: 12px;
	text-decoration: none;
}

a.mailto {text-decoration:none; font-weight:normal;}

#notes p a	{ font-size: 10px;}
#leftnav p a	{ font-size: 9px;}
#footer a	{ font-size: 10px;}
	

#login	a:link		{ color: #ffffff; text-decoration: none; }
#login	a:visited	{ color: #ffffff; text-decoration: none;}
#login	a:hover		{ color: #ffffff; text-decoration: underline; }
#login	a:active	{ color: #ffffff;	text-decoration: none;}



p, ul, li, ol	{ line-height: 150%;}

ul, ol	{ margin: 0 5px 5px 25px; padding: 0 10px; }
li	{ margin: 7px 0; padding: 0; }

#main p	{ text-align: justify; margin: 0 5px 10px 5px; }
#leftnav p	{ text-align: left; margin: 0 0 10px 0; font-size: 9px;}
#notes p	{ text-align: left; margin: 0 0 10px 0; font-size: 10px;}

.warning {	color:red; font-weight: bold; }

.contact	{ color: #666666; font-weight: normal; font-size: 9px; }
	
/*------ H1 to H6 definition -----*/

h1{
	background: #eeeeee;
	font-size: 12px;
	font-weight: bold;
	line-height: 200%;
	text-align: center;
	color: #003366;
}

h2{
	margin: 0 0 10px 0;
	padding: 5px 0 5px 0;
	text-align: left;
	color: #003366;;
	border-bottom: dashed black 1px;
	font-weight: bold;
	font-size: 12px;
}

h3{
	margin: 0 0 10px 0;
	text-align: left;
	color: #666666;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
}

#notes h3{
	font-size: 10px;
}

h4{
	line-height: 200%;
	text-align: left;
	color: #666666;;
	font-size: 11px;
	font-style: italic;
	font-weight: normal;
}

h5{
	line-height: 200%;
	text-align: center;
	color: #666666;;
	font-size: 10px;
	font-style: normal;
	font-weight: normal;
}


/*------ CSS for info -----*/


	.name {font: x-small Verdana, Arial, Helvetica, sans-serif; color: #227;  font-weight: bold; text-align: left;
		position: relative;}
	
	.info {font: x-small Verdana, Arial, Helvetica, sans-serif; color: #227;  
		text-align: left; vertical-align: middle; 
		background: url(img/info_ballon.gif); padding : 20px; padding-top: 25px;  
		position: absolute; left : -220px; top : 5px; width : 222px; height: 130px; 
		display:none; z-index: 100;}
						
	.name:hover div {display:block;}


/* ------ CSS for the navigation menu -----*/
		
		div#nav {position: absolute; top : 122px; left : 22px; z-index: 100; width: 750px; height: 20px; }
		div#nav ul {margin : 0px; padding: 0; }
		
		div#nav li {position: relative; list-style: none; margin: 0;  float: left; width: 80px; line-height: 18px; text-align:center;  border-right: 1px solid black; }
		div#nav li a {display: block; padding: 0; text-decoration: none; width: 80px; text-align:center; font-size: 10px; }
		div#nav>ul a {width: auto;}
		
		div#nav ul ul {position: absolute; width: 80px; background: #FFB; display: none;}
		div#nav ul ul li {border-bottom: 1px solid gray; height: 20px;}
		
		div#nav ul.menu li:hover ul.submenu {display:block;}
		
		#nav		a		{height: 20px; }
		#nav		a:link		{ color: #333333; text-decoration: none; }
		#nav		a:visited 	{ color: #666666; text-decoration: none;}
		#nav		a:hover	{ background-color: #99ccff; color: #003366; }
		#nav		a.active	{ color: #003366; text-decoration: none; }
		
	/* CSS for the submenu */
		
		
		div#submenu		{width: 150px; }
		div#submenu ul 		{margin : 0px; padding: 0; }
		div#submenu li		{position: relative; list-style: none; margin: 0; width: 140px; line-height: 18px; text-align:center;  border: 1px solid gray; background: #FFB; }
		
		
		#submenu a{
			display: block;
			line-height: 22px;
			
			text-align: center;
			font-size: 11px;
			color: #666666;
			text-decoration: none;
		}

		#submenu a:visited{ color: #666666; }
		#submenu a:hover	{ background-color: #99ccff; color: #003366;}
		#submenu a.active	{ background-color: #99ccff; color: #003366;}