Gravityforms - Green Ticks Checkbox and Radio buttons

gistfile1.txt

/*  Re-style Checkboxs and Radio buttons */

.gform_wrapper ul.gfield_checkbox li input[type=checkbox], .gform_wrapper ul.gfield_radio li input[type=radio] {
  display: none;
  margin: 0;
  width: 0!important;
}

.gform_wrapper input[type=checkbox] + label, .gform_wrapper input[type=radio] + label { font-size: 16px; }
input[type=checkbox] + label:hover, input[type=radio] + label:hover { cursor: pointer; }
input[type=checkbox] + label:before, input[type=radio] + label:before {
  font-family: FontAwesome;
  font-size: 23px;
  position: relative;
  top: 0.1em;
  margin-right: 0.5em;
}
.gform_wrapper li.gf_list_inline ul.gfield_checkbox li, .gform_wrapper li.gf_list_inline ul.gfield_radio li {
  display: -moz-inline;
  display: inline;
}


body .gform_wrapper .gform_body .gform_fields .gfield .gfield_radio .gchoice {
  
  margin: 15px 15px; /* adjusts the position of the yes / no tick boxes */

}

/* Styles the radio and checkboxes to a green tick from Fontawesome */

input[type=checkbox] + label:before { content: '\f0c8'; color: #ccc; }
input[type=checkbox] + label:hover:before { content: '\f0c8'; color: green;}
input[type=checkbox]:checked + label:before { content: '\f14a'; color: green;}
input[type=checkbox]:checked + label:hover:before { content: '\f14a'; color: green; }

input[type=radio] + label:before { content: '\f0c8';color: #ccc; }
input[type=radio] + label:hover:before { content: '\f0c8'; color: green; }
input[type=radio]:checked + label:before { content: '\f14a'; color: green;}
input[type=radio]:checked + label:hover:before { filter: alpha(opacity=100)}


/* Hide the OS/Browser checkboxes/radio buttons */
input[type=checkbox], input[type=radio] {
  visibility: hidden!important;
  margin: 0!important;
  width: 0!important;
}