/* CSS Document */

#navigation {
	float: left;
	width: 280px;/* initialement ecran 1366px => 355px = 26% */
	margin-left: 120px;
	margin-top: 140px;
}
#navigation a:hover, #principale .actif a, #principale .valide a, #pieces a:hover, #section #pieces .ajouter a:hover, #equipements a:hover, #section #equipements .ajouter a:hover, #equipements a:hover p , #pieces .actif a, #equipements .actif a, #equipements .actif a  p, a:hover.bt, a:hover.bt li, a:hover.bt, .replier a.bt, .replier a.bt li, .ss-categorie.deplier a.bt, .ss-categorie.deplier a.bt li, a:hover.lientexte {
	background-color: #8fa7c8;/*#2896be;*/
	color: #FFFFFF;
}
#navigation #principale, #section.scrollall {
	overflow-x: hidden;
	overflow-y: auto;
	height: 660px;
}
#navigation #pieces, #navigation #equipements, #section .scroll {
	display:block;
	overflow-x: hidden;
	overflow-y: auto;
	height: 602px;
}

/* Etape validée*/
#navigation li{
	position:relative;
}
.coche {
	display: none;
	width: 24px;
	height: 24px;
	position: absolute;
	top: 10px;
	right: 10px;
	background-image: url("../images/icones/blanc/coche.png");
	background-size: 24px;
}
#navigation .valide  .coche{
	display: block;
}


/* Bouton Précédent */

#precedent a{
	display: block;
	width: 120px;
	height: 100px;
	background-image: url("../images/boutons/precedent/normal.png");
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: 40px 36px;
	background-size: 60px;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9;
}
#precedent a:hover{
	background-image: url("../images/boutons/precedent/actif.png");
}


/* CSS Navigation Principale */

#principale .lot {
	display: block;
	width: 100%;
	margin: 20px 0 20px 0;
	color: #8fa7c8;/*#2896be;*/
	font-size: 100%;	
}
#principale .lot ul{
	padding-top: 20px;
	border-top: 1px solid #8fa7c8;/*#2896be;*/
	border-bottom: 1px solid #8fa7c8;/*#2896be;*/
	padding-bottom: 10px;
}

#principale a{
	display: block;
	width: 82%;
	height: 48px;
	margin-bottom: 10px;
	padding: 12px 0 0 66px;
	font-size: 114%;
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: 12px 12px;
	background-size: 32px;
	background-color: #D2DCDC;
}

#principale #accueil a{
	background-image: url("../images/icones/blanc/maison.png");
}
#principale #accueil a:hover{
	background-image: url("../images/icones/blanc/maison.png");
}

#principale #info a{
	background-image: url("../images/icones/blanc/info.png");
}
#principale #info a:hover, #principale .actif{
	background-image: url("../images/icones/blanc/info.png");
}

#principale #debutEDL a {
	background-image: url("../images/icones/blanc/groupe.png");
}
#principale #debutEDL a:hover, #principale #debutEDL .actif {
	background-image: url("../images/icones/blanc/groupe.png");
}

#principale #constat a {
	background-image: url("../images/icones/blanc/viseur.png");
}
#principale #constat a:hover , #principale #constat .actif{
	background-image: url("../images/icones/blanc/viseur.png");
}

#principale #travaux a {
	background-image: url("../images/icones/blanc/travaux.png");
}
#principale #travaux a:hover, #principale #travaux  .actif {
	background-image: url("../images/icones/blanc/travaux.png");
}

#principale #articles a {
	background-image: url("../images/icones/blanc/cles.png");
}
#principale #articles a:hover, #principale #articles .actif {
	background-image: url("../images/icones/blanc/cles.png");
}

#principale #compteurs a {
	background-image: url("../images/icones/blanc/compteur.png");
}
#principale #compteurs a:hover, #principale #compteurs .actif {
	background-image: url("../images/icones/blanc/compteur.png");
}

#principale #solde a {
	background-image: url("../images/icones/blanc/euros.png");
}
#principale #solde a:hover, #principale #solde .actif  {
	background-image: url("../images/icones/blanc/euros.png");
}

#principale #finEDL a {
	background-image: url("../images/icones/blanc/cadenas.png");
}
#principale #finEDL a:hover, #principale #finEDL .actif  {
	background-image: url("../images/icones/blanc/cadenas.png");
}

#principale #questionnaire a {
	background-image: url("../images/icones/blanc/questionnaire.png");
}
#principale #questionnaire a:hover, #principale  #questionnaire .actif   {
	background-image: url("../images/icones/blanc/questionnaire.png");
}


/* CSS Navigation Pièces et Equipements */

#pieces, #equipements {
	clear:both;
}
#pieces li, #equipements li {
	float: left;
	overflow:hidden;
	width: 100%;/*ecran 1366px(L) => 355px*/
	height: 140px;
	background-color: #FFFFFF;
	margin: 0 10px 10px 0;
	position: relative;
}
#section #pieces li, #section #equipements li {
	width: 48%;
}
#navigation #pieces a, #navigation #equipements a {
	width: 89%;/* ecran 1366px(L) => 355px */	
}

#section #pieces a, #section #equipements a {
	width: 68%;	
	margin-right:20px;	
}
#section #pieces .ajouter a, #section #equipements .ajouter a {
	width: 100%;
	height: 160px;
	background: #e6e6e6 url("../images/icones/blanc/ajouter.png") no-repeat scroll 145px 38px;
	background-size: 64px;
}
#pieces a{
	display: block;
	float: left;
	height: 70px;
	padding: 50px 20px 20px 20px;
	font-size: 114%;
}
#pieces label, #equipements label{
	margin-top: 15%;
}
#equipements a{
	display: block;
	float: left;
	height: 100px;
	padding: 20px;
	font-size: 114%;
}
#equipements p {
	float: right;
	margin-top: 42px;
	font-size: 87%;
	text-align: right;
}

/* La pièce ou l'équipement sélectionné est masqué dans la navigation 
#pieces .actif, #equipements .actif {
	display:none;
}*/

/* CSS Icones Equipements */

.sol a, .mur a, .plafond a, .chauffage a, .electricite a, .facade a, .ouvrant a, .sanitaire a, .serrure a, .toiture a {
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: 20px 70px;
	background-size: 50px;
}
.sol a, td.sol {
	background-image: url("../images/icones/sol.png");
}
.mur a, td.mur {
	background-image: url("../images/icones/mur-interieur.png");
}
.plafond a, td.plafond{
	background-image: url("../images/icones/plafond.png");
}
.chauffage a, td.chauffage {
	background-image: url("../images/icones/chauffage.png");
}
.electricite a , td.electricite {
	background-image: url("../images/icones/electricite.png");
}
.facade a , td.facade{
	background-image: url("../images/icones/facade.png");
}
.ouvrant a , td.ouvrant{
	background-image: url("../images/icones/ouvrant.png");
}
.sanitaire a , td.sanitaire{
	background-image: url("../images/icones/sanitaire.png");
}
.serrure a , td.serrure{
	background-image: url("../images/icones/serrure.png");
}
.toiture a, td.toiture {
	background-image: url("../images/icones/toiture.png");
}