/* CSS Document */

body {
	margin: 0;
	padding: 0;
	text-align:center;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#585858;
	background-image:url(images/cadre/fond.jpg);
}

#global {
	width:947px;
	margin:0px auto;
	text-align:left;
	padding:0px;
	border:0px;
}

/***************************************
*	Mise en forme du menu principal     
****************************************/

#menu {
	margin:0;
	padding:0;
	width:947px;
	height:213px;
	position:relative;
	overflow:hidden;
	background-image:url('images/cadre/menu-complet.png');
}

#titre_site {
	margin:0 0 0 20px;
	width:159px;
	height:213px;
	float:left;
	text-align:center;
}

#titre_site img{
	margin:24px 0 24px 0;
	border:0;
	height:110px;
	
}

#titre_site h1{
	height:32px;
	margin:0;
}

#banniere {
	margin:0 0 0 188px;
	width:742px;
	height:1866px;
	background-image:url('images/cadre/banniere.jpg');
}

#banniere img {
	margin:0 0 0 0;
	border:0;
	display:block;
}

#menu > a, #menu > a:hover, #menu > a:visited {
	float:left;
	margin: 15px 0 0 19px;
	padding:0;
	text-decoration:none;
}


#menu > a{
	color:#585858;
	margin:21px 0 0 0;
	text-decoration:none;
	font-weight:bold;
	font-size:14px;
}

#menu ul{
	background-image:url('images/cadre/menu-masque.png');
	background-repeat:no-repeat;
	width:100%;
	position:absolute;
	top:0;
	left:0;
	list-style:none;
	margin:0 0 0 182px;
	padding:131px 0 0 4px;
	height:66px;
}

#menu li{
	display:block;
	height:66px;
	margin:13px 0 0 0;
	padding:17px 0 0 0;
	float:left;
	
}

#menu li.haut{
	margin:0 0 0 0;
	padding:30px 0 0 0;
	
}

#menu li.bas{
	margin:13px 0 0 0;
	padding:17px 0 0 0;
	
}

#menu ul a{
	display:block;
	text-align:center;
	text-decoration:none;
	color:#585858;
	background-image:url('images/cadre/menu-etiquettes.png');
	background-repeat:repeat-x;
	height:32px;
	font-size:14px;
	padding:10px 0 10px 0;
}

#menu ul a:hover{
	text-decoration:none;
	color:#585858;
}

#menu ul a:visited{
	text-decoration:none;
	color:#585858;
}
/*
 * Fin de la mise en page du menu
 */


/******************************************************
 *  Mise en page du chapeau.
 *  Comprend : 
 *  - Le chemin de navigation
 *  - Les liens dons, participer, nous faire connaitre
 *  - Le titre de la rubrique
 *  - Le descriptif de la rubrique
 *  - le sous menu
 *******************************************************/

#chapeau{
	background-image:url(images/cadre/principal.png);
	background-repeat:repeat-y;
    margin: 0px;
	padding-top:5px;
	padding-bottom:10px;
	padding-left:20px;
	padding-right:20px;
}

#chemin {
	padding:5px 5px 5px 5px;
	margin: 0 10px 0 20px; 
	width:40%;
	float:left;
}

#participer {
	padding:5px 5px 5px 5px;
	margin: 0 20px 0 20px;
	text-align:right;
}

#rubrique_titre {
	clear:both;
}

#principal{
	position:relative;
	padding:15px 20px 50px 20px;
	background-image:url(images/cadre/principal.png);
	background-repeat:repeat-y;
	width:100%;
}


#sousmenu{
	margin-left: 23px;
	padding:0;
    float: left;
	width:100px;
}

/******************************************************
 *  Mise en page du reste de la page.
 *******************************************************/

#contenu{
	width:730px;
	margin :0 10px 20px 145px;
	padding:0;
}

.bloc {
	margin:0 0 20px 0;
	text-align:justify;
	clear:right;
}

.texte {
	width:473px;
}

.illustration{
	text-align:center;
	margin: 0 0 10px 20px;
	float: right;
	width:250px;
	padding:0;
	
}

#facebook_partager{
	text-align:right;
}

#agrements {
	text-align:center;
	vertical-align:middle;
	background-image:url(images/cadre/principal.png);
	background-repeat:repeat-y;
	font-size: 11px;
	clear:both;
	padding:0 150px 1px 20px;
}

#agrements p{
	padding-top:15px;
}

#w3c {
	display:inline-block;
	text-align:left;
	vertical-align:baseline;
	width:130px;
	height:40px;
	float:left;
	margin:0px 0 0 20px;
}



#pied{
	height:54px;
	padding-left:14px;
	background-image:url(images/cadre/pied.png);
	background-repeat:no-repeat;
	margin:0 0 30px 0;
	
	font-size: 11px;
	color:#666666;
	padding:10px 20px 10px 20px;
}

#pied .gauche{
	width:350px;
	text-align:left;
}

#pied .droite{
	padding:0;
    float: right;
	width:350px;
	text-align:right;
}


#pied a {
	display:block;
}

p {
	margin:0 0 10px 0;
	padding:0;
}

.finFlottant {
	clear:both;
}

/******************************************************
 *  Mise en page specifique pour le sommaire.
 *******************************************************/

.sommaire div#articles {
	float:left;
	width:570px;
	margin :0 10px 20px 80px;
	padding:0;
}

.sommaire div#breves{
	width:200px;
	margin :0 10px 0 675px;
	padding:0;
	
}

.sommaire ul{
	margin:0;
	padding:0;
	list-style:none;
}

.sommaire li{
	position:static;
}

.sommaire #articles li{
	margin : 0 0 50px 0;
}

.sommaire #articles .texte{
	width:100%;
	text-align:justify;
	clear:right;
}

.sommaire #articles .illustration{
	float:right;
	margin:0 5px 5px 5px;
	width:180px;
}

.sommaire #breves .texte{
	width:100%;
	text-align:justify;
}

.sommaire #breves h3 {
	font-size: 16px;
}

.sommaire #breves div.trait{
	margin:0 0 0 10px;
	padding:0 0 0 10px;
}

.sommaire #breves a, .sommaire #breves a:hover, .sommaire #breves a:visited{
	text-decoration:underline;
}

.sommaire #breves a.hdp, .sommaire #breves a.hdp:visited{
	text-decoration:none;
	color:#585858;
}

.sommaire #breves a.hdp:hover {
	text-decoration:underline;
	color:#585858;
}

.sommaire #breves iframe {
	margin:50px 0 0 0;
	border:none; 
	overflow:hidden; 
	width:200px; 
	height:350px;
}

.finFlottants{
	clear:both;
}