CSS animation-fill-mode property
The animation-fill-mode property specifies a style for the element when the animation is not playing.
The animation-fill-mode CSS property specifies how a CSS animation should apply styles to its target before and after it is executing(before it starts, after it ends, or both).
CSS animations do not affect the element before the first keyframe is played or after the last keyframe is played. The animation-fill-mode property can override this behavior.
This is the value you will use with animation-fill-mode property
|none||The animation will not apply any styles to the target before or after it is executing.|
|forwards||After the animation ends (as determined by its animation-iteration-count), the animation will apply the property values for the time the animation ended.|
|backwards||The animation will apply the property values defined in the keyframe that will start the first iteration of the animation, during the period defined by animation-delay property. These are either the values of the from keyframe (when animation-direction is normal or alternate) or those of the to keyframe (when animation-direction is reverse or alternate-reverse).|
|both||The animation will follow the rules for both forwards and backwards, thus extending the animation properties in both directions.|
|initial||Sets this property to its default value.|
animation-fill-modenone | forwards | backwards | both