.grid-container{
  display: grid;
  grid-auto-columns: 0fr 3fr 3fr 0fr;
  grid-auto-rows: 0fr 0fr 1fr 0fr;
  grid-gap: 20px;
  justify-content: center;
  align-content: center;
}
.grid-container > div {
  border: 5px solid #FBAB01;
  background-color:  rgba(251, 171, 1, .25);
}

.grid-item-1{
grid-column: span 4;
}

.grid-item-2{
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 2;
  grid-row-end: 3;
}
.grid-item-3{
  grid-column-start: 2;
  grid-column-end: 4;
  grid-row-start:2;
  grid-row-end: 4;
}
.grid-item-4{
  grid-column-start: 4;
  grid-column-end: 5;
  grid-row-start:2;
  grid-row-end: 3;
}

grid-item-5{
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 3;
  grid-row-end: 4;
}

.grid-item-6{
  grid-column-start: 4;
  grid-column-end: 5;
  grid-row-start: 3;
  grid-row-end: 4;
}

body {
 background-image: url('photos/flowerboy.webp');
 background-attachment: fixed;
 background-repeat: no-repeat;
 background-size: 100vw 100vh;
 cursor: url(photos/sun.png), auto;
}

@font-face {
  font-family: 'sundori';
  src: url('/sundori/sundori.ttf?#iefix') format("truetype");
}
h1 {
  font-family: 'sundori';
  color: #391D01;
  font-size: 100px;
}

@font-face {
  font-family: 'heycomic';
  src: url('/heycomic/heycomic.otf?#iefix') format("truetype");
}
p {
  font-family: 'heycomic';
  color: #F9DFBA;
  font-size: 20px;
}