/* Auf die App-Blaupalette umgestellt (--lightblue/--blue aus site.css, dieselben Farben wie die einzelnen
   Divespot-Kreise auf der Karte) statt der Bibliotheks-Standardfarben grün/gelb/orange. Je größer der Cluster
   (small -> medium -> large), desto dunkler das Blau. */
.marker-cluster-small {
	background-color: rgba(110, 179, 200, 0.6); /* --lightblue */
	}
.marker-cluster-small div {
	background-color: rgba(62, 113, 141, 0.7);
	}

.marker-cluster-medium {
	background-color: rgba(62, 113, 141, 0.6);
	}
.marker-cluster-medium div {
	background-color: rgba(30, 74, 110, 0.7);
	}

.marker-cluster-large {
	background-color: rgba(14, 48, 83, 0.6); /* --blue */
	}
.marker-cluster-large div {
	background-color: rgba(9, 33, 58, 0.75);
	}

	/* IE 6-8 fallback colors */
.leaflet-oldie .marker-cluster-small {
	background-color: rgb(110, 179, 200);
	}
.leaflet-oldie .marker-cluster-small div {
	background-color: rgb(62, 113, 141);
	}

.leaflet-oldie .marker-cluster-medium {
	background-color: rgb(62, 113, 141);
	}
.leaflet-oldie .marker-cluster-medium div {
	background-color: rgb(30, 74, 110);
	}

.leaflet-oldie .marker-cluster-large {
	background-color: rgb(14, 48, 83);
	}
.leaflet-oldie .marker-cluster-large div {
	background-color: rgb(9, 33, 58);
}

.marker-cluster {
	background-clip: padding-box;
	border-radius: 20px;
	}
.marker-cluster div {
	width: 30px;
	height: 30px;
	margin-left: 5px;
	margin-top: 5px;

	text-align: center;
	border-radius: 15px;
	font: 12px "Helvetica Neue", Arial, Helvetica, sans-serif;
	/* Heller Text für Kontrast auf dem dunkleren Blau (v.a. bei "large") - passend zum sonst
	   in der App üblichen Cream-auf-Blau-Muster (siehe .standardButton in site.css) */
	color: var(--cream, #f3ebdd);
	font-weight: bold;
	}
.marker-cluster span {
	line-height: 30px;
	}