@charset "utf-8";
@font-face {
  font-family: 'Calligraffiti';
  src: url('Calligraffiti.ttf');
  font-weight: normal;
}
@font-face {
  font-family: 'Quicksand-Regular';
  src: url('Quicksand-Regular.otf');
  font-weight: normal;
}
@font-face {
  font-family: 'Clien_logo';
  src: url('Karstar_Free.ttf');
  font-weight: normal;
}
@font-face {
  font-family: 'AlegreyaSansSC-Light';
  src: url('AlegreyaSansSC-Light.ttf');
  font-weight: normal;
}
html{
	height: 100%;
  display: flex;
  justify-content: center;
  background-color: #FFF;
}
body{
	font-family: 'Quicksand-Regular';
	min-height: 100%;
	position: relative;
	font-size: 1.2rem;
  width: 100%;
  max-width: 2200px;
	color: #3f3f3f;
}
@media screen and (max-width: 530px){
	body{
		font-size: 1rem;
	}
}
#container img{
	border: 1px solid #fff;
}
.marginTop05rem{
	margin-top: 0.5rem;
}
.marginTop1rem{
	margin-top: 1rem;
}
.marginTop15rem{
	margin-top: 1.5rem;
}
.marginBottom2rem{
	margin-bottom: 2rem;
}
#container{
	padding: 0rem 5rem 0rem 5rem;
}
@media screen and (max-width: 875px){
	#container{
	padding: 0rem 1rem 0rem 1rem;
}
}
.ecritureItalique{
	font-family:"AlegreyaSansSC-Light";
	font-size: 30px;
}
.ecritureClien{
	font-family:"Clien_logo";
	font-size: 1rem;
}
.ecritureBlanche{
	color: #FFF;
}
@media screen and (max-width: 1000px){
	.ecritureItalique{
		font-size: 20px;
	}
}
a{
	transition: .25s ease-in-out;
	font-weight: bold;

}
a:hover{
	transition: .25s ease-in-out;
	color: #e5c76e;
	color: #2d5a27;
}
.texteGras{
	font-weight: bold;
}
.textAlignCenter{
	text-align: center;
}
.texteAlignJustify{
	text-align: justify;
}
.texteCenter{
	text-align: center;
}
								/*Header*/
#bandeau1{
	display: flex;
	justify-content: space-between;
	text-align: center;
	background-color: #FFF;
	letter-spacing: 1px;
	border-bottom: 1px solid #2d5a27;
	padding: 0rem 1rem;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	z-index: 2;
}
@media screen and (max-width: 850px){
	#bandeau1{
		flex-direction: column;
		align-items: center;
	}
}
@media screen and (max-width: 500px){
	#bandeau1{
		font-size: 14px;
		letter-spacing: 0px;
	}
}
#bandeau2{
	display: flex;
	margin: 2.3rem 0rem 0rem 2rem;
}
@media screen and (max-width: 1000px){
	#bandeau2{
	display: flex;
	justify-content: end;
}
}
@media screen and (max-width: 850px){
	#bandeau2{
	margin-top: 2rem;
}
}
@media screen and (max-width: 530px){
	#bandeau2{
	margin-top: 2rem;
}
}
@media screen and (max-width: 500px){
	#bandeau2{
	margin: 1.5rem 1rem 0.5rem 0rem;
}
}
.img_Logo_Sociaux{
	width: 30px;
	padding: 0.2rem 0rem;
	margin: 0rem 0.3rem;
}
#dispositionLogoSociaux{
	display: flex;
	justify-content: space-between;
	min-width: 100px;
	margin-left: 2rem;
}
@media screen and (max-width: 850px){
.img_Logo_Sociaux{
	width: 20px;
}
#dispositionLogoSociaux{
	display: flex;
	justify-content: space-between;
	min-width: 50px;
	margin-left: 0rem;
}
}
@media screen and (max-width: 710px){
.display710{
	display: none;
}
}

#logo{
	display: flex;
	align-items: center;
	font-weight: bold;
	font-size: 1.2rem;
}
#logo:hover{
transition: .25s ease-in-out;
color: #FFF;
}
@media screen and (max-width: 1000px){
	#logo{
	font-size: 1.1rem;
	padding: 0.6rem;
}
}
@media screen and (max-width: 500px){
	#logo{
	font-size: 0.8rem;
	padding: 0.2rem;
}
}
@media screen and (max-width: 450px){
	#logo{
	padding: 0.2rem;
}
}
#lienLogo{
	display: flex;
}
#lienLogo:hover{
	/*background-color: #2d5a27;*/
}
#logo img{
	padding: 0.5rem;
	width: 150px;
}
@media screen and (max-width: 452px){
	#logo img{
width: 110px;
}
#bandeau2 a{
	display: flex;
	align-items: center;
	margin-left: 0.5rem;
}
}
.containerClien{
	max-width: 400px;
	margin-left: 6rem;
	text-align: center;
}
@media screen and (max-width: 1270px){
.containerClien{
	margin-left: 2rem;
}	
}
@media screen and (max-width: 1000px){
.containerClien{
	height: 100%;
	text-align: center;
	margin-left: 2rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
}
@media screen and (max-width: 700px){
.containerClien{
	margin-right: 0.3rem;
}	
}
.nomFClien{
	width: 100%;
	font-size: 5rem;
	letter-spacing: 0.5rem;
	line-height: 105px;
}
@media screen and (max-width: 1000px){
	.nomFClien{
		line-height: 72px;
	}
}
@media screen and (max-width: 452px){
	.nomFClien{
		line-height: 48px;
	}
}
@media screen and (max-width: 740px){
.nomFClien{
	font-size: 2.8rem;
	letter-spacing: 0.3rem;
}
}
@media screen and (max-width: 390px){
.nomFClien{
	font-size: 2.6rem;
  letter-spacing: 0.2rem;
}	
}
.phrasenomFClien{
	width: 100%;
	font-size: 1rem;
	margin-top: -1.7rem;
}
@media screen and (max-width: 1000px){
	.phrasenomFClien{
		margin-top: -0.7rem;
	}
}
@media screen and (max-width: 820px){
	.phrasenomFClien{
		font-size: 0.8rem;
	}
}
@media screen and (max-width: 540px){
	.phrasenomFClien{
		font-size: 0.6rem;
	}
}
@media screen and (max-width: 390px){
.phrasenomFClien{
	font-size: 0.6rem;
}
}
#phraseSpecialiste{
	font-size: 1rem;
	background-color: #C0C0C0;
	color: #2d5a27;
	border-radius: 10px;
}

@media screen and (max-width: 700px){
#phraseSpecialiste{
	font-size: 0.7rem;
}
}
@media screen and (max-width: 390px){
#phraseSpecialiste{
	font-size: 0.5rem;
}
}
#bandeauHeader{
	background-color: #FFF;
	width: 100%;
	border-bottom: 1px solid #2d5a27;
	border-top: 1px solid #2d5a27;
}
#menu{
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	width: 100%;
	text-align: right;
}
@media screen and (max-width: 1000px){
	#menu{
		justify-content: flex-start;
	}
}
#menu ul{
	width: 100%;
	display: flex;
  justify-content: flex-end;
}
#menu ul li{
	display: inline;
	padding: 1rem;
	font-weight: bold;
	transition: .25s ease-in-out;
}
#menu ul li:hover{
	transition: .25s ease-in-out;
}
#menu ul li a{
	padding: 0.1rem 0.3rem 0.1rem 0.3rem;
	border-radius: 7px;
}
@media screen and (max-width: 1000px) {
#menu ul{
	display: none;
}}
.menu-deroulant > a:after{
  content: '❯';
  font-size: 15px;
  margin-left: 7px;
  display: inline-block;
}
.menu-deroulant:hover > a:after{
  animation: rotationFleche 0.2s linear forwards;
}
@keyframes rotationFleche {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(45deg);
  }
  100%{
    transform: rotate(90deg);
  }
}
.sous-menu {
	position: absolute;
	justify-content: flex-start;
  flex-direction: column;
  /*margin-top: var(--hauteur-menu);*/
  max-width: 330px;
  text-align: left;
  overflow: hidden;
  max-height: 0;
  border-radius: 2px;
  background-color: #fafafa;
  z-index: 3;
}
.menu-deroulant:hover > .sous-menu {
  animation: apparitionSousMenu 1s forwards;
}
@keyframes apparitionSousMenu {
  0% {
    box-shadow: 0px 3px 3px 1px rgba(0,0,0,0);
    border-top: 3px solid #FFF;
  }
  30% {
    box-shadow: 0px 3px 3px 1px rgba(0,0,0,0.3);
  }
  100% {
    max-height: 50em;
    border-top: 3px solid #FFF;
    box-shadow: 0px 3px 3px 1px rgba(0,0,0,0.3);
  }
}
.sous-menu > li:hover {
  background-color: #fafafa;
}
.sous-menu > li > a {
  align-items: center;
  display: flex;
  height: 50px;
  padding-left: 20px;
  width: 100%;
}
.ecritureBlanche{
	color: #FFF;
}
.ecritureOrange{
	color: #bd3233ff;
}

								/*FIN Header*/
								/*Index*/
#texteBienvenu{
	margin-bottom: 1rem;
	text-align: justify;
}
@media screen and (max-width : 1430px){
#texteBienvenu{
	text-align: justify;
}	
}
#messageBienvenu{
	margin-top: 3rem;
	text-align: center;
}
@media screen and (max-width: 1000px){
	#messageBienvenu{
	margin-top: 1rem;
	text-align: center;
}
}
@media screen and (max-width: 400px){
	#messageBienvenu{
	margin-bottom: 1rem;
	font-size: 1rem;
}
}
#cadrePhoto{
	display: flex;
	width: 80%;
	padding: 3rem 0rem 2rem 0rem;
	margin: auto;
}							
@media screen and (min-width: 1500px){
#cadrePhoto{
	display: flex;
	width: 70%;
	padding: 3rem 0rem 2rem 0rem;
	margin: auto;
}
}
@media screen and (max-width: 1000px){
#cadrePhoto{
	display: flex;
	width: 80%;
	padding: 0rem 0rem 2rem 0rem;
	margin: auto;
}
}
@media screen and (max-width: 500px){
#cadrePhoto{
	width: 100%;
}
}
#cadrePhoto img{
	border: 1px solid #dbdbdb;
	padding: 1px;
}
#cadreColonne1{
	font-size: 25px;
}
.ecriture2Cadre{
	font-size: 3.5rem;
	margin-bottom: 1rem;
	background: linear-gradient(to top, #fafafa 10%, #65a75c 30%, transparent 60%);
	z-index: 1;
	position: relative;
	top: -15px
}
@media screen and (max-width: 1000px){
	.ecriture2Cadre{
	font-size: 2rem;
}
}
@media screen and (max-width: 560px){
	.ecriture2Cadre{
	font-size: 1.7rem;
}
}
@media screen and (max-width: 500px){
	.ecriture2Cadre{
	margin-bottom: 0rem;
}
}
.ecriture2CadreNosServices{
	text-align: center;
	max-width: 42rem;
	padding: 0rem 1rem;
	font-size: 3.5rem;
	background: linear-gradient(to top, #fafafa 10%, #65a75c 30%, transparent 60%);
	position: relative;
	top: -15px
}
@media screen and (max-width: 1000px){
	.ecriture2CadreNosServices{
		font-size: 2rem;
	}
}
#texteServices{
	margin-bottom: 2rem;
}
#cadrePhotoColonne1{
	flex: 4;
	display: flex;
	flex-direction: column;
	align-items: center;
}
@media screen and (max-width: 1000px){
#cadrePhotoColonne1{
	justify-content: center;
}
}
#cadrePhotoColonne2{
	flex: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
}
#cadrePhotoColonne3{
	flex: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
}
#texteEntreprise{
	margin-bottom: 4rem;
	text-align: center;
}
@media screen and (min-width: 1500px){
#texteEntreprise{
	margin-bottom: 4rem;
}
}
@media screen and (max-width: 1000px){
#texteEntreprise{
	margin-bottom: 4rem;
}
}
#cadrePhotoColonne3 div{
	margin-top: 5rem;
}
@media screen and (max-width: 500px){
	#cadrePhotoColonne3 div{
		margin-top: 2rem;
	}
}
#cadreColonne1{
	display: flex;
	flex-direction: column;
}
#cadreColonne1 div{
	text-align: center;
}
	#displayP1000{
		display: none;
}
@media screen and (max-width: 500px){
	#displayP1000{
		display: flex;
		flex-direction: column;
		width: 100%;
		align-items: start;

}}
#image_garanties{
	padding: 0.3rem 0.3rem;
}
div img#image_garanties{
	border: 1px solid #C0C0C0;
}
@media screen and (max-width: 750px){
	div img#image_garanties{
	width: 95%;
}
}
#displaynoneM1000{
	display: flex;
	flex-direction: column;
}
@media screen and (max-width: 500px){
	#displaynoneM1000{
	display: none;
}
}
.margeImagesCadre{
	margin: 0.5rem;
}
.separateur{
	height: 10px;
	width: 100px;
	background-color: #2d5a27;
	margin-bottom: 0.5rem;
}
#cadreNosServices{
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 1rem 0rem 1rem 0rem;
	background-color: #2d5a27;
	text-align: center;
	margin-bottom: 7rem;
	}
	@media screen and (max-width: 1000px){
		#cadreNosServices{
			margin-bottom: 4rem;
		}
	}
#cadreNosServices div p{
	text-align: center;
	padding: 0rem 5rem 0rem 5rem;
}

@media screen and (max-width: 1000px){
#cadreNosServices div p{
	padding: 0rem 1rem 0rem 1rem;
}
}
#cadreIntervention{
	margin-bottom: 5rem;
}
	@media screen and (max-width: 1000px){
		#cadreIntervention{
			margin-bottom: 4rem;
		}
	}
#etapesInterventions{
display: flex;
}
@media screen and (max-width: 750px){
	#etapesInterventions{
		flex-direction: column;
	}
}
.etapes{
	flex: 1;
	display: flex;
	flex-direction: column;
}
@media screen and (max-width: 750px){
	.etapes{
		flex-direction:	row;
}
}
.numeroEtape{
	font-size: 3.5rem;
	color: #2d5a27;
}
@media screen and (max-width: 700px){
	.numeroEtape{
	font-size: 2rem;
}
}
.descriptionEtapes{
	font-size: 1rem;
	font-weight: 600;
}
@media screen and (max-width: 975px){
	.descriptionEtapes{
		font-size: 14px;
}
}
@media screen and (max-width: 750px){
	.descriptionEtapes{
		display: flex;
		align-items: center;
		font-size: 1rem;
}
}
@media screen and (max-width: 700px){
	.descriptionEtapes{
	font-weight: 300;
	font-size: 1rem;
}
}
.separateur2{
	margin: 1rem 0rem 1rem 0rem;
	height: 2px;
	width: 50px;
	background-color: #000;
	margin-bottom: 0.5rem;
}
@media screen and (max-width: 750px){
	.separateur2{
		display: none;
	}
}
.cadrePrestations{
	padding: 1rem 0rem 1rem 0rem;
	margin-bottom: 1rem;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	background-color: #88b382;
}

.cadrePrestations div img{
width: 70%;
margin: 0rem auto 1rem auto;
padding: 0.3rem 0.3rem;
border-radius: 10px;
}
@media screen and (max-width: 1000px){
	.cadrePrestations div img{
width: 70%;
margin: 0rem auto 1rem auto;
}
}
.ecriture2CadreNotreEntreprise{
	text-align: center;
	max-width: 42rem;
	padding: 0rem 1rem;
	font-size: 3.5rem;
	margin-bottom: 1rem;
	background: linear-gradient(to top, #65a75c 10%, #2d5a27 30%, transparent 60%);
	position: relative;
	color: #fafafa;
	top: -15px
}
@media screen and (max-width: 1000px){
	.ecriture2CadreNotreEntreprise{
		font-size: 2rem;
	}
}
.imageTexteEntreprise{
	width: 100%;
	margin: 0rem 0rem 0rem 0rem;
	display: flex;
	flex-direction: column;
	align-items: center;
}
	@media screen and (max-width: 1000px){
		.imageTexteEntreprise{
			margin-bottom: 0rem;
		}
	}
.paragrapheEntreprise{
	width: 80%;
	margin: auto;
	text-align: justify;
	margin-bottom: 0rem;
}
@media screen and (max-width: 1200px){
.paragrapheEntreprise{
		width: 90%;
		text-align: justify;
}
}
@media screen and (max-width: 600px){
.paragrapheEntreprise{
		width: 100%;
		text-align: justify;
}
}

.paragrapheEntreprise a{
	margin-top: 0.2rem;
}
.paddingParagrapheEntreprise{
	padding: 0rem 0.3rem;
}
.lienDetailsEntreprise{
	width: 100%;
	text-align: center;
	margin-top: 1rem;
	margin-bottom: 5rem;
}
@media screen and (max-width: 800px){
	.lienDetailsEntreprise{
	margin-bottom: 4rem;
}
}
.lienDetailsEntreprise a{
	background-color: #2d5a27;
	padding: 0.3rem 1rem 0.3rem 1rem;
	border-radius: 7px;
	color: #fafafa;
	border: 1px solid #fff;
}
.lienDetailsEntreprise a:hover{
	background-color: #969696;
	padding: 0.3rem 1rem 0.3rem 1rem;
	border-radius: 7px;
	color: #FFF;
}
div#lienNosServices.lienDetailsEntreprise{
	margin-bottom: 1rem;
}
#engineering_management{
	margin-bottom: 5rem;
}
.imagePrestations{
	height: 7.4rem;
  background-color: #2d5a27;
  display: flex;
  gap: 10px;
  padding: 1rem;
  overflow: auto;
}
div.imagePrestations img{
	margin-bottom: 0rem;
	width: 7.4rem;
	padding: 0rem;
	border: none;
}
@media screen and (max-width: 500px){
	div.imagePrestations img{
		width: 5.9rem;
	}
}
.imagePaiements{
	height: 7.4rem;
  background-color: #2d5a27;
  display: flex;
  padding: 1rem;
  overflow: auto;
}
div.imagePaiements img{
	margin-right: 1rem;
	width: 7.4rem;
}
@media screen and (max-width: 500px){
	div.imagePaiements img{
		width: 5.9rem;
	}
}
																				/*FIN Index*/
                       							   /*formulaire contact*/
.formulaire_contact{
  flex:4;
  font-size: 1.2rem;
  padding: 1rem 0rem 1rem 0rem;
  display: flex;
	justify-content: end;
}
@media screen and (max-width: 1250px){
	.formulaire_contact{
		justify-content: center;
	}
}
.formulaire_contact form{
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 580px){
.formulaire_contact form{
  font-size: 1rem;
}}
.formulaire_contact form div{
  margin-top: 1rem;
}
.autreContact{
flex:4;
font-size: 1.3rem;
margin-bottom: 1rem;
display: flex;
flex-direction: column;
justify-content: center;
padding-left: 1rem;
text-align: center;
}
.autreContact p{
  margin-bottom: 1rem;
}
@media screen and (max-width: 500px){
  .autreContact p{
font-size: 1rem;
}
}
.inputedit{
  width: 40rem;
  padding:0.5rem;
  border-width: 1px;
  border-color: #1d1d1d;
  border-style: solid;
  background-color: #e1e1e1;
  color:#2d5a27;
}
@media screen and (max-width: 1440px){
.inputedit{
  width: 35rem;
}}
@media screen and (max-width: 1000px){
.inputedit{
 width: 25rem;
}}

@media screen and (max-width: 600px){
.inputedit{
  width: 25rem;
}}
@media screen and (max-width: 500px){
.inputedit{
  width: 16rem;
}}
@media screen and (max-width: 355px){
.inputedit{
  width: 14rem;
}}
#valider{
  cursor: pointer;
  transition: .25s ease-in-out;
  color: #fafafa;
  margin-top: 1.5rem;
  padding:0rem 0.7rem 0rem 0.7rem;
  height: 2rem;
  font-size: 1.3rem;
  font-weight: bold;
  background-color: #C0C0C0;
  border: 1px solid #fafafa;
}
@media screen and (max-width: 480px){
#valider{
  font-size: 1.1rem;
}}
#valider:hover{
  transition: .25s ease-in-out;
  color: #C0C0C0;;
  background-color: #fafafa;
  border: 1px solid #C0C0C0;
}
#textareamessage{
  padding:0.5rem;
  color:#2d5a27;
  min-height: 10rem;
}

.formulaire_contact form ul li{
  text-align: center;
}
.asterisque{
  color:#c50303;
}
.error{
  color:#ec5f66;
}
#titre_form{
		font-family: "AlegreyaSansSC-Light";
		font-size: 30px;
}
@media screen and (max-width: 1000px){
#titre_form{
  font-size: 1.2rem;
}}
#agencementContact{
	color: #fafafa;
	display: flex;
	justify-content: space-between;
	padding: 1rem 2rem 1rem 2rem;
	margin-bottom: 1rem;
	background-color: #88b382;
}
@media screen and (max-width: 1250px){
	#agencementContact{
		flex-direction: column;
		justify-content: center;
	}
}
#coordonees{
	display: flex;
	flex-direction: column;
}
@media screen and (max-width: 1050px){
	#coordonees{
font-size: 13px;
}
}
#coordonees span{
		margin:	1rem 1rem 0rem 0rem;
}
#coordonees iframe{
	padding: 1rem 1rem 1rem 0rem ;
}
@media screen and (max-width: 1360px){
	#coordonees iframe{
		width: 30rem;
}
}
@media screen and (max-width: 1000px){
	#mapTel iframe{
		width: 30rem;
}
}
@media screen and (max-width: 600px){
	#mapTel iframe{
		width: 25rem;
}
}
@media screen and (max-width: 500px){
	#mapTel iframe{
		width: 20rem;
}
}
@media screen and (max-width: 400px){
	#mapTel iframe{
		width: 17rem;
}
}
@media screen and (max-width: 370px){
	#mapTel iframe{
		width: 15rem;
}
}
@media screen and (max-width: 1250px){
#coordonees iframe{
display: none;
}
}
#mapTel{
	display: none;
	margin: auto;
}
@media screen and (max-width: 1250px){
#mapTel{
	margin-bottom: 1rem;
display: block;
}
}
#contact{
	margin-top: 3rem;
}
                          /*fin formulaire contact*/
                          /*Footer*/
#bandeauFooter{
	border-top: 1px solid #fff;
	padding: 0.3rem 1rem 0.3rem 1rem;
	font-size: 0.8rem;
	width: 100%;
}
#positionElemFooter{
	display: flex;
	justify-content: space-between;
}
.droitsreserves{
	padding-left: 1rem;
}
.signature{
	padding-left: 1rem;	
}
      								                    /*fin Footer*/

/*Test*/
.side-bar{
 background: #1b1a1b;
 backdrop-filter: blur(15px);
 width: 250px;
 height: 100vh;
 position: fixed;
 top: 0;
 left: -250px;
 overflow-y: auto;
 transition: 0.6s ease;
 transition-property: left;
 z-index: 99;
}
.side-bar::-webkit-scrollbar {
  width: 0px;
}
.side-bar.active{
 left: 0;
}

.side-bar .menu{
 width: 100%;
 margin-top: 50px;
}

.side-bar .menu .item{
 position: relative;
 cursor: pointer;
}

.side-bar .menu .item a{
 color: #fff;
 font-size: 14px;
 text-decoration: none;
 display: block;
 padding: 5px 10px;
 line-height: 50px;
}

.side-bar .menu .item a:hover{
 background: #33363a;
 transition: 0.3s ease;
}

.side-bar .menu .item i{
 margin-right: 15px;
}

.side-bar .menu .item a .dropdown{
 position: absolute;
 right: 0;
 margin: 20px;
 transition: 0.3s ease;
}

.side-bar .menu .item .sub-menu{
 background: #262627;
 display: none;
}

.side-bar .menu .item .sub-menu a{
 padding-left: 20px;
}

.rotate{
 transform: rotate(90deg);
}

.close-btn{
 position: absolute;
 color: #fff;

 font-size: 23px;
 right:  0px;
 margin: 15px;
 cursor: pointer;
}

.menu-btn{
	position: fixed;
	color: #C0C0C0;
	font-size: 35px;
	/*margin: 25px;*/
	cursor: pointer;
	top: 35px;
	left: 6px;
	z-index: 2;
}
@media screen and (min-width: 1001px){
  .menu-btn{  
  	display: none;
  }
}
@media screen and (max-width: 450px){
  .menu-btn{  
  	top: 10px;
  }
}
/*Test*/




                                          /*page entreprise */
.agencementPageEntreprise{
	display: flex;
	justify-content: space-between;
	width: 100%;
	margin: 6rem 0rem 0rem 0rem;
}
.doubleCadre{
	display: flex;
	width: 100%;
	margin-bottom: 4rem;
}
@media screen and (max-width: 1000px){
	.doubleCadre{
			flex-direction: column;
	}
}
.cadresPageEntreprise{
	display: flex;
	align-items: center;
	flex: 1;
}
@media screen and (max-width: 1000px){
	.cadresPageEntreprise{
		justify-content: center;
	}
}
.imgCadresPageEntreprise{
	display: flex;
	align-items: center;
	flex: 1;
	justify-content: center;
}
@media screen and (max-width: 1000px){
	.imgCadresPageEntreprise{
		margin-top: 1rem;
		justify-content: center;
	}
}
.imgCadresPageEntreprise img{
	width: 80%;
}
#enteteEquipe{
	margin-bottom: 8rem;
}
@media screen and (max-width: 1000px){
	#enteteEquipe{
	margin-bottom: 5rem;
}
}
.textePageEntreprise{
	text-align: justify;
}
.textePageEntreprise p{
	margin-top: 1rem;
}
.textePageEntrepriseSectionEquipe{
	margin-top: 1rem;
	width: 95%;
	text-align: justify;
}
.textePageEntrepriseSectionEquipe p{
	margin-top: 1rem;
}
#divPhotoProfil{
	position: absolute;
	max-width: 130px;
	margin-left: 6rem;
	left: 0;
}
@media screen and (max-width: 875px){
	#divPhotoProfil {
		margin-left: 2rem;
	}
}
@media screen and (max-width: 550px){
	#divPhotoProfil{
	right: 0;
	left: auto;
	margin-right: 2rem;
}
}
@media screen and (max-width: 1000px){
	#divPhotoProfil img{
			max-width: 90px;
	}
}
.maitreOeuvre{
	font-size: 1rem;
}
@media screen and (max-width: 900px){
	.maitreOeuvre{
	font-size: 14px;
}
}

#notreEquipe{
	position: absolute;
	right: 0;
	margin: 0rem 43% 0rem auto;
}
@media screen and (max-width: 550px){
	#notreEquipe{
	margin-left: 2rem;
	left: 0;
	right: auto;
}
}
#cadreEntreprisePageEntreprise{
	padding: 1rem 0rem 1rem 0rem;
	margin-bottom: 1rem;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	background-color: #2d5a27;
}

                                          /*FIN page entreprise */
                                          /*réalisations */
.conteneurRealisations{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	padding: 0rem 8rem 3rem 8rem;
}
@media screen and (max-width: 1000px){
	.conteneurRealisations{
	padding: 0rem 3rem 3rem 3rem;
}
}
@media screen and (max-width: 1000px){
	.conteneurRealisations{
	padding: 0rem 1rem 3rem 1rem;
}
}
.conteneurRealisations a{
	width: 32.5%;
	margin-top: 0.8rem;
	display: flex;
	align-items: center;
	background-color: #000;
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	border-color: #fff;
	border-style: solid;
	border-width: 1px;
}
.conteneurRealisations a img{
	width: 100%;
}
.conteneurRealisations a:hover {
	-webkit-transform: scale(1.035);
	transform: scale(1.035);
}
.titrePageRealisations{
	margin-top: 2rem;
}
@media screen and (max-width: 800px){
	.titrePageRealisations{
	margin-top: 1rem;
}
}
@media screen and (max-width: 1000px){
.titrePageRealisations div.ecriture2CadreNosServices{
	max-width: 15rem;
}}

html body div#container div.conteneurRealisations a.sansBackgroundColor{
	background-color: #fff;
}
.conteneurRealisations div img{
	width: 100%;
}
html body div#container div.conteneurRealisations div.sansBackgroundColor{
	width: 32.5%;
	margin-top: 0.8rem;
	display: flex;
	align-items: center;
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
border: none;
}
html body div#container div.conteneurRealisations div.sansBackgroundColor img{
border: none;
}
.H2Realisations{
	text-align: center;
	margin-top: 2rem;
	margin-bottom: 0rem;
}
.sousmenu{
width: 100%;
margin-top: 1rem;
}
.sousmenu ul{
	display: flex;
	justify-content: center;
	padding: 0rem 1rem 0rem 1rem;
}
.sousmenu li a{
	padding: 0rem 0.5rem 0rem 0.5rem;
	margin: 0rem 0.3rem 0rem 0.3rem;
  border-radius: 7px;
}
div#container div.ancreTop img{
	position:	fixed;
  bottom: 50%;
  left: 3px;
  width: 50px;
  z-index: 1;
  border: none;
}
@media screen and (max-width: 501px){
	.ancreTop{
		display: none;
	}
}

.titreRealisations{
	width: 100%;
	display: flex;
	justify-content: center;
	margin-top: 2rem;
	font-size: 2rem;
}
@media screen and (max-width: 450px){
.titreRealisations{
	font-size: 1.3rem;
}	
}
.titreRealisations h2{
	padding: 0rem 1rem;
	background: linear-gradient(to top, #fafafa 10%, #2d5a27 30%, transparent 60%);
}
                                          /*FIN page réalisations */
                                          /*page mentions légales */
.pieddepage{
	position: absolute;
	bottom: 0;
}
#messageRecu{
	margin-top: 1rem;
	width: 100%;
	text-align: center;
	font-size: 1.5rem;
}
@media screen and (max-width: 600px){
	#messageRecu{
	font-size: 1.1rem;
}
}
                                          /*FIN page mention légales */