body.selecteur {
  display: flex;
  flex-direction: column;
	height: 100vh;
}

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

#selecteur {
	flex: 1;
	display: flex;
	justify-content: center;
	align-items: stretch;
	overflow: scroll;
}

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

#selecteur-visuel {
  flex: 2;
  flex-direction: column;
  display: flex;
  justify-content: center;
	height: 100%;
}

#selecteur-tableau {
  flex: 1;
	height: 100%;
	display: flex;
  flex-direction: column;
  padding: 0 2vw;
}

#selecteur-tableau-contenu {
	position: relative;
	top: 0px;
	vertical-align: top;
	overflow-y: scroll;
}

#selecteur-tableau-contenu::-webkit-scrollbar { display: none !important; }
#selecteur-tableau-contenu { -ms-overflow-style: none !important; scrollbar-width: none !important; }

/* ALERT */

p.alert-selecteur {
	display: block;
	padding: 2.5vh;
	font-size: 0.9vw;
	line-height: 1.6vw;
	text-align: justify;
	color: var(--color-selecteur-reser);
	box-shadow: inset 0 0 0 2px var(--color-selecteur-reser);
	margin-bottom: 2vh;
}

p.alert-selecteur img {
  display: inline-block;
  vertical-align: middle;
  width: 4vw;
}

/* TABLEAU */

.intercalaire-batiment {
  position: relative;
  padding: 0.6vh 0;
  border-top: 1px solid var(--color-gris-fonce);
  transition-duration: 0.4s;
  cursor: pointer;
}

.intercalaire-batiment:hover {
  background-color: rgba(0,0,0,0.1);
}

.intercalaire-batiment p {
  text-transform: uppercase;
  font-size: 0.9vw;
  line-height: 0.9vw;
  letter-spacing: 0.5vw;
  margin: 1vh 0;
}

table.lot {
	display: table;
	width: 100%;
	table-layout: fixed;
	border-top: 1px solid var(--color-gris-fonce);
	cursor: pointer;
}


table.lot:hover {
	border-top: 3px solid var(--color-gris-fonce);
	border-bottom: 2px solid var(--color-gris-fonce);
}

table.lot.open {
  border-top: 6px solid var(--color-gris-fonce);
	border-bottom: 5px solid var(--color-gris-fonce);
}

table.lot tr:nth-child(2) { display: none; }
table.lot.open tr:nth-child(2) { display: table-row;; }

table.lot tr td {
	padding: 1vh 0;
	vertical-align: top;
}

table.lot tr td p {
	text-transform: uppercase;
	font-size: 1vw;
	line-height: 1.3vw;
}

table.lot tr:nth-child(1) td:nth-child(1) p { font-family: 'SansMedium', serif; }

table.lot tr td p i {
	display: block;
	font-size: 0.5vw;
	line-height: 0.6vw;
	letter-spacing: 0.1vw;
}

table.lot tr:nth-child(1) td:last-of-type {
  text-align: right;
}

table.lot tr:nth-child(1) td:last-of-type p span {
  display: inline-block;
  width: 0.8vw;
  height: 1.6vw;
  vertical-align: middle;
  margin-right: 0.2vw;
}

table.lot.disponible tr:nth-child(1) td:last-of-type p span { background-color: var(--color-selecteur-dispo); }
table.lot.réservé tr:nth-child(1) td:last-of-type p span { background-color: var(--color-selecteur-reser); }
table.lot.vendu tr:nth-child(1) td:last-of-type p span { background-color: var(--color-selecteur-vendu); }

table.lot tr:nth-child(1) td:last-of-type p img {
  display: inline-block;
  vertical-align: middle;
  width: 4vw;
}

table.lot.hidePiece { display: none; }
table.lot.hideBatiment { display: none; }
table.lot.hideEtage { display: none; }
table.lot.hideDispo { display: none; }

/* FILTRES */

#selecteur-visuel-filtres {
	display: table;
  margin: 0.2vh auto 2vh auto;
	width: 95%;
	vertical-align: middle;
	text-align: center;
}

#selecteur-visuel-filtres ul {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

#selecteur-visuel-filtres ul li {
	position: relative;
	display: inline-block;
	float: center;
	box-shadow: inset 0 0 0 1px var(--color-projet-corpo);
	padding: 0.5vw;
	margin: 0.05vw;
	font-family: 'SansRegular', sans-serif;
	text-transform: uppercase;
	font-size: 0.6vw;
	line-height: 0.6vw;
	letter-spacing: 0.05vw;
	color: var(--color-projet-corpo);
}

#selecteur-visuel-filtres ul li.off {
	font-size: 0.7vw;
	line-height: 0.7vw;
	letter-spacing: 0.1vw;
	box-shadow: none;
}

#selecteur-visuel-filtres ul li.filtre {
	box-shadow: inset 0 0 0 1px var(--color-gris-clair);
	color: var(--color-gris-clair);
}

#selecteur-visuel-filtres ul li.filtre::before {
	content: '';
	display: block;
	position: absolute;
	top: 0px;
	right: 0px;
	width: 0.6vw;
	height: 0.6vw;
	background-color: var(--color-projet-corpo);
	transform: translate(0, -50%);
	background-image: url('../svg/picto-croix-blanche-bold.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: 60%;
	opacity: 0;
	transition-duration: 0.2s;
}

#selecteur-visuel-filtres ul li.filtre.active::before {
	opacity: 1;
}

#selecteur-visuel-filtres ul li.filtre.active {
	box-shadow: inset 0 0 0 1px var(--color-projet-corpo);
	color: var(--color-projet-corpo);
}

#selecteur-visuel-filtres ul li.filtre.active.dispo {
	box-shadow: inset 0 0 0 1px var(--color-selecteur-dispo);
	color: var(--color-selecteur-dispo);
}

#selecteur-visuel-filtres ul li.filtre.dispo::before {
	background-color: var(--color-selecteur-dispo);
}

#selecteur-visuel-filtres ul li.filtre.active.reser {
	box-shadow: inset 0 0 0 1px var(--color-selecteur-reser);
	color: var(--color-selecteur-reser);
}

#selecteur-visuel-filtres ul li.filtre.reser::before {
	background-color: var(--color-selecteur-reser);
}

#selecteur-visuel-filtres ul li.filtre.active.vendu {
	box-shadow: inset 0 0 0 1px var(--color-selecteur-vendu);
	color: var(--color-selecteur-vendu);
}

#selecteur-visuel-filtres ul li.filtre.vendu::before {
	background-color: var(--color-selecteur-vendu);
}

/* SELECTEUR ILLUSTRATION */

#selecteur-visuel-illustration {
  position: relative;
  flex: 1;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}

#selecteur-visuel-fixe-etage,
#selecteur-visuel-fixe-appt {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

#selecteur-visuel-fixe-etage img, #selecteur-visuel-fixe-appt svg {
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* SVG */

.cls-1 { fill: none; }
.cls-2 { fill: #ebeae8; /* batiment clair */ }
.cls-3 { fill: #a0b186; } /* panneaux solaires */
.cls-5 { fill: #a7c4c6; }
.cls-7 { fill: #ddd; }
.cls-8 { fill: #bccca4; } /* Herbe */
.cls-9 { fill: #bcbba6; }
.cls-11 { fill: #f4f4f4; }
.cls-12 { fill: #b2c29b; }
.cls-13 { fill: #D7D2CF; } /* batiment sombre */
.cls-15 { fill: #d8d8d8; }
.cls-18 { fill: #a0a0a0; }
.cls-19 { fill: #9eaf73; }
.cls-21 { fill: #a7bc7d; }
.cls-14, .cls-22 { fill: #d6d4d2; } /* bois clair */
.cls-23 { fill: #C3BFB4; } /* bois sombre */
.cls-24 { fill: #fff; }
.cls-25 { fill: #8ca9ad; /* vitre sombre */ }
.cls-27 { fill: #CFC0B5; /* rouge sombre */ }
.cls-28 { fill: #bfbebe; mix-blend-mode: multiply; }
.cls-30 { fill: #cecbbb; }
.cls-31 { fill: #d4dec7 } /* vert clair */
.cls-33 { fill: #B1BCAB } /* vert sombre */
.cls-35 { fill: #cac9c9; }
.cls-36 { fill: #cbcbcb; }
.cls-37 { fill: #e0d8d0 } /* rouge clair */
.cls-38 { fill: #b2afaf; } /* Ombre */
.cls-39 { fill: #b1c4c7; } /* Couleur fenètres */
.cls-40 { fill: #D6D6D6; }

/* TEINTES LOT */

g.lot polygon.cls-6, g.lot path.cls-6 { fill: #E8E8E8; transition-duration: 0.2s; } /*+*/
g.lot polygon.cls-34, g.lot path.cls-34 { fill: #D6D6D6; transition-duration: 0.2s; } /*++*/
g.lot polygon.cls-32, g.lot path.cls-32 { fill: #B5B5B5; transition-duration: 0.2s; } /*+++*/

g.lot.polyDisponible polygon.cls-6, g.lot.polyDisponible path.cls-6 { fill : rgba(197,228,194,1); }
g.lot.polyDisponible polygon.cls-34, g.lot.polyDisponible path.cls-34 { fill : rgba(174,202,170,1); }
g.lot.polyDisponible polygon.cls-32, g.lot.polyDisponible path.cls-32 { fill : rgba(147,173,145,1); }

g.lot.polyReserve polygon.cls-6, g.lot.polyReserve path.cls-6 { fill : rgba(252,217,177,1); }
g.lot.polyReserve polygon.cls-34, g.lot.polyReserve path.cls-34 { fill : rgba(226,197,168,1) ; }
g.lot.polyReserve polygon.cls-32, g.lot.polyReserve path.cls-32 { fill : rgba(196,164,130,1); }

g.lot.polyVendu polygon.cls-6, g.lot.polyVendu path.cls-6 { fill : rgba(242,155,153,1); }
g.lot.polyVendu polygon.cls-34, g.lot.polyVendu path.cls-34 { fill : rgba(216,132,132,1); }
g.lot.polyVendu polygon.cls-32, g.lot.polyVendu path.cls-32 { fill : rgba(191,107,107,1); }

/*

g.lot.polyDisponible polygon.cls-6, g.lot.polyDisponible path.cls-6 { fill : rgba(137,206,156,1); }
g.lot.polyDisponible polygon.cls-34, g.lot.polyDisponible path.cls-34 { fill : rgba(117,175,131,1); }
g.lot.polyDisponible polygon.cls-32, g.lot.polyDisponible path.cls-32 { fill : rgba(87,130,97,1); }

g.lot.polyReserve polygon.cls-6, g.lot.polyReserve path.cls-6 { fill : rgba(252,205,142,1); }
g.lot.polyReserve polygon.cls-34, g.lot.polyReserve path.cls-34 { fill : rgba(209,170,124,1) ; }
g.lot.polyReserve polygon.cls-32, g.lot.polyReserve path.cls-32 { fill : rgba(163,131,93,1); }

g.lot.polyVendu polygon.cls-6, g.lot.polyVendu path.cls-6 { fill : rgba(237,106,97,1); }
g.lot.polyVendu polygon.cls-34, g.lot.polyVendu path.cls-34 { fill : rgba(207,90,87,1); }
g.lot.polyVendu polygon.cls-32, g.lot.polyVendu path.cls-32 { fill : rgba(169,73,71,1); }

*/

g.lot { transition-duration: 0.4s; cursor: pointer; opacity: 1; }

g.lot.polyDisponible:hover, g.lot.polyDisponible.polyClic,
g.lot.polyReserve:hover, g.lot.polyReserve.polyClic,
g.lot.polyVendu:hover, g.lot.polyVendu.polyClic {
  transform: translate(0 , -14px);
  opacity: 1;
}

g.lot.polyDisponible.polyClic polygon.cls-6, g.lot.polyDisponible.polyClic path.cls-6 { fill : rgba(137,206,156,1); }
g.lot.polyDisponible.polyClic polygon.cls-34, g.lot.polyDisponible.polyClic path.cls-34 { fill : rgba(117,175,131,1); }
g.lot.polyDisponible.polyClic polygon.cls-32, g.lot.polyDisponible.polyClic path.cls-32 { fill : rgba(87,130,97,1); }

g.lot.polyDisponible:hover polygon.cls-6, g.lot.polyDisponible:hover path.cls-6 { fill : rgba(137,206,156,1); }
g.lot.polyDisponible:hover polygon.cls-34, g.lot.polyDisponible:hover path.cls-34 { fill : rgba(117,175,131,1); }
g.lot.polyDisponible:hover polygon.cls-32, g.lot.polyDisponible:hover path.cls-32 { fill : rgba(87,130,97,1); }

g.lot.polyReserve.polyClic polygon.cls-6, g.lot.polyReserve.polyClic path.cls-6 { fill : rgba(252,205,142,1); }
g.lot.polyReserve.polyClic polygon.cls-34, g.lot.polyReserve.polyClic path.cls-34 { fill : rgba(209,170,124,1) ; }
g.lot.polyReserve.polyClic polygon.cls-32, g.lot.polyReserve.polyClic path.cls-32 { fill : rgba(163,131,93,1); }

g.lot.polyReserve:hover polygon.cls-6, g.lot.polyReserve:hover path.cls-6 { fill : rgba(252,205,142,1); }
g.lot.polyReserve:hover polygon.cls-34, g.lot.polyReserve:hover path.cls-34 { fill : rgba(209,170,124,1); }
g.lot.polyReserve:hover polygon.cls-32, g.lot.polyReserve:hover path.cls-32 { fill : rgba(163,131,93,1); }

g.lot.polyVendu.polyClic polygon.cls-6, g.lot.polyVendu.polyClic path.cls-6 { fill : rgba(237,106,97,1); }
g.lot.polyVendu.polyClic polygon.cls-34, g.lot.polyVendu.polyClic path.cls-34 { fill : rgba(207,90,87,1); }
g.lot.polyVendu.polyClic polygon.cls-32, g.lot.polyVendu.polyClic path.cls-32 { fill : rgba(169,73,71,1); }

g.lot.polyVendu:hover polygon.cls-6, g.lot.polyVendu:hover path.cls-6 { fill : rgba(237,106,97,1); }
g.lot.polyVendu:hover polygon.cls-34, g.lot.polyVendu:hover path.cls-34 { fill : rgba(207,90,87,1); }
g.lot.polyVendu:hover polygon.cls-32, g.lot.polyVendu:hover path.cls-32 { fill : rgba(169,73,71,1); }

/*

g.lot.polyDisponible.polyClic polygon.cls-6, g.lot.polyDisponible.polyClic path.cls-6 { fill : rgba(175,239,190,1); }
g.lot.polyDisponible.polyClic polygon.cls-34, g.lot.polyDisponible.polyClic path.cls-34 { fill : rgba(153,214,165,1); }
g.lot.polyDisponible.polyClic polygon.cls-32, g.lot.polyDisponible.polyClic path.cls-32 { fill : rgba(114,155,122,1); }

g.lot.polyDisponible:hover polygon.cls-6, g.lot.polyDisponible:hover path.cls-6 { fill : rgba(175,239,190,1); }
g.lot.polyDisponible:hover polygon.cls-34, g.lot.polyDisponible:hover path.cls-34 { fill : rgba(153,214,165,1); }
g.lot.polyDisponible:hover polygon.cls-32, g.lot.polyDisponible:hover path.cls-32 { fill : rgba(114,155,122,1); }

g.lot.polyReserve.polyClic polygon.cls-6, g.lot.polyReserve.polyClic path.cls-6 { fill : rgba(252,217,177,1); }
g.lot.polyReserve.polyClic polygon.cls-34, g.lot.polyReserve.polyClic path.cls-34 { fill : rgba(226,197,168,1) ; }
g.lot.polyReserve.polyClic polygon.cls-32, g.lot.polyReserve.polyClic path.cls-32 { fill : rgba(196,164,130,1); }

g.lot.polyReserve:hover polygon.cls-6, g.lot.polyReserve:hover path.cls-6 { fill : rgba(252,217,177,1); }
g.lot.polyReserve:hover polygon.cls-34, g.lot.polyReserve:hover path.cls-34 { fill : rgba(226,197,168,1); }
g.lot.polyReserve:hover polygon.cls-32, g.lot.polyReserve:hover path.cls-32 { fill : rgba(196,164,130,1); }

g.lot.polyVendu.polyClic polygon.cls-6, g.lot.polyVendu.polyClic path.cls-6 { fill : rgba(242,155,153,1); }
g.lot.polyVendu.polyClic polygon.cls-34, g.lot.polyVendu.polyClic path.cls-34 { fill : rgba(216,132,132,1); }
g.lot.polyVendu.polyClic polygon.cls-32, g.lot.polyVendu.polyClic path.cls-32 { fill : rgba(191,107,107,1); }

g.lot.polyVendu:hover polygon.cls-6, g.lot.polyVendu:hover path.cls-6 { fill : rgba(242,155,153,1); }
g.lot.polyVendu:hover polygon.cls-34, g.lot.polyVendu:hover path.cls-34 { fill : rgba(216,132,132,1); }
g.lot.polyVendu:hover polygon.cls-32, g.lot.polyVendu:hover path.cls-32 { fill : rgba(191,107,107,1); }

*/

g.lot.hidePiece { display: none; }
g.lot.hideBatim { display: none; }
g.lot.hideEtage { display: none; }
g.lot.hideDispo { display: none; }

/* TEINTES LOT X */
.cls-17, .cls-4 { fill: #B5B5B5; } /*+++*/
.cls-20 { fill: #D6D6D6; } /*++*/
.cls-26, .cls-29 { fill: #E8E8E8; } /*+*/

/* MASQUE */
g.masque .cls-10 { fill: #000000; opacity: 0; }
g.masque:hover .cls-10 { fill: #000000; opacity: 0.2; }

/* ETAGE */
g.etage { transform: translate(0px,0px); transition-duration: 1s;}
g.etage.etageSelect { transform: translate(0px,0px); }
g.etage.etagePlus { transform: translate(0px,-250px); }
g.etage.etageMoins { transform: translate(0px,0px); }

/* MASQUE LES ELEMENTS DE DECORATION */
.etageSelect g.decosvg,
.etageSelect g.masque { display: none; }

/* LEGENDE */

ul#selecteur-legende {
  position: absolute;
  display: table;
  table-layout: fixed;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 10%;
}

ul#selecteur-legende li {
  display: table-cell;
  vertical-align: bottom;
  padding: 2vw 0vw 2vw 2vw;
}

ul#selecteur-legende li:nth-child(1) { width: 10%; text-align: center; }

ul#selecteur-legende li p img {
  width: 4vw;
}

ul#selecteur-legende li p {
  font-size: 0.7vw;
  line-height: 1vw;
  letter-spacing: 0.07vw;
  text-transform: uppercase;
}

/* FORMULAIRE */

#fenetre-formulaire {
  position: absolute;
  top: -200vh;
  left: 50%;
  width: 84%;
  max-width: 1000px;
  height: auto;
  background-color: white;
  transform: translate(-50%, -50%);
  border: 2px solid var(--color-projet-tonique);
  box-shadow: 0 0 0 30px white;
  z-index: 1000;
  transition-duration: 1s;
} #fenetre-formulaire.active { top: 50%; }

#fenetre-formulaire-contenu {
  font-family: 'SansRegular', sans-serif;
  position: relative;
  width: 90%;
  margin: 4vh auto;
  color: var(--color-gris-moyen);
}

table#tableauLotDemande {
  width: 100%;
  margin: 0 auto 2vh auto;
  table-layout: fixed;
}

table#tableauLotDemande thead tr td {
  padding: 0 0 2vh 0;
}

table#tableauLotDemande tr td {
  padding: 0.4vh 0;
}

table#tableauLotDemande tr td {
  font-size: 0.8vw;
  line-height: 1vw;
  text-transform: uppercase;
}

p.intro-formulaire-demande {
  text-align: center;
  text-transform: uppercase;
  font-size: 1vw;
  line-height: 1.4vw;
}

#fermeture-demande {
  position: absolute;
  width: 3vh;
  height: 3vh;
  top: 0px;
  right: 0px;
  background-color: var(--color-projet-tonique);
  cursor: pointer;
}

#fermeture-demande span {
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: white;
  width: 60%;
  height: 2px;
  transition-duration: 0.4s;
}

#fermeture-demande span:nth-child(1) { transform: translate(-50%, -50%) rotate(45deg); }
#fermeture-demande span:nth-child(2) { transform: translate(-50%, -50%) rotate(-45deg); }

#fermeture-demande:hover span:nth-child(1) { transform: translate(-50%, -50%) rotate(-45deg); }
#fermeture-demande:hover span:nth-child(2) { transform: translate(-50%, -50%) rotate(45deg); }