

body  { 
font-family: jura-demibold;  
background-image: url(interface/fond.gif);
background-repeat: repeat;  
margin-bottom: 10px;    }

#conteneur {
background-color:#000; 
width: 1000px; 
height: 1670px;
position:relative;
left: 2px; 
top: 2px;
margin-left:auto;
margin-right:auto;
margin-bottom: 10px; 
border: solid 1px #666 ;     
box-shadow: 5px 5px 8px #666666;
-moz-box-shadow: 5px 5px 8px #666666;
-webkit-box-shadow: 5px 5px 8px #666666;  }

 
.rspvimage {
   
   position: relative;
   overflow: hidden;
   width: 100%; }


.rspvimage  li {
   
  -webkit-backface-visibility: hidden;
   position: absolute;
   display: none;
   width: 100%;
   left: 4;
   top: 0;  }

.rspvimage  li:first-child {
   
   position: relative;
   display: block;
   float: left;  }


.rspvimage  i2mg {

   display: block;
   height: auto;
   float: center;
   width: 100%;
   border: 0px;  }


#box   {
position: absolute;
top: 0px;
left: 0px;
width: 1000px;
height: 12px;  
background-color: #333; }

#ani-atohm1    {
position: absolute;
top: 14px;
left: 4px;  }


#logo   {
position: absolute;
top: 28px;
left: 110px;   }

#box1   {
position: absolute;
top: 106px;
left: 0px;
width: 1000px;
height: 16px;  
background-color: #333;
border-top: solid 1px #666; }


#fr   {
position: absolute;
top: 199px;
left: 60px;
width: 50px;
height: 27px;    }

#ue   {
position: absolute;
top: 200px;
left: 130px;
width: 50px;
height: 27px;    }

#screen   {
position: absolute;
top: 1100px;
left: 290px;   }

#zone-img     { 
position:absolute;
top: 1125px;
left: 349px;
width: 486px;
height: 301px;
z-index: 1;   }


#zone     { 
position:absolute;
top:920px;
left: 30px;
width: 200px;
height: 80px;   }


.back   {
position: absolute;
top: 565px;
left: 440px;
border-radius: 2.0em;
border: 3px solid #000;
width:30px;
height: 30px;
padding: 3px;   
background : red;
background: -moz-linear-gradient(top left, black, red );
background: -ms-linear-gradient(top, left black, red);
background: -o-linear-gradient(top, left black, red);
background: -webkit-gradient(linear, 0% 0%, 100% 100%, from(#000), to(red)); 
box-shadow: 3px 3px 8px #666;
cursor: pointer;
z-index: 1;   }

.back:hover  {
border: 3px solid #fff; 
box-shadow: 3px 3px 8px #000;  }



.play   {
position: absolute;
top: 565px;
left: 540px; 
border-radius: 2.0em;
border: 3px solid #000;
width:30px;
height: 30px;
padding: 3px;   
background : red;
background: -moz-linear-gradient(top left, black, red );
background: -ms-linear-gradient(top, left black, red);
background: -o-linear-gradient(top, left black, red);
background: -webkit-gradient(linear, 0% 0%, 100% 100%, from(#000), to(orange)); 
box-shadow: 3px 3px 8px #666;
z-index: 1;
cursor: pointer;    }

.play:hover  {
border: 3px solid #fff; 
box-shadow: 3px 3px 8px #000;  }

.next   {
position: absolute;
top: 565px;
left: 640px; 
border-radius: 2.0em;
border: 3px solid #000;
width:30px;
height: 30px;
padding: 3px;   
background : red;
background: -moz-linear-gradient(top left, black, red );
background: -ms-linear-gradient(top, left black, red);
background: -o-linear-gradient(top, left black, red);
background: -webkit-gradient(linear, 0% 0%, 100% 100%, from(#000), to(red)); 
box-shadow: 3px 3px 8px #666;
cursor: pointer;
z-index: 1;    }

.next:hover  {
border: 3px solid #fff; 
box-shadow: 3px 3px 8px #000;  }

#monde   {
position: absolute;
top: 380px;
left: 20px;    }

#web-tv  {
position: absolute;
top: 260px;
left: 60px;
border: solid red 3px;
border-radius: 4px;
padding-bottom: 20px;
background-color: red;   }

#web-tv-titre  {
position: absolute;
top: 325px;
left: 64px;
color:#000;
font-size: 1.6em;
font-weight: bold;   }


#visual2   {
position: absolute;
top: 630px;
left: 8px;    }

#visual1   {
position: absolute;
top: 670px;
left: 20px;    }

#picto1   {
position: absolute;
top: 690px;
left: 117px;    }

#picto2   {
position: absolute;
top: 766px;
left: 117px;    }

#picto3   {
position: absolute;
top: 842px;
left: 117px;    }

#picto4   {
position: absolute;
top: 920px;
left: 117px;    }

#picto5   {
position: absolute;
top: 997px;
left: 117px;    }

#topsite  {
position: absolute;
top: 1210px;
left: 112px;    }

#titre  {
font-size: 4.0em; 
color:#fff;
position: absolute; 
top: 136px; 
left:200px; }

#texte   {
position: absolute;
top: 220px;
left: 240px;
width: 680px;
height: 300px;
padding: 4px;
line-height: 1.6em;
color:#ff3300;
font-size: 22px;
text-align:justify;  }

#credits   {
z-index: 3;
position: absolute;
top: 1010px;
left: 780px;
font-size: 23px;
width: 280px;
height: 74px;
color:#ffffff;
font-weight: bold;    }   

#pied-page {
position: absolute;
top: 1640px;
left: 1px; 
width: 998px;
height: 27px; 
font-size: 23px;
margin-bottom: 10px; 
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));   
z-index: 1;

}


@font-face {
  font-family: 'jura-demibold';
  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;
}
