
.promo-banner {
	--button-space: 15px;
	--button-size: 28px;
	--content-width: var(--wd-max-width);
	position: relative;
	overflow: hidden;
	border-radius: var(--wd-brd-radius);
	-webkit-mask-image: -webkit-radial-gradient(white, black);
}

.promo-banner .banner-image :is(img, picture) {
	width: 100%;
	height: var(--wd-img-height);
	object-fit: cover;
	object-position: inherit;
}

.promo-banner .banner-image[style*="height"] :is(img, picture) {
	height: 100%;
}

.promo-banner .wrapper-content-banner {
	z-index: 2;
	display: flex;
	overflow: hidden;
	padding: 30px;
	border-radius: var(--wd-brd-radius);
}

.promo-banner .content-banner {
	position: relative;
	width: 100%;
	max-width: var(--content-width);
}

.promo-banner .content-banner>div:first-child {
	margin-top: 0;
}

.promo-banner .banner-title-wrap :is(.banner-subtitle, .banner-title):first-child {
	margin-top: 0;
}

.promo-banner .banner-title-wrap:empty {
	display: none;
}

.promo-banner :is(.banner-subtitle, .banner-title, .banner-inner) {
	margin-top: 7px;
}

.promo-banner .wd-countdown-timer {
	margin-top: 10px;
}

.promo-banner .banner-title {
	display: block;
	margin-bottom: 0;
	line-height: 1.3;
}

.promo-banner .banner-btn-wrapper {
	margin-top: var(--button-space);
}

.promo-banner .banner-inner p:first-child:empty {
	display: none;
}

.banners-carousel-wrapper .owl-dots {
	margin-top: 10px;
}

.wd-bg-position-top {
	background-position: center top;
	object-position: center top;
}

.wd-bg-position-bottom {
	background-position: center bottom;
	object-position: center bottom;
}

.wd-bg-position-left {
	background-position: left center;
	object-position: left center;
}

.wd-bg-position-right {
	background-position: right center;
	object-position: right center;
}

.wd-bg-position-center {
	background-position: center;
	object-position: center;
}

.banner-increased-padding .wrapper-content-banner {
	padding: 7%;
}

[class*="banner-hover-zoom"] {
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

[class*="banner-hover-zoom"] .banner-image {
	transition: transform .5s cubic-bezier(0, 0, .44, 1.18);
}

[class*="banner-hover-zoom"]:hover .banner-image {
	transform: scale(1.09);
}

.banner-hover-zoom-reverse .banner-image {
	transform: scale(1.09);
}

.banner-hover-zoom-reverse:hover .banner-image {
	transform: none;
}

:is(.banner-hover-background, .banner-hover-border) {
	backface-visibility: hidden;
}

:is(.banner-hover-background, .banner-hover-border) .banner-image {
	transition: transform 1s cubic-bezier(0, 0, .44, 1.18);
}

:is(.banner-hover-background, .banner-hover-border):hover .banner-image {
	transform: scale(1.09);
}

:is(.banner-hover-background:not(.banner-background), .banner-hover-border:not(.banner-border)) .wrapper-content-banner {
	overflow: hidden;
	padding: 40px;
}

:is(.banner-hover-background:not(.banner-background), .banner-hover-border:not(.banner-border)) .wrapper-content-banner:after {
	content: "";
	position: absolute;
	top: 20px;
	right: 20px;
	bottom: 20px;
	left: 20px;
	z-index: 2;
	opacity: 0;
	border-radius: var(--wd-brd-radius);
	transition: transform .35s cubic-bezier(.05, .2, .1, 1), opacity .35s cubic-bezier(.05, .2, .1, 1);
	transform: scale(.5);
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

:is(.banner-hover-background:not(.banner-background), .banner-hover-border:not(.banner-border)) .content-banner {
	z-index: 4;
}

:is(.banner-hover-background:not(.banner-background), .banner-hover-border:not(.banner-border)):hover .wrapper-content-banner:after {
	opacity: 1;
	transform: scale(1);
}

:is(.banner-hover-background.banner-border, .banner-hover-border.banner-background) .wrapper-content-banner {
	padding: 30px;
}

:is(.banner-hover-background.banner-border, .banner-hover-border.banner-background) .wrapper-content-banner:after {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.banner-hover-background:not(.banner-background) .wrapper-content-banner:after {
	background-color: rgba(var(--bgcolor-white-rgb), .9);
}

.banner-hover-border:not(.banner-border) .wrapper-content-banner:after {
	border: 5px solid rgba(255, 255, 255, .3);
}

.banner-hover-border.color-scheme-dark:not(.banner-border) .wrapper-content-banner:after {
	border-color: rgba(0, 0, 0, .1);
}

.banner-mask .wrapper-content-banner {
	background-color: rgba(0, 0, 0, .3);
	transition: background-color .5s cubic-bezier(0, 0, .44, 1.18);
}

.banner-mask.color-scheme-dark .wrapper-content-banner {
	background-color: rgba(255, 255, 255, .3);
}

.banner-mask[class*="banner-hover-zoom"]:hover .wrapper-content-banner {
	background-color: rgba(0, 0, 0, .6);
}

.banner-mask[class*="banner-hover-zoom"].color-scheme-dark:hover .wrapper-content-banner {
	background-color: rgba(255, 255, 255, .6);
}

.banner-shadow {
	box-shadow: 0 10px 20px -9px rgba(0, 0, 0, .5);
}

:is(.banner-background, .banner-border) .wrapper-content-banner {
	top: 20px;
	right: 20px;
	bottom: 20px;
	left: 20px;
	overflow: hidden;
}

.banner-background .wrapper-content-banner {
	background-color: rgba(0, 0, 0, .8);
}

.banner-background.color-scheme-dark .wrapper-content-banner {
	background-color: rgba(255, 255, 255, .8);
}

.banner-content-background .wrapper-content-banner {
	width: 100%;
	max-width: var(--content-width);
	background-color: rgba(0, 0, 0, .8);
	backface-visibility: hidden;
	perspective: 800px;
}

.banner-content-background .wrapper-content-banner.wd-items-top {
	bottom: auto;
}

.banner-content-background .wrapper-content-banner.wd-items-middle {
	top: 50%;
	bottom: auto;
	transform: translate3d(0, -50%, 0);
}

.banner-content-background .wrapper-content-banner.wd-items-bottom {
	top: auto;
}

.banner-content-background .wrapper-content-banner.wd-justify-left {
	right: auto;
}

.banner-content-background .wrapper-content-banner.wd-justify-center {
	right: auto;
	left: 50%;
	transform: translate3d(-50%, 0, 0);
}

.banner-content-background .wrapper-content-banner.wd-justify-center.wd-items-middle {
	transform: translate3d(-50%, -50%, 0);
}

.banner-content-background .wrapper-content-banner.wd-justify-right {
	left: auto;
}

.banner-content-background .content-banner {
	max-width: unset;
}

.banner-content-background.color-scheme-dark .wrapper-content-banner {
	background-color: rgba(255, 255, 255, .8);
}

.banner-border .wrapper-content-banner {
	border: 5px solid rgba(255, 255, 255, .3);
}

.banner-border.color-scheme-dark .wrapper-content-banner {
	border-color: rgba(0, 0, 0, .1);
}

@media (min-width: 1025px) {
	.banner-btn-position-hover .content-banner {
		transition: transform .25s ease;
	}
	
	.banner-btn-position-hover .banner-inner p:first-child:empty ~ p:last-child {
		margin-top: -10px;
		margin-bottom: 0;
	}
	
	.banner-btn-position-hover .banner-btn-wrapper {
		position: absolute;
		top: 100%;
		right: 0;
		left: 0;
		opacity: 0;
		transition: opacity .25s ease, transform .25s ease;
		transform: translateY(15px);
	}
	
	.banner-btn-position-hover:hover .wrapper-content-banner.wd-items-middle>div {
		transform: translateY(calc(( ( var(--button-size) + var(--button-space) ) * -1 ) / 2));
	}
	
	.banner-btn-position-hover:hover .wrapper-content-banner.wd-items-bottom>div {
		transform: translateY(calc(( var(--button-size) + var(--button-space) ) * -1));
	}
	
	.banner-btn-position-hover:hover .content-banner {
		transition: transform .3s ease;
	}
	
	.banner-btn-position-hover:hover .banner-btn-wrapper {
		opacity: 1;
		transition: opacity .4s ease, transform .4s ease;
		transform: translateY(0);
	}
	
	.banner-btn-position-hover.banner-btn-size-small {
		--button-size: 36px;
	}
	
	.banner-btn-position-hover.banner-btn-size-default {
		--button-size: 42px;
	}
	
	.banner-btn-position-hover.banner-btn-size-large {
		--button-size: 48px;
	}
	
	.banner-btn-position-hover.banner-btn-size-extra-large {
		--button-size: 56px;
	}
	
	.banner-btn-position-hover.banner-btn-style-link {
		--button-size: 24px;
	}
}

@media (min-width: 1200px) {
	.banner-increased-padding .banner-subtitle.wd-fontsize-xs {
		font-size: 1vw;
	}
	
	.banner-increased-padding .banner-subtitle.wd-fontsize-s {
		font-size: 1.1vw;
	}
	
	.banner-increased-padding .banner-subtitle.wd-fontsize-m {
		font-size: 1.3vw;
	}
	
	.banner-increased-padding .banner-title.wd-fontsize-s {
		font-size: 1.2vw;
	}
	
	.banner-increased-padding .banner-title.wd-fontsize-l {
		font-size: 1.6vw;
	}
	
	.banner-increased-padding .banner-title.wd-fontsize-xl {
		font-size: 2vw;
	}
	
	.banner-increased-padding .banner-title.wd-fontsize-xxl {
		font-size: 2.3vw;
	}
}

@media (max-width: 1199.98px) {
	.banner-subtitle.wd-fontsize-xs {
		font-size: 1vw;
	}
	
	.banner-subtitle.wd-fontsize-s {
		font-size: 1.1vw;
	}
	
	.banner-subtitle.wd-fontsize-m {
		font-size: 1.3vw;
	}
	
	.banner-title.wd-fontsize-s {
		font-size: 1.2vw;
	}
	
	.banner-title.wd-fontsize-l {
		font-size: 1.6vw;
	}
	
	.banner-title.wd-fontsize-xl {
		font-size: 2vw;
	}
	
	.banner-title.wd-fontsize-xxl {
		font-size: 2.3vw;
	}
}

@media (max-width: 1024px) {
	.banner-inner.wd-fontsize-m {
		font-size: 16px;
	}
}

@media (max-width: 768.98px) {
	.banner-btn-position-hover .banner-btn-wrapper {
		display: none;
	}
	
	.banner-btn-wrapper :is(.btn-size-default, .btn-size-large, .btn-size-extra-large) {
		padding: 5px 14px;
		min-height: 36px;
		font-size: 12px;
	}
	
	.banner-btn-wrapper .btn-style-link {
		padding: 0;
		min-height: unset;
	}
	
	.owl-items-sm-1 .banner-subtitle {
		font-size: 3vw;
	}
	
	.owl-items-sm-1 .banner-title {
		font-size: 5vw;
	}
	
	.banner-inner:is(.wd-fontsize-s, .wd-fontsize-m) {
		font-size: 14px;
	}
}

@media (max-width: 767px) {
	.promo-banner .banner-subtitle {
		font-size: 3vw;
	}
	
	.promo-banner .banner-title {
		font-size: 5vw;
	}
}

@media (min-width: 769px) and (max-width: 1024px) {
	:is(.vc_col-sm-6, .owl-items-md-2) .banner-subtitle.wd-fontsize-xs {
		font-size: 1vw;
	}
	
	:is(.vc_col-sm-6, .owl-items-md-2) .banner-subtitle.wd-fontsize-s {
		font-size: 1.3vw;
	}
	
	:is(.vc_col-sm-6, .owl-items-md-2) .banner-title.wd-fontsize-s {
		font-size: 1.6vw;
	}
	
	:is(.vc_col-sm-6, .owl-items-md-2) .banner-title.wd-fontsize-l {
		font-size: 2vw;
	}
	
	:is(.vc_col-sm-6, .owl-items-md-2) .banner-title.wd-fontsize-xl {
		font-size: 2.3vw;
	}
}

@media (min-width: 577px) and (max-width: 768.98px) {
	:is(.owl-items-sm-3, .owl-items-sm-2) .banner-subtitle {
		font-size: 2vw;
	}
	
	:is(.owl-items-sm-3, .owl-items-sm-2) .banner-title {
		font-size: 3vw;
	}
}
