/***************** BODY *****************/
*{
/*---on passe toutes les marges à 0---*/
margin:0;
padding:0;
}
body,html{
height:100%;
/*---permet de changer la couleur de la barre de scroll dans IE (déconseillé)
scrollbar-base-color:#7d8a2e;
---*/
}
body{
background:#fff;
}
/***************** CONTAINER *****************/
#container{
position:relative;
min-height:100%;
width:960px;
margin:0 auto;
background:#fff url(../images/charte/bg-container.gif) top center repeat-y;
}
/***************** TOP *****************/
#top{
width:960px;
height:184px;

}
/***************** HEADER *****************/
#header{
width:738px;
height:84px;
float:left;
}
/***************** CLIENT *****************/
#client{
width:222px;
height:84px;
float:right;
background:url(../images/charte/bg-client.jpg) right top no-repeat;
}
/*#client a span{
display:none;
}
#client a:hover {
background-position: bottom left;
}
#client .compte{
width:107px;
height:20px;
background:url(../images/charte/btn-cpte.gif) top left no-repeat;
float:left;
margin-top:18px;
}
#client .panier{
width:115px;
height:20px;
background:url(../images/charte/btn-panier.gif) top left no-repeat;
float:right;
margin-top:18px;
}
#client form{
width:152px;
height:18px;
float:right;
background: url(../images/charte/search.jpg) no-repeat;
margin:10px 10px 0 0;
}
#client input{
width:129px;
height:18px;
border:none;
float:left;
font:10px Arial, Helvetica, sans-serif;
color: #000000;
padding:2px 0 0 3px;
background:none;
}*/
/***************** BANDEAU *****************/
#bandeau{
width:960px;
height:110px;
float:left;
}
/***************** MENU TOP *****************/
#menuTop{
position:relative;
z-index:10;
width:960px;
height:31px;
list-style:none;
float:left;
background: url(../images/charte/bg-menu.jpg) top center no-repeat;
}
#menuTop li{
position:relative;
float:left;
display:block;
}
#menuTop a{
text-decoration:none;
font:bold 12px/30px Arial, Helvetica, sans-serif;
color:#fff;
text-align:center;
text-transform:uppercase;
display:block;
height:31px;
overflow:hidden;
}
#menuTop li span{
display:none;
}
#container #menuTop li a:hover,
#container #menuTop li a.trigered{
background-position:bottom left;
}
#menuTop li.btn_01 a{
background:url(../images/charte/btn_01.gif) top left;
width:69px; margin-left:44px;}
#menuTop li.btn_02 a {
background:url(../images/charte/btn_02.gif) top left;
width:151px;}
#menuTop li.btn_03 a{
background:url(../images/charte/btn_03.gif) top left;
width:85px;}
#menuTop li.btn_04 a{
background:url(../images/charte/btn_04.gif) top left;
width:53px;}
#menuTop li.btn_05 a{
background:url(../images/charte/btn_05.gif) top left;
width:75px;}
#menuTop li.btn_06 a{
background:url(../images/charte/btn_06.gif) top left;
width:145px;}
#menuTop li.btn_07 a{
background:url(../images/charte/btn_07.gif) top left;
width:78px;}
#menuTop li.btn_08 a{
background:url(../images/charte/btn_08.gif) top left;
width:120px;}
#menuTop li.btn_09 a{
background:url(../images/charte/btn_09.gif) top left;
width:100px;}
#menuTop li.btn_10 a{
background:url(../images/charte/btn_10.gif) top left;
width:54px;}

#menuTop li.btn_02 ul{
width:163px;
}
#menuTop li.btn_04 ul{
width:88px;
}

/***************** SOUS MENU *****************/
#menuTop li ul{
list-style:none;
position:absolute;
top:-6000px;
left:0;
background:#144f77;
border:solid #fff;
border-width:1px 0 0 0;
}
#menuTop li li{
float:none;
}
#container #menuTop li li a{
background:none;
position:relative;
height:20px;
font:9px/20px Arial, Helvetica, sans-serif;
text-transform:none;
color:#fff;
text-decoration:none;
border:solid #fff;
border-width:0 0 1px 0;
}
#container #menuTop li li a:hover{
background:#43b6ff;
color:#144f77;
}
/***************** CONTENU *****************/
#contenu{
width:960px;
float:left;
background:url(../images/charte/bg-contenu.jpg) top center no-repeat; 
}
#presentation{
width:546px;
float:left;
margin:15px auto 0 auto;
}
/*---obligatoire pour le footer---*/
/*---mettre <div class="clearer" id="clearFooter"></div>--*/
/*---apres la div contenu---*/
.clearer{
clear:both;
}
#clearFooter{
height:54px;/*--- = à la hauteur du footer ---*/
}
/***************** FOOTER *****************/
#footer{
	position:relative;
	clear:both;
	width:960px;
	height:80px;
	margin:-80px auto;
	background-color: #0000FF;
	background-image: url(../images/charte/bg-footer.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
#idep{
position:absolute;
left:0;
bottom:0;
width:195px;
height:54px;
}
#idep img{
float:left;
}
#footer #idep a.idep{
text-decoration:none;
display:block;
font:9px/8px Arial, Helvetica, sans-serif;
color:#fff;
margin:31px 0 0;
}
#footer #idep a.idep.optea{
margin:0;
}
#footer #idep a:hover.idep{
text-decoration:none;
color: #CCCCCC;
}

#news{
  position:relative;
  margin: -38px auto 0 auto;
 /* border: 1px solid black;*/
  width:247px;
  /*height:25px;*/
}


/*#id{
	clear:both;
    margin: 165px auto 0 auto;
	padding-left:10px;
	height:40px;
    border: 1px solid green;
}*/
 #champ{
    /*margin: 165px auto 0 auto;*/
   /* width:150px;
	height:20px;*/
   /*	float:left;*/
   /* border: 1px solid yellow;  */
    /*vertical-align: middle;*/
	/*background-image: url(../images/charte/champ.jpg);
	background-repeat:no-repeat;*/
}

.lechamp{
   /*	background:none;*/
   /*width:146px;
	padding-left:2px;*/
  /* border:1px solid red;  */
   margin:2px 0 0 0;
   padding:0;
   float:left;
   vertical-align: middle;
}