CSS Issue with menu bar

In your custom/themes/custom.less file, you'll want to modify something like this:

.module-list .megamenu>.dropdown .btn-group .dropdown-toggle { border: none; }

OK, I tried that verbatim and the box actually got thicker.

I tried

.navbar .megamenu >.dropdown .btn-group .dropdown-toggle { border: none; }

but it didnt work either

I see how that might be it but I can see how to turn that off.  I tried this but nothing.

.btn:not(.disabled):not(:active):focus {
  outline: 0px auto #074373;
  outline-offset: -2px;
}

You can just turn it off for all invisible buttons on focus, like:

.btn.btn-invisible.dropdown-toggle:focus {
  outline: none;
}

the simplest method I use (almost always in my css-reset files for sites) is 

*:focus { outline: none; }

This SHOULD remove that outline on focus for all elements, but remember, some people rely on those outlines for accessibility. so i usually add replacement styles of some appropriate type to still highlight the focused items