#xr_kit-outer-container {
	overflow: hidden;
	width: 960px;
	/*height: 380px;*/
	height:400px;
	
	position: relative;
}

#xr_kit-inner-container {
	height: 380px;
	position: relative;
}

#outer-container {
	overflow: hidden;
	width: 960px;
	height: 292px;
	position: relative;
}

/* The inner container (this is the container that is moving inside the outer-container) */
#inner-container {
/* You can of course also set this dynamically later on with javascript */
	height: 272px;
	position: relative;
}

.xr_kit_outer_big {
	height:320px !important;
}

.xr_kit_outer_big_inner_container {
	height:300px !important;
}


/* From here follows the elements (the scrollbar) that is created by the Javascript */
/* You can obviously remove the box-shadows, border-radius, opacity and the background colors */

/* This is the scrollbar container - style it as you like */
#scroller {
	width: 100%; 
	height: 20px; 
	position: absolute; 
	bottom: 0; left: 0; 
	z-index: 100;
	background: url("../images/xr/scrollbar_bg.gif");
}

/* This is the draggable slider - style it as you like */
#slider {
	width:254px; 
	height:20px; 
	background: #333;
	position: absolute;
	background: url("../images/xr/scrollbar_drag.gif") ;
}

/* If it's a vertical scroller we need to do some changes */
#scroller.vertical {
	height: 100%;
	width: 7px;
	top: 0;
	right: 0px;
	left: auto;
	bottom: auto;
}
#scroller.vertical #slider {
	height: auto;
	width: 100%;
}