Slider widget color change

I’m creating a total new habpanel for myself and decided into the CSS to custimize it to the max!

I’m using the slider widget and custimized it for the most part, but I can’t change the color of the widget. I read in another topic (4 years ago) that it should be possible but there where no examples there (Slider widget question

Below is my code. I tried several other methods (putting color on several places) but it doesn;t change, it uses my CSS sheet from habpanel, i could change that, but then every color changes in habpanel).

.slider {
  top: 90px;
  display: block;
  position: absolute;
  width: 500px;
  height: 15px;  
  margin-left: 100px;
#volume {
  color: #00FF00;


<div class="slider" ng-init='model={
                             "name": "volume", 
                             "item": "GlobalVolume", 
                             "floor": 0, 
                             "ceil": 0, 
                             "unit": "%", 
  <widget-slider ng-model="model" id="volume"></widget-slider>

Can someone slide (point) me in the right direction?

I’m actually interested in modifying the slider widget also, how did you get the actual original code for the slider widget?

Best, Jay

Don’t know where I found this code but never managed to change the color.

I don’t use habpanel anymore but working with main ui from openhab 3.