:root {
	--pinfarbe: #5a6268;
	--pinkreis: #FFFFFF;
	--pinpuls: rgba(0, 0, 0, 0.3);
	--pinschatten: rgba(0, 0, 0, 0.15);
	--standardtransition: all 0.3s ease;
}

#footer {
	position: relative;
}

#karte {
	/* float: left;
	clear: both;
	width: 100%; */
	padding: 10px 0 0 0;
	position: relative;
	overflow: hidden;
}

#karte > .frame {
	height: 0;
	width: 100% !important;
	overflow: hidden;
	margin: 0;
	padding: 0;
	transition: var(--standardtransition);
}

.mapsschalter[data-toggled="on"] + #karte > .frame {
	height: 360px;
}

.mapsschalter {
	position: absolute;
    top: -20px;
	left: 50%;
    width: 30px;
    height: 30px;
    cursor: pointer;
	z-index: 4;
	margin: 0;
	transform: translateX(-50%);
}

.mapsschalter::before {
    content: '';
    border-radius: 50%;
    height: 8px;
    width: 16px;
    position: absolute;
    left: 50%;
	top: 100%;
	z-index: -1;
    margin: 2px 0 0 0;
	transform: translateX(-50%);
    background: var(--pinschatten);
}

.mapsschalter::after {
    content: '';
    border-radius: 50%;
    height: 20px;
    width: 40px;
	position: absolute;
    left: 50%;
	top: 90%;
	z-index: -1;
    transform: translateX(-50%) scale(0);
    box-shadow: 0 0 1px 2px var(--pinpuls);
    opacity: 0;
    animation-name: pulsate;
    animation-iteration-count: 4;
    animation-duration: 1s;
    animation-play-state: paused;
	display: none;
}

.mapsschalter span {
	display: block;
	border-radius: 50% 50% 50% 0;
	width: 100%;
	height: 100%;
	background: var(--pinfarbe);
	transform: rotate(-45deg);
}

.mapsschalter span::before {
    content: '';
    width: 14px;
    height: 14px;
    top: 50%;
    left: 50%;
    margin: 0;
	transform: translate(-50%, -50%);
    background: var(--pinkreis);
    position: absolute;
	border-radius: 50%;
	z-index: 2;
}

.mapsschalter:hover::after {
    display: block;
    animation-play-state: unset;
}

@keyframes pulsate {
    0% {
		transform: translateX(-50%) scale(0); 
		opacity: 0;
	}
    50% {
		opacity: 1;
	}
    100% {
		transform: translateX(-50%) scale(1); opacity: 0;
	}
}