html {
    background-color: cyan;
}

img {
    height: 300px;
    width: 540px;
}

.grid-container {
  display: grid;
  grid-template-areas:
  'header header header'
  'YT Zac Pic'
  'movies stone stone'
  'movies shel shel'
  'rugby shel shel';
  padding: 10px;
  align-self: center;
}

.header {
  grid-area: header;
  text-align: center;
}

.YT {
  grid-area: YT;
}

.Zac {
  grid-area: Zac;
}

.Pic {
  grid-area: Pic;
}

.movies {
  grid-area: movies;
}

.stone {
  grid-area: stone;
}

.shel {
  grid-area: shel;
}

.rugby {
  grid-area: rugby;
}

.grid-item {
  background-color: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(0, 0, 0, 0.8);
  padding: 20px;
  font-size: 20px;
  text-align: center;
}