@charset "UTF-8";

/* RESET */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
  color:#333333;
}
ul {
  list-style: none;
}
body {
	line-height: 1;
  font-family: Arial, Trebuchet MS, sans-serif;
  background-color: #ffffff;
}
blockquote, q {
	quotes: none;
}
:focus {
	outline: 1px dotted #009aff;
}
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* End RESET */

/**************************************************************************************
 Navigation */
#nav {z-index:200; line-height:60px;}
#nav ul {line-height:20px;padding-top:8px;background:#BDE1F9 url(../images/bg_sub_menu.jpg) repeat-x top;border-left:1px solid #FFFFFF;border-right:1px solid #FFFFFF;}
#nav li {float:left;color:#0099FE;}
#nav li li {float:none;border-bottom:1px solid #FFFFFF;padding-bottom:4px;padding-top:4px;}
/*#nav li li.last {border-bottom:1px solid #b80;}*/
/* a hack for  IE6 */
* html #nav li li {float:left;}

#nav li a {display:block; float:left; padding:0 15px; height:60px;line-height:60px; text-decoration:none; white-space:nowrap; text-transform: uppercase;font-size:0.8em;font-weight:bolder;}
/*#nav li a.down {background:url(down.gif) no-repeat right center;}*/

#nav li li a {display:block; padding:0 15px; height:20px; line-height:20px; float:none; font-weight:normal; text-transform: capitalize;font-size:0.8em;}

#nav li:hover {position:relative; z-index:300;}
#nav li.cssplay_hover {position:relative; z-index:300;}
/*#nav li.cssplay_hover a {color:#000;}*/

#nav li li a {color:#14316B;font-weight:bolder;}
/*#nav li li.cssplay_hover a {color:#000; background-color:#d5aa00;}*/

#nav li:hover ul {left:0; top:35px; z-index:500;}
#nav li.cssplay_hover ul {left:0; top:35px; z-index:500;}

#nav ul {position:absolute; left:-9999px; top:-9999px;}
* html #nav ul {width:2px;}
/* it could have been this simple if all browsers understood */
/* show next level */
#nav li:hover li:hover > ul {left:-5px; margin-left:100%; top:-1px; z-index:500;}
/* keep further levels hidden */
#nav li:hover > ul ul {position:absolute; left:-9999px; top:-9999px; width:auto; }
/* show path followed */
/*#nav li:hover > a {color:#000;}*/
/*#nav li li:hover > a {text-decoration:underline;}*/


/* but IE5.x and IE6 need this lot to style the flyouts*/
/*#nav li.cssplay_hover li.cssplay_hover a,
#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover a,
#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover a,
#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover a,
#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover a
{color:#000; background-color:#d5aa00;}*/
/*
#nav li.cssplay_hover li.cssplay_hover li a,
#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li a,
#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li a,
#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li a
{text-decoration:underline;}*/

/* show next level */
#nav li.cssplay_hover li.cssplay_hover ul,
#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover ul,
#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover ul,
#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover ul
{left:100%; margin-left:-5px; top:-1px;}

/* keep further levels hidden */
#nav li.cssplay_hover ul ul,
#nav li.cssplay_hover li.cssplay_hover ul ul,
#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover ul ul,
#nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover ul ul
{position:absolute; left:-9999px; top:-9999px;}

/* End Navigation 
/*************************************************************************************/

/**************************************************************************************
 landing page */

#intro-html{
background: #f9fdff url(../images/bg_bandeau.png) repeat-x 0 0;
margin:0;padding:0;outline: none;
}
#intro{
background: url(../images/bg.png) no-repeat center 0;
height: 611px;
margin:0;
padding:25px 0 0 0;
}

#page_intro {
margin: 0 auto;
width:  965px;
}

#logo{
background: url(../images/logo.png) no-repeat 0 0;
height: 210px;
width: 320px;
margin: 0 auto 25px;
}

#boxes{
height: 186px;
width: 750px;
margin: 0 auto;
}

.box{
background: url(../images/box.png) no-repeat 0 0;
float: left;
height: 110px;
width: 372px;
margin: 0;
padding: 42px 0px;
font-size: 17px;
font-style: oblique;
text-align: center;
line-height: 25px;
color: #009bff;
font-weight: bold;
}

.box span{
font-size: 20px;
color: #009bff;

}

.box a.en-savoir-plus {
background: url(../images/button.png) no-repeat 0 0;
display: block;
height: 40px;
line-height: 40px; 
width: 303px;
margin: 30px 33px;
color: #ffffff;
font-size: 22px;
text-decoration: none;
}

/* End landing page
/*************************************************************************************/

/**************************************************************************************
 page */
 /*
#nav-reno {z-index:200; line-height:60px;}
#nav-reno ul {line-height:20px;padding-top:8px;border-left:1px solid #FFFFFF;border-right:1px solid #FFFFFF;}
#nav-reno li {float:left;color:#0099FE;}
#nav-reno li a {display:block; float:left; padding:0 15px; height:60px;line-height:60px; text-decoration:none; white-space:nowrap; text-transform: uppercase;font-size:0.8em;font-weight:bolder;}
 */

#content-reno{
  padding: 8px;
  line-height: 1.2em;
  clear: both;
  font-size: 0.7em;
}

#content-reno ul{
  padding-top:5px;
}

#content-reno h1 {
  background: url(../images/adapt06-icones.png) no-repeat left top;
  border-bottom: 2px solid #cccccc;
  padding-bottom: 3px;
  padding-left: 30px;
  margin: 10px 0;
  font-size: 1.6em;
  color: #666666;
  line-height: 22px;
}

#content-reno h1.plomb{background-position:0 -5px;}
#content-reno h1.elec{background-position:0 -30px;}
#content-reno h1.maco{background-position:0 -63px;}
#content-reno h1.menui{background-position:0 -95px;}
#content-reno h1.peint{background-position:0 -125px;}
#content-reno h1.ferro{background-position:0 -155px;}


#content-reno .onecol-reno, #content-reno .twocol-reno, #content-reno .threecol-reno, #content-reno .twocolindex-reno{
  clear:both;
  margin-bottom:10px;
}

#content-reno .twocolindex-reno .col1-reno {float:left; width:305px; margin-right:10px;}
#content-reno .twocolindex-reno .col2-reno {float:left; width:620px;}

#content-reno .twocol-reno .col1-reno {float:left; width:305px;}
#content-reno .twocol-reno .col2-reno {float:left; width:625px; text-align:justify; margin-right:15px;}

#content-reno .twosubcol-reno .col1-reno {float:left; width:300px; margin-right:20px;}
#content-reno .twosubcol-reno .col2-reno {float:left; width:300px; text-align:left;}

#content-reno .bg{
background : none;
width: 318px;
float:right;
 }

#content-reno .liste1{float:left; width:150px; margin-right:10px;}
#content-reno .liste2{float:left; width:130px; margin-left:10px;}

#content-reno .col1-reno h2, #content-reno .col2-reno h2{
border-bottom: 1px solid #cccccc;
}

#content-reno .bloc-reno{
  float: left;
  height: 148px;
  width: 300px;
  padding: 0 10px 10px 10px;
}
 
#content-reno .col1-reno ul li,#content-reno .col2-reno ul li,#content-reno .col3-reno ul li,#content-reno .onecol-reno ul li,#content-reno .bloc-reno ul li {
  list-style: disc;
  list-style-position: inside;
  color: #ee009e;
} 
 
#content-reno  .emphase-reno{
  font-size: 1.1em;
  line-height: 2.5em;
  color: #009aff;
  font-style: italic;
  font-weight: bold;
} 
 

#content-reno  h2 {
  font-size : 125%;
}
 
 
 
 body.body-renovation {
  background: #ffffff url("../images/bg-renovation.jpg") no-repeat center bottom;
 }
 
 
 /* End page
/*************************************************************************************/

/**************************************************************************************
 Layout */
#bg_right, #bg_left {
  position:         absolute;
  top:              0;
  width:            49%;
  background-color: #E2F5FF;
  z-index:          -2000;
}
#bg_left {left:0;height:130px;width:50%;}
#bg_right {right:0;height:110px;width:100%;}

 
#page {
  margin: 0 auto;
  width:  965px;
}

#header {
  height:   130px;
  padding:  20px;
  background: url(../images/bg_header.jpg) no-repeat center top;
}
#header img {
  font-size:      1.2em;
  font-weight:    bolder;
}
.baseline {
  float:          right;
  text-align:     right;
  text-transform: uppercase;
  font-style:     italic;
  font-weight:    bolder;
  font-size:      1.1em;
  padding:        15px;
  padding-left:   60px;
  background:     url(../images/arrow.gif) no-repeat center left;
}
.baseline p {
  color:          #0099FF;
}

#content {
  padding:        8px;
  line-height:1.2em;
  clear:          both;
  font-size:      0.8em;
}

.onecol, .twocol, .threecol, .twocolindex{
  clear:both;
  margin-bottom:10px;
}

.twocolindex .col1 {float:left;width:305px;margin-right:10px;}
.twocolindex .col2 {float:left;width:620px;text-align:justify;}

.twocol .col1 {float:left;width:305px;}
.twocol .col2 {float:left;width:625px;text-align:justify;margin-right:15px;}

.twosubcol .col1 {float:left;width:300px;margin-right:10px;text-align:left;}
.twosubcol .col2 {float:left;width:300px;text-align:left;}

.threecol .col1 {float:left;width:308px;margin-right:12px;}
.threecol .col2 {float:left;width:308px;margin-right:12px;}
.threecol .col3 {float:left;width:308px;}

.bloc_particuliers, .bloc_entreprises, .bloc_professionnels  {
  float:                left;
  height:               148px;
  width:                298px;
  padding-right:        10px;
  padding-top:          10px;
  background-repeat:    no-repeat;
  background-position:  center center;
  text-align:           right;
}
.bloc_particuliers      {background-image:url(../images/bloc_particuliers.jpg);margin-right:12px;}
.bloc_professionnels  {background-image:url(../images/bloc_professionnels.jpg);margin-right:12px;}
.bloc_entreprises        {background-image:url(../images/bloc_entreprises.jpg);}

.image-list {
  text-align:       right;
  font-weight:      bolder;
  font-style:       italic;
  margin-top:       15px;
}

#footer {
  margin-top:     20px;
  padding-top:    20px;
  font-size:      0.6em;
  line-height:    1.4em;  
  clear:          both;
}
#footer p {
  text-align:     center;
  color:          #0099FE;
}
.uppercase a {text-transform: uppercase;}
 
/* End Layout
/*************************************************************************************/


a:link , a:visited , .pink {
  color:  #ee009e;
}
a:hover, a:active {
  text-decoration:  none;
}

.blue {
  color:  #009aff;
}
a.bluelink {
  color:  #009aff;
  font-weight: bolder;
  float:right;
  padding:  10px;
}

a.bluelink-left {
  color:  #009aff;
  font-weight: bolder;
  padding:  10px;
}

.image-list a:link, .image-list a:visited {
  color:            #666666;
  text-decoration:  none;
}
.image-list a:hover, .image-list a:active {
  text-decoration:  underline;
}

h1 {
  border-bottom:  2px solid #cccccc;
  padding-bottom: 3px;
  margin:         10px 0;
  font-size:      1.5em;
  color:          #666666;
}

h2 {
  color:          #ee009e;
  font-size:      1.1em;
  line-height:    1.2em;
}

ul {
  line-height:1.4em;
}

.col1 ul li, .col2 ul li, .col3 ul li, .onecol ul li {
  list-style: disc;
  list-style-position: inside;
  color: #ee009e;
}

.sublist {
padding: 2px 0 2px 20px;
}

ul li .sublist li {
  list-style: circle;
  list-style-position: inside;
  color: #009aff;
}

.clear {clear:both;}

.bg {background:url(../images/bg_bloc.gif) center right no-repeat;}

.emphase {
  font-size:      1.2em;
  line-height:    2em;
  color:          #009aff;
  font-style:     italic;
  font-weight:    bolder;
}

/* classe images
/*************************************************************************************/

.img01 {
float:left;
margin-right:10px;
margin-bottom:10px;
}
.img02 {
float:left;
margin-right:50px;
margin-bottom:10px;
}
.img-right {
float:right;
margin-left:10px;
margin-bottom:10px;
}
/* classe txt
/*************************************************************************************/

.bleubold-16px {
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
color:#009aff;
}

.rosebold-14px {
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
color:#ee009e;
}

.bleu-title {
font-family:Arial, Helvetica, sans-serif;
font-size:1.5em;
font-weight:bold;
color:#009aff;
border-top:2px solid #cccccc;
padding-top:3px;
margin:10px 0;
}

address {
  font-style: normal;
}

#contactform  fieldset {
  border: 1px solid #009AFF;
  padding: 10px;
  line-height:  25px;
}

#contactform  fieldset legend{
  color:#009AFF;
  font-weight:bolder;
  padding: 2px 10px;
}

#contactform  input{
  float:right;
}

#contactform .col1 {
  float: left;
  width: 280px;
  margin-right:10px;
}
#contactform .col2 {
  float: right;
  width: 280px;
}