body  {

  background-color: #333333;
}

#conteneur  {

  font-family: jurademibold;  
  width: 806px; 
  height: 2660px;
  position:relative;
  margin-left:auto;
  margin-right:auto;
  margin-bottom: 26px; 
  border: solid 1px #000;     
  background-color: #fff;
  border-radius: 14px 14px;
  -moz-border-radius: 14px 14px;
  -webkit-border-radius: 14px 14px;
  box-shadow: 8px 8px 12px #666666;
  -moz-box-shadow: 8px 8px 12px #666666;
  -webkit-box-shadow: 8px 8px 12px #666666;
}

#couleur  {

  position: absolute;
  top: 150px;
  margin-left:auto;
  margin-right:auto;
  border-collapse:collapse;
}

td  {

  width: 52px;
  height: 20px;
}

#lettre   {

  position: absolute;
  top: -66px;
  left: 592px;
  font-size:82px;
  font-weight: bold;
  background-color: #0099FF;
  color: #fff;
  padding-right: 18px;
  border-radius: 10px 10px;
  -moz-border-radius: 10px 10px;
  -webkit-border-radius: 10px 10px;
  text-shadow: 8px 8px 12px #000;
  -moz-text-shadow: 8px 8px 12px #000;
  -webkit-text-shadow: 8px 8px 12px #000;
  border: solid 1px black;
}

#logo   {

  position: absolute;
  top: 30px;
  left: 35px;   
}

#filet   {

  position: absolute;
  top: 100px;
  left: 537px;
  font-size:15px;
  font-weight: bold;
  width: 300px; 
}

a {       
  
  color: #FF6600;
  font-size:22px;
  text-decoration:none; 
}

a:hover { 
 
 color:#000000;   
}

a:visited   { 
  
  color:#A0A0A4;
  text-decoration:line-through; 
}

a:active { 
  
  color: #000000;
  text-decoration: overline; 
}

a.topic {       
  
  color: #0066FF;
  font-size:16px;
  text-decoration:none; 
}

a.topic:hover { 
 
 color:#FF6600;   
}


#atome {
   
  position: absolute;
  top: 340px;
  left: 6px;
}

#titre-intro {

  font-size: 48px;
  position: absolute;
  top: 254px;
  left: 60px;
  text-shadow: 3px 3px 6px #000;
  -moz-text-shadow: 3px 3px 6px #000;
  -webkit-text-shadow: 3px 3px 6px #000;
}

#texte-intro   {   

  position: absolute;
  top: 340px;
  left: 160px;
  width: 620px ;
  height: 240px;
  font-size: 18px;
  text-align: justify;
  line-height: 20px;    
}

#texte-intro::first-letter  {

  margin-right: 5px;
  font-size: 3.07em;
  text-shadow: 3px 3px 6px #808080;
}


#legende {
  
  font-size: 28px;
  line-height: 28px;
  font-weight: bold;
  position: absolute;
  top: 566px;
  left: 20px;
  width: 360px;
  color: #0099FF;
  
}

#inscription {
   
  position: absolute;
  top: 560px;
  left: 550px;
  font-weight: bold;
  font-size: 24px;
  text-shadow: 2px 2px 6px #000;
  -moz-text-shadow: 2px 2px 6px #000;
  -webkit-text-shadow: 2px 2px 6px #000;
  text-decoration: underline;
}

ul  {

  list-style-image: url(../images/puce-04.png);
}


#civilite {
   
  position: absolute;
  top: 5px;
  left: 74px;
  width: 176px;
  height: 28px;
}

#prenom {
   
  position: absolute;
  top: 40px;
  left: 74px;
  width: 170px;
  height: 28px;
}

#nom {
   
  position: absolute;
  top: 80px;
  left: 74px;
  width: 170px;
  height: 28px;
}

#email {
   
  position: absolute;
  top: 120px;
  left: 74px;
  width: 170px;
  height: 28px;
}

#boite-mail  {

  position: absolute;
  top: 1370px;
  left: 500px;
  width: 260px;
  height: 420px;
}

#boite-champs  {

  position: absolute;
  top: -740px;
  left: 10px;
  width: 250px;
  height: 200px;
}

#titre-inscrip {

 font-size: 48px;
  position: absolute;
  top: 818px;
  left: 10px;
  text-shadow: 3px 3px 6px #000;
  -moz-text-shadow: 3px 3px 6px #000;
  -webkit-text-shadow: 3px 3px 6px #000;
}

#texte-inscription   {   

  position: absolute;
  top: 890px;
  left: 20px;
  width: 760px ;
  height: 240px;
  font-size: 18px;
  text-align: justify;
  line-height: 20px;    
}

#texte-inscription::first-letter  {

  margin-right: 0px;
  font-size: 3.07em;
  text-shadow: 3px 3px 6px #808080;
}

#fenetre2 {
   
  position: absolute;
  top: 1130px;
  left: 38px;
  border: solid 1px black;
  box-shadow: 8px 8px 12px #666666;
  -moz-box-shadow: 8px 8px 12px #666666;
  -webkit-box-shadow: 8px 8px 12px #666666;
}

#legende-fen2 {
   
  position: absolute;
  top: 1372px;
  left: 72px;
}

#titre-membre {

  position: absolute;
  top: 1104px;
  left: 434px;
  width: 364px;
  font-size: 25px;
  text-shadow: 2px 2px 6px #000;
  -moz-text-shadow: 2px 2px 6px #000;
  -webkit-text-shadow: 2px 2px 6px #000;
}

#membre {

  position: absolute;
  top: 1170px;
  left: 448px;
  width: 300px;
  color: #0099FF;
  font-size: 22px;
  font-family: jurademibold;
  background-color: #CCCCFF;
  box-shadow: 8px 8px 12px #666666;
  -moz-box-shadow: 8px 8px 12px #666666;
  -webkit-box-shadow: 8px 8px 12px #666666;

}

#titre-contrat {
   
  font-size: 48px;
  position: absolute;
  top: 1420px;
  left: 10px;
  text-shadow: 3px 3px 6px #000;
  -moz-text-shadow: 3px 3px 6px #000;
  -webkit-text-shadow: 3px 3px 6px #000;
}

#texte-contrat   {   

  position: absolute;
  top: 1490px;
  left: 20px;
  width: 760px ;
  height: 240px;
  font-size: 18px;
  text-align: justify;
  line-height: 20px;    
}


#fenetre1 {
   
  position: absolute;
  top: 1770px;
  left: 448px;
  border: solid 1px black;
  box-shadow: 8px 8px 12px #666666;
  -moz-box-shadow: 8px 8px 12px #666666;
  -webkit-box-shadow: 8px 8px 12px #666666;
}

figcaption, img {

  position: absolute;
  top: 2026px;
  left: 506px;   
  display: block;
}



#fenetre3 {
   
  position: absolute;
  top: 1770px;
  left: 40px;
  border: solid 1px black;
  box-shadow: 8px 8px 12px #666666;
  -moz-box-shadow: 8px 8px 12px #666666;
  -webkit-box-shadow: 8px 8px 12px #666666;
}

#gestion  {
  
  position: absolute;
  top: 2010px;
  left: 130px;
}

#titre-caracteris {
   
  font-size: 48px;
  position: absolute;
  top: 2120px;
  left: 10px;
  text-shadow: 3px 3px 6px #000;
  -moz-text-shadow: 3px 3px 6px #000;
  -webkit-text-shadow: 3px 3px 6px #000;
}
#texte-caracteristiques   {   

  position: absolute;
  top: 2190px;
  left: 20px;
  width: 760px ;
  height: 240px;
  font-size: 18px;
  text-align: justify;
  line-height: 20px;    
}

#texte-caracteristiques::first-letter  {

  margin-right: 2px;
  font-size: 3.07em;
  text-shadow: 3px 3px 6px #808080;
}

#navigateurs  {

 position: absolute;
  top: 2380px;
  left: 280px;
} 


#espace {

  position: absolute;
  top: 2450px;
  left: 198px;
  width: 420px;
  color: #fff;
  font-size: 33px;
  background-color: #FF6600;
  -webkit-transform: rotate(-8deg);
  -o-transform: rotate(-8deg);
  -moz-transform: rotate(-8deg);
  transform: rotate(-8deg);
   padding: 8px;
  border-radius: 10px 10px;
  -moz-border-radius: 10px 10px;
  -webkit-border-radius: 10px 10px;
  text-shadow: 8px 8px 12px #000;
  -moz-text-shadow: 8px 8px 12px #000;
  -webkit-text-shadow: 8px 8px 12px #000;
  border: solid 1px black;
  box-shadow: 8px 8px 12px #666666;
  -moz-box-shadow: 8px 8px 12px #666666;
  -webkit-box-shadow: 8px 8px 12px #666666;
}


#topic   {

  position: absolute;
  top: 2592px;
  left: 1px;
  width: 802px;
  height: 18px;
  text-align:center;  
}


#credits   {

  position: absolute;
  top: 2634px;
  left: 650px;
  font-size: 12px;
  vertical-align:-20%;
  width: 180px;
  height: 20px;
  font-size: 15px;
  font-weight: bold; 
  z-index:1;    
}   

#pied-page {

  position: absolute;
  top: 2626px;
  left: 5px; 
  width: 796px;
  height: 27px; 
  margin-bottom: 10px;
  border: solid 1px black; 
  border-radius: 12px 8px;
  background: -moz-linear-gradient(top, #666666 0%, #FFFFFF 33%, #C0C0C0 77%, #666666);
  background: -ms-linear-gradient(top, #666666 0%, #FFFFFF 33%, #C0C0C0 77%, #666666);
  background: -o-linear-gradient(top, #000000 0%, #FFFFFF 33%, #C0C0C0 77%, #000000);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#666666));   
}

@font-face {
  font-family: 'jurademibold';
  src: url('../fonts/jura-demibold-webfont.eot');
  src: url('../fonts/jura-demibold-webfont.eot?#iefix') format('embedded-opentype'),
       url('../fonts/jura-demibold-webfont.woff') format('woff'),
       url('../fonts/jura-demibold-webfont.ttf') format('truetype'),
       url('../fonts/jura-demibold-webfont.svg#jurademibold') format('svg');
  font-weight: normal;
  font-style: normal;
}



@media only screen and (color) 

and (min-width : 320px) {

#conteneur  {

  font-family: jurademibold;  
  width: 300px; 
  height: 2342px;
  position:relative;
  margin-left:auto;
  margin-right:auto;
}

#couleur  {

  position: absolute;
  top: 70px;
  margin-left:auto;
  margin-right:auto;
  border-collapse:collapse;
}

td  {

  width: 52px;
  height: 10px;
}

#lettre   {

  position: absolute;
  top: -10px;
  left: 230px;
  font-size:24px;
  font-weight: bold;
  background-color: #0099FF;
  color: #fff;
  padding-right: 8px;
  border-radius: 10px 10px;
  -moz-border-radius: 10px 10px;
  -webkit-border-radius: 10px 10px;
  text-shadow: 8px 8px 12px #000;
  -moz-text-shadow: 8px 8px 12px #000;
  -webkit-text-shadow: 8px 8px 12px #000;
  border: solid 1px black;
}

#logo   {

  position: absolute;
  top: 8px;
  left: 8px;
  width: 220px;
  height: 35px; 
}

#filet   {

  position: absolute;
  top: 40px;
  left: 110px;
  font-size: 0.6em;
  font-weight: bold;
  width: 200px; 
}

a {       
  
  color: #FF6600;
  font-size:22px;
  text-decoration:none; 
}

a:hover { 
 
 color:#000000;   
}

a:visited   { 
  
  color:#A0A0A4;
  text-decoration:line-through; 
}

a:active { 
  
  color: #000000;
  text-decoration: overline; 
}

a.topic {       
  
  color: #0066FF;
  font-size:16px;
  text-decoration:none; 
}

a.topic:hover { 
 
 color:#FF6600;   
}


#atome {
   
  position: absolute;
  top: 100px;
  left: 2px;
  width: 60px;
  height: 60px; 
}

#titre-intro {

  font-size: 20px;
  position: absolute;
  top: 124px;
  left: 68px;
  
}

#texte-intro   {   

  position: absolute;
  top: 166px;
  left: 10px;
  width: 280px ;
  height: 240px;
  font-size: 0.6em;
  line-height: 14px;     
}

#legende {
  
  font-size: 12px;
  line-height: 18px;
  position: absolute;
  top: 326px;
  left: 8px;
  width: 360px; 
}

#inscription {
   
  position: absolute;
  top: 450px;
  left: 10px;
  font-size: 13px;
}

ul  {

  list-style-image: url(../images/puce-04.png);
}


#civilite {
   
  position: absolute;
  top: 5px;
  left: 74px;
  width: 106px;
  height: 16px;
}

#prenom {
   
  position: absolute;
  top: 40px;
  left: 74px;
  width: 100px;
  height: 16px;
}

#nom {
   
  position: absolute;
  top: 80px;
  left: 74px;
  width: 100px;
  height: 16px;
}

#email {
   
  position: absolute;
  top: 120px;
  left: 74px;
  width: 100px;
  height: 16px;
}

#boite-mail  {

  position: absolute;
  top: 1230px;
  left: 20px;
  width: 200px;
  height: 280px;
}

#boite-champs  {

  position: absolute;
  top: -740px;
  left: 10px;
  width: 240px;
  height: 190px;
}

#titre-inscrip {

 font-size: 22px;
  position: absolute;
  top: 720px;
  left: 10px;
  text-shadow: 3px 3px 6px #000;
  -moz-text-shadow: 3px 3px 6px #000;
  -webkit-text-shadow: 3px 3px 6px #000;
}

#texte-inscription   {   

  position: absolute;
  top: 760px;
  left: 10px;
  width: 280px ;
  height: 240px;
  font-size: 0.6em;
  line-height: 14px;    
}


#fenetre2 {
   
  position: absolute;
  top: 960px;
  left: 10px;
  width: 280px ;
  height: 200px;
  border: solid 1px black;
  box-shadow: 3px 3px 4px #666666;
  -moz-box-shadow: 3px 3px 4px #666666;
  -webkit-box-shadow: 3px 3px 4px #666666;
}

#legende-fen2 {
   
  position: absolute;
  top: 1160px;
  left: 72px;
  font-size: 10px;
}

#titre-membre {

  position: absolute;
  top: 1194px;
  left: 10px;
  width: 260px;
  font-size: 15px;
  text-shadow: 2px 2px 6px #000;
  -moz-text-shadow: 2px 2px 6px #000;
  -webkit-text-shadow: 2px 2px 6px #000;
}

#membre {

  position: absolute;
  top: 1240px;
  left: 10px;
  width: 280px;
  color: #0099FF;
  font-size: 14px;
  font-family: jurademibold;
  background-color: #CCCCFF;
  box-shadow: 3px 3px 4px #666666;
  -moz-box-shadow: 3px 3px 4px #666666;
  -webkit-box-shadow: 3px 3px 4px #666666;

}

#titre-contrat {
   
  font-size: 22px;
  position: absolute;
  top: 1400px;
  left: 10px;
  text-shadow: 3px 3px 6px #000;
  -moz-text-shadow: 3px 3px 6px #000;
  -webkit-text-shadow: 3px 3px 6px #000;
}

#texte-contrat   {   

  position: absolute;
  top: 1440px;
  left: 10px;
  width: 280px ;
  height: 240px;
  font-size: 0.6em;
  line-height: 14px;    
}


#fenetre1 {
   
  position: absolute;
  top: 1670px;
  left: 10px;
  width: 130px ;
  height: 100px;
  border: solid 1px black;
  box-shadow: 3px 3px 4px #666666;
  -moz-box-shadow: 3px 3px 4px #666666;
  -webkit-box-shadow: 3px 3px 4px #666666;
}

figcaption, img {

  position: absolute;
  top: 1780px;
  left: 26px;   
  display: block;
  font-size: 10px;
}



#fenetre3 {
   
  position: absolute;
  top: 1670px;
  left: 160px;
  width: 130px ;
  height: 100px;
  border: solid 1px black;
  box-shadow: 3px 3px 4px #666666;
  -moz-box-shadow: 3px 3px 4px #666666;
  -webkit-box-shadow: 3px 3px 4px #666666;
}

#gestion  {
  
  position: absolute;
  top: 1770px;
  left: 180px;
  font-size: 10px;
}

#titre-caracteris {
   
  font-size: 22px;
  position: absolute;
  top: 1820px;
  left: 10px;
  text-shadow: 3px 3px 6px #000;
  -moz-text-shadow: 3px 3px 6px #000;
  -webkit-text-shadow: 3px 3px 6px #000;
}
#texte-caracteristiques   {   

  position: absolute;
  top: 1860px;
  left: 10px;
  width: 280px ;
  height: 240px;
  font-size: 0.6em;
  line-height: 14px;    
}


#navigateurs  {

 position: absolute;
  top: 2060px;
  left: 30px;
  width: 240px ;
  height: 34px;
} 


#espace {

  position: absolute;
  top: 2144px;
  left: 14px;
  width: 260px;
  color: #fff;
  font-size: 20px;
  box-shadow: 3px 3px 4px #666666;
  -moz-box-shadow: 3px 3px 4px #666666;
  -webkit-box-shadow: 3px 3px 4px #666666;
}


#topic   {

  position: absolute;
  top: 2278px;
  left: 1px;
  width: 300px;
  height: 18px;
  text-align:center;
  font-size: 12px;  
}


#credits   {

  position: absolute;
  top: 2320px;
  left: 170px;
  font-size: 12px;
  vertical-align:-20%;
  width: 180px;
  height: 20px;
  z-index:1;    
}   

#pied-page {

  position: absolute;
  top: 2316px;
  left: 3px; 
  width: 290px;
  height: 18px; 
  margin-bottom: 6px;
  border: solid 1px black; 
  border-radius: 8px 6px;
  background: -moz-linear-gradient(top, #666666 0%, #FFFFFF 33%, #C0C0C0 77%, #666666);
  background: -ms-linear-gradient(top, #666666 0%, #FFFFFF 33%, #C0C0C0 77%, #666666);
  background: -o-linear-gradient(top, #000000 0%, #FFFFFF 33%, #C0C0C0 77%, #000000);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#666666));   

}
}

@media only screen and (color) 

and (min-width : 1024px) {

body  {

  background-color: #333333;
}

#conteneur  {

  font-family: jurademibold;  
  width: 806px; 
  height: 2660px;
  position:relative;
  margin-left:auto;
  margin-right:auto;
  margin-bottom: 26px; 
  border: solid 1px #000;     
  background-color: #fff;
  border-radius: 14px 14px;
  -moz-border-radius: 14px 14px;
  -webkit-border-radius: 14px 14px;
  box-shadow: 8px 8px 12px #666666;
  -moz-box-shadow: 8px 8px 12px #666666;
  -webkit-box-shadow: 8px 8px 12px #666666;
}

#couleur  {

  position: absolute;
  top: 150px;
  margin-left:auto;
  margin-right:auto;
  border-collapse:collapse;
}

td  {

  width: 52px;
  height: 20px;
}

#lettre   {

  position: absolute;
  top: -66px;
  left: 592px;
  font-size:82px;
  font-weight: bold;
  background-color: #0099FF;
  color: #fff;
  padding-right: 18px;
  border-radius: 10px 10px;
  -moz-border-radius: 10px 10px;
  -webkit-border-radius: 10px 10px;
  text-shadow: 8px 8px 12px #000;
  -moz-text-shadow: 8px 8px 12px #000;
  -webkit-text-shadow: 8px 8px 12px #000;
  border: solid 1px black;
}

#logo   {

  position: absolute;
  top: 30px;
  left: 35px;
  width: 551px; 
  height: 73px;   
}

#filet   {

  position: absolute;
  top: 100px;
  left: 537px;
  font-size:15px;
  font-weight: bold;
  width: 300px; 
}

a {       
  
  color: #FF6600;
  font-size:22px;
  text-decoration:none; 
}

a:hover { 
 
 color:#000000;   
}

a:visited   { 
  
  color:#A0A0A4;
  text-decoration:line-through; 
}

a:active { 
  
  color: #000000;
  text-decoration: overline; 
}

a.topic {       
  
  color: #0066FF;
  font-size:16px;
  text-decoration:none; 
}

a.topic:hover { 
 
 color:#FF6600;   
}


#atome {
   
  position: absolute;
  top: 340px;
  left: 6px;
  width: 156px; 
  height: 179px; 
}

#titre-intro {

  font-size: 48px;
  position: absolute;
  top: 254px;
  left: 60px;
  text-shadow: 3px 3px 6px #000;
  -moz-text-shadow: 3px 3px 6px #000;
  -webkit-text-shadow: 3px 3px 6px #000;
}

#texte-intro   {   

  position: absolute;
  top: 340px;
  left: 160px;
  width: 620px ;
  height: 240px;
  font-size: 18px;
  text-align: justify;
  line-height: 20px;    
}

#texte-intro::first-letter  {

  margin-right: 5px;
  font-size: 3.07em;
  text-shadow: 3px 3px 6px #808080;
}


#legende {
  
  font-size: 28px;
  line-height: 28px;
  font-weight: bold;
  position: absolute;
  top: 546px;
  left: 60px;
  width: 360px;
  color: #0099FF;
  
}

#inscription {
   
  position: absolute;
  top: 560px;
  left: 550px;
  font-weight: bold;
  font-size: 24px;
  text-shadow: 2px 2px 6px #000;
  -moz-text-shadow: 2px 2px 6px #000;
  -webkit-text-shadow: 2px 2px 6px #000;
  text-decoration: underline;
}

ul  {

  list-style-image: url(../images/puce-04.png);
}


#civilite {
   
  position: absolute;
  top: 5px;
  left: 74px;
  width: 176px;
  height: 28px;
}

#prenom {
   
  position: absolute;
  top: 40px;
  left: 74px;
  width: 170px;
  height: 28px;
}

#nom {
   
  position: absolute;
  top: 80px;
  left: 74px;
  width: 170px;
  height: 28px;
}

#email {
   
  position: absolute;
  top: 120px;
  left: 74px;
  width: 170px;
  height: 28px;
}

#boite-mail  {

  position: absolute;
  top: 1370px;
  left: 500px;
  width: 260px;
  height: 420px;
}

#boite-champs  {

  position: absolute;
  top: -740px;
  left: 10px;
  width: 250px;
  height: 200px;
}

#titre-inscrip {

 font-size: 48px;
  position: absolute;
  top: 818px;
  left: 10px;
  text-shadow: 3px 3px 6px #000;
  -moz-text-shadow: 3px 3px 6px #000;
  -webkit-text-shadow: 3px 3px 6px #000;
}

#texte-inscription   {   

  position: absolute;
  top: 890px;
  left: 20px;
  width: 760px ;
  height: 240px;
  font-size: 18px;
  text-align: justify;
  line-height: 20px;    
}

#texte-inscription::first-letter  {

  margin-right: 0px;
  font-size: 3.07em;
  text-shadow: 3px 3px 6px #808080;
}

#fenetre2 {
   
  position: absolute;
  top: 1130px;
  left: 38px;
  width: 320px;
  height: 240px;
  border: solid 1px black;
  box-shadow: 8px 8px 12px #666666;
  -moz-box-shadow: 8px 8px 12px #666666;
  -webkit-box-shadow: 8px 8px 12px #666666;
}

#legende-fen2 {
   
  position: absolute;
  top: 1372px;
  left: 72px;
  font-size: 16px;
}

#titre-membre {

  position: absolute;
  top: 1104px;
  left: 434px;
  width: 364px;
  font-size: 25px;
  text-shadow: 2px 2px 6px #000;
  -moz-text-shadow: 2px 2px 6px #000;
  -webkit-text-shadow: 2px 2px 6px #000;
}

#membre {

  position: absolute;
  top: 1170px;
  left: 448px;
  width: 300px;
  color: #0099FF;
  font-size: 22px;
  font-family: jurademibold;
  background-color: #CCCCFF;
  box-shadow: 8px 8px 12px #666666;
  -moz-box-shadow: 8px 8px 12px #666666;
  -webkit-box-shadow: 8px 8px 12px #666666;

}

#titre-contrat {
   
  font-size: 48px;
  position: absolute;
  top: 1420px;
  left: 10px;
  text-shadow: 3px 3px 6px #000;
  -moz-text-shadow: 3px 3px 6px #000;
  -webkit-text-shadow: 3px 3px 6px #000;
}

#texte-contrat   {   

  position: absolute;
  top: 1490px;
  left: 20px;
  width: 760px ;
  height: 240px;
  font-size: 18px;
  text-align: justify;
  line-height: 20px;    
}


#fenetre1 {
   
  position: absolute;
  top: 1770px;
  left: 448px;
  width: 320px; 
  height: 240px; 
  border: solid 1px black;
  box-shadow: 8px 8px 12px #666666;
  -moz-box-shadow: 8px 8px 12px #666666;
  -webkit-box-shadow: 8px 8px 12px #666666;
}

figcaption, img {

  position: absolute;
  top: 2026px;
  left: 506px;   
  display: block;
  font-size: 16px;
}



#fenetre3 {
   
  position: absolute;
  top: 1770px;
  left: 40px;
   width: 320px; 
  height: 240px; 
  border: solid 1px black;
  box-shadow: 8px 8px 12px #666666;
  -moz-box-shadow: 8px 8px 12px #666666;
  -webkit-box-shadow: 8px 8px 12px #666666;
}

#gestion  {
  
  position: absolute;
  top: 2010px;
  left: 130px;
  font-size: 16px;
}

#titre-caracteris {
   
  font-size: 48px;
  position: absolute;
  top: 2120px;
  left: 10px;
  text-shadow: 3px 3px 6px #000;
  -moz-text-shadow: 3px 3px 6px #000;
  -webkit-text-shadow: 3px 3px 6px #000;
}
#texte-caracteristiques   {   

  position: absolute;
  top: 2190px;
  left: 20px;
  width: 760px ;
  height: 240px;
  font-size: 18px;
  text-align: justify;
  line-height: 20px;    
}

#texte-caracteristiques::first-letter  {

  margin-right: 2px;
  font-size: 3.07em;
  text-shadow: 3px 3px 6px #808080;
}

#navigateurs  {

 position: absolute;
  top: 2380px;
  left: 280px;
} 


#espace {

  position: absolute;
  top: 2450px;
  left: 198px;
  width: 420px;
  color: #fff;
  font-size: 33px;
  background-color: #FF6600;
  -webkit-transform: rotate(-8deg);
  -o-transform: rotate(-8deg);
  -moz-transform: rotate(-8deg);
  transform: rotate(-8deg);
   padding: 8px;
  border-radius: 10px 10px;
  -moz-border-radius: 10px 10px;
  -webkit-border-radius: 10px 10px;
  text-shadow: 8px 8px 12px #000;
  -moz-text-shadow: 8px 8px 12px #000;
  -webkit-text-shadow: 8px 8px 12px #000;
  border: solid 1px black;
  box-shadow: 8px 8px 12px #666666;
  -moz-box-shadow: 8px 8px 12px #666666;
  -webkit-box-shadow: 8px 8px 12px #666666;
}


#topic   {

  position: absolute;
  top: 2592px;
  left: 1px;
  width: 802px;
  height: 18px;
  text-align:center;  
}


#credits   {

  position: absolute;
  top: 2634px;
  left: 650px;
  font-size: 12px;
  vertical-align:-20%;
  width: 180px;
  height: 20px;
  font-size: 15px;
  font-weight: bold; 
  z-index:1;    
}   

#pied-page {

  position: absolute;
  top: 2626px;
  left: 5px; 
  width: 796px;
  height: 27px; 
  margin-bottom: 10px;
  border: solid 1px black; 
  border-radius: 12px 8px;
  background: -moz-linear-gradient(top, #666666 0%, #FFFFFF 33%, #C0C0C0 77%, #666666);
  background: -ms-linear-gradient(top, #666666 0%, #FFFFFF 33%, #C0C0C0 77%, #666666);
  background: -o-linear-gradient(top, #000000 0%, #FFFFFF 33%, #C0C0C0 77%, #000000);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#666666));   
}
}