
.thornton-map-wrapper {
	position: relative;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	overflow: hidden;
}

.thornton-map {
	position: relative;
	width: 100%;
	height: 30vw;
	  min-height: 400px;
	  max-height: 600px;
	background: var(--body-color);
}


.thornton-map__marker {
	width: 55px;
	height: 55px;
	background: url('balloon-pin.png')no-repeat;
	background-size: contain;
	background-position: center center;
	cursor: pointer;
}


.thornton-map .maplibregl-popup {
	max-width: 260px !important;
}


.thornton-map .maplibregl-popup-content {
	padding: 1rem;
	  border-radius: 0;
	background: var(--body-color);
	color: var(--font-color);
	box-shadow:	0 5px 25px rgba(0, 0, 0, 0.15);
}


.thornton-map
.maplibregl-popup-anchor-bottom
.maplibregl-popup-tip {
	border-top-color: #ffffff;
}


.thornton-map
.maplibregl-popup-anchor-top
.maplibregl-popup-tip {
	border-bottom-color: #ffffff;
}


.thornton-map
.maplibregl-popup-anchor-left
.maplibregl-popup-tip {
	border-right-color: #ffffff;
}


.thornton-map
.maplibregl-popup-anchor-right
.maplibregl-popup-tip {
	border-left-color: #ffffff;
}


.thornton-map__popup {
	width: auto;
	display: flex;
	flex-direction: column;
	gap: 1em;
}

.thornton-map__popup-image {
	display: block;
	width: 100%;
	height: 130px;
	object-fit: cover;
	border-radius: 0.25em;
	overflow: hidden;
}

.thornton-map__popup-content {
	display: flex;
	gap: 5px;
	padding-top: 10px;
	flex-direction: column;
	text-align: center;
}

.thornton-map__popup-content strong {
	font-size: 1.375rem;
	  font-family: var(--title-font);
	  font-weight: 400;
	  text-transform: uppercase;
}

.thornton-map__popup-content a {
	font-size: 0.875rem;
	text-decoration: none;
	white-space: nowrap;
	font-weight: 400;
}

.thornton-map__popup-content a:focus-visible {
	outline: none;
}

.thornton-map .maplibregl-ctrl-top-right {
	top: 20px;
	right: 20px;
}


.thornton-map .maplibregl-ctrl-group {
	overflow: hidden;

	border-radius: 0;

	background: #ffffff;

	box-shadow:
		0 3px 15px
		rgba(0, 0, 0, 0.12);
}


.thornton-map
.maplibregl-ctrl-group
button {
	width: 38px;
	height: 38px;

	border: 0;
}


.thornton-map
.maplibregl-ctrl-group
button + button {
	border-top:
		1px solid #eeeeee;
}


.thornton-map
.maplibregl-ctrl-attrib {
	padding: 3px 6px;

	background:
		rgba(255, 255, 255, 0.8);

	font-size: 9px;
}


@media (max-width: 767px) {

	.thornton-map {
		height: 380px;
	}


	.thornton-map
	.maplibregl-ctrl-top-right {
		top: 15px;
		right: 15px;
	}


	.thornton-map__marker {
		width: 45px;
		height: 45px;
	}

}