Some advice? Don't use display:none; it can make search engines ignore your text thanks to them looking for the old black-hat SEO dirtbag content cloaking trick. It's also harder to animate, such as if you wanted to use opacity and transition to fade it in/out.

You've got a perfectly good absolute positioning on there, instead of toggling block and none, you could instead left:-999em; or left:-100vw instead. Fixes the possible SEO issue, and you could add a delay to the hide state to allow other animations to have time to do their thing.

Also please, for the love of Joe, don't piss on accessibility by using PX metric fonts and other sizes. It's called EM, use 'em!