div#scrollbar {
    display:block; /* initially display:none; to hide from incapable */
    z-index:1;
}
    
div#scrollbar { 
  position:relative;
  width:5px; height:582px; 
  font-size:1px;  /* so no gap or misplacement due to image vertical alignment */
  }
div#track { 
  position:absolute; left:0; top:5px;
  width:6px; height:570px;
  background: #F9D03E;
  z-index: -1;
  }
div#dragBar {
  position:absolute; left:1px; top:0px;
  width:4px; height:570px;
  background-color:#000;
  }  
div#up { position:absolute; left:-4px; top:0px;}  
div#down { position:absolute; left:-4px; bottom:-5px; }

/* for safari, to prevent selection problem  */
div#scrollbar, div#track, div#dragBar, div#up, div#down {
    -moz-user-select: none;
    -khtml-user-select: none;
}
div.mouseover {
   position:absolute;
   right:0px;
   height:10px;
   background:#000000;
   filter:alpha(opacity=0);
   -moz-opacity: 0;
   -khtml-opacity: 0;
   opacity: 0;
}
a.mouseover_up, a.mouseover_down {
 display:block;
 text-align:left;
}
a.mouseover_up:hover {
 cursor: url(/src/tpl2/csu.cur);
}
a.mouseover_down:hover {
 cursor: url(/src/tpl2/csd.cur);
}
/* so no gap or misplacement due to image vertical alignment
font-size:1px in scrollbar has same effect (less likely to be removed, resulting in support issues) */
div#scrollbar img {
    display:block; 
    }