/*la<b>brenne</b> Front-end CSS*/

*{margin: 0; padding: 0; zoom: 1;} /*RESET+HAS LAYOUT*/
.invisible{position: relative; top: -5000px;}
.courant{font: normal 12px/16px "Trebuchet MS", arial, helvetica, sans-serif; color: #81959d; } /*RESET TEXTE COURANT*/
.trigger{width: 100%;height: 100%; display: block;} /*ZONE REACTIVE DES INFOBULLES*/

/***************************************************/
/*********************HTML/BODY*********************/
/***************************************************/

html{
font: normal 12px/16px "Trebuchet MS", arial, helvetica, sans-serif;
color: #81959d;
text-align: center;
background: url(../images/bg0.jpg) repeat-x top #f1f6f7;
height : 100%;
}

body{
margin: 0 auto;
text-align: left;
background: url(../images/bgmain.jpg) 50% 0 no-repeat;
min-height :  100%;
}

b{
	color:#70848c;
}

#total{
position: relative;
min-height: 100%;
}

#container{
width: 980px;
padding-top: 210px;
margin: 0 auto;
min-height: 100%;
position: relative;
}

/***************************************************************/
/*********************MISE EN FORME CONTENU*********************/
/***************************************************************/

/**********ALIGNEMENTS/FLOAT/CLEAR**********/

.left{text-align:left;}
.center{text-align:center;}
.right{text-align:right;}

.fleft{float:left;}
.fright{float:right;}
.fnone{float:none;}

.cleft{clear:left;}
.cright{clear:right;}
.cboth{clear:both;}


/**********************************************************/
/*********************ELEMENTS COMMUNS*********************/
/**********************************************************/

/*#contenu{
	text-align:justify;
}
*/

/**********LES LIENS**********/

a{text-decoration: none;}
a:active{color: #81959d}


/**********LES TITRES**********/

h1{
width: 168px;
height: 178px;
position: absolute;
top: 150px;
left: 0px;
text-indent: -5000px;
z-index: 200;
}

.positionnement h1{
background: url(../images/logo.png) no-repeat;
width: 168px;
height: 178px;
}

h1 a{
position: relative;
display: block;
width: 100%;
height: 100%;
}

#contenu h2{
font-size: 18px;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
margin-bottom: 15px;
margin-top: 25px;
text-indent: 20px;
}

#contenu h3{
font-size: 14px;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
margin-bottom: 10px;
text-indent: 5px;
margin-right: 20px;
padding-bottom: 3px;
}

/**********LES PARAGRAPHES**********/

#contenu p{
margin-bottom: 15px;
padding-right:10px;
}

/**********LES LISTES**********/  /*ajouter un span.courant autour du contenu des éléments de liste pour retrouver les mémes attributs que le texte courant*/

#contenu ul, #contenu ol{ 
font-weight: bold;
margin-bottom: 15px;
margin-left: 15px;
text-align:left;
}

#contenu ul{list-style: inside square;}
#contenu ol{list-style: inside decimal;}

#contenu li span{ /*inutil de préciser la class du span autour du contenu des éléments de liste pour retrouver les mêmes attributs que le texte courant*/
	font: normal 12px/16px "Trebuchet MS", arial, helvetica, sans-serif;
	color: #81959d;
}

#contenu dl{
	margin-bottom: 15px;
	font-weight:bold;
}

#contenu dl dd+dt{
	margin-top:15px;
}

#contenu dl dd{
	font-weight:normal;
	margin-left: 15px;
}

/**********LES COORDONNEES**********/
dl.coordonnees{
	border:1px solid #000000;
	height:105px;
	margin-left:auto;
	margin-right:auto;
	padding:5px;
	text-align:center;
	width:400px;
}

dl.coordonnees dt{
	font-weight:bold;
	height:20px;
	text-align:center;
}

dl.coordonnees dd{
	margin-left:0 !important;
	text-align:center;
}

dl.coordonnees dd.plan{
	float:right;
}

dl.coordonnees dd.cp{
	display:inline;
}

dl.coordonnees dd.ville{
	display:inline;
}

dl.coordonnees dd.tel{
	margin-top:10px;
}

dl.coordonnees dd a img{
	border-width:0;
}


/**********LES IMAGES**********/

#contenu dl.image_principale{
/*width: Ã  specifier en dur dans la page HTML;*/
/*float: right;*/
padding: 5px 30px;
text-align:center;
}

#contenu dl.image_principale dd{
border-top: 7px solid #fdf21e;
background: #545454;
color: #fff;
display: block;
font-style: italic;
font-size: 11px;
padding: 3px 5px;
text-align: center;
position: relative;
top: -5px;
margin:0;
}

#contenu .image_secondaire{
text-align: center;
/*line-height: 120px;*/
}

#contenu .image_secondaire img{
margin: 0 20px;
border: 0;
border-bottom: 7px solid #fdf21e;
margin-bottom: 20px;
}

/**********LES TABLEAUX**********/ 

table{
font-size:12px;
text-align:left;
border-collapse: collapse;
margin:0px 30px 30px 15px;}

#contenu table ul, table ol{
	margin:0;
}

table thead th{
font-weight:normal;
font-size:14px;
border-right:30px solid transparent;
border-left:30px solid transparent;
margin:8px 2px;
text-transform:uppercase;
text-align:center;
}

table tbody th{
font-weight:normal;
font-size:14px;
border-right:30px solid transparent;
border-left:30px solid transparent;
}

table td{
border-right:30px solid transparent;
border-left:30px solid transparent;
padding:12px 2px 0;
text-align:justify;
}

table tfoot td{
border-right:30px solid transparent;
border-left:30px solid transparent;
padding:12px 2px 0;
text-align:right;
font-size:9px;
}

/**********LES FORMULAIRES**********/ 


form ul{
width: 400px;
margin: 10px auto;
}

form li{
text-align: right;
display: block;
margin: 12px 0;
font-weight: normal;
list-style: none;
}

form label{

margin-right: 5px;
cursor: pointer;
}

input.text, textarea{
border: 1px solid #8C9FA7;
padding: 2px;
width: 300px;
font-family: "trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
margin: 1px;
}

input.text:focus, textarea:focus{
border: 2px solid #8EC6D7;
margin: 0;
}

textarea{height: 100px;}
li.textarea label{position: relative;top: -90px;}

p.validation{
padding: 5px 15px 5px 25px;
border: 1px solid #fff;
background: url(../images/ok.png) no-repeat 4px 50% #F1F5F7;
font-weight: bold;
display: inline;
line-height: 40px;
}

p.erreur{
padding: 5px 15px 5px 25px;
border: 1px solid #fff;
background: url(../images/cancel.png) no-repeat 4px 50% #F1F5F7;
font-weight: bold;
display: inline;
line-height: 40px;
}

p.erreur a{
color: #FF4E4E;
text-decoration: underline;
}

/**********LES COULEURS**********/  /*changer l'ID de la page permet de changer les couleurs de tous les �l�ments qu'elle contient*/

#base h2, #base em, #base strong, #base ul, #base ol, #base th, #base h3, #base dt{color: #274758}
#base h2{background: url(../images/puce_h2_base.png) no-repeat left;}
/*#base h3{border-bottom:1px solid #274758;}*/
#base thead th{border-bottom:2px solid #274758;}
#base dl.coordonnees{border:2px double #274758;}


#espace_client h2, #espace_client em, #espace_client strong, #espace_client ul, #espace_client ol, #espace_client th, #espace_client h3, #espace_client dt{color: #554593}
#espace_client h2{background: url(../images/puce_h2_violet.png) no-repeat left;}
/*#espace_client h3{border-bottom:1px solid #554593;}*/
#espace_client thead th{border-bottom:2px solid #554593;}

#ressources_humaines h2, #ressources_humaines em, #ressources_humaines strong, #ressources_humaines ul, #ressources_humaines ol, #ressources_humaines h3, #ressources_humaines dt{color: #ea326b}
#ressources_humaines h2{background: url(../images/puce_h2_rose.png) no-repeat left;}
/*#ressources_humaines h3{border-bottom:1px solid #ea326b;}*/
#ressources_humaines thead th{border-bottom:2px solid #ea326b;}

#services_associes h2, #services_associes em, #services_associes strong, #services_associes ul, #services_associes ol, #services_associes th, #services_associes h3, #services_associes dt{color: #fd9105}
#services_associes h2{background: url(../images/puce_h2_orange.png) no-repeat left;}
/*#services_associes h3{border-bottom:1px solid #fd9105;}*/
#services_associes thead th{border-bottom:2px solid #fd9105;}

#encadrement h2, #encadrement em, #encadrement strong, #encadrement ul, #encadrement ol, #encadrement th, #encadrement h3, #encadrement dt{color: #0d9dbc}
#encadrement h2{background: url(../images/puce_h2_bleu.png) no-repeat left;}
/*#encadrement h3{border-bottom:1px solid #0d9dbc;}*/
#encadrement thead th{border-bottom:2px solid #0d9dbc;}

#developpement_durable h2, #developpement_durable em, #developpement_durable strong, #developpement_durable ul, #developpement_durable ol, #developpement_durable th, #developpement_durable h3, #developpement_durable dt{color: #9bbb04}
#developpement_durable h2{background: url(../images/puce_h2_vert.png) no-repeat left;}
/*#developpement_durable h3{border-bottom:1px solid #9bbb04;}*/
#developpement_durable thead th{border-bottom:2px solid #9bbb04;}

#qualite h2, #qualite em, #qualite strong, #qualite ul, #qualite ol, #qualite th, #qualite h3, #qualite dt{color: #ea1c06}
#qualite h2{background: url(../images/puce_h2_rouge.png) no-repeat left;}
/*#qualite h3{border-bottom:1px solid #ea1c06;}*/
#qualite thead th{border-bottom:2px solid #ea1c06;}



/*****************************************************************/
/*********************CONSTRUCTION DE LA PAGE*********************/
/*****************************************************************/


#baseline{
text-align: center;
position: absolute;
top: 0;
width: 100%;
padding: 3px 0;
height: 20px;
line-height: 20px;
background: #FDF21E;
color: #232323;
}

/**********NAVIGATION PRINCIPALE**********/

#navig1{
position: absolute;
left: 160px;
top: 180px;
width: 820px;
background: url(../images/bg_navig.jpg) repeat-x bottom;
padding-bottom: 12px;
z-index: 80;
}


#navig1 li.nav{
display: block;
float: left;
margin-left: 15px;
height: 17px!important
}


#navig1 a{
display: block;
height: 17px;
background-position: top;
}

#navig1 li:hover{background-position: bottom;}
#navig1 li.courant{background-position: bottom;}

#nav_accueil{background: url(../images/nav_accueil.png) no-repeat; width: 54px;}
#nav_espace_client{background: url(../images/nav_espace_client.png) no-repeat; width: 106px;}
#nav_prestations{background: url(../images/nav_prestations.png) no-repeat; width: 78px;}
#nav_services_associes{background: url(../images/nav_services_associes.png) no-repeat; width: 124px;}
#nav_encadrement{background: url(../images/nav_encadrement.png) no-repeat; width: 101px;}
#nav_developpement_durable{background: url(../images/nav_developpement_durable.png) no-repeat; width: 181px;}
#nav_qualite{background: url(../images/nav_qualite.png) no-repeat; width: 50px;}

.navig_infobulle{
position: absolute;
display: none;
z-index: 300;
background: #fff;
color: #516a75;
font-weight: bold;
z-index: 90;
border-top: 4px solid #FDBF00;
}

#nav_prestations .navig_infobulle{width: 200px; left: 25px;}
#nav_services_associes .navig_infobulle{width: 200px; left: 140px;}
#nav_encadrement .navig_infobulle{width: 190px; left: 270px;}
#nav_developpement_durable .navig_infobulle{width: 200px; left: 425px;}
#nav_qualite .navig_infobulle{width: 170px; left: 570px;}

.navig_infobulle a{
display: block!important;
padding: 2px 5px; 
position: relative;
z-index: 310;
background: #fff;
color: #516a75;
font-weight: bold;
}

.navig_infobulle li{
list-style: none;
}

.navig_infobulle a:hover{
background: #516a75;
color: #fff;
}


/**********NAVIGATION SECONDAIRE**********/

#navig2{
position: absolute;
top: 315px;
left: 7px;
width: 156px;
height: 113px;
z-index: 70;
}

#navig2 .positionnement{
background: url(../images/bg_navig2.png) no-repeat;
width: 156px;
height: 113px;
padding-top: 10px;
}

#navig2 li{
display: block;
padding-left: 15px;
background: url(../images/puce_navig2.png) 0 50% no-repeat;
margin: 5px 0 8px 10px;
}

#navig2 a{
position: relative;
color: #6e7b81;
font-weight: bold;
}


/**********DEVIS**********/

#devis{
width: 146px;
height: 124px;
position: absolute;
left: 7px;
top: 430px;
z-index: 50;
/*visibility:hidden;*/
}

#devis .positionnement{
background: url(../images/bt_devis.png) no-repeat;
/*background:transparent url(../images/bt_devis.png) no-repeat scroll 0 0;*/
width: 146px;
height: 124px;
display:block;
text-indent: -5000px;
cursor:pointer;
}


/**********ACTUS**********/

#actus{
width: 129px;
height: 134px;
position: absolute;
right: 5px;
top: 30px;
cursor: pointer;
background: url(../images/bt_actus.png) no-repeat;
visibility:hidden;
}

#actus_infobulle{
position: absolute;
display: none;
width: 140px;
z-index: 300;
background: #fff;
border-right: 4px solid #FDBF00;
}

#actus_infobulle p{
margin: 5px 10px 0 10px;
}

#actus_infobulle a{
display: block;
margin: 5px 10px 5px 10px;
color: #000;
text-decoration: underline;
text-align: center;
font-size: 11px;
}

#actus_infobulle .fleche{
position: absolute;
top: 80px;
right: -13px;
width: 13px;
height: 18px;
background: url(../images/infobulle_fleche.png) no-repeat;
}

/**********PLAQUETTE**********/
/*
#plaquette{
width: 106px;
height: 120px;
position: absolute;
display: block;
bottom: 25px;
right: 50%;
margin-right: -450px; 
z-index: 110;
cursor: pointer;
background: url(../images/plaquette.png) no-repeat;
}

#plaquette_infobulle{
position: absolute;
display: none;
width: 140px;
z-index: 300;
background: url(../images/pdf.png) no-repeat 95% 50% #fff;
border-right: 4px solid #FDBF00;
color: #516a75;
font-weight: bold;
}


#plaquette_infobulle a{
display: block;
margin: 5px 10px 5px 10px;
color: #516a75!important;
text-align: left;
font-size: 11px;
}

#plaquette_infobulle .fleche{
position: absolute;
top: 12px;
right: -13px;
width: 9px;
height: 18px;
background: url(../images/infobulle_fleche2.png) no-repeat;
}
*/
/**********FOOTER**********/

#footer{
position: absolute;
bottom: 0;
width: 100%;
color: #fff;
font-size: 11px;
z-index: 50;
margin-top: 20px;
}

#footer .positionnement{
width: 100%;
height: 60px;
background: url(../images/bg_footer_grass.png) center no-repeat;
padding-bottom: 20px;
}


#footer ul{
text-align: center;
position: absolute;
bottom: 0;
width: 100%;
padding: 3px 0;
height: 20px;
line-height: 20px;
background: #232323;
}


#footer ul li{
position: relative;
}

#footer li span{
	font: normal 12px/16px "Trebuchet MS", arial, helvetica, sans-serif;
	color: #81959d;
}

#deco{
width: 100%;
height: 250px;
position: relative;
display: block;
bottom: 30px;
z-index: 1;
background: url(../images/bg_footer_decor.png) center no-repeat;
}

#deco .positionnement{
width: 100%;
height: 250px;
}

#footer li{
display: inline;
color: #fff;
}

#footer a{
color: #fff;
}

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

/*************************************************/
/*********************CONTENU*********************/
/*************************************************/

#contenu{
width: 750;
min-height: 300px;
position: relative;
left: 195px;
z-index: 60;
overflow: hidden;
padding-top: 10px;
}


/**************************************************/
/*********************HOMEPAGE*********************/
/**************************************************/

#homepage{
width: 820px;
height: 450px;
position: relative;
left: 160px;
z-index: 60;
background: url(../images/bg_homepage.jpg) top no-repeat;
color: #274758;
font-size: 12px;
overflow: auto;
font-family: Arial, Helvetica, sans-serif;
}

#homepage div{
position: absolute;
}

#homepage li{
list-style: none;
}

#homepage h2{
font-size: 16px;
}

#homepage h3{
font-size: 14px;
}

/*********************PLACEMENT TEXTES*********************/

#homepage_4metiers{left: 100px; top: 300px;}
#homepage_6secteurs{text-align: right; right: 60px; top: 300px;}
#homepage_exploitation{color: #1d5270; text-align: right; top: 20px; right: 515px;}
#homepage_ressources_humaines{color: #cf1b52; text-align: right; top: 190px; right: 640px;}
#homepage_qualite{color: #a21c1c; top: 40px; left: 585px;}
#homepage_developpement_durable{color: #418343; top: 200px; left: 640px;}

#homepage_exploitation a{color: #1d5270;}
#homepage_ressources_humaines a{color: #cf1b52;}
#homepage_qualite a{color: #a21c1c;}
#homepage_developpement_durable a{color: #418343;}

#homepage_exploitation a:hover{text-decoration:underline overline;}
#homepage_ressources_humaines a:hover{text-decoration: underline overline;}
#homepage_qualite a:hover{text-decoration: underline overline;}
#homepage_developpement_durable a:hover{text-decoration: underline overline;}




	
/*********************AJOUT CSS*********************/
/* index.php */
div.locaux{
width: 60%;
padding-left:20%;
padding-right:20%;
text-align: justify;
font-family:Arial, Helvetica, sans-serif; 
font-size:10px; 
color:#81959D; 
font-weight:normal; 
text-decoration:none;
background-color:#232323;
}
div.locaux a:link{
color:#81959D; 
font-weight:normal; 
text-decoration:none;
}
div.locaux a:visited{
color:#81959D; 
font-weight:normal; 
text-decoration:none;
}
div.locaux a:hover{
color:#81959D; 
font-weight:normal; 
text-decoration:none;
}
div.locaux a:active{
color:#81959D; 
font-weight:normal; 
text-decoration:none;
}

div.nettoyage-industriel{
width: 750px;
text-align: justify
}

div.nettoyage-industriel h2{
color:#0d9dbc; 
}

div.nettoyage-industriel h3{
color:#0d9dbc; 
}


/* texte */
p.entreprise {font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#81959D; font-weight:normal; text-decoration:none;}
p.entreprise a {font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#81959D; font-weight:normal; text-decoration:none;}
p.entreprise a:hover {font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#81959D; font-weight:normal; text-decoration:underline;}
p.entreprise a:visited {font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#81959D; font-weight:normal; text-decoration:none;}
p.entreprise a:active {font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#81959D; font-weight:normal; text-decoration:underline;}

/* autres mots */
p.nettoyage {font-family:Arial, Helvetica, sans-serif; font-size:10px; text-align:left; color:#81959D; font-weight:normal; text-decoration:none;}
p.nettoyage a {font-family:Arial, Helvetica, sans-serif; font-size:10px; color:#81959D; font-weight:normal; text-decoration:none;}
p.nettoyage a:hover {font-family:Arial, Helvetica, sans-serif; font-size:10px; color:#81959D; font-weight:normal; text-decoration:underline;}
p.nettoyage a:visited {font-family:Arial, Helvetica, sans-serif; font-size:10px; color:#81959D; font-weight:normal; text-decoration:none;}
p.nettoyage a:active {font-family:Arial, Helvetica, sans-serif; font-size:10px; color:#81959D; font-weight:normal; text-decoration:underline;}