/* Stylesheet for my demo pages for jScrollPane - these styles aren't necessary for using jScrollPane and aren't specific to any particular example */

a.jScrollArrowUp {
    background: url(basic_arrow_up.gif) repeat-x 0 0;
}
a.jScrollArrowUp:hover {
    background-position: 0 -15px;
}
a.jScrollArrowDown {
    background: url(basic_arrow_down.gif) repeat-x 0 0;
}
a.jScrollArrowDown:hover {
    background-position: 0 -15px;
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
    background-position: 0 -30px;
}

.orange-bar .jScrollPaneTrack {
    background: #f60;
}
.orange-bar .jScrollPaneDrag {
    background: #00f url(../images/drag_grab.gif) no-repeat 50% 50%;
}
.orange-bar .scroll-pane {
    background: #69f;
}
            
.holder {
    /*float: left;
    margin: 10px;*/
}

.scroll-pane {
    /*width: 200px;
    height: 200px;
    overflow: auto;*/
    
}

.wide {
    width: 400px;
}

.super-wide {
    width: 700px;
}

.tall {
    height: 400px;
}

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

.jScrollPaneTrack {
    position: absolute;
    cursor: pointer;
    right: 0;
    top: 0;
    height: 100%;
    background: #aaa;
}
.jScrollPaneDrag {
    position: absolute;
    background: #666;
    cursor: pointer;
    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;
    top: 0;
    right: 0;
    text-indent: -2000px;
    overflow: hidden;
    /*background-color: #666;*/
    height: 9px;
}
a.jScrollArrowUp:hover {
    /*background-color: #f60;*/
}

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