Style checkboxes individually

I would like to style checkboxes individually to do something like this page https://mostlyserious.io/get-started/#start-project (check the “What can we craft for you?” section).

I managed to write a checkbox css of what I would like but can’t get it to work in Contact Form 7: https://jsfiddle.net/z496weaf/

There are several problems:
– if I give an id to the checkboxes and use it, it styles all the checkboxes as one
– if I use separate labels, it doesn’t style the checkbox wrapup, and I can’t get rid of the checkbox itself (I only want the clickable text in a box)
– if I use one item / checkbox, I lose the exclusivity feature (only one can be clicked) and I still have the checkbox and the styling has the same problem as the previous point

Do you have any idea?

• This topic was modified 7 years, 1 month ago by 7hibault.