/* Styles CSS du site d'Energie-Service Sarl v1.0
* copyright Energie-Service Sal 2009
* @Daniel Anken - 2007 | daniel.anken@gmail.com
*
* Valid W3C CSS 2.0
*/

/* Placement des elements de fond de la page
* ------------------------------------------------------------------
*/
body, html {
	font-family: Arial, Bitstream Vera Sans, Helvetica;
	margin: 0;
	padding: 0;
}

a img, img {
	border: none;
}

a {
	color:#206600;
}

a:hover {
	color:#309800;
}

sup, sub {
	font-size:10px;
}

#ombre {
	position: relative;
	width: 980px;
	margin: 0 auto 0 auto;
	padding: 0;
	background: url(../images/fondOmbre.gif) repeat-y;
}

#ombreBas{
	position: relative;
	width: 980px;
	height: 15px;
	margin: 0;
	padding: 0;
	background: url(../images/ombreFondBas.gif) no-repeat;
}

#page {
	overflow: visible;
	width: 950px;
	height: auto;
	margin: 0 13px 0 13px;
	padding: 0;
	border: #071b10 1px solid;
	border-top: hidden;
	background: #f9dd9c;
}

/* formatage des elements contenut dans le calque page
* ------------------------------------------------------------------
*/
#enteteAccueil, #enteteProduits, #enteteCombustibles, #enteteContact {
	margin: 0;
	padding: 5px 0 0 5px;
	height: 120px;
}

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

#enteteProduits {
	background: url(../images/enteteBois.jpg) no-repeat;
}

#enteteCombustibles {
	background: url(../images/enteteFlammes.jpg) no-repeat;
}

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

/* ---------- mise en page du premier menu (horizontal) ------------ */
#menu {
	margin: -5px 0 0 0;
	padding: 2px;
	border: #FFb200 1px solid;
	background: #FFFFFF;
	vertical-align: top;
}

#menu, #menu a {
	color: #071b10;
	font-size: 12.5px;
	font-weight: bold;
	text-decoration: none;
}

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

/* l'element menu contenan les liens (pour creer l'effet double bordure) */
#menuContenu {
	background: #FFB200;
	margin: 0px;
	padding: 1px 10px 1px 10px;
	height: 33px;
	vertical-align: middle;
}

#menuContenu p {
	margin:0;
	padding: 9px 0 7px 3px;
}

/*
* Element contenant l'enseigne (le nom) de l'entreprise
*/
#enseigne {
	position: relative;
	float: right;
	margin: 2px;
	padding: 0;
	right: 0;
	top: 0;
	width: 150px;
}

#enseigne h1 {
	color: #071b10;
	font-size: 14px;
	font-weight: bold;
	text-align: right;
	margin: 0;
}

#enseigne h2 {
	color: #071b10;
	font-size: 11px;
	text-align: right;
	margin: 0;
}

/* ------------------------------------------------------------ */

/* ---------- mise en page du deuxieme menu (vertical) permettant la sous-navigation ------------ */
#menuSecondaire {
	position: absolute;
	width: 130px;
	margin: 0 518px 0 0px;
	background: #f9dd9c;
	line-height: 23px;
	left: 14px;
}

#menuSecondaire ul {
	list-style: none;
	margin: 5px;
	padding: 0 0 0 5px;
}

#menuSecondaire li {
	margin: 0 0 5px 18px;
	list-style-image: url(../images/carreJaune.gif);
}

#menuSecondaire li:hover {
	margin: 0 0 5px 18px;
	list-style-image: url(../images/carreVert.gif);
}

.lienActif {
	list-style-image: url(../images/carreVert.gif);
}

#menuSecondaire a {
	color: #071b10;
	font-size: 12px;
	text-decoration: none;
}

#menuSecondaire a:hover, a:active, a:focus {
	text-decoration: underline;
}
#menuSecondaire a:active {
	text-decoration: underline;
	color: #FFB200;
}

/* ------------------------------------------------------------ */
/* --------- mise en page du contenu de la page ----------- */
#contenuPage {
	margin: 0 0 0 130px;
	padding: 0px 10px 20px 20px;
	background: url(../images/fondPage.gif);
	text-align: justify;
	font-size: 14px;
	border-left: #FFB200 2px dotted;
	overflow: visible;
	min-height: 427px;
}

#contenuPage h1{
	font-size: 15px;
	max-width: 530px;
	color: #071b10;
	border-bottom: #071b10 2px solid;
	margin: 0 0 10px 0;
	padding:20px 0 0 0;
	text-align: left;
}

#contenuPage h2{
	font-size: 15px;
	color:#206600;
	margin: 0 0 10px 0;
}

#contenuPage h3{
	font-size: 13px;
	color: #071b10;
}

#tbMatiere {
	list-style-image:url(../images/fleche_bas_lien.gif) !important;
}

span {
	float:right;
	width: 200px;
	margin: 50px 0 10px 20px;
	padding: 0;
	border: none;
	text-align:left;
}

#annonces {
	float:right;
	width: 230px;
	margin: 5px 0 10px 15px;
	padding: 0;
	display:block;
	overflow: visible;
	border: none;
	text-align:left;
}

#annonces div{
	float:right;
	/*width: 180px;*/
	margin: 0 0 10px 0;
	padding: 10px;
	display:block;
	overflow: visible;
	border: #FFB200 2px dotted;
	background:#f9dd9c;
}

#contenuPage div h1{
	font-size: 15px;
	color: #071b10;
	border-bottom: #071b10 2px solid;
	margin: 0 0 10px 0;
	padding:0;
}

#plusNews {
	text-align:right;
	width:540px;
}

#dernNews {
	border: #f9dd9c 2px dotted !important;
	background:#FFB200 !important;
}

#dernNews h1{
	font-size: 15px;
	color: #071b10;
	border-bottom: #071b10 2px solid;
	margin: 0 0 10px 0;
	padding:0;
}

#contenuPage fieldset {
	border:solid #FFB200 1px;
	padding: 10px;
	margin: 0 0 20px 0;
}

#contenuPage fieldset legend {
	font-weight:bold;
	color:#000000;
}

legend span {
	float:none;
	margin:0;
	padding:0;
	width:auto;
	height:auto;
}

pre {
	margin:0;
	padding:0;
}

#contenuPage fieldset table {
	padding: 5px;
}

#contenuPage fieldset p {
	padding: 0;
	margin:0;
}

#contenuPage fieldset div {
	padding: 0;
	margin:3px 0 0 0;
	font-size:11px;
	font-weight:bold;
	text-align:right;
}

#contenuPage input, textarea {
	border-style:none;
	border:solid #FFB200 1px;
	background:#FFFFFF;
}

#commentaire {
	font-size: 10px;
}

.erreur {
	border:solid #FF0000 1px;
	background-color: #FFC7B7;
}

#slogan {
	font-weight:bold;
}

hr {
	border: #071b10 solid 1px;
}

#calcul {
	margin: 0 0 0 0;
	padding: 10px;
	width:550px;
	overflow: visible;
	border: #FFB200 2px dotted;
	background:#f9dd9c;
	text-align:left;
}

#tableauTotal {
	margin: 0 0 0 0;
	width:550px;
}

#explications {
	position:absolute;
	z-index:2;
	width:250px;
	padding: 5px;
	visibility:hidden;
	border: #FFB200 2px dotted;
	background:#f9dd9c;
	text-align:left;
}

#contenuProduits {
	border:#FFB200 1px dotted;
}

#boiteProduits a {
	color:#071b10;
	text-decoration:none;
}

#liBois {
	border-left:#FFB200 1px solid;
}

#liBois, #liSolaire, #liEnerFlex, #liDemandeOffre {
	float:left;
	padding:4px 7px 4px 7px;
	cursor:pointer;
	margin-bottom:-1px;
}

#legende {
	float:left;
	padding:5px 7px 4px 10px;
}

#contenuProduits {
	clear:left;
	padding:2px 7px 7px 7px;
	min-height:350px;
}

#contenuProduits ul {
	margin-top:3px;
	font-weight:normal;
}

#contenuProduits li {
	list-style-image: url(../images/carreJaune.gif);
	margin-left:-15px;
	text-align:left;
}

#contenuProduits h1 {
	margin-top:55px;
}

.divProd {
	position:relative;
	top:10px;
	overflow:visible;
	padding:1px;
	height:170px;
	margin:5px 0 5px 0;
}

.divProdPhoto {
	position:relative;
	top:5px;
	left:5px;
	width:110px;
	height:140px;
	text-align:right;
}

.divProdTitre {
	position:relative;
	top:-135px;
	left:125px;
	width:120px;
	height:100px;
	text-align:left;
	font-weight:bold;
}

.divProdDescr {
	position:relative;
	top:-235px;
	left:250px;
	width:516px;
	height:100px;
	font-size:13px;
	margin:1px;
}

.unselected {
	background:#DFCFB4;
	border:#FFB200 1px solid;
	border-left:none;
}

.unselected:hover {
	background:#EDDCBF;
}

.selected {
	border:#FFB200 1px solid;
	border-left:none;
	border-bottom:#ffedcf 1px solid;
	font-weight:bold;
	background:#ffedcf;
}

.imgAvenir {
	border: #FFB200 2px dotted;
}

#typeBois {
	color:#206600;
}

/* ------------------------------------------------------------ */
/* bas de la page (references)*/
#references {
	background: #FFB200;
	margin: 0;
	padding:0;
	border-top: #FFB200 1px dotted;
	text-align:right;
}

#references p {
	color:  #67160B;
	font-size: 9px;
	margin:0;
	padding:0 5px 0 5px;
}

#references a {
	color: #67160B;
	text-decoration: none;
}

#references a:hover {
	color : #FFFFFF;
}