body {
  margin: 0px;
  color: #fff;
  font-family: inherit;
  font-weight: bolder;
  font-size: x-large;
}
.container {
  display: grid;
  grid-template-columns: 11rem 1fr;
  grid-template-rows: auto 1fr;
  grid-template-areas:
    "header header"
    "nav content"
    "footer footer";
  min-height: 100vh;
}
header {
  grid-area: header;
  padding: 0px;
}
nav {
  grid-area: nav;
  padding: 1rem;
  vertical-align: top;
  color: black;
}
main {
  grid-area: content;
  padding: 0rem;
}
footer {
  grid-area: footer;
  color: black;
  padding: 0rem;
  text-align: center;
  font-weight: 100;
  font-size: small;
}
a {
  text-decoration: none;
}
a:hover {
  color: indianred;
}
a:visited {
  color: black;
}
@media(max-width:1024px) {
  .container {
    grid-template-columns: 1fr;
    grid-template-areas:
      "content"
      "nav";
  }
  header {
    display: none;
  }
  footer {
    display: none;
  }
  main {
    z-index: 5;
  }
      main > iframe{
        vh:100;
    }
  nav {
    display: none;
  }
}