I've been using PureCSSMenus on a series of article pages on zodiac signs. I'm also using them on the index page for these and other articles. The menus are simple, one item and several sub-items.

On the index page, they function beautifully. However, on the zodiac article pages, for some reason I'm getting a red(ish) dashed border around each sub-item. I cannot for the life of me figure out where it's getting them from.

I have a global link style that turns red with a dashed red line when the link is hovered over, and I thought that's where it must be coming from. But when I tested it by changing the colour and border-bottom style of the hovered links, the CSS menu problem remains unchanged (still has the red dashed outline around each sub-item). It happens in Firefox, Chrome and IE, and only on the zodiac article pages (not on the index page). So it has to be coming from something in those pages somehow.

Since this only shows up when I hover over the top item or the sub-items, Firebug is of limited help. Firebug does show the styles when I mouseover an item, but I can't see where it's coming from in the styles that are listed in the window.

I even went back to PureCSSMenu and got some fresh code, but the problem is still there. (Here's a sample page that uses the new code.)

I'm hoping that someone here can help me figure out where it's getting this dashed red border from, so that I can get it out of there. (Yes, I know the rest of the coding is a mess. Some day I'll do a spring cleaning of the site, but for now I must deal with only the problems.)

I would post the code or CSS but since it could be coming from a few different style sheets, I didn't think it would make sense to dump a manuscript worth of code here. If posting any of the code or if further explanation will help, let me know and I'll do what I can.

Many thanks in advance for any help with this!