.slider{width:400px;margin:50px}.slider .bar{position:relative;border-bottom:1px solid #DDD}.slider .bar .handle{width:10px;height:10px;margin-left:-5px;z-index:10000;display:block;position:absolute;background:#FFF;border:2px solid #08F;bottom:2px;border-radius:50% !important;cursor:pointer;transition:all 0.1s}.slider .bar .handle:after{position:absolute;left:50%;margin-left:-3px;border:3px solid transparent;bottom:-7px;border-top-color:#08F;content:" "}.slider .bar .handle:hover,.slider .bar .handle.dragging{width:20px;height:20px;margin-left:-10px;border-width:4px;bottom:-10px}.slider .bar .handle:hover:after,.slider .bar .handle.dragging:after{opacity:0}.slider .ticks{position:relative}.slider .ticks .tick{position:absolute;width:100px;text-align:center;margin-left:-50px}.slider .ticks .tick .marker{width:1px;height:10px;margin:2px 0;background:#DDD;display:block;margin:0 auto}.slider .ticks .tick .text{font-size:8pt;color:#AAA}