title: how to smooth out css parallel circle spinning animation?
body: <p><a href="https://jsfiddle.net/7rzny4ms/1/" rel="nofollow noreferrer">https://jsfiddle.net/7rzny4ms/1/</a></p>
  
  <p>It seems to stop for second when it does a full loop. I read that the stroke-dashoffset should be the circumference or greater but it still has that delay.</p>
  
  <pre><code>&lt;svg width="100" height="100"&gt;
    &lt;g&gt;
      &lt;circle class="progress" r="40" cx="50" cy="50" fill="none" /&gt;
    &lt;/g&gt;
  &lt;/svg&gt;
  
  .progress {
    stroke: #000;
    stroke-width: 4;
    stroke-dashoffset: 0;
    stroke-dasharray: 65;
    animation: progress-indef 2s linear infinite;
  }
  
  @keyframes progress-indef {
    0% { stroke-dashoffset: 251; }
    100% { stroke-dashoffset: 0; }
  }
  </code></pre>