Index background color doesn't show on individual index sections

Site URL: https://ferret-drum-ndgp.squarespace.com/services

Password: erika

I have an index page where each index section is a different color.  It works great when I am viewing them all together, but when I try to view just one part of the index using it's unique slug it the background color disappears.

Example: https://ferret-drum-ndgp.squarespace.com/services looks great but https://ferret-drum-ndgp.squarespace.com/pe-class doesn't.

I've tried to code in a bunch of different ways but here's where I'm at.  I've tried all of the following and none of them worked.

#pe-class {
  background-color: #E5E2DA;
}

.collection-602aa939c1889644fc2abcc1 #pe-class {
  background-color: #E5E2DA;
}

#collection-602aa939c1889644fc2abcc1 #pe-class {
  background-color: #E5E2DA;
}

body#collection-602aa939c1889644fc2abcc1 #pe-class {
  background-color: #E5E2DA;
}

#pe-class {
  background-color: #E5E2DA !important;
}

Thank you in advance...

You can use these two selectors as a pattern for the rest.

#pe-class, /* index page section */
#collection-602aaa11ab0deb12bbb1a682 .Main /* page */

  {
  
    background-color : #E5E2DA;
    
    }

The trick is to grab the collection id from each page when you are looking at it standalone.

Let us know how it goes.

Thank you!  Unfortunately this is still not working for me? 

On 2/26/2021 at 4:11 PM, creedon said:

You can use these two selectors as a pattern for the rest.

#pe-class, /* index page section */
#collection-602aaa11ab0deb12bbb1a682 /* page */

  {
  
    background-color : #E5E2DA;
    
    }

The trick is to grab the collection id from each page when you are looking at it standalone.

Let us know how it goes.

I've updated my code post.

Let us know how it goes.

THAT DID IT!!!!  You are awesome thank you so much!!!! @creedon