@charset "iso-8859-1";

		html, body {/* Corps de la page, centrage, image de fond, police et taille utilisé */
          margin: 0;
          padding: 0;
          background: #FFFFFF;
          color: #FFFFFF;
          font-family:  Verdana;
          font-size : 12px;

			
          }

		hr{/* Toute les bordures d'image enlevée en cas de liens */
		display : block;
		clear: both;
		margin: 0;
		padding: 0;
        border : 0px;
        height : 1px;
		color: #FFF;
		background: #FFF;
		}
        hr.dotted{/* Toute les bordures d'image enlevée en cas de liens */
        border : 0px;
		border-top : 1px dotted #000 ;
        height : 0px;}
		img{/* Toute les bordures d'image enlevée en cas de liens */
		border: 0px solid #fff ;}
		img.rea{/* Toute les bordures d'image enlevée en cas de liens */
			float: left;
			padding : 3px 3px 3px 3px;
         	border : 1px solid #FFF;
         	height : 115px;
         	margin-right : 15px;}
		img.center{/* Centrage de l'image */
		display:block;
		text-align: center ;}
		img.right {/* Alignement de l'image a droite par rapport au texte */
		float: right;
		display: block;
		border: 0px solid #0A6CA3 ;
		margin-left: 5px;
        }
        img.down {/* Alignement de l'image a droite par rapport au texte */
		vertical-align: text-bottom; 
        }
        img.left {/* Alignement de l'image a gauche par rapport au texte */
		float: left;
		border: 0px solid #0A6CA3 ;
		margin-right: 5px;
		}
		img.filet {/* Alignement de l'image a droite par rapport au texte */
		display: block;
		border-top: 3px solid #CCCCCC ;
		border-bottom: 3px solid #CCCCCC ;

        }
		table,th,tr,td{/* Toutes les bordures de tableau enlevée en cas de tableau */

		border:0 ;}
		.right{
			float : right;
		}

		/* ----------------------------------------------------------------------------------------Définitions de quelques class de colorisations de texte utilisable plusieurs fois */
        span.red{
          color: #FE2A0F;
        }
        span.bleu{
          color: #0678B3;
		}
        

		/* ----------------------------------------------------------------------------------------FIN DES SPAN */
		

		div#conteneur
		{/* --------   Bloc conteneur du site (la base du site)   --------- */
			position : relative;
			width: 970px;
			margin: 0 auto;
			padding: 0;
			height: 700px;
			background : #323232;
			border: 0px solid #000000 ;
			

		}


		div#header
		{/* ---------    Bloc en tete du site (bandeau, etc...)    --------- */
	        display: block;
	        width : 970px;
	        height : 218px;
	        margin: 0;
	        padding: 0;
	        border : 0px #000 solid;
	        
		}
		



		div#header h1 {
			display : block;
			margin: 0;
			padding: 0;
			position : absolute;
			top : 160px;
			left : 630px;
			border : 0px #000 solid;
		}

        
 
      	div#header h1 a span{
          display : none;
        }
        
        
        ul#menu {/* Formatage du menu */
            display: block;
            float : left;
			width: 322px;
			height : 188px;
			margin: 0 ;
			padding: 0 ;
			list-style-type: none ;

			padding-top: 30px;
			padding-left : 30px;
		}
		
		.index {
		background : url(../img/img-accueil.jpg) no-repeat top left;
		}
		.beton {
		background : url(../img/img-beton-cire.jpg) no-repeat top left;
		}
		.enduit {
		background : url(../img/img-enduit-de-terre.jpg) no-repeat top left;
		}
		.resine {
		background : url(../img/img-resine.jpg) no-repeat top left;
		}
		.tadelakt {
		background : url(../img/img-tadelakt.jpg) no-repeat top left;
		}
		.galerie {
		background : url(../img/img-galerie.jpg) no-repeat top left;
		}
		.contact {
		background : url(../img/img-contact.jpg) no-repeat top left;
		}
		.part {
		background : url(../img/img-partenaires.jpg) no-repeat top left;
		}
        ul#menu li{
			padding : 0;
			margin : 0;
        	display : block;
			margin-bottom:  9px;
			padding-left : 10px;
		}
        ul#menu li a{

			padding : 0;
			margin : 0;
			text-decoration : none;
			display : block;
			width : 164px;
	        height: 25px;
	        color : #FFFFFF;
			font-size: 12px;
			font-weight: normal ;
			
			
        }
        ul#menu li a.lien1{
        	background : url(../img/bt-haut-beton-cire.png) no-repeat left top;
        }
        ul#menu li a.lien2{
        	background : url(../img/bt-haut-resine-decorative.png) no-repeat left top;
        }
        ul#menu li a.lien3{
        	background : url(../img/bt-haut-enduit-naturel.png) no-repeat left top;
        }
        ul#menu li a.lien4{
        	background : url(../img/bt-haut-tadelakt.png) no-repeat left top;
        }
        ul#menu li a.lien5{
        	background : url(../img/bt-haut-galerie-photo.png) no-repeat left top;
        }


		ul#menu li a span{
			display: none;
			}
         ul#icones {/* Formatage du menu */
            display: block;
            position : absolute;
            top : 30px;
            left : 790px;
			width: 180px;
			height : 22px;
			margin: 0 ;
			padding: 0 ;
			list-style-type: none ;
			border : 0px solid #000;
		}
        ul#icones li{
			padding : 0;
			margin : 0;
			display : block;
			float : left;
			height : 22px;
			border-left : 1px dotted #CCCCCC;
			padding-left : 20px;
			padding-right : 20px;
		}

        ul#icones li a{
			display : block;
			padding : 0;
			margin : 0;
			text-decoration : none;
			
			
        }
        ul#icones li a.lien1{
        	margin-top: 2px;
        	width : 18px;
	        height: 15px;
        	background : url(../img/icone-accueil.png) no-repeat left center;
        }
        ul#icones li a.lien2{
        	margin-top: 2px;
        	width : 22px;
	        height: 15px;
        	background : url(../img/icone-contact.png) no-repeat left center;
        }
        ul#icones li a.lien3{
        	margin-top: 1px;
        	width : 14px;
	        height: 18px;
        	background : url(../img/icone-liens-partenaires.png) no-repeat left center;
        }
       

		ul#icones li a span{
			display: none;
			}
        
        
        ul#gal {/* Formatage du menu */
            display: block;
			width: 292px;
			height : 394px;
			float : left;
			position : relative;
			padding: 0;
			margin: 0;
			list-style-type: none ;
			padding-left : 30px;
			background : #323232;
			border:0px solid #000
		}
        ul#gal li{
			padding : 0;
			margin : 0;
        	display : block;
			margin-top:  19px;

		}
        ul#gal li a{

			padding : 0;
			margin : 0;
			text-decoration : none;
			display : block;
			width : 186px;
	        height: 76px;
	        
			
			
        }
        ul#gal li a.lien1{
        	background : url(../img/vignette-beton-cire.png) no-repeat left top;
        }
        ul#gal li a.lien2{
        	background : url(../img/vignette-resine-decorative.png) no-repeat left top;
        }
        ul#gal li a.lien3{
        	background : url(../img/vignette-enduit-naturel.png) no-repeat left top;
        }
        ul#gal li a.lien4{
        	background : url(../img/vignette-tadelakt.png) no-repeat left top;
        }



		ul#gal li a span{
			display: none;
			}
			
			
			
        ul#gal2 {/* Formatage du menu */
            display: block;
			position : relative;
			padding: 0;
			margin: 0;
			list-style-type: none ;
			padding-top : 14px;
			 
		}
        ul#gal2 li{
			padding : 0;
			margin : 0;
        	display : block;
			margin-bottom:  3px;
			clear : both;
		}
        ul#gal2 li a{
			display : block;
			padding : 0;
			margin : 0;
			text-decoration : none;
			
			
	        
			
        }
        ul#gal2 li a.lien1{
        	background : url(../img/bt-beton-cire_03.jpg) no-repeat left top;
        	width : 166px;
	        height: 27px;
        }
        ul#gal2 li a.lien2{
        	background : url(../img/bt-resine-decorative_03.jpg) no-repeat left top;
        	width : 166px;
	        height: 27px;
        }
        ul#gal2 li a.lien3{
        	background : url(../img/enduit-naturel_03.jpg) no-repeat left top;
        	width : 166px;
	        height: 27px;
        }
        ul#gal2 li a.lien4{
        	background : url(../img/bt-tadelakt_03.jpg) no-repeat left top;
        	width : 166px;
	        height: 27px;
        }



		ul#gal2 li a span{
			display: none;
			}
			
		div.photo{
            display: block;
			position : relative;
			padding: 0;
			margin: 0;	
			text-align: left;	
			width : 166px;
			margin-left : 1px;
			margin-top : 5px;
			border:0px solid #000;
		}	
			
		
        img.galphoto{
			display : block;
			padding : 0;
			margin : 0;
			text-decoration : none;
	        float: left;
	        height : 44px;
	        width : 50px;
			margin-right : 5px;
        	margin-bottom : 5px;
			cursor : hand;
        }	

 
			
       	div#contenu
		{/* --------    Bloc Contenu (partie centrale du site)     -----------*/
			display:block;
			float : left;
			position : relative;
			width: 970px;
			height : 394px;
			margin: 0;
			padding : 0;
			
			border : 0px solid #000;
			
		}

      
        div#contenu div#centre{
			display: block;
			width: 648px;
			height : 394px;
			float : left;
			position : relative;
			padding: 0;
			margin: 0;
			
      		}
      	div#contenu div#centre div#galphoto{
      		display: block;
			width: 458px;
			height : 394px;
			position : absolute;

			padding: 0;
			margin: 0;
			background : #FFF;
			top:0px;
			left: 0px;
      		}
      	div#contenu div#centre div#galphoto div#desc{
      		display: block;
			position : absolute;
			bottom : 0px;
			right : 15px;
			padding: 0;
			margin: 0;
			background : #FFF;
			font-size: 9px;
			font-weight: normal;
	        color : #323232;
      		}
      	div#contenu div#centre div#galphoto img.photo{
			display: block;
			width: 436px;
			height : 366px;
			position : relative;
			padding: 0;
			margin: 0;
			margin-top : 14px;
			margin-left : 10px;
      		}
      	div#contenu div#centre div#texte{
			display: block;
			width: 270px;
			height : 352px;
			
			position : absolute;
			padding: 0;
			margin: 0;
			top : 40px;
			left : 356px;
			text-align : left;
			font-size: 16px;
			line-height : 22px;
			font-weight: normal;
	        color : #FFF;
      		}
      	div#contenu div#centre2{
			display: block;
			width: 618px;
			height : 374px;
			float : left;
			position : relative;
			padding: 0;
			margin: 0;
			padding-top : 20px;
			padding-left : 30px;
			font-size: 13px;
			font-weight: normal;
	        color : #000000;
	        background : url(../img/contact-map.jpg) no-repeat left top;
      		}
      	div#contenu div#centre3{
			display: block;
			width: 615px;
			height : 374px;
			float : left;
			position : relative;
			padding: 0;
			margin: 0;
			padding-top : 20px;
			padding-left : 30px;
			font-size: 12px;
			font-weight: normal;
	        color : #000000;
	        background : #FFF;
      		}
      	div#contenu div#centre3 img{
      		margin-bottom : 15px;
      		clear : both;
      		}
      	div#contenu div#centre div#droite{
			display: block;
			width: 184px;
			height : 394px;
			float: right;
			position : relative;
			padding: 0;
			margin: 0;
			margin-left : 3px;
			margin-right : 2px;
			background : #FFF;
			text-align: center;
			overflow: auto;
      		}
      		
		div#contenu h2{
			display: block;
			margin: 0;
			padding : 0;
			font-size: 20px;
			font-weight: normal;
	        color : #CCCCCC;
	        text-align : center;
      	}
   
      	div#contenu a{
	        color : #000;
	        text-decoration : none;
      	}


		
		div#pied{
	        display: block;
	        padding: 0;
			margin: 0;
			font-size: 12px;
			font-weight: normal;
	        color : #FFFFFF;
			text-align : center;
			height : 88px;
			width: 970px;
      	}
      	div#pied div#gauche{
	        display: block;
	        float: left;
	        padding: 0;
			margin: 0;
			font-size: 8px;
			font-weight: normal;
	        color : #CCCCCC;
			text-align : center;
			height : 88px;
			width: 322px;
			background : #4F4F4F;
      	}
		div#pied a{

			font-size: 8px;
			font-weight: normal;
	        color : #CCCCCC;
			text-decoration : none;
      	}

		#clear {/* Bloc qui maintient les autres a la meme hauteur */
			clear: both;

		}