/************************/ 
/*** styles généraux ***/
/***********************/ 

html, body{
	margin: 0; 
	padding: 0;border:0px;
	color:#000;
	font: 9pt/16pt Arial, Helvetica;
}

 body {
 height:100%;
}
 
img { 
 border:0;
 padding:0; 
 margin:0;
 }
 
 img a, td img a {
 border:1px solid #2254A0; 
 }
 img a:hover, td img a:hover{
 border:1px solid #209740; 
 }
 
 h3 {
	font:normal 1.3em Arial, Helvetica;
	color:#2254A0;
	padding-right:0.25em;
	margin:0 148px 0.5em 0;
	border:0;
}


h4 {
  	font: normal 1.1em Arial, Helvetica;
	color:#2254A0;
  	padding:0.1em;
	margin:0.5em 0 0.5em 0;
  	border-top:1px solid #DEDEDE;
	border-bottom:1px solid #DEDEDE;
  }
  
h5 {
  	font: bold 1em Arial, Helvetica;
	color:#000;
  	margin:0.5em 0 0 0.5em;
  	padding:0;
  	border:0;
  } 
  
    
  p {
font: normal 1em Arial, Helvetica;
color:#000;
padding:0;
margin:0.5em;
} 

hr {
height:1px;
color:#ccc;
padding:0.5em;
margin:0 148px 0 120px;
text-align:center;
border:0;
}

 ul {
	margin:0; 
	padding:0.5em;
	border:0;
} 	

 li {
	list-style-type:none;
	font: normal 1em Arial, Helvetica;
	color:#000;
	list-style:none;
	margin:0;
	padding:0;
	border:0;
}

a {
font: normal 1em Arial, Helvetica;
color:#1E498B;
text-decoration:none;
/* border-bottom:1px dashed #90A9D0; */
}

a:hover {
font: normal 1em Arial, Helvetica;
color:#C4002C;
text-decoration:underline;
/* border-bottom:1px dashed #E18095;  */
}

fieldset {
	 font:normal 1em Arial, Helvetica;
	 color:#2254A0;
	 padding:0.20em;
	 margin:0.2em;
 } 

legend {
	font: bold 1em Arial, Helvetica;
	color:#2254A0;
	background-color:#fff;
	margin-bottom:0.5em;
	padding:0;
}

table {
	clear:both;
	border:0;
	padding:0;
	margin:0 0 1em 0;
}

td a img  {
 border:1px solid #2254A0;
 padding:0;
 margin:0; 
 }
td a:hover img {
 border:1px solid #209740;
  padding:0;
 margin:0; 
 }

.clear {
	clear: both; 
	padding:0px; 
	margin: 0px;
	border:0;
}

.legende {
	font:normal 1em Arial, Helvetica;
	color:#000;
	padding:0;
	margin:0 0 0.2em 0;
	border:0;
}

.par_intro {
font:normal 1em Arial, Helvetica;
padding:0;
margin:0.25 0.5em 0.25em 0.5em;
}

.mentions_cnil {
font:italic 1em Arial, Helvetica;
color:#8C8C8C;
margin:0.5em;
padding:0.25em;
border:0;

}

/***************************/
/*** conteneurs generaux ***/
/***************************/

div#general {
 	position: relative;
	width: 770px; 
	margin: 0px auto 0.25em auto;
	padding:0;  	
  	text-align: left;
	border:0;
}
 
div#contenu2 {
	padding: 0.5em;
	margin: 0 0 40px 150px; 
	border:0;
	background-color:#fff; 
	}
	
/*	HTML div#contenu2 {
	WIDTH: auto
}

 div#wrapper {
	MARGIN-RIGHT: 148px; 
	PADDING-TOP: 5px;
	border:2px solid #f00;
}

 HTML #wrapper {
	WIDTH: auto
}

div#container {
	
	MARGIN-LEFT: 150px; 
	BORDER: #ff0 2px solid;
} */

div#contenu_central {
    clear:both;
	position:relative;
	margin:0 148px 1em 0;
	padding:0.5em 0.5em 0 0;
	border:0;

	/* 
	position:relative;
	border:1px solid #000;
	margin:0 148px 1em 0;
	padding-right:0.5em; */
}

.marge {
	/* position:relative; */
	margin:0 148px 1em 0;
	padding:0 0.5em 0 160px;
	border:0;
} 
 	
/*************************/
/* *** partie entete *** */
/*************************/
 div#intro {
	margin:0;
	padding:0;
	border: 0;
}

div#entete_h1 {
 	border:0px; 
	padding: 0; 
	margin: 0px; 
	height: 114px;
}

div#entete_h1 span{
	display:none
}

div#menu_bandeau {
	padding:0;
	margin:-16px 0 0 150px;
	border:0;
	background-color:#006600;
	text-align:center;
	vertical-align:middle;
	width:473px;
}

.menu_accueil {
	border-bottom:1px solid #b0c0d9;
	margin:0;
	padding:0;
	height:15px;
	text-align:center;
	vertical-align:middle;
	width:100%;
}

.menu_accueil td {
	border-right:1px solid #b0c0d9;
	margin:0;
	padding:0;
	width:auto;
	text-align:center;
	vertical-align:middle;
}

div#menu_bandeau td a {
	font: normal 0.9em/15px Arial, Helvetica;	
	display: block;
	color:#2254A0;
	background-color:#fff;
	border:0px;
	 padding:0;
	text-align:center;
	margin:0px; 
	text-decoration: none;
}

div#menu_bandeau a {
	/* WIDTH: auto */
}
div#menu_bandeau a {
	/* FLOAT: none */
}
div#menu_bandeau td a:hover {
	font: normal 0.9em/15px Arial, Helvetica;
	display: block;
	color: #000;
	background-color:#FED403;
	border:0px; 
	 padding:0;
	text-align:center;
	margin:0px; 
	text-decoration: none;
}

/*****************************/	
/* *** contenu interieur *** */
/*****************************/	

div#titre_rubrique {
	height:30px;
	margin-bottom:0.5em;
	text-indent:45px;
	padding-right:0.5em;
}

div#titre_rubrique h2 {
 	font: normal 1.1em Arial, Helvetica;	
	color:#666;
	margin:0.5em 0 0.5em 0;
	vertical-align:bottom;
	padding-right:0.5em;
}

div#titre_rubrique h2 strong {	
 	/*color:#A3D1B7;*/	
 	 color:#221E1F; 
}

div#preambule {
	position:relative;
	font:normal 1em Arial, Helvetica;
	border:1px solid #000;
	margin:0.5em 150px 0.5em 0;
	padding:0.25em;
	text-align:left;
  } 
 
div#preambule p {
  	font: normal 1.1em Arial, Helvetica;
	color:#2254A0;
  	margin-bottom:0.5em;
	text-align:left;
  } 

div#image_accueil {
	float:left;
	border:0;
	margin:0;
	padding:0;
	width:150px;
}


div#image_accueil img {	
	border:1px solid #2254A0;
	padding:0;
	margin:0;	
}

/****  encart-type texte et media   ***/

div#texte-image {
margin:0.5em 150px 1.5em 0;
clear:both;
border:0;
padding:0;
}

div#texte-image img {
clear:both;
position:relative;
float:left;
border:0;
padding:0;
margin:0 0.5em 0.5em 0;
}

div#texte-image p{
border:0;
margin:0;
}


div#contenu2 h4.titre {
clear:both;
font: normal 1.1em Arial, Helvetica;
padding:0.25em;
margin-right:150px;
border:0;
color:#2254A0;
border:0;
background-color:#EDF0F7;

}

p .date {
font: bold 1em Arial, Helvetica;
color:#2254A0;
}

p .rens {
font: bold 1em Arial, Helvetica;
color:#2254A0;
}

p .acces {
font: bold 1em Arial, Helvetica;
color:#2254A0;
}

p .lieu {
font: bold 1em Arial, Helvetica;
color:#2254A0;
}

div#texte-image fieldset {
	font:normal 1em Arial, Helvetica;
	color:#2254A0;
	padding: 0.25em;
	margin:0.25em 0 0.25em 0;
 } 

div#texte-image fieldset p {
padding:0;
margin:0.25em 0 0.25em 0;
}

  
  /************************/
/* *** liens visuels ***/
/***********************/

div#liens_visuels {
	clear:both;	
	padding-right:148px;
	margin:2em 148px 0 0;
	border:0;
	padding:0;
}
  
div#liens_visuels h3 {
   font: normal 1.2em Arial, Helvetica;
   color:#000;
   border:0px;
  margin:0.5em;
  padding:0;
  text-align:left;
}

div#liens_visuels img {
align:left;
border:1px solid #006;
margin:0.5em;
padding:0;
}

/****************************/
/* *** partie de droite *** */
/****************************/

/* div#fond_liste_liens {
 position:absolute;
	 top:113px;	
	float:right;
	margin-left:630px;
	right:0px; 
	margin:0;
	padding:0;
	border:1px dotted #f40;
	width:148px; 
	height:100%;
	background-color:#006;
	  background:  url(/php/images/fond_liste_liens.gif) 0% 100% no-repeat; 
 }*/


 div#liste_liens {
	position:absolute;
	top:114px; 
	float:right;
	margin:0 ;
	right:0px;
	width:146px; 	
	padding:2px 0 0 0;
	border:0;
	/*background-color:#c00;
	  background:  url(/php/images/fond_liste_liens.gif) 0% 100% no-repeat; */
 }

 
div#liens {
	clear:both;
	padding:0px;
	background-color:#fff;
	margin:2px 0 2px 2px;
 	width: 142px;
	border:0;	
 } 
 
 div#liens h3, div#liens h3 a {
 font:  bold 1em Arial, Helvetica;
 color:#2254A0; 
  margin:0;
  border:0px;
 text-align:center;
 text-decoration:none;
 display:block;
 }

 div#liens h3 a:hover {
 	font: bold 1em Arial, Helvetica;
 	color:#C4002C;
   margin:0;
   border:0px;
 	text-align:center;
 	text-decoration:underline;
 	display:block;
 }

  div#liens p {
 font:normal 1em Arial, Helvetica;
 color:#909092;
  margin:0 0 2px 2px;
  border:0px;
 padding:0px;
 }
  
 div#liens  a {
 font:normal 1em Arial, Helvetica;
 color:#2254A0;
 margin:0px;
 border:0px;
 padding:0px;
 text-decoration:none;
 }
 
 div#liens a:hover {
 font:normal 1em Arial, Helvetica;
 color:C4002C;
 margin:0;
 border:0;
 padding:0;
 text-decoration:underline;
 }
 
 /* div#liens  li a {
 font:normal 1em Arial, Helvetica;
 color:#909092;
  margin:0;
  border:0px;
 padding:0px;
 text-decoration:none;
 display:block;
 text-align:left; 
 }
 
 div#liens li a:hover {
 	font:normal 1em Arial, Helvetica;
	color:#909092;
	 background-color: #FED403; 
  	margin:0;
  	border:0px;
 	padding:0px;
 	text-decoration:underline;
 	display:block;
 	text-align:left;
 } */
  

/*************************/ 
/* menu general de gauche*/
/*************************/ 

 div#menugeneral {
position:absolute;
top:114px;
left:0px;
 width:150px; 
border:0;
padding:0;
margin:0;
/*background : # 006 url(/php/images/fond_mairie_menu.gif) 0 0 no-repeat; 
background-color:#006;
background: transparent url(../images/armoirie.gif) -2px 30px no-repeat;*/
}
 
  div#conteneurmenu { 
	padding:0px 2px 0 2px;
	 width:150px;
	 border:0;
} 
 
 div#conteneurmenu p.titre_menu {
 /*background-color:#D3DBEF;*/
	text-align:center;
	margin:0;
	padding:0;
	width:146px;
	border:0;
	margin:0 2px 0 2px;
} 

div#conteneurmenu a.titre_menu_lien {
	font: normal 1.7em/25px Arial, Helvetica;
 	/* color:#b0c0d9; */
	text-decoration:none;
	text-align:left;
	display:block;
	border:0;
	/* border-bottom:2px solid #F3D200; */
	padding:0;	
	width:146px;
	margin:0 2px 0 2px;
}

div#conteneurmenu a.titre_menu_lien:hover {
	font: normal 1.7em/25px Arial, Helvetica;	
 	/* background-color:#b0c0d9;
 	color:#fff; */
	text-decoration:none;
	text-align:left;
	display:block;
	border:0; 
	/* border-bottom:2px solid #F3D200; */
	padding:0;
	width:146px;
	margin:0 2px 0 2px;
}

div#conteneurmenu p.fond_menu span {
font-size:1px;	
}
/* *** menu deroulant de gauche *** */
@media print {
/*A l'impression on cache le menu, marche au moins pour IE, Moz et Opéra.*/
	.menu, .ssmenu {
		visibility:hidden;
	}
}
/* *** styles du menu de sylvain... *** */

.menu {
	/* border-bottom:0.25em dotted #2254a0; */
	padding:0 2px 0 2px;
	/* background: transparent url(/php/images/picto_menu_off.gif) 0 0 no-repeat; */
/* width et margin sont au cas où le javascript est désactivé. 
	width:13em;
	margin:1em;*/
	/* FILTER: progid:DXImageTransform.Microsoft.Shadow(direction=135,color=#ccc,strength=3); */
	width:150px;
	/* border-bottom:0.25em dotted #2254a0; */
	text-align:center;
	
	
}

.ssmenu {
	border:0px;
	padding:0;
	width:145px;
/* width et margin sont au cas où le javascript est désactivé. */
	width:13em;
	margin:0;
	/* FILTER: progid:DXImageTransform.Microsoft.Shadow(direction=135,color=#ccc,strength=3); */
}

/* .menu = les cases toujours visibles (comme Fichier, Edition... dans un logiciel) */
.menu {
	text-align:left;
	width:150px;
	padding:0 2px 0 2px;
	/* background: url(/php/images/picto_menu_off.gif) 0 0 no-repeat; */
}

/* .ssmenu = Les parties "déroulantes" qui s'affiche au survol d'un .menu */
.ssmenu {
/* aller pour faire joli sur IE, un petit effet de dégradé !
	Pour voir d'autres effets :
	http://msdn.microsoft.com/workshop/samples/author/dhtml/DXTidemo/DXTidemo.htm
	Par exemple :
	transparence à 25% = opacité à 75%:
		
	"Glow" :
		FILTER: progid:DXImageTransform.Microsoft.Glow(color=#ffdead,strength=5);	
	
	FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#cccccc,endColorStr=#f6f6f6);
	white-space : no-break;
	
	Ombre en bas à droite, 5 px :
		FILTER: progid:DXImageTransform.Microsoft.Shadow(direction=135,color=#006,strength=5);

	
	FILTER: progid:DXImageTransform.Microsoft.Alpha( style=0,opacity=75);
	*/
	
}

.menu  span, .ssmenu span {
/* Ne pas toucher
	C'est pour cacher les ; en fin de <li>, ce qui permet aux synthèse vocales de prendre une
	pause dans l'élocution 
	display:none;
	width:150px;*/
}

div#conteneurmenu .picto_titre {
/* Ne pas toucher
	C'est pour cacher les ; en fin de <li>, ce qui permet aux synthèse vocales de prendre une
	pause dans l'élocution 
	display:none;*/
	font:normal 1.3em/20px Arial, Helvetica;
	/* color:#221E1F; */
	color:#C4002C;
	margin:0 0.25em 0.25em;
}

.ssmenu ul, .ssmenu li {
/* Ne pas trop toucher.
	Les items (les <li>) des sous-menus, notamment pour enlever les puces des liste */
	padding:0;
	margin:0;
	list-style-type:none;
	width:145px;
}

.menu a, .menu a:visited {
/* Les liens qui ne sont pas sous le curseur. */
	font: normal 1.1em/25px Arial, Helvetica;
	/* color:#221E1F; */
	color:#000;
	/* color:#2254A0; */
	/* background: transparent url(/php/images/picto_menu_off.gif) 0px 5px no-repeat; 
	background: transparent url(/php/images/picto_menu_off.gif) 0px 5px no-repeat;*/ 
	padding:0;
	text-decoration:none;
	text-indent:0.25em;
/* Ne pas modifier le block, margin et width 
	display:block;*/
	width:146px;
	margin:0 2px 0 2px;
	border:0;
}

 .ssmenu a, .ssmenu a:visited {
/* Les liens qui ne sont pas sous le curseur. */
	font: normal 1.1em/25px Arial, Helvetica;
	background-color:#FDF8D9;
	color:#221E1F;
	padding:0;
	text-decoration:none;
	text-indent:0.25em;
/* Ne pas modifier le block, margin et width */
	display:block;
	margin:0 2px 0 2px;
	width:146px;
}

html>body .menu a, html>body .menu a:visited, html>body .menu a:hover, html>body .menu a:active,
html>body .ssmenu a, html>body .ssmenu a:visited, html>body .ssmenu a:hover, html>body .ssmenu a:active {
	width:auto;
}

.ssmenu ul:hover, .ssmenu a:focus, .menu a:hover, .menu a:focus {
/* Les liens sous le curseur.
	On change les couleurs du texte et de fond, et on enlève le soulignement.
	*/
	font: normal 1.1em/25px Arial, Helvetica;
	color:#000;
	/* background: #FED403 url(/php/images/picto_menu_on.gif) 0px 5px no-repeat; */
	background-color:#FDF8D9;
	/* background: #FED403; */
	text-decoration:none;
	text-indent:0;
	display:block;
	padding:0;
	width:146px;
	margin:0 2px 0 2px;
}

.ssmenu ul:hover, .ssmenu a:hover, .ssmenu a:focus {
/* Les liens sous le curseur.
	On change les couleurs du texte et de fond, et on enlève le soulignement.
	*/
	font: normal 1.1em/25px Arial, Helvetica;
	background-color:#005FAF;
	color:#fff;
	text-decoration:none;
	padding:0;
	text-indent:0.25em;
	display:block;
	padding:0;
	width:146px;
	margin:0 2px 0 2px;
	border-bottom:1px solid #fff;
}


img {
/* Si on met une image dans un lien (par exemple un logo à gauche du lien), pas de bordure
	car c'est vilain :-p */
	border:none;
}

.ssmenu img {
/* un petit espacement entre l'image et le texte du lien <a href="..."><img.../>blabla</a> */
	margin-right:2px;
}

.ssmenu img.hr {
/* Encore un peu expérimental, un <hr /> entre deux items pour faire un "séparateur"... */
	margin-top:1px;
	margin-bottom:1px;
	margin-left:0;
	margin-right:0;
	width:100%;
	display:block;
}

/*
Bref... pour résumer, ce qu'il y a à modifier à la base, c'est :
- couleurs, police, bordure.
- l'effet spécial IE pour les ssmenu si on aime ça...
- police et couleurs des liens "non survolés" et "survolés".
*/


/*************************/ 
/****   bas de page    ***/
/*************************/ 

#footer {
	BORDER-TOP: #888 1px dashed; 
	MARGIN-TOP: 1.5em; 
	BACKGROUND: #f0f1f0; 
	MARGIN-RIGHT: 0px
}

div#basdepage {
clear:both; 
	margin:0;
	padding:0 ;
	border:0;
	width:770px;
	text-align:center;
	margin:0 ;	 
 }
 
 div#basdepage a.mention:link, div#basdepage a:visited
{ 
	font:normal 1.1em Arial, Helvetica;
	color:#909092;
	margin-right:1.5em; 
	text-decoration:none;
	border:0;
	vertical-align:bottom;
}

 div#basdepage a:hover
{ 
	font:normal 1.1em Arial, Helvetica;
	color:#2254A0;
	margin-right: 1.5em; 
	text-decoration:underline;
}

	 p a.mentionslegales:link,  p a.mentionslegales:visited {
	font:normal 1.1em Arial, Helvetica;
	color:#909092;
	text-decoration:none;
	border:0;
	vertical-align:bottom;
	text-align:center;
}

 p a.mentionslegales:hover { 	
	color:#2254A0;
	text-decoration:underline;
}


/*************************/ 
/* *** associations **** */
/*************************/ 

div#contenu2 .associations {
	text-align:center;
	width:98%;
	border:1px solid #000;
	margin:0 0 0 0.5em;
}

div#contenu2 .associations td{
	text-align:center;
	width:35px;
	border:0;
	margin:0px;
}

div#contenu2 .associations a {
	font:normal 1.1em Arial, Helvetica;
	color:#2254A0;
	text-decoration:underline;
	border:0;
	margin:0;
	display:block;
}

div#contenu2 .associations a:hover {
	font:normal 1.1em Arial, Helvetica;
	color:#fff;
	background-color:#C4002C;
	text-decoration:underline;
	border:0;
	margin:0;
	display:block;
}

/*************************/ 
/*** classes diverses ***/
/*************************/ 

.gras {
	font-weight:bold;
	}

td.table_general {
width:50%;
text-align:center;
padding:0.25em;
margin:0;
border:0;

}

.googleform {
padding:0;
margin:0 0 30px 0;
text-align:center;
 width:144px;
 border:0;
}

#googlediv {
clear:both;
 padding:0;
 margin:5px 0 0 0;
	
}