New file

chrome/overlay_scrollbars.as.css

@@ -0,0 +1,62 @@
+/* This is supposed to be loaded as a agent sheet via autoconfig */
+/* It will not work otherwise and might do unexpected things */
+
+scrollbar {
+  -moz-appearance: none!important;
+  position: relative!important;
+  background-color: transparent;
+  z-index: 9;
+}
+scrollbar thumb{
+  -moz-appearance: none!important;
+  background-color: transparent;
+  pointer-events: auto;
+  opacity: 0.5;
+  transition: opacity 0.1s ease-in;
+}
+
+scrollbar[orient = "vertical"] thumb{
+  border-image-source: linear-gradient(to right, transparent 12px, black 14px);
+  border-image-width: 0 0 0 16px;
+  border-image-slice: 0% 0% 0% 100%;
+  border-image-repeat: stretch;
+}
+scrollbar[orient = "horizontal"] thumb{
+  border-image-source: linear-gradient(to bottom, transparent 12px, black 14px);
+  border-image-width: 16px 0 0 0;
+  border-image-slice: 100% 0% 0% 0%;
+  border-image-repeat: stretch;
+}
+
+scrollbar gripper,
+scrollbar scrollbarbutton{
+  display: none;
+}
+scrollbar[orient = "vertical"] {
+  min-width: 16px!important;
+  -moz-margin-start: -16px;/*margin to fill the whole render window with content and overlay the scrollbars*/
+}
+scrollbar[orient = "horizontal"] {
+  height: 16px!important;
+  margin-top: -16px;
+}
+scrollbar[orient = "vertical"] thumb{
+  border-right: 16px solid rgba(133, 132, 131, 1);
+  width: 16px;
+  min-height: 16px;
+}
+scrollbar[orient = "horizontal"] thumb{
+  border-bottom: 16px solid rgba(133, 132, 131, 1);
+  min-width: 16px !important;
+}
+scrollbar:hover {
+  background-color: rgba(0, 0, 0, 0.25);
+}
+scrollbar:hover thumb{ opacity: 1; }
+scrollbar:hover thumb{ border-image: none !important; }
+
+select > scrollbar,
+select > scrollbar > thumb{
+  -moz-appearance: initial !important;
+  -moz-margin-start: 0px !important
+}