Codepen Code not working

Site URL: https://helix-marigold-76hn.squarespace.com/

I need a secondary menu with dropdown function. It works in my code pen but when i move it to squarespace it doesn't seem to work, on desktop but works on mobile. any suggestions?

codepen: https://codepen.io/jilldiane/pen/ZEKXdpe

site:https://helix-marigold-76hn.squarespace.com/
pw: 1234

thanks

Hi.

the situation is more complex in your live site because you have many more elements. The code you've written is working as expected but the layers you want to see are hiding behind other elements drawn by squarespace. 

To remedy this you need to bump up the z-Index of your sub menus. You've got a rule in your site css that looks something like this (which kicks in at wider "desktop" levels). just edit it as below to add a zindex, this is essentially a "bring to front" command.

@media (min-width: 800px)
.main-navigation ul ul {
    display: none;
    position: absolute;
    z-index: 100;
}

That should answer your question as you posed it.

That worked!! Thank you so so much! I really appreciate it!!!