.checkbox {
  padding-left: 30px;
  line-height: 1;
}
.checkbox label{
  display: inline-block;
  vertical-align: middle;
  position: relative;
  padding-left: 13px;
  line-height: 30px;
}
.checkbox label::before {
  content: "";
  display: inline-block;
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0;
  margin-left: -30px;
  border: 1px solid #a5a5a5;
  border-radius: 4px;
  background-color: #fff;
  -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
  -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
  transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
}
.checkbox label:hover::before {
	border-color:#f30050;
}
.checkbox input:focus ~ label::before {
	border-color: #F76048;
	box-shadow: 0 0 0 1px rgb(247,96,72);
}
.checkbox input[type="radio"] + label::before {
	width: 16.67px;
	height: 16.67px;
	border-radius: 100%;
	top:3.8px;
}
.checkbox label::after {
  display: inline-block;
  position: absolute;
  width: 16px;
  height: 16px;
  left: 0;
  margin-left: -30px;
  padding-left: 3px;
  padding-top: 1px;
  font-size: 11px;
  color: #616B7F;
}
.checkbox input {
  opacity: 0;
  z-index: 1;
  width: 0;
  cursor: pointer;
}

/* Checkbox */
.checkbox input[type="checkbox"]:checked + label::after {
  display: block;
  content: ' ';
  height: 24px;
  width: 24px;
  background-image: url("/img/icons/check-fill-white.svg");
  background-size: 24px 24px;
  top: 0px;
  left: 0px;
}
.checkbox input[type="checkbox"]:indeterminate + label::after{
  display: block;
  content: "";
  width: 10px;
  height: 3px;
  background-color: #555555;
  border-radius: 2px;
  margin-left: -16.5px;
  margin-top: 7px;
}
.checkbox input[type="checkbox"]:disabled {
  cursor: not-allowed;
}
.checkbox input[type="checkbox"]:disabled + label {
  opacity: 0.65;
}
.checkbox input[type="checkbox"]:disabled + label::before {
  background-color: #eeeeee;
  cursor: not-allowed;
}
.checkbox input[type="checkbox"]:checked + label::before{
  background-color: #FFF;
  border-color:#f30050;
}

/* Radio */
.checkbox input[type="radio"]:checked + label::after {
  display: block;
  content: ' ';
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNyIgaGVpZ2h0PSIxOCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTguMzQ0IDE3LjMzM0MzLjc0MiAxNy4zMzMuMDExIDEzLjYwMi4wMTEgOVMzLjc0Mi42NjcgOC4zNDQuNjY3IDE2LjY3OCA0LjM5OCAxNi42NzggOXMtMy43MzEgOC4zMzMtOC4zMzMgOC4zMzN6bTAtMS42NjdBNi42NyA2LjY3IDAgMCAwIDE1LjAxMSA5YTYuNjcgNi42NyAwIDAgMC02LjY2Ny02LjY2N0E2LjY3IDYuNjcgMCAwIDAgMS42NzggOWE2LjY3IDYuNjcgMCAwIDAgNi42NjcgNi42Njd6bTAtMi41QTQuMTcgNC4xNyAwIDAgMSA0LjE3OCA5YTQuMTcgNC4xNyAwIDAgMSA0LjE2Ny00LjE2N0E0LjE3IDQuMTcgMCAwIDEgMTIuNTExIDlhNC4xNyA0LjE3IDAgMCAxLTQuMTY3IDQuMTY3eiIgZmlsbD0iIzVjMGE5OCIvPjwvc3ZnPg==");
	width: 17.3px;
	height: 17.3px;
	background-repeat: no-repeat;
	top: 3px;
    left: 0.5px;
}
.checkbox input[type="radio"]:disabled {
  cursor: not-allowed;
}
.checkbox input[type="radio"]:disabled + label {
  opacity: 0.65;
}
.checkbox input[type="radio"]:disabled + label::before {
  background-color: #eeeeee;
  cursor: not-allowed;
}
.checkbox input[type="radio"]:checked + label::before{
  display: none;
}