<div class="wrapper">
  <header> HEADER </header>
  <aside> ASIDE </aside>
  <nav> NAV </nav>
  <main> MAIN </main>
</div>

* {
  margin: 0;
  padding: 0;
}
.wrapper {
  display: grid;
  grid-template-columns: 0 1fr 3fr 0;
  grid-template-rows: 75px 100px auto 0;
  grid-template-areas:
    "header header header header"
    ".      aside  nav    .     "
    ".      aside  main   .     ";
  grid-gap: 2rem;
  min-height: 100vh;
  color: #fff;
}
header {
  grid-area: header;
  background: blue;
}
aside {
  grid-area: aside;
  background: green;
}
nav {
  grid-area: nav;
  background: coral;
}
main {
  grid-area: main;
  background: red;
  min-height: 200px;
}