JSFiddle - React, Tailwind, and code Playground

HTML

<div id="world">
    <img id="car" src="https://upload.wikimedia.org/wikipedia/commons/8/86/Orange_sport_car.svg" />
</div>

CSS

#world {
    position: relative;
    border: 1px solid #000;
    width: 500px;
    height: 400px;
    overflow: hidden;
    background: url(http://image.shutterstock.com/z/stock-vector-flat-design-modern-vector-illustration-icons-set-of-urban-landscape-and-city-life-building-icon-249910336.jpg) -600px -60px;
}

#car {
    position: absolute;
    height: auto;
    width: 80px;
    bottom: 55px;
    animation: car 8s ease-in-out infinite;
}

@keyframes car {
    0% {
        transform: translateX(-140px) scalex(-1);
    }
    30%, 50% {
        transform: translateX(200px) scalex(-1);
    }
    70% {
        transform: translateX(640px) translateY(-5px) rotate(-10deg) scalex(-1);
    }
    70.1% {
        transform: translateX(640px);
    }
    100% {
        transform: translateX(-200px);
    }
}