/* Main visible area */
.logo-marquee-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    position: relative;
    overflow: hidden !important;
}

/* Moving horizontal row */
.logo-marquee-wrapper .logo-marquee-track {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;

    width: max-content !important;
    min-width: max-content !important;

    gap: 30px;

    animation: logoMarqueeLeft 20s linear infinite !important;
    will-change: transform;
}

/* Each card */
.logo-marquee-wrapper .logo-marquee-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    width: 160px !important;
    min-width: 160px !important;
    max-width: 180px !important;
    min-height: 130px;

    flex: 0 0 260px !important;

    padding: 25px;

    background: #ffffff;

    border-style: solid;
    border-width: 1px;
    border-color: #a81005;
    border-radius: 20px;

    box-sizing: border-box !important;
    text-align: center;
    text-decoration: none !important;
}

/* Logo wrapper */
.logo-marquee-wrapper .logo-image {
    display: flex !important;
    align-items: center;
    justify-content: center;

    width: 100% !important;
}

/* Logo */
.logo-marquee-wrapper .logo-image img {
    display: block !important;

    width: 45%;
    max-width: 100%;

    height: auto;
    object-fit: contain;
}

/* Title */
.logo-marquee-wrapper .logo-marquee-card h4 {
    width: 100%;

    margin: 20px 0 0;

    color: #a81005;

    text-align: center;
}

/* Left direction */
.logo-marquee-track.left {
    animation-name: logoMarqueeLeft !important;
}

/* Right direction */
.logo-marquee-track.right {
    animation-name: logoMarqueeRight !important;
}

/* Pause */
.logo-marquee-wrapper.pause-hover:hover
.logo-marquee-track {
    animation-play-state: paused !important;
}

/* Animation */

@keyframes logoMarqueeLeft {

    0% {
        transform: translate3d(0, 0, 0);
    }

    100% {
        transform: translate3d(-50%, 0, 0);
    }

}

@keyframes logoMarqueeRight {

    0% {
        transform: translate3d(-50%, 0, 0);
    }

    100% {
        transform: translate3d(0, 0, 0);
    }

}

/* Tablet */

@media(max-width:1024px) {

    .logo-marquee-wrapper .logo-marquee-card {

        width: 220px !important;
        min-width: 220px !important;
        max-width: 220px !important;

        flex-basis: 220px !important;

    }

}

/* Mobile */

@media(max-width:767px) {

    .logo-marquee-wrapper .logo-marquee-card {

        width: 180px !important;
        min-width: 180px !important;
        max-width: 180px !important;

        flex-basis: 180px !important;

        min-height: 180px;

    }

}