[Plugin: jQuery Collapse-O-Matic] Can Collapse-O-Matic use the same look as my template?

OK I’ve been having a play (like I say I don’t understand web development) and if you look at this page it’s kind of working:

https://www.faqshop.com/wp/acctest

This is the code I am using:

[expand title="Pocket Calculator" tag="h4"?id="kraftwerk" trigclass="accordion opener ul.accordion"]Target Content
The quick brown fox jumped over the lazy dog.
<span class="collapseomatic colomat-close" id="bot-kraftwerk">Click here to close</span>[/expand]

I’m guessing it has something to do with my theme’s style.css which I’ve looked in and done a search for “accordion” as my theme uses this shortcode to display the items the way i want to. Doing a search of style.css I see the following lines:

/*---------------------------------*/
/* 3. Accordion
/*---------------------------------*/
.accordion {width: 100%;padding:0 0 20px 0;background:none;}
.accordion a {text-decoration: none;}
.opener {background:#FFF url(images/_global/bg-accordion-opener.jpg) left bottom repeat-x;display:block;font-size:13px;padding:8px 9px;outline: none;color:#676767;border: 1px solid #C3C3C3;margin-bottom:3px;}
.opener:hover {color:#222;text-decoration: none;}
.opener strong {background:url(images/_global/bg-accordion-close.png) 2px 3px no-repeat;display:block;padding:2px 0 2px 32px;height:1%;cursor:pointer;text-shadow:1px 1px 1px #FFF;}
.accordion .slide-holder {width:100%;overflow:hidden;}
.accordion {list-style:none;}
.accordion .ui-state-active strong {background:url(images/_global/bg-accordion-open.png) 2px 3px no-repeat !important;color:#222;}
.accordion .slide {padding:20px 27px 0 27px;}

I’m at a bit of a loss though on how to get Collapse-O-Matic to mirror this and would appreciate help from someone who understands this stuff better than I do.

Many thanks in advance for your time.