/* CSS Document */
/* CSS 1 et CSS 2*/
/* reference au balise et propriétés CSS : http://dicolive.media-box.net/docCSS/css.php?orderByType=1*/

/*Mise en forme pour chaque page appelée appartenant au site officiel et users*/
/*Une grande partie des propriétés met en place la forme graphique (modèle du site) */
/*et la charte graphique du contenu*/

/* corps de la page*/
body{
	margin: 0;
	padding: 0;
	background-color : white;
}

/*cadre 800*600*/
#cadrePage{
	width:800px;
	background-color: white;
	margin-left: auto; /*centrage page*/
	margin-right: auto; /*centrage page*/
	margin-top:10px;
	padding-bottom:10px;
}

/*----------------------------------------------------------------------------*/
/*Propriétés du cadre gauche de la page */
/*----------------------------------------------------------------------------*/

/*--------- haut de page-----------*/

/* cadre*/
#cadreGauche{
	position: relative;
	width: 200px;
	float:left;
	background-color: #00A2E8;
}

/* logo avec image*/
#logo{
	position: relative;
	width: 200px;
	height: 130px;
	background-image:  url("/images/graphismesInterface/logo.jpg");
	background-color: black;
}

/* image langue anglaise*/
#langueAnglaise{
	width: 35px;
	height: 35px;
	position: relative;
	top :111px;
	left: 30px;
	float :left;
	z-index: 10;
}

/* image langue française*/
#langueFrançaise{
	width: 35px;
	height: 35px;
	position: relative;
	top :111px;
	right: 30px;
	float: right;
	z-index: 10;
}
/*----------------------------------------------------------------------------*/

/*------------- menu (identification,lien plan du site, lien contact, menu)---------------------------*/

/* cadre*/
#cadreMenuGauche{
	position: relative;
	z-index: 4;
	width: 200px;
	background-color: #00A2E8;
	font-family: arial;
	font-size: 12px;
	font-weight: normal;
	top:20px;
	padding-top:30px;
}

/* cadre identification*/
.identification{
	background-image:  url("/images/graphismesInterface/bulle.gif");
	width: 134px;
	height: 134px;
	position: relative;
	z-index: 11;
	left: 32px;
	font-family: "Arial Black";
	font-size: 11px;
	font-weight: normal;
	background-repeat: no-repeat;
	color: white;
}

/* identification formulaire*/
.identification form{
	position: relative;
	top: 35px; 
	text-align: center;
}

/* identification input*/
.identification input{
	width: 70px;
}

/* identification lien*/
.identification a{
	text-decoration: none;
	color: white;
}

/* identification lien lorsqu'on passe dessus*/
.identification a:hover{
	text-decoration: underline;
}

/* identification police*/
#identifie
{
	position: relative;
	z-index: 11;
	font-family: "Arial Black";
	font-size: 11px;
	font-weight: normal;
	color: white;
	top :40px;
	text-align:center;
}

/* forme, positionnement lien plan du site*/
.planSite{
	background-image:  url("/images/graphismesInterface/bulleLien.gif");
	position: relative;
	z-index: 11;
	left: 32px;
	margin-top: 10px;
	background-position: left;
	background-repeat: no-repeat;
}

/* lien plan du site*/
.planSite a{
	color: white;
	padding-left: 17px;
	text-decoration: none;
}

/* lien plan du site lorsqu'on passe dessus*/
.planSite a:hover{
	text-decoration: underline;
}

/* forme, positionnement lien contact*/
.contact{
	background-image:  url("/images/graphismesInterface/bulleLien.gif");
	position: relative;
	z-index: 11;
	left: 32px;
	margin-top: 10px;
	background-position: left;
	background-repeat: no-repeat;
}

/* lien contact*/
.contact a{
	color: white;
	padding-left: 17px;
	text-decoration: none;
}

/* lien contact lorsqu'on passe dessus*/
.contact a:hover{
	text-decoration: underline;
}

/*cadre du menu (voir menuNetscape ou menuIE pour la position des éléments dans le menu)*/
#cadreMenu{
	z-index: 12;
	position: relative;
	left: 5px;
	width : 190px;
	margin-top: 15px;
	border-top: 2px solid gray;
	border-bottom: 2px solid gray;
	border-color : white;
}

/* forme arrondi (bas du menu)*/
#finMenuGauche{
	z-index: 1;
	position: relative;
	height: 30px;
	width: 200px;
	margin-top: 15px;
	background-image:  url("/images/graphismesInterface/finMenuGauche.gif");
}

/* forme, positionnement lien copyright*/
.copyright{
	background-color: white;
	position: relative;
	padding-top: 5px;
	text-align: center;
	height:30px;
}

/* lien copyright*/
.copyright a{
	text-decoration: none;
	color :#00A2E8;
}

/* lien copyright lorsqu'on passe dessus*/
.copyright a:hover{
	text-decoration: underline;
}

/* positionnement lien acrobatReader*/
.acrobatReader
{
	background-color: white;
	position:relative;
	height:30px;
	padding-left:55px;
}

/* forme lien acrobatReader*/
.acrobatReader img{
	border:none;
}

/*----------------------------------------------------------------------------*/

/*----------------------------------------------------------------------------*/
/*Propriétés du cadre droit de la page */
/*----------------------------------------------------------------------------*/

/* cadre*/
#cadreDroit{
	position: relative;
	width: 600px;
	float:right;
}

/* cadre haut*/
#cadreHaut{
	background-color: #00A2E8;
}

/* banniere*/
#banniere{
	position: relative;
	width: 580px;
	height: 120px;
	left: 10px;
	top: 5px; /*background-color: red;*/
	background-repeat: no-repeat;
}

/*date de mise à jour*/
#dateMAJ{
	text-align: right;
	position: relative;
	font-family: arial;
	font-size: 12px;
	font-weight: normal;
	right: 20px;
	top: 10px;
	color: white;
}

/* arrondi (forme bas droite)*/
#formeArrondie{
	width: 600px;
	height: 30px;
	position: relative;
	background-image:  url("/images/graphismesInterface/formeArrondie.gif");
	top: 15px;
}

/* contenu*/
#cadreContenu{
	position:relative;
	width: 540px;
	top: 15px;
	left:30px;
	border-bottom: 2px solid #00A2E8;
	padding-bottom: 30px;/* marge fin contenu page*/
	margin-bottom:15px;/*marge fenetre page*/
}

/*----------------------------------------------------------------------------*/
/*Propriétés du contenu de la page */
/*----------------------------------------------------------------------------*/
/* titre de la page*/
#titrePage{
	width: 540px;
	height: 50px;
}

/* contenu de la page*/
.contenuPage{
	position :relative;
	z-index: 0;
	width: 540px;
	font-family: arial;
	font-size: 12px;
	font-weight: normal;
	text-align: justify;
	list-style-type: disc;	
}

/* lien contenu de la page*/
.contenuPage a{
	text-decoration:none;
}

/* lien contenu de la page lorsqu'il a déjà été visité*/
.contenuPage a:visited{
	color: blue;
}

/* lien contenu de la page lorsqu'on passe dessus */
.contenuPage a:hover{
	text-decoration:underline;
}

/* table contenu de la page*/
.contenuPage table{
	margin-top:30px;
}

/* li (liste) contenu de la page*/
.contenuPage li
{
	list-style-image:  url("/images/graphismesInterface/bulle_puce.gif");
	margin-left:30px;
	margin-top:10px;
}

/* deuxieme forme de lien contenu de la page*/
.lien{
	vertical-align:top;
	font-weight: bold;
	padding-left:30px;
}

/* cadre de la photo (photo + titre)*/
.photo{
	position: relative;
}

/* photo */
.photoImage{
	position: relative;
	margin-bottom: 3px;
	border: 1px solid #0000CC;
}

/* titre de la photo*/
.photoTitre{
	position:relative;
	font-size: 12px;
	text-align: left;
	padding-top: 2px;
	font-weight: normal;
	color: #0000CC;
	border-bottom: 1px solid #0000CC;
	vertical-align:bottom;	
}

/* texte à coté de la photo*/
.texteParagraphe{
	vertical-align:top;
	padding-right:10px;
	padding-left:10px;
}

/* titre dans le contenu de la page*/
.titre{
	font-size: 14px;
	text-align: left;
	margin-bottom:10px;
	font-weight: bold;
	color: #0000CC;	
}

/* forme et positionnement pour certains documents(Surveillance environnementale)*/
.doc{
	vertical-align:top;
	font-weight: bold;
	padding-left:150px;
}

/* mise en forme du mot iseo*/
#iseo
{
	font-family: "Book Antiqua";
	font-size: 16px;
	font-weight: normal;
}