title: How to use display:none on the end of a css-animation
body: <p>I want to add a display:none property to a keyframe-animations' end. Like so:</p>
  
  <pre><code>.sw_intro{
      animation: introtop;
      animation-duration: 0.8s;
      animation-delay: 2s;
      animation-fill-mode: forwards;
  }
  
  @keyframes introtop {
      0% {margin-top: 0;display: block;}
      100%{display: none;margin-top: 100vh;}
  }
  </code></pre>
  
  <p>But the display:none-property doesn't get used. I assume that is not an error of my "code" but something that is not allowed/doable. Though I'd like to have that effect at the end of the animation and it must be something like display:none effect, not opacity:0;</p>
  
  <p>How could I do/achieve that? With jquery instead?</p>
  
  <p>Thanks!</p>