body {
  background-color: lightblue;
  /* leave it to hide the scrollbars */
  overflow: hidden;
}

html, body {
margin: 0;
padding: 0;
width: 100vw;
height: 100vh;
overflow: hidden;
/*display: flex;
align-items: start;
justify-content: start;*/
background-color: black;
touch-action: none;
}

html {  
  flex-direction: column;
}


 
canvas {
  /*margin: auto;*/
  /*display: block;*/
  height: 100%;
  width:  auto;

}

main{
  position: fixed;
    z-index: 500;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

/*.grain {
background-image: url("./data/rsc/front.gif");
background-position: center;
background-repeat: repeat;
background-size: auto;
mix-blend-mode: olverlay;
  width: 100%;
  height: 100%;
    margin: 0px;
    padding: 0px;
  transition: .5s ease;
  opacity: 0.06;

  position: fixed;
  top: 50%;
  left: 50%;
  
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  z-index: 1000;
}*/