We're trying to create a color-coded employee evaluation as shown below.  I've been able to get the label centered, but the checkboxes have stubbornly resisted every effort I've made to center them.  

I've given my table the css class of "EvalTable" though it shows up in the CSS preview pane as class="EvalTable form-q cf-table-block ".  Running version 10.3.

If it helps, here is the css I currenly have applied:

/*Modifications for evaluation tables (Unsatisfactory - Far Exceeds)*/
.cf-table th {text-align:center!important;}
.Unsatisfying {border-radius: 5px; background-color:red; opacity:0.7}
.Unsatisfying input[value="U"]+label {visibility:hidden;}
.NeedsImprovement {border-radius: 5px; background-color:orange; opacity:0.7}
.NeedsImprovement input[value="N"]+label {visibility:hidden;}
.MeetsReq input[value="M"]+label {visibility:hidden;}
.MeetsReq {border-radius: 5px; background-color:gold; opacity:0.7}
.ExceedsReq input[value="E"]+label {visibility:hidden;}
.ExceedsReq {border-radius: 5px; background-color:green; opacity:0.7}
.FarExceeds input[value="FE"]+label {visibility:hidden;}
.FarExceeds {border-radius: 5px; background-color:blue; opacity:0.7}