/***
 *
 * Structure du document :
 *
 ***/

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #333333;
	text-align: center;
	height: 100%;
	margin:0px;
	padding:0px;
}

#contenu{
	/* Ce style permet de centrer le document sur la page */
	/* background-color: #339999; */
	min-height: 100%;   /* On force le document a prendre toute la hauteur de la page */
	width: 810px;
	position:relative;
	padding:0px;
	margin: 0 auto;
	text-align: left; /* Pour rétablir l'alignement à gauche (à cause du centrage en body pour IE) */
}

#header {
	/* background-color: #CCFFFF; */
	color:#000000;
	width:810px;
	height:137px;
	margin:0px;
	padding-top:0px;
	background-image: url(images/feuillage_naturel.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	clear:both;
}

#colonneGauche{
	/* background-color: #FFFFCC; */
	position:relative;
	float:left;
	width:360px;
	padding:0px;
}


#colonneDroite{
	/* background-color: #FFFFFF; */
	position:relative;
	float:right;
	width:400px;
	padding:0px;
}

#footer{
	width:810px;
	padding:0px;
	clear:both;
	padding-top: 30px;
	/*display:block;	*/
}

/* espace pour la signature du Cap Bleu Communication dans le footer */
#signatureCBC{
	float:right;
	background-image:url(images/Vagues_CBC_petit.png);
	background-position:left;
	background-repeat:no-repeat;
	padding-left:12px;
}


/***
 *
 * Styles des liens :
 *
 ***/

a:link,a:visited {
	text-decoration: none;
	color: #333333;
}
a:hover {
	color: #333333;
	text-decoration: underline;
}

/***
 *
 * Style du logo :
 *
 ***/

.logo {
	margin-right: 10px;
	float:left;
}


/*** 
 *
 * Styles pour la zone des articles (colonne de droite)
 *
 ***/

/* Le style de base des article */
.article{
	margin-bottom:3em;
	color: #000000;
	font-size: 10px;
}


/* le titre d'un article */
.article H1{
	color: #ff6600;
	font-size: 20px;
	clear: left;
	display: block;
	padding-bottom:3px;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-bottom-color: #FF6600;
}

/* le sous-titre d'un article */
.article H2{
	color: #ff6600;
	font-size: 16px;
	clear: left;
	display: block;
	font-weight: normal;
}

/* Le corps de l'article*/
.article p{
	color: #000000;
	text-align: justify;
	margin-bottom: 1em;
}

/* Pour les images en position de lettrine dans l'article */
.article .lettrine {
	float: left;
	margin-right: 1em;
	margin-bottom: 1em;
	border: none;
}


/* Pour les images en forme de bandeau */
.article .bandeau {
	margin-top: 1em;
	/* margin-bottom: 1em; */
	margin-left: auto;
	margin-right:auto;
	border: none;
	clear: both ;
	display: block;
}

/* Légende pour les images dans les articles */
.article .legende {
	position:relative;
	margin-top: -2em;
	margin-bottom: 6px;
	padding:0px;
	font-size: 0.9em;
	color: #666666;
}



/*** 
 *
 * Styles pour le menu
 *
 ***/
 
 .element_menu {
 	display: table;
	width:75px;
	float:left;
	margin-right:8px;
 }
 
 .element_menu h1 {
	font-weight: bold;
	padding:0px;
	margin-bottom: 2px;
	font-size:1em;
 }
 
 .element_menu h1.decallage {
	margin-top:45px;
 }
 
 /*** 
 *
 * Styles pour l'agenda
 *
 ***/
 
 #agenda {
	background-color: #FFE2D2;
	text-align: justify;
	padding: 10px;
	color: #333333;
	clear:both;
}

/* Titre de la section agenda */
#agenda h1 {
	font-weight: bold;
	text-align: left;
	text-indent: 0pt;
	color: #FF6600;
	font-size:1.1em;
}

/* Affichage des dates dans l'agenda */
#agenda .date {
	font-weight: bold;
	text-align: left;
	text-indent: 0pt;
}

/* Affichage du nom d'un evenement dans l'agenda */
#agenda .evenement {
	font-weight: normal;
	text-align: left;
	text-indent: 0pt;
	color: #A40600;
}

 /*** 
 *
 * Styles pour l'agenda
 *
 ***/

#arbredumois {
	border: thin solid #FF6600;
	margin-top: 15px;
}

 /*** 
 *
 * Styles pour les images avec une légende :
 *
 ***/
 
 .ImageAvecLegende {
 	display: table;
	width: 100px;    /* important ! Donne une taille mini au bloc pour que la légende soit visible. Si l'image est plus grande le bloc s'adaptera a sa taille */
	padding:5px;
 }
 
 /* Le style de l'image */
 .ImageAvecLegende img {
 	padding: 0px;
	margin-bottom: 1px;
 }
 
 /* Le style de la legende */
 .ImageAvecLegende p {
	padding:0px;
	margin-top: 1px;
	font-size: 0.9em;
	color: #666666;
 }
