html, body {
    margin: 0;
    padding: 0;
  scrollbar-width: none;
  touch-action: manipulation;
  overscroll-behavior-y: none;
  overscroll-behavior-x: none;
  overflow: hidden;
  }
  p, input, button, select {
    margin: 5px;
    padding: 5px;
    font-size: 20pt;
  }

  canvas {
    display: block;
  }
  ::-webkit-scrollbar {
    display: none;
    width: 0;
}

#overlay {
  visibility: hidden;
  position: absolute;
  left: 0px;
  top: 0px;
  width:100%;
  height:100%;
  text-align:center;
  z-index: 1000;
  color: white;
  overflow: auto;
  background: black;
        /* Required for IE 5, 6, 7 */         /* ...or something to trigger hasLayout, like zoom: 1; */         
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";          /* This works in IE 8 & 9 too */         /* ... but also 5, 6, 7 */         
  filter: alpha(opacity=80);          /* Older than Firefox 0.9 */         
  -moz-opacity:0.8;          /* Safari 1.x (pre WebKit!) */         
  -khtml-opacity: 0.8;          /* Modern!         /* Firefox 0.9+, Safari 2?, Chrome any?         /* Opera 9+, IE 9+ */         
  opacity: 0.8; 
}
#overlay div {
  width:300px;
  margin: 10px auto;
  background-color:black;
  border:1px solid #fff;
  padding:5px;
  text-align:center;
  color: white;
  
}