body {
     margin: 0px;
     text-align: center;
     background:url(images/fond.gif) repeat  ;



}

#header{
	border: 0px solid blue;
	position:relative;
     margin-left: auto;
     margin-right: auto;
	width:1000px;
	height:90px;
       color: #fff;
font-family:Arial;

}
#header h1{
  font-size: 28px;
  font-style: bold;
  color: #fff;

}
#header i {
  color: #fff;
  font-size: 35px;
 font-family:Arial;
  font-style: bold;
}
#global{
	border: 0px solid #fff;
	position:relative;
     margin-left: auto;
     margin-right: auto;
     width: 1000px;
}
#menu_gauche{
	border: 0px solid red;
	float:left;
	position:relative;
	width: 277px;
	height:550px;
	background:url(images/chieng3.gif) no-repeat 0 0 ;
	text-align:left;

	     color: #fff;
font-family:Comic Sans MS;
}
#menu_droite{
	border: 0px solid red;
	float:right;
	position:relative;

	text-align:left;
	width: 200px;
        height:550px;
	background:url(images/chat-droite2.gif) no-repeat 0 0 ;
	text-align:left;
        font-family:Arial ;
	     color: #fff;
}
div#loi{
  position:absolute;
  left:0px;
  top:100px;
  background-image: url(images/loi-chiens-dangereux-s.jpg);
  background-repeat: no-repeat;
  width: 200px;
  height: 200px;


}

#page_principale{
	border: 0px solid red;
	float:left;
	position:relative;
	left:0px;
	width:521px;
	height:550px;
	background:url(images/palissade3b1.gif) no-repeat  ;
        padding: 1;
             color: blue;
font-family:Arial ;
font-size: 14px;
}
/*center content--------------------------*/
.center_content{
width:440px;
float:left;
padding:5px 10px 5px 15px;
}
div#photo{
  position:absolute;
  background-image: url(images/photo1.gif);
  background-repeat: no-repeat;
  left:40px;
  top:40px;
  width: 150px;
  height: 110px;

}
div#photo1{
  position:absolute;
  left:270px;
  top:15px;
  background-image: url(images/photo1b.gif);
  background-repeat: no-repeat;
  width: 200px;
  height: 150px;


}
div#photo2{
  position:absolute;
  left:120px;
  top:190px;
  background-image: url(images/photo1b.gif);
  background-repeat: no-repeat;
  width: 200px;
  height: 150px;


}
div#photo2b{
  position:absolute;
  left:314px;
  top:185px;
  background-image: url(images/photo1b.gif);
  background-repeat: no-repeat;
  width: 200px;
  height: 150px;


}
div#photo3{
  position:absolute;
  left:260px;
  top:100px;
  background-image: url(images/photo1b.gif);
  background-repeat: no-repeat;
  width: 200px;
  height: 250px;


}
div#photo4{
  position:absolute;
  left:70px;
  top:250px;
  background-image: url(images/photo1f.gif);
  background-repeat: no-repeat;
  width: 50px;
  height: 191px;


}
div#photo5{
  position:absolute;
  left:140px;
  top:270px;

  background-repeat: no-repeat;
  width: 73px;
  height: 103px;


}
div#photo6{
  position:absolute;
  left:250px;
  top:270px;
  background-image: url(images/photo1b.gif);
  background-repeat: no-repeat;
  width: 200px;
  height: 100px;


}
div#photo7{
  position:absolute;
  left:300px;
  top:350px;
  background-image: url(images/photo1b.gif);
  background-repeat: no-repeat;
  width: 200px;
  height: 100px;


}
div#photo8{
  position:absolute;
  left:40px;
  top:20px;
  background: #fff;
  background-repeat: no-repeat;
  width: 440px;
  height: 360px;
  color: #000;
  font-family:Arial
  font-size: 15px;
  text-align: left;

padding: 10px 10px 10px 10px;
}
div#tarifs{
  position:absolute;
  left:40px;
  top:20px;
  background: #fff;
  background-repeat: no-repeat;
  width: 440px;
  height: 300px;
              color: #000;
font-family:Arial
text-align:left;
padding: 10px 10px 10px 10px;
}
div#presentation{
  position:absolute;
  left:40px;
  top:20px;
  background: #fff;
  background-repeat: no-repeat;
  width: 440px;
  height: 410px;
              color: #000;
font-family:Arial
text-align:left; 
padding: 10px 10px 10px 10px;
}
#footer{
	border: 0px solid #fff;
	position:relative;
	width: 1000px;
	height:50px;
	clear:both;
	     color: #fff;
font-family:Arial


}
.prod_img{
float:left;
padding:0 5px 0 0;
text-align:center;
}
 body {
      behavior: url(csshover.htc);
     }
div#menu {width: 200px;}

/* fond blanc pour le menu */ 
div#menu a {color:#fff}
div#menu ul {padding: 0; width: 200px; border:0px solid; margin:0px; }

/* fond different au survol de la souris pour les sous menu et les "basiques"*/ 
div#menu li:hover {background: #EDD}
div#menu li.sousmenu:hover {background: #EBB;}

/* Rajout d'une petite fleche pour les sous menu */ 
div#menu li.sousmenu {background: url(fleche.gif) 95% 50% no-repeat;}

div#menu ul li {position:relative; list-style: none; border-bottom:0px solid;}
div#menu ul ul {position: absolute; top: -1px; left: 200px; display:none}

/* on rajoute une bordure a gauche et des padding, on doit donc réajuster la taille 299-(8 de bordure + 8 de padding) =291 */
div#menu li a {text-decoration: none; padding: 2px 0 4px 8px; display:block; border-left: 8px solid #BBB; width:192px}
div#menu ul.niveau1 li.sousmenu:hover ul.niveau2, 
div#menu ul.niveau2 li.sousmenu:hover ul.niveau3 {display:block;}

/* la bordure de chaque hauteur a une couleure de survol*/ 
div#menu li a:hover {border-left-color: red;}
div#menu ul ul li a:hover {border-left-color: #00FF00;}
div#menu ul ul ul li a:hover {border-left-color: #0000FF;}
#templatemo_menu {
	
	float: right;
	width: 230px;
	height: 200px;
	margin: 0;
	padding: 10px 0 0 0;
}

#templatemo_menu ul {
	float: right;
	list-style: none;
	margin: 0;
	padding: 0;
}

#templatemo_menu li a {
	
	display: block;
	width: 230px;
	height: 27px;
	color: #fff;


	font-size: 18px;
	margin: 0 0 0px 0;
	padding: 5px 0 0 45px;
	text-decoration: none;
        
}

#templatemo_menu li a:hover, #templatemo_menu li .current {
	
	background: url(images/tete-droite.gif) no-repeat;
	color: #389c3f;
	text-decoration: none;
	
}





