/******************/
/* GLOBAL LAYOUT  */
/******************/

html {
	background-color: #a8c3eb;
}

body {
	font-size: 62.5%;          /*Font-size: 1.0em = 10px when browser default size is 16px*/
	font-family: arial, helvetica, sans-serif;
	text-align: center;
}

a {
	color: #fff;
	text-decoration: none;
}

a:hover, a:active {
	text-decoration: underline;
}

hr {
	color: #fff;
	background-color: #fff;
	height: 1px;
	border: none;
}

p {
	margin: 0.7em 0em;
	font-size: 1.2em;
	line-height: 1.2em;
}

#container {
	margin: 0px auto;
	width: 776px;
	font-size: 1em;
	text-align: left;
	background: transparent url(img/fond_container.png) repeat-y top left;
}

/********************/
/*     HEADER       */
/********************/

#header {
	font-size:1.0em;
}

#banniere h1 {
	background: transparent url(img/banniere.png) no-repeat top left;
	width: 776px;
	height: 229px;
	color: #fff;
	font-size: 1.2em;
}

#header h1 span {
	display: none;
}

#translate {
	margin: 0px 0px 0px 28px;
}

/********************/
/*  NAVIGATION BAR  */
/********************/

.navbar {margin-left: 9px; white-space:nowrap /*IE hack*/; float: left; width:759px; background-color:rgb(71,110,163); font-size:120% !important /*Non-IE6*/; font-size:125% /*IE6*/;} /*Color navigation bar normal mode*/

/* MAIN MENU */
.navbar ul {list-style-type:none;}
.navbar ul li {float:left; z-index:auto !important /*Non-IE6*/; z-index:1000 /*IE6*/; background-color:rgb(71,110,163);}
.navbar ul li a {float:none !important /*Non-IE6*/; float:left /*IE-6*/; display:block; height:3.1em; line-height:3.1em; padding:0 16px 0 16px; text-decoration:none; font-weight:bold; color:rgb(255,255,255); border-right:solid 0px rgb(71,110,163);}
.navbar ul li ul {display:none; border:none;}

/* SUBMENU (Non-IE6 hovering) */
.navbar ul li:hover {position:relative;} /*Sylvain IE hack*/
.navbar ul li:hover a {background-color:rgb(168,195,235); text-decoration:none;} /*Color main cells hovering mode*/
.navbar ul li:hover ul {display:block; width:10.0em; position:absolute; z-index:1000; top:3.0em; margin-top:0.1em; left:0; padding:0px 16px 0px 16px; border-top:solid 1px rgb(71,110,163);}
.navbar ul li:hover ul li a {white-space:normal; display:block; width:10.0em; height:auto; line-height:1.3em; margin-left:-17px; padding:4px 16px 4px 16px; border-right:solid 1px rgb(71,110,163); border-left:solid 1px rgb(71,110,163); border-bottom: solid 1px rgb(71,110,163); background-color:rgb(71,110,163); font-weight:normal; color:rgb(50,50,50);} /*Color subcells normal mode*/
.navbar ul li:hover ul li a:hover {background-color:rgb(168,195,235); text-decoration:none;} /*Color subcells hovering mode*/

/* SUBMENU (IE6 hovering) */
.navbar table {position:absolute; z-index:1000; top:0px; left:-1px; border-collapse:collapse;}
.navbar ul li a:hover {position:relative /*Sylvain IE hack*/; z-index:1000 /*Sylvain IE hack*/; background-color:rgb(168,195,235); text-decoration:none;} /*Color main cells hovering mode*/
.navbar ul li a:hover ul {display:block; width:10.0em; position:absolute; z-index:1000; top:3.1em; t\op:3.0em; left:0px; marg\in-top:0.1em; border-top:solid 1px rgb(224,209,188); }
.navbar ul li a:hover ul li a {white-space:normal; display:block; w\idth:10.0em; height:1px; line-height:1.3em; padding:4px 16px 4px 16px; border-right:solid 1px rgb(224,209,188); border-left:solid 1px rgb(224,209,188); border-bottom: solid 1px rgb(224,209,188); background-color:rgb(242,235,225); font-weight:normal; color:rgb(50,50,50);} /*Color subcells normal mode*/
.navbar ul li a:hover ul li a:hover {background-color:rgb(168,195,235); text-decoration:none;} /*Color subcells hovering mode*/


#corps {
	font-size:1.0em;
	padding-top: 1em;
	width: 770px;
	clear: both;
}

#corps .rubrique {
	margin: 30px 20px 30px 28px;
	text-align: justify;
}

#form_contact {
	width: 500px;
	padding: 15px;
}

#form_contact label {
	float: left;
	width: 20%;
	text-align: right;
	padding: 0 0.5em 0 0;
}

#form_contact .legende {
	font-style: italic;
	color: #424242;
}


/************/
/*  FOOTER  */
/************/

#footer {
	clear: both;
	font-size:1.0em;
	text-align: center;
	height: 30px;
	background: transparent url(img/fond_footer.png) no-repeat top left;
}

/*************/
/*  CONTENT  */
/*************/

/* HEADING -- Rubrique */
#corps h2 {
	margin-left: 1em;
	color: #fff;
	width: 500px;
	height: 36px;
	background: transparent url(img/fond_titre.png) no-repeat top left;
	font-size: 2em;
}

#corps h2 span {
	display: block;
	margin-left: 45px;
	padding-top: 5px;
}

.rubrique h3, .rubrique h1 {	/* h1 : field header du content element */
	margin:1.0em 0 0 0;
	color: #fff;
	font-size: 1.7em;
	font-weight:bold;
}

.rubrique h4 {
	margin:1.0em 0 0 0;
	font-size: 1.4em;
	font-weight:bold;
}

/* LIST */
.rubrique ul {margin:1.4em 0 1.0em 0; padding:0em 20px 0em 20px; list-style:disc;}
.rubrique ul li {margin:0 0 0.3em 2px; padding:0 0 0 12px; background:url(./img/bg_bullet_square.gif) no-repeat 0 0.5em; line-height:1.3em; font-size:131% !important /*Non-IE6*/; font-size:115% /*IE6*/;}
.rubrique ol {margin:1.4em 0 1.0em 0; padding:0 20px 0 40px !important /*Non-IE6*/; padding:0 20px 0 50px /*IE6*/;}
.rubrique ol li {list-style-type:decimal; list-style-position:outside; margin:0 0 0.3em 3px; line-height:1.3em; font-size:131% !important /*Non-IE6*/; font-size:115% /*IE6*/;}
.rubrique ul.indent {padding:0 50px 0 50px;}
.rubrique ol.indent {padding:0 20px 0 70px !important /*Non-IE6*/; padding:0 20px 0 80px /*IE6*/;}

/******************/
/*  CLEAR FLOATS  */
/******************/
.rubrique:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
p:after {content:"."; display:block; height:0; /*clear:both Do not use here to avoid paragraphs clearing next to images;*/  visibility:hidden;}