/* index.css : feuille de style pour la page d'accueil du site MEHAT */

body {margin: 0;}

#corps {
	background-color: #FFFFFF;
	background-image: url(../im/ap07.jpg);
	background-position: bottom;
	background-repeat: no-repeat;
	color: #000000;
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 70%;
	font-style: normal;
	height: auto;
	margin: 0px 0px 0px 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-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: 20px;
	padding: 0;
	margin: 0;
} 

#corps #entete #adress p {margin: 0; 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;}


/* Propriétés de la partie centrale de la page d'Accueil */

#corps #centre {
	display: block;
	height: 610px;
	width: 800px;
	margin: 0 auto;
	position: relative;
	z-index: 0;
		
}

#corps #galpho {
	display: block;
	height: 80px;
	margin: 0 auto 0 auto;
	position: absolute;
	width: 743px;
	visibility: visible;
	z-index: 1;
	left: 30px;
	top: 370px;
}

/* ligne de menu */

h1 {
	position: relative;
	color: #FFFFFF;
	font: normal 12px Verdana, Arial, Helvetica, sans-serif;
	letter-spacing: 0.2em;
	text-align: center;
	width: 99%;
	}
	
h1 a {color: #FFFFFF;}
h1 a:hover {color: #transparent;}

h2 {
	position: relative;
	font: normal 12px Verdana, Arial, Helvetica, sans-serif;
	font-weight: 400;
	letter-spacing: 0.3em;
	margin: 1px 0;
	padding: 14px 0;
	text-align: center;
	width: 99%;
	z-index: 8;
	}
	
h3 {
	position: relative;
	font: normal bold 10px Arial, Verdana, Helvetica, sans-serif;
	font-weight: 800;
	letter-spacing: 0.2em;
	margin: 5px 0 15px 0;
	text-align: center;
	width: 99%;
	z-index: 8;
	}
	
h3 a {color: #EB0000; text-decoration: none;}

h3 a:hover {color: #191970; text-decoration: underline;}



h5 {height: 120px;}

/* panneaux du menu déroulant */

#assain {
	background-color: #FC5327;
	height: auto;
	left: 140px;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-indent: 8px;
	top: 16px;
	visibility: hidden;
	width: 200px;
	z-index: 5;
}

#calqassa {
	background-image: url(../im/assacc4.jpg);
	background-repeat: no-repeat;
	height: 80px;
	left: 180px;
	position: absolute;
	text-decoration: none;
	top: 26px;
	visibility: visible;
	width: 120px;
	z-index: 0;
}


#clot {
	background-color: #2AC292;
	height: auto;
	left: 460px;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-indent: 8px;
	top: 16px;
	visibility: hidden;
	width: 200px;
	z-index: 5;
}

#calqclot {
	background-image: url(../im/clotacc4.jpg);
	background-repeat: no-repeat;
	height: 80px;
	left: 500px;
	position: absolute;
	text-decoration: none;
	top: 26px;
	visibility: visible;
	width: 120px;
	z-index: 0;
}

#envi {
	background-color: #6EA0E6;
	height: auto;
	left: -10px;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-indent: 8px;
	top: 16px;
	width: 180px;
	z-index: 4;
	visibility: hidden;
}

#calqenvi {
	background-image: url(../im/enviacc4.jpg);
	background-repeat: no-repeat;
	height: 80px;
	left: 20px;
	position: absolute;
	text-decoration: none;
	top: 26px;
	visibility: visible;
	width: 120px;
	z-index: 0;
}

#dalles {
	background-color: #A490DE;
	height: auto;
	left: 310px;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-indent: 8px;
	top: 16px;
	visibility: hidden;
	width: 180px;
	z-index: 5;
}

#calqdall {
	background-image: url(../im/dallacc4.jpg);
	background-repeat: no-repeat;
	height: 80px;
	left: 340px;
	position: absolute;
	text-decoration: none;
	top: 26px;
	visibility: visible;
	width: 120px;
	z-index: 0;
}


#divers {
	background-color: #FF9900;
	height: auto;
	left: 630px;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-indent: 8px;
	top: 16px;
	z-index: 4;
	width: 180px;
	visibility: hidden;
}

#calqdive {
	background-image: url(../im/diveacc4.jpg);
	background-repeat: no-repeat;
	height: 80px;
	left: 660px;
	position: absolute;
	text-decoration: none;
	top: 26px;
	visibility: visible;
	width: 120px;
	z-index: 0;
}


#cuve {
	background-color: #77cc44;
	height: auto;
	left: 140px;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-indent: 8px;
	top: 205px;
	width: 200px;
	z-index: 4;
	visibility: hidden;
}

#calqcuve {
/*	background-image: url(../im/cuveo_1.jpg);
	background-repeat: no-repeat;  */
	height: 80px;
	left: 170px;
	position: absolute;
	text-decoration: none;
	top: 210px;
	visibility: visible;
	width: 120px;
	z-index: 4;
}


#bois {
	background-color: #4fc039;   /*  #77cc44;   */
	height: auto;
	left: 420px;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-indent: 8px;
	top: 205px;
	width: 300px;
	z-index: 4;
	visibility: hidden;
}

#calq_bois {
/*	background-image: url(../im/cloture_bois_5.jpg);		*/
	height: 80px;
	left: 495px;
	position: absolute;
	text-decoration: none;
	top: 210px;
	visibility: visible;
	width: 128px;
	z-index: 4;
}






#assain p {margin: 0;}
#clot p {margin: 0;}
#envi p {margin: 0;}
#dalles p {margin: 0;}
#divers p {margin: 0;}
#cuve p {margin: 0;}
#bois 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;}
#cuve a {border: 1px solid #77cc44; color: #FFFFFF; display: block; font-size: 100%; margin-left: 1px; margin-right: 1px;  text-decoration: none;}
#bois a {border: 1px solid #4fc039; 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;}
#cuve a:hover {background-color: #77dd99; border: 1px solid #FFFFFF; color: #000000; display: block; text-decoration: none;}
#bois a:hover {background-color: #77dd99; border: 1px solid #FFFFFF; color: #000000; display: block; text-decoration: none;}



/* Propriétés communes aux 4 coins de l'Adresse */
#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 des calques photographiques */
#calqhog, #calqhod, #calqbasg, #calqbasd {
	height: 20px; width: 20px;
	background-repeat: no-repeat;
	font-size: 1px;} /*correction d'un bogue d'IE */
	
#calqhog {float: left; background-image: url(../im/angle1.gif);}
#calqhod {float: right; background-image: url(../im/angle2.gif);}
#calqbasg {float: left; background-image: url(../im/angle4.gif);}
#calqbasd {float:right; background-image: url(../im/angle3.gif);}


/* Propriétés communes aux 4 coins du menu cuve à eau */
#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);}




/* Propriétés communes aux 4 coins du menu clôture imitation bois */
#hautg8, #hautd8, #basg8, #basd8 {
	height: 20px; width: 20px;
	background-repeat: no-repeat;
	font-size: 1px;} /*correction d'un bogue d'IE */
	
#hautg8 {float: left; background-image: url(../im/bois01b.jpg);}
#hautd8 {float: right; background-image: url(../im/bois02b.jpg);}
#basg8 { float: left; background-image: url(../im/bois03b.jpg);}
#basd8 {float:right; background-image: url(../im/bois04b.jpg);}















/* bouton Assainissement */

#corps #layassa {
	background: url(../im/fdbleu2.jpg);
	display: block;
	height: 16px;
	margin: 0;
	position:absolute;
	top: 0px;
	visibility: visible;
	z-index:5;
	left: 170px;
}

#corps #layassa a {
	color: #FFFFFF;
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-style: normal;
	font-weight: normal;
	letter-spacing: 0.2em;
	line-height: normal;
	text-align: center;
	text-decoration: none;
	width: 140px;
}

#corps #layassa a:hover { background-image:url(../im/fdassa2.jpg); color: #FFFFFF; height: 16px; text-decoration: none;}

/* bouton Clôture */

#corps #layclot {
	background: url(../im/fdbleu2.jpg);
	display: block;
	height: 16px;
	margin: 0;
	position:absolute;
	top: 0px;
	visibility: visible;
	z-index:5;
	left: 490px;
}

#corps #layclot a {
	color: #FFFFFF;
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-style: normal;
	font-weight: normal;
	letter-spacing: 0.2em;
	line-height: normal;
	text-align: center;
	text-decoration: none;
	width: 140px;
}

#corps #layclot a:hover { background-image: url(../im/fdclot2.jpg); color: #FFFFFF; height: 16px; text-decoration: none;}


/* bouton Environnement */

#corps #layenvi {
	background: url(../im/fdbleu2.jpg);
	display: block;
	height: 16px;
	margin: 0;
	position:absolute;
	top: 0px;
	visibility: visible;
	z-index:5;
	left: 10px;
}

#corps #layenvi a {
	color: #FFFFFF;
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-style: normal;
	font-weight: normal;
	letter-spacing: 0.2em;
	line-height: normal;
	text-align: center;
	text-decoration: none;
	width: 140px;
}

#corps #layenvi a:hover { background-image: url(../im/fdenvi2.jpg); color: #FFFFFF; height:16px; text-decoration: none;}

/* bouton Dalles */

#corps #laydall {
	background: url(../im/fdbleu2.jpg);
	display: block;
	margin: 0;
	height: 16px;
	position:absolute;
	top: 0px;
	visibility: visible;
	left: 330px;
	z-index: 5;
}

#corps #laydall a {
	color: #FFFFFF;
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-style: normal;
	font-weight: normal;
	letter-spacing: 0.2em;
	line-height: normal;
	text-align: center;
	text-decoration: none;
	width: 140px;
}

#corps #laydall a:hover { background-image: url(../im/fddall2.jpg); color: #FFFFFF; height:16px; text-decoration: none;}


/* bouton Divers */

#corps #laydive {
	background: url(../im/fdbleu2.jpg);
	display: block;
	margin: 0;
	height: 16px;
	position:absolute;
	top: 0px;
	visibility: visible;
	left: 650px;
	z-index: 6;
}

#corps #laydive a {
	color: #FFFFFF;
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-style: normal;
	font-weight: normal;
	letter-spacing: 0.2em;
	line-height: normal;
	text-align: center;
	text-decoration: none;
	visibility: visible;
	width: 140px;
}

#corps #laydive a:hover { background-image: url(../im/fddive2.jpg); color: #FFFFFF; height: 16px; text-decoration: none;}


/* bouton Cuves à eau */

#corps #laycuve {
	background: url(../im/fdbleu2.jpg);
	display: block;
	height: 16px;
	margin: 0;
	position:absolute;
	top: 190px;
	visibility: visible;
	z-index:0;
	left: 170px;
}

#corps #laycuve a {
	color: #FFFFFF;
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-style: normal;
	font-weight: normal;
	letter-spacing: 0.2em;
	line-height: normal;
	text-align: center;
	text-decoration: none;
	width: 140px;
}

#corps #laycuve a:hover { background-image: url(../im/fdcuve2.jpg); color: #FFFFFF; height:18px; text-decoration: none;}




/* bouton Cuves à eau */

#corps #lay_bois {
	background: url(../im/fdbleu3.jpg);
	display: block;
	height: 16px;
	margin: 0;
	position:absolute;
	top: 190px;
	visibility: visible;
	z-index:0;
	left: 450px;
}

#corps #lay_bois a {
	color: #FFFFFF;
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	font-style: normal;
	font-weight: normal;
	letter-spacing: 0.2em;
	line-height: normal;
	text-align: center;
	text-decoration: none;
	width: 240px;
}

#corps #lay_bois a:hover { background-image: url(../im/fdcuve3.jpg); color: #FFFFFF; height:18px; text-decoration: none;}









/* 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.2em;
	margin: 0 auto;
	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;
}



/* bouton NF */

#corps #laynf1 {
	background: url(../im/nf82.jpg);
	background-position: center;
	background-repeat: no-repeat;
	display: block;
	height: 50px;
	margin: 0;
	position:absolute;
	top: 120px;
	visibility: visible;
	z-index:3;
	left: 521px;
	width: 80px;
}

#corps #laynf1 a {
	color: #FFFFFF;
	display: block;
	line-height: 50px;
	text-align: center;
	width: 80px;
}

#corps #laynf1 a:hover { background-image: url(../im/nf85.jpg); background-position: center; background-repeat: no-repeat; color: #FFFFFF; height: 50px; text-decoration: none;}


#corps #laynf2 {
	background: url(../im/nf82.jpg);
	background-position: center;
	background-repeat: no-repeat;
	display: block;
	height: 50px;
	margin: 0;
	position:absolute;
	top: 120px;
	visibility: visible;
	z-index:3;
	left: 200px;
	width: 80px;
}

#corps #laynf2 a {
	color: #FFFFFF;
	display: block;
	line-height: 50px;
	text-align: center;
	width: 80px;
}

#corps #laynf2 a:hover { background-image: url(../im/nf85.jpg); background-position: center; background-repeat: no-repeat; color: #FFFFFF; height: 50px; text-decoration: none;}
