main {
    display: grid;

    grid-template-areas: 
        "title title title title"
        "img img img img"
        "section1 section2 section3 section4"
        "footer footer footer footer"
    ;
}

body{
    background-image: url("bg.webp");
    background-repeat: no-repeat;
    background-size: cover;
}

section {
    background-color: rgba(121, 0, 0, 0.388);
    color: rgb(255, 99, 99);
    margin: 5%;
    padding: 2%;
    font-family: "Unica One", sans-serif;
}

img {
    margin-left: auto;
    margin-right: auto;
}

#title {
    grid-area: title;
    background-color: rgba(121, 0, 0, 0.388);
    font-family: horror;
    font-size: 1100%;
    text-align: center;
    width: 60% auto;
    height: 65%;
    padding: 3%;
    color: rgb(255, 51, 51);
}

#death {
    grid-area: img;
    background-color: black;
    width: 30%;
}

#v1 {
    grid-area: section1;
}
#v2 {
    grid-area: section2;
}
#gabriel {
    grid-area: section3;
}
#minosprime {
    grid-area: section4;
}
#quote {
    grid-area: footer;
    text-align: center;
    font-size: 250%;
}

@font-face {
    font-family: horror;
    src: url("Ghastly\ Panic.ttf");
}