
/* ############################################################
	PANELS
############################################################ */

/* Panels */
.middle__panel {
	position: relative;
	width: 100%;
}


/* Abstände */
.abstand-middlepanel {
	padding: 35px 0 65px 23px; 
}
@media screen and (min-width: 768px) {
	.abstand-middlepanel {
		padding: 55px 0 80px 31px;
	}
}
@media screen and (min-width: 1200px) {
	.abstand-middlepanel {
		padding: 136px 108px; /* 100px prozentual zu 85px/50px = 58px + Gap */
	}
}
@media screen and (min-width: 1600px) {
	.abstand-middlepanel {
		padding-left: 150px;
		padding-right: 150px;
	}
}


/* Inhalt */
main {
	display: flex;
	flex-direction: column;
	padding-top: 173px;
}
body[class^="cms-"] main {
	padding-top: 224px;
}
	.main-content {
		flex: 1;
		border-top-left-radius: 15px;
		background: linear-gradient(0deg, var(--main-color-3) 0%, var(--main-color-5) 100%);
	}
@media screen and (max-width: 1199.98px) {
	/* Kopfzeile */
	.nav-metamenu-box {
		display: none;
	}
}
@media screen and (min-width: 1200px) {
	/* Kopfzeile */
	header {
		width: 350px;
	}

	/* Inhalt */
	main {
		padding-top: 0;
	}
	body[class^="cms-"] main {
		padding-top: 51px;
	}
		.main-content {
			border-top-left-radius: 0;
			border-bottom-left-radius: 0;
		}
}
@media screen and (min-width: 1600px) {
	/* Kopfzeile */
	header {
		width: 385px;
	}
}


/* ############################################################
	BILDER/ICONS
############################################################ */

/* Button: Zurück (X) */
a.btn-go-back {
	display: none;
}
@media screen and (min-width: 1200px) {
	a.btn-go-back {
		cursor: pointer;
		display: inline-block;
		position: fixed;
		top: 85px;
		right: 50px;
		width: 36px;
		height: 36px;
		overflow: hidden;
		font-size: 0;
		line-height: 0;
	}
	body[class^="cms-"] a.btn-go-back {
		top: 136px;
	}
		a.btn-go-back svg {
			display: block;
			width: 36px;
			height: 36px;
			fill: var(--main-color-2);
			transition: fill 300ms var(--cubic-bezier);
		}
		a.btn-go-back:hover svg {
			fill: var(--main-color-4);
		}
}
@media screen and (min-width: 1600px) {
	a.btn-go-back {
		top: 85px;
		right: 85px;
	}
}

