First of all let me thank everyone for the great replies, they've been very helpful.

Based on the advise and my own findings, I've removed all styles relating to the menu and moved them into my skin.css file and left all the other .css files with empty definitions. This makes it very easy to track down odd style rendering. For the most part, through trial and error, I've been able to determine how the menu styles effect different parts of the menu. But I'm still confused on a few things.

Here are my assumptions/findings so far:

.MainMenu_MenuContainer: Controls styling of the entire container, not the individual menu items.

.MainMenu_MenuBar: Don't know what this does. When I set a height property, it does effect the spacing between main menu items, but I can't set borders or background colors.

.MainMenu_MenuItem: Controls styling of the sub-menu items. This is where I'm confused because I would think that this style should control the main menu items (i.e. Home, Forums, Admin, Host), not sub menu items.

.MainMenu_MenuIcon: Controls styling of the sub-menu icon

.MainMenu_SubMenu: Like the MenuContainer, this style controls the sub menu "container".

.MainMenu_MenuBreak: Don't know what this does. I've set odd styles. E.G. 10px borders, fuschia backgrounds and I see no effect in the menu.

.MainMenu_MenuItemSel: Controls the styling of selected menu items. E.G. changing the background of menu items during mouse-over, etc.

.MainMenu_MenuArrow: Don't know what this does.

.MainMenu_RootMenuArrow: Don't know what this does.

For the most part, my menu is set how I want it, except one thing. I want to put a white 1px solid border around each main menu item. That is, a border around Home and a border around Forums and a border around Admin, etc. Like so: