@charset "UTF-8";
/* CSS Document */

* {box-sizing:border-box;}

body {
    font-family: 'Lato', sans-serif;
    font-weight: 400;
	width:auto;
	margin:0;
	padding:0;
	width: 100%;
	height:auto; 
    color: #333333;
    font-size: 15px;
}

a {
    text-decoration: inherit;
    color: inherit;
	transition: .3s;
}
a:hover {
    text-decoration: inherit;
    color: #e0944a;
}
.cb {
    clear: both;
}
.orange {
	color: #e0944a;
}
.blue {
	color: #5bc4e4;
}
/* FONT COLOR / STYLE */
.bold {
    font-weight: 700;
}
img {
    border: none;
    width: 100%;
    display: block;
}
input:focus {
     outline:none;
}
h1 {font-size: 25px;color: #000;letter-spacing: .1rem;}
h2 {font-size: 30px;color: #000;font-family: 'Bebas Neue', sans-serif;}
h3 {}
h4 {}
h5 {}
p {}
.bg-black {
	background-color: #000;
}

header {
	background-color: #f5f3f3;
	padding: 20px;
	position: relative;
	border-bottom: 1px solid #000;
}
header span {
	font-size: 19.5px;
	text-align: center;
}
header span.blue {
	font-size: 18px;
}

.flap {
	background-color: #e0944a;
    padding: 10px 20px;
    display: flex;
    text-transform: uppercase;
    justify-content: center;
    align-items: center;
	font-family: 'Bebas Neue', cursive;
	letter-spacing: .1rem;
	font-size: 19px;
}
.contact {
	color: #fff;
	border: 2px solid #e0944a;
	font-size: 17px;
	margin-top: 30px;
}
.bebas {
	font-family: 'Bebas Neue', cursive;
	letter-spacing: .1rem;
}
.innovation {
	position: fixed;
	right: 0px;
	bottom: 0px;
}
.contact-div {
	position: fixed;
	right: 0px;
	bottom: 150px;
}
.img {
	width: 280px;
    height: 396px;
    display: block;
}
.img-chantier {
	display: flex;
	justify-content: center;
	align-items: center;
	color: #e0944a;
	text-align: center;
	font-size: 22px;
	line-height: 26px;
	font-weight: bold;
}
.img-orange {
	border: #e0944a 2px solid;
}
.img-blue {
	border: #5bc4e4 2px solid;
}
/* HEADER */



@media (max-width: 800px) {
	.contact-div, .innovation {
		position: relative;
		bottom: inherit;
	}
}

.logo {
	position: absolute;
	left: 10%;
	top:0px;
	width: 200px;
}
.block {
	position: absolute;
	left: 10%;
}
.construction {
	height: 260px;
	margin: 2%;
}
.coordonnees {
		margin: 2%;
	}
	.coordonnees img {
		height: 260px;
		width: auto;
	}

/* Smartphone final */
@media all and (max-width:800px) {
	.logo {
		top: 0px;
	}
	.block {
		flex-direction: column;
	}
	.construction {
	height: auto;
	width: 300px;
	}
	.coordonnees img {
		height: auto;
    	width: 300px;
	}
	
}
/* Smartphone final */
@media all and (max-width:600px) {
	.logo {
		left: 0px;
		top: 30px;
		width: 140px;
	}
	.logo img {
		width: 100%;
	}
	.block {
		bottom: 30px;
		left: 0px;
		align-items: center;
		justify-content: center;
		width: 100%;
	}
	.construction {
	
	}
	.coordonnees img {
		
	}
}
