#StatusBar {
  --pane-disk-icon: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABIUlEQVR4AWKgGOTmZzbkFWQDOCMDFQZhGIju/39TAWrSoLYguupt14K2DJgoPHJc4gMRT+C7L4YnT4wxS7Jg33eYGbz38GU2WO6ZLe+ZQwyXIL0TRLUgAv0iWtC6E4USVYRQCbZtg3MDhqHGwZV87ao5z/MlWNc1S/q+vwW/f5qmVmBmdyS84W0rWJYFXdedEjKOIzvCnLuUEm/O7hQcx/H3lxERIb+CDxdjoEExCEDR//+KAbYGg9kzAlVUqSoK1Lfc94To4TjXxfHeQ2u9IKVc9j+11iUwzm3bcF0XKKUQQkAphRgjCCHIOU+/7wtjDGbAOQfOOc6T4L5vMMZmwFqLYz+QUvp5H/48zxrovaO1NimlDEII3+HCcAMoz0yUAgBzjuKercwF7wAAAABJRU5ErkJggg==);
}

#meter-disk-pane .icon {
  background-image: var(--pane-disk-icon);
}
#meter-disk-holder {
  border: inset 1px #BBBBBB;
  position: relative;
  height: 18px;
}
#meter-disk-value {
  height: 100%;
}
#meter-disk-text {
  position: absolute;
  top: 0;
  text-align: center;
  width: 100%;
  height: 100%;
}

/* Custom break point settings for responsiveness */

/* X-Small devices (portrait phones, less than 576px) */
/* No media query for `xs` since this is the default in Bootstrap */
/* Custom rules for x-small devices */
#meter-disk-holder {
  width: 50px;
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
  /* Custom rules for large devices */
  #meter-disk-holder {
    width: 100px;
  }
}
