/* général */
body {
/*font-family: Arial, Helvetica, "Nimbus Sans L", sans-serif;*/
font-family: Tahoma, Verdana, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
font-size: 0.7em;
margin: 0;
padding: 0;
line-height:1.3;
color:#666681;
}

/* layout, positionnement */
#conteneur {
	width:900px;
	margin:0 auto;
}
#header {
	background-color: #fff;
	height:124px;
}
/* tous les titres sont des images donc on insère tout de même un h1 mais qui sera invisible,
pour le référencement ... */
#header h1 {
	position:absolute; left:-9999px; top:0; z-index:0; margin:0;
}
#wrap {
	background:#fff url(IMG/colonnes-factices.gif) right repeat-y;
	height:100%;
	margin-bottom:5px;
	margin-top:5px;
}
#centre {
	margin-left: 180px;
	margin-right: 155px;
	padding-top:20px;
}
#gauche {
float:left;
width: 175px;
}
#droite {
float:right;
width: 150px;
}
#pied {
clear:both;
background: #fff url(IMG/degrade-menu.gif) left bottom repeat-x;
text-align:center;
font-weight:bold;
color:#69f;
padding:10px 10px 2px 10px;
margin:0 0 10px 0;
border-bottom:2px solid #6cf;
}
#pied strong {
color:#6cf;
}

#sous-pied {
	text-align:center;
	color:#000;
	text-transform:capitalize;
}

input {border:1px solid #ccc}
textarea {width:70%;border:1px solid #000}

/* sous menu gauche */
#sous_menu_gauche a {
	text-transform:capitalize;
	color:#1066b3;
}

/* menu bas */
#pied a {
	text-transform:capitalize;
	color:#69f;
	text-decoration:none;
}
#pied a:hover {
	text-transform:capitalize;
	color:#69f;
	text-decoration:underline;
}

/* blocs dans les colonnes */
.bloc {
	margin-top:5px;
	padding:15px 5px 5px 5px;
}
#gauche .bloc {
	clear:both;
	background-color:#eaf7ff;
	color:#1066b3;
}
#gauche .submit {
	border:1px solid #cdcbce;
	background-color:#73caff;
	color:#fff;
	font-size:110%;
	font-weight:bold;
	
}

/* polices */
p, h1, h2, h3 {
margin:0 0 10px 0;
}
h1 {
	font-size:200%;
}

#centre h1 {
/*	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;*/
	font-style:italic;
	letter-spacing:2px;
	color:#69f;
	margin-bottom:15px;
	text-transform:uppercase;
}
#droite h2 {
	font-size:110%;
}
#droite p {
	font-style:italic;
	color:#449;
}

/* divers */
a img {
	border:0;
}



/* MENU DE GAUCHE, COPYRIGHT CSSPLAY, modifié par vincent dawan */
/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/flyout_4level.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
.menu-gauche {
font-size:95%;
text-transform:capitalize;
}

/* remove all the bullets, borders and padding from the default list styling */
.menu-gauche ul {
position:relative;
z-index:500;
padding:0;
margin:0;
list-style-type:none;
width:175px;
}

/* style the list items */
.menu-gauche li {
background-color:#6cf;
/*height:31px;*/
border-bottom:1px solid #fff;
/* for IE7 */
float:left;
}

/* règle pour firefox, on enlève le flottement sinon le calcul du bloc échoue et on ne peut pas
ajouter de marges */
html>/**/body .menu-gauche li {
	float:none;
}

.menu-gauche li.sub {background:#6cf url(IMG/sub.gif) no-repeat right center;} 

/* get rid of the table */
.menu-gauche table {position:absolute; border-collapse:collapse; top:0; left:0; z-index:100; font-size:1em;}

/* style the links */
.menu-gauche a, .menu-gauche a:visited {
display:block;
width:160px;
padding:5px 10px 5px 5px;
line-height:18px;
color: #fff;
font-weight:bold;
text-decoration:none;
text-align:center;
}
/* hack for IE5.5 */
* html .menu-gauche a, * html .menu-gauche a:visited {width:160px; w\idth:159px;}
/* style the link hover */
/* survol normal */
* html .menu-gauche a:hover {border-color:#fff;color:#69f; background:#fff url(IMG/degrade-menu.gif) left bottom repeat-x; position:relative;}

.menu-gauche li:hover {position:relative;}

/* For accessibility of the top level menu when tabbing */
.menu-gauche a:active, .menu-gauche a:focus {border-color:#fff;color:#69f; background:#fff url(IMG/degrade-menu.gif) left bottom repeat-x;}

/* retain the hover colors for each sublevel IE7 and Firefox etc */
.menu-gauche li:hover > a {border-color:#fff;color:#69f; background:#fff url(IMG/degrade-menu.gif) left bottom repeat-x;}

/* sous menus */
li.sub li {
	background-color:#fc3;
	border-bottom:1px solid #f90;
}

.menu-gauche li.sub ul li a {
	color:#fff;
}
/* survol sous menu */
* html .menu-gauche li.sub li a:hover {border-color:#fff;color:#f90; background:#fff url(IMG/degrade-sous-menu.gif) left bottom repeat-x; position:relative;}

/* For accessibility of the top level menu when tabbing */
.menu-gauche li.sub li a:active, .menu-gauche .sub li a:focus {border-color:#fff;color:#f90;background:#fff url(IMG/degrade-sous-menu.gif) left bottom repeat-x;}

/* retain the hover colors for each sublevel IE7 and Firefox etc */
.menu-gauche li.sub li:hover > a {border-color:#fff;color:#f90; background:#fff url(IMG/degrade-sous-menu.gif) left bottom repeat-x;}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu-gauche li ul {
visibility:hidden;
position:absolute;
top:-30px;
/* set up the overlap (minus the overrun) */
left:145px;
/* set up the overrun area */
padding:30px;
/* this is for IE to make it interpret the overrrun padding */
background:transparent url(IMG/transparent.gif);
}

/* for browsers that understand this is all you need for the flyouts */
.menu-gauche li:hover > ul {visibility:visible;}

/* for IE5.5 and IE6 you need to style each level hover */

/* keep the third level+ hidden when you hover on first level link */
.menu-gauche ul a:hover ul ul{
visibility:hidden;
}
/* keep the fourth level+ hidden when you hover on second level link */
.menu-gauche ul a:hover ul a:hover ul ul{
visibility:hidden;
}
/* keep the fifth level hidden when you hover on third level link */
.menu-gauche ul a:hover ul a:hover ul a:hover ul ul{
visibility:hidden;
}

/* make the second level visible when hover on first level link */
.menu-gauche ul a:hover ul {
visibility:visible;
}
/* make the third level visible when you hover over second level link */
.menu-gauche ul a:hover ul a:hover ul{ 
visibility:visible;
}
/* make the fourth level visible when you hover over third level link */
.menu-gauche ul a:hover ul a:hover ul a:hover ul { 
visibility:visible;
}
/* make the fifth level visible when you hover over fourth level link */
.menu-gauche ul a:hover ul a:hover ul a:hover ul a:hover ul { 
visibility:visible;
}