Accordion – colours + linking columns

[Ken]

Hi guys,

1.
In the link you’ll see I have set up two half width accordions next to each other. Visually they are the same element even though technically they are not. I hope you’ll see what I mean from the link.
How can I “link” the two so that if a tab on the right is opened the tab on the left will close – ie behave like one accordion?

2.
How can I change the colours of the accordion elements?
I’ve noticed that the accordion is effectively transparent, but that is problematic with the paralax background and not asthetically pleasing on the coloured backgrounds.
How can I change the background colour of
a) the accordion
b) the accordion header when it’s closed
c) the accordion header when it’s open

Many thanks!

Ken

[Kyle – SUPPORT]

1) Unfortunately this is not possible as they are separate accordions, sorry

2) Add this:

a)

.spb_accordion_section.group {
  background-color: #ffffff;
}

b)

.spb_tabs .nav-tabs li a, .spb_tour .nav-tabs li a, .spb_accordion .spb_accordion_section > h3 a {
  background-color: #ffffff;
}

c)

.spb_tabs .nav-tabs li.active a, .spb_tour .nav-tabs li.active a, .spb_accordion .spb_accordion_section > h3.ui-state-active a {
  background-color: #f7f7f7;
}

– Kyle

[Ken]

Thanks Kyle

1. I figured that was a long shot 🙂
I still think it would be a cool idea to have an accordion element with columns like that. Maybe something to think about one day.

2. The colours are sorted. Thanks.

[Kyle – SUPPORT]

Ok great, no problem

– Kyle