sliderControl.min.css

.sliderAction,.slider{height:40px;border:0 inset rgba(255,255,255,.2);margin:0 10%;background:-webkit-gradient(linear,0% 0,0% 100%,from(#4e4e6e),to(#222));-webkit-border-radius:12px;-webkit-tap-highlight-color:rgba(0,0,0,0);}.sliderThumb{position:absolute;margin-top:2px;height:34px;width:36px;z-index:5;border:2px inset rgba(255,255,255,0);opacity:.3;font-size:0;-webkit-appearance:button;-webkit-border-radius:12px;}.sliderDisabled{opacity:.5;}.sliderLabelsDiv{width:100%;height:100%;z-index:3;margin:0;padding:0;border-width:0;overflow:hidden;}.sliderLabel{display:inline-block;width:auto;height:100%;margin:0;padding:0;border-width:0;border-right:1px solid rgba(78,78,78,0.4);text-shadow:rgba(0,0,0,.3) 1px 1px 2px;text-align:center;font-size:18px;line-height:24px;z-index:4;margin-top:4px;padding-top:4px;float:left;}.sliderLabel:last-child{border-width:0;}.sliderLabel.selected{color:red;}.sliderLabel.selected-off{visibility:hidden;}.sliderAction{background:-webkit-gradient(linear,0% 0,0% 100%,from(#000),to(#333));height:44px;padding:3px;border:1px solid rgba(64,64,64,.75);-webkit-border-radius:14px;}.sliderAction .sliderThumb{margin:0;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAAAsCAYAAADctB6FAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAK8AAACvABQqw0mAAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNAay06AAAAQ7SURBVGiB7ZpPTxtHGIeftVdmgUg9xMZxEI4FokamDnaAjUgpkLqtmhxy7CFfgG/BNbdKVYvyDRIJwcVKOJZaAokDUpx/6iGyUCxj4mzAsY1jFuydHkiQi4yiwuJdlzzSXHZ23/npt+87M7saSQhBPR2KIiIDA9y5dYvxySm6urvp/2aQ/wOvXr1C0zSWl5eZn5/n2bNn6Lou/esmIcRhuxYKifiDB6JWq52LNjc3J4LBoKj3QBJC0Kko4ufvY/w2+wc+v9+i92cN6XSa6elpEokEuq5LDoCbE5P8fv/+uTMDoKenh9nZWaLRKADy1VBI/HrvHl3dlzk6n5wXAoEAMzMzBAIBIY9fv87k7dvn1oxPxGIxRkZGkCdvfHvuzQCQJIlYLIZ87cbYF0M+MjY2hlQqFoVTlq3WYgsqlQqyw+n8kiEfaWtrQ7aTGUII8vk86XSaSCRiiQbZMAxLBm6EEIJqtcrq6irZbJapqSkURWmqBkf9ttUuDQ52kAsLC2xubjZ1bNtlSL2ecrnMo0ePGB4eJhwO43A4zlyD7QxpdG1tbY03b94wPj6OoihIktTgaXOwnSHH6clkMsTjcSYmJujq6jozU6RcLmfaMlMoFIjH42aFa4jT6WRoaIiBgQGcTqfp8U3NkGZkW61W48mTJ7x9+xZVVU0vIblWq5kWrFnlJ4Qgk8lQKBQYHR3F7XabNuG2XIbUUyqVSCQShMNh+vr6TCmhljYEDkro6dOnaJpGJBI5dQm1ZMkcRQjBxsYGuq6jqioul+vEpsg7OzumCfvw4YNpsf4rPp+PaDRKtVplf3//xHFavmQAwuEwvb29VCoVTpvxLV0y7e3tqKpKR0cHhULBlJgtmyFer5doNMr+/j7lctm0uC1pyODgIIFAgJ2dnVOXyFGklZUV07busizj8/mO7f+c+E8/iJaWlhr2K4qCqqq0tbVh5mJQj6kZsre3x+vXr0/8vBACXdcb9nm9XiKRCJVKhWKxeOIxPoftvnYbEQqF8Pv95PP5My9L2xlSr0dRFEZHR5FlGU3TmqLB1GX3tAghDucZj8dDNBqlWCxSKpWapsF2GQIQDAbx+/1ommb6KvI5bJUhAC6Xi87OTrLZrCXj2ypDAHRdP3alaQbybrmMq73dMgF2olwuI7/LbHCpr9dqLbZga2sLOfXyJZ7AFau12IJUKoX8dyqFarN5xAoMw+D58+fI69kNkn8luDrxndWaLOXFixek02nkd+/f8+fKMpeu+HH39FityxK2t7d5/PgxhULh4Fimz+MRvT4fv9y9i+ecnUTc2tri4cOHrK+vs7m5KUmfdoddbrdwd3by09RNRn78wWKZZ49hGCSTSRYXF8nn8+RyOQlAqv/C9Hg8wmEYeC9cINTXj7+vl68uXuTy1/20+rGrarVKLpdjd3eXdDpNMpkkm81iGAaaph3+ov8H36/KkawLA3MAAAAASUVORK5CYII=);height:44px;border:0;opacity:1;width:68px!important;-webkit-appearance:none;-webkit-border-radius:0;}.sliderAction .sliderLabel{font-size:22px;font-weight:normal;text-shadow:none;color:#fff;padding-left:28px;-webkit-mask-image:-webkit-gradient(linear,35% top,65% top,from(rgba(0,0,0,.20)),color-stop(.5,rgba(0,0,0,1)),to(rgba(0,0,0,.20)));-webkit-mask-size:50%;-webkit-mask-repeat:none;-webkit-animation-name:spotlight;-webkit-animation-timing-function:linear;-webkit-animation-duration:1500ms;-webkit-animation-iteration-count:infinite;--webkit-animation-direction:alternate;}@-webkit-keyframes spotlight{from{-webkit-mask-position:0;}to{-webkit-mask-position:100%;}}