body{
	margin: 0px;
	padding: 0px;
	background-color: #e0efa3;
	background-image:url(images/fondpage.gif);
	text-align: center;
	margin-bottom: 30px;
}

/**********************************/
/*                                */
/*           INTERFACE            */
/*                                */
/**********************************/

div#global{
	width: 870px;
	margin-right: auto;
	margin-left: auto;
	text-align: left;
	margin-top: 10px;
	margin-bottom: 30px;
}

div#fondcontenu{
	width: 870px;
	background-image: url(images/fondcontenu.gif);
	background-repeat: repeat-y;
}

div#contenu, div#contenuaccueil{
	width: 870px;
	background-image: url(images/foot.gif);
	background-repeat: no-repeat;
	background-position: bottom left;
}

div#contenu{
	padding-bottom: 100px;
}

div#contenuaccueil{
	margin: 0px;
	padding: 0px;
	height: 340px;
}

div#gauche{
	width: 218px;
	margin: 0px;
	margin-left: 10px;
	float: left;
	display: inline;
}

div#droite{
	width: 632px;
	margin: 0px;
	margin-right: 10px;
	float: right;
	display: inline;
}

div#spacer{
	clear: both;
}

/**********************************/
/*                                */
/*             HEADER             */
/*                                */
/**********************************/

div#headaccueil, div#head{
	width: 870px;
	height: 417px;
	padding-top: 38px;
	background-image: url(images/logohaut.gif);
	background-repeat: no-repeat;
	background-position: 68px 0px;
}

div#head{
	height: 322px;
}

/**********************************/
/*                                */
/*         2 BOX ACCUEIL          */
/*                                */
/**********************************/

div#droite div#assainissement, div#droite div#recuperation{
	width: 316px;
}

div#droite div#assainissement div, div#droite div#recuperation div{
	margin-right: 15px;
	text-align: right;
}

div#droite div#assainissement{
	background-image: url(images/pointilles.gif);
	background-repeat: repeat-y;
	background-position: right;
	float: left;
}

div#droite div#recuperation{
	float: right;
}

div#droite div#assainissement div.texte, div#droite div#recuperation div.texte{
	margin: 10px;
	margin-bottom: 10px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 12px;
	color: #7a7a7a;
	text-align: justify;
}

div#droite div#assainissement div.texte img, div#droite div#recuperation div.texte img{
	float: left;
	margin-right: 10px;
}

div#droite div#assainissement div.texte a:link, div#droite div#assainissement div.texte a:visited, div#droite div#assainissement div.texte a:hover, div#droite div#recuperation div.texte a:link, div#droite div#recuperation div.texte a:visited, div#droite div#recuperation div.texte a:hover{
	color: #7db61a;
}

div#droite div#assainissement div.texte a:hover, div#droite div#recuperation div.texte a:hover{
	color: #3d8203;
}

/**********************************/
/*                                */
/*            CONTENU             */
/*                                */
/**********************************/

div#droite div.textecontenu{
	padding: 15px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 12px;
	color: #000;
}

div#droite div.textecontenu a:link, div#droite div.textecontenu a:visited, div#droite div.textecontenu a:hover{
	color: #7db61a;
}

div#droite div.textecontenu a:hover{
	color: #3d8203;
}

div#droite div.textecontenu ul{
}

div#droite div.textecontenu ul li{
	list-style-image: url(images/puce2.gif);	
}

div#droite div.textecontenu p{
	margin-top: 8px;
	margin-bottom: 8px;
}

div#droite div.textecontenu .vert, div#droite div.textecontenu .bleu, div#droite div.textecontenu .gris{
	padding: 6px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 12px;
	margin-top: 4px;
	margin-bottom: 4px;
	background-repeat: no-repeat;
	background-position: bottom right;
	padding-bottom: 25px;
	display: block;
}

div#droite div.textecontenu .gris{
	color: #999999;
	background-color: #f4f4f4;
	background-image: url(images/fond-div-gris.gif);
}

div#droite div.textecontenu .vert{
	color: #7db61a;
	background-color: #f0f6df;
	background-image: url(images/fond-div-vert.gif);
}

div#droite div.textecontenu .bleu{
	color: #28529d;
	background-color: #dde5f3;
	background-image: url(images/fond-div-bleu.gif);
}

div#droite div.textecontenu td{
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 12px;
	color: #000;
	padding: 2px;
}

div#droite div.textecontenu img{
	margin: 3px;
}

div#droite div.textecontenu div.alerte{
	padding: 5px;
	background-color: #7db61a;
	color: #fff;
	font-size: 11px;
	font-weight: bold;
}

/* MISE EN FORME SPECIFIQUE RECUPERATION EAU DE PLUIE */

div#droite.bleu div.textecontenu a:link, div#droite.bleu div.textecontenu a:visited, div#droite.bleu div.textecontenu a:hover{
	color: #28529d;
}

div#droite.bleu div.textecontenu a:hover{
	color: #173b7a;
}

div#droite.bleu div.textecontenu ul li{
	list-style-image: url(images/puce4.gif);
}

/**********************************/
/*                                */
/*          MENU GAUCHE           */
/*                                */
/**********************************/

div#gauche div#menu ul{
	padding: 0px;
	margin: 0px;
	background-color: #d8d8d8;
	background-image: url(images/fondmenu1.gif);
	background-repeat: repeat-y;
}

div#gauche div#menu ul li{
	list-style-position: inside;
	list-style-image: url(images/ico-folder.gif);
	padding: 0px;
	margin: 0px;
	color: #999999;
	font-size: 14px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-weight: bold;
	padding-top: 4px;
	line-height: 20px;
}

div#gauche div#menu ul li a:link, div#gauche div#menu ul li a:visited, div#gauche div#menu ul li a:hover{
	color: #999999;
	font-size: 14px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-weight: bold;
	text-decoration: none;
}

div#gauche div#menu ul li a:hover{
	color: #7db61a;
}

div#gauche div#menu ul li ul{
	background-color: #e5e5e5;
	background-image: url(images/fondmenu2.gif);
	background-repeat: repeat-y;
	padding: 0px;
	margin: 0px;
}

div#gauche div#menu ul li ul li{
	list-style-position: inside;
	list-style-image: url(images/ico-file.gif);
	padding: 0px;
	margin: 0px;
	color: #999999;
	font-size: 12px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-weight: normal;
	padding-top: 2px;
	line-height: 18px;
}

div#gauche div#menu ul li ul li a:link, div#gauche div#menu ul li ul li a:visited, div#gauche div#menu ul li ul li a:hover{
	color: #999999;
	font-size: 12px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-weight: bold;
	text-decoration: none;
}

div#gauche div#menu ul li ul li a:hover{
	color: #7db61a;
}

div#gauche div#menu ul li ul li ul{
	background-color: #f4f4f4;
	background-image: url(images/fondmenu3.gif);
	background-repeat: repeat-y;
	padding: 0px;
	margin: 0px;
}

div#gauche div#menu ul li ul li ul li{
	list-style-position: inside;
	list-style-image: url(images/ico-file2.gif);
	padding: 0px;
	margin: 0px;
	color: #999999;
	font-size: 12px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-weight: normal;
	padding-top: 2px;
	padding-bottom: 2px;
	line-height: 14px;
}

div#gauche div#menu ul li ul li ul li a:link, div#gauche div#menu ul li ul li ul li a:visited, div#gauche div#menu ul li ul li ul li a:hover{
	color: #999999;
	font-size: 11px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-weight: normal;
	text-decoration: none;
}

div#gauche div#menu ul li ul li ul li a:hover{
	color: #7db61a;
}

/* MISE EN FORME SPECIFIQUE RECUPERATION EAU DE PLUIE */

div#gauche.bleu div#menu ul li{
	list-style-image: url(images/ico-folder2.gif);
}

div#gauche.bleu div#menu ul li a:hover{
	color: #28529d;
}

div#gauche.bleu div#menu ul li ul li{
	list-style-image: url(images/ico-file.gif);
}

div#gauche.bleu div#menu ul li ul li a:hover{
	color: #28529d;
}

div#gauche.bleu div#menu ul li ul li ul li{
	list-style-image: url(images/ico-file2.gif);
}

div#gauche.bleu div#menu ul li ul li ul li a:hover{
	color: #28529d;
}

/**********************************/
/*                                */
/*             TITRES             */
/*                                */
/**********************************/

h1{
	padding: 0px;
	margin: 0px;
	height: 25px;
	_height: 31px;
	background-image: url(images/titre-fond-gris.gif);
	background-repeat: repeat-x;
	padding-left: 10px;
	padding-top: 6px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
}

div#gauche h1{
	background-image: url(images/titre-fond-gris.gif);
}

div#droite h1{
	background-image: url(images/titre-fond-vert.gif);
}

div#droite div#assainissement h1{
	background-image: url(images/titre-fond-vert.gif);
}

div#droite div#recuperation h1{
	background-image: url(images/titre-fond-bleu.gif);
}

h2{
	padding: 0px;
	margin: 0px;
	margin-top: 30px;
	margin-bottom: 10px;
	font-weight: normal;
	color: #7db61a;
	font-size: 24px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
}

h3{
	padding: 2px;
	margin: 0px;
	margin-top: 10px;
	margin-bottom: 10px;
	font-weight: bold;
	color: #fff;
	font-size: 12px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	background-image: url(images/titre-fond-vert2.gif);
	background-repeat: repeat-x;
}

h4{
	padding: 2px;
	margin: 0px;
	margin-top: 12px;
	margin-bottom: 12px;
	font-weight: bold;
	color: #7db61a;
	font-size: 12px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	border-bottom: 1px solid #7db61a;
	background-image: url(images/puce3.gif);
	background-position: right center;
	background-repeat: no-repeat;
	background-color: #f4f4f4;
}

h5{
	margin: 0px;
	margin-top: 10px;
	margin-bottom: 10px;
	font-weight: bold;
	color: #7db61a;
	font-size: 12px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
}

/* MISE EN FORME SPECIFIQUE RECUPERATION EAU DE PLUIE */

div#droite.bleu h1{
	background-image: url(images/titre-fond-bleu.gif);
}

div#droite.bleu div.textecontenu h2{
	color: #28529d;
}

div#droite.bleu div.textecontenu h3{
	background-image: url(images/titre-fond-bleu2.gif);
}

div#droite.bleu div.textecontenu h4{
	color: #28529d;
	border-bottom: 1px solid #28529d;
	background-image: url(images/puce5.gif);
}

div#droite.bleu div.textecontenu h5{
	color: #28529d;
}

/**********************************/
/*                                */
/*          FIL D'ARIANE          */
/*                                */
/**********************************/

div#fil{
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 11px;
	color: #a6a6a6;
	border-bottom: 1px solid #dbdbdb;
	padding-bottom: 5px;
}

div#fil a:link, div#fil a:visited, div#fil a:hover{
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 11px;
	color: #a6a6a6;
	text-decoration: underline;
}

div#fil a:hover{
	color: #7db61a;
}

/**********************************/
/*                                */
/*           BOX ACTUS            */
/*                                */
/**********************************/

div#actus{
	margin: 8px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 11px;
	color: #7a7a7a;
}

div#actus ul{
	padding: 0px;
	margin: 0px;
}

div#actus ul li{
	line-height: 16px;
	padding: 0px;
	margin: 0px;
	list-style-image: url(images/puce1.gif);
	list-style-position: inside;
}

div#actus a:link, div#actus a:visited, div#actus a:hover{
	text-decoration: none;
	color: #7a7a7a;
}

div#actus a:hover{
	text-decoration: underline;
}

div#actus div{
	margin-top: 6px;
	text-align: right;
}

div#actus div img{
	border: 0;
}

/**********************************/
/*                                */
/*              ACTU              */
/*                                */
/**********************************/

div.actu{
	background-image:url(images/pointilles2.gif);
	background-position: bottom;
	background-repeat: repeat-x;
	padding-bottom: 3px;
	color: #707070;
}

div.actu h3{
	background-image: none;
	color: #535353;
	font-size: 14px;
	padding: 0px;
}

div#droite div.textecontenu div.actu h3 img{
	margin: 0px;
}

div.actu div.date{
	text-align: right;
	font-size: 11px;
	color: #aaaaaa;
}

/**********************************/
/*                                */
/*           MULTIPAGE            */
/*                                */
/**********************************/

div#droite div.textecontenu div#multipage{
	text-align: center;
	font-size: 11px;
	margin-top: 8px;
}

div#droite div.textecontenu div#multipage a:link, div#droite div.textecontenu div#multipage a:visited, div#droite div.textecontenu div#multipage a:hover{
	background-repeat:repeat-x;
	background-image: url(images/degrade1.gif);
	background-position: top;
	background-color: #f1f7dd;
	border: 1px solid #b3d74d;
	font-size: 11px;
	padding: 3px;
	text-decoration: none;
	margin: 1px;
	color: #b3d74d;
	font-weight: bold;
}

div#droite div.textecontenu div#multipage a:hover{
	background-image: url(images/degrade2.gif);
	background-position: bottom;
	background-color: #b3d74d;
	color: #fff;
}

div#droite div.textecontenu div#multipage span{
	background-color: #f8fbee;
	border: 1px solid #d9eba6;
	font-size: 11px;
	padding: 3px;
	text-decoration: none;
	margin: 1px;
	color: #d9eba6;
}

/**********************************/
/*                                */
/*           FORMULAIRE           */
/*                                */
/**********************************/

div#droite div.textecontenu table.formulaire{
	border: 1px solid #7db61a;
	background-color: #effacf;
}


div#droite div.textecontenu table.formulaire td.formulaire_libelle{
	font-size: 12px;
	color: #7db61a;
	font-weight: bold;
	padding: 5px;
	border-bottom: 1px dotted #7db61a;
	width: 130px;
}

div#droite div.textecontenu table.formulaire td.formulaire_champs{
	border-bottom: 1px dotted #7db61a;
}

div#droite div.textecontenu table.formulaire h3{
	margin: 0px;
}

div#droite div.textecontenu table.formulaire input.input1{
	border: 1px solid #7db61a;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 12px;
	color: #000;
	width: 150px;
}

/**********************************/
/*                                */
/*           MENU FOOT            */
/*                                */
/**********************************/

div#menufoot{
	text-align: center;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 11px;
	color: #7c7c7c;
	font-size: 11px;
	font-weight: normal;
	margin-right: 100px;
	margin-left: 100px;
	margin-top: 60px;
}

div#menufoot a:link, div#menufoot a:visited, div#menufoot a:hover{
	color: #7c7c7c;
	text-decoration: none;
}

div#menufoot a:hover{
	text-decoration: underline;
}

/**********************************/
/*                                */
/*              FOOT              */
/*                                */
/**********************************/

div#foot{
	height: 15px;
}

div#foot div#adresse{
	float: left;
	padding-left: 20px;
}

div#foot div#infoweb{
	float: right;
	padding-right: 20px;
}