html, body {
  width:  100%;
  height: 100%;
  margin: 0px;
  padding: 0px;
  overflow-x: hidden; 
  overflow-y: auto;
  background: #000000;
}

/* box for debugging output */
#messageWindow {
    pointer-events: none;
    position:absolute;
    bottom:0;
    right:0;
    width: 200pt;
    height: 100pt;
    overflow: auto;
    background-image: -webkit-repeating-radial-gradient(center center, rgba(0,0,0,.2), rgba(0,0,0,.2) 1px, transparent 1px, transparent 100%);
    background-image: -moz-repeating-radial-gradient(center center, rgba(0,0,0,.2), rgba(0,0,0,.2) 1px, transparent 1px, transparent 100%);
    background-image: -ms-repeating-radial-gradient(center center, rgba(0,0,0,.2), rgba(0,0,0,.2) 1px, transparent 1px, transparent 100%);
    background-image: repeating-radial-gradient(center center, rgba(0,0,0,.2), rgba(0,0,0,.2) 1px, transparent 1px, transparent 100%);
    -webkit-background-size: 3px 3px;
    -moz-background-size: 3px 3px;
    background-size: 3px 3px;
}

#messages {
    pointer-events: none;
    padding:4pt;
    font-size:75%;
    color: #fff;
    font-family:courier;
    overflow: auto;
}