/* NOTE: container div also specifies width and height (in head of demo) */
div#rechts1 { 
    position:absolute; /* scroll area div must be positioned */
    width:300px; height:375px; /* width and height required. adjust to suit */
    overflow:hidden; /* required! */
	}
div#mitte1 { 
    position:absolute; /* scroll area div must be positioned */
    width:570px; height:375px; /* width and height required. adjust to suit */
    overflow:hidden; /* required! */
	}
div#scrollbar {
    position:absolute;
    /* include following if you don't want scrollbar hidden when insufficient content for scrolling */
    /* visibility:visible !important; */ 
    width:11px; height:375px;
    right:0; /* at right edge in container div */
    font-size:1px; /* for ie cooperation */
    }
div#scrollbar1 {
    position:absolute;
    /* include following if you don't want scrollbar hidden when insufficient content for scrolling */
    /* visibility:visible !important; */ 
    width:11px; height:375px;
    right:0; /* at right edge in container div */
    font-size:1px; /* for ie cooperation */
    }
div#scrollbar .up {
    /*background-image:url('../images/btn-up.gif');
    background-repeat: no-repeat;*/
    width:11px; height:0px; /* specify width and height of your image */
    position:absolute; top:0;
    }
div#scrollbar .down {
    /*background-image:url('../images/btn-dn.gif');
    background-repeat: no-repeat;*/
    width:11px; height:0px; /* specify width and height of your image */
    position:absolute; bottom:0;
    }
div#scrollbar .track
{
    position: absolute; /* track must be positioned */
    left: 0;
    top: 0px; /* equal to height of .up image plus optional 1px for gap */
    width: 11px;
    height: 375px; /* height of scrollbar minus 2 X image height minus optional 2px for gap */
    background-color: #144f53;
}
div#scrollbar .dragBar {
    position:absolute; /* dragBar must be positioned */
    background-color:#018077; /* 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:1px; /* optional, small gap between track and dragBar */
    }

/* for clutzy draggers */
div#scrollbar {
    -moz-user-select: none;
    -khtml-user-select: none;
    }
    
div#scrollbar1 .up {
    /*background-image:url('../images/btn-up.gif');
    background-repeat: no-repeat;*/
    width:11px; height:0px; /* specify width and height of your image */
    position:absolute; top:0;
    }
div#scrollbar1 .down {
    /*background-image:url('../images/btn-dn.gif');
    background-repeat: no-repeat;*/
    width:11px; height:0px; /* specify width and height of your image */
    position:absolute; bottom:0;
    }
div#scrollbar1 .track
{
    position: absolute; /* track must be positioned */
    left: 0;
    top: 0px; /* equal to height of .up image plus optional 1px for gap */
    width: 11px;
    height: 375px; /* height of scrollbar minus 2 X image height minus optional 2px for gap */
    background-color: #144f53;
}
div#scrollbar1 .dragBar {
    position:absolute; /* dragBar must be positioned */
    background-color:#018077; /* 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:1px; /* optional, small gap between track and dragBar */
    }

/* for clutzy draggers */
div#scrollbar1 {
    -moz-user-select: none;
    -khtml-user-select: none;
    }