/**
  Feuille de style Climat Clair
  -> Agence iti (http://www.iti-conseil.com)
**/

/* cette fonction à la con permet d'agrandir à la bonne taille le bloc qui inclu le tout */
.spacer {
  clear: both;
}

/**
  Styles généraux
**/
body {
	font-family:Arial, Helvetica, sans-serif;
	background-color:#ffffff;
	color:#39393a;
	margin:0;
	padding:0;
}
img {
	border:0;
}
p, div, ul, li, form, h1, h2, h3, form, fieldset {
	margin:0;
	padding:0;
	border:0 ;
}
.droite {
	text-align:right;
}
.centrer {
	text-align:center;
}
.justifier {
	text-align:justify;
}
.img_g {
	float:left;
	margin-right:5px;
}

span.gras{
	font-family:Verdana ;
	color:#005aab ;
	font-weight:bold ;
}

#erreur {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:10px;
	color:#FF0000;
	text-align:left;
	margin-bottom:20px ;
}

/**
  Balises principales
**/
#principal {
	width:760px;
	margin:0 auto;
}
#contenu {
	position:absolute;
	top:355px;
	width:760px;
	background:#f0f1f2 url(../images/contenu/degrade.gif) top repeat-x;
}
#entete {
	position:relative;
	width:760px;
	height:355px;
	background:url(../images/entete/fond-bandeau.jpg) right bottom no-repeat;
}

/**
  En-tête
**/
#top {
	position:absolute;
	top:0;
	left:0;
	width:750px;
	height:34px;
	padding:5px 10px 0 0;
	background:url(../images/entete/top-fond.gif) repeat-x;
	text-align:right;
}
#top a {
	font-size:11px;
	color:#FFFFFF;
	text-decoration:none;
}
#top a:hover {
	text-decoration:underline;
}
h1#logo {
	position:absolute;
	top:52px;
	left:25px;
	width:318px;
	height:93px;
	background:url(../images/entete/logo-climat-clair.gif) repeat-x;
}
h1#logo span {
	display:none;
}
h1#logo a {
	display:block ;
	height:93px ;
	width:318px ;
}
#telephone {
	position:absolute;
	top:63px;
	left:545px;
	width:135px;
	height:35px;
	text-align:center;
}
#telephone .contact {
	font-size:12px;
	font-weight:bold;
	color:#3ea7e6;
}
#telephone .phone {
	font-size:20px;
	font-weight:bold;
	color:#3c4d97;
}
#bandeau {
	position:absolute;
	top:198px;
	left:0px;
	width:492px;
	height:157px;
	background:#CCCCCC;
}
#menu {
	position:absolute;
	top:154px;
	left:0px;
	width:492px;
	height:44px;
}
#bloc_info {
	position:absolute;
	top:97px;
	left:492px;
	width:200px;
	height:188px;
	padding:70px 22px 0 22px;
	background:#e6c126 url(../images/entete/demande-info.gif) no-repeat ;
	font-size:15px;
	color:#000 ;
}

/**
  Le bloc demande info
**/
#bloc_info .input {
	width:188px;
	margin:5px 0 0 0;
	padding:2px 5px;
	background:#c1dae6;
	border:#97bacb 1px solid;
	font-size:9px;
	color:#6b6d6e;
}

#bloc_info .select {
	width:200px;
	margin: 0;
	padding:1px 0 ;
	background:#c1dae6;
	border:#97bacb 1px solid;
	font-size:9px;
	color:#6b6d6e;
}

#bloc_info .option {
	margin:0 ;
	padding:0 ;
	background:#c1dae6;
	font-size:9px;
	color:#6b6d6e;
}

#bloc_info .submit {
	position:absolute;
	top:215px;
	left:79px;
}

#bloc_info ul {
	margin-left:10px ;
}

/**
  Le Menu
**/
#menu a.entreprise span, #menu a.produits span, #menu a.avantages span, #menu a.securite span, #menu a.devis span, #menu a.contactbtn span {
	display:none;
}
#menu span.entreprise span, #menu span.produits span, #menu span.avantages span, #menu span.securite span, #menu span.devis span, #menu span.contactbtn span {
	display:none;
}
#menu a.entreprise, span.entreprise {
	float:left;
	display:block;
	width:82px;
	height:44px;
	background:url(../images/menu/btn-entreprise.gif) no-repeat 0 0;
}
#menu a.entreprise:hover, span.entreprise {
	background-position:0 -44px;
}
#menu a.produits, span.produits {
	float:left;
	display:block;
	width:82px;
	height:44px;
	background:url(../images/menu/btn-produits.gif) no-repeat 0 0;
}
#menu a.produits:hover, span.produits {
	background-position:0 -44px;
}
#menu a.avantages, span.avantages {
	float:left;
	display:block;
	width:82px;
	height:44px;
	background:url(../images/menu/btn-avantages.gif) no-repeat 0 0;
}
#menu a.avantages:hover, span.avantages {
	background-position:0 -44px;
}
#menu a.securite, span.securite {
	float:left;
	display:block;
	width:82px;
	height:44px;
	background:url(../images/menu/btn-securite.gif) no-repeat 0 0;
}
#menu a.securite:hover, span.securite {
	background-position:0 -44px;
}
#menu a.devis, span.devis {
	float:left;
	display:block;
	width:82px;
	height:44px;
	background:url(../images/menu/btn-devis.gif) no-repeat 0 0;
}
#menu a.devis:hover, span.devis {
	background-position:0 -44px;
}
#menu a.contactbtn, span.contactbtn {
	float:left;
	display:block;
	width:82px;
	height:44px;
	background:url(../images/menu/btn-contact.gif) no-repeat 0 0;
}
#menu a.contactbtn:hover, span.contactbtn {
	background-position:0 -44px;
}


/**
  Contenu, placement général
**/
#contenu .page {
	width:740px;
	padding:15px 10px 10px 10px;
	height:300px ;
}
html>body #contenu .page {
height: auto;
min-height: 300px;
} 
#pied {
	width:760px;
	height:15px;
	padding-top:3px;
	background:url(../images/contenu/pied-fond.gif) repeat-x;
}
#pied .p_gauche {
	float:left;
	width:370px;
	padding-left:10px;
	color:#5a5e60;
	font-size:9px;
}
#pied .p_droit {
	float:right;
	text-align:right;
	width:370px;
	padding-right:10px;
	color:#5a5e60;
	font-size:9px;
}
#pied .p_droit a {
	color:#5a5e60;
	text-decoration:none;
}
#pied .p_droit a:hover {
	text-decoration:underline;
}

/**
  Page d'accueil
**/
#contenu .colonne_g, #contenu .colonne_c, #contenu .colonne_d {
	float:left;
	width:219px;
	font-size:11px;
}
#contenu .colonne_double {
	float:left ;
	width:462px ;
	font-size:11px ;
	border-right:#bdb6b0 1px solid;
	padding:0 12px 0 12px;
}

#contenu .colonne_g {
	padding:0 12px 0 12px;
}
#contenu .colonne_c {
	padding:0 12px 0 12px;
	border-right:#bdb6b0 1px solid;
	border-left:#bdb6b0 1px solid;
}
#contenu .colonne_d {
	padding:0 0 0 12px;
}

#contenu .gb {
	border-right:#bdb6b0 1px solid;
	width:220px ;
	margin-right:-1px ;
}

#contenu .db {
	border-left:#bdb6b0 1px solid;
	width:220px ;
	margin-left:-1px ;
}

#contenu .colonne_g img, #contenu .colonne_c img, #contenu .colonne_d img, #contenu .colonne_double img {
	margin:0 0 12px 0;
}
#contenu .colonne_g p, #contenu .colonne_c p, #contenu .colonne_d p, #contenu .colonne_double p {
	margin-bottom:20px ;
}
#contenu .colonne_g div.img, #contenu .colonne_c div.img, #contenu .colonne_d div.img {

}
#contenu .colonne_g div.img img, #contenu .colonne_c div.img img, #contenu .colonne_d div.img img {

}
#contenu .colonne_g img.borde,#contenu .colonne_c img.borde,#contenu .colonne_d img.borde {
	border:1px solid #005aab ;
}
#contenu .colonne_g h2.bleu, #contenu .colonne_c h2.bleu, #contenu .colonne_d h2.bleu {
	font-size:20px ;
	background:#005aab ;
	color:#FFF ;
	padding:10px ;
	height:auto ;
	text-align:center ;
	font-weight:normal ;
	font-family:Arial ;
	letter-spacing:2px ;
}
#contenu .colonne_g h2.avantage, #contenu .colonne_c h2.avantage, #contenu .colonne_d h2.avantage, #contenu .colonne_double h2.avantage {
	font-size:12px ;
	color:#005aab ;
	padding:0 ;
	margin:0 ;
	height:auto ;
	font-weight:bold ;
	font-family:Arial ;
	background:none ;
}
#contenu .colonne_g p.avantage, #contenu .colonne_c p.avantage, #contenu .colonne_d p.avantage, #contenu .colonne_double p.avantage {
	margin-top:5px ;
	margin-bottom:10px ;
	margin-left:10px ;
}

#contenu .colonne_g .puce, #contenu .colonne_c .puce, #contenu .colonne_d .puce, #contenu .colonne_double .puce {
	padding-left:20px ;
	background:url('../images/avantages/puce.gif') 0 2px no-repeat ;
}
#contenu .colonne_g .avantage_puce, #contenu .colonne_c .avantage_puce, #contenu .colonne_d .avantage_puce, #contenu .colonne_double .avantage_puce {
	font-size:12px ;
	color:#005aab ;
	padding:0 ;
	margin:0 ;
	height:auto ;
	font-weight:bold ;
	font-family:Arial ;
	background:none ;
	padding-left:20px ;
	background:url('../images/avantages/puce.gif') 0 2px no-repeat ;
}
#contenu .colonne_g h3.bleu, #contenu .colonne_c h3.bleu, #contenu .colonne_d h3.bleu, #contenu .colonne_double h3.bleu {
	font-size:16px ;
	color:#005aab ;
	padding:10px ;
	height:auto ;
}
#contenu .colonne_g p.justif, #contenu .colonne_c p.justif, #contenu .colonne_d p.justif, #contenu .colonne_double p.justif {
	text-align:justify ;
}
#contenu .nb {
	border:0 ;
}
#contenu .soustitre {
	font-size:11px ;
	font-weight:bold ;
	margin:10px 40px 20px 40px  ;
}
#contenu a.bouton {
	display:block;
	width:205px;
	height:17px;
	padding:3px 0 0 14px;
	margin:0 0 12px 0;
	background:url(../images/pages/bouton-fond.gif) no-repeat;
	font-size:11px;
	color:#535353;
	font-weight:bold;
	text-decoration:none;
}
#contenu h2 {
	width:205px;
	height:17px;
	padding:3px 0 0 14px;
	margin:0 0 12px 0;
	background:url(../images/pages/bouton-fond.gif) no-repeat;
	font-size:11px;
	color:#535353;
	font-weight:bold;
	text-decoration:none;
}
#contenu ul.liste_paragraphe {
	margin:10px ;
	list-style-type:none ;
}
#contenu ul.liste_paragraphe li {
	list-style-type:none ;
	margin-top:2px ;
}
#contenu p.entreprise {
	font-size:12px ;
}
#contenu div.carre {
	float:left ;
	height:10px ;
	margin:0 7px 0 5px ;
	width:10px ;
	background:#005aab;
	font-size:0 ;
}
#contenu .colonne_double h2 {
	width:453px;
	height:17px;
	padding:3px 0 0 14px;
	margin:0 0 12px 0;
	background:url(../images/pages/bouton-fond_double.gif) no-repeat;
	font-size:11px;
	color:#535353;
	font-weight:bold;
	text-decoration:none;
}
#contenu a.savoir_plus {
	display:block;
	width:219px;
	margin:3px 0 12px 0 ;
	text-align:right;
	font-size:11px;
	font-style:italic;
	color:#535353;
	text-decoration:underline;
}
#contenu a.savoir_plus:hover {
	text-decoration:none;
}

#galerie {
	text-align:center ;
	font-size:11px ;
	width:325px ;
	margin:0 auto ;
}

#galerie a {
	font-size:11px ;
	color:#005aab ;
	font-weight:bold ;
	text-decoration:underline ;
}

#galerie a:hover {
	text-decoration:none ;
}

#galerie h3 {
	text-align:center ;
}

#galerie p {
	text-align:left ;
}

#galerie div#galerie_titre {
	width:325px ;
	text-align:center ;
	margin:0 auto ;
	height:30px ;
}

#galerie div#galerie_titre .btn {
	display:block ;
	width:25px ;
	height:25px ;
}

#galerie div#galerie_titre h3 {
	text-align:center;
	width:270px ;
	float:left ;
	font-size:14px ;
}

#galerie div#galerie_titre h3 span {
	font-size:11px ;
}

#galerie img {
	border:1px solid #005aab ;
}

div.realisation {
	float:left ;
	margin:5px ;
	width:140px ;
	text-align:center ;
}

div.realisation img {
	border:1px solid #005aab ;
}

div.realisation a {
	text-align:center ;
	font-size:10px ;
	margin:0 ;
	padding:0 ;
}

div.realisation p {
	font-size:10px ;
	text-align:left ;
	margin:0 ;
	padding:0 ;
}

address {
	font-style:normal ;
	font-size:11px ;
	display:block ;
	padding-left:20px ;
}

h3 {
	font-size:12px ;
	font-weight:bold ;
}

a.lien {
	text-decoration:none ;
	color:#00A ;
}

a.lien:hover {
	color:#66F ;
}

#baseline {
	color:#5a5e60;
	font-size:9px;
	text-align : center;
}

#baseline a {
	text-decoration:none ;
	color:#5a5e60;
}

#baseline a:hover {
	color:#5a5e60;
}

h3.choix_contact {
	padding:5px 0 0 24px ;
	background:url('../images/avantages/puce.gif') 4px 7px no-repeat ;
	margin-left:20px ;
}

h3.choix_contact a {
	color:#005aab ;
	text-decoration:none ;
}

h3.choix_contact a:hover {
	color:#3ca6e6 ;
}