/*
Auteur : Julien Villalard
Fichier : general.css
*/
@import url(http://fonts.googleapis.com/css?family=Signika+Negative);

html { 
   height: 100%; 
}
body {
	font-family: 'Signika Negative', sans-serif;
	margin: 0px;
	width: 100%;
	height: 100%;
	background-color: black;
	overflow:hidden;
	color:white;
	position:fixed;
}

#general {
	position: relative;
	width: 100%;
	height: 100%;
	max-height: 750px;
	max-width: 1300px;
	min-height: 630px;
	min-width: 1000px;
	overflow: hidden;
	margin: 0 auto 0 auto;
	border: 1px solid #272727;
}

A {
	text-decoration: none;
	font-weight: bold;
	color: black;
}
A:hover {
	text-decoration: underline;
	font-weight: bold;
	color: #211b3e;
}
/* BANDEAU  */
#bandeau_haut {
	position:absolute;
	top:0;
	width: 100%;
	height: 100px;
	z-index:10;
}

#bandeau_bas {
	position:absolute;
	top:600px;
	width: 100%;
	height: 300px;
	z-index:10;	
	font-size:10px;
	color:#c5c5c5;
}

.bandeau_noir {
	position:absolute;
	width: 100%;
	height: 100%;
	background-color: black;
   opacity : 0.7;
   filter : alpha(opacity=70); 
}

#bd_haut {
	position:absolute;
	width: 100%;
	height: 100%;
	color:white;
	border-bottom:1px solid white;
	z-index:11;	
}
#bd_bas {
	position:absolute;
	width: 100%;
	height: 100%;
	color:white;
	border-top:1px solid white;
	z-index:11;
}

.legende{
	position:absolute;
	top:20px;
	right:650px;
	font-size:16px;
	background-color:black;
	width:120px;
	text-align:center;
	z-index:3;
}

#bd_bas A{
color:white;
font-size:12px;
font-weight: normal;
}

/* ZONES UTILES  */

.zone{
	position:absolute;
	top: 0;
	left:100%;
	width:100%;
	height: 100%;
	z-index:2;
	background-color:black;
	overflow:hidden;
}

.outils{
	position:absolute;
	top: 100px;
	right:0;
	width:230px;
	height: 20px;
	padding:5px 10px 5px 10px;
	z-index:3;
	color:white;
	font-size:12px;
	background-color:#333333;
	overflow:hidden;
}
.outils A{
	display:block;
	float:left;
	color:white;
	font-size:13px;	
	text-decoration:none;
	cursor:pointer;
}
.outils_legende{
	position: absolute;
	top: 130px;
	right: 0;
	width: 230px;
	height: 460px;
	padding:5px 10px 5px 10px;	
	z-index: 3;
	color:white;
  font-size: 12px;	
	background-color: #999999;
	overflow: hidden;
}
.outils_legende A.lien_titre{
display:block;
	font-size: 14px;
	text-decoration: none;
	border-bottom:1px solid white;
	margin:3px 0 10px 0;
	cursor: pointer;
}

.outils_legende A{
	color:white;
	font-size:12px;	
	text-decoration:none;
}

A.lien_blanc{
	color:white;
	font-size:14px;	
	text-decoration:none;
}
/* ZONES EDITORIALE  */
#zone_editoriale{
	position:absolute;
	top: 100px;
	left:150px;;
	width:900px;
	height: 460px;
	z-index:2;
	padding:20px;
	background-color:white;
	color:black;
	overflow:auto;
   display:none;
}

#menu{
	position: absolute;
	top: -10px;
	left: 170px;
	width: 210px;
	height: 120px;
	z-index: 13;
	background-color: #1c1c1c;
	overflow: hidden;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	padding: 20px 0 3px 0;

}

#menu A{
	color: white;
	text-decoration: none;
	cursor: pointer;
	display: block;
	border-bottom: 1px solid #2f2f2f;
	font-size: 11px;
	font-weight: normal;
	height: 24px;
}
#menu A:hover{
	color:white;
	text-decoration:none;
	cursor:pointer;
	display:block;
	border-bottom:1px solid white;
	font-size:12px;
	font-weight:normal;
	background-color: #303030;
}
.cadre_auteur{
	float: left;
	width: 250px;
	height: 160px;
	background-color: #e8e8e8;
	overflow: hidden;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	padding: 10px;
	margin:10px;
	font-size:12px;
	text-align:justify;
}

A.lien_noir{
	color:black;
	font-size:18px;	
	text-decoration:none;
}

A.lien_pieds{
	font-size:10px;
	cursor: pointer;
}
A.lien_pieds:hover{
	text-decoration:none;
}

A.lien_rond
{
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	display:block;
	float:left;
	font-size:14px;
	border:1px solid black;
	background-color:#D0D0D0;
	padding:6px;
	margin:5px;
	width:25px;
	text-align:center;
	cursor: pointer;	
}
A.lien_rond:HOVER
{
text-decoration: none;
color:red;
}

A.plien_rond
{
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	display: block;
	float: left;
	font-size: 11px;
	border: 1px solid black;
	background-color: #555555;
	padding: 4px;
	margin: 3px;
	text-align: center;
}
/* ZONES RESSOURCES  */
/* Ecran choix du thème */
.theme{
	position:absolute;
	width:23%;
	height: 160px;
	background-color:gray;
	opacity : 0.5;
	filter : alpha(opacity=50);	
	z-index: 2;
}
.legende_theme{
	position: absolute;
	cursor: pointer;
	left:0;
	bottom:0;
   cursor:pointer;
	width: 100%;
	height: 45px;
	z-index:3;
}
.legende_theme_texte{
	position: absolute;
	left:0;
	top:0;
	width: 100%;
	height: 100%;
	color: white;
	font-size: 18px;
	z-index:4;
	padding:10px 10px 10px 10px;
}
.legende_theme_fond{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height: 100%;
	background-color:black;
	opacity : 0.5;
	filter : alpha(opacity=50);	
	z-index: 3;
}


/* ZONES RESSOURCES  */
/* Ecran des ressources*/
#res_multimedia{
	position: absolute;
	right: 250px;
	top: 0;
	width: 250px;
	height: 500px;
	background-color: #242424;
	z-index: 3;	
}

.onglet{
	padding: 8px 0 0 5px;
	float: left;
	width: 120px;
	cursor: pointer;
	height: 22px;
	background-color: #4f4f4f;
}

.onglet:hover{
	background-color: #434343;
}

.divinterview{
   position:relative;
	opacity : 0.6;
	filter : alpha(opacity=60);	
	border-bottom:1px solid white;
	padding:6px 6px 6px 80px;
	font-size:12px;
	cursor:pointer;
	height:60px;
	overflow:hidden
}

.divinterview:hover{
	opacity : 1;
	filter : alpha(opacity=100);	
	border-bottom:1px solid white;
}

.titre_multimedia {
width:100%;
height:100%;
font-size:24px;
color:gray;
	background-color:black;
	opacity : 0.6;
	filter : alpha(opacity=60);	
	display:none;
}

A.groslien_blanc,
.titre_multimedia A{
font-size:24px;
color:white;
}

#res_diaporama{
	position: absolute;
	left: 0;
	top: 0;
	width: 500px;
	height: 500px;
	z-index: 3;	
}

#zone_uneressource{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
}

#legende_auteur{
	position: absolute;
	top: 30px;
	right: 0;
	width: 230px;
	height: 450px;
	padding:10px;
	z-index: 3;
	background-color: #999999;
	overflow: hidden;
	color:white;
}
#cartouche_auteur{
	position: absolute;
	top: 0;
	right: 0;
	width:400px;
	height: 480px;
	padding:10px;	
	z-index: 5;
	color:white;	
	background-color: #999999;
	overflow: hidden;
	display:none;
}

#uneressource{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	overflow: hidden;
}



/* ZONES CARTE  */
#info_plan,#info_prison,#info_chiffres{
	position: absolute;
	padding:28px 10px 10px 10px;
	top: 100px;
	right: 0;
	width: 400px;
	height: 462px;
	z-index: 4;
	display: none;
	overflow: auto;
	background-color: #999999;
	color:white;
}

#info_plan A,#info_prison A{
	color:white;
}
#info_chiffres A{
	color:white;
}
#texte_prison {
	position: absolute;
	top: 100px;
	left: 100px;
	width: 350px;
	z-index: 100;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	display: none;
	font-style: italic;

}
#texte_prison1 {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 100;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	background-color: black;
	opacity:0.8;
}
#texte_prison2 {
	position: relative;
	width: 90%;
	height: 95%;
	padding:10px 5px 10px 20px;
	z-index: 101;
	color: white;
}
#texte_prison2 A{
	color: white;
	font-size: 9px;
	float: right;
	text-decoration: none;
}
.titre_prison {
 font-size:25px;
 color:white;
}
.carte_chiffre
{
	font-size: 40px;
	font-weight: bold;
	text-align:center;
}



/*  ZONE PLAN  */
#texte_plan {
	position: absolute;
	top: 130px;
	left: 100px;
	width: 300px;
	height: 350px;
   z-index:5;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	display: none;
}
#texte_plan1 {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: black;
	opacity:0.8;
}
#texte_plan2 {
	position: relative;
	width: 98%;
	padding: 8px;
	color: white;
	font-size:12px;
	overflow:visible;
}
#texte_plan3 {
	position: relative;
	width: 98%;
	padding: 5px;
	color: white;
	font-size: 12px;
	overflow: hidden;
}


/*  ZONE CHIFFRES  */
.chiffre{
	position:absolute;
	width:370px;
	height: 220px;
	background-color:gray;
	opacity : 0.7;
	filter : alpha(opacity=70);	
	z-index: 2;
}
.legende_chiffre{
	position: absolute;
	left:0;
	bottom:0;
	width: 100%;
	height: 45px;
	z-index:3;
}
.legende_chiffre_ex{
	position: absolute;
	display:none;
	left:0;
	top:0;
	width: 350px;
	height: 155px;
	z-index:3;
	background-color:#dbff44;
	padding:10px;
	cursor: pointer;
	overflow: hidden;
	color:black;
}
.legende_chiffre_texte{
	position: absolute;
	left:0;
	top:0;
	width: 100%;
	height: 100%;
	color: white;
	font-size: 18px;
	z-index:4;
	padding:10px 10px 10px 10px;
}

.legende_chiffre_texte A{
text-decoration:none;
font-size:25px;
color:white;
}

.legende_chiffre_fond{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height: 100%;
	background-color:black;
	opacity : 0.3;
	filter : alpha(opacity=30);	
	z-index: 3;
}

A.bouton_chiffre{
float:left;
width:30px;
height:26px;
	font-size:16px;
	text-align:center;
	
}

A.bouton_chiffre:hover{
background-color:#545454;
	
}

A.spip_out{
color:white;
text-decoration:underline;
	
}

A.lien_map{
	font-size:0.8rem;
	text-decoration: none;
	cursor:pointer;
}
A.lien_map:hover{
	text-decoration: none;
	color: gray;
}

/* FORMULAIRE */
LABEL{
font-weight:bold;
}

LEGEND{
font-weight:bold;
font-size:18px;
}

input, SELECT{
height: 34px;
padding: 5px;
margin: 5px;
font-size: 1.2rem;
width: 100%;
max-width: 350px;

}
/* Logos, documents et images */
img { margin: 0px; padding: 0px; border: none; max-width: 100%;height: auto;}
