.dist--button span {
	text-decoration: underline;
}

.dist--container {
	padding-top: 90px;
	padding-bottom: 60px;
}

.dist--section {
	display: none;
}

.APARTMENTS-layer-active .district--apartments {
	display: block;
}

.OFFICE-layer-active .district--office {
	display: block;
}

.TRANSIT-layer-active .district--transit {
	display: block;
}

.SHOPS_RESTAURANTS-layer-active .district--shops {
	display: block;
}

.district-map-wrap:not(.OFFICE-layer-active):not(.APARTMENTS-layer-active):not(.TRANSIT-layer-active):not(.SHOPS_RESTAURANTS-layer-active) .district--viewpoints,
.VIEWPOINTS-layer-active .district--viewpoints {
	display: block;
}

#VIEWPOINTS,
#SHOPS_RESTAURANTS,
#TRANSIT,
#APARTMENTS,
#OFFICE {
	cursor: pointer;
	
}

#Hotel-Outline-2,
#Transit-Outline-2,
#Apartments-Outline,
#Apartments-Outline,
#Office-Outline {
	pointer-events: all;
	pointer-events: bounding-box;
	cursor: pointer;
}

#VIEWPOINTS:not(.active) #Viewpoints-2,
#SHOPS_RESTAURANTS:not(.active) #Shops_Restaurants-2,
#TRANSIT:not(.active) #Transit-2,
#APARTMENTS:not(.active) #Apartments-2,
#OFFICE:not(.active) #Office-2 {
	fill-opacity: 0;
}

#VIEWPOINTS:not(.active):hover #Viewpoints-2,
#SHOPS_RESTAURANTS:not(.active):hover #Shops_Restaurants-2,
#TRANSIT:not(.active):hover #Transit-2,
#APARTMENTS:not(.active):hover #Apartments-2,
#OFFICE:not(.active):hover #Office-2 {
	fill-opacity: 0.3;
}

.district-map-wrap:not(.OFFICE-layer-active):not(.district-map-initial) #Selected_Buildings_Office_ .cls-3 {
	fill: transparent;
}

.district-map-wrap:not(.APARTMENTS-layer-active):not(.district-map-initial) #Selected_Buildings_Apartments_ .cls-5 {
	fill: transparent;
}

.district-map-wrap:not(.TRANSIT-layer-active):not(.district-map-initial) #Selected_Buildings_Transit_ .cls-7 {
	fill: transparent;
}

.district-map-wrap:not(.SHOPS_RESTAURANTS-layer-active):not(.district-map-initial) #Shops_Restaurants-3 .cls-9 {
	fill: transparent;
}

.district-map-wrap:not(.VIEWPOINTS-layer-active):not(.district-map-initial) #Hotel_Outline.cls-12,
.district-map-wrap:not(.VIEWPOINTS-layer-active):not(.district-map-initial) #_FUTURE_HOTEL_ .cls-11,
.district-map-wrap:not(.VIEWPOINTS-layer-active):not(.district-map-initial) #Viewpoints-3 .cls-11 {
	stroke: transparent;
	fill: transparent;
}

#Office12_Overlay.active,
#Office11_Overlay.active,
#Office10_Overlay.active,  /* SHOP */
#Office9_Overlay.active,
#Office8_Overlay.active,
#Office7_Overlay.active,
#Office6_Overlay.active,
#Office5_Overlay.active,
#Office4_Overlay.active,
#Office3_Overlay.active,
#Office2_Overlay.active,
#Office1_Overlay.active,
#Transit1_Overlay.active,
#Apartments1_Overlay.active,
#Apartments2_Overlay.active,
#Apartments3_Overlay.active,
#Apartments4_Overlay.active,
#Apartments5_Overlay.active,
#Apartments6_Overlay.active,
#Apartments7_Overlay.active,
#Hotel-Overlay.active,
#Hotel-Overlay:hover,
#Office12_Overlay:hover,
#Office11_Overlay:hover,
#Office10_Overlay:hover, /* SHOP */
#Office9_Overlay:hover,
#Office8_Overlay:hover,
#Office7_Overlay:hover,
#Office6_Overlay:hover,
#Office5_Overlay:hover,
#Office4_Overlay:hover,
#Office3_Overlay:hover,
#Office2_Overlay:hover,
#Office1_Overlay:hover,
#Transit1_Overlay:hover,
#Apartments1_Overlay:hover,
#Apartments2_Overlay:hover,
#Apartments3_Overlay:hover,
#Apartments4_Overlay:hover,
#Apartments5_Overlay:hover,
#Apartments6_Overlay:hover,
#Apartments7_Overlay:hover {
	cursor: pointer;
	fill-opacity: 0;
}

[id^='shops-dot-'],
[id^='viewpoints-dot-'] {
	cursor: pointer;
}

.dist--popup-copy {
	padding: 30px;
	background: rgba(0,0,0,0.8);
}

.lity {
	background: none;
}
.lity-active,
.lity-active body {
	overflow: auto;
}

.dist--popup-copy p:last-child {
	margin-bottom: 0;
}

button.lity-close {
	display: none;
}

.dist--popup-copy {
	position: relative;
}

.dist--popup-close {
	position: absolute;
	display: block;
	top: 5px;
	right: 5px;
	height: 20px;
	width: 20px;
}

.dist--popup-close:before,
.dist--popup-close:after {
	content: "";
	height: 20px;
	border-left: 3px solid #fff;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-top: -10px;
	transform: rotate(45deg);
	transition: transform .3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.dist--popup-close:after {
	transform: rotate(-45deg);
}

.dist--popup-close:hover:after,
.dist--popup-close:hover:before {
	transform: rotate(90deg);
}

.district-map-wrap {
	display: block;
	overflow: hidden;
}

.district-map svg {
	margin-left: -2px;
	margin-right: -2px;
	margin-bottom: -2px;
	width: calc(100% + 4px);
}

#Office-Dot,
#Transit-Dot,
#Hotel-Dot,
#Apartments-Dot {
	opacity: 0;
}

.district-map-wrap[data-layer-active="Office-Outline"] #Office-Dot,
.district-map-wrap[data-layer-active="Transit-Outline-2"] #Transit-Dot,
.district-map-wrap[data-layer-active="Hotel-Outline-2"] #Hotel-Dot,
.district-map-wrap[data-layer-active="Apartments-Outline"] #Apartments-Dot {
	opacity: 1;
}

.district-map-wrap:not(.district-map-initial):not([data-layer-active="Apartments-Outline"]) #Apartments-Outlines .cls-9,
.district-map-wrap:not(.district-map-initial):not([data-layer-active="Transit-Outline-2"]) #Transit-Outline .st3,
.district-map-wrap:not(.district-map-initial):not([data-layer-active="Transit-Outline-2"]) #Transit-Outline .st4,
.district-map-wrap:not(.district-map-initial):not([data-layer-active="Transit-Outline-2"]) #Transit-Outline .st5,
.district-map-wrap:not(.district-map-initial):not([data-layer-active="Transit-Outline-2"]) #Transit-Outline .st2,
.district-map-wrap:not(.district-map-initial):not([data-layer-active="Transit-Outline-2"]) #Transit-Outline .st1,
.district-map-wrap:not(.district-map-initial):not([data-layer-active="Hotel-Outline-2"]) #Hotel-Outline,
.district-map-wrap:not(.district-map-initial):not([data-layer-active="Office-Outline"]) #Office-Outlines .cls-10 {
	stroke: transparent;
}

.district-map--container-2022 {
	position: relative;
}

.district-map--container-2022 > img {
	object-fit: contain;
	width: 100%;
	height: 100%;
}

.district-map--container-2022 .actionable {
	transition: fill .3s;
	cursor: pointer;
}

.district-map--container-2022 .actionable:hover {
	fill: rgba(0,0,0,0);
}

body.logged-in .district-map--container-2022 path:not(.actionable):hover,
body.logged-in .district-map--container-2022 polygon:not(.actionable):hover {
	opacity: .5;
	fill: #f00;
}