/***************** BODY *****************/
*{
/*---on passe toutes les marges à 0---*/
margin:0;
padding:0;
}
body,html{
height:100%;
overflow: hidden;
/*---permet de changer la couleur de la barre de scroll dans IE (déconseillé)
scrollbar-base-color:#7d8a2e;
---*/
}
body{
background:#888888;

}
/***************** CONTAINER *****************/
#intro{
position:absolute;
width:625px;
height:569px;
left:50%;
top:50%;
margin-left:-313px;
margin-top:-285px;
background:#CCCCCC;
}


/***************** CONTAINER *****************/
#container{
position:absolute;
width:950px;
height:569px;
left:50%;
top:50%;
margin-left:-475px;
margin-top:-285px;

}
/***************** HEADER *****************/
#header{
width:950px;
height:150px;
}
/***************** MENU TOP *****************/
#menuTop{
position:relative;
z-index:10;
width:950px;
height:35px;
list-style:none;
float:left;
}
#menuTop li{
position:relative;
float:left;
}
#menuTop a{
text-decoration:none;
font:bold 12px/35px Arial, Helvetica, sans-serif;
color:#fff;
text-align:center;
text-transform:uppercase;
display:block;
height:35px;
overflow:hidden;
}
#menuTop a span{
display:none;
}
#container #menuTop a:hover,
#container #menuTop a.trigered{
}

.accueil {
background:url(../images/charte/btn-accueil.jpg) no-repeat;}
.accueil:hover {
background:url(../images/charte/btn-accueil.jpg) 0 -35px no-repeat;}

.accueil-selected {
background:url(../images/charte/btn-accueil.jpg) 0 -35px no-repeat; cursor: default;}

.qui {
background:url(../images/charte/btn-qui.jpg) no-repeat;}
.qui:hover {
background:url(../images/charte/btn-qui.jpg) 0 -35px no-repeat;}

.qui-selected {
background:url(../images/charte/btn-qui.jpg) 0 -35px no-repeat; cursor: default;}


.projets {
background:url(../images/charte/btn-projets.jpg) no-repeat;}
.projets:hover {
background:url(../images/charte/btn-projets.jpg) 0 -35px no-repeat;}

.projets-selected{
background:url(../images/charte/btn-projets.jpg) 0 -35px no-repeat; cursor: default;}


.presse {
background:url(../images/charte/btn-presse.jpg) no-repeat;}
.presse:hover {
background:url(../images/charte/btn-presse.jpg) 0 -35px no-repeat;}
.presse-selected {
background:url(../images/charte/btn-presse.jpg) 0 -35px no-repeat; cursor: default;}

.contact {
background:url(../images/charte/btn-contact.jpg) no-repeat;}
.contact:hover {
background: url(../images/charte/btn-contact.jpg) 0 -35px no-repeat;}

.contact-selected {
background: url(../images/charte/btn-contact.jpg) 0 -35px no-repeat; cursor: default;}

/***************** CONTENUGCHE *****************/
#contenugche{
width:240px;
height:495px;
padding:5px 5px 0 5px;
margin:0;
float:left;
background-color: #CBCBCB;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
line-height: 18px;
color:#777777;
}





#mini{
float: left;
width: 375px;
height: 504px;
background-image: url(../images/charte/bg-contenu.jpg);
background-position: top left;
background-repeat: no-repeat;
}



/***************** CONTENU *****************/
#contenu{
width:700px;
height:500px;
padding:0px;
float:left;
overflow: auto;
background-image: url(../images/charte/bg-contenu.jpg);
background-position: top left;
background-repeat: no-repeat;

}



#intro{
width:700px;
height:500px;
float:left;
}
/***************** FOOTER *****************/
#footer{
width:950px;
height:34px;
background:#888888;
border: 0px solid red;
clear: left;
}
#idep{
width:950px;
height:34px;
}
#idep img{
float:left;
}
#footer #idep a.idep{
text-decoration:none;
font-family:Arial, Helvetica, sans-serif;
font-size: 10px;
line-height: 18px;
color:#CCCCCC;
margin:0px 0 0;
}
#footer #idep a.idep.optea{
margin:0;
}
#footer #idep a:hover.idep{
text-decoration:none;
color:#FFF;
}
/***************** DIAPO INTRO *****************/
#diapo {
width:585px;
height:415px;
padding:50px 20px;
overflow:auto;
float:left;
}