/***************** 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:#222222 url(../images/charte/bg-body.jpg) repeat-x;
}

#intro {
	position:absolute;
	height:426px;
	width:426px;
	left:50%;
	top:50%;
	margin-left:-213px;
	margin-top:-213px;
	font:normal 10px/30px Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	text-align:center;
}
#intro a:link, #intro a:visited{ 
	font:normal 10px/30px Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	text-decoration:none;
}
#intro a:hover, #intro a:active{ 
	text-decoration:underline;
}

#intrologo { 
	width:426px;
	height:369px;
}


/***************** CONTAINER *****************/
#container{
position:relative;
min-height:100%;
width:970px;
margin:0 auto;
}
/***************** HEADER *****************/
#header{
width:781px;
height:140px;
float:left;

}

#expomoment{
width:179px;
height:141px;
float:left;
padding-left:10px;
text-align:center;
background: url(../images/charte/bg-expomoment.jpg) no-repeat;
}

#expomoment h1{
font:bold 14px Arial, Helvetica, sans-serif;
color:#000;
letter-spacing:1px;
padding:5px 20px 5px 0;
text-align:center;
}

#expomoment p{
font:bold 10px Arial, Helvetica, sans-serif;
color:#FFF;
margin:5px 20px 5px 0;
text-align:center;
}

#expomoment a img{
border:1px solid #FFF;
margin:0px 20px 0px 0;
}
/***************** MENU TOP *****************/
#menuTop{
position:relative;
width:970px;
height:39px;
background: url(../images/charte/bg-menutop.jpg) no-repeat center top;
list-style:none;
float:left;

}
#menuTop li{
position:relative;
float:left;
width:84px;
height:39px;
}
#menuTop a{
text-decoration:none;
font:bold 12px/39px Arial, Helvetica, sans-serif;
color:#fff;
text-align:left;
text-transform:uppercase;
display:block;
height:39px;
overflow:hidden;
}

#menuTop a span{
display:none;
}

.galerie a {
background:url(../images/charte/btn-galerie.jpg) no-repeat;}
.galerie a.hover, .galerie a.trigered {
background:url(../images/charte/btn-galerie.jpg) 0 -39px no-repeat;}

.artistes a {
background:url(../images/charte/btn-artistes.jpg) no-repeat;}
.artistes a.hover, .artistes a.trigered {
background:url(../images/charte/btn-artistes.jpg) 0 -39px no-repeat;}

.expositions a {
background:url(../images/charte/btn-expositions.jpg) no-repeat;}
.expositions a.hover, .expositions a.trigered{
background: url(../images/charte/btn-expositions.jpg) 0 -39px no-repeat;}

.presse a {
background:url(../images/charte/btn-presse.jpg) no-repeat;}
.presse a.hover, .presse a.trigered {
background:url(../images/charte/btn-presse.jpg) 0 -39px no-repeat;}

.contact a {
background:url(../images/charte/btn-contact.jpg)  no-repeat;}
.contact a.hover, .contact a.trigered {
background:url(../images/charte/btn-contact.jpg) no-repeat;}

.expo a {
background: url(../images/charte/btn-expomoment.gif) no-repeat;}
.expo a.hover, .expo a.trigered {
background:url(../images/charte/btn-expomoment.gif) no-repeat;}


.galery a {
background:url(../images/charte/btn-galery.jpg) no-repeat;}
.galery a.hover, .galery a.trigered {
background:url(../images/charte/btn-galery.jpg) 0 -39px no-repeat;}

.artists a {
background:url(../images/charte/btn-artists.jpg) no-repeat;}
.artists a.hover, .artists a.trigered {
background:url(../images/charte/btn-artists.jpg) 0 -39px no-repeat;}

.press a {
background:url(../images/charte/btn-press.jpg) no-repeat;}
.press a.hover, .press a.trigered {
background:url(../images/charte/btn-press.jpg) 0 -39px no-repeat;}

.expo-en a {
background: url(../images/charte/btn-exhibition.gif) no-repeat;}
.expo-en a.hover, .expo a.trigered {
background:url(../images/charte/btn-exhibition.gif) no-repeat;}
/***************** SOUS MENU *****************/
#menuTop li ul{
list-style:none;
position:absolute;
width:88px;
top:-6000px;
left:0;
background:#cb181b;
margin-top:9px;
}
#menuTop li li{
float:none;
height:20px;
}
#container #menuTop li li a{
background:none;
width:auto;
position:relative;
height:20px;
font:10px/20px Arial, Helvetica, sans-serif;
text-transform:none;
color:#fff;
text-decoration:none;
}
#container #menuTop li li a:hover{
text-decoration:underline;
}
/***************** CONTENU *****************/
#contenu{
width:360px;
padding:20px 0 0 20px;
float:left;
}

#contenudrte{
width:550px;
padding:20px 0 0 30px;
float:right;
}
#contenudrte1{
width:450px;
padding:20px 0 0 30px;
float:right;
}
/*---obligatoire pour le footer---*/
/*---mettre <div class="clearer" id="clearFooter"></div>--*/
/*---apres la div contenu---*/
.clearer{
clear:both;
}
#clearFooter{
height:39px;/*--- = à la hauteur du footer ---*/
}
/***************** FOOTER *****************/
#footer{
position:relative;
clear:both;
width:100%;
height:39px;
margin:-39px 0 0 0;
background: url(../images/charte/bg-footer.jpg) repeat-x;
color:#FFFFFF;
font-size:10px;
}

#footer #foot{
position:relative;
clear:both;
width:970px;
color:#FFFFFF;
}

#idep{
position:absolute;
right:0;
top:0;
width:110px;
height:29px;
padding-top:10px;
}
#idep img{
float:left;
}
#footer #idep a.idep{
text-decoration:none;
font:9px/20px Arial, Helvetica, sans-serif;
color:#FFF;
}
#footer #idep a.idep.optea{
margin:0;
}
#footer #idep a:hover.idep{
text-decoration:underline;
color:#fff;
}

/**************** CONTACT  *******************/
#contenu .table-contact{
  display:block;
  width:400px;
}

#contenu .table-contact-left{
   width:200px;
   float:left;
   display:block;
   height:110px;
   margin-left: 5px;
   margin-top:10px;
   margin-right: 10px;
}

#contenu .table-contact-right{
  width:180px;
  float:left;
  display:block;
  height:110px;
  margin-top:10px;
}

.button-contact{
	border:1px solid #999999;
	background-color: #A9070A;
	width:65px;
	font-size: 12px;
	cursor:pointer;
  color:#FFF;
  font-weight:bold;
}
.buttonOver-contact{
	border:1px solid #999999;
	background-color: #222222;
  color:#FFF;
	width:65px;
	font-size: 12px;
	cursor:pointer;
  font-weight:bold;
}
#contenu .input-contact{
  width:100px;
  height: 16px;
  float: left;
}

#contenu .table-contact-buttons{
  width:150px;
  float:left;
  padding:0px 0px 0px 160px;
  height: 10px;
}

#contenu #frmContact1{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	width:350px;
	height: auto;
}
#contenu .contact-message{
   float:left;
   display:inline;
   margin-left:45px;
   height: 124px;
}
#contenu .input1{
  width:70px;float:left;display:inline;color:#FFF;
}

#contenu .input2 input{
  width:100px; float:left;
  color:#333333;
}

#contenu .input22{
  width:120px; float:left;
  color:#8D1717;background-color:#F78F33;width:123px;height:20px;
}

#contenu .input3{
  width:75px; float:left;display:inline;color:#FFF;padding-top:2px;
}

#contenu .message{
  width:300px;float:left;padding-left:4px;display:inline;color:#FFF;
}


#contenu .input4 input{
  width:100px; float:left;
  color: #333333;
}
#contenu .inputForm{
	border:1px solid #999999;
	background-color:#FFFFFF;
	width:120px;
	font-family:verdana;
	font-size:11px;
	color: black;
  height:16px;
	margin-top:2px;
}
#contenu .inputFormOver{
	border:1px solid #FFFFFF;
	background-color:#DCDBDB;
	width:120px;
	color: black;
	height:16px;
	margin-top:2px;
}

/**************************/
/*********************************/
#contenu .table-contact-eng{
  display:block;
  width:400px;
}

#contenu .table-contact-left-eng{
   width:200px;
   float:left;
   display:block;
   height:110px;
   margin-left: 5px;
   margin-top:10px;
   margin-right: 10px;
}

#contenu .table-contact-right-eng{
  width:180px;
  float:left;
  display:block;
  height:110px;
  margin-top:10px;
}
#contenu .input1-eng{
  width:100px;float:left;display:inline;color:#FFF;
}

#contenu .input2-eng input{
  width:98px; float:left;
  color:#333333;
}

#contenu .input22-eng{
  width:120px; float:left;
  color:#8D1717;background-color:#F78F33;width:123px;height:20px;
}

#contenu .input3-eng{
  width:75px; float:left;display:inline;color:#FFF;padding-top:2px;
}
#contenu .input4-eng input{
  width:98px; float:left;
  color: #333333;
}
/*********************************/

.box{
  background:url(../images/contact/box.gif) no-repeat ;
  height: 177px;
  width: 411px;
}
.box p{
  color:#FFF;
  font-size: 11px;
  font-family: arial;
}

.box1{
  background:url(../images/contact/box1.gif) no-repeat ;
  height: 169px;
  width: 177px;
  padding-left: 6px;
}
.box1 p{
  font-size: 11px;
  font-family: arial;
  color: #FFF;
}

#contenu .list-01{
  list-style-type: none;
  background-color: transparent;
}

.list-01 li{
list-style-type: none;
font-size: 11px;
font-family:Arial, Helvetica, sans-serif;
/*background-color: white;*/
line-height:15px;
background:url(../images/contact/bullet.jpg) no-repeat 0px 2px;
padding-left: 20px;
font-weight: bold;
color: #999999;
margin-left: 10px;
}

.invisible{
	display:none;
}
.separateur{
  background:url(../images/separateur.jpg) no-repeat ;
}

.bullet{
  background:url(../images/bullet.jpg) no-repeat 0px 2px;
  height: 11px;
  padding-left:20px;
}