/***** General *****/

.wrap{
    width:940px;
    border-left:10px solid white;
    border-right:10px solid white;
    margin:0 auto;
}

nav,
h2,
h3,
button{
    font-family:"bebasregular";
    font-weight:400;
}

body,
html{
    font-family:"Roboto";
    font-weight: 400;
    font-size:12px;
}

/* Titres */

h2{
    font-size:17px;
}

h3{
    font-size:16px;
}

/* Liens */

a,
a:visited{
    color:#b9b9b9;
    text-decoration:none;
}

a:hover,
a:active{
    color:#e8663c;
    text-decoration:none;
}

/***** Header *****/

header{
    height:100px;
    line-height:100px;
}

header h1 {
    float:left;
    width:30%;  
    position:relative;
    top:10px;
}

/* Menu */

header nav{
    float:right;
    width:70%;
    text-align: right;
}

header nav ul li{
    display:inline-block;
    margin-left: 5%;
    font-size:17px;
}

/* Home */

header nav ul li a.here{
    color:#e8663c;
}

/***** Slider *****/

.slider{
    position:relative;
}

/* Miniatures */

.slider ul{
    margin-top:20px;
    margin-bottom: 30px;
}

.slider ul li {
    display:inline-block;
    padding-right:17px;
}

.slider ul li:last-child{
    padding-right:0px;
}

/* Encart */

.slider section{
    background: rgba(232, 102, 60, 0.8);
    width:400px;
    position:absolute;
    bottom:30%;
    left:5%;
    padding:25px;
    color:white;
    line-height:16px;
}

.slider section h2{
    margin-bottom:15px;
}

/* Image */

.slider h2 img{
    display:block;
    width:940px;
    position:relative;
    top:-2px;
}

/* Bande colorée */

.fondSlider{
     width: 100%;
     height:50px;
     position:absolute;
     background-color:#f3b29d;
}

/***** Articles *****/

.wrap article{
    display:inline-block;
    width:290px;
    margin-right:30px;
    vertical-align: top;
}

.wrap article:last-child{
    margin-right:0px;
}

.wrap article h2{
    color:#e8663c;
    font-size:18px;
    margin-bottom: 20px;
    background-repeat:no-repeat;
    background-position: left top;
    padding-left:65px;
    line-height:25px;
}

/* Icone Titres */

.wrap article:first-child h2{
    background-image:url("../img/engrenage.png");
}

.wrap article:nth-child(2) h2{
    background-image:url("../img/icone-valide.png");
}

.wrap article:nth-child(3) h2{
    background-image:url("../img/icon-connected.png");
}

.wrap article p {
    line-height:18px;
    margin-bottom:20px;
}

.wrap article button {
    background-color:#e8663c;
    color:white;
    font-size:12px;
    padding: 10px 15px 10px 15px;
    border:none;
}

/***** Recent Works *****/

.recent{
    margin-top:50px;
    margin-bottom:50px;
}

/* Titre */

.recent h2{
    color:#e8663c;
    font-size:18px;
    margin-bottom: 20px;
    background-image:url("../img/api.jpg");
    background-repeat:repeat-x;
    background-position: right center;
    line-height:25px;
}

/* Espace blanc */

.recent h2 span{
    background-color:white;
    width:auto;
    padding-right:25px;
}

/* Travaux */

.recent ul li{
    display:inline-block;
    margin-right:17px;
}

.recent ul li:nth-child(4){
    margin-right:0;
}

/* Legende */

.recent ul li figure figcaption{
    padding:10px;
    border:1px solid #dbdbdb;
    position:relative;
    top:-1px;
}

.recent ul li figure figcaption h3{
    color:#b9b9b9;
    font-size:16px;
    line-height:30px;
}

.recent ul li figure figcaption p{
    line-height:18px;
    font-family: "bebasregular";
    color:#e8663c;
}

/***** Footer *****/

footer{
    background-color:#f3b29d;
}

/* Contenu */

footer .fond2{
    background-color:#e8663c;
}

footer .fond2 section{
    display:inline-block;
    width:275px;
    vertical-align: top;
    margin-left:35px;
    margin-top:35px;
    margin-bottom:15px;
    color:white;
}

footer .fond2 section h2{
    font-size:20px;
    margin-bottom:20px;
}

footer .fond2 section p{
    font-size:12px;
    line-height:16px;
    margin-bottom:15px;
}

footer .fond2 section ul li{
    display:inline-block;
    margin-right:5px;
}

/* Liens twitter */

footer .fond2 section ul li .highlight{
    color:#f3b29d;
}

footer .fond2 section p a{
    color:#f3b29d;
}

/* Réseaux sociaux */

footer .fond2 section ul li p{
    margin-bottom:5px;
}

/* Rectification détails margin */

footer .fond2 section p.highlight{
    margin-bottom:15px;
}

footer .fond2 section p.info{
    margin-bottom:0px;
}