html { margin: 0px; overflow-x: hidden; }
body {
	margin: 0px;
	overflow-x: hidden;
	background-color: var(--color-body-back);
}

html, body {
		height: auto;
		width: 100vw;
		overflow-y: auto;
}

html::-webkit-scrollbar, body::-webkit-scrollbar  { display: none !important; }
html, body { -ms-overflow-style: none !important; scrollbar-width: none !important; }

.mobilSupr { display: block !important; }
.justMobil { display: none !important; }

/* ESAPCES */

div.espace {
	position: relative;
	display: flex;
	width: 100vw;
	height: 100vh;
	background-size: cover;
	background-position: center;
	flex-direction: row;
	vertical-align: middle;
	overflow: hidden;
}

div.espace.h-80 {
	height: 80vh;
}

div.espace.h-20 {
	height: 20vh;
}

div.espace div.sous-espace {
	position: relative;
	display: inline-block;
	background-size: cover;
	background-position: center;
	transition-duration: 0.4s;
	box-shadow: inset 0 0 0 0px red;
}

div.espace div.sous-espace:nth-child(1) { width: 5%; }
div.espace div.sous-espace:nth-child(2) { width: 0vw; }
div.espace div.sous-espace:nth-child(3) { width: 95%; }

div.espace.active div.sous-espace:nth-child(1) { width: 5%; }
div.espace.active div.sous-espace:nth-child(2) { width: 35vw; }
div.espace.active div.sous-espace:nth-child(3) { width: 60%; }

div.espace div.sous-espace.w-20 { width: 20%; }
div.espace div.sous-espace.w-30 { width: 30%; }
div.espace div.sous-espace.w-40 { width: 40%; }
div.espace div.sous-espace.w-50 { width: 50%; }
div.espace div.sous-espace.w-60 { width: 60%; }

.open-layer {
	cursor: pointer;
}

div.espace div.sous-espace .contenu {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 90%;
	/*width: 25vw;*/
	box-shadow: inset 0 0 0 0px blue;
	padding: 5vh 5vw;
	overflow: scroll;
	-ms-overflow-style: none !important; scrollbar-width: none !important;
}

div.espace div.sous-espace .contenu.fixe { width: 25vw; }

div.espace div.sous-espace .contenu.middle { justify-content: center; }

div.espace div.sous-espace .contenu.align-top {
	justify-content: flex-start;
}

/* FONT // FAMILY */

.para-left { text-align: left; }
.para-justify { text-align: justify; }
.para-center { text-align: center; }
.para-right { text-align: right; }

/* ESPACE VIDE */
.espace-vide-5 { height: 5vh; width: 100%; padding: 0; }
.espace-vide-10 { height: 10vh; width: 100%; padding: 0; }
.espace-vide-15 { height: 15vh; width: 100%; padding: 0; }
.espace-vide-20 { height: 20vh; width: 100%; padding: 0; }
.espace-vide-30 { height: 30vh; width: 100%; padding: 0; }
.espace-vide-40 { height: 40vh; width: 100%; padding: 0; }
.espace-vide-50 { height: 50vh; width: 100%; padding: 0; }

/* COLOR */

.color-dispo { color: var(--color-selecteur-dispo); }
.color-reser { color: var(--color-selecteur-reser); }

/* P & H */

h1, h2, h3, h4, p {
	font-family: 'SansLight', sans-serif;
	padding: 2vh 0;
}

h3 {
	color: var(--color-selecteur-dispo);
	font-size: 2.8vh;
	line-height: 3.4vh;
}

h3 b {
	font-family: 'SansMedium', sans-serif;
}

h4 {
	color: var(--color-gris-fonce);
	font-size: 1.8vh;
	line-height: 2.8vh;
}

p.standard {
	font-size: 1.4vh;
	line-height: 2.4vh;
	text-align: justify;
	color: var(--color-gris-fonce);
}

p.legende {
	position: relative;
	color: var(--color-selecteur-dispo);
	font-size: 1.6vh;
	line-height: 2.0vh;
	text-transform: uppercase;
	text-align: right;
	font-family: 'SansBold', sans-serif;
	margin-top: 4vh;
}

p.legende::before {
	content: "";
	display: block;
	position: absolute;
	top: -3vh;
	right: 0px;
	height: 0;
	width: 0;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 15px solid var(--color-selecteur-dispo);
}

div.espace p.legende-image {
	display: inline-block;
	max-width: 50%;
	background-color: white;
	padding: 1vh 1.2vh;
	text-transform: uppercase;
	font-family: 'SansBold', sans-serif;
	font-size: 2vh;
	line-height: 2.4vh;
	color: var(--color-gris-fonce);
	margin: 6vh 3vw;
	transform: translateY(0vh);
	transition-duration: 0.4s;
} p.legende-image b { color: var(--color-selecteur-dispo); }

div.espace.active p.legende-image {
	transform: translateY(-100vh);
	transition-duration: 0.4s;
}

p.legende-image a.savoir-plus {
	display: inline-block;
	font-size: 40%;
	color: white;
	padding: 0.0vh 0.8vw;
	background-color: var(--color-selecteur-dispo);
	vertical-align: middle;
	margin: 0 0.8vw;
	cursor: pointer;
}

#retours-formulaire {
	margin-bottom: 1vh;
}

#retours-formulaire p {
	font-family: 'SansRegular', sans-serif;
	padding: 0.6vh 0;
	text-transform: uppercase;
	font-size: 0.8vw;
	line-height: 1vw;
}

#retours-formulaire p b {
	font-family: 'SansBold', sans-serif;
}

.formulaire-contact-problemes p { color: var(--color-selecteur-reser); }
.formulaire-contact-envoi p { color: var(--color-selecteur-dispo); }

p.etoile {
	text-transform: uppercase;
	letter-spacing: 0.05vw;
	font-size: 0.5vw;
	line-height: 0.8vw;
	color: var(--color-gris-fonce);
}

/* A */

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

a.toggle-menu {
	position: absolute;
	font-family: 'SansBold', sans-serif;
	font-size: 2.5vw;
	line-height: 2.5vw;
	color: var(--color-gris-fonce);
	text-transform: uppercase;
	transform: translate(calc(-100% - 5vw), 5vh);
	transform-origin: top right;
	text-align: right;
	cursor: pointer;
}

a.toggle-menu span {
	color: var(--color-gris-fonce);
}

a.bouton {
	display: inline-block;
	background-color: var(--color-selecteur-dispo);
	color: white;
	transition-duration: 0.4s;
	text-transform: uppercase;
	padding: 0.8vw 1vw;
	font-family: 'SansBold', sans-serif;
}

a.bouton:hover {
	background-color: var(--color-gris-fonce);
}

ul.liste-simple {
	display: block;
}

ul.liste-simple li p {
	text-transform: uppercase;
	color: var(--color-gris-fonce);
	padding: 0.6vh 0;
	font-family: 'SansMedium', sans-serif;
	font-size: 1.4vh;
	line-height: 1.6vh;
} ul.liste-simple li p b { color: var(--color-selecteur-dispo) }

ul.atouts li p {
	color: var(--color-gris-fonce);
	padding: 0.8vh 0;
	font-family: 'SansLight', sans-serif;
	font-size: 1.8vh;
	line-height: 2.4vh;
}

ul.atouts li p.atouts-titre,
ul.liste-simple li p.atouts-titre {
	text-transform: uppercase;
	color: var(--color-selecteur-dispo);
	padding: 0.8vh 0;
	font-family: 'SansMedium', sans-serif;
	font-size: 1.2vh;
	line-height: 1.8vh;
	letter-spacing: 0.1vw;
}

ul.liste-simple li p.atouts-titre {
	color: var(--color-gris-fonce)
}


ul.atouts li p.atouts-titre img,
ul.liste-simple li p.atouts-titre img {
	display: block;
	width: 20%;
	margin: 0 0 2vh 0;
}


/* COMPTE DES LOTS */

#compte-des-lots {
	top: 100px;
	position: absolute;
	font-family: 'SansBold', sans-serif;
	font-size: 2.5vw;
	line-height: 2.5vw;
	color: var(--color-selecteur-dispo);
	text-transform: uppercase;
	transform: translate(calc(-100% - 5vw), -100vh);
	transform-origin: top right;
	text-align: right;
	table-layout: fixed;
	text-align: right;
	transition-duration: 1s;
} #compte-des-lots.active { transform: translate(calc(-100% - 5vw), 10vh); }

body.selecteur #compte-des-lots { display: none; }

#compte-des-lots tr.temp { opacity: 0.5; cursor: default; }

#compte-des-lots tr td {
	vertical-align: middle;
}

#compte-des-lots tr td:last-of-type { text-align: center; }

#compte-des-lots tr td p {
	font-size: 1vw;
	padding: 0;
	color: var(--color-gris-fonce);
	font-family: 'SansBold', sans-serif;
	font-size: 1.1vw;
	line-height: 1.1vw;
	padding: 0.2vh 0.5vh;
}

#compte-des-lots tr td:first-of-type p { color: var(--color-selecteur-dispo); }

#compte-des-lots tr td p a {
	font-size: 0.8vw;
	letter-spacing: 0.1vw;
	display: block;
	color: white;
	background-color: var(--color-gris-fonce);
	padding: 0.5vw 1vw;
	transition-duration: 0.2s;
	cursor: pointer;
}

#compte-des-lots tr td p a:hover {
	background-color: var(--color-selecteur-dispo);
}

#compte-des-lots tr td p a.bt-vert { background-color: var(--color-selecteur-dispo); }
#compte-des-lots tr td p a.bt-vert:hover { background-color: var(--color-gris-fonce); }

#compte-des-lots tr.temp td p a:hover {
	background-color: var(--color-gris-fonce);
	cursor: default;
}

/* TABLE */

ul.layer {
	display: table;
	table-layout: fixed;
}

ul.layer li {
	display: table-cell;
	width: 50%;
}

ul.layer li:nth-child(1) { width: 40%; }
ul.layer li:nth-child(2) { width: 60%; }

ul.layer li p {
	display: inline-block;
	vertical-align: middle;
}

ul.layer li:nth-child(2) p {
	font-family: 'SansLight', sans-serif;
	font-size: 1.9vw;
	line-height: 1.9vw;
	text-transform: uppercase;
	color: var(--color-gris-fonce);
	padding: 2vw 0 3vw 1vw;
}

ul.layer li:nth-child(1) p img {
	width: 100%;
}

/* MODIF 17SEPT. */

ul.layer li:nth-child(1) { display: none; }
ul.layer li:nth-child(2) { width: 60%; }
ul.layer li:nth-child(2) p {
	font-size: 1.2vw;
	line-height: 1.2vw;
	letter-spacing: 0.4vw;
	padding: 1vw 0;
}

/* PICTO CARRE */

.picto-carre {
	display: inline-block;
	width: 1.4vh;
	height: 1.4vh;
	position: relative;
	vertical-align: top;
	margin: 0 0 1.2vh 0;
}

.picto-carre i {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%) rotate(0deg);
	height: 8%;
	background-color: white;
	transition-duration: 0.4s;
	transform-origin: center;
}

.picto-carre.gris { background-color: var(--color-gris-fonce); }
.picto-carre.blanc { background-color: white; }

.picto-carre.gris i { background-color: white; }
.picto-carre.blanc i { background-color: var(--color-gris-fonce); }

a.toggle-menu .picto-carre.menu i:nth-child(1) { transform: translate(-50%,-200%) rotate(0deg); width: 60%; }
a.toggle-menu .picto-carre.menu i:nth-child(2) { transform: translate(-50%,-0%) rotate(0deg); width: 60%; }
a.toggle-menu .picto-carre.menu i:nth-child(3) { transform: translate(-50%, 200%) rotate(0deg); width: 60%; }

a.toggle-menu .picto-carre.active.menu i:nth-child(1) { transform: translate(-50%, 0%) rotate(45deg); width: 60%; }
a.toggle-menu .picto-carre.active.menu i:nth-child(2) { transform: translate(-50%, 0%) rotate(90deg); width: 0%; }
a.toggle-menu .picto-carre.active.menu i:nth-child(3) { transform: translate(-50%, 0%) rotate(-45deg); width: 60%; }

li.goto .picto-carre.menu i:nth-child(1) { transform: translate(-50%, -0%) rotate(0deg); width: 60%; }
li.goto .picto-carre.menu i:nth-child(2) { transform: translate(-50%, -0%) rotate(0deg); width: 60%; }
li.goto .picto-carre.menu i:nth-child(3) { transform: translate(-50%, -0%) rotate(0deg); width: 60%; }

li.goto:hover .picto-carre.menu i:nth-child(1) { transform: translate(-50%,-200%) rotate(0deg); width: 60%; }
li.goto:hover .picto-carre.menu i:nth-child(2) { transform: translate(-50%,-0%) rotate(0deg); width: 60%; }
li.goto:hover .picto-carre.menu i:nth-child(3) { transform: translate(-50%, 200%) rotate(0deg); width: 60%; }

/* MENUS */

ul#menu-scroll {
	position: fixed;
	width: 25vw;
	height: 100vh;
	top: 0px;
	right: 0px;
	display: flex;
	flex-direction: column;
	transform: translate(calc(100% - 3vw), 0);
	transition-duration: 0.2s;
	z-index: 100;
} ul#menu-scroll.open {
	transform: translate(0%, 0);
}

ul#menu-scroll li {
	flex: 1;
	background-color: var(--color-gris-fonce);
	transition-duration: 0.4s;
	cursor: pointer;
	opacity: 0.6;
	padding: 1vw 3vw;
	vertical-align: bottom;
	display: flex;                /* Active Flexbox */
	flex-direction: column;       /* Empile en colonne */
	justify-content: flex-end;
}

ul#menu-scroll li:hover {
	opacity: 1;
}

ul#menu-scroll li.active {
	background-color: var(--color-selecteur-dispo);
	opacity: 1;
}

ul#menu-scroll li p {
	color: white;
	display: block;
	text-align: left;
	font-family: 'SansBold', sans-serif;
	text-transform: uppercase;
}

ul#menu-scroll li p.titre {
	font-size: 2.2vh;
	line-height: 3.0vh;
	padding: 0.5vh 0;
}

ul#menu-scroll li p.texte {
	font-size: 1.3vh;
	line-height: 1.5vh;
	padding: 0.1vh 0;
}

/* OPEN LAYER */

ul.open-layer {
	display: table;
	position: absolute;
	top: 0%;
	left: 0%;
	transform: translate(-100%, 0%) rotate(-90deg);
	table-layout: fixed;
	width: 100vh;
	height: 5vw;
	box-shadow: inset 0 0 0 0px red;
	transform-origin: right top;
}

ul.open-layer li {
	display: table-cell;
	box-shadow: inset 0 0 0 0px green;
	vertical-align: middle;
	text-align: center;
}

ul.open-layer li p {
	font-family: 'SansLight', sans-serif;
	font-size: 2vh;
	line-height: 2vh;
	text-transform: uppercase;
	color: var(--color-gris-fonce);
	padding: 0vw;
}

ul.open-layer li:nth-child(1) { text-align: right; }
ul.open-layer li:nth-child(2) { width: 18vh; }
ul.open-layer li:nth-child(3) { text-align: left; }

ul.open-layer li:nth-child(2) p img { height: 5vh;}


ul.open-layer li:nth-child(1) p {
	font-family: 'SansBold', sans-serif;
}

/* NOTIFICATIONS */

ul.noticifaction {
	display: block;
	width: 100%;
	margin: 1vh 0;
	position: relative;
	transition-duration: 1s;
	transform: translate(0, 0);
}

ul.noticifaction:last-of-type {
	background-color: rgba(255,255,255,0.7);
	box-shadow: 0 0 0 0.7vw rgba(255,255,255,0.7);
}

ul.noticifaction.hide {
	transform: translate(0, -100vh);
}

ul.noticifaction li {
	display: block;
	border: 0px solid red;
}

ul.noticifaction li p {
	padding: 0.4vw 0;
	color: var(--color-gris-fonce);
}

ul.noticifaction li.noticifaction-txt p {
	font-family: 'SansBold', sans-serif;
	font-size: 1.6vw;
	line-height: 1vw;
	text-transform: uppercase;
}

ul.noticifaction li.noticifaction-txt.big p {
	font-size: 1.6vw;
	line-height: 1.8vw;
}

ul.noticifaction li.noticifaction-txt p span {
	color: var(--color-selecteur-dispo);
}

ul.noticifaction li.noticifaction-btn p a {
	font-family: 'SansBold', sans-serif;
	font-size: 0.8vw;
	letter-spacing: 0.1vw;
	text-transform: uppercase;
	display: inline-block;
	color: white;
	background-color: var(--color-gris-fonce);
	padding: 0.7vw 1vw 0.5vw 1vw;
	transition-duration: 0.2s;
	cursor: pointer;
} ul.noticifaction li.noticifaction-btn p a:hover { background-color: var(--color-selecteur-dispo); }

ul.noticifaction li.noticifaction-btn p a.bt-vert { background-color: var(--color-selecteur-dispo); }
ul.noticifaction li.noticifaction-btn p a.bt-vert:hover { background-color: var(--color-gris-fonce); }

/* FOOTER */

#contact p {
	text-transform: uppercase;
	font-family: 'SansMedium', sans-serif;
	font-size: 0.8vw;
	line-height: 1vw;
	letter-spacing: 0.1vw;
	color: var(--color-gris-fonce);
}

#contact p b {
	font-family: 'SansBold', sans-serif;
	font-size: 1vw;
	line-height: 1.2vw;
}

#contact p i {
	font-family: 'SansRegular', sans-serif;
}

ul.acteur {
	display: table;
	width: 100%;
	table-layout: fixed;
}

ul.acteur li {
	display: table-cell;
	border: 0px solid blue;
	padding: 0;
}

ul.acteur li:first-child { width: 50%; padding: 0;  }
ul.acteur li:last-child { width: 50%; padding: 2vh; text-align: right; }

#contact ul.acteur li:last-child p {
	font-size: 0.7vw;
	line-height: 0.7vw;
	letter-spacing: 0.1vw;
}

ul.acteur li p {
	display: inline-block;
	vertical-align: middle;
}

ul.acteur li p img.logo-acteur {
	display: inline-block;
	vertical-align: middle;
	width: 100%;
}

/* FORMULAIRE CONTACT */

table.formulaire-contact {
	width: 100%;
	table-layout: fixed;
	vertical-align: middle;
}

table.formulaire-contact td {
	padding: 10px 10px;
	vertical-align: middle;
}

table.formulaire-contact td.credits { vertical-align: bottom; }

#contact p.credits {
	font-family: 'SansLight', sans-serif;
	font-size: 0.6vw;
	line-height: 1vw;
}

#contact p.credits img { width: 2vw; }

table.formulaire-contact input,
table.formulaire-contact select,
table.formulaire-contact textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
	-o-appearance: none;
	appearance: none;
	height: 100%;
	padding: 10px 10px 30px 10px;
	width: calc(100% - 20px);
	border: none;
	font-size: 14px;
	line-height: 18px;
	font-family: 'SansRegular', sans-serif;
	box-shadow: inset 0 0 0 0px var(--color-gris-moyen);
	border-radius: 0px;
	background-color: var(--color-gris-light);
}

table.formulaire-contact select {
	width: 100%;
	text-transform: uppercase;
	color: var(--color-projet-tonique);
	letter-spacing: 1px;
	background-image: url('../svg/fleche-bas.svg');
	background-repeat: no-repeat;
	background-size: 10px;
	background-position: calc(100% - 10px) 50%;
}

table.formulaire-contact input[type="submit"] {
	border: none;
	box-shadow: inset 0 0 0 0px var(--color-gris-fonce);
	background-color: var(--color-selecteur-dispo);
	padding: 0;
	margin: 0;
	text-transform: uppercase;
	letter-spacing: 4px;
	padding: 40px 0px 40px 0px;
	width: calc(100% - 0px);
	color: white;
	cursor: pointer;
	font-family: 'SansBold', sans-serif;
	transition-duration: 0.4s;
}

table.formulaire-contact input[type="submit"]:hover {
	background-color: var(--color-gris-fonce);
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  opacity: 1; /* Firefox */
  font-family: 'SansMedium', sans-serif;
	text-transform: uppercase;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
	text-transform: uppercase;
}

::-ms-input-placeholder { /* Microsoft Edge */
	text-transform: uppercase;
}

#contact #retours-formulaire p { padding: 0; text-align: center; }

/* GALERIE */

#galerie {
	display: block;
	position: relative;
	width: 100%;
	height: 100vh;
}

#galerie {
	cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 99.454 99.454' width='64' height='64'><circle cx='49.727' cy='49.727' r='47.227' style='fill:none;stroke:white;stroke-miterlimit:10;stroke-width:5px;'/><polyline points='41.29 74.669 63.974 49.727 41.29 24.785' style='fill:none;stroke:white;stroke-miterlimit:10;stroke-width:5px;'/></svg>") 32 32, auto;
}

ul.galerie-images {
	display: block;
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

ul.galerie-images li {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	transition-duration: 1s;
	transform: translate(-50%,-50%);
	opacity: 0;
} ul.galerie-images li.active { opacity: 1; }

ul.galerie-vignettes {
	display: flex;
	flex-direction: column;
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;
}

ul.galerie-vignettes li {
	flex: 1;
	width: 5vw;
	background-color: rgba(255,255,255,0.4);
	transition-duration: 0.4s;
	cursor: pointer;
	background-position: center;
	background-size: cover;
	filter: grayscale(100);
}

ul.galerie-vignettes li:hover { box-shadow: inset 0 0 0 1vw white; filter: grayscale(0); }
ul.galerie-vignettes li.active { box-shadow: inset 0 0 0 3vw var(--color-projet-tonique); filter: grayscale(0); }

/* GOOGLE */

.grecaptcha-badge { display: none; }