body { background: #fff url('img/bg_top.jpg') repeat-x 50% 0%; font-family: Arial; text-align: left; margin: 0; padding: 0; font-size: 0.7em; line-height: 1.4; }

div, p, img { margin: 0; padding: 0; }

a { color: #656565; text-decoration: none; }
a:hover { color: #000; }
a, a:active { outline: none; }


.spacer { clear: both; }

.main { margin: 0 auto 0 auto; width: 720px; }

#header {  height: 203px; width: 336px; background: url('img/bg_header.jpg') no-repeat; padding-left: 384px; }
#header h1 { float: left; margin: 0 0 0 0; width: 336px; padding: 0; }
#header h1 a { float: left; margin: 0; padding: 0; background: url('img/obstruction-brusque.jpg') no-repeat; width: 336px; height: 132px; text-indent: -10000px; }


#menu { float: left; width: 336px; list-style: none; padding: 37px 0 30px 0; margin: 0; }
#menu li { float: left; display: inline;  padding: 5px; height: 19px;  }

#menu li a { float: left; height: 19px; text-indent: -10000px;}

.btnAbout , .btnAboutAktive { background: url('img/btn_about.jpg') no-repeat; width: 38px; }
.btnConcept , .btnConceptAktive { background: url('img/btn_concept.jpg') no-repeat; width: 49px; }
.btnContact , .btnContactAktive { background: url('img/btn_contact.jpg') no-repeat; width: 49px; }

.btnAboutAktive, .btnConceptAktive, .btnContactAktive, .btnAbout:hover, .btnConcept:hover, .btnContact:hover { background-position: bottom; }

.btnAbout, .btnAboutAktive { margin: 0 85px; }


#footer { color: #AAA; padding-top: 20px; }
#footer a { color: #AAA; }
#footer ul { list-style: none; padding: 0; margin: 0; }
#footer ul li { display: inline; }
#footer #cpy { font-size: 0.8em; color: #CCC; }
#footer #cpy a {color: #CCC; }

h3 { font-size: 1.2em; }

/********************* home ********************/

#leftHome { float: left; width: 370px; padding: 0 20px 0 0; text-align: justify; }
.pBig { font-weight: bold; font-size: 1.4em; padding: 40px 0 50px 0; text-align: left; }

#teaser { float: left; width: 330px; background: url('img/bg_teaser.jpg') no-repeat 0% 100%; padding: 60px 0 60px 0;  }

#representations { background: #EDEDED; padding: 10px 10px 5px 10px; margin: 20px 0 0 0; }
#representations h3 { font-size: 1.3em; margin: 0; padding: 0; color: #000; }
#representations ul { list-style: none; margin: 0; padding: 0; }
#representations ul li { margin: 5px 0 0 0; padding: 0; }


#representations p { padding: 3px; }
#representations .repTitre { /*background: #CCC;*/ padding: 5px 3px 3px 3px; border-top: 1px solid #fff; }

.repTitre .sLieu { float: right; font-size: 0.9em; color: #333; padding: 1px 0 0 10px; }
.repTitre .sTitre { font-weight: bold; }

#representations .repDesc { color: #333; padding-bottom: 0; }

#representations .allLink { border-top: 1px solid #fff; text-align: right; margin-top: 5px; padding-top: 5px;  }

/********************* about ********************/
#about { text-align: justify; border-bottom: 1px solid #C8B1AB; padding-bottom: 15px; margin-bottom: 15px; }
.abRight { padding-right: 200px; }
.abImg { float: right; }

#about .spacer { background: url('img/ab-separator3.jpg') no-repeat 0% 100%; }

#abDigitalBorax {  background: url('img/logo_digital_borax.jpg') no-repeat; padding: 25px 0 20px 180px; }

#sponsorz { background: url('img/sponsors.jpg') 100% 0% no-repeat; padding: 0 230px 0 0; }

/********************* concept ********************/

.conceptTxt { text-align: justify; }
.conceptTxt p { padding: 20px 0; }

.conceptTxt a img { border: none; margin: 0; padding: 0; }

#radio { float: left; width: 200px; }
#radio p { padding: 0 0 15px 0; text-align: justify; }

#tofz { float: left; width: 330px; margin-left: 190px; }

#tofz a img { border: 2px solid #fff; }
#tofz a:hover img { border: 2px solid #999; }

/********************* contact ********************/
.Coordz { float: left; width: 370px; padding: 0 20px 0 0; }

.contactForm { float: left; width: 330px; }
.contactForm label { font-size: 1.2em; color: #333; }
.contactForm input.txtInput, .contactForm textarea { border: 1px solid #666; border-bottom: 3px solid #666; width: 320px; padding: 3px; margin: 3px 0 5px 0; }
.contactForm textarea { height: 100px; font-family: Arial; font-size: 1em;  }

.contactForm input.txtInput:hover, .contactForm input.txtInput:focus, .contactForm textarea:hover, .contactForm textarea:focus { background: #FFFBDE; }

.contactForm .button { text-align: right; padding-top: 5px; }

#error { color: #ff0000; }
#succes { color: #4DA1CF; }

.fichTechnik { background: #EDEDED; padding: 5px; width: 250px; }
.fichTechnik h3 { margin: 0 0 0 0; }

/********************* représentations *************/


#representationZ {  margin: 20px 0 0 0; }
#representationZ h3 { font-size: 1.3em; margin: 0; padding: 0; color: #000; }
#representationZ ul { list-style: none; margin: 0; padding: 0; }
#representationZ ul li { margin: 0; padding: 5px 0 5px 0; border-top: 1px solid #c3a09a; }


#representationZ p { padding: 0; }
#representationZ .repTitre { padding: 0; }

.repTitre .sLieu { float: right; font-size: 0.9em; color: #333; padding: 1px 0 0 10px; }
.repTitre .sTitre { font-weight: bold; }

#representationZ .repDesc { color: #333; padding-bottom: 0; }