*{
	padding:0;margin:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;*behavior:url(js/boxsizing.htc); outline:none;
}

/* ---------------------------------------------------------------------------------------------------- FONTS ---------------------------------------------------------------------------------------------------- */
 
@font-face {
    font-family: 'ttl';
    src: url('fonts/titillium-regular-webfont.eot');
    src: url('fonts/titillium-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/titillium-regular-webfont.woff2') format('woff2'),
         url('fonts/titillium-regular-webfont.woff') format('woff'),
         url('fonts/titillium-regular-webfont.ttf') format('truetype'),
         url('fonts/titillium-regular-webfont.svg#titilliumregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'ttl-b';
    src: url('fonts/titillium-semibold-webfont.eot');
    src: url('fonts/titillium-semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/titillium-semibold-webfont.woff2') format('woff2'),
         url('fonts/titillium-semibold-webfont.woff') format('woff'),
         url('fonts/titillium-semibold-webfont.ttf') format('truetype'),
         url('fonts/titillium-semibold-webfont.svg#titilliumbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'ttl-l';
    src: url('fonts/titillium-thin-webfont.eot');
    src: url('fonts/titillium-thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/titillium-thin-webfont.woff2') format('woff2'),
         url('fonts/titillium-thin-webfont.woff') format('woff'),
         url('fonts/titillium-thin-webfont.ttf') format('truetype'),
         url('fonts/titillium-thin-webfont.svg#titilliumthin') format('svg');
    font-weight: normal;
    font-style: normal;
}

.ttl {font-family:'ttl'; font-weight:normal;}
.ttl-b {font-family:'ttl-b'; font-weight:normal;}
.ttl-l {font-family:'ttl-l'; font-weight:normal;}


.font10 {font-size:10px;} 
.font11 {font-size:11px;} 
.font12 {font-size:12px;} 
.font13 {font-size:13px;} 
.font14 {font-size:14px;} 
.font15, .font16, .font17, .font18 {font-size:16px;} 
.font19, .font20, .font22, .font24 {font-size:18px;} 
.font26, .font28, .font30, .font32 {font-size:20px;} 
.font36, .font40 {font-size:24px;} 
.font50 {font-size:26px;} 


/* ---------------------------------------------------------------------------------------------------- PARAMETRES GENERAUX ---------------------------------------------------------------------------------------------------- */
 
section,header,footer,figure,article,aside,nav,main {display:block;} 


a,a *,button,button *{color:#3c3c3c; text-decoration:none; cursor:pointer; outline:0;} 
a:hover,button:hover {color:#ae0f0a;} 
a img {border:0;} 
img, svg {vertical-align:middle; border:none;}
svg path {color:inherit; fill:inherit;}
b, strong {font-family:'ttl-b'; font-weight:normal;}
ul,li {list-style-type:none;} 


p,div {font:14px 'ttl'; color:#3c3c3c; line-height:20px; text-align:left;} 


textarea {overflow:auto; resize:none;} 
input,textarea {outline:0;} 
input[type=submit] {cursor:pointer;} 


h1,h2 {width:100%; font:normal 26px 'ttl-l'; color:#fff; line-height:26px; text-align:left; margin-bottom:10px; letter-spacing:-.04em;}
h2 {font:normal 22px 'ttl-l'; line-height:22px; margin-bottom:15px;}

.middle {vertical-align:middle;} 
.bottom {vertical-align:bottom;}
.right {text-align:right;} 
.center {text-align:center;} 
.justify {text-align:justify;}

#content-admin{
	width:960px; background:#fff; padding:20px 50px 60px 50px; text-align:center; margin-top:0; margin:auto; color:#333; box-shadow:0 0 10px 0 rgba(0,0,0,0.65); -webkit-box-shadow:0 0 10px 0 rgba(0,0,0,0.65); -moz-box-shadow:0 0 10px 0 rgba(0,0,0,0.65)
} 
#content-admin *{
	color:#333;
}
#content-admin>h1{
	text-align:center;display:inline-block; width:100%; margin:auto; background:0; font:normal 28px "questa"; color:#de2f83; text-transform:uppercase; height:auto; text-shadow:none; letter-spacing:0.05em;
}
#content-admin>h2{
	text-align:center; display:inline-block; width:100%; margin:auto; background:0; font:normal 18px "mont-b"; color:#de2f83; text-transform:uppercase; height:auto; text-shadow:none;
}

/* ---------------------------------------------------------------------------------------------------- ELEMENTS GLOBAUX ---------------------------------------------------------------------------------------------------- */

.bouton{display:inline-block; width:170px; height:40px; color:#fff; font:14px 'ttl-b'; line-height:40px; text-align:center; background:#ae0f0a;}
.bouton.bottom img {transform:rotate(90deg);} .bouton.top img {transform:rotate(-90deg);} .bouton.left img {transform:rotate(180deg);}
.bouton.bgblanc {color:#3c3c3c; background:#ebebeb;} .bouton.bgblanc:hover {background:#c7c7c7; color:#3c3c3c;}

a.bouton:hover, button.bouton:hover {background:#8e0f0a; color:#fff;}
.bouton.big {width:auto; padding:0px 10px;}
.bouton img {margin:0 5px;}

.width960, .width940 {width:100%; padding:0 15px;}
.reverse {display:flex!important; flex-direction:column-reverse!important;}

.col-big, .col-small, .column {width:100%; padding:15px 0; display:inline-block; vertical-align:top; position:relative;}

.bloc-bordure {background:none; border:solid 1px #fff; padding:10px;}

.responsive {width:100%; height:auto;}

.placeholder {color:#3c3c3c;} 
::-webkit-input-placeholder	{color:#3c3c3c;} 
::-moz-placeholder {color:#3c3c3c;}
::-ms-placeholder {color:#3c3c3c;}
::-ms-input-placeholder	{color:#3c3c3c;}
:-ms-input-placeholder	{color:#3c3c3c;}

/* ---------------------------------------------------------------------------------------------------- COULEURS ---------------------------------------------------------------------------------------------------- */

.blanc {color:#fff; fill:#fff;} 
.noir {color:#3c3c3c; fill:#3c3c3c;}
.rouge {color:#ae0f0a; fill:#ae0f0a;}

.bgblanc {background:#ebebeb;} 
.bgnoir {background:#3c3c3c;}
.bgrouge {background:#ae0f0a;}

/* ---------------------------------------------------------------------------------------------------- PAGE D'ACCUEIL ------------------------------------------------------------------------------------------*/
body>header>div.width940>h1 {
    margin-top: 10px !important;
}


.infos-rupture {
    font-family: 'ttl-b';
    font-weight: normal;
    font-size: 1.5rem;
    margin-top: 20px;
    margin-bottom: 0px;
    color: white;
    line-height: 40px;
}

h1 {
    width: 100%;
    font: normal 1.2rem 'ttl-l';
    color: #fff;
    line-height: 30px;
    text-align: left;
    margin-bottom: 10px;
    letter-spacing: -.04em;
    margin-top: 10px;
}

html {width:100%; height:100%;}
html.noscroll {overflow:hidden; height:100%; width:100%; position:fixed;}
body {min-width:320px; background:#fff; height:100%;}

body>header {width:100%; height:380px; position:relative;}

#slider {width:100%; height:380px; position:absolute; z-index:1;}
#slider>button {display:none!important;}
#slide-1, #slide-2, #slide-3, #slide-4 {background-position:top center; background-repeat:no-repeat; height:380px; width:100%;}
#slide-1 {background-image:url('images/header/header-home.jpg'); background-size:cover;}
#slide-2 {background-image:url('images/header/header-presentation.jpg'); background-size:cover;}
#slide-3 {background-image:url('images/header/header-realisations.jpg'); background-size:cover;}
#slide-4 {background-image:url('images/header/header-contact.jpg'); background-size:cover;}

body>header>div.width940 {height:380px; position:relative; z-index:100;}
#navigation {height:80px; position:relative; z-index:100; line-height:80px;}
#navigation>p {line-height:80px;}
#navigation>p img {max-width:180px; height:auto;}
#logo:hover {opacity:.65;}

#menu {width:100%; position:fixed; height:0%; overflow:hidden; opacity:0; background:#ae0f0a; top:0; left:0; text-align:center!important; padding:0px; transition:all .65s ease;}
#menu.open {height:100%; overflow:hidden; opacity:1; padding:0 15px; padding-top:80px;}

#menu>li {width:100%; border-bottom:solid 1px rgba(255,255,255,.2);}
#menu>li:first-child {border-top:solid 1px rgba(255,255,255,.2);}
#menu>li>a {display:block; padding:0px; background:none; font:16px 'ttl-b'; color:#fff; height:50px; line-height:50px;}
#menu>li.active>a, #menu>li>a:hover {background:rgba(0,0,0,.05);}

#bt-menu {display:inline-block; width:45px; height:45px; text-align:center; background:#ae0f0a; border:none; position:absolute; z-index:100; right:0px; top:17px;}

body>header>div.width940>h1 {margin-top:30px;}

body>header .bouton {position:absolute; bottom:0; left:15px;}

#txt-home {background:url('images/bandeau-rouge-home.jpg') no-repeat top center #ae0f0a; background-size:cover; height:auto; width:100%;}
#txt-home .col-big {padding-bottom:60px;}
#txt-home .col-big .bouton {position:absolute; bottom:0;}

#bloc-video {height:auto; background:#ebebeb; padding-bottom:20px;}
#bloc-video .col-big a {display:inline-block; width:70px; height:70px; position:absolute; margin:auto; left:0; right:0; top:0; bottom:0; z-index:10;}
#bloc-video .col-big a img {width:100%; height:auto;}
#bloc-video .col-big a ~ img {transition:all .35s ease;}
#bloc-video .col-big a:hover ~ img {opacity:.7;}

#accelerateurs {width:100%; padding:20px 0; background:url('images/bottom-home.jpg') no-repeat center center;}
#accelerateurs a {display:block; width:100%; vertical-align:top; margin:10px 0 30px 0;}
#accelerateurs a .img {position:relative; width:100%; height:40vw; overflow:hidden; background:#ae0f0a;} #accelerateurs a .img img{position:relative; z-index:2;}
#accelerateurs a .img img.picto {position:absolute; margin:auto; top:-20px; left:0; right:0; bottom:0; z-index:1; opacity:0;}
#accelerateurs a p {margin-top:10px; line-height:20px;}

#accelerateurs a:hover .img img {opacity:.2;}
#accelerateurs a:hover .img img.picto {opacity:1; top:0px; z-index:3; transition-delay:.2s;}
#accelerateurs a:hover p, #accelerateurs a:hover p * {color:#ae0f0a;}

body>footer {background:#1e1e1e; padding:20px 0px;} body>footer a {color:#fff;}  body>footer a:hover {color:#9f9f9f;}
body>footer>div>nav {padding-bottom:20px; border-bottom:solid 1px #4b4b4b; margin-bottom:20px; text-align:center;}

body>footer>div>p {width:100%; display:inline-block; vertical-align:bottom; color:#fff;}
body>footer>div>p.right {margin-top:20px;}


/* ---------------------------------------------------------------------------------------------------- PAGE APPUIS BÉTON ------------------------------------------------------------------------------------------*/

body>header.appuis-beton {background:url('images/header/header-presentation.jpg') no-repeat top center; background-size:cover;}

#txt-appuis {background:url('images/bandeau-rouge-appuis-beton.jpg') no-repeat top center #ae0f0a; height:auto; width:100%;}
#txt-appuis>div>* {height:auto; padding:15px 0;}
#txt-appuis .col-big {padding-bottom:60px;}
#txt-appuis .col-big .bouton {position:absolute; bottom:0;}
#txt-appuis .col-small {height:90vw; overflow:hidden;}

#bloc-etapes {background:#ebebeb; padding:1px 0;}
#bloc-etapes>div>section {margin:10px 0px;}

#bottom-appuis {width:100%; padding:20px 0px; background:url('images/bottom-appuis-beton.jpg'); background-size:cover;}
#bottom-appuis>p {line-height:25px;}

/* ---------------------------------------------------------------------------------------------------- PAGE RÉALISATIONS ------------------------------------------------------------------------------------------*/

body>header.realisations {background:url('images/header/header-realisations.jpg') no-repeat top center; background-size:cover;}
#txt-realisations {background:#ebebeb; padding:20px 0;}
#galleria {width:100%; background:#c7c7c7; margin-top:10px;}

.galleria-theme-classic .galleria-image-nav {
    top: 70%;
}
.galleria-theme-classic .galleria-image-nav-left,
.galleria-theme-classic .galleria-image-nav-right {
	left:-10px!important;
}
.galleria-theme-classic .galleria-image-nav-right {
    left:auto!important;
	right:-10px!important;
}


/* ---------------------------------------------------------------------------------------------------- PAGE CONTACT ------------------------------------------------------------------------------------------*/

body>header.contact {background:url('images/header/header-contact.jpg') no-repeat top center; background-size:cover;}
#txt-contact {background:url('images/bandeau-rouge-contact.jpg') no-repeat top center #ae0f0a; padding:20px 0px;}
span.coordonees {display:inline-block; width:100%; border-top:solid 1px #fff; padding-top:20px;}

#formcontact {width:100%; text-align:right;}
#formcontact input[type=text], #formcontact input[type=submit], #formcontact textarea {width:100%; height:40px; background:#fff; color:#3c3c3c; padding:0px 15px; font:14px 'ttl-b'; border:none; margin-bottom:3px; transition:all .35s ease;}
#formcontact textarea {height:160px; padding-top:10px;}
#formcontact input[type=submit] {background:#3c3c3c; color:#fff; width:40%;}
#formcontact input[type=text]:focus, #formcontact input[type=submit]:hover, #formcontact textarea:focus {background:#dddddd;}


.desktop {display:none!important;}