<div id="ball"></div>
body{
  background-color:#eee;
  padding:50px;
}
#ball{
  width:100px;
  height:100px;
  border-radius:50%;
  background-color:#A94CAF;
  animation:move 2s linear;
}

@keyframes move{
  0%{
    transform:translateX(0);
  }
  100%{
    transform:translateX(400px);
  }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.