Remove Padding in Accordions?

Shapely
1

I would like to remove the white area in accordions. Like here: http://alcasthq.com/?page_id=1992
When you open the accordion I would like so the pictures like up after each other. At the moment there is a huge gap inbetween them although they are in the same section. Someone told me it has to do with the Themes style.css setting.

Cheers

2

Does it work with this code:

section{

padding: 0px !important;

}

Or are all the spaces messed up if I do that?

3

Hi @sirup117,

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Shapely Options -> Other

.vc_tta-accordion section.vc_cta3-container {
    padding: 0;
}

Best Regards,
Movin

4

Thank you very much, this worked. You saved me :slight_smile:

Is it possible to make Accordions slightly transparent so we can see the picture behind it?`

Thank you!

5

You are most welcome here :slight_smile:

You can make it transparent by using the below CSS code.

#page .vc_tta-accordion .vc_tta-panel-heading,
#page .vc_tta-accordion .vc_tta-panel-body {
    background: rgba(248, 248, 248, 0.5);
}
6

Amazing! One last question regarding Accordions, how can I change the color of the Section title to make it completely white. As you see now it is a bit too dark: http://alcasthq.com/?page_id=1992

Thank you!

7

You can do this by using the below CSS code.

#page .vc_tta-accordion div.vc_tta-panel-heading {
    background: #fff;
}
#page .vc_tta-accordion div.vc_tta-panel-heading .vc_tta-controls-icon:after,
#page .vc_tta-accordion div.vc_tta-panel-heading .vc_tta-controls-icon:before,
#page .vc_tta-accordion div.vc_tta-panel-heading a{
  color: #000;
  border-color: #000;
}
8

Worked :slight_smile: Thank you for your super support! 10/10

9

You are most welcome here :slight_smile: