:root{--range-thumb-size: 36px}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#ccc;border-radius:3px;height:6px;margin-top:(--range-thumb-size - 6px) * .5;margin-bottom:(--range-thumb-size - 6px) * .5;--thumb-size: #{--range-thumb-size}}input[type=range]::-webkit-slider-thumb{-moz-appearance:none;appearance:none;-webkit-appearance:none;background-color:#000;background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .5v7L12 4zM0 4l4 3.5v-7z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E");background-position:center;background-repeat:no-repeat;border:0;border-radius:50%;cursor:pointer;height:--range-thumb-size;width:--range-thumb-size}input[type=range]::-moz-range-thumb{background-color:#000;background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .5v7L12 4zM0 4l4 3.5v-7z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E");background-position:center;background-repeat:no-repeat;border:0;border:none;border-radius:50%;cursor:pointer;height:--range-thumb-size;width:--range-thumb-size}input[type=range]::-ms-thumb{background-color:#000;background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .5v7L12 4zM0 4l4 3.5v-7z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E");background-position:center;background-repeat:no-repeat;border:0;border-radius:50%;cursor:pointer;height:--range-thumb-size;width:--range-thumb-size}input[type=range]::-moz-focus-outer{border:0}