<!--
 

body {  margin-top:0; margin-bottom:0;
	font-family: Arial, Helvetica, Geneva, sans-serif; 
	font-size : 12px;
	background-color: #000000;
	position: relative;
	top: 10px;
	left: 0px;
	width: 1000px;
	height: 100%;
        border-width: thin;
        border-color: blue;
	margin-left: auto;
	margin-right: auto; }




/*liens noirs qui passent au gris */

 A {
font-family: Arial, Helvetica, Geneva, sans-serif;
font-weight: bold;
font-size:16px;
color: white;
text-decoration:none; 
letter-spacing : 3px;
}
A:hover {
color: #cccccc;
text-decoration: none;
font-family: Arial, Helvetica, Geneva, sans-serif;
font-weight: bold;
font-size: 16px;
letter-spacing: 3px;
}


a.imgover1
{
position:absolute;
top: 200px;
left: 40px;
text-decoration: none;
width: 174px ;
height: 77px;
background-image:url(interface/offre-1.gif);
background-position:left top;
background-repeat:no-repeat;
display: block;

}


a:hover.imgover1 
{

width: 174px ;
height: 77px;
background-image:url(interface/offre-2.gif);
background-position:left top;
background-repeat:no-repeat;
z-index: 1;
}

a.imgover2
{
position:absolute;
top: 280px;
left: 40px;
text-decoration: none;
width: 174px ;
height: 77px;
background-image:url(interface/prestations-1.gif);
background-position:left top;
background-repeat:no-repeat;
display: block;
}


a:hover.imgover2 
{
width: 174px ;
height: 77px;
background-image:url(interface/prestations-2.gif);
background-position:left top;
background-repeat:no-repeat;
z-index: 1;
}

a.imgover3
{
position:absolute;
top: 360px;
left: 40px;
text-decoration: none;
width: 174px ;
height: 77px;
background-image:url(interface/realisations-1.gif);
background-position:left top;
background-repeat:no-repeat;
display: block;
}


a:hover.imgover3 
{
width: 174px ;
height: 77px;
background-image:url(interface/realisations-2.gif);
background-position:left top;
background-repeat:no-repeat;
z-index: 1;
}







img
{
border: none;
}

/*logo en haut de page à gauche de l'ecran*/




.tableau1 { 
            width: 1000px;
            text-align: center;
            height: 138px; }



@-ms-keyframes logo1 {
0%   {top: -250px;}
100% {top: 40px;  }
}

@-webkit-keyframes logo1 {
0%   {top: -250px;}
100% {top: 40px;  }
}

@-moz-keyframes logo1 {
0%   {top: -250px;}
100% {top: 40px;  }
}

@-o-keyframes logo1 {
0%   {top: -250px;}
100% {top: 40px;  }
}

@keyframes logo1 {
0%   {top: -250px;}
100% {top: 40px;  }
}


.banniere 
{ 
position:absolute;
top: 40px;
left: 234px;
-ms-animation:logo1 1s ease;
	
-webkit-animation:logo1 1s ease;
-moz-animation:logo1 1s ease;
-o-animation:logo1 1s ease;
animation:logo1 1s ease;
}



@-ms-keyframes source {
0%   { opacity: 0;  }

100% { opacity: 1;  }
}

@-webkit-keyframes source {
	
0%   {
 opacity:1;   }
	
100% {	opacity:1;
  }

}

@-moz-keyframes source {
0%   { opacity: 0;  }
100% { opacity: 1;  }
}

@-o-keyframes source {
0%   { opacity: 0;  }
100% { opacity: 1;  }
}

@-webkit-keyframes source {
0%   { opacity: 0;  }

100% { opacity: 1;  }
}

@keyframes source {
0%   { opacity: 0;  }
100% { opacity: 1;  }
}


.logo { text-align: center; 
position:absolute;
top: 20px;
left: 20px;
animation-name: source;

animation-duration:2s;
animation-iteration-count:1;

-webkit-animation-name: source;
	
-webkit-animation-duration:2s;
	
-webkit-animation-iteration-count:1;

}



/*tableau de la page gauche avec l'adresse*/

.background
{

position:absolute;
left: 0px;
top:176px;
width: 160px ;
height: 570px;


}

.chapitre
{
font-size: 32px;
}

.box
{
position:absolute;
top: 162px;
left: 226px;
width: 740px ;
height: 22px;
border-radius: 10px;
border: 1px solid black;
padding: 4px; 
background : red;
text-align: center;
background: -moz-linear-gradient(top, black, #CC0000, black);
background: -ms-linear-gradient(top, black, red, black);
background: -o-linear-gradient(top, black, red, black);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#000000),  color-stop(0.33, red), color-stop(.33, red), to(#000000)); 
box-shadow: 6px 6px 4px #333333;
}



/* liens de la page centre, de noir ils passent en noir soulignés*/

A.liens_titre
{

color: #ffffff; 
text-decoration:none;
font-family: Arial, Helvetica, Geneva, sans-serif;
font-size:16px;
letter-spacing : 2px 
}

A:hover.liens_titre 
{
color: #cccccc;
/*text-decoration:underline;*/
font-family: Arial, Helvetica, Geneva, sans-serif;
font-size:16px;
letter-spacing : 2px 
}


/*position des liens sur le menu*/

.position1
{
position:absolute;
top: 170px;
left: 350px;
}

.position2
{
position:absolute;
top: 170px;
left: 700px;
}



/*Tableau de la page au centre, elle contient tous les chapitres*/

.tableau_texte
{
background-color: black;
position:absolute;
top: 210px;
left: 246px;
width: 640px;
height: 100%;
font-family: Arial, Helvetica, Geneva, sans-serif;
font-size: 14px;
letter-spacing: 1px;
color: white;
z-index: 4;
}

/*Tableau de la page au centre, elle contient tous les chapitres*/

.texte2
{
background-color: black;
position:absolute;
top: 400px;
left: 646px;
width: 340px;
height: 100%;
font-family: Arial, Helvetica, Geneva, sans-serif;
font-size: 14px;
letter-spacing: 1px;
color: white;
z-index: 5;
text-align: justify;
color : #CC0000;
}

/* animation du centre en intro sur la page index*/
.anim-intro
{
background-color: white;


border: 0px;
}

#image-html
{
position: absolute;
top: 180px;
left: 300px;
}