/* stylegec.css : feuille de style genérale pour le site MEHAT - page standard */

body {margin: 0;}

#corps {
	background-color: #FFFFFF;
	background-position: left;
	background-repeat: repeat-y;
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 70%;
	font-style: normal;
	height: auto;
	margin: 0 auto 0 auto;
	position: relative;
	text-align: left;
	width: 100%;
}

/* entête */

#corps #entete {background-color: #FFFFFF; margin: 0; padding: 0; width: 100%;}
#corps #entete #img {border: 0; text-decoration: none; margin-left: 10px; margin-top: 0;}

#corps #entete #adress {
	background-color: #191970;
	color: #FFFFFF;
	font-style: normal;
	font-weight: 100;
	letter-spacing: 0.1em;
	text-align: left;
	text-indent: 15px;
	padding: 0px;
	margin: 0;
} 

#corps #entete #adress p {margin: 0 0 0 1%; padding: 0;}
#corps #entete #adress a {color: #FFFFFF;}
#corps #entete #adress a:hover {color: #FF0000;}


/* menu horizontal */

.menuh {background-color: #000000; display: block; list-style-type: none; margin: 0; padding: 0 0 2px 0; height: 12px; width: 100%;}
.menuh li {background-image: url(../im/w2b.png); float: left; margin: 1px 1px 1px 2px; padding-bottom: 1px;}

.menuh a {
	color: #FFFFFF;
	display: block;
	font-family: Verdana, Arial, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	letter-spacing: 0.2em;
	line-height: 11px;
	list-style-type: none;
	text-align: center;
	text-decoration: none;
	width: 180px;
}

.menuh a:hover {background-image: url(../im/w2a.png); color: #FFFFFF; text-decoration: none;}



/* menu gauche */

.menugauche {
	background-color: #191970;
	clear: right;
	display: block;
	float: left;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	visibility: visible;
	width: 152px;
	z-index: 4;
}

.menugauche li {margin-bottom: 0; margin-top: 5px; padding-bottom: 0px; text-indent: 15px;}
	
.menugauche a {
	border: 1px solid #191970;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-style: normal;
	font-weight: normal;
	color: #FFFFFF;
	text-align: left;
	letter-spacing: 0.3em;
	width: 150px;
	line-height: normal;
	list-style-type: none;
	display: block;
	text-decoration: none;
	z-index: 4;
}

.menugauche a:hover {color: #FFFFFF; border: 1px solid #FFFFFF;	text-decoration: none;}

.menugauche #menu1 a:hover {background-color: #FC5327;}
.menugauche #menu2 a:hover {background-color: #2AC292;}
.menugauche #menu3 a:hover {background-color: #6EA0E6;}
.menugauche #menu4 a:hover {background-color: #A490DE;}
.menugauche #menu5 a:hover {background-color: #FF9900;}
.menugauche #menu6 a:hover {background-color: #78CC42;}

/* panneaux du menu déroulant */

#assain {
	background-color: #FC5327;
	height: auto;
	left: 152px;
	letter-spacing: 0.1em;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-indent: 10px;
	top: auto;
	visibility: hidden;
	width: 270px;
	z-index: 4;
}

#clot {
	background-color: #2AC292;
	height: auto;
	left: 152px;
	letter-spacing: 0.1em;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-indent: 10px;
	top: auto;
	visibility: hidden;
	width: 237px;
	z-index: 4;
}

#envi {
	background-color: #6EA0E6;
	height: auto;
	left: 152px;
	letter-spacing: 0.1em;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-indent: 10px;
	top: auto;
	visibility: hidden;
	width: 237px;
	z-index: 4;
}

#dalles {
	background-color: #A490DE;
	height: auto;
	left: 152px;
	letter-spacing: 0.1em;
	margin-top: 50px;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-indent: 10px;
	visibility: hidden;
	width: 237px;
	z-index: 4;
}

#divers {
	background-color: #FF9900;
	height: auto;
	left: 152px;
	letter-spacing: 0.1em;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-indent: 10px;
	top: auto;
	z-index: 4;
	width: 237px;
	visibility: hidden;
}

#cuves {
	background-color: #78CC42;
	height: auto;
	left: 152px;
	letter-spacing: 0.1em;
	margin-top: 80px;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-indent: 10px;
	top: auto;
	z-index: 4;
	width: 237px;
	visibility: hidden;
}



#assain p {margin: 0;}
#clot p {margin: 0;}
#envi p {margin: 0;}
#dalles p {margin: 0;}
#divers p {margin: 0;}
#cuves p {margin: 0;}

#assain a {border: 1px solid #FC5327; color: #FFFFFF; display: block; font-size: 100%; margin-left: 1px; margin-right: 1px;  text-decoration: none;}
#clot a {border: 1px solid #2AC292; color: #FFFFFF; display: block; font-size: 100%; margin-left: 1px; margin-right: 1px; text-decoration: none;}
#envi a {border: 1px solid #6EA0E6; color: #FFFFFF; display: block; font-size: 100%; margin-left: 1px; margin-right: 1px; text-decoration: none;}
#dalles a {border: 1px solid #A490DE; color: #FFFFFF; display: block; font-size: 100%; margin-left: 1px; margin-right: 1px;  text-decoration: none;}
#divers a {border: 1px solid #FF9900; color: #FFFFFF; display: block; font-size: 100%; margin-left: 1px; margin-right: 1px;  text-decoration: none;}
#cuves a {border: 1px solid #78CC42; color: #FFFFFF; display: block; font-size: 100%; margin-left: 1px; margin-right: 1px;  text-decoration: none;}




#assain a:hover {background-color: #fdaf89; border: 1px solid #FFFFFF; color: #000000; display: block; text-decoration: none;}
#clot a:hover {background-color: #69dfb6; border: 1px solid #FFFFFF; color: #000000; display: block; text-decoration: none;}
#envi a:hover {background-color: #9eb4ee; border: 1px solid #FFFFFF; color: #000000; display: block; text-decoration: none;}
#dalles a:hover {background-color: #EED5FD; border: 1px solid #FFFFFF; color: #000000; display: block; text-decoration: none;}
#divers a:hover {background-color: #FFDD00; border: 1px solid #FFFFFF; color: #000000; display: block; text-decoration: none;}
#cuves a:hover {background-color: #BBDD88; border: 1px solid #FFFFFF; color: #000000; display: block; text-decoration: none;}

/* boutons pages Précédente et Suivante */

.boutons {display: block; list-style-type: none; margin: 60px 50px 170px 0; padding: 0; z-index:5;}
.boutons li {background-image: url(../im/w5b.png); float: right; margin: 0 4px; padding-bottom: 1px;}

.boutons a {
	color: #FFFFFF;
	display: block;
	font-family: Verdana, Arial, sans-serif;
	font-size: 11px;
	letter-spacing: 0.2em;
	height: 12px;
	line-height: 12px;
	list-style-type: none;
	text-align: center;
	text-decoration: none;
	width: 120px;
	z-index: 5;
}

.boutons a:hover {background-image: url(../im/w5a.png); color: #FFFFFF; text-decoration: none; z-index:5}

/* structure classique de chaque paragraphe */

h1 {
	position: relative;
	color: #FFFFFF;
	font: normal 12px Verdana, Arial, Helvetica, sans-serif;
	letter-spacing: 0.2em;
	text-align: center;
	width: 99%;
	margin: 0 auto;
	}

h2 {
	float: right;
	font: normal bold 14px Arial, Verdana, Helvetica, sans-serif;
	font-weight: 800;
	letter-spacing: 0.2em;
	margin-right: 5px;
	margin-top: 20px;
	text-align: left;
	width: 570px;
	}

#corps h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: 800;	
	letter-spacing: 0.2em;
	list-style-position: inside;
	padding-bottom: 2px;
	text-align: left;
	text-indent: 10px;
	width: auto;
}

#corps h4 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: 600;	
	letter-spacing: 0.2em;
	list-style: none;
	text-align: center;
	width: auto;
}

#corps h5 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: 400;	
	letter-spacing: 0.1em;
	margin-left: 10px;
	margin-top: 5px;
	text-align: left;
	width: auto;
	}

#corps h6 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	font-weight: 400;	
	letter-spacing: 0.1em;
	text-align: center;
	width: auto;
	}
#corps h6 a {color: #000000;}
#corps h6 a:hover {color: #FF0000;}

#corps #cold {background-color: #FFFFFF;}

#tablo1 {
	background-color: #FFFFFF;
	border: 1px solid #000000;
	color: #000000; 
	font : normal bold 80%/100% Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	font-weight: normal;
	height: auto;
	text-indent: 5px;
	text-transform: uppercase;
	width: 80%;
}
#tablo1 p {margin: 2px 1px 1px 10px;}

#tablo2 {
	background-color: #FFFFFF;
	border: 1px solid #000000;
	color: #000000; 
	font : normal bold 80%/100% Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	font-weight: normal;
	text-indent: 5px;
	text-transform: uppercase;
	width: 80%;
}

#tabloa {background-color:#E1E1E1;}

#repro1 {display: block; height: auto; margin: 0 auto; width: auto; }


/* Propriétés communes aux 4 coins de l'Adresse et du Menu Gauche */
#hautgauche, #hautdroit, #basgauche, #basdroit {
	height: 20px; width: 20px;
	background-repeat: no-repeat;
	font-size: 1px;} /*correction d'un bogue d'IE */
	
#hautgauche {background-image: url(../im/arrondi1.jpg);}
#hautdroit {float: right; background-image: url(../im/arrondi2.jpg);}
#basgauche {background-image: url(../im/arrondi4.jpg);}
#basdroit {float:right; background-image: url(../im/arrondi3.jpg);}


/* Propriétés communes aux 4 coins du menu Assainissement */
#hautg2, #hautd2, #basg2, #basd2 {
	height: 20px; width: 20px;
	background-repeat: no-repeat;
	font-size: 1px;} /*correction d'un bogue d'IE */
	
#hautg2 {float: left; background-image: url(../im/arror1.jpg);}
#hautd2 {float: right; background-image: url(../im/arror2.jpg);}
#basg2 { float: left; background-image: url(../im/arror4.jpg);}
#basd2 {float:right; background-image: url(../im/arror3.jpg);}

/* Propriétés communes aux 4 coins du menu Clôture */
#hautg3, #hautd3, #basg3, #basd3 {
	height: 20px; width: 20px;
	background-repeat: no-repeat;
	font-size: 1px;} /*correction d'un bogue d'IE */
	
#hautg3 {float: left; background-image: url(../im/arrov1.jpg);}
#hautd3 {float: right; background-image: url(../im/arrov2.jpg);}
#basg3 { float: left; background-image: url(../im/arrov4.jpg);}
#basd3 {float:right; background-image: url(../im/arrov3.jpg);}

/* Propriétés communes aux 4 coins du menu Environnement */
#hautg4, #hautd4, #basg4, #basd4 {
	height: 20px; width: 20px;
	background-repeat: no-repeat;
	font-size: 1px;} /*correction d'un bogue d'IE */
	
#hautg4 {float: left; background-image: url(../im/arrob1.jpg);}
#hautd4 {float: right; background-image: url(../im/arrob2.jpg);}
#basg4 { float: left; background-image: url(../im/arrob4.jpg);}
#basd4 {float:right; background-image: url(../im/arrob3.jpg);}

/* Propriétés communes aux 4 coins du menu Dalles */
#hautg5, #hautd5, #basg5, #basd5 {
	height: 20px; width: 20px;
	background-repeat: no-repeat;
	font-size: 1px;} /*correction d'un bogue d'IE */
	
#hautg5 {float: left; background-image: url(../im/arrom1.jpg);}
#hautd5 {float: right; background-image: url(../im/arrom2.jpg);}
#basg5 { float: left; background-image: url(../im/arrom4.jpg);}
#basd5 {float:right; background-image: url(../im/arrom3.jpg);}

/* Propriétés communes aux 4 coins du menu Divers */
#hautg6, #hautd6, #basg6, #basd6 {
	height: 20px; width: 20px;
	background-repeat: no-repeat;
	font-size: 1px;} /*correction d'un bogue d'IE */
	
#hautg6 {float: left; background-image: url(../im/arroo1.jpg);}
#hautd6 {float: right; background-image: url(../im/arroo2.jpg);}
#basg6 { float: left; background-image: url(../im/arroo4.jpg);}
#basd6 {float:right; background-image: url(../im/arroo3.jpg);}


/* Propriétés communes aux 4 coins du menu Cuves */
#hautg7, #hautd7, #basg7, #basd7 {
	height: 20px; width: 20px;
	background-repeat: no-repeat;
	font-size: 1px;} /*correction d'un bogue d'IE */
	
#hautg7 {float: left; background-image: url(../im/arr_cuv1.jpg);}
#hautd7 {float: right; background-image: url(../im/arr_cuv2.jpg);}
#basg7 { float: left; background-image: url(../im/arr_cuv4.jpg);}
#basd7 {float:right; background-image: url(../im/arr_cuv3.jpg);}


/* remonter vers le haut de la page */
#corps #remonter {float:right; margin-right: 20px;}

/* bas de page */
#corps #pied {
	background-color: #000000;
	border: 1px solid #000000;
	color: #FFFFFF;
	font-size: 11px;
	font-weight: lighter;
	height: 13px;
	letter-spacing: 0.1em;
	margin-top: 1px;
	position: relative;
	text-align: left;
	text-indent: 2px;
	text-decoration: none;
}

#corps #pied a {color: #FF0000; text-decoration: none;}
#corps #pied a:hover {color: #FFFFFF; text-decoration: underline;}

#corps #mots {
	display: block;
	visibility: hidden;
	position: absolute;
	top: auto;
	left: auto;
	width: 10%;
}