@charset "utf-8";

/*

	--colorBeige: rgb(223, 207, 185);
	--colorBleu: rgb(60, 85, 100);
	--colorGris: rgb(100, 100, 100);
	--colorTxt: rgb(0, 0, 0);
	--colorWhite: white;
	--ecartDixPx: 10px;

*/

body {
	max-width: 1700px;
	margin: auto;
}

#AD_loader {
	position: relative;
	display: flex;
	width: 100%;
	height: 100vh;
	z-index: 999999;
	flex-direction: column;
	align-items: center;
	justify-content: space-around;
	align-content: center;
}


#AD_loader .div1 {
	max-width: 70vmin;
	width: 20em;
	/*15.5em*/
	max-height: 75vmin;
	height: 22em;
	/*18em*/
	margin: auto;
	overflow: hidden;
	/*	border: 1px solid red;*/
}

#AD_loader .div1 video {
	width: auto;
	height: 100%;
	transform: translateX(calc(((min(20em, 70vmin)) / 2) - 50%));
	/* display: none; */
}

#AD_loader .div1 img {
	background: red;
}

.AD_loader_bandes {
	position: absolute;
	display: flex;
	width: 100%;
	height: 100vh;
	z-index: 999999;
	background: linear-gradient(135deg, rgba(223, 207, 185, 1) 25%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0) 75%, rgba(223, 207, 185, 1) 75%);
	flex-direction: column;
	align-items: center;
	justify-content: space-around;
	align-content: center;
}



/*******************************************************/
/***********   section1   *************/
/*******************************************************/
#container {}


#section1_Presentation {
	position: relative;
	width: 100%;
	height: auto;
}

.parallaxContent_A {
	position: relative;
	width: 100%;
	height: 200vmin;
}

.parallaxContent_A:before {
	content: "";
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	z-index: -99;
	background: var(--colorBeige);
}

.layer1_A {
	position: absolute;
	width: 100%;
	height: 200vmin;
	z-index: -9;
}

.layer1_A div {
	position: sticky;
	top: calc(50vh - 50vmin);
	width: 100%;
	margin: auto;
	height: 100vmin;
}

.layer1_A img {
	object-fit: cover;
	object-position: 80% 70%;
	height: 100vmin;
}

.layer2_A {
	position: relative;
	width: 100%;
	height: 100vmin;
	background-color: rgba(255, 255, 255, 0.6);
}

.layer2_A div {
	position: sticky;
	/* display: block; */
	display: flex;
	align-items: center;
	top: calc(100vh - 17vh);
	padding: 1em 7vw;
	height: 17vh;
	color: white;
	background-color: rgba(60, 85, 100, 0.9);
	z-index: 9;
}

.layer2_A h1 {
	width: 100%;
	margin: auto;
	font-size: 1.3em;
	font-family: "adano_semi-bold";
}

/****************************************/
/****************************************/


.sectionTitre {
	padding: 1.8em 1em;
	font-size: 1.6em;
	color: var(--colorBeige);
	background-color: var(--colorBleu);
}

.blocPresentation {
	position: relative;
	width: 100%;
	padding-bottom: 6em;
}

.blocPresentationTitre {
	width: 100%;
	background: var(--colorBeige);
	padding: 5em 1em 1em;
	line-height: 1em;
}

.blocPresentationTitre h1,
.blocPresentationTitre h2 {
	width: 96%;
	margin: auto;
	font-family: "Montserrat";
	font-weight: 400;
	text-transform: inherit;
	font-size: 1.3em;
	line-height: 1em;
	text-align: center;
}

.blocPresentationTitre h2 {
	font-size: 1.35em;
	/* line-height: 1em; */
}

.blocPresentationTitre h1 b {
	display: inline-block;
	text-transform: uppercase;
	font-size: 1.5em;
    line-height: 0.9em;
	font-weight: 500;
	font-family: "Luxerie";
	padding: 0.4em 0;
}

.blocPresentationTitre hr {
	margin: 5em auto;
	width: 30%;
	max-width: 15em;
	border: 1px solid black;
}


/****************************************/

/*
https://vue-grid-generator.netlify.app/

{"areas":[["blocList","blocList","blocList","NOP3","NOP3","NOP3"],["blocList","blocList","blocList","NOP3","NOP3","NOP3"],["NOP1","NOP1","NOP1","blocChiffres","blocChiffres","blocChiffres"],["NOP2","NOP2","NOP2","blocChiffres","blocChiffres","blocChiffres"],["NOP2","NOP2","NOP2","blocChiffres","blocChiffres","blocChiffres"]],"columns":["1fr","1fr","1fr","1fr","1fr","1fr"],"rows":["1fr","1fr","1fr","1fr","1fr"],"gridWidth":"100%","gridHeight":"100%"}

*/

.presentationGrid {
	display: grid;
	width: 44em;
	max-width: 100%;
	height: 100%;
	margin: -2px auto;
	grid-template-areas: "blocList blocList blocList NOP3 NOP3 NOP3"
		"blocList blocList blocList NOP3 NOP3 NOP3"
		"NOP1 NOP1 NOP1 blocChiffres blocChiffres blocChiffres"
		"NOP2 NOP2 NOP2 blocChiffres blocChiffres blocChiffres"
		"NOP2 NOP2 NOP2 blocChiffres blocChiffres blocChiffres";
	grid-template-columns: 0.5fr 1fr 1fr 1fr 1fr 0.5fr;
	grid-template-rows: 1fr 1fr 0.5fr 1fr 1fr;
}

.presentationGrid:before {
	content: "";
	display: block;
	grid-column: 1/7;
	grid-row: 1/5;
	z-index: -1;
	width: 100%;
	height: 35em;
	background: var(--colorBeige);
	-webkit-clip-path: polygon(0 0, 100% 0, 100% 0%, 0 100%);
	clip-path: polygon(0 0, 100% 0, 100% 0%, 0 100%);
}

.presentationGrid:after {
	content: "";
	display: block;
	position: absolute;
	z-index: -1;
	left: 0;
	width: calc(50% - 21.95em);
	height: 35em;
	background: var(--colorBeige);
	border-radius: 2px;
}

.blocList {
	grid-area: blocList;
	grid-column: 2/6;
	padding: 1em;
}

.blocList ul {
	font-weight: 600;
	font-size: 0.9em;
	line-height: 1.5em;
	text-align: left;
	text-transform: uppercase;
}

.blocList li {
	list-style: outside;
	font-size: 0.8em;
	line-height: 1.5em;
	font-weight: 400;
	padding-bottom: 0.5em;
	margin-left: 1.5em;
}

.blocChiffres {
	grid-area: blocChiffres;
	text-align: left;
	padding: 2em 0 0 2em;
}


.blocChiffres h2 {
	padding-bottom: 1em;
	text-transform: inherit;
	font-size: 1.8em;
	line-height: 1.1em;
	text-align: left;
	word-spacing: -0.15em;
}

.blocChiffres ul {
	font-size: 0.9em;
}

.blocChiffres li {
	padding-bottom: 1.5em;
}

.blocChiffres li span {
	font-size: 2.5em;
	font-weight: 700;
	line-height: 0.7em;
}

.blocChiffres li span span {
	font-size: 0.5em;
}



/*******************************************************/
/***********   section2   *************/
/*******************************************************/

#section2_Activites {
	position: relative;
	width: 100%;
}


/*
https://vue-grid-generator.netlify.app/

{"areas":[["NOP1","NOP1","logoConception","logoConception","NOP3","NOP3"],["texte1","texte1","texte1","texte1","texte1","texte1"],["texte2","texte2","texte2","texte2","texte2","texte2"],["texte3","texte3","texte3","texte3","texte3","texte3"],["NOP2","NOP2","logoRenovation","logoRenovation","NOP4","NOP4"]],"columns":["1fr","1fr","2fr","2fr","1fr","1fr"],"rows":["1.5fr","1fr","1.8fr","1fr","1.5fr"],"gridWidth":"100%","gridHeight":"100%"}

*/

.activitesGrid {
	position: relative;
	display: grid;
	width: 32em;
	max-width: 100vw;
	height: 32em;
	max-height: 140vmin;
	margin: 10vh auto;
	padding: 0.5em;
	text-align: center;
	align-content: center;
	justify-content: center;
	align-items: center;
	justify-items: center;
	font-size: 1.2em;
	text-transform: inherit;
	grid-template-areas:
		"NOP1 NOP1 logoConception logoConception NOP3 NOP3"
		"texte1 texte1 texte1 texte1 texte1 texte1"
		"texte2 texte2 texte2 texte2 texte2 texte2"
		"texte3 texte3 texte3 texte3 texte3 texte3"
		"NOP2 NOP2 logoRenovation logoRenovation NOP4 NOP4";
	grid-template-columns: 1fr 1fr 2fr 2fr 1fr 1fr;
	grid-template-rows: 1.5fr 1fr 1.8fr 1fr 1.5fr;
}

.activitesGrid:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: -1;
	background: url(../images/logos-visuels_AD/losangeBleu.svg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.activitesLosange img {
	object-fit: contain;
	object-position: 50% 50%;
	width: auto;
	max-width: 140vmin;
	height: 31em;
	max-height: 140vmin;
}

.activitesGrid h3 {
	text-transform: inherit;
}

@keyframes myScale {
	0% {
		transform: scale(100%);
	}

	50% {
		transform: scale(97%);
	}

	100% {
		transform: scale(100%);
	}
}

.logoConception {
	grid-area: logoConception;
	animation: myScale 1s linear infinite;
	filter: drop-shadow(1px 3px 3px rgba(0, 0, 0, 0.75));
}

.texte1 {
	grid-area: texte1;
	color: var(--colorBeige)
}

.texte2 {
	grid-area: texte2;
	color: white;
	font-size: 1.2em;
}

.texte3 {
	grid-area: texte3;
	color: var(--colorBeige)
}

.logoRenovation {
	grid-area: logoRenovation;
	animation: myScale 1s linear infinite;
	filter: drop-shadow(1px 3px 3px rgba(0, 0, 0, 0.75));
}

.logoConception img,
.logoRenovation img {
	height: 9em;
	max-height: 9em;
}

/****************************************/

/*
https://vue-grid-generator.netlify.app/


{"areas":[["leftArrow","leftPhoto","mainPhoto","rightPhoto","rightArrow"],["NOP1","NOP1","contact","NOP2","NOP2"]],"columns":["0.5fr","2fr","4fr","2fr","0.5fr"],"rows":["4fr","1fr"],"gridWidth":"100%","gridHeight":"100%"}

*/
.versionBeige {
	color: var(--colorBleu);
	background-color: var(--colorBeige);
}

.blocNouveauxProjets {
	width: 100%;
	padding: 15vh 0;
	background-color: var(--colorBleu);
}

.nouveauxProjetsGrid {
	display: grid;
	margin: auto;
	width: 96%;
	text-align: center;

	align-content: center;
	justify-content: center;
	align-items: center;
	justify-items: center;
	grid-template-areas: "leftArrow leftPhoto mainPhoto rightPhoto rightArrow"
		"NOP1 NOP1 losangeContact NOP2 NOP2";
	grid-template-columns: 0.5fr 2fr 40% 2fr 0.5fr;
	grid-template-rows: 4fr 2fr;
	grid-column-gap: 1em;
}

.nouveauxProjetsGrid > div {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
}

.nouveauxProjetsGrid > div > img {
	height: 100%;
	object-fit: cover;
}

.leftArrow {
	grid-area: leftArrow;
}

.leftPhoto {
	grid-area: leftPhoto;
}

.mainPhoto {
	grid-area: mainPhoto;
}

.rightPhoto {
	grid-area: rightPhoto;
}

.rightArrow {
	grid-area: rightArrow;
}

.losangeContact {
	grid-area: losangeContact;
	width: 12em;
	color: white;
	text-transform: uppercase;
	margin-top: 4em;
}

.losangeContact img {
	filter: drop-shadow(0px 0.1em 0.1em rgba(0, 0, 0, 0.5));
	height: 5em;
}



/******************************************************/
/***     button_projets     ***/
/******************************************************/

/*******************************/

/*
.blocNouveauxProjets .button_projets:focus {
	outline: 0px !important;
}
*/

.blocNouveauxProjets .divButton_projets-aveclick {
	display: flex;
	position: fixed;
	top: 10vh;
	left: 0;
	z-index: 9999999;
}

.blocNouveauxProjets .button_projets {
	width: auto;
	height: 50vh;
	margin: 0;
	padding: 2vw;
	border: none;
	background-color: transparent;
	cursor: pointer;
	font-size: 4em;
}

.blocNouveauxProjets .button_projets span {
	display: block;
	font-family: "montserrat";
	font-weight: 300;
	text-shadow: 1.5px 1.5px 2px rgba(255, 255, 255, 0.9);
	background-clip: text;
	-webkit-background-clip: text;
	/* background-clip : fond decoupé par le texte, dans un span pour safari */
	color: transparent;
	background-color: black;
	transform: scaleX(0.5);
	text-align: left;
	transform-origin: left;
}

.blocNouveauxProjets .button_projets[value="+"] {
	position: relative;
	right: 0;
}

.blocNouveauxProjets .button_projets[value="+"] span {
	text-align: right;
	transform-origin: right;
}


/*******************************************************/
/***********   section3   *************/
/*******************************************************/

#section3_Partenaires {
	display: flex;
	position: relative;
	width: 100%;
	background-color: var(--colorBleu);
	color: var(--colorBeige);
	padding-bottom: 5vh;
	justify-content: center;
	flex-direction: row;
	align-items: flex-start;
	flex-wrap: wrap;
}

#section3_Partenaires ul {
	display: inline;
	width: fit-content;
	max-width: 15em;
	text-align: left;
	margin: 1em 5em;
}