need help with CSS for slider color

[Itzdibbyyx 1]

I've tried putting

 

/*Firefox Focus*/
.mdl-slider:focus::-moz-range-thumb {
    box-shadow: 0 0 0 10px rgba(140,0,0,.26) !important;
}
/*Chrome Focus*/
.mdl-slider:focus::-webkit-slider-thumb{-webkit-box-shadow:0 0 0 10px rgba(153,204,255,.26); box-shadow:0 0 0 10px rgba(140,0,0,.26) !important;
}
/*FireFox*/
.mdl-slider::-moz-range-thumb {
    background: rgb(255,0,0) !important;
}
.mdl-slider::-moz-range-progress {
    background: rgb(255,0,0) !important;
}

.emby-slider {
    color: red !important;
}

 

 

in to the custom css text field but the code isnt working and the scrub slider when playing any content still appears green, i would also like to change the volume slider to red aswell but no luck, any help appreciated.

Edited July 28, 2019 by Itzdibbyyx

[Happy2Play 4249]

Here is the code I use for Blue.

/* Google Now Playing Bar & Now Playing Page */
.emby-slider-background-lower, .emby-slider::-webkit-slider-thumb {
  background: #0C57D6 !important; }

.emby-slider:focus::-webkit-slider-thumb {
  -webkit-box-shadow: 0 0 0 10px rgba(66,133,244,.2);
  box-shadow: 0 0 0 10px rgba(66,133,244,.2) !important; }

/* Firefox Now Playing Bar & Now Playing Page */
.emby-slider::-moz-range-thumb, .emby-slider::-moz-range-progress {
  background: #0C57D6 !important; }

.emby-slider:focus::-moz-range-thumb {
  box-shadow: 0 0 0 10px rgba(66,133,244,.2) !important; }

/* Progress Bars */
.itemProgressBarForeground {
  background-color: #0C57D6 !important; }

.taskProgressInner {
  background: #0C57D6 !important; }

/* Google Progress Bars */
progress::-webkit-progress-value {
  background: #0C57D6 !important; }

/* Firefox Progress Bars */
progress::-moz-progress-bar {
  background: #0C57D6 !important; }

/* Edge Progress Bars */
progress {
  background: #0C57D6 !important; }

Edited July 29, 2019 by Happy2Play