/***************** 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:#FDF1B8 url(../images/charte/bg-top.jpg) top repeat-x;
}
#header {
width:990px;
height:192px;
}
#header2{
width:770px;
height:154px;
}

/***************** CONTAINER *****************/
#container{
position:relative;
min-height:100%;
width:990px;
margin:0 auto;
background:scroll #fff url(../images/charte/bg-contenu.jpg) center top repeat-y;
padding-bottom:50px;
}

/***************** MENU TOP *****************/
#menuTop{
position:relative;
z-index:10;
padding:0 0 0 205px;
width:785px;
height:28px;
background: url(../images/charte/bg-menu-top.jpg);
list-style:none;
}
#menuTop li{
position:relative;
float:left;
}
#menuTop a{
text-decoration:none;
font:bold 12px/30px Arial, Helvetica, sans-serif;
color:#fff;
text-align:center;
text-transform:uppercase;
display:block;
height:28px;
overflow:hidden;
}
#menuTop a span{
display:none;
}

#container #menuTop li a:hover,
#container #menuTop li a.trigered{
/*background:#ffc0a9;*/
background-position:bottom left;
}

.btn-top-01 {
background:url(../images/charte/btn-top-01.gif) no-repeat;
width:66px;}
.btn-top-02 {
background:url(../images/charte/btn-top-02.gif) no-repeat;
width:81px;}
.btn-top-03 {
background:url(../images/charte/btn-top-03.gif) no-repeat;
width:86px;}
.btn-top-04 {
background:url(../images/charte/btn-top-04.gif) no-repeat;
width:87px;}
.btn-top-05 {
background:url(../images/charte/btn-top-05.gif) no-repeat;
width:56px;}
.btn-top-06 {
background:url(../images/charte/btn-top-06.gif) no-repeat;
width:48px;}
.btn-top-07 {
background:url(../images/charte/btn-top-07.gif) no-repeat;
width:62px;}
.btn-top-08 {
background:url(../images/charte/btn-top-08.gif) no-repeat;
width:104px;}
.btn-top-09 {
background:url(../images/charte/btn-top-09.gif) no-repeat;
width:109px;}
/***************** COL LEFT *****************/
#colLeft{
float:left;
width:205px;
}
#colLeft form input.case, #colLeft form select.case{
font:normal 10px Arial, Helvetica, sans-serif;
color:#2D1F14;
width:127px;
height:14px;
padding:2px 3px;
margin:5px 38px;
border:none;
background: #fff url(../images/charte/bg-input.jpg);
float:left;
}
#colLeft form select.case{
width:144px;
height:17px;
margin:5px 32px;
padding:0;
}

/*** RECHERCHER ***/
#colLeft form{
position:relative;
width:205px;
height:93px;
background:url(../images/charte/bg-recherche.jpg);
padding-top: 30px;
}
#colLeft form#rechercher select.case{
float:left;
}
form#rechercher input.btn{
width:205px;
height:42px;
background: url(../images/charte/btn-rechercher.jpg);
margin:41px 0 0 0;
}

.search {
background: url(../images/charte/btn-rechercher.jpg) top left no-repeat;
height:42px;
width:205px;
float:left;
}
.search:hover {
background: url(../images/charte/btn-rechercher.jpg) bottom left no-repeat;
}



/***************** MENU LEFT *****************/
#menuLeft{
float:left;
width:205px;
height:166px;
padding:37px 0;
border:none;
background:url(../images/charte/bt-produit.jpg) no-repeat;
}
#menuLeft ul{
list-style:none;
padding:5px;
border:none;
}
#menuLeft a{
text-decoration:none;
font:bold 12px/25px Arial, Helvetica, sans-serif;
color:#fff;
display:block;
height:25px;
overflow:hidden;
border-bottom:#FDFFBD dashed 1px;
padding:0 0 0 25px;
}
#menuLeft a span{
display:none;
}

#menuLeft a:hover,
#menuTop a.trigered{
background-position:bottom left;
color:#990099;
}
#menuLeft ul li a{
font:11px/12px Arial, Helvetica, sans-serif;
height:13px;
border:none;
}
/***************** CONTENU *****************/
#contenu{
float:left;
width:745px;
padding:20px 0 0 15px;
}
/*---obligatoire pour le footer---*/
/*---mettre <div class="clearer" id="clearFooter"></div>--*/
/*---apres la div contenu---*/
.clearer{
clear:both;
}
#clearFooter{
height:30px;/*--- = à la hauteur du footer ---*/
}
/***************** FOOTER *****************/
#footer{
position:relative;
clear:both;
width:100%;
height:60px;
margin:-60px 0 0 0;
background: #fff url(../images/charte/bg-footer.jpg) top center;
}
#foot{
position:relative;
clear:both;
width:990px;
height:60px;
margin:0 auto;
background:url(../images/charte/bg-foot.jpg);
}

#idep{
position:absolute;
left:20px;
top:0;
width:195px;
height:30px;
}
#idep img{
float:left;
}
#footer #idep a.idep{
text-decoration:none;
display:block;
font:9px/8px Arial, Helvetica, sans-serif;
color:#fff;
margin:18px 0 0;
}
#footer #idep a.idep.optea{
margin:0;
}
#footer #idep a:hover.idep{
text-decoration:none;
color:#2D1F14;
}

#idep2{
position:absolute;
left:220px;
top:18px;
width:195px;
height:30px;
}
#footer #idep2 a.idep{
text-decoration:none;
display:block;
font:9px/8px Arial, Helvetica, sans-serif;
color:#fff;
}
#footer #idep2 a.idep:hover{
color:#000;
}
