/* #canvas1 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 400px;
    border: 2px solid black;
} 
*/

#start > p {
    font-family: 'Mystery Quest', cursive;
    position: absolute; 
    z-index: 10;
    color: white;
    top:20px;
    left:20px;
    font-size: 1.5em;
}
* {
    margin:0;
    padding: 0;
    box-sizing: border-box;
}
#canvas1 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /* border: 5px solid white; */
    max-width: 100%;
    max-height: 100%;
    -webkit-user-select: none;
}