Trying to create drop down menu when hovered over

I'm hoping to create a menu bar across the top of the course, so participants can access various sections on demand. However, I'd like the "sub-sections" to be called out as well. Ideally I'd like the menu to drop down when you hover over the top button (similar to hovering over "E-Learning Blogs" on the top of this website).

I attached the story file to show what I've come up with to test. As far as I can tell it works, though you do have to click away from the drop down menu (layer) for it to close.

Here are my questions:

Is there a better way to design this?

Can you foresee any issues with the way I have it set up now?

Do you think it's too awkward that the menu doesn't go away unless you physically click somewhere else?

Thanks!