/******************************************************************************
 * GRID CSS
 * Provides a bordered grid for displaying tabular data or a tabluar form
 * Background color ensures that underlying elements don't bleed-through.
 * 
 * Fonts are not specified here.  The cascade determines the fonts. Fonts can be 
 * touched up by setting class="f11" on a cell, row, or the entire table .
 * 
 * Margins can be set with class="grid m" or by padding the container that holds the table
 * /

/* standard th column headers */
table.grid th { 
	background-color: #EDF1F6;
	border: 1px solid #E1E1E1;
	color: #5D563F;
	padding: 3px 5px; 
	text-align: left;
}

/* a distinctive title row that typically colspans the entire table */
table.grid th.title { 
	background-color: #FEF9C4;
	color: #525E70;
	font-weight: bold;
}

/* th alignment touchups */
table.grid th.right { text-align: right; }
table.grid th.center { text-align: center; }

/* standard td grid cell that contains data */
table.grid td { 
	background-color: white;
	border: 1px solid #E1E1E1;
/*	color: black; messes up IE block anchors */
	padding: 3px 5px; 
	vertical-align: top;
}

table.grid td.p { padding: 5px 5px; }

/* in a form, make the TRBL grid spacing symmetrical */
form table.grid td { padding: 3px 3px; }

/* when you want a td that is colored just like a th */
table.grid td.head {
	background-color: #EDF1F6;
	color: #5D563F; 
}

/* when you want a blank cell with no border or text that looks like a hole in the grid */
/* use this for an entire column if you want to simulate two side by side grids */
table.grid td.blank, table.grid th.blank {
	border-width: 0px;
	background-color: inherit;
	font-size: 25%;
}

/* for striping rows */
table.grid tr.stripe td { background-color: #F5F5F5; }
/* but not for nested grids */
table.grid tr.stripe table.grid th { background-color: #EDF1F6; }
table.grid tr.stripe table.grid td { background-color: white; }

/* when you nest a table inside a table.grid td, the pattern is borderless */
/* the spacing simulates <BR>s but with columns */

/* a grid cell that contains a nested table splits the vertical padding in half */
table.grid td.table, table.grid th.table { padding: 3px 0px 3px 0px;  }

table.grid td.table td, table.grid th.table th { 
	background-color: transparent;
	color: inherit;
	border-width: 0px;
	padding: 0px 5px 0px 5px; 
}

/* a nested table in a th should center vertically */
table.grid th.table td { vertical-align: middle; }

/* in a form, make the grid spacing symmetrical */
form table.grid td.table td, form table.grid th.table th { padding: 0px 3px 0px 3px; }

/* use this in conjunction with table.grid to have a borderless grid */
table.plain td, table.plain th {
	background-color: transparent;
	border-width: 0px;
}
/* background image on title */
table.grid th.title
{
	background-image: url(grid-title.jpg); 
	background-repeat: repeat-y;
	background-position: right;
}

