Hi,
I am hoping that someone can help me with this problem. I have been modifying my menu.css file to change the look of the menus on my site (
www.WREFA.com). My problem is that I can't figure out how to change the color of the red box that is displayed around what is selected. Also, the sub-menus are now transparent instead of opaque. Therefore, you can see the page content right through the menus (not good). I am sure I inadvertently messed something up, but I am not sure what. I am not a programmer. Note that I also commented out the code that makes all of the menu items capitalized.
Thanks a lot,
Steve
/*--------- dnn menu style ----------*/
/* main menu td */
.mainMenu
{
cursor:pointer;
font-size: 11px;
background-color:transparent;
width:970px;
}
/* Main Menu Normal */
.mainMenu .root
{
color: #375162; /* Code to left is slate gray*/
font-size: 13px;
font-weight:bold;
text-align:center;
padding:12px 12px 12px 12px;
/* text-transform:uppercase Note: SRP Commented this out so Words in menu would not be Caps*/;
margin-right:1px;
white-space:nowrap;
margin-right:1px;
float:left;
}
/* Main menu hover >>Color Code below is slate Gray*/
.mainMenu .hov{
color:#375162;
background:url(../images/menu_hover.png) repeat-x top left;
}
/* Main menu selected */
.mainMenu .sel, .mainMenu .bc {
color:#375162;
background:url(../images/menu_active.png) repeat-x top left;
}
.mainMenu table{
border:1px solid #C0D6E5;/* powder blue */
z-index: 5000;
}
/* SUB Menu Normal
.mainMenu tr.mi{
background-color:#F8FAFF; /* white */
z-index: 1000;
font-size: 11px;
font-weight:bold;
text-align:left;
color:#375162;
line-height:2em;
text-transform:none;
}
.mainMenu tr.mi td{
padding: 0 2px;
text-transform:none;
}
/* SUB Menu hover & selected >>>Color Code below is sky blue*/
.mainMenu tr.hov {
background: #1077C3 url(../images/submenu_hover.png) repeat-x top left;
}
.mainMenu tr.hov td{
color:#1077c3; /* Sky Blue */
}
.mainMenu tr.sel, .mainMenu tr.bc{
background: #1077c3 url(../images/submenu_active.png) repeat-x top left;
}
.mainMenu tr.sel td, .mainMenu tr.bc td{
color:#1077c3;
}
.main_dnnmenu_break{
height: 2px;
background-color: #1077c3;
}
/* Module Action Menus */
.ModuleTitle_SubMenu
{
border:1px solid #C0D6E5;
}
.ModuleTitle_SubMenu td{
background-color:#F8FAFF; /* Color code is white*/
white-space: nowrap;
}
.ModuleTitle_MenuIcon {
background-color:#F8FAFF;
border:none;
padding: 0px 2px;
}
.ModuleTitle_MenuItemSel td, .ModuleTitle_MenuItemSel .ModuleTitle_MenuIcon{
background: #ef883c /* orange */ url(../images/submenu_hover.png) repeat-x top left;
color: #ef883c;
}
.ModuleTitle_MenuBreak td, .ModuleTitle_MenuBreak .ModuleTitle_MenuIcon
{
height: 2px;
background-color: #D5E0FF;