.vcx-carousel-banners-5x {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	min-height: 140px;
	--dot-color: var(--primary);
}

.vcx-carousel-banners-5x > .ux-overlay {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	display: none;
}

.ux-drag-mode .vcx-carousel-banners-5x > .ux-overlay {
	display: block;
}

.vcx-carousel-banners-5x .ux-image-container {
	position: relative;
	container-type: inline-size;
}

.vcx-carousel-banners-5x .ux-image-container > a {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
}

.vcx-carousel-banners-5x .ux-outer-border,
.vcx-carousel-banners-5x .ux-inner-border {
	display: none;
}

.vcx-carousel-banners-5x.with-border .ux-outer-border {
	display: block;
}

.vcx-carousel-banners-5x.with-border .ux-inner-border {
	display: block;
	border-width: clamp(5px,4cqw,8px);
}

.vcx-carousel-banners-5x.with-shadow .ux-image-container {
	box-shadow: var(--box-shadow);
}

.vcx-carousel-banners-5x .ux-overlay {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	opacity: 0;
	background-color: rgba(0,0,0,0.1);
}

.vcx-carousel-banners-5x img {
	box-sizing:border-box;
	-moz-box-sizing:border-box;	
}

.vcx-carousel-banners-5x > .items {
	--margin: 18px;
	opacity: 0;
}

.vcx-carousel-banners-5x > .items.slick-initialized {
    animation-name: animation-fade-in;
    animation-duration: 1s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-delay: 0.5s;
}

.vcx-carousel-banners-5x .slick-list {
	margin: 0 calc(0px - var(--margin));
}

.vcx-carousel-banners-5x .slick-slide {
	margin: 0 var(--margin);
}

.vcx-carousel-banners-5x .slick-slide > div + div {
	margin-top: calc(var(--margin) * 1.65);
}

.vcx-carousel-banners-5x .slick-slide .item {
	position: relative;
	text-align: center;
	container-type: inline-size;
	font-size: clamp(12px, 1cqw, 14px);
}

.vcx-carousel-banners-5x .items .item .ux-title {
	margin: 0.7em auto 0;
	max-width: 80%;
	color: var(--title-color);
	line-height: 1.5em;
}

.vcx-carousel-banners-5x .items .item .ux-sub-title {
	font-size: 0.85em;
	line-height: 1.5em;
	margin: -0.20em 0 0;
}

.vcx-carousel-banners-5x .items .item[draggable="true"],
.vcx-carousel-banners-5x .items .item[draggable="true"] .ux-image-container a:not([data-action]) {
	cursor: grab !important;
}

.vcx-carousel-banners-5x .items .item .ux-image-container:hover .ux-overlay {
	animation-name: fadeIn;
	animation-duration: 0.6s;
	animation-fill-mode: forwards;
}

.vcx-carousel-banners-5x .slick-dots .slick-active button {
	background-color: var(--dot-color);
}

.vcx-carousel-banners-5x .item-toolbar {
	position: absolute !important;
	left: 0;
	bottom: 10px;
	right: 0;
	height: 30px !important;
	padding: 0 10px;
	margin: 0 !important;
	cursor: pointer;
	max-width: 100%;
	top: auto;
	transform-origin: center bottom;
	transform: scale(0.65);
	display: flex;
	justify-content: center;
	gap: 4px;
}

.vcx-carousel-banners-5x .item-toolbar a {
	cursor: pointer;
}

.vcx-carousel-banners-5x .graphite-x-info p {
	text-align: center;
	margin-top: 4px;
	font-size: 13px;
}

.vcx-carousel-banners-5x a.api[data-action="edit"] {
	position: static !important;
}

.vcx-carousel-banners-5x a.api[data-action="remove-item"] {
	position: static !important;
}

.vcx-carousel-banners-5x .command-button.settings {
	top: 20px !important;
	right: -44px !important;
}

.vcx-carousel-banners-5x a.api[data-action="remove-item"],
.vcx-carousel-banners-5x a.api[data-action="edit"] {
	width: 19px !important;
}