html, body
	{background: #515356; color: #cbd0d5; height:100%; width:100%;}

/* Colours */

h1
	{color: #111;}
h2
	{color: #262728;}
h3
	{color: #9099a0;}
h4
	{color: #878f96;}
a:focus, a:hover
	{color: #a1c2e4;}
a
	{color: #858b95;}


/* Layout */

#header
	{background:url('../images/bg_invert_header.png'); 
	 width:100%; height:72px; margin-bottom:3em;}
#header h1
	{position: absolute; top:24px; left:80px;}

#content
	{margin:0 0 0 80px; width:60em;}

img.photo
  { float: right; border:2px #666666 solid }
img.diagram
	{ float: right; margin: 0 -28px 1em 1em; }
img.tl
	{position:absolute; top:0; left:0;}
img.tr
	{position:absolute; top:0; right:0;}
img.bl
	{position:absolute; bottom:0; left:0;}
img.br
	{position:absolute; bottom:0; right:0;}
	
#parallax
	{background:#2f3134; position:relative; overflow:hidden;
	 width:60em; height:300px; margin:1.5em 0;}
	 
#button
	{float:left; position:relative; background:#2f3134;
	 width:60px; height:60px; margin:2.4em 0 2.4em 2.4em;}

#button_remote
	{float:left; position:relative; background:#2f3134;
	 width:60px; height:60px; margin:2.4em 0 2.4em 3.2em;}
	 
#button_control
	{float:left; position:relative; background:#2f3134;
	 width:60px; height:60px; margin:2.4em 0 2.4em 3.2em;}

h2 a:focus, h2 a:hover
	{text-decoration:none; color:#767f8e;}
h2 a
	{color: #858b95;}
	 
/*dl.options dt
	{ font-family: 'lucida console', 'andale mono', monospace; font-size: 1.1em; color:black;}*/