

body  { 
  
  background-color: #fff;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
  width: 1014px; }

#headline {

  background-color:#000; 
  position:fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 50px;
  color: #fff;
  z-index: 5;
  margin: 0px;
  padding:0px;    }

#picto2   {

  position: relative;
  top: -8px;
  left: 4px;
  width: 32px;
  height: 32px;
  z-index: 6;   }

#marque   {

  position: absolute;
  top: -24px;
  left: 85px;
  color: #fff;
  z-index: 7;
  width: 232px;
  font-size: 20px;
  font-family: jura-demibold;   }


#boxhead   {

  position: absolute;
  top: 8px;
  left: 550px;   
  width: 540px;
  height: 38px;
  z-index: 4; }

#blockbox {

  background-color:#fff; 
  position:relative;
  margin-top: 75px;
  margin-bottom: 10px; 
  width: 1014px;
  height: 2060px;
  margin-left: auto;
  margin-right: auto;
  border: solid 7px #666 ;    }

#logo   {

  position: absolute;
  top: 10px;
  left: 10px;
  width: 993px;
  height: auto;   }

#portrait   {

  position: absolute;
  top: 165px;
  left: 40px;
  width: 160px;
  height: 160px;
  border: solid 1px #000;
  box-shadow: 2px 2px 2px;   }


#titre   {

  position: absolute;
  top: 184px;
  left: 240px;
  font-size: 2.0em;   }

#texte   {

  position: absolute;
  top: 300px;
  left: 245px;
  width: 755px;
  font-size: 0.7em;
  font-weight: bold;
  text-align: justify;   }

#menu   {

  position: absolute;
  top: 8px;
  left: 550px;   
  width: 540px;
  height: 38px;
  text-align: center;
  background-color: #fff;
  z-index: 4; }


#menu2   {

  position: absolute;
  top: 1660px;
  left: 0px;   
  width: 150px;
  height: 36px;
  text-align: center;
  background-color: #000;
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px; }


#menu3   {

  position: absolute;
  top: 244px;
  left: 804px;   
  width: 210px;
  height: 36px;
  text-align: center;
  background-color: #000;
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px; }


.boutonok  {

   position:relative;
   top: 10px;
   left: 1%;
   width: 30px;
   height:30px;
   z-index: 3;
   border-radius: 16px; }

.boutoncroix2  {

   position: absolute;
   top:-3%;   
   left: 99%;
   width:22px;
   height:22px;
   z-index:4;   
   border-radius: 18px;  }


#picto   {

  position: relative;
  top: 6px;
  width: 30px;
  height: 26px;
  padding-left: 10px;
  padding-right: 10px;
  vertical-align: bottom;   }

#icoloupe   {

  position: absolute;
  top: -10px;
  left: 78px;
  width: 36px;
  height: 36px;
  z-index: 4;
  border: 1px #000 solid;
  cursor: pointer;   }

#champloupe   {

   position:relative;
   top: 0px;
   left: 20px;
   margin: 2px;
   width: 300px;
   height:26px;
   padding: 2px;
   font-size: 1.0em;
   font-family: jura-demibold;
   border-radius: 5px;
   border: 1px #ccc solid;
   background-color: #fff;
   color: #666;  }

.iconpopchat  {

  position: absolute;
  top: -5px;
  left: 730px;
  width: 32px;
  height: 32px;
  z-index: 4;  }



#video  {

 
  position: absolute;
  top: 1560px;
  left: 8px;
  width: 480px;
  height: 270px;  }


#diapo1   {

  position: absolute;
  top: 800px;
  left: 508px;
  width: 490px;
  height: 320px;
  border: solid 1px #000;   }

#diapo2   {

  position: absolute;
  top: 1180px;
  left: 508px;
  width: 490px;
  height: 320px;
  border: solid 1px #000;   }


#diapo3   {

  position: absolute;
  top: 1560px;
  left: 508px;
  width: 490px;
  height: 320px;
  border: solid 1px #000;   }



#stats  {

  position: absolute;
  top: 1930px;
  left: 20px;
  font-size: 24px; 
  z-index: 2;
  line-height: 1.0em;  }


#texte2  {

  position: absolute;
  top: 440px;
  left: 10px;
  width: 464px;
  height: 1040px; 
  font-size: 0.7em; 
  z-index: 2;
  text-align: justify;
  padding: 10px;
  overflow: auto;  }

#texte3  {

  position: absolute;
  top: 1700px;
  left: 10px;
  width: 464px;
  height: 300px; 
  font-size: 0.7em; 
  z-index: 2;
  text-align: justify;
  padding: 10px;
  overflow: auto;  }





#texte2::first-letter {

  font-size: 2.2em;
  font-weight: normal;
  margin-right: 6px;
  color: #000;
  line-height: 14px; 
  text-shadow: 3px 3px 6px #000;  }

td  {

  width: 44px;
  height: 20px;
}

#boxcomment {  

   position:relative;
   top: 1560px;
   left: 328px;
   width:320px;
   height:458px;
   margin: 8px;
   padding: 10px;
   z-index:4;
   font-size: 0.8em;
   display: none;
   border-radius: 6px;
   border: 1px solid #666;
   box-shadow: 1px 3px 12px #000;
   background-color: #111;
   color: #fff;  }

.submitbox  {

  font-size: 0.3em;
  border-radius: 2px;
  width: 170px;
  padding: 4px;
  margin: 10px;
  height:32px;  }

#boxmoteur {  

   position:absolute;
   top: 120px;
   left: 33%;
   width:360px;
   height:180px;
   z-index:6;
   display: none;
   border: 1px solid #666;
   box-shadow: 1px 3px 12px #000;
   background-color: #111;
   color: #fff;
   border-radius: 4px;  }


#champmoteur   {

   position:relative;
   top: 8px;
   left: 10px;
   margin: 4px;
   width: 280px;
   height:26px;
   font-size: 1.0em;
   font-family: jura-demibold;
   border-radius: 2px;
   border: 1px #ccc solid;
   background-color: #fff;
   color: #666;   }

.rad  {

  position: relative;
  top: 6px;
  left: 0px;
  width: 22px;
  height: 22px;  }

.motcle  {

  font-size: 0.8em;
  position: relative;
  top: 8px;
  left: 20px;
  width:360px;
  height:18px;  }


.chercheboxsubmit  {

  position:relative;
  top: 70px;
  left: 10px;
  font-size: 1.0em;
  border-radius: 4px;
  width: 140px;
  padding: -2px;
  margin: 4px;
  height:38px;  }


textarea  {

  border-radius: 2px;
  position: relative;
  left: 5px;
  width: 240px;
  height: 180px;   }

#emoticon  {

  position: relative;
  top: -80px;
  left: 186px;
  margin-left: 10px;  }



#commentaires  {

  position: absolute;
  top: 1682px;
  left: 10px;
  width: 464px;
  height: 360px; 
  font-size: 0.8em; 
  z-index: 2;
  text-align: justify;
  padding: 10px;
  overflow: auto;  }

.champcomment  {

  font-size: 1.0em;
  border-radius: 2px;
  width: 48%;
  padding: 1px;
  margin: 2px;
  height:18px;  }


#motdepasse  {

  position: absolute;
  top: 80px;
  left: 30%;
  width: 404px;
  height: 186px; 
  font-size: 0.8em; 
  z-index: 1;
  text-align: justify;
  padding: 10px;
  display: none;
  border-radius: 6px;
  border: 1px solid #666;
  box-shadow: 1px 3px 12px #000;
  background-color: #111;
  color: #fff;  }

.champmdp  {

  font-size: 1.0em;
  border-radius: 2px;
  width: 48%;
  padding: 1px;
  margin: 2px;
  height:18px;  }



#couleur  {

  position: absolute;
  top: 180px;
  left: 0px;
  margin-left:auto;
  margin-right:auto;
  width: 1014px;
  border-collapse:collapse;  }




a {       

  color: #999;
  font-size:1.0em;
  text-decoration:none;   }

a:hover { 

  color:#555;    
  text-decoration:none;  }


a:visited { 

  color:#777;
  text-decoration:line-through; }

a:active { 
  
  color: #999;
  text-decoration: overline; }
 

a.lienhead  {

  color: #fff;
  text-decoration:none; }



a:hover.lienhead  {

  color: #ccc;  }




.lienhead  {

  position: absolute;
  top: 3px;
  left: 120px; 
  width: 120px;
  font-family: jura-demibold;
  font-size: 1.0em;
  color: #fff;  }



#couleur-pied  {

  position: absolute;
  top: 1990px;
  left: 0px;
  margin-left:auto;
  margin-right:auto;
  width: 1014px;
  border-collapse:collapse;
  border-color: 1px solid #000;  }




#credits   {

  position: absolute;
  top: 2038px;
  left: 710px;
  font-size: 15px;
  width: 300px;
  height: 20px;
  color:#000;
  font-weight: bold; 
  z-index:1;    }   


@font-face {

  font-family: 'jura-demibold';
  src: url('http://www.terminal-media.net/atohm-net/00-kraft/fonts/jura-demibold-webfont.eot');
  src: url('http://www.terminal-media.net/atohm-net/00-kraft/fonts/jura-demibold-webfont.eot?#iefix') format('embedded-opentype'),
       url('http://www.terminal-media.net/atohm-net/00-kraft/fonts/jura-demibold-webfont.woff') format('woff'),
       url('http://www.terminal-media.net/atohm-net/00-kraft/fonts/jura-demibold-webfont.ttf') format('truetype'),
       url('http://www.terminal-media.net/atohm-net/00-kraft/fonts/jura-demibold-webfont.svg#jurademibold') format('svg');
  font-weight: normal;
  font-style: normal;   }


@keyframes slidy {
0% { left: 0%; }
20% { left: 0%; }
25% { left: -100%; }
45% { left: -100%; }
50% { left: -200%; }
70% { left: -200%; }
75% { left: -300%; }
95% { left: -300%; }
100% { left: -400%; }
}

div#slider { overflow: hidden; }
div#slider figure img { width: 20%; float: left; }
div#slider figure { 
  position: relative;
  width: 500%;
  margin: 0px;
  text-align: left;
  font-size: 0;
  animation: 30s slidy infinite; 
}

#slider  {

  position: absolute;
  top: 440px;
  left: 514px;
  width: 490px;
  height: 360px;  }

