Menu sluggish and buggy

My menu is cut off on the right side of the screen at https://www.rethinkingmemory.com/, so I added this with the help of your wonderful support forum.
But the problem now is that the menu overlaps on the left when you hover over the menus making the transitions slugish and sometimes conflicting with each other. The mouse pointer loses the focus and you’ve got to go back up to check it.
Can you help me figure out how to fix this?
This is the css code that changes the menu on the right from being cut off on some screens.

/* Menu cut off on the right side on some Screens - MBP v Dav zb - This will prohibit it /
/

@media only screen and (min-width: 1025px) {

  #mainnav.main-navigation ul ul {

    left: auto;

    right: 0;

  }

}

/*
If Ii disable this this css entry the menu transition looks just fine but the rightmost menu is cutt off, like in this screenshot:

Can someone help me fix this?

Hello,

First thanks for using our Astrid theme!

Please maintain the custom CSS code that our colleague sent for you and add this new below at Appearance > Customize > Additional CSS:

@media(min-width: 1025px) {
    .submenu-visible {
        transition: ease all 300ms !important;
        opacity: 1 !important;
    }
    #mainnav.main-navigation ul ul:not(.submenu-visible) {
        opacity: 0 !important;
    }
}

We hope this helps!

Please try that and let us know if you need further assistance.

Kind Regards,

Rodrigo,

aThemes Support

1 Like

Wonderful! works like a charm! I love athemes and your support. Astrid is such a great theme and it is free! How can I support you for giving me all this very helpful and free support?

1 Like

Hello,

So glad to know you are enjoying with our Astrid theme and support!

Would be great if you can leave your rating about the theme and our support in the official theme repository:

Thanks!

Kind Regards,

Rodrigo,

aThemes Support