How to change the background and hover color of the CMS menu drop down ?
The Menu CSS for this is :
A{
/*color: #525252;*/
}
A:hover{
color: #0E5FD8;
text-decoration: none;
}
a, a:link, a:focus {
color: #0E5FD8;
text-decoration: none;
}
a:visited {
color: #525252;
text-decoration: none;
}
a:active, a:hover {
color: #0E5FD8;
text-decoration: none;
}
/*******************************************************************************************
Horizontal Drop down
*******************************************************************************************/
/*************************
Dropdown menu
**************************/
/* root element for dropdown */
img.menu_bullet {
/*margin-right:8px;*/
}
.cms_menu_dropdown_container {
margin: 0 !important;
padding: 0;
/* ISG Added lineitems*/
/* background: Red;*/
/* font-size: large;*/
}
.cms_menu_dropdown_container a {
display:inline;
}
div.cms_menu_dropdown_container {
line-height: inherit;
display: inline;
}
div.cms_menu_dropdown_container a {
line-height: inherit;
margin: 0px;
padding: 0px;
text-decoration: none;
display: inline-block;
}
/* menu section, containing one or more menu items */
div.cms_menu_dropdown, span.cms_menu_dropdown_section, a.cms_menu_dropdown_section {
margin: 0px;
padding: 0px;
}
ul.cms_menu_dropdown, ul.cms_menu_dropdown li {
display: inline;
list-style-position: inside;
}
/* adjust the background image position on each menu item on sprite */
.cms_menu_dropdown_container .cms_menu_dropdown_link {
background-repeat: repeat-x;
background-position: 0 bottom;
padding: 2px 6px;
border: 0px;
}
/* mouseover state */
.cms_menu_dropdown_container a:hover {
/*color: #f6f6f6;*/
background: url(gray_nav_menu.pngx) repeat-x 0 -33px;
/* ISG Added lineitems*/
background: #d3d3d3;
border: 0px;
}
.cms_menu_dropdown_container .cms_menu_dropdown_link:hover {
}
/* currently selected tabs */
DIV.cms_menu_section_blocks p{
margin: 0px;
padding: 0px;
}
.cms_menu_dropdown_container a.current {
cursor: default;
}
.cms_menu_dropdown_container .cms_menu_dropdown_link.current {
}
/* the active menu section while the menu section's items are displayed */
.cms_menu_dropdown_active {
background: #f6f6f6;
color: #0E5FD8;
}
/*******************************************************************************************
Vertical Blocks Menu cms_menu_vertical_blocks
*******************************************************************************************/
div.cms_menu_vertical_blocks_container {
border: 0px solid #e0e0e0;
}
div.cms_menu_vertical_blocks_container TABLE {
background-color: transparent;
}
td.cms_menu_title, td.cms_menu_block_item {
width:100%;
}
td.cms_menu_vertical_blocks_title h2 {
margin:0;
padding: 0px;
color: #525252;
font-weight: normal;
}
td.cms_menu_vertical_blocks_title h2 a {
margin:0;
padding: 0px;
color: #525252;
font-weight: normal;
}
td.cms_menu_section_blocks_title h2, td.cms_menu_section_blocks_title h2 a, td.cms_menu_tab_blocks_text h2 {
}
TABLE.background_transparent a.cms_menu_block_item {
font-size: inherit;
}
/*******************************************************************************************
Vertical List Menu cms_menu_vertical_blocks
*******************************************************************************************/
div.cms_menu_vertical_section_container{
margin-bottom: 12px;
}
a.cms_menu_vertical_item {
background-color: transparent;
padding: 4px 6px 4px 6px;
display: block;
color: #0E5FD8;
line-height: 38px;
}
a.cms_menu_vertical_item:hover {
background-color: #f5f8fd;
color: #424242;
}
a.cms_menu_vertical_item:active {
background-color: #f5f8fd;
}
td.cms_menu_section_navigation_title h2, td.cms_menu_section_navigation_title h2 a {
font-weight: normal;
color:#424242;
margin:0px;
padding: 0px;
margin-bottom: 6px;
}
td.cms_menu_section_navigation_title span.cms_menu_second_level_text, td.cms_menu_tab_blocks_text span.cms_menu_second_level_text {
font-weight: normal;
}
tr.cms_menu_vertical_section {
}
/*******************************************************************************************
Navigational List Style
***************************************************************************
Catalog item list DOM for cascaging
div.sc_cat_item_list_container
table.sc_cat_item_list_table
td.sc_cat_item_list_image
span.sc_cat_item_list_name
a.sc_cat_item_list_name
****************/
div.content_list_container {
margin-bottom: 12px;
/*width: 214px ;*/
border: 1px solid #d9dee2;
padding: 0px;
}
div.content_list_title {
background: #d7dee5 url(content_title.pngx) repeat-x bottom left;
font-weight: bold;
padding: .1667em .8333em;
margin: 0;
color: #094981;
overflow: hidden;
line-height: 1.3333rem;
}
div.cms_list_element {
padding: 0px 6px 0px 6px;
background-color:transparent;
border:0px;
border-bottom: 1px solid #E9E9E9;
padding-bottom:10px;
padding-top:10px;
}
div.cms_list_element_hover {
padding: 0px 6px 0px 6px;
background-color:#f7f7f7;
border:0px;
border-bottom: 1px solid #E9E9E9;
padding-bottom:10px;
padding-top:10px;
}
div.cms_list_title {
background: url(list_header.pngx) no-repeat;
font-weight: bold;
height: 2em;
text-transform: uppercase;
padding: 10px 10px 0px;
}
div.cms_list_short_description {
}
div.cms_list_short_description img {
padding-right:6px;
}
div.cms_list_published {
font-size:smaller;
}
div.content_list_menu_items a.content_list_link, div.content_list_menu_items a {
display: block;
background-color: #FFF;
padding: 4px 6px 4px 6px;
}
div.content_list_menu_items ul li {
list-style-type: none;
margin: 0px;
padding: 0px;
}
div.content_list_menu_items ul {
list-style-type: none;
margin: 0px;
padding: 0px;
}
div.content_list_menu_items a.content_list_menu_items:hover, div.content_list_menu_items a:hover {
background-color: #f5f8fd;
}
div.content_list_menu_items a.content_list_menu_items:active, div.content_list_menu_items a:active {
background-color: #f5f8fd;
}
/*******************************************************************************************
Shared Menu Block Image Classes - and their TDs
*******************************************************************************************/
.cms_menu_section_blocks_image_left, .cms_menu_section_navigation_image_left, .cms_menu_tab_blocks_image_left, .cms_menu_vertical_blocks_image_left, .cms_menu_vertical_blocks_image_left {
margin-right: 4px;
vertical-align: top;
margin-top: 12px;
}
#dropzone30 TD.cms_menu_section_blocks_image_left{
width:48px;
}
.cms_menu_section_blocks_image_right, .cms_menu_section_navigation_image_right, .cms_menu_tab_blocks_image_right, .cms_menu_vertical_blocks_image_right {
margin-left: 4px;
vertical-align: top;
margin-top: 12px;
}
td.cms_menu_vertical_blocks_image_left, td.cms_menu_vertical_blocks_image_right{
width: 16px;
}
/*******************************************************************************************
Section Blocks Menu (cms_menu_section_blocks UI Macro)
*******************************************************************************************/
div.cms_menu_section_blocks {
float: left;
}
p.cms_menu_separator {
display:none;
/*margin: 3% 0%;
border-bottom: 3px solid #DADADA;*/
}
td.cms_menu_section_blocks_title h2, td.cms_menu_section_blocks_title h2 a, td.cms_menu_tab_blocks_text h2 {
/*margin:0;
padding: 0px;
font-weight: normal;
color:#D1232B;
border-bottom:1px #ccc;*/
}
a.cms_menu_block_item {
margin:0;
padding: 0px;
}
.background_transparent h2{
margin: 0px;
padding: 0px;
}
/*******************************************************************************************
Super Menu Styles
*******************************************************************************************/
/***** STEP 1. establish basic structural defaults, which then in turn are expanded upon by unique containers **********************/
TD.cms_header_bottom_menu .cms_menu_super_menu_bar { /* style the super menu drop down bar */
z-index: 199;
float: left;
font-size: 1rem;
padding: 0px;
/*background-color:#355774;*/
}
IMG.cms_menu_super_menu_image_right{
margin-left: 4px;
}
DIV.cms_header_top_menu DIV.cms_menu_super_menu_bar, DIV.cms_header_top_menu DIV.cms_menu_super_menu_content{
float: right;
}
/***** NOTE: DIV.cms_menu_section_blocks HAS MULTIPLE EXTENSIONS ***********/
DIV.cms_menu_section_blocks { /* controls the actual grid and style of the menu contained within each of the supermenus */
float: left;
list-style-type: none;
list-style-image: none;
}
/***** rules for DIV.cms_header_top_menu ******************/
TD.cms_header_top_menu DIV.cms_menu_section_blocks {
width: 260px;
height: 170px;
border: 0px solid #e0e0e0;
background: none;
}
/***** rules for DIV.cms_header_bottom_menu ***************/
TD.cms_header_bottom_menu DIV.cms_menu_section_blocks {
width: 23%;
min-width: 200px; /*may be to thin*/
float: left;
border: 0px;
margin-left: 12px;
margin-top: 12px;
border: 0px solid #e0e0e0; /*testing purposes*/
padding: 0px;
background: transparent;
}
TD.cms_header_bottom_menu{
/* this is the entire row. background: #646464;
border: 1px solid #C2C2C2;*/
/*background-color:#355774;*/
}
/***** rules for DIV.content_body_container_1_column ***************/
DIV.content_body_container_1_column DIV.cms_menu_section_blocks, DIV.content_footer_container DIV.cms_menu_section_blocks {
width: 33.3%;
height:auto;
border: 0px solid #e0e0e0;
background: none;
}
DIV.content_body_container_1_column DIV.cms_menu_section_blocks:nth-of-type(1), DIV.content_body_container_1_column DIV.cms_menu_section_blocks:nth-of-type(4){
margin-left:0px;
}
#dropzone10 DIV.cms_menu_section_blocks {
/*width: 48.9%;*/
width: 33.3%;
float:left;
}
#dropzone10 SPAN.cms_menu_second_level_text{
color: #666;
}
/***** NOTE: DIV.cms_menu_super_menu_bar_item_selected HAS MULTIPLE EXTENSIONS ***********/
.cms_menu_super_menu_bar_item, .cms_menu_super_menu_bar_item_selected { /* style a selected item on the super menu drop down bar */
/*padding:2px 18px 0px 18px;*/
z-index: 200;
float: left;
cursor: pointer;
}
/***** NOTE: DIV.cms_menu_super_menu_bar_item HAS MULTIPLE EXTENSIONS ***********/
.cms_menu_super_menu_bar_item { /* style an item on the super menu drop down bar */
}
.cms_menu_super_menu_bar_item_selected{
color: #F6F6F6;/**/
}
DIV.cms_header_top_menu a.cms_menu_block_item {
font-weight: normal;
}
DIV.cms_header_top_menu .cms_menu_section_blocks_title h2 {
display: none;
}
.cms_menu_super_menu_bar_item#tab_0a93f33470733000bde04bcc204caeec_7{
background: #c8c8c8;
}
.cms_menu_super_menu_bar_item#tab_0a93f33470733000bde04bcc204caeec_5,.cms_menu_super_menu_bar_item#tab_0a93f33470733000bde04bcc204caeec_6{
background: #c8c8c8;
}
/***** rules for DIV.cms_header_top_menu ******************/
DIV.cms_header_top_menu .cms_menu_super_menu_bar_item, DIV.cms_header_top_menu .cms_menu_super_menu_bar_item A{
color: #6d6d6d6d6d6d;
text-decoration: none;
margin-right: 8px;
padding-left: 6px;
padding-right: 6px;
}
TD.cms_header_top_menu .cms_menu_super_menu_bar_item, TD.cms_header_top_menu .cms_menu_super_menu_bar_item_selected {
}
/***** rules for DIV.cms_header_bottom_menu ******************/
TD.cms_header_bottom_menu .cms_menu_super_menu_bar_item{
}
TD.cms_header_bottom_menu .cms_menu_super_menu_bar_item, TD.cms_header_bottom_menu .cms_menu_super_menu_bar_item A, TD.cms_header_bottom_menu .cms_menu_super_menu_bar_item_selected, TD.cms_header_bottom_menu .cms_menu_super_menu_bar_item_selected A{
color: #0E5FD8;
font-weight: normal;
text-decoration: none;
display: block;
line-height: 2.24rem;
padding: 0rem 1rem 0rem 1rem;
font-size: 1rem;
font-weight: 400;
}
TD.cms_header_bottom_menu .cms_menu_super_menu_bar_item, TD.cms_header_bottom_menu .cms_menu_super_menu_bar_item_selected {
/*padding: 0px 18px;*/
}
/***** rules for DIV.cms_header_top_menu ******************/
TD.cms_header_top_menu .cms_menu_super_menu_bar_item_selected { /* style a selected item on the super menu drop down bar */
color: #6d6d6d;
margin-right: 8px;
padding-left: 6px;
padding-right: 6px;
}
TD.cms_header_top_menu .cms_menu_super_menu_bar_item_selected A{
color: #6d6d6d;
text-decoration: none;
margin-right: 8px;
padding-left: 6px;
padding-right: 6px;
}
/***** rules for DIV.cms_header_bottom_menu ******************/
TD.cms_header_bottom_menu .cms_menu_super_menu_bar_item_selected A{
background-color:#e1e1e1;
}
TD.cms_header_bottom_menu .cms_menu_super_menu_bar_item_selected { /* style a selected item on the super menu drop down bar */
font-weight: bold;
}
/***** NOTE: DIV.cms_menu_super_menu_content HAS MULTIPLE EXTENSIONS. ***************/
.cms_menu_super_menu_content { /* style super menu menu container background styles */
position: absolute;
z-index: 200012;
left: 0px;
display: none;
/*rounded corners*/
-webkit-border-bottom-right-radius: 3px;
-webkit-border-bottom-left-radius: 3px;
-moz-border-radius-bottomright: 3px;
-moz-border-radius-bottomleft: 3px;
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
/*drop shadow*/
-webkit-box-shadow: 0px 4px 4px rgba(50, 50, 50, 0.41);
-moz-box-shadow: 0px 4px 4px rgba(50, 50, 50, 0.41);
box-shadow: 0px 4px 4px rgba(50, 50, 50, 0.41);
}
/***** rules for DIV.cms_header_top_menu ******************/
DIV.cms_header_top_menu .cms_menu_super_menu_content { /* style super menu content block */
z-index: 2112;
width: 240px;
height: 120px;
border: 1px solid #DDD;
border-top: 1px solid #DDD;
background: #F0F0F2;
text-align: left;
padding-left: 12px;
padding-top: 6px;
}
/***** rules for DIV.cms_header_bottom_menu ***************/
TD.cms_header_bottom_menu .cms_menu_super_menu_content {
border: 0px solid #c2c2c2;
border-top: 0px solid #f6f6f6;
min-height: 240px;
background:#e1e1e1;
}
.cms_header_bottom_menu .cms_menu_section_blocks_title H2 {
/*display: none;*/
}
DIV.cms_header_top_menu p.cms_menu_separator, DIV.cms_header_bottom_menu p.cms_menu_separator {
/*border: 0px !important;*/
}
td.cms_menu_section_blocks_title h2, td.cms_menu_section_blocks_title h2 a, td.cms_menu_tab_blocks_text h2 {
}
DIV.graphic_meta_opaque_box.register .cms_menu_section_blocks_title A{
color: #646464;
}
TD.cms_menu_section_blocks_image_left{
max-width: 90px;/**/
}
img.cms_menu_section_blocks_image_left{
width: 72px;
margin-right: 12px;
}
TD.cms_menu_section_blocks_title{
text-align: left;
width: 100%;
}
