body,html{
    width: 100%;
    overflow: hidden;
}



#canvas1{
    border: 5px solid;
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    background: url('background.png');
    max-width: 100%;
    max-height: 100%;
}
#beetlemorph ,#player,#boss,#player_jets,#beetlemorph_red,#rhinomorph{
    display: none;
}

#virtualKeyboard {
    display: none;
}
@media only screen and (max-width: 550px) {
    #virtualKeyboard {
        display: block;
        position: absolute;
        width: fit-content;
        margin: 5px;
        font-size: 14px;
        top: 81%;
        left: 50%;
        transform: translate(-50%,-50%);
    }
    #r{
        position: absolute;
        bottom:350%;
        display: none;
    }

  }
  #virtualKeyboard button{
    padding:5px;
    background-color: rgb(125, 54, 54);
  }