/* CSS Document */

/* ==================================================================== */
/* SCROLLING DATA GRID - IE ONLY!                                       */
/* ==================================================================== */
/* 
Tables inside a scrollingdatagrid should have:
 1. border-collapse:separate
 2. No border or margin
 3. Background colors on all cells to avoid bleed-thru on scroll
 4. cellspacing="0" on the <table> tag itself
*/
DIV.scrollingdatagrid {
	overflow-x:auto;
	overflow-y:auto;
	position:relative;
	padding:0px;
}
DIV.scrollingdatagrid TABLE {
	width : 100%; /* Make room for scroll bar! */
	margin:0px;
	border:0px;
	border-collapse:separate;
}
DIV.scrollingdatagrid TABLE TR .locked, DIV.scrollingdatagrid TABLE THEAD TR, DIV.scrollingdatagrid TABLE TFOOT TR {
	position:relative;
}
/* OffsetParent of the TR is the DIV because it is position:relative */
DIV.scrollingdatagrid TABLE THEAD TR {
	top:expression(this.offsetParent.scrollTop);
}
/* OffsetParent of the THEAD and TFOOT locked column is the TR because it is position:relative */
DIV.scrollingdatagrid THEAD .locked, DIV.scrollingdatagrid TFOOT .locked {
	left:expression(this.offsetParent.offsetParent.scrollLeft);
}
DIV.scrollingdatagrid TBODY .locked {
	left:expression(this.offsetParent.scrollLeft);
}
/* The TFOOT should stick to the bottom of the DIV */
DIV.scrollingdatagrid TABLE TFOOT TR {
	top:expression(0 - this.offsetParent.scrollHeight + this.offsetParent.clientHeight + this.offsetParent.scrollTop);
}
/* Make the z-index values very clear so overlaps happen as expected! */
DIV.scrollingdatagrid TD, DIV.scrollingdatagrid TH { z-index:1; }
DIV.scrollingdatagrid TD.locked, DIV.scrollingdatagrid TH.locked { z-index:2; }
DIV.scrollingdatagrid THEAD TR, DIV.scrollingdatagrid TFOOT TR { z-index:3; }
DIV.scrollingdatagrid THEAD TR TH.locked { z-index:4; }
</style>
<style>
/* EXAMPLE STYLES FOR EXAMPLE TABLE */
table.example thead th {
	background-color:#ffcccc;
}
table.example tfoot td {
	background-color:#ccffcc;
}
table.example tbody td {
	background-color:#eeeeee;
}
table.example td, table.example th {
	border:1px solid #cccccc;
	border-width:0 1px 1px 0;
}
table.scrolltable tbody {
	max-height:485px;
	/*overflow:scroll;*/
}