<div class="container">
  <div class="header">header</div>
  <div class="side">side</div>
  <div class="article-0">article-0</div>
  <div class="article-1">article-1</div>
  <div class="article-2">article-2</div>
  <div class="article-3">article-3</div>
  <div class="article-4">article-4</div>
  <div class="article-5">article-5</div>
  <div class="article-6">article-6</div>
  <div class="article-7">article-7</div>
  <div class="footer">footer</div>
</div>

/**
 * CSS from the Layout Generator/Tool
 */
.container {
  display: grid;
  width: 100%;
  height: 100%;
  grid-template-areas: "header header header"
  "side article-0 article-1"
  "side article-2 article-3"
  "side article-4 article-5"
  "side article-6 article-7"
  "footer footer footer";
  grid-template-columns: 200px 1fr 1fr;
  grid-template-rows: 60px 1fr 1fr 1fr 1fr 60px;
}

.header {
  grid-area: header;
}
.side {
  grid-area: side;
}
.article-0 {
  grid-area: article-0;
}
.article-1 {
  grid-area: article-1;
}
.article-2 {
  grid-area: article-2;
}
.article-3 {
  grid-area: article-3;
}
.article-4 {
  grid-area: article-4;
}
.article-5 {
  grid-area: article-5;
}
.article-6 {
  grid-area: article-6;
}
.article-7 {
  grid-area: article-7;
}
.footer {
  grid-area: footer;
}

/**
 * Custom CSS added here 
 */
body {
  font-family: "Raleway", sans-serif;
  background-color: #fffffe;
  padding: 1rem;
}
.container {
  max-width: 980px;
  min-height: calc(100vh - 3rem);
  margin: 0 auto;
  gap: 1em 1em;
}
.container > * {
  display: grid;
  place-content: center;
  border-radius: 5px;
  font-size: 1rem;
  padding: 1rem;
  letter-spacing: 0.05rem;
  box-shadow: 0 1px 6px 0 hsl(0, 0%, 0%, 20%);
}
.header, .footer {
  color: hsl(22, 78%, 26%);
  background-color: hsl(48, 96%, 89%);
}
.side {
  color: hsl(177, 51%, 23%);
  background-color: hsl(177,51%, 82%);
}
[class^="article"] {
  color: hsl(177, 51%, 23%);
  background-color: hsl(177, 51%, 93%);
}

@media only screen and (max-width: 600px) {
  .container {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }  
  .container > * {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
  }
}

/**
 * Checkout my YouTube channel 
 * @link https://www.youtube.com/codewithpalash
 */