@import url(https://fonts.googleapis.com/css2?family=Mulish&display=swap);

body {
  display: grid;
  grid-template-columns: 25vw 75vw;
  grid-template-rows: min-content 1fr min-content;
  grid-template-areas:
  "h h"
  "n m"
  "f f";
  min-height: 100vh;
  background: #fff;
  color: #4a4a4a;
  font-family: 'Mulish', Arial, Helvetica, sans-serif;
}

header, footer {
  font-size: large;
  text-align: center;
  padding: 0.3em 0;
  background-color: #4a4a4a;
  color: #f9f9f9;
}

header {
  grid-area: h;
}

nav {
  padding: 0 10px;
  background: #eee;
  grid-area: n;
}

main {
  padding: 0 20px;
  background: #f9f9f9;
  grid-area: m;
}

footer {
  grid-area: f;
}