/* CSS Document */
*{
	margin: 0;
	padding: 0;
	background-repeat: no-repeat;
}
body{
margin: 0px;
text-align: center;
font-family: verdana;
background-color: #333;
}
#ie6{
position: relative;
width: 960px;
background-color: #333333;
color: #fff;
height: 25px;
font-family: arial;
font-size: 11px;
font-weight: bold;
padding-top: 5px;
text-align: center;
margin: auto;
}
#javascript{
position: relative;
width: 960px;
margin: auto;
background-color: #333333;
color: #fff;
height: 25px;
font-family: arial;
font-weight: bold;
padding-top: 5px;
font-size: 11px;
text-align: center;
}
#page{
position: relative;
width: 960px;
margin: auto;
text-align: left;
height: 629px;
background: url(../images/fond_site_accueil.jpg) no-repeat;
}
/*.autre #page{
position: relative;
width: 960px;
margin: auto;
text-align: left;
height: 629px;
background: url(../images/fond_site.jpg) no-repeat;
}*/
.accueil #clip_intro {
position: absolute;
top: 0;
left: 0;
}
#haut{
float: left;
padding: 45px 0 0 35px;
height: 518px;
}
#menu{
float: left;
width: 244px;
}
#menu img{
border: none;
}
.navigation{
margin: 0; 
padding: 0; 
background: none; 
color: #fff; 
width: 244px;
font-size: 10px;
font-family: verdana;
font-weight: bold;
list-style: none;
}
.navigation li{  
padding: 0 0 2px 0;
list-style: none; 
}
.navigation a, .navigation span{ 
display: block; 
height: 18px;
padding: 4px 0 0 20px; 
color: #fff; 
text-decoration: none;
background: #349ac7;
} 
.navigation .bleufonce a, .navigation .bleufonce span{ 
display: block; 
height: 18px;
padding: 4px 0 0 20px; 
color: #fff; 
text-decoration: none;
background: #1d4d64;
}
.navigation .vertfonce a, .navigation .vertfonce span{ 
display: block; 
height: 18px;
padding: 4px 0 0 20px; 
color: #fff; 
text-decoration: none;
background: #0f8944;
}
.navigation .image a{ 
display: block; 
padding: 0;  
text-decoration: none;
height: 173px;
} 
.navigation .toggleSubMenu a, .navigation .toggleSubMenu span{ 
background: #349ac7; 
} 
.navigation .open a, .navigation .open span{
background: #349ac7 url(../images/fond_menu_sel.jpg) no-repeat;
}
.navigation .bleufonce_open a, .navigation .bleufonce_open span{
background: #1d4d64 url(../images/fond_menufonce_sel.jpg) no-repeat;
} 
.navigation .vertfonce_open a, .navigation .vertfonce_open span{
background: #0f8944 url(../images/fondmenu_vert_fonce_sel.jpg) no-repeat;
} 
.navigation a:hover, .navigation a:focus, .navigation a:active{ 
text-decoration: none; 
} 
.navigation .subMenu{ 
font-size: .8em; 
background: #c6d9ed; 
font-size: .9em; 
margin: 0; 
padding: 0; 
list-style: none;
}
.navigation ul.subMenu a{ 
background: none; 
padding: 2px 0 0 20px;
color: #1d4d64;
}
.navigation ul.subMenu a:hover{ 
background: #dd6e47; 
padding: 2px 0 0 20px;
color: #fff;
}
.navigation ul.subMenu .sel{ 
background: #dd6e47; 
padding: 2px 0 7px 20px;
color: #fff;
}
.navigation ul.sous_menu_facade a:hover {
background-color: #8BB6CA;
}
.navigation ul.sous_menu_facade .sel {
background-color: #8BB6CA;
}
.navigation ul.sous_menu_comble a:hover {
background-color: #7EBCC6;
}
.navigation ul.sous_menu_comble .sel {
background-color: #7EBCC6;
}
.navigation ul.sous_menu_gouttiere a:hover {
background-color: #92C73E;
}
.navigation ul.sous_menu_gouttiere .sel {
background-color: #92C73E;
}
.navigation li.sous_menu_ardoise a:hover {
background-color: #354148;
}
.navigation li.sous_menu_ardoise.sel {
background-color: #354148;
}
#contenu{
	float: left;
}
#accroche p{
font-size: 18px;
font-weight: bold;
color: #fff;
line-height: 22px;
}
#accroche p.ligne1{
padding: 7px 0 0 78px;
}
#accroche p.ligne2{
padding: 0 0 0 18px;
}
#accroche .capitale{
font-size: 24px;
}
#plus_textes{
position:absolute;
top: 147px;
left: 283px;
width: 584px;
height: 359px;
margin: 46px 0 0 8px;
font-family: arial;
color: #000;
font-size: 11px;
font-weight: normal;
}
#plus_textes a, #plus_textes a:hover{
font-family: arial;
color: #000;
font-size: 11px;
font-weight: bold;
text-decoration: none;
}
#texte_comble{
top: 138px;
left: 26px;
position: absolute;
width: 80px;
height: 65px;
cursor: pointer;
border-left: 1px solid #009aea;
}
#texte_comble p{
margin: 38px 0 0 6px;
}
#texte_ardoise{
top: 91px;
left: 169px;
position: absolute;
width: 103px;
height: 63px;
cursor: pointer;
border-left: 1px solid #009aea;
}
#texte_ardoise p{
margin: 0 0 0 6px;
}
#texte_tuile{
top: 91px;
left: 349px;
position: absolute;
width: 178px;
height: 68px;
cursor: pointer;
border-left: 1px solid #009aea;
}
#texte_tuile p{
margin: 0 0 0 6px;
}
#texte_facade{
top: 225px;
left: 30px;
position: absolute;
width: 70px;
height: 82px;
cursor: pointer;
border-right: 1px solid #009aea;
}
#texte_facade p{
margin: 15px 6px 0 0;
text-align: right;
}
#texte_goutiere{
top: 237px;
left: 183px;
position: absolute;
width: 70px;
height: 22px;
cursor: pointer;
border-right: 1px solid #009aea;
}
#texte_goutiere p{
margin: 10px 6px 0 0;
text-align: right;
}
#plus_images{
position:absolute;
top: 147px;
left: 283px;
/*display: none;*/
z-index: 100;
}
#plus_images div a{
font-family: arial;
color: #fff;
font-size: 11px;
font-weight: normal;
}
#plus_images div a:hover{
color: #c1ecfd;
}
#plus_comble{
display: none;
top: 9px;
left: 0px;
position: absolute;
background: url(../images/plus_comble.jpg) no-repeat;
width: 142px;
height: 174px;
padding: 67px 0 0 13px;
line-height: 12px;
}
#plus_ardoise{
display: none;
top: 33px;
left: 111px;
position: absolute;
background: url(../images/plus_ardoise.jpg) no-repeat;
width: 123px;
height: 69px;
padding: 128px 0 0 8px;
line-height: 12px;
}
#plus_tuile{
display: none;
top: 37px;
left: 292px;
position: absolute;
background: url(../images/plus_tuile.jpg) no-repeat;
width: 123px;
height: 69px;
padding: 128px 0 0 9px;
line-height: 12px;
}
#plus_facade{
display: none;
top: 77px;
left: 39px;
position: absolute;
background: url(../images/plus_facade.jpg) no-repeat;
width: 123px;
height: 117px;
padding: 131px 0 0 8px;
line-height: 12px;
}
#plus_goutiere{
display: none;
top: 97px;
left: 194px;
position: absolute;
background: url(../images/plus_gouttiere.jpg) no-repeat;
width: 123px;
height: 63px;
padding: 154px 0 0 9px;
line-height: 12px;
}

/*************************************************************************************************
 *pages interieures*
 ************************************************************************************************/ 
.autre #texte{
width: 576px;
height: 470px;
background: #fff url(../images/fond_contenu.jpg) no-repeat;
margin: 0 0 0 7px;
}
.autre #texte #btn_fermer{
float: left;
}
.autre #texte #btn_fermer p a, .autre #texte #btn_fermer p a:hover{
font-family: verdana;
font-size: 13px;
font-weight: bold;
color: #fff;
text-decoration: none;
vertical-align: top;
}
.autre #texte #btn_fermer p{
padding: 0 0 0 2px;
}
.autre #texte #fil_ariane{
float: left;
}
.autre #texte #fil_ariane p{
font-family: arial;
font-size: 13px;
font-weight: bold;
color: #000;
text-decoration: none;
padding: 2px 0 0 5px;
}
.autre .page_devis #texte {
height: 426px;
}
.autre #texte #devis{
float: right;
height: 20px;
padding: 5px 60px 0 0;
}
.autre #texte #devis h2{
font-family: arial;
font-size: 0.9em;
font-weight: bold;
color: #002b4d;
}
.autre #texte #devis h2 .bleuciel{
font-size: 1.1em;
color: #00a5ed;
}
.autre #texte #fil_ariane p span{
font-family: arial;
font-size: 13px;
font-weight: bold;
color: #e27144;
text-decoration: none;
}
.autre #texte #texte_milieu{
clear: left;
float: left;
width: 576px;
height: 380px;
}
.autre #texte #texte_milieu_contact{
clear: both;
width: 576px;
height: 313px;
}
.autre #texte #texte_milieu_contact form{
padding: 0 0 0 5px;
}
.autre #texte #texte_gauche{
float: left;
width: 378px;
height: 300px;
padding: 20px 0 0 7px;
}
.autre #texte #texte_gauche .bloc_bleu{
background-color: #c5eafa;
padding: 5px;
}
.autre #texte #texte_gauche .bloc_bleu h2{
font-size: 0.8em;
font-weight: bold;
color: #002b4d;
}
.autre #texte #texte_gauche .bloc_bleu h3{
font-size: 0.9em;
font-weight: bold;
color: #00a5ed;
}
.autre #texte #texte_gauche p{
font-family: verdana;
font-size: 0.6em;
font-weight: normal;
padding: 10px 104px 20px 10px;
text-align: justify;
width: 360px;
}
.autre #texte #texte_gauche ul{
padding: 10px 108px 20px 10px;
width: 360px;
}
.autre #texte #texte_gauche ul li{
font-family: verdana;
font-size: 0.6em;
font-weight: normal;
list-style-position: inside;
line-height: 12px;
}
.autre #texte #texte_droite{
float: left;
width: 180px;
height: 300px;
padding: 20px 0 0 5px;
}
.text_etapes {
height: 380px;
}
.autre #texte #texte_droite #anim_flash{
float: left;
width: 180px;
height: 123px;
}
.autre #texte #texte_droite #les_images{
clear: left;
float: left;
padding: 10px 0 0 0;
}
.autre #texte #texte_droite #gde_image{
float: left;
width: 180px;
height: 122px;
}
.autre #texte #texte_droite #pte_images{
clear: left;
float: left;
width: 180px;
padding: 5px 0 0 2px;
}
.autre #texte #texte_droite #pte_images img{
float: left;
padding: 0 7px 0 0;
}
.autre #etape2 #gauche_etape2 {
clear: left;
float: left;
width: 360px;
padding-top: 10px;
padding-left: 12px;
}
.autre #etape2 #droite_etape2 {
	float: right;
	width:177px;
	padding-top: 10px;
	padding-right: 15px;
}

.autre #etape2 #droite_etape2 #img2_droite {

  margin-top: 20px;

}

.autre #etape2 #gauche_etape2 #bas_specialiste_ttc {
	clear: left;
	float: left;
	width: 276px;
	height: 187px;
	background-image: url(../images/fond_process_ttc.jpg);
	background-repeat: no-repeat;
	margin-top: 28px;
	margin-left: 25px;
}
.autre #etape2 #gauche_etape2 #bas_specialiste_tc {
	clear: left;
	float: left;
	width: 276px;
	height: 187px;
	background-image: url(../images/fond_process_tc.jpg);
	background-repeat: no-repeat;
	margin-top: 28px;
	margin-left: 25px;
}
.autre #etape2 #gauche_etape2 #bas_specialiste_an {
	clear: left;
	float: left;
	width: 276px;
	height: 187px;
	background-image: url(../images/fond_process_an.jpg);
	background-repeat: no-repeat;
	margin-top: 20px;
	margin-left: 25px;
}
.autre #etape2 #gauche_etape2 #bas_specialiste_af {
	clear: left;
	float: left;
	width: 276px;
	height: 187px;
	background-image: url(../images/fond_process_af.jpg);
	background-repeat: no-repeat;
	margin-top: 20px;
	margin-left: 25px;
}
.autre #etape2 #gauche_etape2 #bas_specialiste_fetm {
	clear: left;
	float: left;
	width: 276px;
	height: 187px;
	background-image: url(../images/fond_process_fetm.jpg);
	background-repeat: no-repeat;
	margin-top: 20px;
	margin-left: 25px;
}
.autre #etape2 #gauche_etape2 #bas_specialiste_feb {
	clear: left;
	float: left;
	width: 276px;
	height: 187px;
	background-image: url(../images/fond_process_feb.jpg);
	background-repeat: no-repeat;
	margin-top: 28px;
	margin-left: 25px;
}
.autre #etape2 #gauche_etape2 #bas_specialiste_fep {
	clear: left;
	float: left;
	width: 276px;
	height: 187px;
	background-image: url(../images/fond_process_fep.jpg);
	background-repeat: no-repeat;
	margin-top: 20px;
	margin-left: 25px;
}
.autre #etape2 #gauche_etape2 #bas_specialiste_lr {
	clear: left;
	float: left;
	width: 276px;
	height: 187px;
	background-image: url(../images/fond_process_lr.jpg);
	background-repeat: no-repeat;
	margin-top: 28px;
	margin-left: 25px;
}
.autre #etape2 #gauche_etape2 #bas_specialiste_lc {
	clear: left;
	float: left;
	width: 276px;
	height: 187px;
	background-image: url(../images/fond_process_lc.jpg);
	background-repeat: no-repeat;
	margin-top: 20px;
	margin-left: 25px;
}
.autre #etape2 #gauche_etape2 #bas_specialiste_ga {
	clear: left;
	float: left;
	width: 276px;
	height: 187px;
	background-image: url(../images/fond_process_ga.jpg);
	background-repeat: no-repeat;
	margin-top: 28px;
	margin-left: 25px;
}

.autre #etape2 #gauche_etape2 #bas_specialiste_ttc ul {

  padding-top: 23px;
  padding-right: 25px;
  float: right;
  width: 85px;

}

.autre #etape2 #gauche_etape2 #bas_specialiste_ttc ul li {

  list-style: none;
  font-family: arial;
  font-size: 11px;
  font-weight: bold;
  color: #000;
  height: 40px;
  /*margin-top: 14px;*/

}

.autre #etape2 #gauche_etape2 #bas_specialiste_tc ul {

  padding-top: 23px;
  padding-right: 25px;
  float: right;
  width: 85px;

}

.autre #etape2 #gauche_etape2 #bas_specialiste_tc ul li {

  list-style: none;
  font-family: arial;
  font-size: 11px;
  font-weight: bold;
  color: #000;
  height: 40px;
  /*margin-top: 14px;*/

}

.autre #etape2 #gauche_etape2 #bas_specialiste_an ul {

  padding-top: 23px;
  padding-right: 25px;
  float: right;
  width: 85px;

}

.autre #etape2 #gauche_etape2 #bas_specialiste_an ul li {

  list-style: none;
  font-family: arial;
  font-size: 11px;
  font-weight: bold;
  color: #000;
  height: 40px;
  /*margin-top: 14px;*/

}

.autre #etape2 #gauche_etape2 #bas_specialiste_af ul {

  padding-top: 23px;
  padding-right: 25px;
  float: right;
  width: 85px;

}

.autre #etape2 #gauche_etape2 #bas_specialiste_af ul li {

  list-style: none;
  font-family: arial;
  font-size: 11px;
  font-weight: bold;
  color: #000;
  height: 40px;
  /*margin-top: 14px;*/

}
.autre #etape2 #gauche_etape2 #bas_specialiste_fetm ul {

  padding-top: 23px;
  padding-right: 25px;
  float: right;
  width: 85px;

}

.autre #etape2 #gauche_etape2 #bas_specialiste_fetm ul li {

  list-style: none;
  font-family: arial;
  font-size: 11px;
  font-weight: bold;
  color: #000;
  height: 40px;
  /*margin-top: 14px;*/

}
.autre #etape2 #gauche_etape2 #bas_specialiste_feb ul {

  padding-top: 23px;
  padding-right: 25px;
  float: right;
  width: 85px;

}

.autre #etape2 #gauche_etape2 #bas_specialiste_feb ul li {

  list-style: none;
  font-family: arial;
  font-size: 11px;
  font-weight: bold;
  color: #000;
  height: 40px;
  /*margin-top: 14px;*/

}
.autre #etape2 #gauche_etape2 #bas_specialiste_fep ul {

  padding-top: 23px;
  padding-right: 25px;
  float: right;
  width: 85px;

}

.autre #etape2 #gauche_etape2 #bas_specialiste_fep ul li {

  list-style: none;
  font-family: arial;
  font-size: 11px;
  font-weight: bold;
  color: #000;
  height: 40px;
  /*margin-top: 14px;*/

}
.autre #etape2 #gauche_etape2 #bas_specialiste_lr ul {

  padding-top: 23px;
  padding-right: 25px;
  float: right;
  width: 85px;

}

.autre #etape2 #gauche_etape2 #bas_specialiste_lr ul li {

  list-style: none;
  font-family: arial;
  font-size: 11px;
  font-weight: bold;
  color: #000;
  height: 42px;
  /*margin-top: 14px;*/

}
.autre #etape2 #gauche_etape2 #bas_specialiste_lc ul {

  padding-top: 23px;
  padding-right: 25px;
  float: right;
  width: 85px;

}

.autre #etape2 #gauche_etape2 #bas_specialiste_lc ul li {

  list-style: none;
  font-family: arial;
  font-size: 11px;
  font-weight: bold;
  color: #000;
  height: 42px;
  /*margin-top: 14px;*/

}
.autre #etape2 #gauche_etape2 #bas_specialiste_ga ul {

  padding-top: 23px;
  padding-right: 25px;
  float: right;
  width: 85px;

}

.autre #etape2 #gauche_etape2 #bas_specialiste_ga ul li {

  list-style: none;
  font-family: arial;
  font-size: 11px;
  font-weight: bold;
  color: #000;
  height: 40px;
  /*margin-top: 14px;*/

}

.autre #etape2 #gauche_etape2 #specialiste #specialiste_texte {

  height: 122px;

}

.autre #etape2 #gauche_etape2 #specialiste #specialiste_texte ul {

  width: 330px;
  padding-left: 25px;
  padding-top: 5px;

}

.autre #etape2 #gauche_etape2 #specialiste #specialiste_texte ul li {

  list-style: square inside;
  color: #dc8f0b;
  line-height: 175%;
  font-size: 9px;

}

.autre #etape2 #gauche_etape2 #specialiste #specialiste_texte ul li span{
	font-family: arial;
	font-size: 10px;
	color: #000;
}

.autre #texte #bloc_contact{
position: absolute;
top:144px;
left:294px;
width: 550px;
background-color: #bde7f9;
}

.autre #texte #menu_etape{
clear: left;
float: left;
width: 480px;
padding: 18px 0 0 10px;
}
.autre #texte #menu_etape img{
border: none;
}
#bas{
clear: left;
float: left;
width: 980px;
}
#numero{
padding: 2px 0 0 50px;
}
#numero p{
font-size: 16px;
font-weight: bold;
color: #fff;
}
#numero .capitale{
font-size: 21px;
}


/******************************** Codes couleurs **************************************/
.autre .tuiles #texte #fil_ariane p span{

  color: #E27144;

}
.autre .ardoises #texte #fil_ariane p span{

  color: #354148;

}
.autre .facade #texte #fil_ariane p span{

  color: #8BB6CA;

}
.autre .combles #texte #fil_ariane p span{

  color: #7EBCC6;

}
.autre .gouttiere #texte #fil_ariane p span{

  color: #92C73E;

}
.autre .combles #texte #texte_gauche .bloc_bleu {

  background-color: #7EBCC6;

}
.autre .combles #texte #texte_gauche .bloc_bleu h2 {

  color: #002B4D;

}
.autre .combles #texte #texte_gauche .bloc_bleu h3 {

  color: #FFFFFF;

}
.autre .gouttiere #texte #texte_gauche .bloc_bleu {

  background-color: #F2EDE4;

}
.autre .gouttiere #texte #texte_gauche .bloc_bleu h2 {

  color: #002B4D;

}
.autre .gouttiere #texte #texte_gauche .bloc_bleu h3 {

  color: #92C73E;

}

.autre #texte #etape3 #menu_etape {

  padding: 0;
  margin-top: 3px;
  margin-left: 10px;

}

.autre #texte #form_contact {

  color: #000;
  font-size: 11px;
  font-family: arial;
  padding: 0;
  margin: 0;
  height: 395px;

}

.autre #texte #form_contact span.rouge {

  color: #e2460b;
  font-style: italic;

}

#form_contact #bloc_prestations {

  clear: both;
  float: left;
  background-image: url(../images/bloc_prestations.jpg);
  background-repeat: no-repeat;
  width: 549px;
  height: 110px;
  padding: 0;
  margin: 0;
  margin-top: -3px;
  margin-left: 10px;

}

.autre #texte #form_contact #bloc_prestations table {

  width: 430px;
  margin-top: 50px;
  margin-left: 52px;

}

.autre #texte #form_contact #bloc_prestations table tr {

  height: 25px;

}

.autre #texte #form_contact #bloc_prestations table tr td span {

  padding-left: 5px;

}

#form_contact #bloc_maison {

  clear: both;
  float: left;
  background-image: url(../images/bloc_maison.jpg);
  background-repeat: no-repeat;
  width: 549px;
  height: 94px;
  padding: 0;
  margin: 0;
  margin-left: 10px;

}

.autre #texte #form_contact #bloc_maison table {

  width: 445px;
  margin-top: 40px;
  margin-left: 75px;

}

.autre #texte #form_contact #bloc_maison table tr {

  height: 25px;

}

.autre #texte #form_contact #bloc_maison table tr td span {

  padding-left: 5px;

}

#form_contact #bloc_coordonnees {

  clear: both;
  float: left;
  background-image: url(../images/bloc_coordonnees.jpg);
  background-repeat: no-repeat;
  width: 549px;
  height: 191px;
  padding: 0;
  margin: 0;
  margin-left: 10px;
  padding-top: 40px;

}

#form_contact #bloc_coordonnees #coord_gauche input, textarea {

  padding: 0;
  margin: 0;
  width: 126px;

}

#form_contact #bloc_coordonnees #coord_gauche {

  float: left;
  /*margin-top: 45px;*/
  margin-left: 10px;
  width: 196px;

}


#form_contact #bloc_coordonnees table {

  /*height: 23px;*/
  width: 200px;
  padding: 0;
  margin: 0;

}

#form_contact #bloc_coordonnees table tr td.intitule {

  width: 81px;
  vertical-align: top;

}

#form_contact #bloc_coordonnees #coord_droite {

  float: right;
  /*margin-top: 45px;*/
  width: 225px;
  margin-right: 55px;

}

#form_contact #bloc_coordonnees #coord_droite table {

  width: 220px;

}

#form_contact #bloc_coordonnees #coord_droite #submit {

  background-image: url(../images/btn_valider_devis.jpg);
  background-repeat: no-repeat;
  width: 152px;
  height: 24px;
  border: 0 none;
  cursor: pointer;
  margin-right: -15px;
  margin-top: 7px;

}

#form_contact #bloc_coordonnees #coord_droite #text_contact {

  margin: 7px 0 0 0;
  width: 277px;

}

#form_contact #message_form_contact {
  
  padding-top: 5px;
  color: #e2460b;
  font-family: arial;
  font-size: 11px;
  font-style: italic;

}