.box input[type=checkbox] {
  display: none;
}

.box label:focus,
.box label:hover,
.box label:active,
.box input:checked + label {
  color: #ff8989;
}

.box label:focus:before,
.box label:hover:before,
.box label:active:before,
.box input:checked + label:before {
  border-color: #ff8989;
  background: #ffffff;
}

.box label {
  font-weight: bold;
  position: relative;
  display: block;
  overflow: hidden;
  padding: 1rem 1rem 1rem 3rem;
  cursor: pointer;
  -webkit-transition: all 0.15s ease;
  transition: all 0.15s ease;
  text-overflow: ellipsis;
  display: inline-block;
}

.box label:before {
  position: absolute;
  top: 1.2rem;
  left: 1.2rem;
  width: 10px;
  height: 10px;
  content: '';
  border: 3px solid #cccccc;
}

.box input:checked + label:before {
  border-color: #ff8989;
  background: #ff8989;
}