Enhance spacing between menu and sub menu

Dear GP-Support,

as written in the title I was trying to get a little more space between a main menu item and the expanding sub menu.

I found the following code in this support forum that solved the issue visually for me.

@media (min-width: 769px) {
    .main-navigation ul ul {
        margin-top: 0.5em;
    }
}

However, when I have this code active in css, I can't move the mouse to the sub menu item, before I reach that, the menu already closes. So I suppose the code is not really working for my site or I did something wrong.

I disabled the code now. Looking forward to you thoughts!