Custom CSS to change menu color and remove footer area?

Please someone help - what CSS to add to effect the below?

You will see when on the homepage of the site http://www.testingenviroment.com/cityhockey/ I have added CSS so the menu colour is dark blue however all other menu when highlighted or on those menu items hovered on are light blue how do I make these also dark blue what is the CSS to add to do this?

Also in the footer area I want to keep the dark blue strip but above that is a light blue strip what CSS can I add to remove the light blue strip completely?

 

Hello,

1. Paste the code given below in Custom CSS section
(Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard.

Code:

#menu .ddsmoothmenu li a:hover {
background: blue;
}
#menu .ddsmoothmenu li li a:hover {
background: none;
}
#menu li:hover a, #menu li.current_page_item a {
background: blue;
} 

In place of "blue" you can put your color or color code.

2. Paste the code given below in Custom CSS section
(Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard to remove the footer widget area.

Code:

.footer .footer_widget {
display: none;
}
 

This will solve your issue.

 

Hello,

I used the first code above to change the menu color in Themia. It creates a rectangle overlay over the original rounded color button, with the underlying color showing on one edge. Here's the URL> http://sma-assistants.com/pricing/

And a screenshot is below. I want to preserve the rounded corners and have no underlying color showing.

Thanks for your help,
Carroll

.

 

_______________________________
UPDATE:


After removing and replacing the code, the color doesn't change at all?

Here is the code I'm using with the hex# added:

#menu .ddsmoothmenu li a:hover {
background: #0E23CC;
}
#menu .ddsmoothmenu li li a:hover {
background: none;
}
#menu li:hover a, #menu li.current_page_item a {
background: #0E23CC;
}
Don't know what I'm doing wrong.
Thanks again.

 

Hello,

Paste this code in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

 
 
#menu li.current-menu-item, #menu li.current-menu-parent, #menu li.current_page_parent, #menu li:hover, #menu li.current_page_item, #menu li.current-menu-item a, #menu li.current-menu-parent a, #menu li.current_page_parent a, #menu li:hover a, #menu li a.selected, #menu li a:hover, #menu li.current_page_item a{
background:#0E23CC;
border-radius:16px;
}

This will solve your issue.


Thanks & Regards
Gourav Shrivastava

 

Thanks so much! You sure know your stuff! Great support!