/* @group Banner Aside Content
------------------------------------ */
.banner-with-info {
	position: relative;
	padding-block: 10rem;
}
.banner-with-info .row {
	height: 100%;
}
.banner-with-info :is(.text-wrapper) {
	z-index: calc(var(--z-index-lowest) + 1);
}
/* Text Wrapper
----------------------*/
.banner-with-info .text-wrapper {
	background: rgba(255, 255, 255, 0.95);
	-webkit-backdrop-filter: blur(1rem);
	        backdrop-filter: blur(1rem);	
	border-radius: 1rem;
	overflow: hidden;
	padding: 5rem!important;
}
/* Multimedia Wrapper
----------------------*/
.banner-with-info .bp-multimedia {
	border-radius: 1rem;
	overflow: hidden;
	height: 48.2rem;
}
.banner-with-info .figcaption {
	margin: 2rem 0 0!important;
}
@media only screen
and (min-width : 961px) {
	/* General
	----------------------*/
	.banner-with-info {
		padding-block: 15rem 11.1rem;
	}
	.banner-with-info .bp-multimedia {
		height: 70rem;
	}
	/* Text Wrapper
	----------------------*/
	.banner-with-info .text-wrapper {
		padding: 10.1rem 4.7rem!important;
	}
}
@media only screen
and (min-width : 961px)
and (max-width : 1440px) {
}
@media only screen
and (min-width : 0)
and (max-width : 960px) {
	.banner-with-info .text-wrapper {
		margin: 4rem 0 0;
	}
}

/* @end */


/* Animations
------------------------------------ */
:where(#wrapper) .banner-with-info :is(.multimedia-wrapper, .text-wrapper) {
	opacity: 0;
	--duration: 1s;
}
:where(#wrapper) .banner-with-info.animateActive :is(.multimedia-wrapper, .text-wrapper) {
	animation: fade var(--duration) forwards;
	animation-delay: var(--delay, 0);
}
:where(#wrapper) .banner-with-info.animateActive :is(.multimedia-wrapper) {
    --delay: 0.1s;
}
:where(#wrapper) .banner-with-info.animateActive :is(.text-wrapper) {
    --delay: 0.4s;
}