#tableContents table
{
	margin: 10px 0;
}
#tableContents td
{
	background: url(../images/common/toc_bottom.gif) no-repeat left bottom;
	font-size: 10px;
	width: 282px;
	margin-bottom: 10px;
	/* Add padding right since td width is 282 and image header is only 269 wide. So text is extending outside of area */
	padding-right: 13px;
	vertical-align: top;
}
#tableContents td img
{
	border: 1px #666 solid;
	float: left;
	margin-left: 8px;
}
#tableContents h2
{
	margin: 0;
	padding: 8px 2px 8px 8px;
	font-size: 12px;
	color: #039;
	text-transform: uppercase;
	background: url(../images/common/toc_top.gif) no-repeat left top;
}
#tableContents ul
{
	list-style: none;
	margin: 0 0 8px 76px;
	padding: 0 0 10px 0;
}
#tableContents li
{
	margin: 0;
	padding: 0 0 4px 10px;
	background: url(../images/common/arrow.gif) no-repeat 0px 3px;
}

/* commenting as it does not work in IE
#tableContents ul li:before
{
	content: "\003E \0020";
}*/
#tableContents a
{
	color: #039;
	text-decoration: none;
}

#tableContents a:link
{
	color: #039;
}

#tableContents a:visited
{
	color: #800080;
}


#tableContents a:hover
{
	color: #039;	
	text-decoration: underline;
}

#tableContents a:active
{
	color: #039;	
}