// The grid
.wrapper {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(3, 1fr);
  grid-template-areas:
    "header  header  header"
    "sidebar content content"
    "footer  footer  footer";
  
  max-width: 960px;
  margin: 0 auto;
}

.header  { grid-area: header }
.sidebar { grid-area: sidebar }
.content { grid-area: content }
.footer  { grid-area: footer }

body {
  font-family: -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
  font-size: 16px;
}

.box {
  background: #444;
  color: #fff;
  border-radius: 5px;
  padding: 20px;
}