body {
width: 800px;
margin:0 auto;
background: #ccc;
color: #999;
font-size: small;
border-left: 20px solid #fff;
border-right: 20px solid #fff;
	}

/* ----- Page styles ---------- */

h1, h2, h3, h4 {padding: 10px; letter-spacing: .1em;}

p {
	padding: 10px;
	line-height: 150%;
}

a:link,
a:visited {
	color: #666;
	}
a:hover {
	color: #333;
	}

a.pdf:link,
a.pdf:visited {
	background: url("../img/pdf.gif") no-repeat left;
	height: 18px;
	line-height: normal;
	margin: 0px;
	padding-left: 26px;
	vertical-align: middle;
	text-decoration: none;
	font-size: 90%;
	}

/* ----- HEADER ----- */



#header {
width:800px;
height:160px;
padding: 0px;
background-color: #fff;
}



/* FAUX LAYOUT WRAPPER */


/* 
This div is optional: When you delete it the navigation bar and the content block won't have the same size when one of them has a larger height then the other. I recommend you to leave this faux layout wrapper here.

IMPORTANT: In order to make this work you have to download http://csseasy.com/layouts/fixed/background_3.gif (copy past in your address bar) and place it in the same folder as this html file. DON'T HOTLINK to this file.
*/


#wrapper{
width:800px;
background: #fff; /* WARNING: IF YOU CHANGE THE COLORS OF THE LAYOUT YOU HAVE TO CHANGE THIS IMAGE! */
overflow:auto; /* USE FIREFOX GUYS! WE ONLY NEED THIS LINE BECAUSE INTERNET EXPLODER ISN'T READING CODE PROPERLY */
margin-top:0px;
}


/* ----- NAVIGATION ----- */



#navigation {
width:100px;
min-height:500px; /* for modern browsers */
height:auto !important; /* for modern browsers */
height:500px; /* for IE5.x and IE6 */
background-color:#fff;
float:left;
}

#menu {
height: 100px; 
background: #ccc;
display: inline;
margin-left: 134px;
}


#menu ul
{
	margin-top: 20px;
	padding: 0;
	background-color: #fff;
	list-style: none;
}

#menu ul li
{
	float: left;
	padding: 0;
	margin: 0;
	list-style: none;
}


#menu a:link,
#menu a:visited,
#menu a:hover
{
	height: 80px;
	width: 80px;
	padding: 10px;
	display: block;
	font: 11pt bold verdana, sans-serif;
}

#menu a:link, #menu a:visited
{
	color: #999;
	text-decoration: none;
}

#menu a:hover
{	
	color: #666;
	text-decoration: none;
}

/* ----- MAIN CONTENT ----- */



#content { 
margin-left:130px;
width:650px;
min-height:500px; /* for modern browsers */
height:auto !important; /* for modern browsers */
height:500px; /* for IE5.x and IE6 */
background-color:#fff;
margin-top:0px;
}

#main {
margin-top:0px;
margin-left:153px; 
min-height:500px; /* for modern browsers */
height:auto !important; /* for modern browsers */
height:500px; /* for IE5.x and IE6 */
background-color:#fff;
padding:0;
}

#main td {
width:450px;
margin:0;
padding:0;
}

#main p {
margin:0;
padding:0 0 18px 0;
font-family:arial;
color: #999;
}

#main .maintitle {
	font-size: 160%;
	color: #505050;
	font-style: italic; 
}

#main a:link,
#main a:visited
{
	color: #999;
	text-decoration: none;
}

#main a:hover
{
	color: #333;
	text-decoration: none;
}

/* ----- FOOTER ----- */



#footer { 
margin-top: 0px;
width:800px;
height:100px;
background-color: #fff;
}

#footer p {
margin-left: 140px;
padding: 10px 0px;
font-size: x-small;
}

#footer ul
{
	margin-top: 20px;
	margin-left: 140px;
	padding: 0;
	background-color: #fff;
	list-style: none;
	display: inline;
}

#footer ul li
{
	padding: 0 10px 0 0;
	margin: 0;
	display: inline;
	list-style: none;
	font-size: x-small;
}