Getting rid of glow outline on menu buttons

[designerwriter]

How do I get rid of the blue glow outline on the UberMenu buttons in the main menu? I did a search for CSS and pasted this code in the Theme Options CSS area but it did not work.

.ubermenu-accessible .ubermenu-item .ubermenu-target:focus{
box-shadow:none !important;
}

and I tried this one…

.x-navbar .desktop .x-nav > li:last-of-type > a:hover > span {
box-shadow: none;
}

URL: https://xpro.eagleheartdynamic.com/

I am still seeing the glow outline and box shadow in the main menu. I see it on the Brave and Chrome browsers but not on the Firefox browser. I presume this is a feature of UberMenu?

Thanks in advance.
Grace

[christian]

Hey Grace,

Because the first block of code you posted is similar to UberMenu’s suggestion, I believe you already read this article in UberMenu https://sevenspark.com/docs/ubermenu-3/faqs/accessibility-blue-glow

Please note that according to the article, it’s not recommended to remove the focus. If you wish to proceed though, follow the first code in that article which is:

.ubermenu *:focus{
    outline:none;
}

I tested that in the browser tools and it works in your site. That should be pasted completely in Theme Options > CSS.

Hope that helps.