Colour change code for accordion

Hi brains trust,

I have tried changing the colour profile of an accordion in one of my courses but it keeps reverting back to original settings for some reason. 

Could someone assist please with correct CSS to change accordion description text to white (on my brown background).

It's behind a paywall so attached is a screenshot of IDs and my attempted CSS.  The site is: https://www.firstpeoplesleading.com.au/

Thank you! My CSS was a little off, I was using: 

#block-yui_3_17_2_1_1709022622203_38394
.accordion-item__description {
 text-color: #fffff !important;

@Callan Of course! Happy designing. 😊

On 3/2/2024 at 6:51 AM, WCS said:

@Callan The CSS for this should be:

#block-yui_###### .accordion-item__description{
  color: white !important
}

Is that what you were using previously?

Sometimes CSS doesn't display on the backend unless you save, leave the Custom CSS window, refresh, and then go back in. 

 

I've tried adding this same code to Custom CSS but receive the "Syntax Error on line 1" msg. Do you know what might be the issue?

@Rhyan Yes! You need to use the block id # that matches your specific accordion. 

1. Download this plugin Squarespace ID Finder 
2. Go to the page with the accordion on your website and click the extension
3. Find the #block-yui-_#### hovering over the accordion and click it (this will copy it)
4. Replace the placeholder in the code with the unique block id you just copied

You're also welcome to send me a link to the page and I can do this for you!

Here's what it looks like for my accordion:

So if I wanted to modify it, I would do:

#block-yui_3_17_2_1_1709332417768_5305 .accordion-item__description{
  color: red !important
}