Okay, I nearly have it the way I want.
I've got the menu generally transparent with the first bit of code here, as given above, but color the other links accordingly, and do not call for any transparency anywhere else in the CSS, except as noted below.
Code:
div#menu1 ul.rMenu {
background: transparent !important;
border-bottom: 1px solid #000066;
}
.menu-item {
background: transparent !important;
/*border-bottom: 2px solid #000066;*/
}
/* ================================================ */
/* Page Menu item features */
/* ================================================ */
ul.rMenu li,
ul.rMenu li a:link,
ul.rMenu li a:visited {
color: #000066 !important; /*text color*/
}
ul.rMenu li a:hover,
ul.rMenu li a:active {
background: #880000 !important;
color: #ffffff !important; /*text color*/
}
This is almost where I'd like it. My chief question at the moment:
How do I change the color of the tab for the page you are presently on? It does not seem to be effected by any of
ul.rMenu li,
ul.rMenu li a:link,
ul.rMenu li a:visited, ul.rMenu li a:hover,
ul.rMenu li a:active
except where changes to those effect all of the buttons.
I think the elements I want to change are these, but I got no results when I tried them:
Code:
ul.rMenu li.current-menu-item, ul.rMenu li.current_page_item, ul.rMenu li.current-page-item {
background: #000000 !important;
color: #ffffff !important; /*text color*/
}
Any ideas?