/* Reset margin/padding and enforce full height */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

/* Set up two-column fullscreen grid */
body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "left right";
  height: 100vh;
}

/* Each half gets 100% of grid area */
.half {
  grid-area: left;
  width: 100%;
  height: 100%;
}

.half:nth-child(2) {
  grid-area: right;
}

/* Stretch iframe to fill each half */
iframe {
  width: 100%;
  height: 100%;
  border: none;
  display: block;
}