title: CSS Gradient animation not working
body: <p>I'm trying to make animated CSS gradient background, I'm generating CSS for gradient on this page: <a href="http://www.gradient-animator.com/" rel="noreferrer">http://www.gradient-animator.com/</a>
  Here is the css:</p>
  
  <pre><code>body {
  background: linear-gradient(270deg, #18f0b8, #18a2f0, #db5640);
  background-size: 600% 600%;
  -webkit-animation: Gradient 60s ease infinite;
  -moz-animation: Gradient 60s ease infinite;
  animation: Gradient 60s ease infinite;
  @-webkit-keyframes Gradient {
      0%{background-position:0% 50%}
      50%{background-position:100% 50%}
      100%{background-position:0% 50%}
  }
  @-moz-keyframes Gradient {
      0%{background-position:0% 50%}
      50%{background-position:100% 50%}
      100%{background-position:0% 50%}
  }
  @keyframes Gradient { 
      0%{background-position:0% 50%}
      50%{background-position:100% 50%}
      100%{background-position:0% 50%}
  }
  }
  </code></pre>
  
  <p>It outputs gradient fine, but it wont animate it. Am I missing something?
  Here is the fiddle: <a href="http://jsfiddle.net/9s9g6ktu/" rel="noreferrer">http://jsfiddle.net/9s9g6ktu/</a></p>