.hidden {
    display: none;
}

.interactive-map {
	border: solid 1px #b5c5ef;
	border-radius: 15px;
	display: flex;
	max-height: 810px;
}

.interactive-map .map_container {
	background-color: #f8f9fc;
	border-radius: 0 15px 15px 0;
  } 

.interactive-map .map {
	position: relative;
	margin: 60px;
}

.interactive-map .list {
	position: relative;
	padding: 24px;
	list-style: none;
	border-right: solid 1px #b5c5ef;
	width: 342px;
	flex-shrink: 0;
	overflow-y: scroll;
	overflow-x: hidden;
}

.interactive-map .list::-webkit-scrollbar {
	width: 15px;
}
.interactive-map .list::-webkit-scrollbar-thumb {
	width: 5px;
	border-radius: 10px;
	background: #1145cc;
	border: solid white 5px;
}

.interactive-map .list img {
height: 150px;
object-fit: cover;
}

.interactive-map .list dt {
	border-bottom: solid 1px #b5c5ef;
}
.interactive-map .list dt button {
	font-family: "Futura", Sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	color: var( --e-global-color-text );
	border: none;
	background-color: transparent;
	white-space: normal;
	text-align: left;
	color: #1A1A1A;
	cursor: pointer;
	width: 100%;
	padding: 15px 24px;
}
.interactive-map .list dt button.highlight,
.interactive-map .list dt button:hover,
.interactive-map .list dt button:focus,
.interactive-map .list dt button[aria-expanded="true"] {
	color: #1145cc;
}

.interactive-map .list dd {
	position: relative;
    padding: 24px;
    margin: 10px 0;
    background-color: #e7ecfa;
    margin-inline-start: 0px;
    border-radius: 8px; 
} 


.interactive-map .card .close {
	border: none;
	padding: 0;
	background: transparent;
	position: absolute;
	right: 16px;
	top: 16px;
	border-radius: 100%;
	height: 25px;
}

.interactive-map .card .close > svg {
	stroke: #1A1A1A;
}
.interactive-map .card .close:focus > svg,
.interactive-map .card .close:hover > svg {
	stroke: #1145cc;
}
.interactive-map .card .close:focus {
	outline: solid 1px #1145cc;
	outline-offset: -1px;
}

.interactive-map .card img {
	border-radius: 4px;
}
.interactive-map .card a.button {
	display: block;
	color: #1145cc;
	border: solid 1px #1145cc;
	border-radius: 10px;
	padding: 12px 16px;
	text-align: center;
	box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.08);
	margin-bottom: 12px;
	line-height: 22px;
}
.interactive-map .card a.button:hover {
	background-color: #ffffff;
	outline: 2px solid #1145cc;
	outline-offset: 2px;
}
.interactive-map .card a.button:focus {
	background-color: #ffffff;
}

ul.places {
	list-style-type: none;
  }

  .interactive-map .places li {
	position: absolute;
	max-width: 150px;
}
.interactive-map .places li:before {
	content: url("data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' width='25' height='24' viewBox='0 0 25 24'><path fill='%2325314C' d='M12.8467 2.25C8.02168 2.25 4.09668 6.175 4.09668 11C4.09668 16.118 8.79367 19.2199 11.9017 21.2729L12.4307 21.624C12.5567 21.708 12.7017 21.75 12.8467 21.75C12.9917 21.75 13.1367 21.708 13.2627 21.624L13.7917 21.2729C16.8997 19.2199 21.5967 16.118 21.5967 11C21.5967 6.175 17.6717 2.25 12.8467 2.25ZM12.9657 20.021L12.8467 20.1001L12.7277 20.021C9.71768 18.033 5.59668 15.311 5.59668 11C5.59668 7.002 8.84868 3.75 12.8467 3.75C16.8447 3.75 20.0967 7.002 20.0967 11C20.0967 15.311 15.9747 18.034 12.9657 20.021ZM12.8467 7.75C11.0547 7.75 9.59668 9.208 9.59668 11C9.59668 12.792 11.0547 14.25 12.8467 14.25C14.6387 14.25 16.0967 12.792 16.0967 11C16.0967 9.208 14.6387 7.75 12.8467 7.75ZM12.8467 12.75C11.8817 12.75 11.0967 11.965 11.0967 11C11.0967 10.035 11.8817 9.25 12.8467 9.25C13.8117 9.25 14.5967 10.035 14.5967 11C14.5967 11.965 13.8117 12.75 12.8467 12.75Z'/></svg>");
	position: absolute;
	left: -25px;
	top: -5px;
}

.map-marker {
    position: relative;
}

.map-marker span {
    position: absolute;
	left: 100%;
	top: 35%;
    font-size: 12px;
	cursor: pointer;
}

.map-marker span button {
	text-decoration: none;
	color: #1A1A1A;
	border: 1px solid #1A1A1A; 
	padding: 0 5px;
	font-weight: 700;
	font-size: 20px;
	background-color: #fff;
	line-height: 1.3em; 
}

.map-marker span button:hover, 
.map-marker span button:focus,
.map-marker span button.hover-effect,
.map-marker.btn_card_open span button {
    text-decoration: underline;
	color: #ffffff;
	background-color: transparent;
	text-decoration: none;
	background-color: #1145cc;
	border: 1px solid #1145cc; 
}


.interactive-map .list dt button.hover-effect, .interactive-map .list dt button.btn_card_open {
	color: #1145cc;
}



@media (max-width: 1080px) {
	.interactive-map {
		height: 632px;
		width: fit-content;
	}
 
    .interactive-map .map {
		height: 457px;
		margin: 87px 24px;
	}
	.interactive-map .map svg {
		width: 448px;
		height: 457px;
	}
	.interactive-map .list {
		height: 632px;
	}
	.interactive-map .places {
		font-size: 10.57px;
	}
}

@media (max-width: 845px) {
	.interactive-map {
		width: calc(100vw - 48px);
	}
	.interactive-map .map {
		display: none;
	}
	.interactive-map .list {
			width: 100%;
		border-right: none; 
	}
	.interactive-map .list dd .card {
		height: calc(100% - 1px);
	}
	.interactive-map .list dd .card img {
		max-height: 192px;
		width: 100%;
		object-fit: contain;
	}
}