* {
    font-family: 'Inter', sans-serif;
}

#hero-home {
    background: url('../img/hero-home-bg.webp') no-repeat center center;
    background-size: cover;
}

#why-r-500{
    background: url('../img/r-500-bg.png') no-repeat center top;
    background-size: cover;
}

@media screen and (max-width: 768px) {
    #hero-home {
        background: url('../img/hero-home-bg.png') no-repeat center center;
        background-size: cover;
    }
}



@media screen and (max-width: 1024px) {
   #hero-home {
    background: url('../img/hero-home-bg.png') no-repeat ;
    background-size: cover;
} 
}

.fnt-pop {
    font-family: 'Poppins', sans-serif !important;
}

#why-rolan {
    background: url('../img/why-bg.png') no-repeat center center;
    background-size: cover;
}

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

    50% {
        transform: translateX(calc(-100% + 100vw));
    }

    100% {
        transform: translateX(0%);
    }
}

@keyframes scroll-pingpong-reverse {
    0% {
        transform: translateX(calc(-100% + 100vw));
    }

    50% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(calc(-100% + 100vw));
    }
}

.scroll-pingpong {
    animation: scroll-pingpong 20s ease-in-out infinite;
}

.scroll-pingpong-reverse {
    animation: scroll-pingpong-reverse 20s ease-in-out infinite;
}



/* Fancy box video */


.email-cards.section-3-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.email-cards.section-3-image {
    position: relative;
    height: 100%;
}

.email-card-paly {
    position: absolute;
    left: 50%;
    top: 50%;
    display: flex;
    align-items: center;
    transform: translateX(-50%) translateY(-50%);
}

.play-btn {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    display: block;
    overflow: hidden;
    position: sticky;
    border: 2px solid #4FA6F2;
    background: #4FA6F2;
}

.play-btn::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-40%) translateY(-50%);
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-left: 20px solid #ffffff;
    z-index: 100;
}