/* @group Banner Aside Content
------------------------------------ */
.banner-aside-right {
	position: relative;
	padding-block: 10rem 18.6rem;
	border-radius: 1rem;
	overflow: hidden;
	margin: 0 3rem;
	max-width: calc(100% - 6rem);
}
.banner-aside-right .row {
	height: 100%;
}
.banner-aside-right :is(.text-wrapper) {
	z-index: calc(var(--z-index-lowest) + 1);
}
.banner-aside-right .multimedia-wrapper {
	position: absolute;
	inset: 0;
	width: 100%;
	z-index: var(--z-index-lowest);
}
/* Text Wrapper
----------------------*/
.banner-aside-right .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 3rem!important;
}
/* Multimedia Wrapper
----------------------*/
:where(#wrapper) .banner-aside-right .multimedia-wrapper {
	pointer-events: none;
}
.banner-aside-right .multimedia-wrapper .bp-multimedia {
	height: 100%;
	width: 100%;
}
.banner-aside-right .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);
}
@media only screen
and (min-width : 961px) {
	/* General
	----------------------*/
	.banner-aside-right {
		margin: 0 5.55%;
		max-width: 88.88%;
		padding-block: 15rem;
	}
	/* Text Wrapper
	----------------------*/
	.banner-aside-right .text-wrapper {
		padding: 7.45rem 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) {
}

/* @end */


/* Animations
------------------------------------ */
:where(#wrapper) .banner-aside-right :is(.multimedia-wrapper, .text-wrapper) {
	opacity: 0;
	--duration: 1s;
}
:where(#wrapper) .banner-aside-right.animateActive :is(.multimedia-wrapper, .text-wrapper) {
	animation: fade var(--duration) forwards;
	animation-delay: var(--delay, 0);
}
:where(#wrapper) .banner-aside-right.animateActive :is(.multimedia-wrapper) {
    --delay: 0.1s;
}
:where(#wrapper) .banner-aside-right.animateActive :is(.text-wrapper) {
    --delay: 0.4s;
}


/* Editor
------------------------------------ */
:where(.editor-styles-wrapper) .banner-aside-right .text-wrapper {
	margin-block: 15rem!important;
}