/* CSS Document */

body{
	margin: 0;
	background-image:url(images/bg_haut.jpg);
	background-repeat:repeat-x;
	background-color: #ffffff;
}

#header{
	width: 920px;
	height: 73px;
	margin: 0 auto;
	background-color: #7f7878;
}

#header img{
	border: none;
}

#logo{
	float: left;
	margin: 0 20px 0 0;
}

#header h1{
	color: #ffffff;
	font-size: 1em;
	margin: 0 0 0 0;
	padding: 20px 0 0 0;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}

.h1 {
	color: #ffffff;
	font-size: 16px;
	margin: 0 0 0 0;
	padding: 20px 0 0 0;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}

#menu{
	width: 920px;
	height: 27px;
	margin: 0 auto;
	background-color: #ffffff;
}


#footer{
	width: 100%;
	height: 100%;
	margin: 0 auto;
	padding: 10px 0;
	clear: both;
	text-align: center;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	background-color: #7f7878;
}

/*--------MENU---------------*/

#liste_menu span{
	display: none;
}

#liste_menu{
	list-style-type: none;
	margin: 0 0 0 0;
	padding: 0;
}

#liste_menu li{
	float: left;
}

a#image1 { /* définition de la classe "image" de la balise <a> */
     display: block; /* la balise a doit être en bloc */
     width: 277px; /* largeur de l'image réactive */
     height: 26px; /* hauteur de l'image réactive */
     background-image: url(images/notre_societe.jpg); /* source de l'image de départ */
     background-repeat: no-repeat;
}

a#image1:hover { /* définition de la classe "image" de la balise <a> au survol */
     background-image: url(images/notre_societe.jpg); /* source de l'image d'arrivée */
     }
	 
a#image2 { /* définition de la classe "image" de la balise <a> */
     display: block; /* la balise a doit être en bloc */
     width: 371px; /* largeur de l'image réactive */
     height: 26px; /* hauteur de l'image réactive */
     background-image: url(images/produits_services.jpg); /* source de l'image de départ */
     background-repeat: no-repeat;
}

a#image2:hover { /* définition de la classe "image" de la balise <a> au survol */
     background-image: url(images/produits_services.jpg); /* source de l'image d'arrivée */
     }
	 
a#image3 { /* définition de la classe "image" de la balise <a> */
     display: block; /* la balise a doit être en bloc */
     width: 272px; /* largeur de l'image réactive */
     height: 26px; /* hauteur de l'image réactive */
     background-image: url(images/contact.jpg); /* source de l'image de départ */
     background-repeat: no-repeat;
}

a#image3:hover { /* définition de la classe "image" de la balise <a> au survol */
     background-image: url(images/contact.jpg); /* source de l'image d'arrivée */
     } 
	 
img{
	border: none;
	display: block;
}

/*--------MENU FOOTER---------------*/

#menu_footer{
	list-style-type: none;
	color: #ffffff;
	margin: 20px 0 0 0;
}

#menu_footer li{
	display: inline;
}

#menu_footer a{
	color: #ffffff;
	text-decoration: none;
}

#menu_footer a:hover{
	text-decoration: underline;
}

#footer p{
	color: #ffffff;
}

#footer a{
	color: #ffffff;
	text-decoration: none;
}


/*--------INDEX---------------*/

#content{
	width: 920px;
	height: 652px;
	margin: 0 auto;
	clear: left;
	font-family: Arial, Helvetica, sans-serif;
	border-right: 1px dotted #7f7878;
	background-color: #ffffff;
}

#gauche{
	width: 650px;
	height: auto;
	margin: 0 auto;
	float: left;
	border-left: 1px dotted #7f7878;
	background-color: #dcdde6;
}

#gauche .texte {
	font-size: 18px;
}

#gauche p{
	color: #333333;
	margin: 10px 20px;
	font-size: 12px;
}

#droite{
	width: 260px;
	height: auto;
	margin: 0 auto;
	float: right;
	background-color: #ffffff;
}

#droite h1{
	font-size: 1em;
	color: #000000;
	margin: 10px 20px;
	padding:0;
	font-family: "Trebuchet MS", Verdana;
}

#droite .texte {
	font-size: 18px;
}

#droite p{
	color: #333333;
	margin: 10px 20px;
	font-size: 0.8em;
}

#droite a{
	color: #333333;
}

#img_index{
	margin: 0 0 20px 40px;
}

.fleche{
	float: left;
	margin: 8px 5px 0 0;
	padding: 0 0 0 20px;
}

.fleche_2{
	float: left;
	margin: 8px 5px 0 0;
	padding: 0 0 0 20px;
}


/*--------PRODUITS ET SERVICES---------------*/

#content_prod_serv{
	width: 920px;
	height: 540px;
	margin: 0 auto;
	clear: left;
	background-color: #dcdde6;
	border-left: 1px dotted #7f7878;
	border-right: 1px dotted #7f7878;
}

#content_prod_serv .titre2 {
	font-size: 1.2em;
	color: #a90117;
	margin: 0;
	padding:20px 0 0 70px;
	font-family: "Trebuchet MS", Verdana;
}

#content_prod_serv .texte {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	margin: 0;
	padding: 15px 0 0 70px;
	color: #000000;
}

#content_prod_serv .titre{
	font-size: 1em;
	color: #000000;
	margin: 0;
	padding: 9px 0 0 0;
	font-family: "Trebuchet MS", Verdana;
}

.fleche_3{
	float: left;
	margin: 8px 10px 0 0;
	padding: 0 0 5px 20px;
}

.prod_bloc{
	width: 380px;
	float: left;
	margin: 20px 0 0 50px;
	background-color: #dcdde6;
}

.prod_bloc ul{
	margin: 20px 0;
	padding: 0 0 0 70px;
	list-style-type:square;
	color: #a90117;
}

.prod_bloc ul li a{
	color: #333333;
}

/*--------CONTACT---------------*/

#content_contact{
	width: 920px;
	margin: 0 auto;
	height: 650px;
	border-left: 1px dotted #7f7878;
	border-right: 1px dotted #7f7878;
	background-color: #dcdde6;
}

#gauche_contact{
	width: 460px;
	height: auto;
	margin: 0 auto;
	padding: 20px 0 0 40px ;
	float: left;
	
}

#gauche_contact .titre2{
	font-size: 1em;
	padding: 5px 20px 5px 20px;
	font-family: "Trebuchet MS", Verdana;
	}

#gauche_contact p{
	font-size: 0.9em;
	padding: 5px 20px 0 20px;
}

#gauche_contact a{
	color: #333333;
}

#droite_contact{
	width: 350px;
	height: 652px;
	margin: 0 auto;
	padding: 0;
	float: right;
	background-color: #ffffff;
}

#formulaire{
	padding: 10px 20px 0 20px;
}

#formulaire p{
	font-size: 0.8em;
}

#formulaire input{
	width: 310px;
}

#formulaire label{
	display: block;
	width: 200px;
}

#formulaire textarea{
	width: 310px;
	height: 80px;
}

#formulaire #button{
	width: 310px;
	border: 1px solid #666666;
}

#plan{
	margin: 10px 0 0 0;
	border: 1px solid #666666;
}

#toptechnology a{
	font-size: 0.7em;
}

#toptechnology a:hover{
	font-size: 0.7em;
	text-decoration: underline;
}

.lien {
	font-weight: normal;
	font-style:normal;
	text-decoration: none;
}

.gris {
	color:#333333;
}

.titre {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #000;
}

#gauche .marge {
	padding: 0 0 0 25px;
}

.neutre {
	text-decoration: none;
	color: #000;
	font-weight: normal;
}