title: CSS animated gradient not rendering
body: <p>I am using <a href="https://www.gradient-animator.com/" rel="nofollow">https://www.gradient-animator.com/</a> to generate a CSS gradient animation which does not render..</p>
  
  <p>The CSS:</p>
  
  <pre><code>.teste{
  background: linear-gradient(180deg, #000000, #19408e, #15b9ca);
  background-size: 600% 600%;
  
  -webkit-animation: Gradnt 30s ease infinite;
  -moz-animation: Gradnt 30s ease infinite;
  -o-animation: Gradnt 30s ease infinite;
  animation: Gradnt 30s ease infinite;
  
  @-webkit-keyframes Gradnt {
      0%{background-position:50% 0%}
      50%{background-position:50% 100%}
      100%{background-position:50% 0%}
  }
  @-moz-keyframes Gradnt {
      0%{background-position:50% 0%}
      50%{background-position:50% 100%}
      100%{background-position:50% 0%}
  }
  @-o-keyframes Gradnt {
      0%{background-position:50% 0%}
      50%{background-position:50% 100%}
      100%{background-position:50% 0%}
  }
  @keyframes Gradnt { 
      0%{background-position:50% 0%}
      50%{background-position:50% 100%}
      100%{background-position:50% 0%}
  }
  
  min-height:100%;
  min-width:100%;
  position:absolute;
  }
  </code></pre>
  
  <p>The fiddle: <a href="https://jsfiddle.net/yoonma8v/" rel="nofollow">https://jsfiddle.net/yoonma8v/</a></p>
  
  <p>What's going on? How can I make it work?</p>