.product {
    background-color: lightgray;
    width: 300px;
    padding: 5px;
    margin: 5px 0px;
}

/* TODO: Make you pages look pretty! */

body {
    background-image: url("./clouds.jpg");
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(3, 1fr);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
}

ul {
    border-top: solid white 10px;
    border-right: solid gray 10px;
    border-bottom: solid gray 10px;
    grid-area: 1 / 1 / 6 / 2;
    text-align: center;
    list-style: inside;
}

h1 {
    background-color: rgba(107, 150, 199, 0.267);
    border-top: solid white 10px;
    border-right: solid gray 10px;
    border-bottom: solid gray 10px;
    text-shadow: 3px;
    text-align: center;
    grid-area: 1 / 2 / 2 / 6;

}

form {
    border-top: solid gray 10px;
    border-right: solid white 10px;
    border-bottom: solid white 10px;
    background-color: rgba(116, 116, 116, 0.25);
    text-shadow: 3px;
    text-align: center;
    grid-area: 2 / 2 / 6 / 6;
}

div {
    grid-area: 3 / 1 / 4 / 5;
}