div#scrollbar
{
    display: block; /* initially display:none; to hide from incapable */
}

div#wn
{
    position: relative;
    width: 463px; 
    height: 140px; 
    overflow:hidden;
}

div#scrollbar
{
    position: relative;
    width: 11px;
    height: 140px;
    font-size: 1px; /* so no gap or misplacement due to image vertical alignment */
}
div#track
{
    position: absolute; left:0; top:12px;
    width: 9px;
    height: 116px;
    background-color: transparent;
    background: url( '../../images/scroll_bar/background_vert_scroll.gif' ) repeat-y;
    background-position: -1px 0px; /*background: #898d93;*/ /*margin-left: 5px;*/ /*border: 1px solid red;*/ /*background: #336;*/
}
div#dragBar
{
    position: absolute;
    left: 0px;
    top: 0px;
    width: 7px;
    height: 20px;
    background-color: #898d93; /*background-color:#ceced6;*/
}
div#up
{
    position: absolute;
    left: 0;
    top: 0;
}
div#down
{
    position: absolute;
    left: 0;
    bottom: 0;
}

/* for safari, to prevent selection problem  */
div#scrollbar, div#track, div#dragBar, div#up, div#down
{
    -moz-user-select: none;
    -khtml-user-select: none;
}


/* 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;
}