.okthemes-marquee-carousel {
    position: relative;
    width: 100%;
    overflow: hidden;
    display: flex;
    gap: 10px;
}

.marquee-content {
    display: grid
;
    grid-auto-flow: column;
    grid-auto-columns: 14rem;
    gap: var(--gap, 20px);
    justify-content: center;
    align-items: center;

    animation: marquee-scroll var(--speed, 80s) linear infinite;
    animation-delay: calc(var(--speed, 80s) * -1);
}

.marquee-content.right {
    animation-name: marquee-scroll-right;
}

.marquee-content--2 {
    animation: marquee-scroll-reverse var(--speed, 80s) linear infinite;
    animation-delay: calc(var(--speed, 80s) / -2);
}
.marquee-content--2.right {
    animation-name: marquee-scroll-right-reverse;
}

.okthemes-marquee-carousel:hover .marquee-content,
.okthemes-marquee-carousel:hover .marquee-content--2,
.marquee-content:hover {
    animation-play-state: paused;
  }

.marquee-item {
    flex-shrink: 0;
    min-width: 150px;
}

.marquee-item img {
    width: auto;
    height: 140px;
    object-fit: cover;
    display: block;
}

@keyframes marquee-scroll {
    0% {
        transform: translateX(100%);
      }
      100% {
        transform: translateX(-100%);
      }
}

@keyframes marquee-scroll-reverse {
    0% {
        transform: translateX(0);
      }
    100% {
    transform: translateX(-200%);
    }
}

@keyframes marquee-scroll-right {
    0% {
        transform: translateX(-100%);
      }
      100% {
        transform: translateX(100%);
      }
}

@keyframes marquee-scroll-right-reverse {
    0% {
        transform: translateX(-200%);
      }
    100% {
    transform: translateX(0);
    }
}