@charset "utf-8";
/* CSS Document */

body  {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#666666;
	background:white;
	background-color:#ffffff;
	margin: 0;
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	
	}
#container {
	width:98%;
	min-width:800px;
	background-color:#FFFFFF;
	margin:0px auto 0 auto;
	padding-top:100px;
	position:relative;
	text-align: left; /* this overrides the text-align: center on the body element. */
	}

#top {
	width: 98%;
	position: fixed;
	min-width: 800px;
	top: 0px;
	left: 5px;
	background-image: url(../images/topbg.png);
	background-repeat: repeat-x;
	z-index: 100;
}
	
#topleft {
	float:left;
	
	}

#topright {
	float:right;
	}
		
#left {
	width:18%;
	min-width:150px;
	background-color:#FFFFFF;
	float:left;
	position:fixed;
	top:100px;
	left:5px;
	}
	
	
#main {
	width:100%;
	position:relative;
	float:right;
	margin:0px auto 0px auto;
	background-color:#ffffff;

	}
	
#imgRotator { /*Sits inside main div remeber to be careful with floats and positioning*/
	width:585px;
	margin:0px auto 5px auto;
	padding-left:110px;
	background-color:#FFFFFF;
	/*align slightly off in Firefox, only a few pixels so doesn't matter too much*/
	} 

#mainLeft {
	width:38%;
	float:left;
	margin:0px auto 0px auto;
	background-color:#FFFFFF;
	border-left: none;
	margin-left:20%;
	padding-right:0px;
	}

#mainLeft p {
	
	}



#mainRight {
	width:38%;
	float:right;
	margin:0px auto 0px auto;
	background-color:#FFFFFF;
	border-left: solid 1px #CCC;
	padding-left:10px;
	padding-right:10px;
	}
	
	
	
		
#bottom
	{
	width:100%;
	margin: 5px auto 5px auto;
	font-size:9px;
	text-align:center;
	padding:2px;
	background-color:#666666;
	color:white;
	margin-bottom:5px;
	}
	
	
	
/* Miscellaneous classes for reuse */

.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page The floated element must precede the element it should be next to on the page. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain its child floats */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
.grey {/*for giving grey bg white text*/
	font-size:14px;
	background-color:#666666;
	color:#FFFFFF;
	padding-left:7px;
	}
.blue {
	color:#666;
	font:large;
	font-style:bold;
	font-weight:bolder;
	}
	
#searchbox {
	clear:both;
	
	float:right;
	
	}

#searchbar {
	clear: both;
	float: left;
	position: relative;
	width: 100%;
	font-size: 18px;
	margin: 0px auto 5px auto;
	background-color: #666666;
	color: #FFFFFF;
	padding-left: 5px;
	padding-bottom: 5px;
	margin-top: -3px;
	padding-top: 0px;
}	

.clearfloattop { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain its child floats */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
	 margin-top:-15px;
	 margin-bottom: 0px;
	}
	
#tooltip{
	z-index:1000;
	position:absolute;
	width:190px;
	border:1px solid #333;
	background:#666;
	padding:2px 5px;
	color:#fff;
	display:none;
	}
	
/*styling for list navigation may move to separate folder as getting quite long now*/

.navmenu {
	list-style-type:none;
	margin-left:0px;
	}

.navmenu a{
	text-decoration: none;
	color: #fff;
	padding-left: 7px;
	display: block;
	background-color: #666666;
}

.submenu {
	list-style-type:none;
	margin-left:1px;
	border-left:1px solid #aaa;
	border-right:1px solid #aaa;
	border-bottom:1px solid #aaa;
	}

.submenu a{
	color:#0079F2;
	background-color:#cccccc;
	font-size:11px;
	list-style-type:none;
	}
	
.submenu a:hover {
	background-color:#aaa;
	color:#FFFFFF;
	}
	
	
.firstline {
	font-size:12px;
	color:#666666;
	}

ul {
	list-style-type:circle; 
	font-style:bold; 
	font-size:small;
	}

ul li{
	text-decoration:none;
	
	}

	
#screenshot{
	position:absolute;
	z-index:1000;
	width:190px;
	background:#FFF;
	padding:5px;
	border:1px solid #666;
	display:none;
	color:#666;
	}

#mainLeft a {
	
	color:#0079f2;
	text-decoration:none;
	font-size:small;
	}

#mainLeft a:hover {
	font-style:bold;
	color:#0000CC;
	text-decoration:none;
	font-size:small;
	}
	
#mainRight a {
	
	color:#0079f2;
	text-decoration:none;
	font-size:small;
	}
#mainRight a:hover {
	font-style:bold;
	color:#0000CC;
	text-decoration:none;
	font-size:small;
	}

#mainRight a.buttons {
	
	color:#0079f2;
	text-decoration:none;
	font-size:20px;
	font:Arial, Helvetica, sans-serif;
	font-weight:bold;
	}
#mainRight a.buttons:hover {
	font-style:bold;
	color:#0000CC;
	text-decoration:none;
	font:Arial, Helvetica, sans-serif;
	font-size:20px;
	}