/* TWO COLUMN LAYOUT */

body {
	text-align:center; /* IE6 needs this to center the layout in the browser window */
	background: #069;
	}
#main_wrapper {
	max-width:960px; /* sets max layout width */
	min-width:720px; /* centers layout in browser */
	text-align:left; /* resets the centering hack for IE6 on the body tag */
	width: 700px;
	background: white;
	margin: 20px auto;
	}
#header {
	vertical-align: top;
	}
#nav {
	width:25%; /* this width + content width must total 100% */
	float:left; /* floats on nav and content divs make them sit side by side */
	text-align: right;
	}
#content {
	margin-right: 1em;
	}
/* here comes a hack for IE6 */
/* floating this element gets rid of the gap between the nav and content - the hateful 3 pixel jog bug in IE */
/* if I float this element in other browsers, the layout breaks - don't remove this comment \*/
* html #content { 
	float:left; 
	}
/* end of hack - don't remove this comment */
#footer {
	clear:both; /* TEMP - REMOVE OR RESTYLE  */
	}
#header_inner, #nav_inner, #content_inner, #promo_inner {
	overflow:hidden; /* clips oversize elements that would otherwise expand divs and break the layout */
	}
#header_inner { 
	padding:1em 2em; /* creates space between the box  and the content */
	}
#nav_inner {
	padding:1em 1em 1em 0.5em;
	}
#content_inner {
	padding:1em 1em 1em 1.5em;
	color: #F00;
	}
#footer_inner {
	padding:.5em 1em; /* creates space between the box and the content */
	text-align:center;
	}
* html {
#content a {
	text-transform: none;
	color: #000;
	text-decoration: underline;
}
#main_wrapper #header #header_inner a {
	font-size: 12px;
	line-height: 12px;
	text-transform: capitalize;
	color: #069;
	text-decoration: none;
	font-style: normal;
	font-weight: normal;
}
#main_wrapper #header #header_inner a hover {
	font-weight: normal;
	text-transform: uppercase;
	color: #906;
	text-decoration: none;
}
#main_wrapper #content #content_inner table tr td {
	text-align: center;
	background: center center;
}