/*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%;*/min-height: 430px;
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;
}

/**********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 tbody 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: 146px;
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;
}

#actu_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;
}
*/

#actu {
	height:128px;
	width:133px;
	position: absolute;
	right: 50px;
	top: 30px;
	z-index: 50;
	background:transparent url(../images/bt_actus.png) top left no-repeat;
	cursor:pointer;
	display:block;
	height:128px;
	width:133px;
	text-indent:-5000px;
}


#actu_infobulle {
	position: absolute;
	top: 50px;
	display: none;
	right: 120px;
	width: 200px;
	z-index: 300;
	background: url(../images/pdf.png) no-repeat 5% 50% #fff;
	border-right: 4px solid #FDBF00;
	color: #516a75;
	font-weight: bold;
}

#actu:hover #actu_infobulle  {
	display: block;
	width: 200px;
}

#actu_infobulle a{
	display: block;
	margin: 5px 10px 5px 10px;
	color: #516a75!important;
	text-align: right;
	font-size: 11px;
}

#actu_infobulle .fleche{
	position: absolute;
	/*top: 12px;
	right: -13px;*/
	top: 4px;
	right: -13px;
	width: 9px;
	height: 18px;
	background: url(../images/infobulle_fleche1.png) no-repeat;
}

/**********PLAQUETTE**********/

#plaquette{
/*width: 106px;
height: 120px;*/
width: 125px;
height: 150px;
position: absolute;
left: 30px;
top: 590px;
/*
position: absolute;
display: block;
top: 570px;
left: 14%;
margin-right: -450px; 
z-index: 110;
*/
cursor: pointer;
background: url(../images/plaquette.png) no-repeat;
z-index: 110;
}

#plaquette_infobulle{
position: absolute;
display: none;
width: 140px;
z-index: 300;
background: url(../images/pdf.png) no-repeat 5% 50% #fff;
border-left: 4px solid #FDBF00;
color: #516a75;
font-weight: bold;
}


#plaquette_infobulle a{
display: block;
margin: 5px 10px 5px 10px;
color: #516a75!important;
text-align: right;
font-size: 11px;
}

#plaquette_infobulle .fleche{
position: absolute;
/*top: 12px;
right: -13px;*/
top: 10px;
right: 144px;
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: 780px;
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;}

/********************** ADMINISTRATION **************************/
p#mes_ok, p#mes_ok2 {
	width: 300px;
	/*height: 30px;*/
	color: #000;
	text-align: center;
	background-color: #7fd951;
	background: url(../images/fd_ok.png) bottom left repeat-x;
	padding: 5px 5px;
	font-weight: bold;
	margin: 5px auto;
}

p#mes_no, p#mes_no2 {
	width: 300px;
	/*height: 30px;*/
	text-align: center;
	color: #000;
	background-color: #f14e35;
	background: url(../images/fd_erreur.png) bottom left repeat-x;
	padding: 5px 5px;
	font-weight: bold;
	margin: 5px auto;
}

p#mes_ok2, p#mes_no2 {
	margin: 5px 45px;
}

p.msg_accueil {
	position: absolute;
	top: 150px;
	left: 250px;
}

fieldset {
	width: 400px;
	margin: 100px 0 0 100px;
	padding: 10px;
}

p.auth {
	position: absolute;
	top: 25px;
	left: 150px;
}

p#mode_admin {
	position: absolute;
	background-color: #f1f5f7;
	padding: 5px 10px;	
}

p#mode_admin a:hover {
	text-decoration: underline;	
}

/**************************** MODIF **************************/
#contenu img{
	margin: 0 20px;
	border: 0;
	margin-bottom: 20px;
}

#contenu img.bordure {
	border-bottom: 7px solid #fdf21e;
}

#contenu ul li {
	color: #81959D;
}

/*************************** DEVIS ******************************/
div.devis {
	margin: 30px 30px;
	padding: 5px 10px 10px 10px;
	width: 350px;
}

div.devis div.cont_devis {
	padding-left: 30px;
}

div#nature_locaux, div#recap_info {
	background-color: #f5f9fb;
}
div#nb_cop, div#surface_locaux, div#nb_collabo {
	background-color: #f7fafb;
}
div#frequence {
	background-color: #f9fafd;
}
div#coord {
	background-color: #f7fbfb;
	width: 600px;
}

div#fd_devis h2 {
	color: #76e403;
}

div.devis h3 {
	border-bottom: solid 2px #76e403;
}

div.devis h3 span.infos {
	font-size: 0.7em;
	font-style: italic;
}

p#valide_devis_bt {
	text-align: center;
}

p#valide_devis_bt a {
	background: url(../images/bt_estimation.png) top left no-repeat;
	display: block;
	width: 180px;
	height: 100px;
	margin-left: 180px;
}

p#confirm_devis {
	/*text-align: center;*/
	margin-left: 50px;
}

p#confirm_devis a {
	background: url(../images/bt_valide.png) top left no-repeat;
	display: block;
	width: 180px;
	height: 100px;
	margin-left: 180px;
}

p#infos_devis {
	text-align: left;
	margin-top: 20px;
}

p.erreur_devis {
	background-color: #f93d3d;
	background: url(../images/fd_erreur.png) bottom left repeat-x;
	padding: 5px;
	margin: 10px;
	width: 200px;
	color: #000;
	text-align: center;
	font-weight: bold;
}


div#nb_collabo h3 {
	width: 250px;
}

span#ou {	
	display: block;
	height: 14px;
	width: 411px;
	background: url(../images/ou.png) top left no-repeat;
	margin: 20px 0;
}

span#ou2 {
	font-size: 1.2em;
	font-weight: bold;
	border:solid 1px #d5e0e9;
	padding: 0 5px;
	margin: 0 20px;
}

div#offre_prix {
	background-color: #dfe8ef;
	font-weight: bold;
	
	font-size: 1.2em;
	margin: 30px 30px;
	padding: 10px;
	width: 350px; 
}

div#offre_prix span {
	font-size: 1.35em;
	color: #5b6e75;
	padding-left: 20px;
}

div#offre_prix p#info_comp {
	font-size: 0.7em;
	font-weight: normal;
	text-align: center;
	margin: 0;
}

div#recommencer_devis {
	position: absolute;
	top: 550px;
	left: 7px;
}

div#recommencer_devis a {	
	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;
}

div#recommencer_devis a:hover {
	background-color: #dbe6eb;
}

#fd_devis {
	background: url(../images/fd_devis.png) right 70px no-repeat;
	padding-bottom: 100px;
	min-height: 450px;
}

#fd_devis h2 {
	background: url(../images/puce_h2_devis.png) no-repeat left;
}

div#coord table {
	border: none;
}

a#bt_actus {
	
}

a#bt_actus img {
	border: none;
}

/******* recrutement *********/
#postuler {
	
}
#offres {
	
}

#titre_recrut {
	width: 380px;
}