Hi there,
not sure on this, you could try this CSS:
@media(min-width: 769px) {
.main-navigation:not(.toggled) ul li[class*="current-menu-"]>ul {
left: unset;
right: 0;
top: 0;
opacity: 1;
transition-delay: 150ms;
pointer-events: auto;
height: auto;
overflow: visible;
}
body .sf-menu>li {
position: static;
}
body .main-navigation ul.menu>li>ul {
display: flex;
}
body .main-navigation ul.menu>li>ul,
body .main-navigation ul.menu>li>ul>li {
width: auto;
}
body .main-navigation ul.menu>li>ul>li a {
padding-top: 0;
padding-bottom: 0;
line-height: 60px;
}
}
It works on a Primary Navigation set to display below the header and with the Sub Menus set to Hover.