html { margin: 0px; overflow-x: hidden; }
body { margin: 0px; overflow: hidden; }
/*
html::-webkit-scrollbar, body::-webkit-scrollbar  { display: none !important; }
html, body { -ms-overflow-style: none !important; scrollbar-width: none !important; }
*/
/* MOBIL */
.mobilSupr { display: inline-block !important; }
.justMobil { display: none !important; }
.mobilSuprTable { display: table !important; }
.justMobilTable { display: none !important; }


/* WIDTH */

.contenu {
	position: relative;
	display: inline-block;
	background-size: cover;
	background-position: center;
	vertical-align: middle;
  	word-spacing: 0em;
	overflow: hidden;
}

/* PAGE CONTENU */

.width-full {
	display: table;
	position: relative;
	width: 100vw;
	height: auto;
	min-width: 100vw;
	table-layout: fixed;
	word-spacing: -4em;
	margin: 0 auto;
	overflow: visible;
	vertical-align: middle;
}

.width-full.ligne-gauche::before {
	content: "";
	display: block;
	position: absolute;
	width: 10px;
	height: 30%;
	background-color: var(--color-projet-tonique);
}

.width-max {
	display: table;
	position: relative;
	width: calc(100vw - 200px);
	margin: 0 100px;
	table-layout: fixed;
	word-spacing: -4em;
	overflow: visible;
	padding: 0;
}

.width-gauche {
	display: inline-table;
	position: relative;
	width: 65vw;
	margin: 0;
	table-layout: fixed;
	word-spacing: -4em;
	overflow: visible;
	padding: 0;
	vertical-align: middle;
}

.width-droite {
	display: inline-table;
	position: relative;
	width: 35vw;
	margin: 0;
	table-layout: fixed;
	word-spacing: -4em;
	overflow: visible;
	padding: 0;
	vertical-align: middle;
}

/* MARGES */
.padding-top { padding-top: 40px; }
.padding-bottom { padding-bottom: 40px; }
.margin-top { padding-top: 40px; }
.margin-bottom { padding-bottom: 40px; }

/* BOX // WIDTH */
.entier {width: calc((100% / 1) - 40px); margin: 0px 20px; }
.entier-full {width: calc((100% / 1) - 0px); margin: 0px 0px; }
.demi {width: calc((100% / 2) - 40px ); margin: 0px 20px; }
.demi-full {width: calc((100% / 2) - 0px ); margin: 0px 0px; }
.tier {width: calc((100% / 3) - 40px); margin: 0px 20px; }
.tier-max {width: calc((100% / 3) - 20px); margin: 0px 10px; }
.tier-full {width: calc((100% / 3) - 0px); margin: 0px 0px; }
.deuxtier {width: calc(2*(100% / 3) - 40px); margin: 0px 20px; }
.deuxtier-full {width: calc(2*(100% / 3) - 0px); margin: 0px 0px; }
.quart {width: calc((100% / 4) - 40px); margin: 0px 20px; }
.quart-full {width: calc((100% / 4) - 0px); margin: 0px 0px; }
.troisquart {width: calc(3*(100% / 4) - 20px); margin: 0px 40px; }
.troisquart-full {width: calc(3*(100% / 4) - 0px); margin: 0px 0px; }
.cinquieme {width: calc((100% / 5) - 40px); margin: 0px 20px; }
.cinquieme-full {width: calc((100% / 5) - 0px); margin: 0px 0px; }
.sixieme {width: calc((100% / 6) - 40px); margin: 0px 20px; }
.sixieme-full {width: calc((100% / 6) - 0px); margin: 0px 0px; }
.cinqsixieme {width: calc(5*(100% / 6) - 40px); margin: 0px 20px; }
.cinqsixieme-full {width: calc(5*(100% / 6) - 0px); margin: 0px 0px; }
.deuxcinquieme {width: calc(2*(100% / 5) - 40px); margin: 0px 20px; }
.deuxcinquieme-left {width: calc(2*(100% / 5) - 20px); margin: 0px 20px 0 0; }
.deuxcinquieme-full {width: calc(2*(100% / 5) - 0px); margin: 0px 0px; }
.troiscinquieme {width: calc(3*(100% / 5) - 40px); margin: 0px 20px; }
.troiscinquieme-full {width: calc(3*(100% / 5) - 0px); margin: 0px 0px; }

/* FONT // PARA */
.font-cap { text-transform: uppercase; }
.font-underline { text-decoration: underline; }
.font-italique { font-style: italic; }
.para-left { text-align: left; }
.para-justify { text-align: justify; }
.para-center { text-align: center; }
.para-right { text-align: right; }

/* ALIGNEMENT */
.vertical-align-top { vertical-align: top; }
.vertical-align-bottom { vertical-align: bottom; }

/* ESPACE VIDE */
.espace-vide-10 { height: 10px; width: 100%; }
.espace-vide-20 { height: 20px; width: 100%; }
.espace-vide-30 { height: 30px; width: 100%; }
.espace-vide-40 { height: 40px; width: 100%; }
.espace-vide-50 { height: 50px; width: 100%; }
.espace-vide-60 { height: 60px; width: 100%; }
.espace-vide-100 { height: 100px; width: 100%; }
.espace-vide-200 { height: 200px; width: 100%; }

/* BANDES IMAGES */
.bande-20 { height: 20vh; }
.bande-30 { height: 30vh; }
.bande-35 { height: 35vh; }
.bande-40 { height: 40vh; min-height: 400px; }
.bande-50 { height: 50vh; min-height: 500px; }
.bande-60 { height: 60vh; min-height: 600px; }
.bande-70 { height: 70vh; min-height: 700px; }

.image-back {
	background-size: cover;
	background-position: center;
}

/* COLOR */

.background-color-cardis { background-color: var(--color-projet-corpo); }

/* P // H */

p {
	font-family: 'sansLight', sans-serif;
	font-size: 16px;
	line-height: 22px;
	margin: 10px 0;
}

h2 {
	font-family: 'sansMedium', sans-serif;
	color: var(--color-projet-corpo);
	font-size: 40px;
	line-height: 50px;
	margin: 20px 0 10px 0;
} h2 i { color: var(--color-projet-tonique); }

h3 {
	font-family: 'sansLight', sans-serif;
	color: var(--color-gris-fonce);
	font-size: 12px;
	line-height: 20px;
	letter-spacing: 16px;
	margin: 60px 0 10px 0;
	text-transform: uppercase;
}

p.image-sans {
	padding: 0px;
	margin: 0px;
}

p.image-sans img {
	padding: 0px;
	margin: 0px;
}

p.image-sans span.bord-image {
	display: block;
	position: absolute;
	width: 100%;
	height: 10px;
}

p.image-sans span.bord-image.top { top: 0px; }
p.image-sans span.bord-image.bottom { bottom: 0px; }
p.image-sans span.bord-image.corpo { background-color: var(--color-projet-tonique); }
p.image-sans span.bord-image.cardis { background-color: var(--color-projet-corpo); }

.bord-image.top-cardis { box-shadow: inset 0 10px 0 0 var(--color-projet-corpo); }

span.hide {
	display: none;
}

p.ligne-fat-cardis {
	display: inline-block;
	width: 80px;
	height: 10px;
	background-color: var(--color-projet-corpo);
}

/* LIENS */

a {
	text-decoration: none;
	color: inherit;
}

a.en-savoir-plus {
	display: inline-block;
	width: 80px;
	height: 80px;
	background-image: url('../svg/picto-savoirplus.svg');
	background-size: 30px;
	background-position: 0% 50%;
	cursor: pointer;
} a.en-savoir-plus.moins { background-image: url('../svg/picto-savoirmoins.svg'); }

/* PARA-LISTE */

ul.paragraphe-simple {
	display: table;
}

ul.paragraphe-simple li {
	display: table-cell;
}

ul.paragraphe-simple li.bouton-plus {
	width: 100px;
	text-align: right;
	background-image: url('../svg/picto-savoirmoins.svg');
	background-size: 30px;
	background-position: 100% 50%;
	cursor: pointer;
}

ul.paragraphe-simple.hide li.bouton-plus { background-image: url('../svg/picto-savoirplus.svg'); }

ul.paragraphe-simple.hide li p span { display: none; }

ul.paragraphe-simple li.bouton-plus:hover {
	background-position: 100% 50%;
}

ul.paragraphe-liste {
	display: table;
	width: 100%;
}

ul.paragraphe-liste li {
	position: relative;
}

ul.paragraphe-liste li.ligne-fine {
	display: inline-block;
	width: calc(100% - 20px);
	height: 2px;
	margin: 0 10px;
	background-color: var(--color-projet-corpo);
}

ul.paragraphe-liste li.ligne-fat {
	display: inline-block;
	width: 80px;
	height: 10px;
	margin: 0 0 0 10px;
	background-color: var(--color-projet-tonique);
}

ul.paragraphe-liste li p {
	font-family: 'sansRegular', sans-serif;
	font-size: 20px;
	line-height: 30px;
	color: var(--color-projet-tonique);
	padding: 0 10px;
}


ul.paragraphe-liste li p b {
	font-family: 'sansBold', sans-serif;
}

ul.paragraphe-liste li a {
	display: inline-block;
	font-family: 'sansMedium', sans-serif;
	font-size: 10px;
	line-height: 16px;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: var(--color-projet-corpo);
	padding: 10px 0;
	transition-duration: 0.8s;
	cursor: pointer;
}

ul.paragraphe-liste a:hover {
	padding: 15px 0;
}

ul.paragraphe-liste li.image {
	margin: 0 0 30px 0;
}

ul.paragraphe-liste li.image span {
	display: block;
	position: absolute;
	width: 80px;
	height: 80px;
	background-color: white;
	bottom: 3px;
	left: 10px;
	box-shadow: 0 10px 0 0 var(--color-projet-tonique);
	background-position: center;
	background-size: 30px;
}

ul.paragraphe-liste li a.bouton-logement {
	display: block;
	font-family: 'sansMedium', sans-serif;
	font-size: 10px;
	line-height: 16px;
	text-transform: uppercase;
	letter-spacing: 2px;
	background-color: var(--color-projet-corpo);
	color: white;
	padding: 20px 20px;
	transition-duration: 0.8s;
	cursor: pointer;
} ul.paragraphe-liste li a.bouton-logement:hover { background-color: var(--color-projet-tonique); }

/* INTRODUCTION */

#introduction-mobil {
	display: none;
}

#introduction {
	position: relative;
	width: 100vw;
	height: 90vh;
	min-height: 500px;
	background-image: url("../image/galerie-image-exter-3.jpg");
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

/* TABLEAU */

table.distances {
	table-layout: fixed;
	width: 100%;
	margin-top: 20px;
}

table.distances tr td:nth-child(1) { width: 80px; text-align: center; }

table.distances tr td {
	border: 2px solid var(--color-projet-tonique);
}

table.distances tr td p {
	margin: 14px 14px;
	font-family: 'sansRegular', sans-serif;
	font-size: 12px;
	line-height: 18px;
	color: var(--color-projet-tonique);
	text-transform: uppercase;
}

table.distances tr td p b { font-family: 'sansBold', sans-serif; }

table.distances tr td img {
	display: inline-block;
	vertical-align: middle;
}

table.distances tr:nth-child(1) td:nth-child(2),
table.distances tr:nth-child(1) td:nth-child(3),
table.distances tr:nth-child(1) td:nth-child(4) {
	box-shadow: 0 -10px 0 0 var(--color-projet-tonique-light);
}

/* FOOTER */

#footer {
	padding: 80px 0;
}

#footer p {
	color: white;
	text-align: center;
	font-family: 'sansRegular', sans-serif;
	font-size: 14px;
	line-height: 26px;
}

#footer p b { font-family: 'sansBold', sans-serif; }

#footer p img {
	margin: 30px 0;
}

#footer h3 {
	font-family: 'sansLight', sans-serif;
	color: white;
	font-size: 12px;
	line-height: 20px;
	letter-spacing: 4px;
	margin: 10px 0 20px 0;
	text-transform: uppercase;
	text-align: center;
}

#credits {
	padding: 10px 0 5px 0;
}

#credits p.credits {
	font-family: 'sansRegular', sans-serif;
	font-size: 9px;
	line-height: 14px;
	color: var(--color-gris-fonce);
	text-transform: uppercase;
	letter-spacing: 2px;
}

/* MENU PRINCIPAL */

ul#menu-principal {
	position: absolute;
	display: table;
	width: 100vw;
	height: 80px;
	top: 50%;
	transform: translateY(-50%);
	table-layout: fixed;
	z-index: 100;
	background-color: rgba(255, 255, 255, 0);
	transition-duration: 0s;
}

ul#menu-principal.glue {
	position: fixed;
	top: 0px;
	transform: translateY(0%);
	background-color: rgba(255, 255, 255, 1);
	box-shadow: 0 0 6px 0 var(--color-gris-clair);
}

ul#menu-principal li {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

ul#menu-principal li:first-of-type, ul#menu-principal li:last-of-type { width: 360px; transition-duration: 1s; }
ul#menu-principal li:first-of-type img, ul#menu-principal li:last-of-type img { vertical-align: middle; }

ul#menu-principal li:first-of-type { background-color: white; }
ul#menu-principal li:last-of-type { background-color: var(--color-projet-corpo); }

ul#menu-principal li#menu-principal-boutons { text-align: left; }

ul#menu-principal li#menu-principal-boutons a {
	display: inline-block;
	position: relative;
	width: 80px;
	height: 80px;
	background-color: white;
	margin: 0 0 0 8px;
	vertical-align: middle;
	cursor: pointer;
	background-size: 30px;
	background-position: center 35%;
	box-shadow: 0 0px 0 0 var(--color-projet-tonique);
	transition-duration: 0.4s;
} ul#menu-principal li#menu-principal-boutons a:first-of-type { margin: 0 0 0 12px; }

ul#menu-principal li#menu-principal-boutons a span {
	display: block;
	position: absolute;
	width: 100%;
	bottom: 0px;
	font-family: 'sansMedium', sans-serif;
	font-size: 10px;
	line-height: 10px;
	text-align: center;
	color: var(--color-projet-tonique);
	text-transform: uppercase;
	letter-spacing: 1px;
	transform: translateY(-150%);
	transition-duration: 0.2s;
	opacity: 1;
}

ul#menu-principal li#menu-principal-boutons a.glue { display: none; }
ul#menu-principal.glue li#menu-principal-boutons a.glue { display: inline-block; }
ul#menu-principal.glue li:last-of-type { width: 35vw; }

ul#menu-principal li#menu-principal-boutons a:hover { box-shadow: 0 10px 0 0 var(--color-projet-tonique); background-position: center center; }
ul#menu-principal li#menu-principal-boutons a:hover span { transform: translateY(0%); opacity: 0; }

ul#menu-principal li#menu-principal-boutons a.retour { background-image: url('../svg/picto-retour.svg'); }
ul#menu-principal li#menu-principal-boutons a.video { background-image: url('../svg/picto-play.svg'); }
ul#menu-principal li#menu-principal-boutons a.logements { background-image: url('../svg/picto-logements.svg'); }
ul#menu-principal li#menu-principal-boutons a.galerie { background-image: url('../svg/picto-photo.svg'); }
ul#menu-principal li#menu-principal-boutons a.telechargements { background-image: url('../svg/picto-telechargements.svg'); }
ul#menu-principal li#menu-principal-boutons a.contact { background-image: url('../svg/picto-contact.svg'); }
html[lang="fr"] ul#menu-principal li#menu-principal-boutons a.langue { background-image: url('../svg/picto-langue-de.svg'); }
html[lang="de"] ul#menu-principal li#menu-principal-boutons a.langue { background-image: url('../svg/picto-langue-fr.svg'); }

ul#menu-principal li#menu-principal-boutons a p {
	display: block;
	position: absolute;
	top: 0px;
	left: 50%;
	text-align: center;
	transform: translateX(-50%) translateY(240%);
	color: white;
	padding: 10px;
	background-color: var(--color-projet-corpo);
	text-decoration: none;
	text-transform: uppercase;
	font-size: 10px;
	line-height: 14px;
	letter-spacing: 2px;
	font-family: 'sansRegular', sans-serif;
	opacity: 0;
	transition-duration: 0.2s;
}

ul#menu-principal li#menu-principal-boutons a:hover p {
	opacity: 1;
	transform: translateX(-50%) translateY(280%);
}

ul#menu-intro-bas {
	display: table;
	position: absolute;
	width: 100vw;
	height: 80px;
	bottom: 0%;
	table-layout: fixed;
}

ul#menu-intro-bas li {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

ul#menu-intro-bas li:first-of-type, ul#menu-intro-bas li:last-of-type { width: 360px; }

ul#menu-intro-bas li#menu-intro-bas-boutons { text-align: left; }

ul#menu-intro-bas li#menu-intro-bas-boutons a {
	display: inline-block;
	position: relative;
	width: 80px;
	height: 80px;
	background-color: white;
	margin: 0 0 0 8px;
	vertical-align: middle;
	cursor: pointer;
	background-size: 30px;
	background-position: center 35%;
	box-shadow: 0 0px 0 0 var(--color-projet-tonique);
	transition-duration: 0.4s;
} ul#menu-intro-bas li#menu-intro-bas-boutons a:first-of-type { margin: 0 0 0 12px; }

ul#menu-intro-bas li#menu-intro-bas-boutons a span {
	display: block;
	position: absolute;
	width: 100%;
	bottom: 0px;
	font-family: 'sansMedium', sans-serif;
	font-size: 10px;
	line-height: 10px;
	text-align: center;
	color: var(--color-projet-tonique);
	text-transform: uppercase;
	letter-spacing: 1px;
	transform: translateY(-150%);
	transition-duration: 0.2s;
	opacity: 1;
}

ul#menu-intro-bas li#menu-intro-bas-boutons a:hover { box-shadow: 0 10px 0 0 var(--color-projet-tonique); background-position: center center; }

ul#menu-intro-bas li#menu-intro-bas-boutons a.logements { background-image: url('../svg/picto-logements.svg'); }
ul#menu-intro-bas li#menu-intro-bas-boutons a.galerie { background-image: url('../svg/picto-photo.svg'); }
ul#menu-intro-bas li#menu-intro-bas-boutons a.telechargements { background-image: url('../svg/picto-telechargements.svg'); }
ul#menu-intro-bas li#menu-intro-bas-boutons a.contact { background-image: url('../svg/picto-contact.svg'); }
html[lang="fr"] ul#menu-intro-bas li#menu-intro-bas-boutons a.langue { background-image: url('../svg/picto-langue-de.svg'); }
html[lang="de"] ul#menu-intro-bas li#menu-intro-bas-boutons a.langue { background-image: url('../svg/picto-langue-fr.svg'); }

ul#menu-intro-bas li#menu-intro-bas-boutons a p {
	display: block;
	position: absolute;
	top: 0px;
	left: 50%;
	text-align: center;
	transform: translateX(-50%) translateY(-50%);
	color: var(--color-projet-tonique);
	padding: 10px;
	background-color: white;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 10px;
	line-height: 14px;
	letter-spacing: 2px;
	font-family: 'sansRegular', sans-serif;
	opacity: 0;
	transition-duration: 0.2s;
}

ul#menu-intro-bas li#menu-intro-bas-boutons a:hover p {
	opacity: 1;
	transform: translateX(-50%) translateY(-160%);
}

ul#menu-intro-bas li#menu-intro-bas-boutons a:hover span { transform: translateY(0%); opacity: 0; }

/* COURTIER */

p.courtiers-profil {
	position: relative;
}

p.courtiers {
	font-family: 'sansMedium', sans-serif;
	color: var(--color-projet-corpo);
	font-size: 1.4vw;
	line-height: 1.8vw;
	margin: 20px 0;
}

p.courtiers-profil img {
	width: 60%;
}

/* LEGENDES IMAGES */

.legende-image {
	position: absolute;
	background-color: white;
	width: 50%;
	max-width: 300px;
	top: 10%;
	transition-duration: 0.6s;
}

.legende-image.right { right: 0px; }
.legende-image.left { left: 0px; }

.legende-image.right.hide { transform: translateX(100%); }
.legende-image.left.hide { transform: translateX(-100%); }

.legende-image p {
	font-family: 'sansMedium', sans-serif;
	font-size: 1.2vw;
	line-height: 1.6vw;
	color: var(--color-projet-corpo);
	padding: 80px 30px 20px 30px;
}

.legende-image:before {
	content: "";
	display: block;
	position: absolute;
	width: 30px;
	height: 30px;
	top: 30px;
	left: 30px;
	background-image: url('../svg/picto-message.svg');
	background-position: center;
}

.legende-image div.close {
	position: absolute;
	width: 30px;
	height: 30px;
	top: 30px;
	right: 20px;
	cursor: pointer;
	background-image: url('../svg/picto-close.svg');
	background-position: center;
	transition-duration: 0.4;
	cursor: pointer;
}

/* INFORMATION */

#information {
	position: absolute;
	background-color: white;
	width: 360px;
	top: 50%;
	right: 0px;
	transition-duration: 0.6s;
	padding: 80px 0 10px 0;
	transform: translateX(0%) translateY(calc(-100% - 50px));
}

#information.hide { transform: translateX(100%) translateY(calc(-100% - 50px)); }

#information p {
	font-family: 'sansMedium', sans-serif;
	font-size: 22px;
	line-height: 28px;
	color: var(--color-projet-corpo);
	margin: 0 30px 10px 30px;
}

#information p span {
	color: var(--color-selecteur-dispo);
	cursor: pointer;
}

#information p.adresse {
	font-family: 'sansLight', sans-serif;
	display: block;
	text-transform: uppercase;
	text-decoration: none;
	border-top: 2px solid var(--color-projet-corpo);
	color: var(--color-projet-corpo);
	padding-top: 20px;
	font-size: 14px;
	line-height: 18px;
	letter-spacing: 2px;
}

#information p a b { font-family: 'sansMedium', sans-serif; }


#information:before {
	content: "";
	display: block;
	position: absolute;
	width: 30px;
	height: 30px;
	top: 30px;
	left: 30px;
	background-image: url('../svg/picto-message.svg');
	background-position: center;
}

#information div.close {
	position: absolute;
	width: 30px;
	height: 30px;
	top: 30px;
	right: 20px;
	cursor: pointer;
	background-image: url('../svg/picto-close.svg');
	background-position: center;
	transition-duration: 0.4;
	cursor: pointer;
}

/* MENU SECONDAIRE */

ul#menu-secondaire {
	position: fixed;
	left: 0px;
	top: 160px;
	z-index: 100;
	transform: translateX(-100vw);
	transition-duration: 0.6s;
}

ul#menu-secondaire.show {
	transform: translateX(0px);
}

ul#menu-secondaire li {
	display: block;
	position: relative;
	width: 80px;
	height: 80px;
	background-color: white;
	vertical-align: middle;
	z-index: 1002;
	cursor: pointer;
	margin: 0 0 10px 0;
	box-shadow: 0 0 6px 0 var(--color-gris-clair);
}

ul#menu-secondaire li.active { box-shadow: 0 0 6px 0 var(--color-gris-clair), 10px 0 0 0 var(--color-gris-moyen); }

ul#menu-secondaire li.hide {
	display: none;
}

ul#menu-secondaire li span.image {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 60px;
	height: 60px;
	transform: translateX(-50%) translateY(-50%);
	background-position: 50% 30%;
	background-size: 50%;
	background-color: white;
	z-index: 1004;
	transition-duration: 0.4s;
	border: 10px solid white;
}

ul#menu-secondaire li:hover span.image { background-position: 50% 50%; }

ul#menu-secondaire li:nth-child(1) span.image { background-image: url('../svg/picto-lampe.svg'); }
ul#menu-secondaire li:nth-child(2) span.image { background-image: url('../svg/picto-maison.svg'); }
ul#menu-secondaire li:nth-child(3) span.image { background-image: url('../svg/picto-localisation.svg'); }
ul#menu-secondaire li:nth-child(4) span.image { background-image: url('../svg/picto-acces.svg'); }

ul#menu-secondaire li span.hover {
	position: relative;
	display: inline-block;
	top: 0px;
	left: 0px;
	width: auto;
	height: 100%;
	vertical-align: middle;
	transform: translateX(-100%);
	background-color: white;
	box-shadow: inset -10px 0 0 0 var(--color-projet-tonique);
	cursor: pointer;
	transition-duration: 0.4s;
	z-index: 1001;
}

ul#menu-secondaire li:hover span.hover {
	transform: translateX( calc(0% + 80px) );
}

ul#menu-secondaire li span.hover p {
	display: block;
	vertical-align: middle;
	position: relative;
	width: calc();
	padding: 0 40px 0 0;
	margin: 0;
	top: 50%;
	transform: translateY(-50%);
	text-transform: uppercase;
	font-family: "SansMedium", sans-serif;
	font-size: 12px;
	letter-spacing: 2px;
	color: var(--color-projet-tonique);
	text-align: right;
}

ul#menu-secondaire li span.mobil {
	display: block;
	position: absolute;
	width: 100%;
	bottom: 0px;
	text-align: center;
	color: var(--color-projet-tonique);
	text-transform: uppercase;
	letter-spacing: 1px;
	transition-duration: 0.2s;
	opacity: 1;
	z-index: 100000;
}

ul#menu-secondaire li:hover span.mobil { opacity: 0; }

ul#menu-secondaire li span.mobil p {
	font-family: 'sansMedium', sans-serif;
	font-size: 10px;
	line-height: 10px;
	margin: 0 0 15% 0;
}


/* GALERIE VIDEO */

#galerie-video {
	position: fixed;
	width: 100vw;
	height: 100vh;
	background-color: black;
	z-index: 10000000;
	transform: translateY(-200vh);
	transition-duration: 0.3s;
}

#galerie-video.open {
	transform: translateY(0vh);
}

#galerie-video video {
	width: 100vw;
	height: 100vh;
}

div.bouton-close {
	position: absolute;
	top: 10vh;
	right: 0px;
	width: 80px;
	height: 80px;
	background-color: white;
	background-image: url('../svg/picto-close.svg');
	background-size: 30px;
	background-position: center;
	box-shadow: -10px 0 0 0 var(--color-projet-corpo);
	cursor: pointer;
	transition-duration: 0.4s;
}

div.bouton-close:hover {
	box-shadow: 0px 0 0 0 var(--color-projet-corpo);
}

/* GALERIE MEDIA */

#galerie-media {
	position: fixed;
	width: 100vw;
	height: 100vh;
	background-color: black;
	z-index: 10000;
	transform: translateY(-200vh);
	transition-duration: 0.3s;
}

#galerie-media.open {
	transform: translateY(0vh);
}

#galerie-media video {
	width: 100vw;
	height: 100vh;
}

/* GALERIE IMAGE */

#galerie-image {
	position: fixed;
	width: 100vw;
	height: 100vh;
	background-color: white;
	z-index: 10000000;
	transform: translateY(-200vh);
	transition-duration: 0.3s;
}

#galerie-image.open {
	transform: translateY(0vh);
}

#galerie-image ul#images {
	position: absolute;
	display: block;
	top: 0px;
	width: 100%;
	height: 100%;
}

#galerie-image ul#images li {
	position: absolute;
	display: none;
	top: 0px;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	background-color: white;
}

#galerie-image ul#images li.active { display: block; }

#galerie-image ul#vignettes {
	position: absolute;
	text-align: center;
	bottom: 0px;
	display: table;
	width: 80%;
	margin: 0 10%;
	height: 80px;
	border: none;
	transform: translateY(3px);
}

#galerie-image ul#vignettes li {
	display: inline-flex;
	width: 80px;
	height: 80px;
	box-shadow: inset 0 0 0 10px white, 0 0px 0 0 var(--color-projet-tonique);
	margin: 0;
	background-size: cover;
	background-position: center;
	transition-duration: 0.4s;
	cursor: pointer;
	border: none;
}

#galerie-image ul#vignettes li:hover {
	box-shadow: inset 0 0 0 10px white, 0 -10px 0 0 var(--color-projet-tonique);
}

#galerie-image ul#vignettes li.active {
	width: 160px;
	box-shadow: inset 0 0 0 10px white, 0 -10px 0 0 var(--color-projet-corpo);
	cursor: default;
}

#galerie-image #bouton-avant, #galerie-image #bouton-apres {
	position: absolute;
	display: block;
	bottom: 0px;
	width: 80px;
	height: 80px;
	background-color: white;
	cursor: pointer;
	background-position: 50% center;
	background-size: 30px;
	transition-duration: 0.4s;
}

#galerie-image #bouton-avant {
	left: 0px;
	background-image: url('../svg/picto-fleche-left.svg');
	box-shadow: 10px 0 0 0 var(--color-projet-corpo);
}

#galerie-image #bouton-apres {
	right: 0px;
	background-image: url('../svg/picto-fleche-right.svg');
	box-shadow: -10px 0 0 0 var(--color-projet-corpo);
}

#galerie-image #bouton-avant:hover,
#galerie-image #bouton-apres:hover { box-shadow: 0px 0 0 0 var(--color-projet-corpo); }

/* GALERIE CONTACT */

#galerie-contact {
	position: fixed;
	width: 100vw;
	height: 100vh;
	background-color: white;
	z-index: 10000000;
	transform: translateY(-200vh);
	transition-duration: 0.3s;
	overflow: scroll;
}

#galerie-contact.open {
	transform: translateY(0vh);
}

#galerie-contact #galerie-contact-contenu {
	width: 50%;
	margin: 0 25%;
}

#galerie-contact::-webkit-scrollbar  { display: none !important; }
#galerie-contact { -ms-overflow-style: none !important; scrollbar-width: none !important; }

#galerie-contact #galerie-contact-contenu h2 {
	padding: 30px 0 20px 0;
}

#galerie-contact #galerie-contact-contenu p,
#galerie-contact #galerie-contact-contenu h3 {
	color: var(--color-projet-corpo);
}

#galerie-contact #galerie-contact-contenu p img {
	width: 50%;
	margin: 30px 0;
}

/* AJUSTEMENT PAGE CONTACT */

body.contact #introduction {
	height: 40vh;
	min-height: 200px;
	background-image: url("../image/galerie-image-exter-1.jpg");
}

body.contact #introduction #information,
body.contact #menu-secondaire,
body.contact #informationMenu {
	display: none !important;
}

/* GALERIE HOME */

#galerie-home {
	position: absolute;
	width: 100%;
	height: 100%;
}

#galerie-home ul#galerie-home-images {
	position: absolute;
	width: 100%;
	height: 100%;
}

#galerie-home ul#galerie-home-images li {
	position: absolute;
	width: 100%;
	height: 100%;
	background-position: center;
	background-size: cover;
	transform: translateX(100vw);
	transition-duration: 0s;
}

#galerie-home ul#galerie-home-images li.active {
	transform: translateX(0vw);
}

#galerie-home ul#galerie-home-vignette {
	position: absolute;
	display: table;
	top: 0px;
	right: 0px;
	width: 360px;
	height: 10px;
	table-layout: fixed;
}

#galerie-home ul#galerie-home-vignette li {
	display: table-cell;
	background-color: var(--color-projet-corpo);
	cursor: pointer;
	transition-duration: 0.2s;
}

#galerie-home ul#galerie-home-vignette li:hover {
	box-shadow: 0 10px 0 0 var(--color-projet-corpo);
}

#galerie-home ul#galerie-home-vignette li.active {
	background-color: var(--color-selecteur-dispo);
}

#galerie-home ul#galerie-home-vignette li.active:hover {
	box-shadow: 0 0px 0 0 var(--color-selecteur-dispo);
}