@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

@-moz-document url(chrome://browser/content/browser.xul) {
  #statusbar-icon > .progress-bar {
    -moz-appearance: none !important;
    background-color: #f00 !important;
  }

  #statusbar-icon[value^="1"]:not([value="1"]):not([value="100"]) > .progress-bar {
    background-color: #f30 !important;
  }

  #statusbar-icon[value^="2"]:not([value="2"]) > .progress-bar {
    background-color: #f60 !important;
  }

  #statusbar-icon[value^="3"]:not([value="3"]) > .progress-bar {
    background-color: #f90 !important;
  }

  #statusbar-icon[value^="4"]:not([value="4"]) > .progress-bar {
    background-color: #fc0 !important;
  }

  #statusbar-icon[value^="5"]:not([value="5"]) > .progress-bar {
    background-color: #ff0 !important;
  }

  #statusbar-icon[value^="6"]:not([value="6"]) > .progress-bar {
    background-color: #cf0 !important;
  }

  #statusbar-icon[value^="7"]:not([value="7"]) > .progress-bar {
    background-color: #9f0 !important;
  }

  #statusbar-icon[value^="8"]:not([value="8"]) > .progress-bar {
    background-color: #6f0 !important;
  }

  #statusbar-icon[value^="9"]:not([value="9"]) > .progress-bar {
    background-color: #3f0 !important;
  }

  #statusbar-icon[value="100"] > .progress-bar {
    background-color: #0f0 !important;
  }
}