/* __________ Début général __________ */

html {
	font-size: 100%; /* correctif bug IE si changement taille texte */
}

body {
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.75em; /* correspond à du 12px : 12px/16px=0,75em */
}

p {
	margin: 1em 0;
}

.actualite {
	margin: 5px 0 10px 0;
}

table {
	margin: 0.4em 0 1em 0;
	border: 1px solid;
  	border-collapse: collapse;
}

table td,
table th {
  border : 1px solid;
  padding: 0.6em;
}

table th { 
  text-align: left;
}

h1 {
	font-size: 1.166em; /* correspond à du 14px : 14px/12px=1.166em*/
	margin: 0; /* pour mettre IE et FF d'accord */
	padding: 0; /* pour mettre IE et FF d'accord */
}

img {
	border:none; /* evite l'ajout d'une bordure autour des images placées dans une balise <a> */
}

#entete h1 {
	font-weight: bold;
	white-space: nowrap;
}

#entete h1 a {
	text-decoration: none;
}

#menu_droit h1{
	font-size: 1.273em; /* correspond à du 14px : 14px/11px=1.273em */
}

h2 {
	font-size: 1em; /* correspond à du 12px */
	margin: 0; /* pour mettre IE et FF d'accord */
	padding: 0; /* pour mettre IE et FF d'accord */
}

.petit11 {
	font-size: 0.916em; /* correspond à du 11px : notre base est 12px soit 0.75em, donc : 11/12= 0.916 */
}

.date {
	font-size: 0.833em; /* correspond à du 10px */
	margin: 18px 0 2px 0;
}

li a {
	text-decoration: none;
	font-weight: bold;
}

div.separateur { /* Voir l'article http://www.sitepoint.com/examples/hr/ et http://www.alsacreations.com/astuce/lire/56-styler-la-balise-lthr-gt-sous-internet-explorer.html au sujet de la mise en forme des balises HR */
  border-bottom: 1px solid;
  height: 10px;
  width: 98%;
  margin: 0px auto 10px auto;
}

.accessibilite {
  display: none;
}

#entete ul {  /* style des liens de haut de page */
  margin: 5px -1px 5px 0;
  position: absolute;
  right: 0px;
  bottom: 25px;
  white-space: nowrap;
  list-style: none;
}

#entete ul a:link,
#entete ul a:visited,
#entete ul a:hover {
  font-weight: bold;
  text-decoration: none;
  padding: 0;
}

#entete ul li {
  float: left;
  display: inline;
  padding: 0 0.7em 0.2em 0.9em;
  margin: 0;
  border-bottom:1px solid;  
  background: url(../images-site/trait-vertical.gif) no-repeat bottom left;
}

.haut { /* pour le lien qui permet de revenir en haut de page */
	text-align: right;
	margin-bottom: 10px;
}

/* Style des images avec ou sans légendes 
	voir http://www.alsacreations.com/tuto/lire/625-Adapter-legende-largeur.html 
	et http://www.alsacreations.com/article/lire/539-Centrer-les-elements-ou-un-site-web-en-CSS.html */
table.illustration {width: 50px; /* important */} 
table.illustration td {padding: 5px; /* cosmétique */ border-color:#999;}
table.illustration p {font-size:0.8em; padding: 0 0.3em;}

.justifie-gauche {float:left; margin-right:1em;}
.justifie-droite {float:right; margin-left:1em;}
.centre {margin: 0 auto;}

/* __________ Fin général __________ */


#conteneur {
	width: 750px; /* largeur du calque */
	border-right: 1px solid;
	border-bottom: 1px solid;
	position:relative;
}

#entete {
	height:55px; /* 55px-10px */	
	border-bottom: 1px solid;
	margin:0;
	padding:10px 0 0 10px;
	position:relative;
}

.entete-une, .entete-seconde {
	width:740px; /* 750px-10px */
 	background: url(../images-site/bandeau-haut.gif) no-repeat top right;
	}

.entete-popup {
}

#bandeau-image {
	margin-left: 150px;
	border-left: 1px solid;
	border-bottom: 1px solid;
}

/* Styles de la zone de contenu comprenant des propriétés permettant de fixer une hauteur minimale de 470px 
 selon une méthode décrite dans http://www.alsacreations.com/actu/lire/149-min-height-sur-internet-explorer.html 
 Cette hauteur de 470px correspond à la hauteur minimale requise pour éviter le recouvrement du menu déroulant par les icones de navigation, situées en bas de page */
#contenu {
	padding: 10px;
	height: 470px;
}

html>body #contenu {
	height: auto;
	min-height: 470px;
} 

.contenu_une {
	width: 428px;
	margin-left: 150px;
	border-left : 1px solid;	
	border-right : 1px solid;	
}

.contenu_seconde {
	width: 578px;
	margin-left: 150px;
	border-left : 1px solid;
}

.actualite img {
	float: left;
	margin: 0 10px 5px 0;
}

/* __________ Début menu gauche __________ */

#menu_gauche {
	width: 150px;
	position: absolute;
	left: 0;
}

.logo {
	border-bottom: 1px solid;
}

#menu_gauche a {
	font-weight: bold;
	text-decoration: none;
}

.liens_pointilles {
	padding: 5px;
	border-bottom: 1px dotted #446c7f;
	border-top: 1px dotted #446c7f;
	display: block;
	margin: 30px 0;
}

h3 {
	margin: 0;
	padding: 0;
	font-size: 1em;
	font-weight: bold;
}


/* Menu deroulant en CSS */

div#menu {
  position: relative;
  width: 150px; 
  margin: 0;
}

div#menu ul {
  margin: 0; 
  padding: 0; 
  width: 150px; 
  border-top: 1px solid;
}

div#menu ul.niveau1 {
  border: none;
}

div#menu li {
  position: relative; 
  list-style: none; 
  margin: 0;
  padding: 0; 
  border-bottom: 1px solid;
}

div#menu li a,  div#menu li span{
  display: block;
  font-weight: bold;
  text-decoration: none;
  padding: 4px 5px 4px 5px;
  width: 140px;
}

div#menu ul.niveau2 li a,
div#menu ul.niveau3 li a { 
  text-decoration: none;
  font-size: 0.916em; /* correspond à du 11px : notre base est 12px soit 0.75em, donc : 11/12= 0.916 */
  font-weight: normal;
}

div#menu>ul a {
  width: auto;
}

div#menu ul ul {
  position: absolute; 
  top: -1px; 
  left: 150px;
  display: none;
}

div#menu ul.niveau1 li:hover ul.niveau2, 
div#menu ul.niveau2 li:hover ul.niveau3 {
  display: block !important;
}


#recherche {
  position: relative;
  border-top: 1px dotted;
  border-bottom: 1px dotted;
  padding: 10px 6px 6px 6px;
  margin: 50px 0 0 0;
}

#recherche h2 {
  margin: 0;
  padding: 0;
  font-weight: bold;
  font-size : 12px;
}

#recherche p {
  font-size: 11px;
  margin: 0;
  line-height: 13px;
  padding: 0;
}

#recherche form {
  padding: 0;
  margin: 0;
}

#recherche input.box {
  position: relative;
  top: -6px;
  font-size: 10px;
  border: 1px solid;
  width: 100px;
  margin: 0 5px 0 0;
  padding: 1px;
}

#icones-navigation {width:150px; height:55px; position:absolute; bottom:10px;}

/* __________ Fin menu gauche __________ */



/* __________ Début menu droit (utilisation d'un div pour la une et d'un tableau pour les pages secondes) __________ */

#menu_droit {
	font-size: 0.916em; /* correspond à du 11px */
}

div#menu_droit {
	width: 150px;
	position: absolute;
	left: 600px;
}

table#menu_droit {
	float: right;
	margin: -10px -12px 1em 1em;
	width:150px;
	border:none;
}

table#menu_droit td {
	border-top:none;
	border-right:none;
	border-bottom: 1px solid;
	border-left: 1px solid;	
}

/* Hack IE6 Windows \*/
* html table#menu_droit {
	margin-right:-8px;
	margin-top:-13px;
 }
/* Fin hack IE6 */

div#menu_droit table{
	width:150px;
	border:none;
	margin:0;
}

div#menu_droit table td{
	border-top:none;
	border-right:none;
	border-bottom: 1px solid;	
	border-left: none;	
}

#menu_droit img {
	float: left;
	margin-right: 5px;
}

#menu_droit a {
	font-size: 1.083em; /* correspond à du 13px */
	font-weight: bold;
	text-decoration: none;
}

/* __________ Fin menu droit __________ */


/* __________ Début pop-up __________ */

.fermer-fenetre{
	display:bloc;
	position:absolute;
	top:0;
	right:0;
	font-size:0.8em;
	padding:0.8em;
	}

/* __________ Fin pop-up __________ */


/* __________ Début pages de second niveau __________ */

#chemin {
	margin-left: 150px;
	padding: 6px 10px;
	font-size: 0.916em;
	border-left: 1px solid;
	border-bottom: 1px solid;
}

#chemin a {
	text-decoration: none;
}

/* __________ Début galerie __________ */

#galerie {
	text-align: center;
	width: 579px;
	margin-left: 150px;
	border-left : 1px solid #f09415;
	padding: 10px;
}

.zoom {
	visibility: hidden;
	width: 579px;
	position: absolute;
	top: 290px;
	left: 151px;
	padding: 10px;
}

.zoom img {
	margin-bottom: 15px;
}

/* __________ Fin galerie __________ */


/* __________ Début menu horizontal __________ */

.menu_horizontal {
	font-family: Verdana;
	font-size: 1em;
	letter-spacing: 2px;
	margin: 15px 0 0 0; /* pour un placement identique sous IE et FF */
}

.menu_horizontal li {
	display: inline;
	margin: 0 5px; /* pour agrandir l'espace entre les blocs verts */
}

.menu_horizontal li a {
	color: #ffffff;
	text-decoration: none;
	background-color: #66954d;
	font-size: 1em;
	padding: 5px 8px 5px 8px;
}

.menu_horizontal li a:hover {
	background-color: #99cd00;
	color: #ffffff;
}

/* __________ Fin menu horizontal __________ */


/* __________ Fin pages de second niveau __________ */