title: CSS spinning wheel stop after 5 seconds?
body: <p>I am using this CSS code I found on fiddle to spin my wheel:</p>
  
  <p><a href="http://jsfiddle.net/gaby/9Ryvs/7/">http://jsfiddle.net/gaby/9Ryvs/7/</a></p>
  
  <pre><code>div {
      margin: 20px;
      width: 100px;
      height: 100px;
      background: #f00;
      -webkit-animation-name: spin;
      -webkit-animation-duration: 4000ms;
      -webkit-animation-iteration-count: infinite;
      -webkit-animation-timing-function: linear;
      -moz-animation-name: spin;
      -moz-animation-duration: 4000ms;
      -moz-animation-iteration-count: infinite;
      -moz-animation-timing-function: linear;
      -ms-animation-name: spin;
      -ms-animation-duration: 4000ms;
      -ms-animation-iteration-count: infinite;
      -ms-animation-timing-function: linear;
  
      animation-name: spin;
      animation-duration: 4000ms;
      animation-iteration-count: infinite;
      animation-timing-function: linear;
  }
  @-ms-keyframes spin {
      from { -ms-transform: rotate(0deg); }
      to { -ms-transform: rotate(360deg); }
  }
  @-moz-keyframes spin {
      from { -moz-transform: rotate(0deg); }
      to { -moz-transform: rotate(360deg); }
  }
  @-webkit-keyframes spin {
      from { -webkit-transform: rotate(0deg); }
      to { -webkit-transform: rotate(360deg); }
  }
  @keyframes spin {
      from {
          transform:rotate(0deg);
      }
      to {
          transform:rotate(360deg);
      }
  }
  </code></pre>
  
  <p>Basically I want to stop the spinning exactly after it reaches 1800 Degress, and then go back to 0 so I can spin it again later.</p>
  
  <p>Is that possible to do?</p>