/*
.holder {
	float: left;
	margin-bottom:10px;
}
*/

.scroll-pane {
	overflow: auto;
	/*background-color: #D1D1C7;*/
	float: left;
}



#main-scroll {
	width: 420px;
	height: 420px;
}
#side-scroll {
	width: 210px;		/* was: 200px */
	height: 408px;		/*was: 370px*/
}

#photographic-scroll {
	height: 400px;
}


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

.jScrollPaneTrack {
	position: absolute;
	background-color: #A7A79F;
	background-color:transparent;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	opacity:0.9;
	filter:alpha(opacity=90);
	
	
		border:1px solid #808080; /* ?? */

	
}
.jScrollPaneDrag {
	position: absolute;
	/*background: #897668;*/
	background-color:#C2BFB4;
	cursor: pointer;
	overflow: hidden;
}




/* For the "main-column":  fix the height of the track so we can see bottom border  */
#main-column .jScrollPaneTrack {
 height:418px; /* NOTE! Must be 2px less than the height of .scroll-pane#main-scroll !! (see also, #main-column?) */
}
#main-column  .jScrollPaneDrag {
 background-color:#A7A79F;
}

/* For the "side-column":  override different colors for scrollables in the "side-column" */
#side-column .jScrollPaneTrack {
	background-color: #897668;
	background-color:transparent;
	border:1px solid #CCC;
 height:406px; /* NOTE! Must be 2px less than the height of .scroll-pane#side-scroll !!! */

}
#side-column .jScrollPaneDrag {
	background-color: #A7A79F;
}

/* For the "photographic templates":  fix the height of the track so we can see bottom border  */
#main-column-content .jScrollPaneTrack {
 height:398px;
 background-color:#BBB;
 border-color:#222;

}
#main-column-content .jScrollPaneDrag {
	background-color: #222;
}
#photographic-scroll p {
 margin-right:5px;
}



.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;*/
}