/* Mise en page globale */

html, 
body {			/* Margin et padding des balises html et body remis à zero */ 
	margin: 0;		
	padding: 0;
	width: 100%;
	height: 101%;
	background: url(../images/gradient3.gif) top left repeat-x;
	background-color: #ebe7e7; /* ou #c5d1df d2dbe6 ebe7e7 e9f1f9 507291 e2e1e1 6a7d7f*/
	font-family: Arial;
	font-size: 1em; 
	color: #474747;
	text-align: center;
}

#conteneurglobal {
	width: 770px;	
	margin-left: auto;
	margin-right: auto;
	padding: 0;
	min-height: 100%;
	position: relative;
	background: #fff;
	text-align: left;	/* div centrée dans la page : marges de gauche et droite de taille equivalente */
}


/* Navigation */

#navigation {
	height: 16px;	/* no width as the div will stretch to fill its parent container */
	padding: 5px 15px 5px 15px;
	background-color: #2d2c2c; /* 2d2c2c */
}

ul#menuhorizontal {
	float: left;
	margin: 0; /* supprime les marges risquant de poser pb avec differents navigateurs */
	padding: 0;
	font: bold 0.75em Arial;
	letter-spacing: 0.1em;
	list-style-type: none; /* supprime les puces */
}


#menuhorizontal li {
	display: inline;
}

#menuhorizontal a {
	color: #e5e5e5;
	text-decoration: none;
	padding-right: 7em; /* espacement entre chaque titre */
	letter-spacing: -0 em;
	
}

#menuhorizontal a:hover {
  color: #7b7b7b;
  text-decoration: underline;
}

#menuhorizontal li.lastli a{  /* supprime le padding du dernier lien de la liste */
  padding-right: 0;
}


/* Header */

#header {
	margin: 0;
	width: 770px;
	height: 142px;
	background: url(../images/top_image_fixe_accueil.jpg) top left no-repeat;
	background-color: #ccc;
}


h1 {				/* balises ayant des marges et padding par defaut à retirer si besoin */
	margin: 0;
	padding: 0;
	/*width: 196px;
	height: 135px;
	padding-left: 15px;

	float: left; */
	border: solid 1px red;
	float: left;
	width: 196px;
	height: 135px;

   background: url(../images/Logo_filaire_blanc_2.png) no-repeat top left;

        _background:none;
        _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/Logo_filaire_blanc_2.png',sizingMethod='scale');
}

h1 span{display:none;} /* cache le titre de substitution au logo*/

/* Contenu global */

#bandeau {
	height: 84px;
	margin: 0;
 	padding: 10px 10px 10px 10px;
	/* background: url(../images/blocpub1.gif) center no-repeat; */
}

#bloc-droit {			/* a float is an element that is aligned against the left or right side of its container */
	float: right;
	width: 370px;
	background: url(../images/fond_BlocMachines.jpg) top left no-repeat;
	height: 222px;
	padding-right: 10px;
}

#bloc-gauche {
	margin-right: 395px;
	margin-left: 10px;
	background: url(../images/fond_BlocMetier.jpg) top left no-repeat;
	height: 222px;
}

#bloc-gauche h2{
	margin: 0;
	padding: 10px;
	padding-bottom: 15px;
}

#bloc-gauche p{
	margin: 0;

}

#conteneur {
	width: 770px;
	margin: 0;
	padding: 0;
}

#paragraphelettrine {
	margin: 0;
	padding: 0 10px 20px 50px;
}

#paragraphelettrine h3 {
	margin: 0;
	padding: 0;
	font: bold 1em Arial;
	color: #474747;
}



/* Liste */

ul#liste {
	margin: 0;
	padding: 0;
 	font: normal 0.8em Arial;
	color: #474747;
}

#liste li {
	margin-left: 25px;
}


/* Syntaxe */

a {
	color: #474747;
}


p#titre {
	margin: 0;
	padding-top: 0.3em;
	padding-left: 0.5em;
	font: 1.1em Arial;
	color: #fff;
	text-align: left;
}

p#contenu {
	margin: 0;
	padding-top: 1.4em;
	padding-left: 0.5em;
	padding-right: 0.5em;
	font: 0.8em Arial;
	color: #fff;
	line-height: 1.2em;
	text-align: justify;
}


.liendroite {
	font: 0.8em Arial;
	text-align: right;
	text-decoration: underline;
	color: #fff;
}

p#contenu a {
	text-decoration: underline;
	color: #fff;	
}

p#contenu a:hover {
	text-decoration: underline;
	color: #fff;
}


h2 {
	font: normal 1.1em Arial;
	color: #474747;
	padding-left: 10px;
	padding-top: 10px;
}

h4 {
	font: normal 0.8em Arial; 
	color: #474747;
	margin: 0;
	padding: 0;
}

.majuscules {
	font: normal 0.9em Arial; 
	color: #474747;
	text-transform: uppercase;
}

.grassouligne {
	font-weight: bold;
	text-decoration: underline;
}

.gras {
	font-weight: bold;
}

.normal {
	font-weight: normal;
}

.lettrine {
	float: left;
	background: url(../images/fleche_verte.jpg) no-repeat;
	height: 32px;
	width: 33px;
	margin: 0 0 0 10px;
}


/* Footer */

#dernierelement { /* pour éviter la superposition du pied de page et du contenu */
	margin: 0;
	padding-bottom: 100px;

}

#footer {
	clear: both; /* so when comes into contact with a float it is placed right below where that float ends */
	position: absolute;
   	bottom: 0;
	left: 0;
   	height:60px;   /* Height of the footer */
	width: 770px;
	font-family: Arial, Verdana, Sans-serif;
	font-size: 0.7em; 
	color: #808080;
	border-top: 1px solid #808080;
}

.textefooter {
	margin: 0;
	padding: 15px 0 15px 10px;
}

.bordure {
	border-top: 1px solid #474747;
	padding-top: 15px;
}

.lienpied {
	color: #000;
	text-decoration: underline;
}