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;}*/