body {
    background-color: #000;
    color: #fff;

    /* Allow mouse dragging. */
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    user-select: none;

    /* disable touch panning/zooming */
    -ms-touch-action: none;
    touch-action: none;

    /* Allow canvas to hit the edges of the browser viewport. */
    margin: 0;
}

#myVideo {
  position: fixed;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}

#screen canvas {
  margin: auto;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);

    /* Hide the gap for font descenders. */
    display: block;
    /* disable scaling interpolation */
    image-rendering: optimizeSpeed;
    image-rendering: -moz-crisp-edges;
    image-rendering: -o-crisp-edges;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: optimize-contrast;
    image-rendering: pixelated;
    -ms-interpolation-mode: nearest-neighbor;
}


body {
 font-family: 'Lato', sans-serif;
}

.overlay {
height: 100%;
width: 0;
position: fixed;
z-index: 1;
top: 0;
left: 0;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0, 0.9);
overflow-x: hidden;
transition: 0.5s;
}

.overlay-content {
position: relative;
width: 100%;
text-align: center;
}

.overlay a {
text-decoration: none;
font-size: 36px;
color: #818181;
display: block;
transition: 0.3s;
}

.overlay a:hover, .overlay a:focus {
color: #f1f1f1;
}

.overlay .closebtn {
position: absolute;
top: 20px;
right: 45px;
font-size: 60px;
}

@media screen and (max-height: 450px) {
.overlay a {font-size: 20px}
.overlay .closebtn {
font-size: 40px;
top: 15px;
right: 35px;
}
}