html,
body {
  height: 100%;
}

body {
  display: flex;
  flex-direction: column;
  align-items: center;

  nav {
    flex: 0 0 auto;
    align-self: stretch;
  }

  main {
    flex: 1 1 auto;
    width: 100%;

    iframe {
      width: 100%;
      height: 100%;
      background-color: white;
      box-sizing: border-box;
    }
  }
}

@media (width >= 680px) and (height > 600px) {
  main {
    max-width: 640px;
    margin: 1em;
  }

  iframe {
    border-radius: 24px;
    padding-top: 20px;
  }
}