/* définition des mages et des paddings à 0 */
body {font:100%, arial, verdana, sans-serif; background-color:#FDD; }
* {margin: 0; padding:0px; }
body {
     margin: 0; /* pour éviter les marges */
     text-align: center; /* pour corriger le bug de centrage IE */
     }

/* Formatage texte et police */
h1 {font-size: 1em; text-transform: uppercase; letter-spacing:.1em; margin: 1em 0 1.5em 12em; border-bottom: 1px solid black; color:#800000;}
h2 {font-size: .84em; text-decoration: underline; margin: .85em 0 0 0; }
h3 {font-size: .76em; margin-top:.3em; }
img {border:0px none;}
p {font-size: .76em;text-align: justify; margin: .76em 0 0 0; text-indent:2em; }
a:link{color:#B00000; text-decoration:none; }
a:visited{color:#B00000; text-decoration:none;}
a:active{color:#B00000; text-decoration:none;}
a:hover{color:#B00000; text-decoration:underline;}

#header_1 {   
width : 980px;
height: 140px;
background: url(../media/ban_qt.jpg) top left no-repeat;
margin: 10px auto 0;
text-align: left; /* on rétablit l'alignement normal du texte */
}

#header_1_1 {
float:left;   
width : 980px;
height: 140px;
margin:0;
}

/* the horizontal menu starts here */
div#header_1_2 {
	width:99.9%; 	/* makes the div full width */
	float:left; /*makes the div enclose the list */
	border-left:1px solid black;	 /* draws line on bottom edge of div */
	border-right:1px solid black;	 /* draws line on bottom edge of div */
	}
div#header_1_2 ul {margin:0 0 0 30px;/* indents ul from edge of container */
	}
div#header_1_2 li {
	float:left;	/* causes the list to align horizontally instead of stack */
	list-style-type:none;	/* removes the bullet off each list item */
	border-right:1px solid #069; /* creates dividing lines between the li elements */
	font:.8em, arial, verdana, sans-serif, bold;
	}
div#header_1_2 li:first-child {
	border-left:1px solid #069; /*the first vertical line on the menu */
	}

/* the horizontal menu ends here */
/* THE HACK ZONE - */
/* hack for IE (all flavors) so the menu has a vertical line on the left */
* html div#header_1_2 ul {
	float:left; /* makes the ul wrap the li's */
	border-left:1px solid #000; /* adds the rightmost menu vertical line to the ul */
	margin-left:15px; /* IE doubles the given value above - why? */
	}
/* html a {display:block;} /* makes IE5 & 5.5 accept the padding on the link */
/* end of hack zone */
/* END OF LIST-BASED MENU */

#header_1_2 {float:left; width:99%; height:24px;background:  url(../media/fond_blanc.jpg) 0px 0px repeat-x white;}
#header_1_2 a.roll		{float:left;
			text-decoration:none;
			width:182px; 
			height:20px; 
			padding-top:4px;
			display:block; 
			text-align:center;
			}
#header_1_2 a.roll:link {background:  url(../media/fond_blanc.jpg) 0px 0px repeat-x; color: black;}
#header_1_2 a.roll:visited {background:  url(../media/fond_blanc.jpg) 0px 0px repeat-x; color: black;}
#header_1_2 a.roll:hover {background:  url(../media/fond_rouge.jpg) 0px 0px repeat-x; color:white;}
#header_1_2 a.roll:active {background:  url(../media/fond_rouge.jpg) 0px 0px repeat-x; color:white;}

#body_2 {
width : 978px;
background: green;
margin: 0 auto;
text-align: left; /* on rétablit l'alignement normal du texte */
}

#body_2bis {
float:left; 
width : 978px;
background: #D8D8D8;
margin: 0 auto 0px;
text-align: left; /* on rétablit l'alignement normal du texte */
border: 1px solid black;
padding-bottom:1em;
}

#footer_bp {
float:left;
width : 980px;
height: 60px;
background: url(../media/footer.jpg) 0px top no-repeat #FDD;
margin: 0 auto;
text-align: left; /* on rétablit l'alignement normal du texte */
}

#body_2_1 {
float:left;   
width : 150px;
margin:0;
border-right: 1px solid black;
border-bottom: 1px solid black;
}

#body_2_1 ul  {font-size: .8em; line-height: 1.4em; list-style-type:none;text-align: center; color:white; font-weight:bold; margin: 0; text-indent:0 ;padding-bottom:1em;}

#body_2_1 ul ul{text-align: left; line-height: 1.2em; font-size: .9em; background: #E2E2E2; margin:0; color:black; text-indent:5px; font-weight:normal; padding-top:.5em; }
#body_2_1 ul{background:  url(../media/fond_rougebiglarge.jpg) 0px 0px repeat-y;}
#body_2_1 ul ul{background:  url(../media/fond_blanc_large.jpg) 0px 0px repeat-y;}
#body_2_1 a:link {text-decoration:none; color:black;}
#body_2_1 a:visited {text-decoration:none; color:black;}
#body_2_1 a:hover{text-decoration:none;color:#B00000;font-weight:bold;}


#body_2_1 li li{
display:block; 
width : 150px;
}


#body_2_2 {
float:left;  
width : 790px;
margin:1.5em 0em 0 1em;
padding: 0;
border: 1px solid black;
background: white;
}

#body_2_2_1 {
float:left;  
width : 790px;
height: 20px;
background:  url(../media/fond_rouge.jpg) 0px 0px repeat-x white;
margin:0;
padding: 0;
border-bottom: 1px solid black;
}

#body_2_2_2 {
float:left;   
width : 750px;
margin:0;
padding: 0 1.2em 1em;

}

#body_2_2_2 li {font-size: .76em;font:arial, verdana, sans-serif; background: white; color:black; font-weight:normal; list-style-type:none; margin: .76em 0 0 3em;}
#body_2_2_2 span li {font-size: .76em;font:arial, verdana, sans-serif; background: white; color:black; font-weight:normal; list-style-type:none; margin: 0;}
#body_suivi {text-align:center;}
#body_suivi h1 {text-align:left; }
#body_suivi img {width:250px; height:175px; margin-left:auto; margin-right:auto; border:1px solid black; }

#body_suivi p {font-size: .76em;text-align: center; margin: .2em 0 .8em 0; text-indent:0; }

#body_2_2_3 {
float:left;  
width : 790px;
height: 20px;
background:  url(../media/fond_rouge.jpg) 0px 0px repeat-x white;
margin:0;
padding: 0;
border-top: 1px solid black;
}

#body_2_2_1 p, #body_2_2_3 p {text-align: center; color:white; font-weight:bold; margin: 0; line-height: 20px; text-indent:0; padding:0; }
#body_2_2_3 a:link {display:inline; text-decoration:none; color:white;}
#body_2_2_3 a:visited {display:inline; text-decoration:none; color:white;}
#body_2_2_3 a:hover{display:inline; text-decoration:none;color:white;}


div.ima_body_left {
float: left;
padding: 5px;
margin: 1em;
width:120px;
height:97px;  
background: url(../media/fond_blanc_large.jpg) 0px 0px repeat-y;
border: 1px solid black;
}

div.ima_body_center {
text-align:center;
margin:1em;
border: 1px solid black;
background: url(../media/fond_blanc_large.jpg) 0px 0px repeat-xy;
padding:.5em;
}

div.ima_body_center_sans_bordure {
text-align:center;
margin:1em;
border: none;
background: url(../media/fond_blanc_large.jpg) 0px 0px repeat-xy;
padding:.5em;
}

div.ima_body_center_sans_marge {
text-align:center;
margin:1em;
}

div.ima_body_right {
float: right;
margin-bottom:.5em;
}

div.ima_body_center p {font-size: .7em; color:#800; text-align: center; margin:0; text-indent:0; }
div.ima_body_center img{border: 1px solid black;}

div.ima_body_left img{border: 1px solid black;}
div.ima_body_left p {font-size: .7em; color:#800; text-align: center; margin:0; text-indent:0; }


#mosaique1 {width:510px; height: 267px; margin: 1em auto 0; background: url(../media/images/construction/mosa.jpg) top left no-repeat;}
#mosaique2 {width:510px; height: 267px; margin: 1em auto 0; background: url(../media/images/renovation/mosa.jpg) top left no-repeat;}
#mosaique3 {width:510px; height: 267px; margin: 1em auto 0; background: url(../media/images/crepis_enduit/mosa.jpg) top left no-repeat;}
#mosaique4 {width:510px; height: 267px; margin: 1em auto 0; background: url(../media/images/toiture/mosa.jpg) top left no-repeat;}
#mosaique5 {width:510px; height: 267px; margin: 1em auto 0; background: url(../media/images/chauffage/mosa.jpg) top left no-repeat;}
#mosaique6 {width:510px; height: 267px; margin: 1em auto 0; background: url(../media/images/carrelage_dallage/mosa.jpg) top left no-repeat;}
#mosaique7 {width:510px; height: 267px; margin: 1em auto 0; background: url(../media/images/electricite_plomberie/mosa.jpg) top left no-repeat;}
#mosaique8 {width:510px; height: 267px; margin: 1em auto 0; background: url(../media/images/terrassement/mosa.jpg) top left no-repeat;}
#mosaique9 {width:510px; height: 267px; margin: 1em auto 0; background: url(../media/images/vente_de_terre/mosa.jpg) top left no-repeat;}
#mosaique10 {width:510px; height: 267px; margin: 1em auto 0; background: url(../media/images/piscine/mosa.jpg) top left no-repeat;}
#mosaique11 {width:510px; height: 267px; margin: 1em auto 0; background: url(../media/images/acces/mosa1.jpg) top left no-repeat;}
#mosaique12 {width:510px; height: 267px; margin: 1em auto 0; background: url(../media/images/acces/mosa2.jpg) top left no-repeat;}

#mosa1 {display:inline;float: left; width : 366px; height: 245px; margin: 9px 0 0 10px; }
#mosa2 {display:inline;float: left; width : 120px; height: 80px; margin: 9px 0 0 4px; }
#mosa3 {display:inline;float: left; width : 120px; height: 80px; margin: 2px 0 0 4px; }
#mosa4 {display:inline;float: left; width : 120px; height: 80px; margin: 2px 0 0 4px; }


#nav {
width : 800px;
height: 600px;
margin:0 auto;
background: url(../media/plan.jpg) top center no-repeat;
}

#nav1 {float: left; width : 74px; height: 62px; margin: 60px 0 0 425px;}
#nav2 {float: left; width : 57px; height: 77px; margin: 60px 0 0 0px;}
#nav3 {float: left; width : 68px; height: 67px; margin: 0px 0 0 410px;}
#nav3b {float: left; width : 60px; height: 70px; margin: 0px 0 0 0px;}
#nav4 {float: left; width : 65px; height: 62px; margin: 0px 0 0 400px;}
#nav5 {float: left; width : 62px; height: 62px; margin: 0px 0 0 0px;}
#nav6 {float: left; width : 77px; height: 62px; margin: 30px 0 0 270px;}
#nav7 {float: left; width : 65px; height: 98px; margin: 0 0 0 110px;}