html{font-family:Arial,Helvetica,sans-serif}div.slider{position:relative;height:1em;font-size:26px;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}div.slider div{position:absolute;top:50%;left:0;z-index:1}div.slider>div.track{font-size:.384615385em;left:0;right:0;height:1em;margin:-.5em 0 0 0;border-radius:.5em;border:1px solid #bfbfbf;background-color:#ddd;overflow:hidden;box-shadow:inset 1px 1px 2px rgba(0,0,0,0.2);-webkit-box-shadow:inset 1px 1px 2px rgba(0,0,0,0.2)}div.slider>div.track>div{top:0;right:0;bottom:0;left:0;background-color:#999;box-shadow:inset 1px -3px 5px rgba(0,0,0,0.2)}div.slider>div.handle{width:1em;height:1em;margin:-.5em 0 0 -.5em;border-radius:.5em;background-color:#e86b1b;box-shadow:1px 1px 2px rgba(0,0,0,.2),inset 0 2px 3px rgba(255,255,255,0.3),inset 0 -2px 3px rgba(0,0,0,0.3);-webkit-box-shadow:1px 1px 2px rgba(0,0,0,.2),inset 0 2px 3px rgba(255,255,255,0.3),inset 0 -2px 3px rgba(0,0,0,0.3)}body.test div.slider>div.handle.low{left:0;background-color:red}body.test div.slider>div.handle.high{left:100%;background-color:#0f0}body.usage>div{padding:20px}div.label,div.labels>div{font-size:14px;font-weight:bold;text-align:center}div.labels>div{float:left}div.labels>div+div{float:right;text-align:right}