main {
    display: grid;

    grid-template-areas:
    "header header header header"
    "stitch stitch stitch stitch"
    "paragraph1 paragraph2 paragraph3 paragraph4"
    "footer footer footer footer";

    grid-template-columns: 1fr 1fr 1fr 1fr; /* 4 columns*/
    grid-template-rows: auto auto auto auto;
    gap: 1px; /* space between items*/
    max-width: 1200px;
    margin: 0 auto;
}

body {
    font-family: "Pacifico", cursive;font-size: 22px;
    color: palevioletred;
    background-image: url("https://th.bing.com/th/id/OIP.OsFCxf5aHR4HflxkvJ3ZZgHaEK?o=7&cb=12rm=3&rs=1&pid=ImgDetMain&o=7&rm=3.webp");
    background-size: auto 1200px; /*height 1200px*/
    background-repeat: no-repeat; /*prevent tiling*/
    background-color: white;
}

main > * {
    border: 1px solid blue;
    padding: 10px;
}

.pacifico-regular {
  font-family: "Pacifico", cursive;
  font-weight: 400;
  font-style: normal;
}


.comfortaa {
  font-family: "Comfortaa", sans-serif;
  font-optical-sizing: auto;
  font-weight: 5px;
  font-style: normal;
}

#header {
    grid-area: header;
    text-align: center;
    background-color: white;
}

#paragraph1 {
    grid-area: paragraph1;
    background-color: white;
    font-family: "Comfortaa", sans-serif;
  font-optical-sizing: auto;
  font-weight: 5px;
  font-style: normal;
}

#paragraph2 {
    grid-area: paragraph2;
    background-color: white;
    font-family: "Comfortaa", sans-serif;
  font-optical-sizing: auto;
  font-weight: 5px;
  font-style: normal;
}

#paragraph3 {
    grid-area: paragraph3;
    background-color: white;
    font-family: "Comfortaa", sans-serif;
  font-optical-sizing: auto;
  font-weight: 5px;
  font-style: normal;
}

footer {
    grid-area: footer;
    text-align: center;
    background-color: white;
    font-family: "Comfortaa", sans-serif;
  font-optical-sizing: auto;
  font-weight: 5px;
  font-style: normal;
}

.stitch {
    display: flex;
    grid-area: center;
    height: 200px;
    align-items: center;
    justify-content: center;
}