Hello There,
Are you using the accordion shortcode which can be found here (http://demo.theme.co/integrity-1/shortcodes/accordion/)?
You will need to edit your shortcode and include a custom class. For example, you will have this:
[accordion class="predators"] [accordion_item title="Accordion Title" parent_id="my-accordion"]Your text here[/accordion_item] [accordion_item title="Accordion Title" parent_id="my-accordion" open="true"]Your second accordion text[/accordion_item] [accordion_item title="Accordion Title" parent_id="my-accordion"]Your third accordion text[/accordion_item] [/accordion]
[accordion class="mammals"] [accordion_item title="Accordion Title" parent_id="my-accordion"]Your text here[/accordion_item] [accordion_item title="Accordion Title" parent_id="my-accordion" open="true"]Your second accordion text[/accordion_item] [accordion_item title="Accordion Title" parent_id="my-accordion"]Your third accordion text[/accordion_item] [/accordion]
[accordion class="vegetarian"] [accordion_item title="Accordion Title" parent_id="my-accordion"]Your text here[/accordion_item] [accordion_item title="Accordion Title" parent_id="my-accordion" open="true"]Your second accordion text[/accordion_item] [accordion_item title="Accordion Title" parent_id="my-accordion"]Your third accordion text[/accordion_item] [/accordion]
[accordion class="aviary"] [accordion_item title="Accordion Title" parent_id="my-accordion"]Your text here[/accordion_item] [accordion_item title="Accordion Title" parent_id="my-accordion" open="true"]Your second accordion text[/accordion_item] [accordion_item title="Accordion Title" parent_id="my-accordion"]Your third accordion text[/accordion_item] [/accordion]
And then you will have to update the css code and use something like this:
/* Predators */
.predators .x-accordion-heading .x-accordion-toggle {
color: #fff !important;
background-color: brown !important;
}
.predators .x-accordion-inner {
background-color: brown !important;
color: #fff !important;
}
/* Mammals */
.mammals .x-accordion-heading .x-accordion-toggle {
color: #fff !important;
background-color: tan !important;
}
.mammals .x-accordion-inner {
background-color: tan !important;
color: #fff !important;
}
/* Vegetarian */
.vegetarian .x-accordion-heading .x-accordion-toggle {
color: #fff !important;
background-color: green !important;
}
.vegetarian .x-accordion-inner {
background-color: green !important;
color: #fff !important;
}
/* Aviary */
.aviary .x-accordion-heading .x-accordion-toggle {
color: #fff !important;
background-color: blue !important;
}
.aviary .x-accordion-inner {
background-color: blue !important;
color: #fff !important;
}
Hope this helps.