/*
 * Splitter container. Set this to the desired width and height
 * of the combined left and right panes. In this example, the
 * height is fixed and the width is the full width of the body,
 * less the margin on the splitter itself.
 */
#MySplitter {
	height: 400px;
	margin: 1em 3em;
	border: 4px solid #bdb;
	/* No padding allowed */
}
/*
 * Left-side element of the splitter. Use pixel units for the
 * min-width and max-width; the splitter plugin parses them to
 * determine the splitter movement limits. Set the width to
 * the desired initial width of the element; the plugin changes
 * the width of this element dynamically.
 */
#LeftPane {
	background: #efe;
	overflow: auto;
	/* No margin or border allowed */
}
/*
 * Right-side element of the splitter.
 */
#RightPane {
	background: #f8fff8;
	overflow: auto;
	/* No margin or border allowed */
}
/* 
 * Splitter bar style; the .active class is added when the
 * mouse is over the splitter or the splitter is focused
 * via the keyboard taborder or an accessKey. 
 */
#MySplitter .vsplitbar {
	width: 6px;
	background: #aca url(img/vgrabber.gif) no-repeat center;
}
#MySplitter .vsplitbar.active {
	background: #da8 url(img/vgrabber.gif) no-repeat center;
	opacity: 0.7;
}