/* CSS file for www.cyber-reality.com NEW SITE*/
html, body, div, table{ margin: 0px; padding: 0px; }
body {
	background: #A5B5C6 url(../img/BigSprocket.jpg) no-repeat fixed left top;
	font: 1em/1em Arial Helvetica sans-serif;
	}

h1 {	font: bold x-large Arial, sans-serif;
	color: #43616B;
	margin-top: 0;
	}
h2 {	font: bold medium Arial, sans-serif;
	color: #9C1A1E;
	}
p, .main p, .tablefont  {font: 0.9em/1em arial, sans-serif;}
	
a {color: #34339B;}
a:hover {color: #9C191E;}

hr {color: #A5B5C6;
	height: 1px;}
	
a img {	border: 0 none;
	display: block;			/* removes extra space underneath caused by default text-alignment */
	}
	
.main	{
	float: right;
	width: 75%;
	padding: 1% 0 0 2%;
	color: #000;
	background: #fff url(../img/greyswirsh.jpg) no-repeat top right;
	opacity: .7;
	filter: alpha(opacity=70);
	min-height: 425px;
	}
	
/* CSS HACK:  position:relative needed by IE6 otherwise the header and col 2 don't show up on initial rendering - they're there but you have to minimise the window or switch to another app and back to see the full effect. But IE5(pc) doesn't like it. And nor does NN4.
NB. the use of pos:rel has to go way beyond skin-deep - any nested element that needs a background colour appears to require to be be relatively positioned */ 
/*/*/
.main	{ p\osition: relative; }
#left {
	position: absolute;
	padding: 0;
	top: 76px;
	width: 23%;
	color: #000;
/*	min-width: 200px;*/
	height: 90%;
	opacity: 50%;
}

p.footer {
	margin: 4px;
	text-align: center;
	font: 0.7em/1em arial, sans-serif;
	color: #000;
	clear: both;
	}
/* -------------------------------- Navigation ------------------------------ 
List tips courtesy of A List Apart: http://www.alistapart.com/stories/taminglists/  */

ul#mainnav {
	list-style: none;
	margin: 0;
	padding: 0;
/*	background-color: #D6D6D6;*/
	}
		
ul#mainnav li {
	border-top: 1px solid #A5B5C6;
	}

ul#mainnav li a {
	text-decoration: none;
	display: block;
	width: 88%;
	padding: 6px 6%;
/*	background-color: #5C6F90;*/
	font: bold 0.8em /1.5 arial, sans-serif;
	color: #000;
	}

ul#mainnav li a:hover {
	background-color: #43616B;
	color: #eee;
	}
	
ul#mainnav ul.subnav {
	list-style: none;
	margin: 0;
	padding: 0;
	}

ul#mainnav ul.subnav li {
	border-top: 0 none;
	padding-left: 1.5em;
	}

ul#mainnav ul.subnav li a {
	padding: 1px;
	font: bold 0.7em /1.5 verdana, sans-serif;
	color: #5C6F90;
	background-color: transparent;
	}

ul#mainnav ul.subnav li a:hover {
	color: #43616B;
	background-color: transparent;
	text-decoration: underline;
	}
.main ul, .main ul li {
	font: .9em/1.35em arial, sans-serif;
}
.topnav h2, .topnav p {
	display: inline;
	margin-right: 0.5em;
	}
		
.topnav ul {
	list-style: none;
	margin: 0;
	text-align: right;
	}
.topnav ul li {
	display: inline;
	margin: 0.5em 0;
	padding: 0 0.5em;
	border-left: 1px solid white;	
	}
.topnav ul li.first {
	border-left: 0 none;
	}
.topnav ul li a {
	font: 0.7em/1em verdana, sans-serif;
	color: white
	}
.topnav ul li a:hover {
	font: 0.7em/1em verdana, sans-serif;
	color: red
	}

label {font: 1em/1em arial, sans-serif;}

.bold {	font-weight: bold;}
.listnone {list-style-type: none;}

p.row {	width: 100%;
	margin: 0 0 1em 0;
	}

p.row span.leftcol {
	float: left;
	font-weight: bold;
	}
	
p.row span.rightcol {
	width: 80%;
	float: right;
	}
	
p.row span.rightcol a {
	color: #D6D6D6;
	font-weight: bold;
	}
	
p.row span.rightcol a:hover {
	color: #A4B5C5;
	}
	
.spacer {display: block;
	height: 1px;
	font: 1px/1em sans-serif;
	clear: both;
}
.clear {clear: both;}

pre {
	font: .8em/1em Courier New;
	line-height: .5em;
}

pre.inline {
	display: inline;
}

ol li ol li {
	list-style-type: none;
}