Custom checkboxes - http://stackoverflow.com/questions/16492722/customize-radio-box-like-in-my-concept

dabblet.css

/**
 * Custom checkboxes - http://stackoverflow.com/questions/16492722/customize-radio-box-like-in-my-concept
 */

body{
  padding: 80px;
  margin: 0;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: #333;
  background-color: #fff;  
}

input[type='radio']{
  display: none;
}

label{
  border: 1px solid #ddd;
  padding: 10px;
  position: relative;
  padding-left: 36px;
}

label::before{
  position: absolute;
  left: 10px;
  top: 10px;
  content: '';
  box-shadow: 0px 0px 2px #999;
  border: 2px solid #fff;
  width: 12px;
  height: 12px;
}

input:checked + label::before{
  background: #ccc;
}

dabblet.html

<input type="radio" name="foo" id="c1" /> <label for="c1">Uberwtf</label>
<input type="radio" name="foo" id="c2" /> <label for="c2">Paypal</label>
<input type="radio" name="foo" id="c3" /> <label for="c3">+5%</label>
<input type="radio" name="foo" id="c4" /> <label for="c4">Bitcoin</label>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}