Make banner slideshow arrows and arrow background transparent

Hi guys,

I have a banner slideslow as the first section on my homepage. Ideally I would like the controls to be bullets rather the arrows, but this doesn't seem to be an option for banner slideshows. Instead, I have added a custom code to make the banner switch between slides automatically. I would like to make the arrows and the arrow backgrounds completely transparent so they appear not to be there. Could someone help me with a code for this? I have tried the below:

.pdp-carousel-controls .chevron-prev, .pdp-carousel-controls .chevron-next {
    background-color: transparent;
}

URL: https://threadsonline.co.uk/

Password: asdfghjkl

Thanks! 🙂 

6 hours ago, Web_Solutions said:

Add these code on Custom CSS panel in Website > Utilities > Website Tools > Custom CSS.

[data-section-id="65b96124899002297ce21714"] .user-items-list-banner-slideshow__arrow-button {
    visibility: hidden !important;
}

 

Worked perfectly, thank you 🙂 

15 hours ago, threadsonline said:

Worked perfectly, thank you 🙂 

Welcome!