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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:top;}article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section{display: block;}body{line-height: 1;}ol, ul{list-style:none;}blockquote, q{quotes:none;}blockquote:before, blockquote:after, q:before, q:after{content:'';content: none;}table{border-collapse:collapse;border-spacing:0;}img{max-width:100%;}a{text-decoration:none;}
@font-face{font-family:'icomoon';src:url('../fonts/icomoon.eot');src:url('../fonts/icomoon.eot?#iefix') format('embedded-opentype'), url('../fonts/icomoon.woff') format('woff'), url('../fonts/icomoon.ttf') format('truetype'), url('../fonts/icomoon.svg#icomoon') format('svg');font-weight:normal;font-style:normal;}
/* Common styles of menus */
.dl-menuwrapper{width:85%;position:absolute;top:2.25em;right:2em;-webkit-perspective:1000px;perspective:1000px;-webkit-perspective-origin:50% 200%;perspective-origin:50% 200%;z-index:3000;}
.dl-menuwrapper:first-child{margin-right:100px;}
.dl-menuwrapper button{background:#e2001a;border:none;margin:0 auto;width:35%;height:45px;position:absolute;top:0;right:0;cursor:pointer;outline:none;color:#fff;font-size:1.25em;}
.dl-menuwrapper button:hover, .dl-menuwrapper button.dl-active{background:-webkit-linear-gradient(rgba(226,0,26,1),rgba(33,30,33,1));background:-moz-linear-gradient(rgba(226,0,26,1),rgba(33,30,33,1));background:-o-linear-gradient(rgba(226,0,26,1),rgba(33,30,33,1));background:linear-gradient(rgba(226,0,26,1),rgba(33,30,33,1));}
.dl-menuwrapper ul{background:#414141;padding:0;list-style:none;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;width:100%;position:absolute;top:0;}
.dl-menuwrapper li{position:relative; padding:0; margin:0;}
.dl-menuwrapper li a{display:block;padding:15px 25px; margin:0;position:relative;font-size:1.1em;color:#fff;outline:none;border-bottom: 1px solid #797070;}
.no-touch .dl-menuwrapper li a:hover{background:rgba(0,0,0,0.3);}
.dl-menuwrapper li.dl-back > a{padding-left:30px;background:rgba(0,0,0,0.1);}
.dl-menuwrapper li.dl-back:after, .dl-menuwrapper li > a:not(:only-child):after{position:absolute;top:0;line-height:50px;font-family:'icomoon';speak:none;-webkit-font-smoothing:antialiased;content:"\e000";}
.dl-menuwrapper li.dl-back:after{left:10px;color:rgba(255,255,255,0.9);-webkit-transform:rotate(180deg);transform:rotate(180deg);}
.dl-menuwrapper li > a:after{right:10px;color:rgba(255,255,255,0.6);}
.dl-menuwrapper .dl-menu{margin:5px 0 0 0;position:absolute;top:2.25em;width:100%;opacity:0;pointer-events:none;-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-backface-visibility:hidden;backface-visibility:hidden;}
.dl-menuwrapper .dl-menu.dl-menu-toggle{transition:all 0.3s ease;}
.dl-menuwrapper .dl-menu.dl-menuopen{opacity:1;pointer-events:auto;-webkit-transform:translateY(0px);transform:translateY(0px);}
/* No JS Fallback */
.no-js .dl-menuwrapper .dl-menu{position:relative;opacity:1;-webkit-transform:none;	transform:none;}
.no-js .dl-menuwrapper li .dl-submenu{	display:block;}
.no-js .dl-menuwrapper li.dl-back{	display:none;}
.no-js .dl-menuwrapper li > a:not(:only-child){background:rgba(0,0,0,0.1);}
.no-js .dl-menuwrapper li > a:not(:only-child):after{content:'';}
/* Mobile */
body{font-family: 'Roboto Condensed', sans-serif;}
a{display:inline-block;}
header img{margin:auto;} 
h1, p{text-align:left; margin:0.5em auto; color:#1e1d1d;} 
p{line-height:normal;margin-bottom:0.75em;}
a{color:#e2001a;}
h1{color: #e2001a; font-size:2.6em; font-weight:300;}
h2{color: #e2001a; font-size:2em; font-weight:300; margin-top:1em;}
h3{color: #e2001a; font-size:1.4em; font-weight:300; margin-top:1em;}
ul{list-style-type:disc; margin:1em 0 0 2em; padding:0;}
ul li{margin:0; padding-bottom:.5em;}
div.main{margin:0 10%; position:relative;}
header{background-image:url(../images/bg-header-mobile.jpg); width:100%; background-repeat:no-repeat; background-size:100% 100%;padding-top:10px; padding-bottom:8%;}
body.index header{background-image:url(../images/bg-header-mobile.jpg); padding-bottom:0;}
header nav.menu-contact{display:none;  margin:0 auto;}
nav.main{display:none;}	
header a.logo img{width:80%;}
body.index header p.slogan{display:block; color:#fff; font-size:1.3em; font-weight:bold; margin:9% 0 0 10%;padding-bottom:5%;}
header p.slogan{display:none;}
main{margin: 0 10%;}
aside{padding-top:1%; padding-bottom:3%; max-width:300px;}
aside div{color:#686060; background-color: #e7e7e7; margin-bottom:1%;margin-top:1%; font-size:1.5em; padding:2% 4%; line-height:1.2em; text-align:left;}
aside div.nomargin{margin:0;}
aside div.margintop15{margin-top:15%;}
.index aside div{margin-bottom:5%;margin-top:0%;}
aside div a{color:#686060;}
aside div a:hover{opacity: 0.6;}
span.uppercase{text-transform:uppercase;}
aside div.important{background-color:#e2001a; color:#fff;}
aside div.important a{color:#fff;}
aside div a img{vertical-align:middle;}
img.gouttieres{margin-top:-5%;}
nav.nav-image{background-color:#fbfaf9;}
nav.nav-image ul{margin:0 10%;}
nav.nav-image ul li{color:#787777; width:43%; max-width:216px;text-align:justify;padding:0 3% 6% 3%; display:inline-block; vertical-align:text-top;}
nav.nav-image ul li a{margin-top:1em; text-align:left; max-width:216px;}
nav.nav-image ul li img{margin:4% 0; width:100%;}
nav.nav-image ul li a{display:block; float:left; position:relative;}
nav.nav-image ul li a:hover{opacity: 0.6;}
nav.nav-image ul li span{position:absolute; bottom:0; right:0; background-color:#fbfaf9; padding:4% 6% 5% 6%;}
div.nombre-projet{background-color:#e2001a; color:#fff; font-size:1.8em; text-align:center; padding: 10%;}
div.realisation{background-image:url(../images/bg-index-realisation-mobile.jpg); background-repeat:no-repeat; background-size:100% 100%; padding:4% 15% 10% 15%;}
div.realisation ul li{display:inline-block; width:48%;}
div.realisation a{margin:4% 2% 2% 0%;}
div.realisation img{width: 100%;}
div.realisation a:hover{opacity: 0.7;}
footer nav{display:none;}
div.footerlogo{display:inline-block; width:25%;}
div.footernav{display:inline-block; width:70%;  text-align:right;}	
footer{margin:0 10%;}
footer a{display: inline;}
footer img{margin-bottom:5%; width:100%;vertical-align:middle;}
footer p.telephone{font-size:1.8em;  color:#1e1d1d; text-align:right; margin-top:10%;}
p.contact-mobile{text-align:right;}
.copy, .ymark{font-size: 0.8em;}
footer p.ymark a{display:inline; color:#000;}
input[name=name]{display: none;}
label.prenom, input[name=prenom]{display:none}
input, select, textarea{width:100%;margin-top:0.25em;height:1.5em;margin-bottom:1em;}
textarea{height:5em;}
.g-recaptcha{margin:1em 0;}
input[type=submit]{width:auto;border:none;background:#b3071b;color:#fff;height:auto;padding:0.55em 1.5em;border-radius:0.5em;}
p.reseau{margin-top:2em;}	
p.reseau a{margin-right: 1em;}
/*CSS for mobile2 (336px and above)*/

#politique-confidentialite{
    margin-bottom: 72px;
}

#politique-confidentialite .section2{
    margin-top: 52px;
}

@media (min-width: 21em){
header p.slogan{font-size:1.3em;margin:5% 0 0 10%;padding-bottom:7%;}
} 
/*CSS for mobileLandscape (400px and above)*/
@media (min-width: 25em){
}   
/*CSS for mobileLandscape2 (496px and above)*/
@media (min-width: 31em){
header p.slogan{font-size:2.2em;margin:6% 0 0 10%;padding-bottom:4%;}
}   
/*CSS for tablets (768px and above)*/
@media (min-width: 48em){
nav.nav-image ul li{width:25%;}
aside{display:inline-block; width:27%;text-align:right; margin : 1% 0 5% 3%;}
article{display:inline-block; width:67%; margin-right:2%; margin-bottom:2em;}
aside.contact, article.contact{display:inline-block;width:45%;}
}   
/* CSS for desktops (1024px and above) */
@media (min-width: 64em){
p.contact-mobile{display:none;}
div.main{margin:0 21% 0 22%; position:relative;}
nav.dl-menuwrapper{display:none;}
nav.main,footer nav{display:inline-block;}
header nav.menu-contact{display:inline-block;}
body.index header{background: url(../images/bg-header-index.jpg) no-repeat top; background-size:100% 100%;}
header{background: url(../images/bg-header.jpg) no-repeat;background-size:100% 100%;}
body.index header p.slogan{font-size:2.6em;  margin:8% 21% 0 22%;padding-bottom:4%;}
header p.slogan{font-size:2.6em;  margin:2% 21% 0 22%;padding-bottom:6%;}
main{margin:0 21% 0 22%;}
header a.logo{margin-left:0;} 
header a.logo img{width:100%;}
div.headerlogo{display:inline-block;  width:14%;}
div.headernav{display:inline-block; width:85%; text-align:right;}
header nav.menu-contact ul{position:relative;text-align:right;font-size:0.95em;}
header nav.menu-contact ul li{display:inline-block; padding: 0px 0.5em;}
header nav.menu-contact ul li a{color:#fff;}
header nav.menu-contact ul li a:hover{color:#e2001a; text-decoration:none;}
p.telephone{color:#fff;  font-size:3em;text-align:right; margin:0;}
header nav.main{margin-top:1%;}
header nav.main ul{position:relative; text-align:right;margin:0;}
header nav.main ul li{font-size:0.9em;display:inline-block; vertical-align:text-top;text-align:center;background-color: rgba(30, 29, 29, 0.65); padding:0.5em 0.1em; width:18.8%;}
header nav.main ul li:hover{background-color: rgba(226, 0, 26, 0.65);}
header nav.main ul li a{color:#fff;}
article p{text-align:justify;}
nav.nav-image ul{margin:0 21% 0 22%;}
nav.nav-image ul li{width:17.9%; padding:0 1% 6% 1%;}
nav.nav-image ul li:first-child{padding-left:0;}
nav.nav-image ul li:last-child{padding-right:0;}
div.nombre-projet{font-size:2.3em; text-align:center; padding: 5% 0 5% 0;}
div.realisation{background: url(../images/bg-index-realisation.jpg) no-repeat top; background-size:100% 100%;padding: 2% 0 4% 0;}
div.realisation ul {margin:0 21% 0 22%;}
div.realisation ul li{width:33%;}
footer{margin:0% 21% 0 22%;}
footer a.logo img{width:100%; margin-top:5px; margin-right:0;}
div.footerlogo{display:inline-block; width:13%;}
div.footernav{display:inline-block; width:86%;  text-align:right;}	
footer nav.menu-contact ul{position:relative;text-align:right;font-size:0.95em; }
footer nav.menu-contact ul li{display:inline-block; padding: 0px 0.5em;}
footer nav.menu-contact ul li a{color:#161616;}
footer nav.menu-contact ul li a:hover{color:#e2001a; text-decoration:none;}
footer p.telephone{color:#161616;  font-size:3em;text-align:right; margin:0;}
footer nav.main{margin-top:0;}
footer nav.main ul{position:relative; text-align:right; margin:0;}
footer nav.main ul li{font-size:0.9em;display:inline-block; vertical-align:text-top; text-align:center; padding:1em 0.3em;; width:17%;}
footer nav.main ul li a{color:#161616;}
footer nav.main ul li a:hover{color:#e2001a; text-decoration:none;}
.copy, .ymark{float:left; width:25%; margin:40px 0px 50px 0px;}
footer p.ymark{text-align:right; width:75%;}
}      
@media only screen and (min-width : 85em){
header nav.main{margin-top:2%;}
header nav.main ul{margin:0;}
header nav.main ul li{font-size:0.95em;width:19%;}
body.index header p.slogan{font-size:2.7em;  margin:19% 21% 0 22%;padding-bottom:3%;}
header p.slogan{font-size:2em;  margin:2% 21% 0 22%;padding-bottom:2%;}
footer nav.main{margin-top:2%;}
footer nav.main ul{margin:0;}
footer nav.main ul li{padding:1em 0.12em;; width:18%;font-size:0.9em;}
}
@media print{
nav,p.slogan, aside,div.nombre-projet,div.realisation{display:none}
main{padding-bottom:10px;}
footer{border-top:1px solid #ddd;padding-top:10px;}
footer img{width:75%}
}