.rangeslider,.rangeslider__fill{background:#000;display:inline-block;height:10px;width:195px;border:1px inset #ccc;-webkit-border-radius:10px;-moz-border-radius:10px;-ms-border-radius:10px;-o-border-radius:10px;border-radius:10px}.rangeslider{position:relative}.rangeslider--disabled{filter:alpha(opacity=40);opacity:.4}.rangeslider__fill{background:#0f0;position:absolute;top:0}.rangeslider__handle{background:white;border:1px solid #999;cursor:pointer;display:inline-block;width:20px;height:20px;position:absolute;top:-5px;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,rgba(255,255,255,0)),color-stop(100%,rgba(0,0,0,0.1)));background-image:-webkit-linear-gradient(rgba(255,255,255,0),rgba(0,0,0,0.1));background-image:-moz-linear-gradient(rgba(255,255,255,0),rgba(0,0,0,0.1));background-image:-o-linear-gradient(rgba(255,255,255,0),rgba(0,0,0,0.1));background-image:linear-gradient(rgba(255,255,255,0),rgba(0,0,0,0.1));-webkit-box-shadow:0 0 8px rgba(0,0,0,0.3);-moz-box-shadow:0 0 8px rgba(0,0,0,0.3);box-shadow:0 0 8px rgba(0,0,0,0.3);-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%;border-radius:50%}.rangeslider__handle:after{content:"";display:block;width:18px;height:18px;margin:auto;position:absolute;top:0;right:0;bottom:0;left:0;background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,rgba(0,0,0,0.13)),color-stop(100%,rgba(255,255,255,0)));background-image:-webkit-linear-gradient(rgba(0,0,0,0.13),rgba(255,255,255,0));background-image:-moz-linear-gradient(rgba(0,0,0,0.13),rgba(255,255,255,0));background-image:-o-linear-gradient(rgba(0,0,0,0.13),rgba(255,255,255,0));background-image:linear-gradient(rgba(0,0,0,0.13),rgba(255,255,255,0));-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%;border-radius:50%}.rangeslider__handle:active{background-image:-webkit-gradient(linear,50% 0,50% 100%,color-stop(0%,rgba(0,0,0,0.1)),color-stop(100%,rgba(0,0,0,0.12)));background-image:-webkit-linear-gradient(rgba(0,0,0,0.1),rgba(0,0,0,0.12));background-image:-moz-linear-gradient(rgba(0,0,0,0.1),rgba(0,0,0,0.12));background-image:-o-linear-gradient(rgba(0,0,0,0.1),rgba(0,0,0,0.12));background-image:linear-gradient(rgba(0,0,0,0.1),rgba(0,0,0,0.12))}input[type="range"]:focus+.rangeslider .rangeslider__handle{-webkit-box-shadow:0 0 8px rgba(255,0,255,0.9);-moz-box-shadow:0 0 8px rgba(255,0,255,0.9);box-shadow:0 0 8px rgba(255,0,255,0.9)}