How to make a fully reverse animation?

Question

css

Good day.
I'm trying to do a complete reverse animation.
Now, when you click on the button, the fade animation first occurs, it lasts 0.3 seconds. After it, with a delay of the same 0.3 seconds, the next animation begins, the animation of the exit window of the form, and it also lasts 0.3 seconds
. Stumbled with reverse animation. How to do the same but in reverse order when hiding.

1. Form creeps up parallel with disappearance
   
2. After the completion of the first animation, the second one takes place - lightening the background.
   

Answer 1

https://codepen.io/topicstarter/pen/MWaKYgZ - transition-delay: 0.34s