html, body {margin: 0; padding: 0; }

      body {
        width: 100vw;
        height: 100vh;
        padding: 0;
        background: #123;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
      }
      canvas,img{
        display: block;
        margin: 0 auto;
        background: #067;
      }
  @media (max-aspect-ratio: 420/297) {
      canvas,img{
        width: 100vw;
        max-height: 100vh;
      }
  }
  @media (min-aspect-ratio: 420/297) {
      canvas,img{
        height: 100vh;
        max-width: 100vw;
      }
  }