* {	margin:0px; padding:0px; }

/*TYPO*/

@font-face { font-family: "GillSansLight"; 	src: url(../recurent/typo/GillSanLig.ttf); 	}	
@font-face { font-family: "GillSans";	 	src: url(../recurent/typo/GillSan.ttf); 	}	
@font-face { font-family: "GillSansBold"; 	src: url(../recurent/typo/GillSanBol.ttf); 	}

body{
	background-color:black;	
	border:none;
	height:100%;
	position:absolute;
	width:100%;
	margin-top:0px;
	top:0;
	text-align:center}
	
input{
	position:absolute;
	left:-9999px;
	}	
vr, ana{
	display:block;
	text-align:center;
	width:100%}
		
vr > img, ana > img{
	display:block;
	margin:0 auto;
	}
			
iframe{
	width:100%;
	height:100%;
	display:block;
	border:none;
	top:0px;
	margin-top:0px;
	overflow:hidden;
	}

iframe html{
	position:fixed;
	}
	
#btnRetour, #btnPleinEcran{
	display:block;
	position:absolute;
	margin-top:0;
	top:0;
	text-align:center;
	opacity:0;
	}

#btnPleinEcran > img {
	width:100%;
	height:100%;
	}

#btnRetour:hover, #btnPleinEcran:hover{
	opacity:0.6;
}


#btnRetour{
	float:left;
	width:15%;
	}
	
#btnPleinEcran{
	position:absolute;
	float:right;
	width:10%;
	right:0;
	}
		
.hors_cadre{position:absolute;
	left:-9999px}

nav {position:fixed;
	width:100%;
	height:75%;
	bottom:0px}

nav .ligne, nav .ligneChrono{
	display:block;
	height:33%;
	}

nav div div{
	display:inline-block;
	position:relative;
	margin:0px;
	height:100%;
   	width:15%;
	text-align:center;
	}

nav div .gauche{
	float:left;
	height:100%;
 	}
    
nav div .droite{
    float:right;
	height:100%;
	}
 
nav div div label{
	height:100%;
	display:inline-block;
	}
	
nav div>div>label>img{
	width:100px;
	vertical-align:middle;
	}

nav>div>div>label{
	display:block;
	width:100%;
	height:100%;
	background-position:center;
	background-repeat:no-repeat;
	opacity:0;
	}

nav>.ligne>div>label:hover{
	opacity:0.6;
	}

nav>.ligneChrono>div>label{
	opacity:1;
	}
	

nav>.ligneChrono{
	opacity:0;
	}

.ligneChrono:hover {
	opacity:0.6;	
}


label[for="entraxeMoins"]{	background-image: url("../recurent/pictos/entraxe_moins.gif");	}
label[for="entraxePlus"]{	background-image: url("../recurent/pictos/entraxe_plus.gif");	}
label[for="suivante"]{		background-image: url("../recurent/pictos/suivant.gif");	}
label[for="precedente"]{	background-image: url("../recurent/pictos/precedent.gif");	}
label[for="chronoPlus"]	{	background-image: url("../recurent/pictos/chrono.gif");		} 
label[for="chronoMoins"]{	background-image: url("../recurent/pictos/chrono.gif");		} 

label[for="entraxeMoins"], label[for="entraxePlus"], 
label[for="chronoPlus"], label[for="chronoMoins"], 
label[for="suivante"],label[for="precedente"]{	
		background-size:60%	
		}

#vitesse{
	display:block;
	position:absolute;
	width:66%;
	margin-left:17%;
	vertical-align:middle;
	height:0px;
	top:82%;
	}

#ligneVitesse,#curseurVitesse{
	vertical-align:middle;
	display:block;
	background-color:white;
	position: absolute;
  	top: 50%; /* poussé de la moitié de hauteur du référent */
  	transform: translateY(-50%); /* tiré de la moitié de sa propre hauteur */
	}
	
#ligneVitesse{
	height:8px;
	width:100%;
	}
	
	
#curseurVitesse{
  	transform: translate(-50%, -50%); /* tiré de la moitié de sa propre hauteur */
	height:50px;
	width:50px;
	border-radius:25px;
	}
	
/* * * * * * * * * * * * PAGE VOIR DIAPO * * * * * * * * * * */
.voirRelief{
	position:absolute;
	display:block;
	width:100%;
	text-align:center;
	height:100%;
	vertical-align:middle;
	}
/*** LE BLOC NAV ***/
.reliefAna, .reliefVr{
	position:absolute;
	width:100%;
	top:0;
	height:100%;
	}

.reliefVr{
	width:100%;
	height:60px;
	position:relative;
	}
/*** LE LIEN DE RETOUR */
.reliefVr a ,.reliefAna a {
	display:block;
	float:left;
	position:absolute;
	}
	
/*** LE PICTO DE RETOUR */
.reliefVr a img, .reliefAna a img{
	width:50px;
	padding:8px;
	position:absolute;
	opacity:0.5;
	}

.reliefVr a img:hover, .reliefAna a img:hover{
	opacity:1;	
	}

/*** IMAGE ANA*/
.voirRelief>img{
	width:60%;
}

/*** IMAGE VR*/

.reliefVr>img{
		margin-top:60px;
	width:100%;
}	

#cadreRA{
	display:inline-block;
	position:relative;
	width:1000px;
	overflow:hidden;	
	}

#rdG {
	display:inline-block;
	position:absolute;
	width:2000px;
	opacity:1;
	margin-left:0;
	margin-left:-1000px;
}

#rdD {
	width:2000px;
	margin-left:-1000px;
}

@media (max-width: 1040px) {
	
	/* fixer une largeur maximale de 100% aux éléments potentiellement problématiques */
	img, td, textarea, input, embed, video { max-width: 100%;}
	
	/* conserver le ratio des images */
	img { height: auto; }
	
	/* gestion des mots longs */
	textarea, table, td, th {
		-webkit-hyphens: auto; /* césure propre */
		-moz-hyphens: auto;
		hyphens: auto;
		word-wrap: break-word; /* passage à la ligne forcé */
	}
forum{margin-left:0;width:100%}
}

*:checked{opacity:1}