*,
::before,
::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: "Franklin Gothic Medium", "Arial Narrow", Arial, sans-serif;
}

body {
  background: #f4f4f4;
  padding: 20px;
}

h1 {
  /* text-align: center; */
  margin: 20px auto;
}

p {
  margin-left: 20px;
}
img {
  width: 500px;
  margin: 20px;
}

main {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  grid-template-areas:
    "ch1 ch1 ch2"
    "ch4 ch3 ch2"
    "ch4 ch5 ch5";
  gap: 10px;
}

div:nth-child(1) {
  background: yellow;
  grid-area: ch1;
}
div:nth-child(2) {
  background: purple;
  grid-area: ch2;
}
div:nth-child(3) {
  background: green;
  grid-area: ch3;
}
div:nth-child(4) {
  background: red;
  grid-area: ch4;
}
div:nth-child(5) {
  background: orchid;
  grid-area: ch5;
}