.sim-marquee {
	width: 100%;
	max-width: 100%;
	position: relative;
}

.sim-viewport {
	width: 100%;
	overflow: hidden;
	position: relative;
}

.sim-track {
	display: flex;
	width: max-content;
	will-change: transform;
	transform: translate3d(0, 0, 0);
}

.sim-group {
	display: flex;
	align-items: center;
	flex: 0 0 auto;
	gap: 24px;
	padding-right: 24px;
}

.sim-item {
	width: 220px;
	height: 140px;
	flex: 0 0 auto;
	position: relative;
	transition-property: transform;
	transition-timing-function: ease;
	transition-duration: 300ms;
}

.sim-item img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	transition-property: transform, opacity, filter;
	transition-timing-function: ease;
	transition-duration: 300ms;
	-webkit-user-drag: none;
	user-select: none;
}

.sim-mouse-drag .sim-viewport {
	cursor: grab;
	touch-action: pan-y;
	user-select: none;
}

.sim-mouse-drag.sim-is-dragging .sim-viewport {
	cursor: grabbing;
}

.sim-hover-zoom-in .sim-item {
	overflow: hidden;
}

.sim-hover-zoom-in .sim-item:hover img {
	transform: scale(1.08);
}

.sim-hover-zoom-out .sim-item {
	overflow: hidden;
}

.sim-hover-zoom-out .sim-item img {
	transform: scale(1.08);
}

.sim-hover-zoom-out .sim-item:hover img {
	transform: scale(1);
}

.sim-hover-pop-up .sim-viewport {
	padding-top: 12px;
	margin-top: -12px;
}

.sim-hover-pop-up .sim-item:hover {
	transform: translateY(-10px);
	z-index: 2;
}

.sim-editor-empty {
	padding: 20px;
	border: 1px dashed currentColor;
	opacity: .65;
	text-align: center;
}

@media (prefers-reduced-motion: reduce) {
	.sim-track {
		transform: none !important;
	}
}