Change header & footer background colors?

[DynMetalworks]

My website is http://www.dynmetalworks.com/ and I'd like to change the color of the header and footer backgrounds. I understand I will need to do this with the html/css editor, but can someone help with details of what to change? Thanks

[Adam7]

What color did you want to change them to, @DynMetalworks?

[PaulMathews]

@DynMetalworks In the Site Editor, click on Theme > Edit HTML/CSS to get to the css code editor.

Modify the header background color

Click the magnifying glass at the top of the code window and enter the search term #header-wrap and hit enter to see each instance of that id reference in your code. Keep clicking the magnifying glass (the search term will remain there) and hitting enter until you reach the header-wrap id code block below. Your current header background color (highlighted in red below) is a dark grey (color hex code #191919). Change the color hex code to a color you prefer keeping in mind that the new color should be chosen to work with the navigation menu text color (which you should be able to modify in the Theme panel).

#header-wrap {
    background: #191919;
    text-align: left;
    border-radius: 0.1px;
    -webkit-box-shadow: 0px 0px 3px rgba(99,99,99,0.1);
    box-shadow: 0px 0px 3px rgba(99,99,99,0.1);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

Modify the footer background color

Click the magnifying glass at the top of the code window again and enter the search term #footer-wrap and hit enter to see each instance of that id reference in your code. Keep clicking the magnifying glass (the search term will remain there) and hitting enter until you reach the footer-wrap id code block below. Your current footer background color (highlighted in red below) is the same dark grey color as your header. Change the color hex code to a color you prefer keeping in mind that the new color should be chosen to work with the footer text colors (currently light grey and white).

#footer-wrap {
    border-top: 2px solid #ededed;
    background-color: #191919;
    padding: 40px 0px;
}

[DynMetalworks]

Awesome thanks!