
/* ############################################################
	080 - FOTO-/HINTERGRUNDCOLLAGE
############################################################ */

/* Fotocollage */
.mdl080-container {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	width: 100%;
	height: calc(var(--mdl080-height, 1vh) * 100);
	overflow: hidden;
}
	.mdl080-image {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;
	}


/* Textbox */
.mdl080-text {
	opacity: 0;
	position: relative;
	width: 100%;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	-webkit-animation: fadeIn 1.2s var(--cubic-bezier) forwards;
	-moz-animation: fadeIn 1.2s var(--cubic-bezier) forwards;
	-ms-animation: fadeIn 1.2s var(--cubic-bezier) forwards;
	-o-animation: fadeIn 1.2s var(--cubic-bezier) forwards;
	animation: fadeIn 1.2s var(--cubic-bezier) forwards;
	-webkit-animation-delay: 600ms;
	-moz-animation-delay: 600ms;
	-ms-animation-delay: 600ms;
	-o-animation-delay: 600ms;
	animation-delay: 600ms;
}
	.mdl080-text h1 {
		margin-bottom: 0;
		color: var(--main-color-white);
	}
@media screen and (min-width: 768px) {
	.mdl080-text {
		padding-left: 47px;
		padding-right: 47px;
		padding-bottom: 47px;
	}
}
@media screen and (min-width: 1600px) {
	.mdl080-text {
		padding-left: 94px;
		padding-right: 94px;
		padding-bottom: 47px;
	}
}

