Changing header/footer background colour & changing top navigation style

Hi I've two changes I need to make, please help:

1. I need to change the header and footer (bottom 4 widgets area) background color, I'm using the "Black" color setting under styling option right now; I'd prefer to make it in a particular colour code instead of black & grey.

2. I want to change the top navigation from just button name with Bubble around to a navigation BAR, with square buttons like this one:

many thanks in advance!

 

1.For your first issue

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

Code:

.header_wrapper {
background: red;
}
.footer_wrapper {
background: red;
}

2.For your second issue

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

Code:

#menu .ddsmoothmenu li.current-menu-item, #menu .ddsmoothmenu li.current_page_item, #menu .ddsmoothmenu li.current-menu-parent, #menu .ddsmoothmenu li.current_page_parent, #menu .ddsmoothmenu li:hover{
border-radius:0px;
-webkit-border-radius: 0px;
-moz-border-radius:0px;
}

 

Hi Gourav:

1. 1st issue is not resolved, only half resolved as the footer changes fine but header does not cover the full header but only portion of it, see screenshots below. Questions: A. How can I get rid of the break in footer and change the color of text in footer widgets? B. How can I cover full header background?
2. 2nd issue also, the only change I got is the round tab is now square, what I'm looking for is a long navigation bar with square button not not separate buttons with square shadow.


Please help!

 

1. (A). For this issue, paste the following code in your custom css
Appearance -> Theme Options -> Styling Options -> Custom CSS

Code:

.footer_wrapper .footer_bottom {
background: red;
}
.footer_wrapper .footer_glow {
display: none;
}
.footer_wrapper .footer .widget_inner p {
color: blue;
}
.footer_wrapper .footer .widget_inner ul li a {
color: blue;
}
.footer_wrapper .footer .widget_inner ul li {
color: blue;
}
.footer_wrapper .footer .widget_inner{
color: blue;
}

1. (B). Do let us know your website link so that we can provide you the exact solution.

2. paste the following code in your custom css

Code:

#menu .ddsmoothmenu li {
margin-right: 0px;
}

 

Hi Piyush:

Thanks for the solution, for the other issue and a couple more, I have sent the email with all details and link with ID & PW.

Thank again!