SCSS

by maya tominaga

HTML

<div class="car">
  <svg version="1.1" id="_x32_" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="160px" height="160px" viewBox="0 0 512 512" style="width: 140px; height: 140px; opacity: 1;" xml:space="preserve">
<style type="text/css">

	.st0{fill:#4B4B4B;}

</style>
<g>
	<path class="st0" d="M360.819,282.016c-11.672-0.016-22.359,4.75-29.984,12.406c-7.656,7.625-12.422,18.313-12.422,29.984
		c0.016,23.406,18.969,42.375,42.406,42.375c23.422,0,42.375-18.984,42.375-42.375c0.016-11.672-4.75-22.359-12.391-29.984
		C383.163,286.766,372.475,282,360.819,282.016z M360.819,345.484c-11.672-0.016-21.078-9.453-21.094-21.078
		c0-11.672,9.406-21.094,21.094-21.094c11.656,0,21.078,9.422,21.078,21.094C381.881,336.031,372.459,345.469,360.819,345.484z" style="fill: rgb(75, 75, 75);"></path>
	<path class="st0" d="M126.616,282.016c-11.688-0.016-22.344,4.75-29.984,12.406c-7.656,7.625-12.406,18.313-12.406,29.984
		c0.016,23.391,18.953,42.375,42.391,42.375c23.422,0,42.391-18.969,42.391-42.375C169.006,300.953,150.022,282.016,126.616,282.016
		z M126.616,345.484c-11.672-0.016-21.063-9.453-21.078-21.078c0-11.672,9.406-21.094,21.078-21.094
		c11.656,0.016,21.078,9.422,21.094,21.094C147.694,336.031,138.256,345.469,126.616,345.484z" style="fill: rgb(75, 75, 75);"></path>
	<path class="st0"...

SCSS

body {
  background: #fff;
  padding: 20px;
  font-family: Helvetica;
}

.car {
  position: absolute;
  top: 145px;
  left: 10px;
  width: 100%;
  height: 300px;
  background-repeat: no-repeat;
  animation: icon-move 6s infinite;
}

@keyframes icon-move {
  from {
    transform: translateX(-10%);
  }
  to {
    transform: translateX(100%);
  }
}