.scroll-track{
height:8px;
width:10px;
/*background-image: url('http://www.jools.net/assets/VScrollTrackFill.png');*/
background-repeat: repeat;
padding-left: 5px;
}

.scroll-handle {
border: 0px;
height:10px;
width:10px;
background-image: url('/gfx/scroll_in.gif');
background-repeat: repeat;
cursor:pointer;
}

.scroll-track-top{
	height:10px;
	width:10px;
	background-image: url('/gfx/scroll_up.gif');
	background-repeat: no-repeat;
	background-position: center;
	margin-left: 5px;
}

.scroll-handle-bot{
height:3px;
width:10px;
background-image: url('/gfx/scroll_in_down.gif');
}

.scroll-handle-top{
height:2px;
width:10px;
background-image: url('/gfx/scroll_in_up.gif');
background-repeat: no-repeat;
}

.scroll-track-bot{
	height:10px;
	width:10px;
	background-image: url('/gfx/scroll_down.gif');
	background-repeat: no-repeat;
	background-position: center;
	margin-left: 5px;
}

.splitpane-divider {
    border: 1px solid black;
    background:#5B207B;
    opacity: .5;
   filter: alpha(opacity=50);
}

/* The classes/ids below are just used in this example. You can use whatever you like */
#parent {
    width: 100%;
    background: #eeeeee;
}

.column {
    float: left; /* This is forces the page content to adjust to changes in height of the columns */
    overflow: hidden; /* As a precaution, all content is clipped to the column width */
    margin: 0; /* This and padding need to be zero */
    padding: 0;
    z-index: 1;
    background:#E7FECD;
    color: #666666;
    width: 33%; /* Default value, overridden by class */
}

/* Any spacing must be on a child of the column, not the column itself */
.content {
	border: 1px solid black;
	margin: 5px;
	padding: 5px;
}