body {
    background-color: black;
    font-family: 'Roboto', Arial, sans-serif;
    font-size:16pt;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    margin:0px;
    padding: 0px;
    overflow: hidden;
}
  
 #grid {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    display: block;
    background-color: black;
}
  
#background {
    position: fixed;
    width:100%;
    z-index: 0;
}
  
ul {
    list-style-type: none;
}
  
#roof {
    background-color: black;
}
  
#title {
    position:relative;
    display: block;
    z-index:3;
    font-size:2em;
    padding: auto;
    text-align: center;
    letter-spacing: 0.5vw;
    color: greenyellow;
    user-select: none;
}
  
#subtitle {
    position:absolute;
    display: block;
    z-index:3;
    text-align: center;
    width: 76%;
    left:12%;
    bottom: 7%;
    font-size: 0.75em;
    color: white;
    background-color: black;
    letter-spacing: 0.5vw;
    user-select: none;
}
  
#logo {
    z-index: 2;
}
  
#content {
    position:relative; 
    z-index: 1;
    background-color: black;
    
    -webkit-overflow-scrolling:touch;
    overflow-y:scroll;
    -ms-overflow-style: none;  
    max-height: calc(100% + 1px);
}
  
/* The menu */
#menu {
    position: fixed;
    font-size:16pt;
    z-index: 1; 
    background-color: rgba(0, 180, 0, 255);
}
  
  /* The navigation menu links */
#menu a {
    position: relative;
    text-decoration: none;
    color: white;
    display: block;
    padding-right: 0.25em;
    padding-left: 0.25em;
    padding-top: 0.25em;
    padding-bottom: 0.25em;
    z-index: 2; 
}

@media all and (orientation:landscape) {
    #menu a {display: block;}
}

@media all and (orientation:portrait) {
    #menu a {display: inline;}
}