Stopping a CSS fade animation slideshow on last frame : <p>I'm working on a CSS animation fade effect for a background image. The animation proceed normally but is coming back to the first frame. Is there a way to stop it after the last frame?</p>

<pre><code>     **
#slideshow {
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
  width:100%;
  height:100%;
  display: inline-block;
}
.elemnt,.elemnt1,.elemnt2,.elemnt3 {
    position: absolute;
    left: 0;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    display: inline-block;
    text-align: center;
    }
    .elemnt {
      animation: xfade 50s 4s ; 
      background-image: url('flip_data/2w.png');
    }
    .elemnt1 {
      animation: xfade 50s 3s;  
      background-image: url('flip_data/2f2.png');
    }
    .elemnt2 {
      animation: xfade 50s 2s;
      background-image: url('flip_data/2f1.png');
    }
    .elemnt3 {
      animation: xfade 50s 0s;
    animation-fill-mode: forwards;
      background-image: url('flip_data/page_finale_web_flip.png');**
</code></pre>
