Problem with Arconix FAQ using accordion

I’m trying to use Arconix FAQ with the accordion output. I want to add my own CSS to the resulting FAQs.

I used a filter on the output of class-arconix-faq-display.php to see what it was creating from my FAQ shortcodes. I got this:

<div id="faq-1307" class="arconix-faq-accordion-title">
	My Question
</div>

<div id="faq-MyQuestion" class="arconix-faq-accordion-content">
	My answer is here.
</div>

That seems correct, and it also seems like I could override the two Arconix CSS classes in my site’s style.css file.

However, when I look at what my FAQ looks like after it has been put into the jQuery accordion, I see this:

<div id="faq-1307" class="arconix-faq-accordion-title ui-accordion-header ui-state-default ui-accordion-icons ui-accordion-header-active ui-state-active ui-corner-top" role="tab" aria-controls="faq-MyQuestion" aria-selected="true" aria-expanded="true" tabindex="0">
	<span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-s"></span>
	My Question
</div>

<div id="faq-MyQuestion" class="arconix-faq-accordion-content ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" style="display: block;" aria-labelledby="faq-1307" role="tabpanel" aria-hidden="false">
	My answer is here.
</div>

There are CSS styles in the Arconix classes that are overridden by the styles in the jQuery classes; this happens because the Arconix classes are listed first. So my site’s styles are not used.

Is there a way to fix this other than putting “!important” on every style in my classes?