How to fix the two-level animated menu code in css?

Question

css

I used a similar method ( jsfiddle ), one problem - due to owerflow: hidden, the second submenu is not displayed when offset relative to the main one. How can the code be improved?
If you set hover to visible, then the text of the first submenu appears earlier (instantly) than the background unfolds, this method did not work.