/* ############################################################
	085 - FOTOCOLLAGE: INLINE
############################################################ */

/* Modul-Abstände */
.mdl-art-085 {
	width: calc(100% + 50px);
	margin-left: -25px;
}
@media screen and (min-width: 768px) {
	.mdl-art-085 {
		width: calc(100% + 96px);
		margin-left: -48px;
	}
}
@media screen and (min-width: 1200px) {
	.mdl-art-085 {
		width: calc(100% + 192px);
		margin-left: -96px;
	}
}
@media screen and (min-width: 1600px) {
	.mdl-art-085 {
		width: calc(100% + 280px);
		margin-left: -140px;
	}
}


/* Allgemeines */
.mdl085-modul-box {
	z-index: 2;
	position: relative;
	width: calc(100% - 50px);
	margin-left: 25px;
}
	.mdl085-modul-box .picture-wrapper {
		position: relative;
		display: block;
		width: 100%;
		height: 0;
		padding-top: 60%;
		overflow: hidden;
	}
		.mdl085-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: 768px) {
	.mdl085-modul-box {
		width: calc(100% - 100px);
		margin-left: 50px;
	}
}
@media screen and (min-width: 992px) {
	.mdl085-modul-box {
		width: calc(100% - ((4 * var(--col-width-1)) + (4 * var(--gap))));
		margin-left: calc((2 * var(--col-width-1)) + (2 * var(--gap)));
	}
}
@media screen and (min-width: 1600px) {
	.mdl085-modul-box {
		width: calc(100% - ((6 * var(--col-width-1)) + (6 * var(--gap))));
		margin-left: calc((3 * var(--col-width-1)) + (3 * var(--gap)));
	}
}


/* Fläche: Hintergrund */
.mdl085-bg-box {
	z-index: 1;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 50%;
	height: 50%;
	background-color: var(--main-color-1);
}