
/* Met touts les margin et padding a zero */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, label, input, p, blockquote, th, td, form, img 
{
	margin: 0;
	padding: 0;
}

/* Enleve les points dans les listes */
ul, ol 
{
	list-style: none;
}

html 
{
	background: #fff url(background.png) repeat-x 0 0; /* Ajoute la barre dégradé sous le header */
}

body 
{
	position: relative; /* Important */
	margin: 0 auto;
	font: 1em Georgia, "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
	color: #646464;
} 


/* +----------------------------------------------------+ */
/* |                       HEADER                       | */
/* +----------------------------------------------------+ */

#EnTete
{
	position: relative;
	margin: 0 auto;
	width: 800px;
	height: 170px;
}

/* +----------------------------------------------------+ */
/* |                        LOGO                        | */
/* +----------------------------------------------------+ */

#EnTete h1 a 
{
	position: absolute;
	left: 0;
	top: 0;
	width: 225px;							/* Largeur du logo */
	height: 140px;						 	/* Hauteur du logo */
	background: transparent url(logo.png) no-repeat 0 0;	/* Affiche le logo */
}

h3
{
	color: #8bae0a;
}

/* +----------------------------------------------------+ */
/* |                        MENU                        | */
/* +----------------------------------------------------+ */

#EnTete li a 
{	
	position: absolute;
	top: 114px;
	display: block;
	float: left;
	text-indent: -9999px;
}

li a#creation 
{
	left: 347px;
	width: 119px;
	height: 20px;
	background: transparent url(creation-graphique.png) no-repeat 0 0;	
}

li a#sites 
{
	left: 490px;
	width: 87px;
	height: 20px;
	background: transparent url(sites-internet.png) no-repeat 0 0;	
}

li a#ecommerce 
{
	left: 601px;
	width: 75px;
	height: 20px;
	background: transparent url(e-commerce.png) no-repeat 0 0;	
}

li a#referencement 
{
	left: 700px;
	width: 95px;
	height: 20px;
	background: transparent url(referencement.png) no-repeat 0 0;	
}

a#creation:hover, a#sites:hover, a#ecommerce:hover, a#referencement:hover
{
	background-position: 0 -20px;	
}

li a#devis 
{
	position: absolute;
	left: 605px;
	top: 0;
	width: 112px;
	height: 88px;
	background: transparent url(devis.png) no-repeat 0 0;	
}


/* +----------------------------------------------------+ */
/* |                       CONTENU                      | */
/* +----------------------------------------------------+ */

#contenu
{
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 800px;
	overflow: hidden; /* important */	
}

img.border 
{
	border: 6px solid #d8d8d8; /* Met un contour gris */
}

/* Zone de gauche */
#gauche
{
	position: relative;
	width: 475px;
	float: left;
	padding: 0 20px 0 5px;
}

/* Zone de droite */
#droite
{
	position: relative;
	width: 275px;
	float: right;
	padding: 0 5px 0 20px;
}

#gauche ul a:hover img, #droite ul a:hover img 
{
	border: 6px solid #8bae0a; /* Met le contour vert */
}

a.heading 
{
	color: #646464;
	text-decoration: none;
}

a.heading:hover 
{
	color: #8bae0a;
	text-decoration: none;
}


/* +----------------------------------------------------+ */
/* |              BOUTON RETOUR HAUT DE PAGE            | */
/* +----------------------------------------------------+ */

#RetourHaut 
{
	padding-top: 20px;
	margin-bottom: 0;
}

#RetourHaut a 
{
	text-indent: -9999px;
	display: block;
	width: 20px;
	height: 19px;
	margin-left: 455px;
	background: transparent url(hdp.gif) no-repeat 0 0;
}

#RetourHaut a:hover 
{
	background-position: 0 -19px;		
}



/* +----------------------------------------------------+ */
/* |                        FOOTER                      | */
/* +----------------------------------------------------+ */

#footer 
{
	clear: both; /* pour que le footer passe dans le flux */
	padding: 40px 5px 60px 5px;
	height: 180px;
	background: transparent url(footer-background.gif) repeat-x 0 30px;
	color: #fff;
}

#footer_columns 
{
	position: relative;
	margin: 0 auto;
	width: 790px;
	height: 140px;
	padding: 25px 5px 10px 5px;
}


#footer_contact
{
	float: left;
	width: 33%;
}

#copyright 
{
	position: relative;
	margin: 0 auto;
	width: 765px;
	clear: both;
	font: 0.7em "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
	color: #8d8d8d;
}

/* ---------------------------------------------------- */


