*{
    margin:0;
    padding:0;
    box-sizing: border-box;
}
html,body{
    width:100%;
    height:100%;
}
.box {
    display: flex;
    flex-flow: column;
    height: 100%;
}
.header{
    flex: 0 1 auto;
}
canvas{
    flex: 1 1 auto;
    width:100%;
    height:0;
    background: black;
}
canvas:focus {outline:none;}
#pause,#menu,#scores,#controls,#credits,#defeat{
    background:#0008;
}
button,.block{
    padding:10px;
    border-radius:10px;
    display:block;
    margin:20px auto;
    font-size:2rem;
    background-color:#DDD;
    width: fit-content;
}
button:hover{
    cursor: pointer;
}
.full{
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
}
#score{
    width:100%;
    color:white;
    position:absolute;
    top:0;
    text-align:center;
}
video{
    object-fit: fill;
}
.input:focus{
    background-color:#AAA;
}