/*this holds the tabs and body of the page and places them 15px from the left edge of the viewport. The body margins are set to 0 so that the header will fit snugly in the upper left corner*/
#wrapper {
	margin: 0px 0px 10px 15px;
	width: 740px;
}
#wrapperAdmin {  /* Use for the sub tabs under new Admin*/
	margin: 0px 0px 10px 15px;
	width: 100%;
}

*html #main, *html #mainsub {
	height: 1%;
}
/* this is for the table which holds two side-by-side forms. I wanted to use floated divs, but caved in when I didn't have enough time to make them work...hence the tables instead which I know will work ;-(*/

#wrapper2col {
	width: 100%;
	padding: 0;
	margin: 0;
}
#wrapper2col td.left {
	padding-right: 10px;
	width: 50%;
}
/*This is the table that holds the page section below the tabs...it creates a border, colors the background, and keeps the sub-tables from extending beyond the borders of the page which they sometimes do if this were a div instead of a table. The rule display: table-cell seems to accomplish the same thing, but the tabs were overlapping the main page with that set-up. Might be worth revisiting*/
#main {
	color: #000;
	background: #ffffc0;
	margin: 0;
	border: 1px solid #666;
	font-size: 12px;
	width: 740px;
	/*display: table-cell;*/
}
#main td {
	vertical-align: top;
	padding: 2px 10px 10px;
}
/* this table defines the alignment of all the form elements*/
#main  table.formholder {
	border-right:1px solid #999;
	border-bottom:1px solid #999;
	width: 98%;
	margin-bottom: 5px;
	border-top: 1px solid #999;
	border-left: 1px solid #999;
}
#main  table.formholder td,tr,th,caption,thead,tfoot {
	padding: 3px;
	border: 0px none;
	vertical-align: top;
}
#main  table.formholder td {
	vertical-align: top;
}
#main  table.formholder th {
	font-size: 12px;
	font-weight: bold;
	text-align: left;
	vertical-align: top;
	border: 0px none;
}
#main #wrapper2col table.formholder-half {
	width: 98%;
	margin-bottom: 5px;
	border-right:1px solid #999;
	border-bottom:1px solid #999;
	border-top: 1px solid #999;
	border-left: 1px solid #999;
}
#main  table.formholder-half td,tr,th,caption,thead,tfoot {
	padding: 3px;
	border: none;
}
#main #wrapper2col table.formholder-half td {
	border: none;
}
#main  table.formholder-half th {
	border: none;
	font-size: 12px;
	font-weight: bold;
	text-align: left;
	vertical-align: top;
}
/* All the 'nav' rules control the display of the navigation tabs. It is based on Doug Bowman's "sliding doors" technique with refinements by Eric Meyer*/
#nav {
	margin: 0 0 0 0;
	padding: 0;
}
/*The left side of the tab is defined here*/
#nav  li {
	list-style: none; 
	float: left;
	margin-left: 0px; 
	padding-left: 16px;
  	font-size: 1em; 
	line-height: 20px; 
	white-space: nowrap;
  	background:  url(/newimages/tab_caretool_down.gif) no-repeat 0% 0%;
}
/* The right side of the tab is defined here*/
#nav  a {
	display: block; 
	float: left; 
	padding: 0 16px 0 0;
  	text-decoration: none; 
	font-weight: bold;
  	background: url(/newimages/tab_caretool_down.gif) no-repeat right top;
  	color: #333;
  	width: .1em;
}
/*this is the active tab*/
#nav  #active, #nav #active a {
  	background-image:  url(/newimages/tab_caretool_up.gif);
}
html>body #nav  a {width: auto;}    /* fixes IE6 hack */
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#nav  a {float: none;}            /* End IE5-Mac hack */
#nav  a:hover {
	text-decoration: underline;
}
/* Controls the secondary navigation for pages that have multiple pages under one tab, e.g. Assessment*/
#subnav {
	float: left;
}
#subnav a {
	text-decoration: underline;
	margin: 0;
}
#subnav a:hover {
	text-decoration: none;
}
#subnav a.active {
	font-weight: bold;
	color: #000;
	text-decoration: none;
	padding: 0; 
}
.subnavdivider {
	border-right: 1px solid #666666;
}