.mainGrid {
    width: 820px;
    grid-template-columns: 197.5px 197.5px;
    grid-template-rows: 197.5px 197.5px;
    gap: 10px;
    display: grid;
}

.gridItem#about {
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 1;
    grid-row-end: 1;
}

.gridItem#designs {
    grid-column-start: 2;
    grid-column-end: 4;
    grid-row-start: 1;
    grid-row-end: 2;
}

.gridItem#support {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 2;
    grid-row-end: 3;
}

.gridItem#nowplaying {
    grid-column-start: 3;
    grid-column-end: 4;
    grid-row-start: 2;
    grid-row-end: 3;
}

.gridItem#resume {
    grid-column-start: 4;
    grid-column-end: 5;
    grid-row-start: 1;
    grid-row-end: 3;
}

/* ------- MOBILE -------- */

@media only screen and (max-width: 600px) {
.mainGrid {
    width: 520px;
    grid-template-columns: 197.5px 197.5px;
    grid-template-rows: 197.5px 197.5px;
    gap: 10px;
    display: grid;
}

.gridItem#about {
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 1;
    grid-row-end: 1;
}

.gridItem#designs {
    grid-column-start: 2;
    grid-column-end: 4;
    grid-row-start: 1;
    grid-row-end: 2;
}

.gridItem#support {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 2;
    grid-row-end: 3;
}

.gridItem#nowplaying {
    grid-column-start: 3;
    grid-column-end: 4;
    grid-row-start: 2;
    grid-row-end: 3;
}

.gridItem#resume {
    grid-column-start: 4;
    grid-column-end: 5;
    grid-row-start: 1;
    grid-row-end: 3;
}
}