*{
	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 {font-size:15px;} 
.font16 {font-size:16px;} 
.font17 {font-size:17px;} 
.font18 {font-size:18px;} 
.font19 {font-size:19px;} 
.font20 {font-size:20px;} 
.font22 {font-size:22px;} 
.font24 {font-size:24px;} 
.font26 {font-size:26px;} 
.font28 {font-size:28px;} 
.font30 {font-size:30px;} 
.font32 {font-size:32px;} 
.font34 {font-size:34px;} 
.font36 {font-size:36px;} 
.font40 {font-size:40px;} 
.font44 {font-size:44px;} 
.font48 {font-size:48px;} 
.font60 {font-size:60px;} 
.font70 {font-size:70px;} 
.font80 {font-size:80px;} 


/* ---------------------------------------------------------------------------------------------------- PARAMETRES GENERAUX ---------------------------------------------------------------------------------------------------- */
 
section,header,footer,figure,article,aside,nav,main {display:block;} 


a,a *,button,button *{transition:all .25s ease-in-out; color:#3c3c3c; text-decoration:none; cursor:pointer; outline:0;} 
a:hover,button:hover {color:#ae0f0a;} 
a img {border:0;} 
img {vertical-align:middle; border:none;}
b, strong {font-family:'ttl-b'; font-weight:normal;}
ul,li {list-style-type:none;} 


p,div {font:14px 'ttl'; color:#3c3c3c; line-height:24px; text-align:left;} 


textarea {overflow:auto; resize:none;} 
input,textarea {outline:0;} 
input[type=submit] {cursor:pointer;} 


h1,h2 {width:100%; font:normal 50px 'ttl-l'; color:#fff; line-height:50px; text-align:left; margin-bottom:20px; letter-spacing:-.04em;}
h2 {font:normal 40px 'ttl-l'; line-height:40px; margin-bottom:25px;}

.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:60px; color:#fff; font:14px 'ttl-b'; line-height:60px; 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 20px;}
.bouton img {margin:0 5px;}

.width960 {margin:auto; width:960px; position:relative; z-index:5;}
.width940 {margin:auto; width:940px; position:relative; z-index:5;}

.col-big, .col-small {width:540px; padding:0px; display:inline-block; vertical-align:top; position:relative;}
.col-small {padding-left:80px; width:400px;} .col-small.left {padding-right:80px; padding-left:0px;}
.column {padding:60px 220px;}

.bloc-bordure {background:none; border:solid 1px #fff; padding:20px;}

.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;} 
.noir {color:#3c3c3c;}
.rouge {color:#ae0f0a;}

.bgblanc {background:#ebebeb;} 
.bgnoir {background:#3c3c3c;}
.bgrouge {background:#ae0f0a;}

/* ---------------------------------------------------------------------------------------------------- PAGE D'ACCUEIL ------------------------------------------------------------------------------------------*/

body {min-width:960px; background:#fff;}
body>header {width:100%; height:550px; position:relative;}

#slider {width:100%; height:550px; position:absolute; z-index:1;}
#slide-1, #slide-2, #slide-3, #slide-4 {background-position:top center; background-repeat:no-repeat; height:560px; width:100%;}
#slide-1 {background-image:url('images/header/header-home.jpg');}
#slide-2 {background-image:url('images/header/header-presentation.jpg');}
#slide-3 {background-image:url('images/header/header-realisations.jpg');}
#slide-4 {background-image:url('images/header/header-contact.jpg');}

body>header>div.width940 {height:550px; position:relative; z-index:2;}
#navigation {height:80px; position:relative; z-index:2; padding-top:40px;}
#navigation>* {display:inline-block; width:240px; vertical-align:top; height:40px; line-height:40px;}
#logo:hover {opacity:.65;}
#menu {width:700px;}

#menu>li {display:inline-block; vertical-align:top; margin:0px 5px;}
#menu>li>a {display:block; padding:0px 25px; border-radius:20px; background:none; font:14px 'ttl-b'; color:#fff; height:40px; line-height:40px;}
#menu>li.active>a, #menu>li>a:hover {background:#ae0f0a;}

body>header>div.width940>h1 {margin-top:160px;}

body>header .bouton {position:absolute; bottom:0; left:0;}

#txt-home {background:url('images/bandeau-rouge-home.jpg') no-repeat top center #ae0f0a; height:520px; width:100%;}
#txt-home>div>* {height:520px; padding-top:50px;}
#txt-home .col-small img {position:absolute; left:-252px; bottom:0;}
#txt-home .col-big .bouton {position:absolute; bottom:0;}

#bloc-video {height:350px; background:#ebebeb; padding-top:45px;}
#bloc-video .col-small{width:280px; padding-right:20px; padding-left:0;}		#bloc-video .col-big{width:660px;}
#bloc-video .col-big a {display:inline-block; width:90px; height:90px; position:absolute; margin:auto; left:0; right:0; top:0; bottom:0; z-index:10;}
#bloc-video .col-big a ~ img {transition:all .35s ease; box-shadow:10px 10px 20px 0px rgba(0,0,0,.4);}
#bloc-video .col-big a:hover ~ img {opacity:.7;}

#accelerateurs {width:100%; padding:110px 0 90px 0; background:url('images/bottom-home.jpg') no-repeat center center;}
#accelerateurs a {display:inline-block; width:300px; vertical-align:top; margin:10px;}
#accelerateurs a .img {position:relative; width:100%; height:200px; 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:20px; 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:50px 0px;} body>footer a {color:#fff;}  body>footer a:hover {color:#9f9f9f;}
body>footer>div>nav {padding-bottom:50px; border-bottom:solid 1px #4b4b4b; margin-bottom:50px;}
body>footer>div>nav>p {display:inline-block; vertical-align:top; width:60%;}
body>footer>div>nav>p.right {width:40%;}

body>footer>div>nav>p a {display:inline-block; vertical-align:top; font:14px 'ttl-b'; margin-right:40px;}

body>footer>div>p {width:350px; display:inline-block; vertical-align:bottom; color:#fff;}
body>footer>div>p.first {width:240px;}

/* ---------------------------------------------------------------------------------------------------- PAGE APPUIS BÉTON ------------------------------------------------------------------------------------------*/

body>header.appuis-beton {background:url('images/header/header-presentation.jpg') no-repeat top center;}

#txt-appuis {background:url('images/bandeau-rouge-appuis-beton.jpg') no-repeat top center #ae0f0a; height:520px; width:100%;}
#txt-appuis>div>* {height:520px; padding-top:50px;}
#txt-appuis .col-small img {position:absolute; right:-124px; bottom:-56px;}
#txt-appuis .col-big .bouton {position:absolute; bottom:0;}

#bloc-etapes {background:#ebebeb; padding:20px 0px;}
#bloc-etapes>div>section {margin:60px 0px;}

#bottom-appuis {width:100%; padding:60px 0px; background:url('images/bottom-appuis-beton.jpg');}
#bottom-appuis>p {line-height:40px;}

/* ---------------------------------------------------------------------------------------------------- PAGE RÉALISATIONS ------------------------------------------------------------------------------------------*/

body>header.realisations {background:url('images/header/header-realisations.jpg') no-repeat top center;}
#txt-realisations {background:#ebebeb; padding-bottom:60px;}
#galleria {width:100%; height:580px; background:#c7c7c7; }


/* ---------------------------------------------------------------------------------------------------- PAGE CONTACT ------------------------------------------------------------------------------------------*/

body>header.contact {background:url('images/header/header-contact.jpg') no-repeat top center;}
#txt-contact {background:url('images/bandeau-rouge-contact.jpg') no-repeat top center #ae0f0a; padding:60px 0px;}
span.coordonees {display:inline-block; width:100%; border-top:solid 1px #fff; padding-top:30px;}

#formcontact {width:100%; text-align:right;}
#formcontact input[type=text], #formcontact input[type=submit], #formcontact textarea {width:100%; height:50px; background:#fff; color:#3c3c3c; padding:0px 20px; 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:50%;}

#formcontact input[type=text]:focus, #formcontact input[type=submit]:hover, #formcontact textarea:focus {background:#dddddd;}


.mobile {display:none!important;}


/* CSS Rupture de stock */

body>header>div.width940>h1 {
    margin-top: 0px;
}

.infos-rupture {
    font-family: 'ttl-b';
    font-weight: normal;
    font-size: 2.5rem;
    margin-top: 150px;
    margin-bottom: 20px;
    color: white;
    line-height: 50px;
}

h1 {
    width: 100%;
    font: normal 1.2rem 'ttl-l';
    color: #fff;
    line-height: 30px;
    text-align: left;
    margin-bottom: 20px;
    letter-spacing: -.04em;
}
