/* @group Banner Aside Content
------------------------------------ */
.banner-aside-content {
	position: relative;
	padding-block: 25rem 10rem;
}
.banner-aside-content .row {
	height: 100%;
}
.banner-aside-content :is(.text-wrapper, .floating-text-wrapper) {
	z-index: calc(var(--z-index-lowest) + 1);
}
.banner-aside-content .multimedia-wrapper {
	position: absolute;
	inset: 0;
	width: 100%;
	z-index: var(--z-index-lowest);
}
/* Text Wrapper
----------------------*/
.banner-aside-content .text-wrapper {
	background: var(--green);
	border-radius: 1rem;
	overflow: hidden;
	padding: 5rem!important;
}
/* Multimedia Wrapper
----------------------*/
:where(#wrapper) .banner-aside-content .multimedia-wrapper {
	pointer-events: none;
}
.banner-aside-content .multimedia-wrapper .bp-multimedia {
	height: 100%;
	width: 100%;
}
.banner-aside-content .multimedia-wrapper .bp-multimedia :is(.img-box, .video-box)::before {
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: var(--overlayColor);
	z-index: calc(var(--z-index-lowest) + 1);
}
/* Floating Text Wrapper
----------------------*/
.banner-aside-content .floating-text-wrapper {
	position: absolute;
	bottom: 2rem;
	right: var(--row-mobile-padding);
}

@media only screen
and (min-width : 961px) {
	/* General
	----------------------*/
	.banner-aside-content {
		padding-block: 15rem;
	}
	/* Text Wrapper
	----------------------*/
	.banner-aside-content .text-wrapper {
		padding: 7.45rem 4.7rem!important;
	}
	/* Floating Text Wrapper
	----------------------*/
	.banner-aside-content .floating-text-wrapper {
		right: calc(2 * var(--row-default) / var(--row-columns));
	}
}
@media only screen
and (min-width : 1724px) {
	:where(#wrapper) .banner-aside-content :is(.text-wrapper) { margin-right: 0!important; }
}
@media only screen
and (min-width : 961px)
and (max-width : 1440px) {
}
@media only screen
and (min-width : 0)
and (max-width : 960px) {
	.banner-aside-content .floating-text-wrapper {
		padding-left: 4rem;
	}
}

/* @end */


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


/* Editor
------------------------------------ */
:where(.editor-styles-wrapper) .banner-aside-content .text-wrapper {
	margin-block: 15rem!important;
}
:where(.editor-styles-wrapper) .banner-aside-content .floating-text-wrapper {
	width: 100%;
	padding: 1rem;
	bottom: 0;
	background: var(--green);
}