jquery-grid/css/slider.min.css

jQuery Grid by Gijgo.com is a plug-in for the jQuery Javascript library. It is a very fast and extandable datagrid, and will add advanced interaction controls to any HTML table. This plugin has build-in integration with Bootstrap and Material Design. Free

.gj-slider{position:relative;padding:8px 6px}.gj-slider [role=track]{width:100%}.gj-slider [role=progress]{position:absolute;z-index:1203}.gj-slider [role=handle]{position:absolute}.gj-slider-md [role=track]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;color:#fff;text-align:center;background-color:#e9ecef;height:2px;background-color:rgba(0,0,0,.26)}.gj-slider-md [role=progress]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;color:#fff;text-align:center;height:2px;background-color:#536DFE;top:8px;left:6px}.gj-slider-md [role=handle]{top:3px;left:0;width:12px;height:12px;background-color:#536DFE;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);filter:none;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,.05);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,.05);border:0 solid transparent;border-radius:50%;cursor:pointer;z-index:1204}.gj-slider-bootstrap [role=track]{border-radius:4px;height:10px}.gj-slider-bootstrap [role=progress]{height:10px;border-radius:4px;top:8px;left:6px;transition:none}.gj-slider-bootstrap [role=handle]{top:2px;left:0;width:20px;height:20px;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);filter:none;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,.05);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,.05);border:0 solid transparent;border-radius:50%;cursor:pointer;z-index:1204}.gj-slider-bootstrap-3 [role=handle]{background-color:#337ab7;background-image:-webkit-linear-gradient(top,#337ab7 0,#2e6da4 100%);background-image:-o-linear-gradient(top,#337ab7 0,#2e6da4 100%);background-image:linear-gradient(to bottom,#337ab7 0,#2e6da4 100%);background-repeat:repeat-x}.gj-slider-bootstrap-4 [role=handle]{background-color:#007bff;background-image:-webkit-linear-gradient(top,#007bff 0,#2e6da4 100%);background-image:-o-linear-gradient(top,#007bff 0,#2e6da4 100%);background-image:linear-gradient(to bottom,#007bff 0,#2e6da4 100%);background-repeat:repeat-x}