/* NOTE: container div also specifies width and height (in head of demo) */

#scrollbar_decoration {
	background-image: none !important;
	width: 13px;
}
div#wn {
	position: relative; /* scroll area div must be positioned */
	width: 638px;
	height: 392px; /* width and height required. adjust to suit */
	overflow: hidden; /* required! */
}
div#scrollbar {
	position: relative;
	/* include following if you don't want scrollbar hidden when insufficient content for scrolling */
    /* visibility:visible !important; */
	width: 11px;
	height: 388px;
	right: 0; /* at right edge in container div */
	font-size: 1px; /* for ie cooperation */
	background-color: transparent;
	border: 1px solid transparent;
}
div#scrollbar .up {
	background-image: url(../images/scroll_up.png);
	background-repeat: no-repeat;
	cursor: pointer;
	width: 11px;
	height: 11px; /* specify width and height of your image */
	position: absolute;
	top: 0;
}
div#scrollbar .down {
	background-image: url(../images/scroll_down.png);
	background-repeat: no-repeat;
	cursor: pointer;
	width: 11px;
	height: 11px; /* specify width and height of your image */
	position: absolute;
	bottom: 0;
}
div#scrollbar .track {
	position: absolute; /* track must be positioned */
	left: 0;
	top: 11px; /* equal to height of .up image plus optional 1px for gap */
	width: 11px;
	height: 366px; /* height of scrollbar minus 2 X image height minus optional 2px for gap */
}
div#scrollbar .dragBar {
	cursor: pointer;
	position: absolute; /* dragBar must be positioned */
	background-color: transparent; /* can use background-image if you like */
	width: 9px;
	height: 20px; /* code auto-sizes */
	/* height:20px !important;  use !important to prevent code from sizing dragBar according to amount of content */
	top: 1px;
	left: 0; /* optional, small gap between track and dragBar */
	border: 1px solid #5c7598;
}

/* for clutzy draggers */

div#scrollbar {
	-moz-user-select: none;
	-khtml-user-select: none;
}