How to make animation fade in/out?

Question

css

I wanted to make a smooth appearance / disappearance of the shadow on the button. The appearance was made using a delay in the animation, but how to make the disappearance (smooth)?
https://jsfiddle.net/nek7kh64/UPD
. Shadow ripple was added via animation, so *transition solutions* don't work (or I'm doing it wrong, please correct me).