<svg width="100%" height="200px">
   <circle cx="0" cy="50" r="50" fill="#2098d1">
        <animate attributeName="cx" from="50" to="400" dur="2s" repeatCount="indefinite" />
   </circle>
 </svg>
/* base styles */

body {
  text-align: center;
  background: #fafafa;
  padding: 50px 0;
  text-align: center;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.