.s4n-input {
  color: #555;
  cursor: pointer;
  display: inline-block;
  padding-left: 20px;
  position: relative;
}

.s4n-input > input[type=checkbox],
.s4n-input > input[type=radio] {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  opacity: 0;
}

.s4n-input > input[type=checkbox] ~ .s4n-indicator:before, .s4n-input > input[type=checkbox] ~ .s4n-indicator:after,
.s4n-input > input[type=radio] ~ .s4n-indicator:before,
.s4n-input > input[type=radio] ~ .s4n-indicator:after {
  content: "";
  position: absolute;
}

.s4n-input > input[type=checkbox] ~ .s4n-indicator:before,
.s4n-input > input[type=radio] ~ .s4n-indicator:before {
  border: 1px solid #ccc;
  left: 0;
}

.s4n-input > input[type=checkbox] ~ .s4n-indicator:after,
.s4n-input > input[type=radio] ~ .s4n-indicator:after {
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
}

.s4n-input > input[type=checkbox]:checked ~ .s4n-indicator:before,
.s4n-input > input[type=radio]:checked ~ .s4n-indicator:before {
  border-color: #0074d9;
}

.s4n-input > input[type=checkbox]:checked ~ .s4n-indicator:after,
.s4n-input > input[type=radio]:checked ~ .s4n-indicator:after {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}

.s4n-input > input[type=checkbox][disabled] ~ .s4n-indicator:before,
.s4n-input > input[type=radio][disabled] ~ .s4n-indicator:before {
  border-color: #dbdbdb;
}

.s4n-input > input[type=checkbox][disabled] ~ .s4n-indicator:after,
.s4n-input > input[type=radio][disabled] ~ .s4n-indicator:after {
  color: #646464;
}

.s4n-input > input[type=checkbox][disabled]:checked ~ .s4n-indicator:before,
.s4n-input > input[type=radio][disabled]:checked ~ .s4n-indicator:before {
  border-color: #40a6ff;
}

.s4n-input > input[type=checkbox] ~ .s4n-indicator:before {
  top: 3px;
  width: 15px;
  height: 15px;
  border-radius: 2px;
}

.s4n-input > input[type=checkbox] ~ .s4n-indicator:after {
  color: #555;
  font-family: "Glyphicons Halflings";
  font-size: 9px;
  content: '\e013';
  top: 4px;
  left: 3px;
  opacity: 0;
  filter: alpha(opacity=0);
}

.s4n-input > input[type=checkbox]:checked ~ .s4n-indicator:before {
  background-color: #0074d9;
}

.s4n-input > input[type=checkbox]:checked ~ .s4n-indicator:after {
  color: #fff;
}

.s4n-input > input[type=checkbox][disabled] ~ .s4n-indicator:before {
  background-color: rgba(15, 15, 15, 0);
}

.s4n-input > input[type=checkbox][disabled]:checked ~ .s4n-indicator:before {
  background-color: #40a6ff;
}

.s4n-input > input[type=radio] ~ .s4n-indicator:before {
  border-radius: 50%;
  height: 15px;
  top: 2px;
  width: 15px;
}

.s4n-input > input[type=radio] ~ .s4n-indicator:after {
  width: 7px;
  height: 7px;
  background: #0074d9;
  border-radius: 50%;
  top: 6px;
  left: 4px;
}

.s4n-input > input[type=radio]:checked ~ .s4n-indicator:after {
  background-color: #0074d9;
}

.s4n-input > input[type=radio][disabled] ~ .s4n-indicator:after {
  background-color: rgba(15, 15, 15, 0);
}

.s4n-input > input[type=radio][disabled]:checked ~ .s4n-indicator:after {
  background-color: #40a6ff;
}