.radiobox {
  padding: 20px 15px 20px 50px;
  border-bottom: 1px solid #999;
  position: relative;
  cursor: pointer;
  margin: 0;
}

.radiobox p {
  margin: auto;
}

.checkmark {
  position: absolute;
  top: 50%;
  left: 2%;
  transform: translate(-50%, -50%);
  height: 30px;
  width: 30px;
  border: double 2px transparent;
  border-radius: 80px;
  background-image: linear-gradient(#eee, #eee), radial-gradient(circle at left, #800c0c, #bf201d);
  background-origin: border-box;
  background-clip: content-box, border-box;
}

.radiobox:hover input~.checkmark {
  background-color: #0773c2;
}

.radiobox input:checked~.checkmark {
  background-origin: border-box;
  background-clip: content-box, border-box;
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.radiobox input:checked~.checkmark:after {
  display: block;
}

.radiobox .checkmark:after {
  left: 7px;
  top: 1px;
  width: 10px;
  height: 20px;
  border: solid #0773c2;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

input[type=checkbox], input[type=radio] {
  opacity: 0;
}

.radiobox input[type=radio] {
  position: absolute;
}
