*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family:'Courier New', Courier, monospace;
    font-weight: lighter;
}
body{
    font-size: 14px;
    background-color: #1a1b21;
    color: white;
}
canvas{
    border:2px solid black;
    max-width: 100%;
    max-height: 100%;
    /* position: absolute; */
    /* left: 50%;
    transform: translateX(-50%); */
}
h2{
    color:aliceblue;
}
a:link { text-decoration: none; }

a:visited { text-decoration: none; }

a:hover { text-decoration: none; }

a:active { text-decoration: none; }
#fullscreenButton{
    background: none;
    color: aliceblue;
    border-bottom: 2px solid aliceblue;
    border-left: 2px solid aliceblue;
    border-top: 1px solid rgb(200, 200, 200);
    border-right: 1px solid rgb(200, 200, 200);
    /* border-radius:1em; */
    /* position: absolute; */
    font-size: 20px;
    padding: 10px;
    /* height: 2em; */
    /* justify-self: center; */
    margin: auto 0  auto 2em;
    /* top: 10px; */
    /* left: 50%; */
    /* transform: translateX(-50%); */
}
.canvasWrap{
    display:flex;
    justify-content: center;
    margin-bottom: 1vw;
} 
.promptWrap{

    margin: 1vw;
    /* margin-bottom: 1vw; */
    display:flex;
    justify-content:center;
}
.title{
    display: flex;
    font-size: 14px;
    justify-content: center;
    /* position:absolute; */
    width:auto;
    margin-top: 1em;
    /* display: block; */
    
}
.promptWrap h2{
    align-self: center;
    margin-right: 1em;
}
#keys{
    width: 100px;
    /* margin-right: 1em; */
}
@media screen and (max-width: 550px) {
    .prompt {
      display: none;
    }
    #fullscreenButton{
        font-size: 12px;
    }
    *{
        font-size: 12px;
    }
  }