
body{
					background-color:#DFDFDF;
}

#emballage{
					width: 760px;
					background-color:white;
					/*font-family: Tahoma, "Lucida Grande", Arial, sans-serif;*/
					font-family: Arial, sans-serif;
					margin: auto;
}

#banniere{
					width:100%;
					text-align: justify;
					background-color:#5A5542;
}

/*c'est mieux de jouer sur le padding-top que le margin-top pour avoir 
un resultat uniforme dans tous les browser y compris IE*/
#contenu_principal{
					/*float: right;*/
					margin-left: 192px;
					padding-top: 80px;	
}

#colonne{
				float: left;
				/*margin-top: -40px;*/
				width: 185px;
				text-align: justify;
				/*background-color:#C6C3CE;*/
				height: 100%;
}
#langues{
				float: right;
				padding-right: 20px;
				padding-top: 20px;
}
#liste_gauche{
						 
						 width:160px;
						 list-style-type: none;
						 text-align: left;
						 padding: 3px;
						 margin-left: 25px;
						 font-size: 110%;
						 color: #B5B5B5;
						 
}
#liste_gauche li{
							 margin-bottom: 10px;
}
#liste_gauche a{
							 text-decoration: none;
							 /*color: #9F9795;*/
							 color: #D06634;		 
}

#liste_gauche a:hover{
							 /*color: #D06634;*/
							 color: #9F9795;
}


#logo_gauche{
						  /*position: absolute;
					    left: 0px;
					    top: 0px;*/
							/*display: inline;*/
							/*float: left;*/
}
#logo_gauche img{
							border: none
}

/*.liste_dessus{
width: 100%;
padding-bottom: 10px;
margin-left: 192px;
margin-top:80px;
}*/


/*pour avoir la disposition horizontale*/
ul#liste_langues li{
						/*float: left;*/
						text-align: justify;
						margin-bottom: 3px;
}

ul#liste_langues a{
						text-decoration: none;
						padding: 7px;
						text-align: center;
						/*color: #9F9795;*/
						color: #D06634;
						
}

#liste_langues a:hover{
						/*color: #D06634;*/
						color: #9F9795;
}


ul#liste_dessus, ul#liste_dessus_eng, ul#liste_dessus_es{
						 list-style-type: none;
						 width: 100%;
						 font-size: 110%;
						 padding-left: 0;
						 margin-left: 0;						 
}

#liste_dessus a:hover, #liste_dessus_eng a:hover, #liste_dessus_es a:hover{
						 /*color: #D06634;*/
						 color: #9F9795;
}

/*pour avoir la disposition horizontale...*/
ul#liste_dessus li, ul#liste_dessus_eng li, ul#liste_dessus_es li{
							float: left;
							/*display: inline;*/
							text-align: justify;
}

li.centre, li.bord_gauche {
							/*margin-right: 20px;*/

}
ul#liste_dessus a{
						text-decoration: none;
						padding: 7px;
						text-align: center;
						/*color: #9F9795;*/
						color: #D06634;
						
}
ul#liste_dessus_eng a{
						text-decoration: none;
						padding: 20px;
						padding-bottom: 7px;
						padding-top: 7px;
						text-align: center;
						/*color: #9F9795;*/
						color: #D06634;
}
ul#liste_dessus_es a{
						text-decoration: none;
						padding: 12px;
						padding-bottom: 7px;
						padding-top: 7px;
						text-align: center;
						/*color: #9F9795;*/
						color: #D06634;
}


#contenu_textuel_accueil,#contenu_textuel_energie, #contenu_textuel_industrie,
#contenu_textuel_marine_et_off_shore,#contenu_textuel_genie_civil_et_oeuvre_d_art, 
#contenu_textuel_batiment, #contenu_textuel_historique,#contenu_textuel_services, 
#contenu_textuel_liens, #contenu_textuel_coordonnees,#contenu_textuel_evenementiel,
#contenu_textuel_nouvelles{
					width:539px;
					height: 992px;
					padding-top: 0;
					/*background-position: center bottom;		*/			
}


#contenu_textuel_historique
{
					
					background-image: url(../images/centregris.jpg);
					background-repeat: no-repeat;
}

#contenu_textuel_accueil{
					background-image: url(../images/f_accueil.jpg);
}

#contenu_textuel_services{
					/*height: 100%;*/
					/*background-color: #CCCCCC;*/
					
					background-image: url(../images/f_services-g.jpg);
					background-repeat: no-repeat;
}

#contenu_textuel_nouvelles{
					background-image: url(../images/f_nouvelles-g.jpg);
}

#contenu_textuel_liens{
					background-image: url(../images/f_liens-g.jpg);
}

#contenu_textuel_evenementiel{
					background-image: url(../images/centregris.jpg);
}

#contenu_textuel_services ul, #contenu_textuel_liens ul, #contenu_textuel_nouvelles ul,
#contenu_textuel_accueil ul{
				 margin-left: 50px;
				 margin-right: 20px;
}

/*Pour evenementiel et coordonnees uniquement a cause de la longueur exceptionnelle de son contenu*/
#contenu_textuel_evenementiel{
					height: 100%;
					background-color: #CCCCCC;
					
					background-image: url(../images/f_evenement-g.jpg);
					background-repeat: no-repeat;

}
#contenu_textuel_coordonnees{
					height: 100%;
					background-color: #CCCCCC;
					
					background-image: url(../images/f_coordonnees-g.jpg);
					background-repeat: no-repeat;
					
}

/*c'est important de garder la sequence exate ici sinon le no-repeat s'applique au 
background-color */
#contenu_textuel_energie{
					height: 100%;
					background-color: #CCCCCC;
					
					background-image: url(../images/f_energie-g.jpg);
					background-repeat: no-repeat;
}

#contenu_textuel_industrie{
					background-image: url(../images/f_industrie-g.jpg);					
}

#contenu_textuel_marine_et_off_shore{
					background-image: url(../images/f_marine-g.jpg);				
}

#contenu_textuel_genie_civil_et_oeuvre_d_art{
					height: 100%;
					background-color: #CCCCCC;
					
					background-image: url(../images/f_civil-g.jpg);
					background-repeat: no-repeat;				
}

#contenu_textuel_batiment{
					background-image: url(../images/f_batiment-g.jpg);				
}

#logo_partenaires{
 					/*margin-left: 50px;*/	
					margin-left: auto;
					margin-right:	auto;			
}

#logo_partenaires td{
					padding-top: 20px;
					/*Pour avoir les images centrees*/
					text-align: center;
}

.boite_texte_gauche{
					width: 370px;
}

p {
	 				/*Je donne plus de choix ici parce que ca a moins d'impact sur la structure du site
					au lieux d'avoir un padding-bottom pour le dernier paragraphe de la page, j'ajoute 
					plutot un paragraphe vide...ca me donne plus de liberte de travail....*/
 	 				padding-left: 10px;
					padding-right: 10px;
					padding-top: 15px; 
					text-align: justify;
					letter-spacing: 1px;
					word spacing: 1px;
					font-size: 80%;
}

/*pour aligner le *... sur les bullets oranges*/
#contenu_textuel_services p{
					margin-left: 40px;
}

.nom_entreprise, .nom_SPRAT, .en_gras{
					/*text-weight: bold;*/
					/*font-size: 122%;*/
					font-weight: 900;
					/*display: block;*/
}

h1 {
	 				color: #D06634;
					padding-left: 10px;
					padding-top: 10px;
					font-size: 120%;
					
}

h2 {
	 				font-size: 100%;
					padding-left: 10px;
}

h3 {
	 				margin-left: 20px;
					margin-top: 20px;
					font-size: 100%;
}

#contenu_textuel_genie_civil_et_oeuvre_d_art h3, #contenu_textuel_coordonnees h3,
#contenu_textuel_energie h3, #contenu_textuel_accueil h3{
					margin-left: 10px;
					margin-bottom: -15px;
}

.boite_image_droite {
					padding-right: 30px;
					padding-top: 40px;
					float: right;
}

.boite_image_droite img{
					border: none;
}

.contact-principal{
				margin-top: 20px;
				margin-left: auto;
				margin-right: auto;
				width: 220px;
}
.contact-principal h2{
				text-align: center;
				margin-bottom: -7px;
				
}
.contact-principal p{
				letter-spacing: 1px;
				word spacing: 1px;
				margin-top: -2px;
				text-align: center;
}

.contact-details1 p, .contact-details2 p{
				font-size: 80%;
				letter-spacing: 1px;
				word spacing: 1px;
				margin-top: -2px;
}

.contact-details1 h2, .contact-details2 h2{
				font-size: 80%;
				margin-bottom: -2px;			
}

.contact-details1 {
				float: left;
				margin-left: auto;
				margin-right: auto;
				padding-bottom: 10px;
				margin-top: 20px;
}

.contact-details2 {
				float: right;
				margin-left: auto;
				margin-right: auto;
				padding-bottom: 10px;
				margin-right: 5px;
				margin-top: 20px;
}

.contact-details2 a, .contact-details1 a{
				text-decoration: none;
}

#contact{
				 margin-top: -10px;
}

.boite_texte_gauche ul{
				 margin-left: 50px;
}

#logo_sprat{
				 margin-top: 60px;
}

/*.liste_texte{
				list-style-image: url(../images/essais_bullet.jpg);
				list-style-position: inside;
}*/

/* c'est mieux de faire les bullet comme ca pcq je controle mieux leur position.*/
.liste_texte li{
				padding-top: 7px;
				background-image: url(../images/essais_bullet.jpg);
				background-repeat: no-repeat;
				background-position: 0px 11px;
				padding-left: 18px;
				padding-right: 10px;
				text-align: justify;
				letter-spacing: 1px;
				word spacing: 1px;
				font-size: 80%;	
}

.liste_texte_liens li{
				padding-top: 7px;
				background-image: url(../images/essais_bullet.jpg);
				background-repeat: no-repeat;
				background-position: 0px 11px;
				padding-left: 18px;
				padding-right: 8px;
				text-align: justify;
				letter-spacing: 1px;
				word spacing: 1px;
				font-size: 80%;
				margin-bottom: 10px;
}

.liste_texte_liens h3{
				padding-left: -15px;
				margin-left: -2px;
}

.boite_image_droite li{
				padding-bottom: 50px;
				/*padding-left: 20px;*/
}

.souligne p{
				margin-bottom: -10px;
				text-decoration: underline;
				font-weight: 900;
}

#historique{
				clear:both;
				margin-top: 40px;
}

#numero_rbq{
				text-decoration:none;
				font-style:normal;
				font-size: 80%;
				margin-left: 25px;
}

.video{
			  margin-left: 120px;
}

.pdf{
		 		margin: 10px;
}

.responsables{
			width:520px;
			margin-bottom: 15px;
			margin-left: 10px;
}

.responsables p{
			margin-top: -20px;
			clear: right;
			
}

.departement{
				font-size: 130%;			
}

.personne_ressource a{
				float: right;
				clear: both;
				display: inline;
				font-size: 90%;
				margin-top: -18px;
				margin-right: 10px;
}

.nom_Frederic, .nom_Jean_Marc, .nom_Dominic{
					/*font-size: 122%;*/
					font-weight: 900;
					font-style: italic;
}

.personne_ressource{
					margin-top: 5px;
}

.description_detail{


}

#inc{
font-size: 70%;
}


*html ul#liste_dessus{
			 /*margin-bottom: -20px;*/	
			/*ne marche pas pour le moment*/
}

/**html #colonne{
 margin-top: 20px;
}*/

*html #contact{
 margin-top: -5px;
}

*html .liste_texte_liens h3{
				margin-left: -20px;
}

/* *html ul.liste_dessus a{
	padding: 7px;
}

*html .boite_image_droite {
					position: absolute;
					left: 580px;
					top: 200px
}*/