html {
	height: 100%;
}

body {
	height: 100%;
	vertical-align: middle;
	margin: 0px;
	padding: 0px;
	background-image: url(main_bg.jpg);
	background-repeat: repeat-x;
	background-color:#000000;
}

.mainarea {
	width: 900px;
	background-color: #FFFFFF;
	border: 0px;
	padding: 0px;
	margin: 0 auto;
	text-align:left;
}

.footer {
	width: 900px;
	border: 0px;
	padding: 0px;
	padding-top:10px;
	margin:0 auto;
	height:30px;
	text-align:center;
	color:#FFFFFF;
	background-color:#000000;
}

a#back {
	color:#000000;
	padding-bottom:5px;
	text-decoration:none;
	float:left;
}

a#back:hover {
	color:#0f0080;
}

.container {
	padding: 0px;
	margin: 0px;
	vertical-align:top;

}

.centre {
	border: 0px;
	margin: 0px;
	padding: 0px;
}

.middle {
	text-align:right;
	width: 244px;
	padding-right: 36px;
	border-right: 1px dashed #606060;
}

.funbox {
	width: 402px;
	position: inline;
	margin-left: 15px;
	text-align:left;
	font-family: "Times New Roman", Times, serif;
	color: #000000;
	font-size: medium;
}

.title {
	color: #000080;
	font-size: x-large;
}

.picture {

	}
.nav {
	width: 260px;
	text-align:left;
}

ul#mainnav {
	margin: 0px;
	padding: 0px;
	}
		
ul#mainnav li {
	display: block;
	border-top: 1px dashed #606060;
	list-style-type:none;
	}

ul#mainnav li a {
	display: block;
	margin: 0px 0px 0px 0px;
	padding: 7px 6%;
	font: bold 0.8em /1.5 arial, sans-serif;		/* If you get an unwanted gap after your a block (IE-Win) try increasing the line height		*/
	color: #606060;
	text-decoration: none;
	width: 88%;				/* 	Causes Problems in IE5-Mac and Netscape/Mozzilla - see next fix		*/
	}

ul#mainnav li a:hover {
	background-color: #000080;
	color: #FFFFFF;
	}