.jScrollPaneContainer{position:relative; overflow:hidden; z-index:1}

.jScrollPaneTrack{position:absolute; cursor:pointer; background:#efe3c7; width:13px!important; border:1px #dccca5 solid; right:0; top:0px!important; height:242px!important}
.jScrollPaneDrag{position:absolute; background:#dbc283; cursor:pointer; height:30px!important; overflow:hidden}
.jScrollPaneDragTop{position:absolute; top:0; left:0; overflow:hidden}
.jScrollPaneDragBottom{position:absolute; bottom:0; left:0; overflow:hidden}
a.jScrollArrowUp{display:block; position:absolute; z-index:1; bottom:15px; right:0; text-indent:-2000px; overflow:hidden; height:15px}
a.jScrollArrowUp:hover{/*background-color:#f60; */}

a.jScrollArrowDown{display:block; position:absolute; z-index:1; bottom:0; right:0; text-indent:-2000px; overflow:hidden; height:15px}
a.jScrollArrowDown:hover{/*background-color:#f60; */}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover{/*background-color:#f00; */}

/* Stylesheet for my demo pages for jScrollPane - these styles aren't necessary for using jScrollPane and aren't specific to any particular example */
body{font-family:Arial,Helvetica,sans-serif; font-size:80%}

a.jScrollArrowUp{background:url(../images/scroll/up.gif) repeat-x 0 0}
a.jScrollArrowDown{background:url(../images/scroll/down.gif) repeat-x 0 0}
a.jScrollArrowDown:hover{background-position:0}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover{background-position:0}

.orange-bar .jScrollPaneTrack{background:#efe3c7; border:1px #dccca5 solid}
.orange-bar .jScrollPaneDrag{background:#00f url(../images/drag_grab.gif) no-repeat 50% 50%}
.orange-bar .scroll-pane{background:#69f}

.holder{float:left; margin:15px}

.scroll-pane{width:283px; height:200px; overflow:auto; float:left}

.wide{width:400px}

.super-wide{width:700px}

.tall{height:400px}

#pane2{height:267px; width:264px; padding-right:16px}
#pane2 p.first{margin-top:0px}