input[type=range]{
  -webkit-appearance: none;
  background: none;
}

input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 0px;
  background: #ddd;
  border: none;
  border-radius: 3px;
}

input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  border: none;
  height:2vh;
  width: 2vh;
  /* border: 5px solid #333; */
  border-radius: 50%;
  background: rgba(218, 218, 218, 1);
  margin-top: -1vh;
}

input[type=range]:focus {
  outline: none;
}

input[type=range]:focus::-webkit-slider-runnable-track {
  background: #ccc;
}
/* input[type=range] {
  -webkit-appearance: none;
  width: 100%;
  height: 25px;
  background: #d3d3d3;
  outline: none;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;
}

input[type=range]:hover {
  opacity: 1;
}

input[type=range]::-webkit-slider-track {
  -webkit-appearance: none;
  width: 25px;
  height: 25px;
  background: rgb(212, 255, 214);
  cursor: pointer;
}

input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 25px;
  height: 25px;
  background: #4CAF50;
  cursor: pointer;
} */