/* ################################ 
###   Spécifications générales 
###  Version positionnement centré
################################### */

body {
	width:985px;
	background-image: url('fond.gif');
	}

* { font-family:Arial, Helvetica, sans-serif;	
	color:#494949;
	padding:0px;
	margin:0px;
}


/* Traitement des puces */
ul { margin-left:30px; }
ul li, ul li p   { list-style-image: url('puce_liste.gif'); }
ul li ul li, ul li ul li p  { list-style-image: url('puce_liste_jaune.gif') }

dd, dt, dl{list-style-type:none; margin: 0px; padding: 0;}

a{color:#ff6600; text-decoration:none;} /* couleur initiale f59718 */
a:hover{color:#f59718; text-decoration:underline;}

/* titre site */		h1 { font-family: Arial, Helvetica, sans-serif; font-size: 2em; font-weight:bold; color:#000000;}  
/* titre page */		h2 { font-family: Arial, Helvetica, sans-serif; font-size: 1.5em; font-weight:bold; color:#000000; border-bottom:solid 1px;margin-right:10px;} 
/* sous-titre orange */	h3 { font-family: Arial, Helvetica, sans-serif; font-size: 1.17em; font-weight:bold; color:#ff6600; border-bottom:solid 1px; border-bottom-color:#CCCCCC;margin-top:12px;margin-bottom:6px;margin-right:10px;}
/* normal gris */		h4 {font: Arial, Helvetica, sans-serif; font-size:1em; color:#464448; font-weight:bold;line-height:15px; margin-top:8px; margin-bottom:4px;}
/* normal noir souligné*/	h5 {font: Arial, Helvetica, sans-serif; font-size:1em; color:#000000; font-weight:bold; border-bottom:solid 1px; border-bottom-color:#CCCCCC; margin-top:7px; margin-bottom:5px;}
/* normal gris */		h6 {font: Arial, Helvetica, sans-serif; font-size:0.9em; color:#464448; font-weight:bold; margin-top:6px; margin-bottom:5px;}
 .Normal_gras {font: Arial, Helvetica, sans-serif; font-weight:bold; color:#464448; line-height:15px;} 

p { padding-top:6px;padding-bottom:4px; }

blockquote { margin-left:30px; }
#contenu td { padding :10px; }

hr {margin-top:15px; margin-bottom:10px;
	border-left:0px none; border-right:0px none; border-bottom:0px none; border-top:1px solid #504E53; width: 100%;
	height: 1px
} 

.clear {clear:both;}  /* Pour annuler l'effet d'un float ?*/



/*#####################################################
###	   HEADER
###	   Bordure Top
#####################################################*/

#header {
	width:985px;
	background-color:#FFFFFF;
	border-top:10px solid #1C2E3A;
	border-left:10px solid #1C2E3A;
	/ * border-left-width:10px; cette commande ne donne pas le résultat attendu !!! */
	height:	200px;
	}

#bandeau {
	height:	135px;
	background-image:url('bandeau.jpg');
	background-position: 0px 41px;
	background-repeat:no-repeat;
	padding-top: 20px;
	border:0px;
	}
	
#header H1 { 
	position:absolute; top:20px; left:15px; width:700px;
	font-size: 24px;
	width:700px;
	height:29px;
	}
	
#header H2 {
	position:absolute; top:170px; left:220px;
	font-size: 16px;
	width:590px;
	z-index:20;
	}


/*#####################################################
	   ZONE CONTENU 
	   correspond à la partie éditoriale de la page
#####################################################*/

/* Attention : Si le contenu dépasse 600 pixels, 
il s'étalera sur la droite dans la marge doite 

Actuellement sous IE, le fond blanc du "plan du site" déborde sur la droite
Cela n'est pas du aux nombreuses listes emboitées. Donc à quoi ? */

/* html>body corrige pour Mozilla les infos d'abord fournies à IE */
			 		
#contenu{	
		position:absolute; 
		left:220px ;
		top:200px; /* sans effet car défini en dur dans le code HTML */
		width:600px;  
		padding-top:10px;
		padding-left:0px;
		padding-right:0px;
		padding-bottom:40px;
		font-size:0.725em;
		float:left;
		}
#contenu table {
		font-size:1em;
		margin-top:20px;­
		padding:6px;
		}
		
#colGaucheEditoriale{
/* margin-top:20px; */
float:left;
width: 280px;
}

#colDroiteEditoriale{
/* margin-top:20px; */
float:right;
width: 280px;
}

#colMilieuEditoriale{
float:right;
width: 524px;
}


/*#####################################################
###	   MENU
###    Bordure Left
#####################################################*/

#colMenu{ 
		position:absolute; top:173px; left:10px;
		width: 200px;
		background-color:#FFFFFF;
		padding-bottom:20px;
		z-index:10;
		}	

/*** Niveau 1 correspond au Menu fixe à mettre en place manuellement */ 		
#menuNiveau1 {
	width: 180px;
	height:auto;
	/* background-color:#00CC66; */
	background-color:#000000;
	padding:0px;
	margin-left:0px;
	margin-top:0px;	
	}
	
#menuNiveau1 li  
	{list-style: none;  
	list-style-image: url('none'); }

#menuNiveau1 li a {
	display:block;
	width: 180px;
	padding-left:10px;
	cursor: pointer;
	font-weight: bold;
	border-bottom: 1px solid #fff;
	background: #000000;
	color: #FFFFFF;
	font-size:11px;
	line-height:21px;
	color:#FFFFFF;
	}
html>body #menuNiveau1 li a {width: 170px;}

	
/*** Retour sur la page "père" */
#remonter{
  	display:block;
  	margin-top:20px;
	width: 155px;
	height: 15px;
	overflow:hidden;
	background-color:#fff;
	margin-left:0px;
	padding:0px;
  	/* padding-left:20px; */
  	padding-right:-25px;
  	cursor:pointer;
	}
html>body #remonter
	{width: 94px;
	margin-bottom:20px;}
	
#remonter nobr a {
	background-image: url('fleche-remonter.png');
 	background-repeat: no-repeat;
  	background-position: left center;
	padding-top:-10px;
	padding-left: 25px;
	line-height:18px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
	color:#504E53;
	}


/*** Niveau 2 = Page Active (en jaune) + Pages soeurs */

#colMenu br {display:none};
	
#menuNiveau2 {
	margin-top:20px;
	width: 180px;
	padding-bottom:5px;
	margin-left:20px;
	}

#niveau2 nobr {
	display:block;
	width: 160px;
	border-bottom: 1px solid #ccc;
	margin-bottom:1px;
	font-size:11px;
	height:18px;
	background-color:#FFE600; 
	}
html>body #niveau2 nobr {
	border-left: 20px solid #fff;}
	
#niveau2 nobr a{
	display:block;
	width: 160px;
	color:#504E53;
	padding-bottom:1px;
	padding-top:3px;
	background-color:#FFFFFF;
	}
html>body #niveau2 nobr a {width: 180px;}


/*** Niveau 3 = Pages filles */
	
#menuNiveau3 {	
	margin-top:10px;
	margin-left:0px;
	border-bottom:3px solid #504E53;
	border-top:3px solid #504E53;
	width: 180px;
	height:auto;
	background-color:#EDECEB;
	padding-bottom:5px;
	padding-top:3px;
	
	} 
#niveau3 nobr a {
	display:block;
	padding-left:30px;
	background-color:#EDECEB;
	cursor: pointer;
	font-size:11px;
	line-height:18px;
	color:#504E53;
	border-bottom: 1px solid #FFF;
	}

/*#####################################################
###	  OUTILS
###	  Bordure Right
#####################################################*/

#colOutil{	
	position:absolute; top:173px; left:840px; 
	width: 155px;
	border:0px;
	background-color:#FFFFFF;
	z-index:10;
	}
	
#titreBandeau1, #titreBandeau2 {
	background: #504E53 url('fleche_outil.png') no-repeat left center; 
	width:155px;
	height:19px;
	padding-top:2px;
	font:Arial, Helvetica, sans-serif; 
	font-size:12px; 
	font-weight:bold; 
	color:#FFFFFF; 
	}

#zone_recherche {
	width: 155px;
	margin-top:5px;
	padding-bottom:10px;
	height:35px;
	background-color: #f6f5f5;
	}
	
#zone_recherche form input {
	font-size:11px;
	}

#zoneOutils {
	margin-bottom:10px;
	background-color: #f6f5f5;
	}

	
#zoneOutils ul {margin-left:10px; }
	
#zoneOutils ul li {
	list-style-position:inside; 
	padding: 0px; padding-bottom:3px;
	}
li#plan {
	list-style-image: url('puce_plan.png');
	}
li#video {
	list-style-image: url('puce_video.png');
	}
li#lien{
	list-style-image: url('puce_lien.png');
	}
li#imprimer{
	list-style-image: url('puce_imprimer.png');
	}
li#pdf{
	list-style-image: url('puce_pdf.png');
	}
li#aide{
	list-style-image: url('puce_aide.png');
	}
li#glossaire{
	list-style-image: url('puce_glossaire.png');
	}
li#contact{
	list-style-image: url('puce_contact.png');
	}
li#langue {
	list-style-image: url('puce_langue.png');
	}
li#visite {
	list-style-image: url('puce_visite.png');
	}
li#vide {
	list-style-image: url('puce_vide.png');
	}
li#rechercher {
	list-style-image: url('puce_rechercher.png');
	}
li#tousnossite{
	list-style-image: url('puce_lien.png');
	}
li#publication{
	list-style-image: url('puce_publication.png');
	}
	
	
#zoneOutils ul li a {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	margin: 0 5px;
	color: #666666;
	text-decoration: none;
	}

#zoneOutils ul li a:hover {
	color: #666666;
	text-decoration: underline;
	}
	

/* #zone_block{width:165px;}  */

#zoneEditorialeColOutil{
	padding-top:5px;
	padding-left:10px;
	background-color:#FFFFFF;
	font-size:11px;
	}

/*#####################################################
###
###	   DIVERS
###
#####################################################*/


/*
input.champ
{
	FONT-SIZE: 11px;
	COLOR: #404139;
	FONT-FAMILY: Arial, Helvetica, sans-serif;
	border-style:solid;
	border-color: #E0E0E0;
	border-width: 1px;
}

input.champ_erreur
{
	FONT-SIZE: 11px;
	COLOR: #FFFFFF;
	FONT-FAMILY: Arial, Helvetica, sans-serif;
	border-style:solid;
	border-color: #E0E0E0;
	border-width: 1px;
	background-color:#FF0000;
}

input.btn
{
	width:111px;
	height:16px;
}

*/
/*#####################################################
######################################################
###
###	   PIEDPAGE
###
######################################################
#####################################################*/


#piedpage {
width:990px;
height:20px;
z-index:100;
}

#piedpageColGauche{
float:left;
margin-left:2px;
width:200px;
}
#piedpage #piedpageColDroite{
float:right;
text-align:right;
width:700px;
}


/*#####################################################
###
###	   UTILISATEUR : FONT, ETC.
###
#####################################################*/


.chapeau {font: Arial, Helvetica, sans-serif; color:#000000; background-color:#E4DED4; display:block; padding:10px; line-height:15px;}

.legende {background:  url('fleche_legende.gif')  no-repeat 0px 4px;font-family: Arial, Helvetica, sans-serif; color:#464448; font-size:0.85em; margin-top:-2px; padding-left:7px; padding-right:0px; padding-top:0px; padding-bottom:0px}

/* .listeOutils{background: url('puce_liste_jaune.gif') no-repeat 0px 10px;margin-top:-2px; padding-left:15px; padding-right:0px; padding-top:0px; padding-bottom:0px } */

/* .Articletitre {font:Arial, Helvetica, sans-serif; font-size:14px; font-weight:bold; color:#000000; border-bottom:solid 1px; border-bottom-color:#AAAAAA;}
.Articlesoustitre {font:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; color:#f59718; border-bottom:solid 1px; border-bottom-color:#CCCCCC;}
.textecourant {font: Arial, Helvetica, sans-serif; font-size:11px; color:#464448; line-height:15px;}

li#listeTexteCourant { url(puce_liste.gif); list-style-image:; list-style-position:outside; margin-left:-24px}

.piedpagebis {color:red; font-family:Arial, Helvetica, sans-serif; font-size:11px;}
.piedpagebis a {color:red; text-decoration:none;}
.piedpagebis a:hover {color:red; text-decoration:none}
*/

/* ***************************************************
 * Définition de classes particulières
 *****************************************************
 * Bien que spécifique à l'écran, il faut les mettre dans cette partie commune, 
 * quitte à annuler leurs effets en impression,
 * ceci pour apparaitre dans les styles proposés sous FP */

/* Présentation du contenu de l'attribut "title" dans une bulle ; Mot souligné  */ 
.help { cursor:help; border-bottom:1px dotted}
	
/* Boite d'affichage avec un ascenceur - 300 de largeur */
.scroll300  {
	overflow:auto;
	width:290px;
	height:100px;
	text-align:left;
	}

/* Boite d'affichage avec un ascenseur - 600 de largeur */
.scroll600  {
	overflow:auto;
	width:580px;
	height:150px;
	text-align:left;
	}
	
/* Mise en page sur 2 colonnes 	*/
.colonne1 { 
		float:left; 
		clear:left; 
		width: 48%;
		}

.colonne2 {  
		margin-left: 48%;
		padding-left: 20px;
		/* pb sur IE 6 : marge gauche trop grande */ 
		}


/* Paragraphe justifié */
.justifie { text-align:justify;}

/* lien externe (présentation d'une "main" de sortie du site) */  
.lienexterne a { background-image: ; background-repeat: no-repeat; 
                 padding-left: 50px; 
                 background-position: 
               left center  
                 }
                 
/* Drapeaux associés à des langues
Il faut rajouter des espaces derrière l'élement pour l'insertion de l'image 
Car avec IE, la boite n'est pas aggrandi par le padding !

.lang-fr     { background-image: url('drapeau-fr.gif'); background-repeat: no-repeat; 
               background-position: right center }
.lang-en     { background-image: ; background-repeat: no-repeat; 
               background-position: right center }
*/	



/************************************************
 * Spécial
 ************************************************/

/* Elément supprimé n'occupant aucune place */	
.inutile {	 display : none; }

/* Elément non visible mais occupant de la place */	
.invisible { visibility : hidden; }

/* Si langue 
Ne pas oublier de rajouter l'appel aux styles nécessaires
Les 2 lignes suivantes n'ont pour but que de permettre 
de pouvoir sélectionner une langue depuis FrontPage, 
mais elles n'on aucun effet pratique*/
.fr { }
.en { }




/************************************************
 * Spécifications pour l'impression
 ************************************************/

@media print {



body  { background-image: none;}

#contenu *,#contenu  { font-family: "Times New Roman"; font-size: 10pt; color:#000;}

a { text-decoration: underline; color:rgb(0,0,0); }

.lienexterne a { background-image: ;  padding-left: 0px  }
.lienexterne a:after {content : "attr(href)";font-family:monospace}

	
/* Commandes de saut de page - Ne fonctionne pas sous N7 ? */
.saut   {  page-break-before:always; }




/* ********************************************
 * Gestion des bordures
 **********************************************/


#header {
	width:800px;
	height:	200px;
	border-top:none;
	border-left:none;
	}
	
#header H1 {
	position:relative; top:0; left:0px;
	font:Arial, Helvetica, sans-serif; 
	font-size:24px; font-weight:bold; 
	}

	
#bandeau {
	position:relative; top:-5px; left:-380px;  /* réglage logo pour IE */
	height:	45px;
	overflow:hidden;
	background-image:url('none');
	padding-top: 0px;
	}	
html>body #bandeau {left:-100px; width:1000px;}  /* réglage logo pour Mozilla */
	
#header H2 {
	position:relative; top:18px; left:0px;
	width:600px;
	font:Arial, Helvetica, sans-serif;  
	font-size:18px; font-weight:bold; 
	color:#000000; 
	border-bottom:solid 1px #000000;
	}
	
#colMenu {display:none;}
#colOutil {display:none;}	
	
#contenu{	
		position:relative;  
		left:0px; 
		width:600px;
		/* height:auto; */
		float:left;
		border:0px;
		margin:0px;
		padding:0px;
		margin-top:-200px; 
		}
html>body #contenu {width:900px; padding-bottom:200px; }
	
 /* Annulation de commandes spécifiques écran */
 
.help {border-bottom:0px ; cursor:default;}
.scroll300, .scroll600 {overflow:visible; width:auto; height:auto;}


}