#recorderCtrl {bottom: 0;left: 0;right: 0;background: #111a;}
#recorderCtrl button {background: transparent;border: none;}
#recorderCtrl button:disabled {opacity: .5;cursor: not-allowed;}

#recorderCtrl .hover > .underhover{display:inline-block;overflow:hidden;width:0;height:100%;transition: width .5s ease-out}
#recorderCtrl .hover:hover > .underhover{width:100%;padding-left:.5rem;padding-right:.5rem;}

#recorderCtrl .customrange{background: transparent;-webkit-appearance: none;cursor: pointer;min-width:.9rem;max-width:6rem;}

#recorderCtrl .customrange::-webkit-slider-thumb {background: #f8f9fa;width: .75rem;height: .75rem;border: none;border-radius:.375rem;margin-top:-.275rem;-webkit-appearance: none;}
#recorderCtrl .customrange::-ms-thumb {background: #f8f9fa;width: .75rem;height: .75rem;border: none;}
#recorderCtrl .customrange::-moz-range-thumb {background: #f8f9fa;width: .75rem;height: .75rem;border: none;}

#recorderCtrl .customrange::-webkit-slider-runnable-track {background: #aaa;height:.2rem;-webkit-appearance: none;}
#recorderCtrl .customrange::-ms-track {background: #aaa;}
#recorderCtrl .customrange::-moz-range-track {background: #aaa;}

#recorderCtrl .customrange::-ms-fill-upper {background: #dc3545;}
#recorderCtrl .customrange::-moz-range-progress {background: #dc3545;}