/*  ----------------------------------------------------------- */
/*  Feuilles de styles des squelettes du site de Surtainville   */
/*  ----------------------------------------------------------- */


body {

	background-color:#FBF7CD;
	margin:auto;
	padding:auto;
	width: 100%;
}


img, table { margin: 0; padding: 0; border: none; }
ul, ol, li { margin: 0; padding: 0; }
ul { list-style: none; }

/**********header **********/

#langue {
	position: absolute !important;
	position/**/:relative;
	top: 25px !important;
	top/**/:40px;
	left: 780px;
	font-size:14px;
	color:white;
	font-family: Arial;
	font-weight: bold;
}

#langue a{
	font-size:14px;
	color:white;
	font-family: Arial;
	font-weight: bold;
}

#entete { 
  background-image: url(img/header.gif);
  background-repeat: no-repeat;
  height:135px;
  width: 884px;
  padding: 0px;
  border: none;
  margin-left: 63px;
  margin-top: 0px !important;
  margin-top/**/:0px;
 }
 
 
 #entete-en { 
  background-image: url(img/header_en.gif);
  background-repeat: no-repeat;
  height:135px;
  width: 884px;
  padding: 0px;
  border: none;
  margin-left: 63px;
  margin-top: 0px !important;
  margin-top/**/:0px;
 }
#entete .formulaire_recherche { float: right; }

#fond{ 
  background-image: url(img/fond.gif);
  background-repeat:no-repeat;
  height:auto;
  width: 884px;
  top: 0px;
  margin-left:65px;
 }


#bandeau {
	height: 55px;
	width: 800px;
	overflow: hidden;
	margin-left:48px;
}


#vague{
	position:relative;
	background:none;
	margin-top: -32px;
	margin-left: 47px;
	height: 33px;
	width: 801px;
}


/************** Disposition a l'ecran des blocs principaux***********/

#page {
	width: 950px;
	position:relative;
	height: auto;
	text-align: left;
	margin: 10px auto;
	
}

#fondmenu {
  background-image: url(img/fond.gif);
  background-repeat:repeat-y;
  width: 884px;
  height: 40px;
  margin-left:65px;
}

#menu {
	margin-top: 5px !important;
	margin-top/**/: 10px;
	margin-left:55px !important;
	margin-left/**/:28px;
	margin-right:auto;
	width: 884px;
	float:left;
}

#fondconteneur {
  background-image: url(img/fond.gif);
  background-repeat:repeat;
  width: 884px;
  height:auto;
  overflow:hidden;
  margin-left:65px;
}

#conteneur {
	width: 825px !important;
	width/**/:840px;
	float:left;
	margin-top:0px !important;
	margin-top/**/:30px;
	margin-left: 40px !important;
	margin-left/**/:25px;	
}

 #contenu{
	margin-top: 5px;
	height:auto;
	margin-right:19px !important;
	margin-right/**/:18px;
	float: right;
	width: 77% !important;
	width/**/:75.5%;
	overflow: auto ;
	padding:0;
	padding-right:5px;
 }

#colGauche {
	float: left;
	width: 10%;
	height:auto;
}

/*********************Livre d'or****************/

#livredor {
	margin-top: 280px;
	width: 90%;
	padding-left:2px;
	padding-right:2px;
	padding-top:0px !important;
	padding-top/**/:10px;
	height: auto;
	border: 0px;
}

#livreor {
	float: right;
	width: 93%;
	margin-left:auto;
	margin-right:auto;
	height:auto;
}

#livreor form {
	float: left;
	margin-top: 20px;
	width: 91%;
}

.message {
	color: black;
	font-size: 14px;
	font-family: "Trebuchet MS", sans-serif;
	text-align: left;
	margin-left: 15px;
    
}

.message:first-letter {text-transform: uppercase;}

.message_under {
	color: black;
	font-size: 14px;
	font-weight: bold;
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	text-align: justify;
	margin-left: 15px;
	margin-right: 10px;
}

#message_livre {
	color: black;
	font-size: 14px;
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	text-align: justify;
	margin-left: 15px;
	margin-right: 10px;
	padding:15px;
	border:1px solid black;
}

.spip_encadrer legend{
	font-family: "Arial";
	font-size: 14px;
	font-weight: bold;
	text-align: left;
}

.spip_encadrer td{
	float:left;
	width:105px;
	font-family: "Arial";
	font-size: 13px;
}


#contact {
	width: 805px !important;
	width/**/: 800px;
	float:left;
	margin-top:0px;
	height:auto;

}

/*****gestion du calendrier*****/

#calendrier {
	width:158px;
	height: 144px;
	margin-top: 20px !important;
	margin-top/**/: 10px;
	margin-left: 0px;
	background-image: url(img/cadre_calendrier.gif);
	background-repeat: no-repeat;
}

/*****gestion des infos*****/

#news{
	width:161px;
	height: 296px;
	margin-left: 2px;
	margin-top:2px;
	background-image: url(img/cadre_news.gif);
	background-repeat: no-repeat;
}

.news {
	width:120px;
	text-align: center;
	font-family: Verdana;
	font-size: 10px;
}

#infos {
	width:120px;
	height: auto;
	margin-left: 11px;
	padding: 10px;
	text-align: center;
}

.infos-pratiques {
	width:110px;
	text-align: center;
	font-family: Verdana;
	font-size: 10px;
	margin-left:10px;
}

#infos-pratiques{
	width:151px;
	height: 440px;
	margin-left: 1px;
	margin-top: 20px !important;
	margin-top/**/: 10px;
	background-image: url(img/cadre_infprat.gif);
	background-repeat: no-repeat;
}

#infos-autres{
	height: auto;
	margin-left: 0px;
	padding:15px;
}

/***********Météo**************/

#meteo {
	width:160px;
	height: 141px;
	margin-left: 1px;
	margin-top: 0px;
	background-image: url(img/cadre_meteo.gif);
	background-repeat: no-repeat;
	padding:1.5px;
	margin:0;
}

.meteo{
	margin-top:6px;
	margin-left:3px;
	width:152px;
	text-align: center;
	font-family: verdana;
	font-size: 11px;
}


/***********Pied de page **********/

#pied {
  background-image: url(img/pied.gif);
  background-repeat:no-repeat;
  width: 884px;
  height:135px;
  overflow:hidden;
  margin-top:auto ;
  margin-left:63px;
  text-align: center;
  position:relative;

}

#under_pied {
  font-size: 11px;
  text-align: center;
  margin-left:70px;
}


/* 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 */
.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: "Trebuchet MS", Helvetica, sans-serif;
	font-size:14px;	}
	
	
.texte {
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	font-size:14px;
	text-align: justify;
margin-left:8px;
}


/* Typo pour les citations et extraits introductifs */
q, blockquote, .liste-articles li .texte, .voirskel {
	font-family: "Bitstream Vera Serif", Georgia, Times, serif;
}


/************Gestion des titres**********/

h1 {
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	
}

h2 {
	font-size: 16.5px;
	text-align: center;
	text-decoration: underline;
	font-family:verdana;
	font-weight:bold;
	padding:0;
	margin:0;
}

h5{
	font-size: 16.5px;
	text-align: center;
	text-decoration: underline;
	font-family:verdana;
	font-weight:bold;
}

h6{
	font-size: 13px;
	text-align: center;
	text-decoration: underline;
	font-family:verdana;
	font-weight:bold;
	padding:4px;
	margin:0;
	margin-top:5px;
}


h3, h4 { margin: 0; padding: 0; font-size: 1em; font-weight: normal; }


/*******Portfolio******/

#documents_portfolio {
	clear: both;
	margin-top: 1.4em;
	padding-top: 2px;
	border-top: 2px solid #CCC; }
#documents_portfolio h2 { margin-bottom: 0.4em; font-size: 0.88em; font-weight: bold; }

#document_actif { margin-top: 1em; }

/*  Listes de documents joints (a un article ou une rubrique)
---------------------------------------------- */
#documents_joints {
	margin-top: 1.4em;
	padding-top: 2px;
	border-top: 2px solid #CCC; }
#documents_joints h2 { margin-bottom: 0.4em; font-size: 0.88em; font-weight: bold; }
#documents_joints li { margin-bottom: 0.4em; }
#documents_joints li .spip_doc_titre {}
#documents_joints li .spip_doc_titre small { font-weight: normal; }
#documents_joints li .spip_doc_descriptif {}


/*  ------------------------------------------
/*  Couleurs des liens
/*  ------------------------------------------ */
a { text-decoration: none; color: #333; }
a:hover { text-decoration: underline; }