.form-checkbox {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}
label.label-checkbox,
.form-checkbox {
  cursor: pointer;
}
label.label-checkbox input[type="checkbox"],
.form-checkbox input[type="checkbox"],
label.label-checkbox input[type="radio"],
.form-checkbox input[type="radio"] {
  display: none;
}
label.label-checkbox i.icon-form-checkbox,
.form-checkbox i {
  width: 22px;
  height: 22px;
  position: relative;
  border-radius: 22px;
  border: 1px solid #c7c7cc;
  box-sizing: border-box;
  display: block;
}
label.label-checkbox i.icon-form-checkbox:after,
.form-checkbox i:after {
  content: ' ';
  position: absolute;
  left: 50%;
  margin-left: -6px;
  top: 50%;
  margin-top: -4px;
  width: 12px;
  height: 9px;
}
label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox,
label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox,
.form-checkbox input[type="checkbox"]:checked ~ i {
  border: none;
  background-color: #007aff;
}
label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox:after,
label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox:after,
.form-checkbox input[type="checkbox"]:checked ~ i:after {
  background: no-repeat center;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A//www.w3.org/2000/svg'%20x%3D'0px'%20y%3D'0px'%20viewBox%3D'0%200%2012%209'%20xml%3Aspace%3D'preserve'%3E%3Cpolygon%20fill%3D'%23ffffff'%20points%3D'12,0.7%2011.3,0%203.9,7.4%200.7,4.2%200,4.9%203.9,8.8%203.9,8.8%203.9,8.8%20'/%3E%3C/svg%3E");
  -webkit-background-size: 12px 9px;
  background-size: 12px 9px;
}
label.label-checkbox,
label.label-radio {
  -webkit-transition-duration: 300ms;
  transition-duration: 300ms;
}
html:not(.watch-active-state) label.label-checkbox:active,
html:not(.watch-active-state) label.label-radio:active,
label.label-checkbox.active-state,
label.label-radio.active-state {
  -webkit-transition-duration: 0ms;
  transition-duration: 0ms;
  background-color: #d9d9d9;
}
html:not(.watch-active-state) label.label-checkbox:active .item-inner:after,
html:not(.watch-active-state) label.label-radio:active .item-inner:after,
label.label-checkbox.active-state .item-inner:after,
label.label-radio.active-state .item-inner:after {
  background-color: transparent;
}