.checkbox label {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  padding-left: 30px;
  height: 30px;
}

.checkbox label:before {
  position: absolute;
  top: 4px;
  left: 0px;
  width: 20px;
  height: 20px;
  border: 1px solid silver;
  content: "";
  transition: all 120ms linear;
  font-size: 20px;
}

.checkbox input {
  display: none;
}

.checkbox.checkbox-checked label:before {
  background: white;
  color: black;
  content: "\f00c";
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: FontAwesome;
  font-size: 10px;
  font-style: normal;
  font-weight: normal;
  text-decoration: inherit;
}

.radio label {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  padding-left: 30px;
  height: 30px;
}

.radio label:before {
  position: absolute;
  top: 4px;
  left: 0px;
  width: 20px;
  height: 20px;
  border: 1px solid silver;
  content: "";
  transition: all 120ms linear;
  font-size: 20px;
  border-radius: 90px;
  -webkit-border-radius: 90px;
}

.radio input {
  display: none;
}

.radio.radio-checked label:before {
  background: white;
  color: black;
  content: "\f00c";
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: FontAwesome;
  font-size: 10px;
  font-style: normal;
  font-weight: normal;
  text-decoration: inherit;
}