.stk_marquee {
	position: relative;
	background: var(--stk-marquee-bg, #000000);
	overflow: hidden;
	box-sizing: border-box;
	z-index: 1;
}

.stk_marquee::before,
.stk_marquee::after {
	content: "";
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background-image: repeating-linear-gradient(
		to right,
		var(--stk-marquee-line, #ffffff),
		var(--stk-marquee-line, #ffffff) 10px,
		transparent 10px,
		transparent 20px
	);
	z-index: 2;
}

.stk_marquee.stk_marquee--line-solid::before,
.stk_marquee.stk_marquee--line-solid::after {
	background-image: none;
	background-color: var(--stk-marquee-line, #ffffff);
}

.stk_marquee.stk_marquee--line-dotted::before,
.stk_marquee.stk_marquee--line-dotted::after {
	height: 3px;
	background-image: radial-gradient(circle, var(--stk-marquee-line, #ffffff) 1.5px, transparent 1.5px);
	background-size: 12px 3px;
	background-repeat: repeat-x;
}

.stk_marquee.stk_marquee--line-double::before,
.stk_marquee.stk_marquee--line-double::after {
	height: 6px;
	background-image:
		linear-gradient(
			to bottom,
			var(--stk-marquee-line, #ffffff) 0,
			var(--stk-marquee-line, #ffffff) 2px,
			transparent 2px,
			transparent 4px,
			var(--stk-marquee-line, #ffffff) 4px,
			var(--stk-marquee-line, #ffffff) 6px
		);
	background-repeat: repeat-x;
}

.stk_marquee.stk_marquee--line-none::before,
.stk_marquee.stk_marquee--line-none::after {
	display: none;
}

.stk_marquee__track {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

.stk_marquee__motion {
	display: flex;
	width: max-content;
	animation: stk-marquee-slide var(--stk-marquee-speed, 15s) linear infinite;
	will-change: transform;
}

.stk_marquee__sequence {
	display: flex;
	flex: 0 0 auto;
	flex-wrap: nowrap;
}

.stk_marquee__item {
	flex: 0 0 auto;
	font-family: "Montserrat", sans-serif;
	color: var(--stk-marquee-text, #ffffff);
	text-shadow:
		0 0 3px var(--stk-marquee-text, #ffffff),
		0 0 1px var(--stk-marquee-text, #ffffff),
		0 0 2px var(--stk-marquee-text, #ffffff),
		0 0 1px var(--stk-marquee-text, #ffffff),
		0 0 1px var(--stk-marquee-text, #ffffff);
	font-weight: 600;
	white-space: nowrap;
}

.stk_marquee a {
	text-decoration: none;
	color: var(--stk-marquee-text, #ffffff);
}

@keyframes stk-marquee-slide {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(var(--stk-marquee-distance, -50%));
	}
}
