/**
 * @author alisch berlec hönow <info@abh.eu>
 * @version 4.6.6
 *
 * Mdj Component: Media
 */

.media {
	--aspect: calc( 2 / 3 );

	position: relative;
}

.media-inner {
	position: relative;
	padding-top: calc( var( --aspect ) * 100% );
}



.media__content {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 20;
}

.media-upper {
	display: flex;
	justify-content: space-between;
}



.media__mood {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}



/* ------------------------- */
@media ( min-width: 700px ) {

	.media {
		--aspect: calc( 2 / 3 );
	}
}



/* ------------------------- */
@media ( min-width: 1000px ) {

	.media {
		--aspect: calc( 4 / 3 );
	}
}