Change Style CSS of Checkbox for Overlays in Control?

I have read so many things on this but I cannot figure it out.

I simply have some controls for overlays like so

var overlays = {
    "<font color='#342112'>Town Locations</font>" : town_locations,
    "<font color='342112'>Town Labels</font><br>" : town_labels,
    //"<img src='images/51.png' width=18>Test" : town_labels,
    "<font color='#342112'>Town Popups</font>" : town_popups,
    //"<font color='Blue'>Castle Popups</font>" : castle_popups,
    //"<font color='Blue'>Castle Labels</font>" : castle_labels,
}

And I am trying to customize the checkboxes in leaflet.css but not having any luck.

Thanks in advance.