/* ############################################################
	080 - FOTO-/HINTERGRUNDCOLLAGE
############################################################ */

/* Modul-Raster */
 .mdl-art-080 {
	position: relative;
	width: calc(100% - 20px);
	margin-left: 20px;
}
@media screen and (min-width: 768px) {
	.mdl-art-080 {
		width: calc(100% - 50px);
		margin-left: 50px;
	}
}
@media screen and (min-width: 1600px) {
	.mdl-art-080 {
		width: calc(100% - 140px);
		margin-left: 140px;
	}
}


/* Allgemeines */
.mdl080-modul-box {
	position: relative;
	width: 100%;
}


/* Bild */
.mdl080-modul-box .picture-wrapper {
	/*z-index: 1;*/
	position: relative;
	display: block;
	width: 100%;
	height: 0;
	padding-top: 36.5625%;
	border-radius: 20px;
	overflow: hidden;
	font-size: 0;
	line-height: 0;
}
.mdl080-modul-box.home .picture-wrapper {
	padding-top: 72.5%;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
	.mdl080-modul-box .picture-wrapper img {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
@media screen and (min-width: 992px) {
	.mdl080-modul-box.home .picture-wrapper {
		padding-top: calc(100vh - 128px);
	}
}
@media screen and (min-width: 1200px) {
	.mdl080-modul-box.home .picture-wrapper {
		padding-top: calc(100vh - 215px);
	}
}


/* Text */
.mdl080-modul-box .content-wrapper {
	z-index: 2;
	position: absolute;
	left: 70px;
	bottom: 0;
	width: calc(100% - 70px);
	padding: 14px 20px 0 20px;
	border-top-left-radius: 10px;
	background-color: var(--main-color-white);
}
	.mdl080-modul-box .content-wrapper h1 {
		font-size: 1.8125rem; /* 29px */
		line-height: 1.2;
	}
		.mdl080-modul-box .content-wrapper h1 span {
			color: var(--main-color-1);
		}
@media screen and (min-width: 768px) {
	.mdl080-modul-box .content-wrapper {
		left: 140px;
		width: calc(100% - 140px);
		padding: 20px 25px 0;
		border-top-left-radius: 20px;
	}
		.mdl080-modul-box .content-wrapper h1 {
			font-size: 2.9375rem; /* 47px */
		}
}
@media screen and (min-width: 992px) {
	.mdl080-modul-box .content-wrapper {
		left: calc(var(--col) + (var(--gap) - 25px));
		width: calc((5 * var(--col)) + (5 * var(--gap)));
		padding-bottom: 43px;
		border-top-right-radius: 20px;
	}
}
@media screen and (min-width: 1400px) {
	.mdl080-modul-box .content-wrapper {
		left: calc(var(--col) + (var(--gap) - 35px));
		padding: 27px 35px 50px;
	}
		.mdl080-modul-box .content-wrapper h1 {
			font-size: 3.375rem; /* 54px */
		}
}