body {margin:0px; padding:0px; overflow:hidden; font-family:tahoma; font-size:12px; color:#404040;}
a:link,a:visited,a:active {color: #0080C0;font-family:tahoma;font-size:12px;text-decoration:none;}
a:hover {text-decoration:underline;}

#iMAIN {width: 100%;}
#iTITLE {width:200px; text-align:right; margin-left: 70px; color:#555555; font-size:12px; margin-top: 0px;}
/* Bouton CONNEXION */
#iBUTTON_LOGIN {margin-top:20px; margin-left:-30px;}
/* Bouton GENERER */
#iBUTTON_FORM {margin-top:25px;}
#iENCART {padding-bottom: 80px;}
#iFORM {margin-top:30px; width:240px; margin-left:30px;}
#iAUTH {margin-top:-25px; margin-left:-30px; color:red; font-style:italic; }
#iBUTTON_DWL {margin-top:20px; margin-left:80px;}
#iLICENCE {vertical-align:middle;text-align:center; color:#262626; font-size:12px; padding-top:0px;}
#iLICENCE0 {vertical-align:middle;position:absolute; width:100%; background-color:#eeeeee; bottom:0px; height:25px;}
#iLICENCE_IMG {vertical-align:middle;height: 10px; margin-left: 15px; padding-top: 5px; border: 0px;}
#iframe1 {float:none; background-color: #ffffff; height:100%; right: 0px; width: 100%; border: 0px; margin: 0px}
/*Animation roue qui tourne*/
#iAJAX {margin-left:30px; margin-top:20px; background-image:url('../images/ajax-loader.gif'); background-repeat: no-repeat; width:250px; height:50px; background-position: center; text-align: center;color: #666666;}
#iMENU0 {top:0px; background-color: #3d3d3d; position: relative;float: left; width: 20px; height: 100%; z-index: 250;}
#iMENULEFT {background-color: fdfdfd; float: left;height: 100%;width: 305px; overflow: auto}
#iCONTENT {float: none;height: 100%;overflow-y: auto;border-left:1px dotted #aaaaaa;background-color: fcfcfc;}
#iCONTENT_UP {width:100%; height:30px;font-family: tahoma;color:#999999;margin-left:-3px;font-size:14px;vertical-align:middle;}
#iCONTENT_MIDDLE {width:900px;height: 30px;margin-left:562px;font-size:15px;text-align:left;vertical-align:middle;margin-bottom:5px;}
#iCONTENT_DOWN {height: 100%;}
#iLOGO {text-align:center; background-image:url('../images/Cerema_RVB-V01.jpg'); height:80px; width:299px;}
#iLOGIN {margin-top:50px; height:100px; margin-left: 30px;}
#iUSER {background-image:url(../images/user.png);}
#iPASS {background-image:url(../images/pass.png);}
/*Fond sous boutons de la carte*/
#iTAB0 {position: absolute; margin-left: 60px; margin-top: 15px; height: 42px; background-color: #ededed; border-radius: 5px; border:1px dotted #cccccc; vertical-align:middle;}
/*Boutons menu du haut de la carte*/
#iTAB {height: 40px; border-radius: 5px; margin:4px; vertical-align:middle;}
/* Volet escamotable */
#iVOLET {position:absolute;right:0px;top:0px;height: 99%;width:750px;background-color: #ffffff;}
#iVOLET_LEFT {float:left;width:35px;height:100%;border:1px solid #cccccc;background-color: #eeeeee;}
#iVOLET_RIGHT {	float:none;	background-color: #ffffff;height:100%;padding-top:6px;overflow-y:scroll;overflow-x:hidden; }
#iBTN_CLOSE {position:absolute; left:1px; top:0px; width:36px; height:35px; z-index:17; background-color:#ffffff; border:0px; border-bottom:1px solid #cccccc;	background-image:url('../images/close.png'); background-position: center; background-repeat: no-repeat; z-index:52;}



.titre1 {
	color:#E76900;
	font-weight:bold;
	font-size:13px;
	margin-top:15px;
	padding-bottom: 8px;
}
.titre2 {
	color:#505050;
	font-size:13px;
	vertical-align:top;
	margin-top:15px;
	padding-bottom: 8px;
}
.slc {
	height:30px;
	width:240px;	
	box-sizing: border-box; /* indique au navigateur de prendre en compte la bordure et le remplissage dans la valeur définie pour la largeur et la hauteur */
	border: 1px solid #ccc;
	border-radius: 8px;
	font-family: tahoma;
	color:#404040;
	font-size: 12px;
	padding-left: 10px;
	cursor: pointer;
}
/* Pseudo-classe pour animation passage de la souris */
.slc:hover {
	border: 1px solid gray;
	box-shadow: 0px 2px 5px rgba(0,0,0,0.2);
}
.zonetexte {
	text-align: center;
	padding-left: 0px;
	width: 100px;
	height: 30px;
	color: #404040;
	font-size: 12px;
	background-repeat: no-repeat;
	background-position: 3px 7px;
	background-size: 17px;
	border-width: 0px;
	border-bottom-width: 1px;
	border-bottom-color: #bbbbbb;
	border-bottom-style: dotted;
}
/* Pseudo-classe pour animation passage de la souris */
.zonetexte:hover {
	border-radius: 5px;
	font-weight: bold;
	border: 1px solid gray;
	box-shadow: 0px 2px 5px rgba(0,0,0,0.2);
}
.zonetexte_authentification {
	padding-left: 27px;
	width:235px;
	height:30px;
	font-size:14px;
	margin:3px;
	background-repeat:no-repeat;
	background-position:3px 7px;
	background-size:17px;
	border-width:0px;
	border-bottom-width:1px;
	border-bottom-color:#bbbbbb;
	border-bottom-style:dotted;
}
/* Pseudo-classe pour animation passage de la souris */
.zonetexte_authentification:hover {
	border-radius: 5px;
	font-weight:bold;
	border: 1px solid gray;
	box-shadow: 0px 2px 5px rgba(0,0,0,0.2);
}
.bouton {
	width:120px;
	font-family: Verdana;
	font-weight: bold;
	font-size: 13px;	
	color:#555;
	margin:2px;
	padding-left:12px;
	padding-right:12px;
	padding-top:6px;
	padding-bottom:6px;
	border:1px solid #ccc;
	border-radius:12px 0 12px 0;
	-moz-border-radius:12px 0 12px 0;
	-webkit-border-radius:12px 0 12px 0;
	background: #f5f5f5;
	cursor: pointer;
	text-align: center;
	text-decoration:none; /* pas de soulignement sous les liens hypertextes */
}
/* Pseudo-classe pour animation passage de la souris */
.bouton:hover {
	color: #fff;
    border: none;
	background: #4F5764;
}
.bouton2 {
	font-family: Verdana;
	font-weight: bold;
	font-size: 12px;	
	color:#555;
	margin:2px;
	padding-left:12px;
	padding-right:12px;
	padding-top:6px;
	padding-bottom:6px;
	border:1px solid #ccc;
	border-radius:12px 0 12px 0;
	-moz-border-radius:12px 0 12px 0;
	-webkit-border-radius:12px 0 12px 0;
	background: #f5f5f5;
	cursor: pointer;
	text-align: center;
	text-decoration:none; /* pas de soulignement sous les liens hypertextes */
}
/* Pseudo-classe pour animation passage de la souris */
.bouton2:hover {
	color: #fff;
    border: none;
	background: #4F5764;
}
/* Bouton figurant dans le popup des symboles de la carte.html */
.bouton3 {
	width:160px;
	font-family: Verdana;
	font-weight: bold;
	font-size: 12px;	
	color:#555;
	margin:3px;
	padding-left:12px;
	padding-right:12px;
	padding-top:6px;
	padding-bottom:6px;
	border:1px solid #ccc;
	border-radius:12px 0 12px 0;
	-moz-border-radius:12px 0 12px 0;
	-webkit-border-radius:12px 0 12px 0;
	background: #f5f5f5;
	cursor: pointer;
	text-align: center;
	text-decoration:none; /* pas de soulignement sous les liens hypertextes */
}
/* Pseudo-classe pour animation passage de la souris */
.bouton3:hover {
	color: #fff;
    border: none;
	background: #4F5764;
}




/* ---------------------------------------------- CASE A COCHER ---------------------------------------------- */
/* Personnaliser l'étiquette (le conteneur) */
.container_checkbox {
	position: relative;
	padding-left: 23px;
	padding-top: 2px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
/* Pseudo-classe pour animation passage de la souris */
.container_checkbox:hover {
	font-weight: bold;
}
/* Masquer la case à cocher par défaut du navigateur */
.container_checkbox input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}
/* Créer une case à cocher personnalisée */
.checkmark_checkbox {
	position: absolute;
	top: 0;
	left: 0;
	height: 18px;
	width: 18px;
	margin-bottom: 200px;
	background-color: #ccc;
}
/* Lorsque la case à cocher est cochée, ajouter un fond */
.container_checkbox input:checked ~ .checkmark_checkbox {
	background-color: #6B6B6B;
}
/* Créer la coche / indicateur (masqué lorsque non coché) */
.checkmark_checkbox:after {
	content: "";
	position: absolute;
	display: none;
}
/* Afficher la coche lorsque coché */
.container_checkbox input:checked ~ .checkmark_checkbox:after {
	display: block;
}
/* Style de la coche */
.container_checkbox .checkmark_checkbox:after {
	left: 6px;
	top: 2px;
	width: 4px;
	height: 8px;
	border: solid white;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}
/* Pseudo-classe pour animation passage de la souris */
.container_checkbox:hover input ~ .checkmark_checkbox {
	background-color: #262626;
}


/* ---------------------------------------------- BOUTON RADIO ---------------------------------------------- */
/* Personnaliser l'étiquette (le conteneur) */
.container_radiobutton {
	display: block;
	position: relative;
	padding-left: 25px;
	padding-top: 1px;
	margin-bottom: 8px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
/* Pseudo-classe pour animation passage de la souris */
.container_radiobutton:hover {
	font-weight: bold;
}
/* Masquer le bouton radio par défaut du navigateur */
.container_radiobutton input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}
/* Créer un bouton radio personnalisée */
.checkmark_radiobutton {
	position: absolute;
	top: 0;
	left: 0;
	height: 18px;
	width: 18px;
	background-color: #ccc;
	border-radius: 50%;
}
/* Lorsque le bouton radio est cochée, ajouter un fond */
.container_radiobutton input:checked ~ .checkmark_radiobutton {
	background-color: #6B6B6B;
}
/* Créer la coche / indicateur (masqué lorsque non coché) */
.checkmark_radiobutton:after {
	content: "";
	position: absolute;
	display: none;
}
/* Afficher la coche lorsque coché */
.container_radiobutton input:checked ~ .checkmark_radiobutton:after {
	display: block;
}
/* Style de la coche */
.container_radiobutton .checkmark_radiobutton:after {
	top: 5px;
	left: 5px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}
/* Pseudo-classe pour animation passage de la souris */
.container_radiobutton:hover input ~ .checkmark_radiobutton {
	background-color: #262626;
}