/***************** BODY *****************/
*{
/*---on passe toutes les marges à 0---*/
margin:0;
padding:0;
}
body,html{
height:100%;
}
body{
background:#121212 url(../images/charte/bg-body.gif) left top repeat-x;
}
/***************** CONTAINER *****************/
#container{
position:relative;
min-height:100%;
width:990px;
margin:0 auto;
background:url(../images/charte/bg-container.png) center top repeat-y;
}
/***************** HEADER *****************/
#header{
width:990px;
height:195px;
}
/***************** MENU LEFT *****************/
#menuLeft{
float:left;
width:175px;
margin:51px 0 0 15px;
}
#menuLeft a{
text-decoration:none;
display:block;
height:30px;
overflow:hidden;
background:left top no-repeat;
}

#menuLeft a.bt1{background-image:url(../images/charte/bt-01.gif);}
#menuLeft a.bt2{background-image:url(../images/charte/bt-02.gif);}
#menuLeft a.bt3{background-image:url(../images/charte/bt-03.gif);}
#menuLeft a.bt4{background-image:url(../images/charte/bt-04.gif);}
#menuLeft a.bt5{background-image:url(../images/charte/bt-05.gif);}
#menuLeft a.bt6{background-image:url(../images/charte/bt-06.gif);}
#menuLeft a.bt7{background-image:url(../images/charte/bt-07.gif);}
#menuLeft a.bt8{background-image:url(../images/charte/bt-08.gif);}
#menuLeft a span{
display:none;
}
#menuLeft a:hover{
background-position:-190px top;
}
/***************** SOUS MENU */
#menuLeft ul{
list-style:none;
padding:5px 0 10px;
background:#000;
text-align: left;
}
#container #menuLeft li a{
background:none;
border:none;
text-decoration:none;
font:9px/18px Arial, Helvetica, sans-serif;
text-transform:uppercase;
color:#808080;
display:block;
height:18px;
overflow:hidden;
padding:0 20px 0 30px;
text-align: left;
}
#container #menuLeft li a:hover{
color:#f8d25e;
}
/***************** CONTENU *****************/
#contenu{
float:left;
width:740px;
}
.invisible
{
  display: none;
}

.mention p
{
  font-size: 11px !important;
  font-weight: normal !important;
}
.mention
{
  font-size: 11px;
  font-weight: normal;
}
#contenu p{
  font-family: Verdana;
  font-size: 12px;
  color: #ffffff;
  line-height: 18px;
  text-align:justify;
  margin-bottom: 10px;
}
.bullet
{
  padding: 0px 10px 3px 15px;
}
.couleur
{
  font-size: 12px;
  font-family: Verdana;
  font-weight: bold;
  color: #989898;
}
#contenu h1
{
  font-family: Verdana;
  font-size: 14px;
  font-weight: bold;
  color: #f8d25e;
  background: url(../images/charte/h1-accueil.jpg) no-repeat bottom left;
  height: 27px;
  padding-top: 8px;
  margin-top: 20px;
  margin-bottom: 20px;

}
#contenu h2
{
  font-family: Verdana;
  font-size: 12px;
  font-weight: bold;
  color: #ffffff;

}
#contenu h3
{
  background:url(../images/charte/bg-h3.jpg) no-repeat top left;
  font-family: Verdana;
  font-size: 12px;
  font-weight: bold;
  color: #ffffff;
  padding-top: 5px;
  padding-left:35px;
  width:300px;
  height: 19px;
}
#contactez
{
  background: url(../images/charte/bg-contactez.jpg) no-repeat top left;
  width: 153px;
  height: 27px;
  margin-left: 50px;
  padding-top: 35px;
  padding-left: 460px;
}
#contactez2
{
  background: url(../images/charte/bg-contactez2.jpg) no-repeat top left;
  width: 173px;
  height: 62px;
  padding-top: 22px;
  padding-left: 243px;
  margin-left: 150px;
}
#contactez3
{
  background: url(../images/charte/bg-contactez3.jpg) no-repeat top left;
  width: 160px;
  height: 62px;
  padding-top: 24px;
  padding-left: 435px;
  margin-left: 55px;
}
.list-left
{
 width: 380px;
 float: left;

}
.list-left p
{
  text-align: left !important;
}
.list-right
{
 width: 320px;
 float: left;
 padding-left: 15px;
}
.list-left1
{
 width: 200px;
 float: left;
 padding-right: 15px;
 padding-left: 80px;
}
.list-left1 p
{
  text-align: left !important;
}
.list-right1
{
 width: 380px;
 float: left;
 padding-left: 15px;

}
/*---obligatoire pour le footer---*/
/*---mettre <div class="clearer" id="clearFooter"></div>--*/
/*---apres la div contenu---*/
.clearer{
clear:both;
}
#clearFooter{
height:60px;/*--- = à la hauteur du footer ---*/
}
/***************** FOOTER *****************/
#footer{
position:relative;
clear:both;
width:990px;
height:60px;
margin:-60px auto;
background:url(../images/charte/bg-footer.jpg) left top no-repeat;
}
#idep{
position:absolute;
left:30px;
top:15px;
width:165px;
height:25px;
}
#idep img{
float:left;
}
#footer #idep a.idep{
text-decoration:none;
display:block;
font:9px/8px Arial, Helvetica, sans-serif;
color:#3d3d3d;
margin:2px 0 0;
}
#footer #idep a.idep.optea{
margin:0;
}
#footer #idep a:hover.idep{
text-decoration:none;
color:#fff;
}
/*===============| contact |===========================================*/
.left-box
{
  width: 216px;
  border: solid 1px #818181;
  background-color:#000000;
  float: left;
  line-height: 10px !important;
}
.left-box p
{
 font-family: Veranada;
 font-size: 12px !important;
 padding-left: 15px;
 padding-top: 10px;
 text-align: left;
}
.left-box  #coordonnees
{
  text-align: left;
  font-size: 11px !important;
  font-family: Verdana;
  float: left;
  background-color:#000000;
  padding: 0;
}

.left-box  #horaires
{
  text-align: left;
  font-size: 11px !important;
  font-family: Verdana;
  float: left;
  background-color:#000000;
  padding: 0;
  margin-top: 10px;
  margin-bottom: 0px;
}
#left1
{
 float: left;
 width: 233px;
 padding-top: 10px;
}
.telephone
{
  text-align: left;
  font-size: 11px !important;
  font-family: Verdana;
  float: left;
  background-color:#000000;
  padding: 0;
}
#frmContact
{
	font-family:Verdana;
	font-size:11px;
	width:500px;
  text-align: left;
}
#frmContact .left
{
 width:235px;
 float:left;
 display:inline;
 margin-left:0px;
 margin-bottom:10px;
  }

#frmContact .right
 {
    width:240px;
    float:left;
    display:inline;
    margin-top:0px;
 }
#frmContact .right p
 {
  color:#ffffff !important;
  font-family:Verdana;
  font-size: 12px;
  font-weight: normal;
  padding:0px;
  margin: 5px 0;
 }
#commentaire
 {
   width:230px;
 }
#contact
 {
  width:100%;
  float:left;
}
.inputForm{
	border:1px solid #818181;
	background-color:#000000;
	width:140px;
	font-family:Verdana;
	font-size:12px !important;
	color:#bdbcb9;
  padding:1px;
  height:14px;
  margin:3px 0;
}
.inputFormOver{
	border:1px solid #9c8652 !important;
	background-color:#434343;
	width:140px;
	font-family:Verdana;
	font-size:12px;
	color:#ffffff;
  margin:3px 0;
  padding:1px;
  height:14px;
}
.label
{
  width:85px;
  padding-top:5px;
  float:left;
  color: #ffffff;
  font-size: 12px;
}
.label1
{
  width:110px;
  padding-top:5px;
  float:left;
  color: #ffffff;
  font-size: 12px;
}
.inputs
{
    width:150px;
    float:left;
}
.button{
  background: url(../images/charte/envoyer.jpg) no-repeat left top;
	width:98px;
 	cursor: pointer;
  height:39px;
  border: none;
}
.buttonOver{
	background: url(../images/charte/envoyer-over.jpg) no-repeat left top;
	width:98px;
	cursor: pointer;
  height:39px;
  border: none;
}
.button1{
  background: url(../images/charte/retablir.jpg) no-repeat left top;
	width:103px;
 	cursor: pointer;
  height:39px;
  border: none;
}
.button1Over{
	background: url(../images/charte/retablir-over.jpg) no-repeat left top;
	width:103px;
	cursor: pointer;
  height:39px;
  border: none;
}
.bottom
{
  float:left;
  width: 350px;
  padding: 15px 0 14px 150px;
}
#oblig
{
  float:left;
  text-align:right;
  width:480px;
  color:#ffffff;
  padding-top:6px;
  font-size:10px;
  border-top:solid 1px #818181;
  margin-top: 7px;
}
#right
{
 float: left;
 width: 350px;
}
/*===============| MERCI |===========================================*/
.merci
{
  color: #818181;
  font-weight: bold;
}

.merci a:link, a:visited
{
  text-align: center;
  font-size: 14px;
  font-family: Verdana;
  color: #818181;
  font-weight: bold;
}
.merci a:hover, a:active
{
  text-align: center;
  font-size: 14px;
  font-family: Verdana;
  color: #ffffff;
  font-weight: bold;
}