Assigning Different Color Template to Footer on One Page

Our site is in free trial mode still so there is no live URL, but we want to assign the default color scheme to the page footer for one of our pages, rather than the color scheme assigned to the other pages. How can we have a different color theme for the footer of one page compared to the others?

If your site is trial, you can setup password & share url

You can do this with CSS but Difficult to help without checking site.

Here is the URL: https://circle-circle-7emm.squarespace.com/

Password: improve

Let me know if it works. It's the Case Studies page which I want to change footer color.

16 hours ago, ImproveYourDomain said:

Here is the URL: https://circle-circle-7emm.squarespace.com/

Password: improve

Let me know if it works. It's the Case Studies page which I want to change footer color.

You mean footer background? Add to Case Studies page header

<style>
  footer#footer-sections .section-background {
    background: green !important;
}
</style>

That worked, but is there any way to inject the code so that it doesn't have to occupy space on the page? I made a code block to add it which adds blank space on the page which looks bad. 

If I put that code as a code injection though, it will apply to all pages, so I'm confused about how to proceed.

2 hours ago, ImproveYourDomain said:

That worked, but is there any way to inject the code so that it doesn't have to occupy space on the page? I made a code block to add it which adds blank space on the page which looks bad. 

If I put that code as a code injection though, it will apply to all pages, so I'm confused about how to proceed.

add to Custom CSS

body#collection-5e4211ae8185f139c7f8d9c0 footer#footer-sections .section-background {
    background: green !important;
}