/*  ----------------------------------------------------------- */
/*  Feuilles de styles des squelettes par defaut pour SPIP 1.9  */
/*  ----------------------------------------------------------- */

/* taille typo
 * Base				100%
 * -------------------------------------
 * 20px				1.27em
 * 19px				1.21em
 * 18px				1.15em
 * 17px				1.09em
 * 16px				1.03em
 * 15px				0.96em
 * 14px				0.88em
 * 13px				0.82em
 * 12px				0.77em
 * 11px				0.71em
 * 10px				0.65em
 *  9px				0.59em
 * Attention : en dessous de 0.71em le texte devient illisible en text smallest sur MSIE
 */

/*****************************************/
/*     Correction des styles HTML par defaut      */
/****************************************/
body {
	behavior:url("../squelettes/js/csshover.htc");
	text-align: center;
	font-size: 11px;
	color: #4a4a4a;
	background:url("../IMG/banniere/fond-site.jpg") bottom repeat-x;
}

img {behavior: url(/pngHack/pngHack.htc);}	/*   comme la propriété behavior du body, celle ce permet de gérer les image en PNG sous Internet Explorer*/

img, table { margin: 0; padding: 0; border: none; }
ul, ol, li { margin: 0; padding: 0; }
ul { list-style: none; }
h1, h2, h3, h4, h5, h6 { margin: 0; padding-left: 2px; font-size: 13px; color:#afc931; }	/*   gestion des titres  */


/*****************************************/
/*  Disposition a l'ecran des blocs principaux    */
/****************************************/

#page {		/*   allure générale de la page qui contient le site  */
	width: 1024px;
	text-align: left;
	border:2px solid white;
	background:white;
	margin: auto;
}

#contenu{		/*  contenu principal de la page. Zone du milieu   */
	width:650px;
	height:770px;
	overflow:auto;

}

#conteneur #contenu {		/*  contenu principal de la page. Zone du milieu aussi   */
	float:left;
	padding:0 !important;
	padding:0;
	font-size:11px;
	text-align:justify;
	border:1px solid white;
	color:#4a4a4a;
}

/********************************************************************************************************/
/* Entete, bandeau du haut de la page qui contient le logo, la banniere, l'espace texte d'information, le menu horizontal      */
/*******************************************************************************************************/

#entete{		/*   allure générale du bandeau qui contient les images , la bannière et le menu des communes  */
    width: 1024px;
    color: #fff;
}

#entete a { text-decoration: none; }

.info-bandeau{		/* première bande du bandeau destinée à contenir éventuellement des informations */
	background:#e7941c url('../IMG/bg/menu-or.gif') repeat-x;
	padding:3px;
	color:white;
	font-size:11px;
	text-align:justify;
	min-height:11px;
	border-bottom:1px solid white;
}
.info-bandeau a {	color:#fff721; }		/*  couleur des lien dans tete > info-bandeau qui contient le texte*/
.info-bandeau a:hover {	color:#afc931; }

/*  proportion et mise en forme de l'image appelée en tant que logo de rubrique dans la banniere */

.image-bandeau img{ /* deuxième image du bandeau */
	height:200px;
	width:317px;
	border-left:2px solid white;
}

/* allure de la colonne d'information a droite de la photo dans le bandeau.
/* Cette div est destinée à recevoir des courts textes d'une information ponctuelle et précise
/* Pour faire en sorte qu'un article informatif apparaissent dans cet espace, il faut spécifier au moment de sa rédaction un mot-clé "evenement"   */

.informations{
	height:192px;
	float:right;
	width:244px;
	padding:4px;
	font-size:11px;
	line-height:0.5em;
	overflow:auto;
	text-align:justify;
	background:url('../IMG/banniere/fond-vert-trame.png') bottom right;
	color:white;
	}

.informations .texte{
	color:white;
}
	
.informations h3{
	color:white;
	padding:4px;
	line-height:12px;
}	

/*  langue est la bande qui contient le menu de navigation entre les communes*/

.communes{	/*  style des éléments commune du menu horizontal   */
	border-top:1px solid white;
	background:url('../IMG/bg/menu-or.gif') repeat-x;
	height:15px;
	padding:1px;	
	font-size:11px;
	color:white;
}

.communes a{	color:white; border-right:1px solid white; padding:1px 6px 3px 6px !important ; padding:4px 6px 5px 6px; margin-right:-3px;}
.communes a:visited{	color:white;}
.communes a:hover{	color:white;	background:url('../IMG/fond-commune.jpg') repeat-x bottom;}



/*************************************************/
/*            les div gérant la présentation du texte               */
/* *********************************************/

.introduction{  		/*   Ce nom peu explicite désigne les blocs qui contiennent le texte  de l'article*/
	padding:3px;
	border-bottom:1px solid #afc931;
	margin:0 3px 0 3px;
	line-height:10px;
	clear:both;
}

#contenu ul li{ 			/*  style des puces de liste dans la zone de contenu*/
	list-style-image: url(../IMG/liste.gif); 
}

/**********************/
/*  colonne de gauche     */
/*********************/

.gauche{		/*  Colonne de gauche qui contient le fichier menu-deroulant.html  */
	height:763px;
	float:left;
	width:182px;
	padding-top:8px;
	padding-right:3px;
	padding-left:3px;
	border-top:1px solid white;
	border-right:1px solid #dadada;
	background:#afc5e3 url('../IMG/banniere/gauche.jpg') bottom no-repeat;
}

/**********************/
/*  colonne de droite      */
/********************/

.droite{		/*  colonne de droite qui contient la météo et le calendrier  */
	height:771px;
	float:right;
	width:182px;
	border-left:1px solid #dadada;
	border-top:1px solid white;
	background:#e1e5e8 url('../IMG/banniere/droite.jpg') bottom no-repeat;
}

		/* Mise en forme de la météo  */
#meteo{
	width:170px;
	margin:auto;
	margin-top:10px;
	color:#4a4A4A;
	font-size:10px;
}

#meteo table{
	width:170px;
	border-collapse:collapse;
}
#meteo table tr td{
	border-bottom:1px solid #4A4A4A;	
}

/**************************************************************/
/* Fil d'Ariane qui permet au visiteur de toujours savoir où il se trouve  */
/*************************************************************/

#hierarchie { 		/*   div englobant le fil d'arianne  */
	clear: both;
	margin-bottom: 0px;
	font-size:11px;
	border-bottom:1px solid #bdd44C;
	color:#585858;
	padding:3px;
	background:url('../IMG/trame-grise.png') repeat-x top;
	}
	
table .tab-hierarchie{
	padding:1px;
}


/***************************************************************************************/
/*  colonne horizontale du menu des communes qui contient les boutons commune, mairie decouverte, historique etc etc    */
/**************************************************************************************/

.titre_commune{
	text-align:left;
	padding:5px;
	background-color:white;
	border-bottom:1px solid #e7941c;
	font-size:19px; 
	font-weight:normal; 
	font-family:verdana; 
	color:#e7941c;
	letter-spacing: 8px;
	margin-top:5px;
}

/*   div qui englobe (le fil d'ariane et liseré et nom de la commune) du sous menu */
.top {margin:auto;}	

/* le tableau est dans inc-menu-horizontal */
.sous-rub{float:left;}

.sous-rub a{	color:#AFC931;	padding:4px 150px 4px 1px; width:100%;}
.sous-rub a:visited{	color:#AFC931;	padding:4px 150px 4px 1px;}
.sous-rub a:hover{	color:#585858;	padding:4px 150px 4px 1px;}

.sous-rub td{		/*   padding des cellules du tableau contenant les images de sous-menu   */
	width:100%;
	padding:3px;
	text-align:left;
	border-bottom:1px solid #afc931;
}

/*****************************************/
/*       sommaire  |  style de la page d'accueil       */
/*****************************************/

.bande-accueil{		/*   hauteur du tableau qui contient les 3 cases de mise en avant d'articles ou d'évènements englobant toute la communauté de commune  */
	height:155px;
	padding:2px;
}

.bande-accueil table{		/*  Tableau contenant les 3 articles  */
/*   Cette ligne est elle prise en compte par IE. Les valeurs sont différentes car les 2 navigateurs n'ont pas la meme gestion des valeurs de pixels notamment pour les padding. !important; doit toujours être en premier pour être pris en compte */
	height:154px;
}

.lire_suite{float:right; margin:4px 2px 0 0;}

.news {
	width:205px !important;
	width:205px;
	margin:5px !important;
	border:1px solid #afc931;
	vertical-align:top;
	background:white;
}

.news h2 {		/*   titre des dernieres nouvelles  */
	font-size:11px;
	font-weight: normal;
	text-align:left;
	color:white;
	padding:3px;
	background:#AFC931;
}

.news  .news-texte{		/*   typo du texte contenu dans les colonnes du tableau  */
	font-size:10px;
	color:#585858;
	padding:3px;
	text-align:justify;
}
	
.news a{color:orange;}	
.news a:visited{	color:orange;}	
.news a:hover{text-decoration:underline; margin-left:2px;}



fieldset .liste_art li{
	list-style-type:none;
}

/**********************************************************************/
/*  Style du Bloc de l'accueil contenant les raccourcis vers le service public local  */
/**********************************************************************/

.spl{		
	width:217px;
	border:1px solid #AFC931;
	background:white;
}

.spl h2{
	padding:2px;
	border-bottom:1px solid #AFC931;
	background:#AFC931;
}

.spl-liste div{
	padding:3px;
	border-bottom:1px solid #AFC931;
}

.spl a{ color:#AFC931; padding-right:130px !important; padding-right:100px; padding-top:3px;padding-bottom:3px;}
.spl a:visited{ color:#AFC931;}
.spl a:hover{color:#585858 !important;color:#585858;}
.spl-liste div:hover{	background:#efefef;}


/*******************************/
/*                  Pied de la page               */
/*******************************/
#pied {	
	background:#e7941c url('../IMG/bg/menu-or.gif') repeat-x;
	text-align: center;
	border-top:1px solid white;
	padding:5px;
	height:25px;
}
#pied a{	color:#4a4a4a;}
#pied a:hover{	color:black;}

#pied small {padding-top:10px; font-size: 11px; }
#pied img { vertical-align: bottom; }



/*****************************/
/*             Espaceur de blocs               */
/*****************************/
.nettoyeur { clear: both; margin: 0; padding: 0; border: none; height: 0; line-height: 1px; font-size: 1px; }


/*************************************************************************/
/*          Non visible a l'ecran  |  utilisable pour des tests ou des référencements           */
/*************************************************************************/
.invisible { position: absolute; top: -3000em; height: 1%; }

/**********************************/
/*  Typographie generale du site           */
/*********************************/

/* Typo pour les menus et la navigation */
body, #navigation, .encart, .formulaire_spip {
	font-family: Verdana, "Bitstream Vera Sans", Tahoma, Arial, sans-serif; }

/* Typo pour le contenu */
#contenu {
	font-family: verdana,"Trebuchet MS", Helvetica, sans-serif; }

/* Typo pour les citations et extraits introductifs */
q, blockquote, .liste-articles li .texte, h3.spip, .voirskel {
	font-family: verdana,"Bitstream Vera Serif", Georgia, Times, serif; }

.soustitre{
	margin:2px 0 2px 0;
	font-weight:normal;
	font-size:10px;
	color:#e7941C;
}	

/**********************************/
/*  titrage des articles et des rubriques */
/*********************************/

.menu-titre {
	padding: 0.2em 0.4em;
	border-bottom: 1px dotted #CCC;
	text-align: center;
	font-weight: bold;
}
/* ne sert pas actuellement */
#navigation p, .encart p { margin: 0; padding: 0.2em 0.7em; text-align: left;  }
#navigation ul, .encart ul { padding: 0.2em 0; text-align: left; }
#navigation li, .encart li { padding: 0 0.7em; }
/* ne sert pas actuellement */

#contenu .titre { 		/*   style des titres d'article dans la page */
	padding-left:5px;
	border-bottom:1px solid #afc931;
	margin:8px 3px 5px 3px;
	font-family:Trebuchet MS;
	letter-spacing: 6px;
 }
 
 #contenu .titre h3{ 		/*   style des titres H3 d'article dans la page */
  color:#afc931;
  font-weight:normal;
  padding-top:14px;
 }

#contenu .titre img{   		/*   style si il ya une image à afficher dans un titre, comme un logo d'article..... */
 margin-right:5px;
 vertical-align:top;
}


/***************************************/
/*   Mise en forme des textes du contenu       */
/**************************************/

/*   style du chapo (résumé) des articles */
.chapo { 		
	margin-bottom: 1.5em;
	line-height: 1.4em;
	font-size:11px;
}

/*   style du texte des articles dans la colonne centrale contenu   */
.texte { 
	color: #434343; 
	font-size: 11px; 
	margin-bottom:15px; 
	line-height: 14px !important;
	line-height: 15px;
} 		

/*   style des listes dans les articles   */
.texte ul{	padding: 0 0 0 30px;}
.texte ol{	padding: 0 0 0 30px;}

/*   style des tableau dans les textes */
.texte table{padding:3px;}

/*********************************/
/*                Couleurs des liens                     */
/*********************************/
a { color:#4a4a4a; text-decoration: none;}
a:visited{color: #4a4a4a; }
a:hover {color:#e7941c;}

hr{  		/*   allure des filets de séparation   */ 
 border:1px solid #24ABC2;
}

/**************************************/
/*             Formulaire de recherche               */
/*************************************/
.formulaire_recherche { float: left; }		/*style du formulaire de recherche si formulaire il y a  */

.formulaire_recherche { float:right; text-align: right; width: 12em; color:red; font-family:verdana; }
.formulaire_recherche label { display: none; }


/**********************************************/
/*    Elements de formulaires & liste des evenments     */
/*********************************************/

fieldset{		/*   classe du fieldset concernant uniquement le liseré du nom de la rubrique   */
	margin-top:10px;
	margin-bottom:3px;
	border:1px solid #e7941c;
	padding:3px 4px 4px 6px;
}

fieldset p{		/*   gestion du fieldset pour les paragraphes de texte  comme par exemple dans les forums  */
	padding-right:2px;
	text-align:left;
}

/* couleur du texte du nom de la commune */
legend{color:#e7941c;}

select{
	border:1px solid #585858;
	color:#585858;
	font-size:11px;
}

.middle {vertical-align:top;}

.valid-article{
	border:1px solid #585858;
	background:#bdd44c;
	color:#585858;
	font-size:11px;
}

/*    Allure des boutons de validation de formulaire  */
.forml{
	font-family:Verdana;
	font-weight:normal;
	color:#585858;
	margin-top:20px;
	margin:auto;
	vertical-align:middle;
	font-size:10px;
	width:105px !important;
	width:115px;
}

/**********************************/
/*             Lettre d'information               */
/*********************************/
.lettre-info{
	border:1px solid #afc931;
	width:300px !important;
	width:280px;
	height:270px;
	margin:5px;
	float:left;
	padding:5px;
	line-height:1.5em;
}

.modif-abonnement{
	border:1px solid #afc931;
	width:300px;
	height:270px;
	margin:5px;
	float:right;
	padding:5px;
	line-height:1.5em;
}

.connexion{
	border:1px solid #e7941c;
	width:300px;
	margin:5px;
	float:left;
	padding:5px;
	line-height:1.2em;
}

.lettre-info h4, .modif-abonnement h4{
	color:#585858;
	font-style:italic;
	padding:3px;
	font-size:11px;
	font-weight:normal;
	border-bottom:1px solid #585858;
	border-top:1px solid #585858;
	margin-bottom:5px;
} 

.lettre-info legend,  .modif-abonnement legend{
	font-size:11px;
	color:#afc931;
}

.connexion legend{
	color:#e7941c;
}

/***********************************/
/*  Habillage specifique du plan du site */
/*********************************/

.page_plan .cartouche { display: none; }

.page_plan #contenu h2 {
	clear: both;
	background: #EEE;
	border: 1px solid #CCC;
	padding: 0.5em;
	margin-bottom: 1em;
	font-weight: bold;
	text-align: center; }

.contre-encart{
	height:auto;
}	
	
.page_plan #contenu .contre-encart ul {
	display: block;
	clear: left;
	margin-left: 1em;
	margin-bottom: 1em;
	list-style: square; }
.page_plan #contenu .contre-encart li { list-style: inherit; }


.li-rech{
	padding:2px 0 2px 30px;
}


/**************************************/
/*            Portfolio                                            */
/**************************************/
#documents_portfolio img{
margin:3px;
opacity:0.7;
}

#documents_portfolio img:hover{
opacity:1;
}

.portfolien img{
	margin:10px;
	border:7px solid #585858;
}	

/********************************/
/*                     Agenda                          */
/********************************/

.agenda{
	float:right;
	width:310px !important;
	width:305px;
	margin:10px 10px 0px 10px !important;
	margin:10px 10px 5px 10px ;
	padding:5px;
	border:1px solid #afc931;
	background:white;
}

.agenda a{color:#AFC931;}
.agenda a:visited{color:#AFC931;}
.agenda a:hover{color:#AFC931;}


.agenda li{
	margin:2px 2px 2px 20px;
	color:white;
}

.agenda-liste a{	color:#585858;}
.agenda-liste a:visited{	color:#585858;}
.agenda-liste a:hover{color:#afc931;}

.agenda-titre{
	letter-spacing:0.5px;
	color:#AFC931;
	margin:2px;
}

.agenda-dernier {
	color:white;
	border:1px solid #AFC931;
}
.agenda-dernier p{
	padding:3px;
	background:#dadada;
	border:1px solid #AFC931;
}