Custom universal scrollbar for Firefox/WebKit-based browsers

scrollbar.css

/* Show custom scrollbar on devices with a large display (laptops, desktops, etc.) 
   as smaller devices usually have a neat scrollbar already */
@media (min-width: 992px) {
  /* Firefox */
  @supports (scrollbar-width: thin) {
    * {
      /* First collor is responsible for the thumb color, the second one - for the track color */
      scrollbar-color: #b9b9b9 #f0f0f0;
      scrollbar-width: thin;
    }
  }

  /* WebKit-based browsers */
  ::-webkit-scrollbar {
    /* It should result in a scrollbar with roughly the same width 
       as the one with scrollbar-width: thin; */
    width: 10px;
  }

  ::-webkit-scrollbar-thumb {
    background: #b9b9b9;
  }

  ::-webkit-scrollbar-track {
    background: #f0f0f0;
  }
}