body{
	font-family: 'Roboto', sans-serif;
	font-size:18px
}
a {
    color: #373638;
    text-decoration: none;
}

#header{
	width:100%;
	
	
}
#header .content{
	background:url('../img/bg-header.jpg');
	background-size:cover;
	background-position: center top;
	padding-top:260px;
	padding-left:200px;
	padding-bottom:60px;
	color:#fff;
}

	
#header h1{
	color:#fff;
	font-family: 'Roboto', sans-serif;
	font-weight:700;
	font-size:100px;
	text-align:left;
}


#header h2{
	
	font-weight:700;
	font-size:25px;
}
#header p{
	font-size:22px;
	text-align:left;
	
}
.top-head{
	position:relative;
	background:#fff;
	height:65px;
}
#site-identity{
	position:absolute;
	width:400px;
	background: #fff;
	padding:20px;
}
#site-identity img{
	max-width:100%
}
.container{
	width:100%;
	max-width:1240px;
	padding:0 20px;
}

.main-menu-wrapper{
	margin-left:400px;
	width:calc(100% - 400px);
	background:#fff;
}
#main-menu{
	padding:0;
	margin:0;
	display:table;
	list-style:none;
	width:100%;
}

#main-menu li{
	display:table-cell;
  	padding:20px 10px;
	font-size: 1.6rem;
	
}

section {
	text-align:center;
	padding-top:60px;
	padding-bottom:40px;
}
section#mentions{
	text-align:left;
}
.section-energie{
	background:#eac646;
}



section .block {
	display:flex;
	align-items: center;
	justify-content: center;
	margin-top:40px;
	margin-left:-20px;
	flex-wrap:wrap;
}
 
section .block > * {
	margin-left:20px;
	margin-bottom:20px;
}
 
section.section-energie .block > * {
	max-width:200px;
}



section#engagement   {
	background-color:#f8f8f8;
}

section#engagement .block > * {
	width:calc(100% / 4 - 20px );
	position:relative;
	background-repeat: no-repeat;
	background-size:cover;
}

section#engagement .item-1 {
	background-image:url(../img/img-budget.jpg);
}
section#engagement .item-2 {
	background-image:url(../img/img-respect.jpg);
}
section#engagement .item-3 {
	background-image:url(../img/img-accompagnement.jpg);
}
section#engagement .item-4 {
	background-image:url(../img/img-qualite.jpg);
}

section#engagement .block > div:before {

	background-color: black;
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    opacity: 0.4;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
	
	
}
 
section#engagement .block img {
	position:relative;
	z-index:2;
 	margin:40px auto 20px;
	
}

section#engagement .block p {
	text-align:center;
	color:#eac646;
	max-width:180px;
	margin:auto;
	margin-bottom:40px;
	position:relative;
	z-index:2;
 
}

.wrapper-slider {max-width:900px;padding:40px 0 20px;min-height:380px; margin:20px auto 0px;position:relative;}
.wrapper-slider li{height:380px;margin-left:10px;}
.wrapper-slider li img{max-height:300px; max-width:100%;display:inline-block;}
.wrapper-slider li p{margin-top:20px}


#contact{
	background-color:#eac646;
	padding:0;
}
section#contact .top-wrapper {
	background:url('../img/bg-blk-contact.jpg') no-repeat ;
	background-attachment: cover;
	position:relative;
}
section#contact .top-wrapper .container {
	padding:40px;
	padding-bottom:100px;
	position:relative;
	color:#4f4e50;
	z-index:2;
}
section#contact .top-wrapper:before {
	
	background-color: #eac646;
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    opacity: 0.4;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
	
	
}

section#contact form {
 
	padding:40px;
	
	
}
 

input, select , textarea {
	padding:10px;
	border:2px #fff solid;
	font-size:1.8rem;
	
	width:100%;
		
}

textarea {
	height:200px;
}

input[type='submit']{
	background:#11667e;
	border:2px solid #11667e;
	color:#fff;
	text-transform:uppercase;
}

#send_mail{
	
	margin-bottom:60px;
}
.form-input {
	margin-bottom:20px;
	position:relative;
}
.form-error{position:absolute;right:0px;bottom:-27px;font-size:15px}


#footer{
	background:#5f5e60;
	color:#fff;
	padding:20px;
	text-align:center;
}
#footer a{color:#fff;}
.slicknav_menu {
	display:none;
}

.form-group .required .control-label:after {
  content:"*";color:red;
}
@media screen and (max-width: 1200px) {
	#main-menu li{
		font-size:14px;
	}
	
}
@media screen and (max-width: 1025px) {
	#header .content{
		background:url('../img/bg-header.jpg');
		background-size:cover;
		background-position: center top;
		padding-top:120px;
		padding-left:100px;
		padding-bottom:60px;
		color:#fff;
	}
	#header h1{
		font-size:50px
	}
	#header p{
		font-size:18px
	}
	#site-identity{
		max-width:300px;
		
	
	}
	.main-menu-wrapper{
		margin-left:300px;
		width:calc(100% - 300px);
	}
	#main-menu li{
		font-size:13px;
	}
	
}
@media screen and (max-width:900px) {
	/* #menu is the original menu */
	#main-menu {
		display:none;
	}
	
	.slicknav_menu {
		display:block;
	}
}

@media screen and (max-width: 801px) {
	#header .content{
		padding-left:30px;
	}
	section#engagement .block > * {
		width:calc(100% / 2 - 20px );
	}
}
@media screen and (max-width: 420px) {
	
	section#engagement .block > * {
		width:calc(100% / 1 - 20px );
	}
}
