* :focus { outline: 0; }
img	{border: none;}
a {text-decoration: none;}
a:link {color:#006600;}
a:visited {color:#009900;}
a:active {color:#FF9933;}


body {behavior:url(csshover.htc);
		background-image:url(images/bg-dark.jpg);
		text-align: center;}
		
#main_wrapper {
	background-color:#FFFFFF;
	border: 8px solid #000000;
	margin-left:auto;
	margin-right:auto;
	width:900px;
	}

div.col {float:left; text-align: center;}

#header {
	border-bottom: 5px solid #000000;
	}

		div#menu {
			text-align: center;
			margin-left: 155px;
			height: 77px;
			}
			
					
			div#words {height: 61px; width: 110px; padding: 10px;}
			div#music {height: 61px; width: 110px; padding: 10px;}
			div#visual {height: 61px; width: 110px; padding: 10px;}
			div#info {height: 61px; width: 110px; padding: 10px;}
			

#nav {
	width:20%; /* width + content width must = 100% */
	float:left; /* floats on nav and content divs make them sit side by side */	
	}
	
#content {
	/* default auto width */
	}
/* hack for IE6 */
/* floating this element gets rid of the gap between the nav and content - the hateful 3 pixel jog bug in IE */
/* floating this element in other browsers makes layout break - don't remove this comment \*/
* html #content { }
/* end of hack */


#footer {
	clear:both; /* makes the footer sit below whichever column is longest */
	background:#DDC;
	}
#header_inner, #nav_inner, #content_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 .5em; /* creates space between the box and the content */
	border-right:2px dotted #666666;
	border-bottom:2px dotted #666666;
	margin-bottom:10px;;
	background-color:#CCCCCC;
	}

#content_inner { 
	padding:1em 1em 1em 1.5em; /* creates space between the box and the content */
	}
#footer_inner {
	padding:.5em 1em; /* creates space between the box and the content */
	text-align:center;
	}
* html {}