/*===| I. MAIN LAYOUT  |=====================================================*/
* {margin: 0;}
html{height: 100%;width: 100%;}
ul, li{list-style: none;list-style-position: outside;	margin: 0;	padding: 0;}
p{padding: 0;}
.left{float: left;} .right{float: right;}
#push, .clr	{clear: both;}

body{width: 100%; background-color:  #340000;}
#bg1{position:absolute;z-index: 1; width:100%;}
#bg2{position:absolute;z-index: 2; width:100%; background: url(images/bg-body.jpg) 50% 0% repeat-x;}
#bg3{position:absolute;z-index: 3;}

#wrap-container{position:relative;z-index:4; width: 100%;}
#container{background:url(images/bg-container.jpg) repeat-x left top; margin:0 auto;	text-align: left;}
#content{}

/* ===| II. HEADER ELEMENTS |================================================*/
#site-header.outter{/*background:url("images/header.jpg") 50% 0 no-repeat;*/}
#site-header .inner{}

/* ===| III. LEFT COLUMN ELEMENTS |===========================================*/
#left-outter{float:left; margin: 0; overflow: hidden; background: url(images/bg-left-column.jpg) no-repeat left top;}
#left-outter div.outter{}
#left-outter div.inner{}
#menu-left{ width:265px; height:197px;}
#actualites{ width:230px; height:115px; padding:37px 18px 0px 18px;}
#actualites img{float:right; border:1px solid #C79900; margin:0px; padding:0px; margin-left:14px;}

/* ===| XII. COMPONENT NEWSLETTER |=====================================================*/
#newsletter{width:248px; height:33px; padding:32px 0px 0px 18px;}
#newsletter input{width:193px; padding-left:6px; height:16px;  margin-right:1px; float:left; border:none; background-color:#FFF1C3; font: normal 11px verdana; color:#3D0000;}

#newsletter a:link, #newsletter a:visited {text-decoration: none;}
#newsletter a:link input, #newsletter a:visited input {border:none; background: url(../../images/charte/button-newsletter.jpg); cursor: pointer; width: 29px; border:none; height:18px;}
#newsletter a:hover input {border:none; background: url(../../images/charte/button-newsletter-over.jpg); cursor: pointer; width: 29px; border:none;height:18px;}

#plan{
  width:116px;
  height:65px;
  padding-left:149px;
}
#horaires{
  width:230px;
  height:101px;
  padding:32px 18px 0px 18px;
}

/* ===| IV. RIGHT COLUMN ELEMENTS |===========================================*/
#right-outter{	float:left;	margin:0; padding:0; overflow: hidden;}
#right-inner{padding:0px;}
#title{width:635px; height:60px;}
.right-top{
  display:inline;
  width:634px; background: url(../../images/charte/bg-top.jpg) repeat-x left top;
  margin-left:1px;
  float:left;
}
.top{
  background: url(../../images/charte/top-top.jpg) no-repeat left top;
  width:634px;
}
.box{
  border-left: 1px solid #3F0000;
  border-right: 1px solid #3F0000;
  width:600px;
  padding:0px 16px;
  float:left;
}


/* ===| V. FOOTER BOXES |=====================================================*/
#wrap-footer {position:relative; z-index: 4; width: 100%; text-align: left;}
#fwrap1 {position:absolute; z-index: -3; left:0;}
#fwrap2 {position:absolute; z-index: -2; left:0;}
#fwrap3 {position:absolute; z-index: -1; left:0; }

#footer.outter	{margin: 0 auto; padding: 0px; border-top: 1px solid #8B0000;}
#footer .inner	{padding: 7px 0 0px 0px;}
#footer .box1	{padding:0px 0px 0px 18px; width:382px; float:left;}
#footer .box2	{width:500px; float:left; text-align:right; padding-top:10px; }
.ref{ clear:both; text-align:center; font:normal 11px Verdana; color:#FFEDB2; padding-bottom:10px;}

/* ===| VI. OTHER ELEMENTS |====================================================*/
img {border: 0;}
a:focus{
  outline: none;
}

a:link, a:visited {
    border:	0px; padding:0px; margin:0px;
	color:#ffffff;
	text-decoration: underline;}
a:hover, a:active {
	color:#FFEDB2 !important;
	text-decoration: none !important;}
.thumb-left{
    float:left;
    border: 1px solid #ffffff;
    margin-right:15px;
}
.thumb-right{
    float:right;
    border: 1px solid #ffffff;
    margin-left:15px;
}

#footer a:link, #footer a:visited {
    border:	0px; padding:0px; margin:0px;
	color:#ffffff;
	text-decoration: none;}
#footer a:hover, #footer a:active {
	color:#FFDE70 !important;
	text-decoration: none !important;}

#menu2 ul li{display: inline;}

.separator{width:635px; height:1px; clear:both; padding:0; background:url(../../images/charte/spacer.gif) no-repeat center top; line-height: 0px; font-size: 0; overflow: hidden;}

.paragraph{
  clear:both;
  padding:0px 18px;
}



.select-recherche{
  width:270px;
  padding:30px 0px 0px 330px;
}
.select{
   background-color:#FFF1C3;
    border:none;
    width:180px;
    font: normal 11px verdana;
    height:16px;
    line-height: 14px;
    float:left;
    margin-right:1px;
    color:#3D0000;
    display: block;
}
*+html .select{
    height:18px;
    font-size: 10px;
}

.buttonRecherche{
  cursor:pointer;
  border:none;
  background: url(../../images/charte/button-rechercher.jpg) no-repeat left top;
  width:81px;
  height:18px;
}
.buttonRechercheOver{
  cursor:pointer;
  border:none;
  background: url(../../images/charte/button-rechercher-over.jpg) no-repeat left top;
  width:81px;
  height:18px;
}
.product{
  width:290px;
  height:160px;
  float:left;
  background: url(../../images/charte/bg-product.jpg) no-repeat left top;
  margin-bottom:18px;
  margin-right:18px;
}
.product-title{
  width:262px;
  height:17px;
  padding:3px 0px 0px 28px;

  font: bold 11px verdana;
  color:#F6D273;
}
.product-detail{
  width:290px;
  height:118px;
}
.product-detail img{
  float:right;
  border: 1px solid #ffffff;
  margin:0px 6px 0px 6px;
}
.photo-video{
 display:inline;
 width:187px;
  height:155px;
  float:left;
  background: url(../../images/charte/bg-product.jpg) no-repeat left top;
  margin-bottom:18px;
  margin-right:18px;
  text-align: center;
}
.photo-title{
  margin:0px; padding:0px;
  width:160px;
  height:22px;
  padding:3px 0px 0px 27px;

}

.photo-photo{
  width:187px;
  height:112px;
  text-align: center;
}

.photo-video img{
  border: 1px solid #ffffff;
}


/* ===| VII. CONTACT FORM |=====================================================*/
.contact-left{
  width:290px;
  float:left;
  padding-right:18px;
  font:normal 11px Verdana;
  }


.inputForm{
	border:1px solid #ffffff;
	background-color:#fff1c3;
	color:#3d0000;
    width:214px;
    font:normal 11px Verdana;
    padding-left:2px;
    padding-top:1px;
    height:15px;
	}
.inputFormOver{
	border:1px solid #fff1c3;
	background-color:#510000;
	color:#d60808;
    width:214px;
    font:normal 11px Verdana;
    padding-left:2px;
    padding-top:1px;
    height:15px;
	}
textarea{
  font:normal 12px Arial;
}


.label{
	width:70px;
	float:left;
	display:inline;
	clear:both;
	margin-top:5px;
	color:#ffedb2;
	text-align:left;
    font:normal 11px Verdana;

	}
  .label span{
    color:#f30909;
    }
.field{
	width:160px;
	float:left;
	margin-top:5px;
  font:normal 12px Arial;
 	}
.btn{
  clear:both;
  width:300px;
  padding:40px 0 0 215px;
  }
  .btn div{
    float:left;
    display:inline;
    width:100px;
    }

.button{
  background:url(../../images/charte/button-contact.jpg) no-repeat left top;
  border:none;
	width:81px;
  height:18px;
	cursor:pointer;
  color:#460000;
  font:bold 11px Verdana;
  padding:0px;
  margin:0px;
	}
  .buttonOver{
    background:url(../../images/charte/button-contact-over.jpg) no-repeat left top;
    border:none;
  	width:81px;
    height:18px;
  	cursor:pointer;
    color:#d60808;
    font:bold 11px Verdana;
	padding:0px;
	margin:0px;
    }

