* { padding: 0; margin: 0; }
img{ border:0; }

/* BASIC */
body { font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; overflow-x:hidden;  }
a { color: white; text-decoration:none;}
ul { list-style:none; }
.clear{ clear:both}
.left { float:left; }
.right { float:right; }
h1 { color: #eb5c24; font-size: 54px; padding-bottom: 25px;}
h2 { font-size: 54px; }
p { font-size:16px;}
#actif p{ text-decoration: underline; color:#eb5c24!important; } 
.color { color: #eb5c24;}
.color2 { color: white; }
.underline { text-decoration:underline; }

/* LAYOUT */
.container { width:100%; max-width:1000px; margin:0 auto; position:relative; }
.container2 { width:1250px; margin:0 auto; }
#header { width: 100%; background-color:white; color: grey; border-top: solid 4px #eb5c24; min-height: 130px; }
#header #logo-groupe{ margin-top:30px; }
#header #logo{ display:none; }
#header .menu_box ul { position:relative; top: -5px;}
#header .menu_box li a{ padding: 5px;}
#header .menu_box a.actif_bg { background-color: #eb5c24!important; color:white!important; }
.actif_bg2 { background-color: #eb5c24!important; color:white;}
#header .menu_box {  text-align:center; position: absolute; left:0; top:0; z-index:1; background:url(../img/menu_bg.png) repeat; height: 363px; }
#header .menu_box img { box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.4);}
#header a { color: black;}
#header .menu_box .left, #header .menu_box .right { width: 170px; border-bottom: 1px solid grey; position:relative; top: -5px; height: 38px; line-height: 38px;}
#header .menu_box .right { border-left: 1px solid grey; }
#header .menu_box li > a { display: block; }
#small-menu{ display:none; }
#footer{ width:100%; background-color:black; color:white; height:60px; line-height:60px; text-align:center; font-size:14px; }
#footer2{ width:100%; background-color:#eb5c24; color:white; height:60px; line-height:60px; text-align:center; font-size:14px; position:relative; }
#footer2 ul{ text-align:center; }
#footer2 ul li{ display:inline; }
#footer2 span{ color: #333; }
#footer2 img{ position:absolute; right:5px; bottom:5px; }

/* SLIDES */
.slide{ width:100%; position: relative; }
#slide1 { background:url(../img/slide1_bg.jpg) fixed top center no-repeat; background-size:cover; height: 1000px; }
#slide2 { background-color:white; height: 45vh;  text-align:center; min-height:900px; }
#slide2 p {color: grey; padding-bottom:60px; }
#slide2 .top { height: 60px; background-color: #eb5c24; }
#slide2 .bottom { height: 110px;   background-color: #eb5c24; position:absolute; bottom: 0px; width: 100%; }
#slide2 .title { color: grey; line-height:30px; padding-bottom: 60px; margin-top:40px; }
#slide2 .title img { position:relative; top:20px; left:15px; }
#slide3{ background:url(../img/slide3_bg.jpg) fixed center; background-size:cover; height:100vh; color:white; min-height:750px; }
#slide3 span { color:  #eb5c24; font-weight:bold;}
#slide3 p{ padding-top: 20px; }
#slide3 p:first-of-type{ font-size:18px; }
#slide3 h2{ padding-top: 10%; }
#slide3 #buttons li{ display:inline-block; }
#slide4 { background-color:white; min-height: 965px; height: 100vh; text-align:center; }
#slide4 p { color: grey; }
#slide4 h2 { padding-top: 70px; color: grey; padding-bottom: 70px;}
#slide4 #refs{ text-align:center; }
#refs li{ display:inline-block; width:24%; text-align:center; color:#ffffff; margin:30px 0; font-size:16px; }
#refs li:hover{ color:grey; cursor:pointer; }
#refs li img{ display:block; margin:0 auto 10px auto; }
.show_not { display: none;}

#slide_carpente{ background:url(../img/carpente_bg.jpg) fixed top center; background-size: cover; height:950px; }
#slide_ferblanterie{ background:url(../img/ferblanterie_bg.jpg) fixed top center; background-size:cover; height:950px; }
#slide_entretien{ background:url(../img/entretien_bg.jpg) fixed top center; background-size: cover; height: 950px; }
#slide_etancheite{ background:url(../img/etancheite_bg.jpg) fixed top center; background-size: cover; height: 950px; }
#slide_couverture{ background:url(../img/couverture_bg.jpg) fixed top center; background-size: cover; height: 950px; }
#slide_entreprise{ background:url(../img/slide3_bg.jpg) fixed top center; background-size: cover; height: 950px; }

/* MODULES */
#slide1 .scroll { position:absolute; bottom: 20px; left: 50%; opacity: 0.8; margin-left: -40px; width: 200px;}
#slide2 .bottom  {text-align:center; padding-top: 25px;  }
#slide3 .scroll { position:absolute; bottom: 20px; left: 50%; opacity: 0.8;  margin-left: -40px;width: 200px; }
#slide4 .scroll { position:absolute; bottom: -60px; left: 50%; opacity: 0.8;  margin-left:-20px; width: 20px; }
.slide_scroll .scroll_on { width: 100%; background:url(../img/menu_bg.png); height: 30px; position: absolute; bottom: 0px; text-align:center;}
.slide_scroll .scroll_on img {position: relative; bottom: 22px; opacity: 0.8;}
#slide2 .picto_box { float: left;height: 150px;width: 250px; text-align:center; }
#sub-menu{ text-align:center; }
#sub-menu li{ display:inline-block; width:19%; }
#sub-menu a{ color:grey; text-transform:uppercase; font-size:16px; text-align:center; display:block; width:100%; height:200px; background-color:#ffffff; line-height:360px; background-repeat:no-repeat; background-size:100%; }
#sub-menu #picto1 { background-image:url(../img/pictos_homepage2.jpg); background-position:center 0; }
#sub-menu #picto2 { background-image:url(../img/pictos_homepage2.jpg); background-position:center -186px; }
#sub-menu #picto3 { background-image:url(../img/pictos_homepage2.jpg); background-position:center -372px; }
#sub-menu #picto4 { background-image:url(../img/pictos_homepage2.jpg); background-position:center -558px; }
#sub-menu #picto5 { background-image:url(../img/pictos_homepage2.jpg); background-position:center -744px; }
#scroller{ margin-bottom:50px; }
#scroller img{ width:725px; height:480px; }

/*info_box*/
.info_box { width: 700px; background:url(../img/menu_bg.png) repeat; padding: 40px 140px 40px 40px; color: #64625f; position: relative; margin-top:300px; float:left; }
.contact_box { width: 500px; background:url(../img/menu_bg.png) repeat; padding: 40px 40px 40px 40px; color: #64625f; position: relative; top: 300px;  }
ul#scroller { margin-top: 50px; }
.button { display:block; height: 60px; width: 315px; line-height:60px; border: 1px solid white; margin-right: 15px; text-align:center; margin-top: 30px; font-size:26px; }
.space { height: 30px; }

/*box_his*/
.box_his { padding-top: 300px; }
.box_his p { color: white; }
.box_his p:first-of-type { padding-bottom: 30px;}
.box_his p:last-child { padding-top: 30px;}
.container_his { background:url(../img/his_bg.png) center top no-repeat white; height: 1240px; width: 900px; margin: 0 auto; color: grey;}
.container_his .right { text-align: left;}
.container_his .left { text-align: right;}
.container_his h3 { font-size:22px; color:#eb5c24; }
.ass-allianz { position: relative; top: -55px; left: 20px; }
.his { width: 47%; }
.logo { text-align: center; padding:25px 0; }
.his_info { text-align: center; width: 650px; margin:0 auto; color:grey; }
.container_his .right .title1{ margin-top:90px; }
.container_his .right .title2, .container_his .right .title3, .container_his .right .title4, .container_his .left .title1{ margin-top:60px; }
.container_his .left .title2{ margin-top:70px; }
.container_his .left .title3{ margin-top:110px; }

/*google maps api*/
#googlemaps{ height: 100%; width: 100%; position:absolute; top: 0; left: 0; z-index: 0; }
.maps { height: 80vh; min-height:570px; }

/*contact form*/
.contact_form { width: 500px; margin: 0 auto; text-align: left; }
.contact_form table { width: 500px; }
.contact_form table td { padding: 3px;}
.contact_form table .text1 { text-align: right;}
.contact_form table .text2 { text-align: left;}
.contact_form table ul{ margin-left:35px; }
label {float: right;}
input { float: left;  height: 20px; }
.contact_form input[type=radio]{ float:none; }
input[type=text] { width: 220px; margin-left:35px; }
textarea { float: left; margin-left: 35px; width: 220px;}
#sub_button { background-color: #eb5c24; color: white; width: 80px; border:0;float: right;clear: both;margin-right: 78px;cursor: pointer; }
.form-02{ display:none; }

/* mentions légales */
#mentions{ width:800px; margin:0 auto; padding-top:330px; }
#mentions div{ background:url(../img/menu_bg.png) repeat; font-size:14px; text-align:justify; color:#000000; padding:20px 20px 40px 20px; }
#mentions h2{ color:#eb5c24; font-size:18px; text-transform:uppercase; margin-top:15px; }
#mentions p{ margin-top:10px; }
#mentions a{ text-decoration:underline; color:#eb5c24; }