body,html {
	background-color: #FFFFFF;
	background-image: url('/images/bg.gif');
	margin:0;
	padding:0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color:#000000;
}

body p {
	text-align: center;
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

form {margin:0;padding:0;}
p {padding:0;margin-bottom:10px;}

#wrapper {
	margin:auto;
	width:774px;
	background-color:#FFFFFF;
}
#header {
	background-repeat: no-repeat;
	height:62px;
	background-image:url('/images/topBg.jpg');
	background-repeat: repeat-x
}
	#header_bg {
		background-repeat: no-repeat;
		height:62px;
	}
	#header_flags {
		float:left;
		position:relative;
		top:33px;
		left:80px;
	}
	#header_r {
		padding-right:10px;
		padding-top:2px;
		float:right;
	}
		#header_r_text {text-align:right;}
		#header_r_nav ul {text-align:right;width:400px;list-style-type: none;padding: 0;margin: 0;margin-top:14px;}
		#header_r_nav li {
			background-image: url('/images/separateur.jpg');
			background-repeat: no-repeat;
			background-position: 0 2px;
			padding-left: 16px;
			padding-bottom: 5px;
			margin-right:10px;
			display:inline;
		}
		#header_r_nav li.first {background-image:none;padding:0;}

#banner {
	height:169px;
	width:772px;
	margin:auto;
}

#menu {
	width:772px;margin:auto;
	background-image: url('/images/menubg.jpg');
	background-repeat: repeat-x;
	height:63px;
}
	#menu_bg {
		background-image: url('/images/menu2bg.jpg');
		background-repeat: repeat-x;
		background-position:bottom;
		height:63px;
		text-align:center;
	}
	#menu ul {margin:0;padding-top:10px;}
	#menu li {
		background-image: url('/images/separateur.jpg');
		background-repeat: no-repeat;
		background-position: 0 2px;
		display:inline;
		padding-left:11px;
		padding-right:6px;
		list-style-type:none;
	}
	#menu li.first {background-image:none;}
	#menu div.position {display:none;margin-top:18px;}
	#menu ul.lvl2 {
		display:inline;
		background-repeat:no-repeat;
		/*background-color:#FFCCFF;*/
	}
#main {
	margin-top:23px;
	background-image:url('/images/pixel.gif');
	background-repeat:repeat-y;
	background-position:246px;
}
	#main_nav {
		float:left;
		width:246px;
	}
		#main_nav_wrapper {
			padding-left:20px;
			padding-right:15px;
		}
		#main_nav ul {
			padding:0;margin:0;
			list-style-type:none;
			margin-bottom:15px;
		}
		#main_nav li {
			margin-top:4px;
		}
		#main_nav a.nav,#main_nav li.nav {
			display: block;
			color: #2D5471;
			background-color: #FFFFFF;
			width:180px;
			text-align:right;

			border-right-style:solid;
			border-right-width:7px;
			border-bottom-style:solid;
			border-bottom-width:1px;

			text-transform:uppercase;
			font-family:Arial;
			font-size:11px;
			text-decoration:none;
			font-weight:bold;

			padding-right:24px;
			padding-top:6px;
			padding-bottom:6px;
		}
		#main_nav li.nav {
			background-color:#2D5471;
			color:#FFFFFF;
			border-width:0px;
			width:211px;
			padding-right:0;
			text-align:center;
		}
		#main_nav div.sousmenu {
			margin-bottom:10px;
		}
		#main_nav span.soustitre {
			color:#000000;
			text-transform:lowercase;
			font-size:10px;
		}
		.main_nav_box {margin-bottom:15px;}
		.main_nav_box h1 {
			padding:0;margin:0;background:none;
			margin-bottom:10px;
			padding:5px;
			text-align:center;
			background-color:#2D5471;
		}
		.main_nav_box input {
			color:#000000;
			font-size:10px;
			font-family:Verdana, Arial, Helvetica, sans-serif;
		}
		.main_nav_box input.submit {
				width:auto;
				margin-left:4px;
		}

		.main_nav_box div {
		 	clear:both;
			display:block;
			padding-bottom:10px;
			text-align:left;
			color:#999999;
			font-size:10px;
		}
		.main_nav_box a.news {
			font-size:11px;
			width:140px;
		}
		.main_nav_box .date {
			display:block;
		}
		.main_nav_box a.news:hover {
			text-decoration:underline;
		}

	#main_content {
		width:494px;
		float:left;
		padding-left:14px;
		position:relative;
		left:-2px;
		top:1px;
	}
	#toolbar {
		margin-top:30px;
		text-align:right;
	}

#footer_margin {clear:both;height:10px;}

#footer {
	width:772px;margin:auto;
	margin-top:10px;
	height:35px;
	background-image:url('/images/footerBg.jpg');
	background-repeat: repeat-x;
	text-align:center;
}
	#footer ul {
		padding:0;margin:0;list-style-type:none;padding-top:10px;
	}
	#footer li {
		background-image: url('/images/separateur_b.gif');
		background-repeat: no-repeat;
		background-position: 0 1px;
		padding-left: 20px;
		padding-bottom: 5px;
		margin-right:10px;
		display:inline
	}
	#footer li.first {background-image:none;}
	#loadtime {font-size:9px;}

#copyrights {
	padding-top:15px;
	padding-bottom:5px;
	text-align:center;
}

/* STYLES */
h1,h1 a {color:#000033;}
h2,h2 a {color:#000000;}

h1,h2 {

	padding:0;margin:0;

	background-image:url('/images/pixel.gif');
	background-repeat:repeat-x;
	background-position:bottom;

	padding-bottom:5px;
	padding-left:11px;

	margin-left:-10px;
	margin-bottom:14px;

	font-size: 13px;
	font-weight: bold;
	text-transform: uppercase;
}
h2 {
	margin-top:20px;
	font-size: 11px;
}

a {
	text-decoration:none;
}
img {border:0;}
#header,#header a {
	color:#4D4D4D;
}
#header_r_text {
	font-size:10px;
}
#header_r_text a {color:#2C83C5}
	#menu,#menu a,#menu .lvl2 a {}

	#menu .lvl1 a.over {
		color:#57A0D7;
	}
	#menu .lvl1 a {
		color:#000066;
		font-size:11px;

		cursor: default;
	}
	#menu a{
	color:#000000;
	}
	#menu .lvl2 a {
	color:#FFFFFF;
	}
	#menu .lvl2 a:hover {
		text-decoration:underline;
	}


#main_nav a:hover,#main_nav a.selected {
	border-right-color:#59A1DB;
}

#footer a {
	color:#FFFFFF;
	font-weight: bold;
	text-transform:uppercase;
}

#copyrights a {
	color:#F26522;
	font-weight:bold;
}
#copyrights a:hover {
	text-decoration:underline;
}

.pagination {
text-align:center;
width:100%;
}
.pagination span.total {
font-size:smaller;
color:#999999;
}

.invi {
color:#FEFEFE;
}

.underline {
	text-decoration: none;
	border-bottom: 1px dotted black;
	cursor: default;
}


/*Portail intégré*/
/*****************/

img.aide {
	position: absolute;
	left: 90%;
	z-index: 1;
}

/*Le fond d'abord*/
.portail { background: #EFEFEF; }
/*Par dessus lequel on dessine dans l'ordre les lignes*/
.t {background: url(/images/dot.gif) 0 0 repeat-x}
.b {background: url(/images/dot.gif) 0 100% repeat-x}
.l {background: url(/images/dot.gif) 0 0 repeat-y}
.r {background: url(/images/dot.gif) 100% 0 repeat-y}
/*Puis les coins*/
.bl {background: url(/images/bl.gif) 0 100% no-repeat}
.br {background: url(/images/br.gif) 100% 100% no-repeat}
.tl {background: url(/images/tl.gif) 0 0 no-repeat}
.tr {background: url(/images/tr.gif) 100% 0 no-repeat}

/*Deux états pour les panneaux*/
div.invisible {
	display: none;
}
div.visible {
	display: block;
}

/*Curseur sur les liens javascripts*/
div.portail a {
	cursor: pointer;
}

div.portail h3, div.badlogin h3 { padding: 6px; color: red; text-align: center; }

/*Tableaux dans les panneaux*/
div.portail table {
	border-collapse: collapse;
	margin: 4px auto 6px auto;
}
div.portail table th {
	text-align: left;
	background-color: #00FFFF;
	border: 1px dotted black;
}
div.portail table tr.grise {
	background-color: silver;
}

.wrap {
	width: 100%;
}

#disconnect {
	float: right;
}

/*Aide*/
/*infobulles, merci ShadowBlade sur siteduzero.com*/
a.help span {
   display: none; /* on masque l'infobulle */
}
a.help:hover {
   background: none; /* correction d'un bug IE */
   z-index: 500; /* on définit une valeur pour l'ordre d'affichage */
   cursor: help; /* on change le curseur par défaut en curseur d'aide */
}

a.help:hover span {
   display: inline; /* on affiche l'infobulle */
   position: absolute;
   background: white;
   margin-left: 5px;
   color: blue;
   padding: 3px;
   border: 1px solid blue;
   border-left: 4px solid blue;
}

/*Stepcarousel*/

.stepcarousel{
position: relative; /*leave this value alone*/
border: 2px solid teal;
margin-left: auto;
margin-right: auto;
overflow: scroll; /*leave this value alone*/
width: 450px; /*Width of Carousel Viewer itself*/
height: 400px; /*Height should enough to fit largest content's height*/
text-align: center;
}

.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin-left: 15px; /*margin around each panel*/
margin-right: 15px;
margin-top: 20px;
margin-bottom: auto;
width: 420px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}