Creating a full-screen background color for my site header

Site URL: https://www.faydenko.com/

Hello everyone!

I'd really like to change the background color of just my header, across the entire width of my website. I'm using the Avenue template and the built-in margins are making this difficult, as I can't get the background color to stretch across the entire width of the site.

You can find my website here: https://www.faydenko.com/

Thanks a million!

Try adding to Home > Design > Custom CSS

#canvas {
    max-width: 100% !important;
}
#header {
    margin: -85px -75px;
    padding: 10px 75px !important;
    background: gray;
}

Thank you so much for the suggestion! That code does create the desired effect, but it also removes all margins from the site. Is there a way to do this without have to re-position all of my content? I've attached a picture of what that looks like.

Again, I really appreciate the help!

#canvas {
    max-width: 100% !important;
}
#header {
    margin: -85px -75px;
    padding: 10px 75px !important;
    background: gray;
}
section#page {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}