How do i change the styling of checkbox

Pavi~

The CSS you used above does not match the set of classes that Skuid uses. The best route is to inspect the elements in your browser tools and add or modify the CSS descriptors in the page.  Then take these modifications and add them to a custom CSS resource either in your page or in your theme. 

Thanks!
Karen

The thing with checkboxes is, that they look different from browser to browser. The best way to give them a custom style is to use the html-label, style that and hide the checkbox. (You can click on labels for checkboxes, so that the boxes get triggered)

For that styling, see this: https://codepen.io/CreativeJuiz/pen/BiHzp

However, the problem is, that Skuid does not render a for the checkboxes, but a

$('.nx-checkboxlabel').each(function(idx, elem) {    checkbox = $(this).prev('.nx-checkbox');
    var theId = encodeURIComponent($(this).html());
    checkbox.attr('id', theId);
    $(this).html('<label for='+ theId + '">' + decodeURIComponent(theId) + '</label>');
});