redstrate.com/themes/red/assets/css/site.css

/* desktop devices */
@media (min-width: 768px) {
    body {
        grid-template:
        "head head"
        "nav  main"
        "nav  foot";
    }

    aside {
        width: 250px;
    }
}

/* mobile devices */
@media (max-width: 768px) {
    body {
        grid-template:
        "head"
        "nav"
        "main"
        "foot";
    }

    aside {
        width: 100%;
    }
}

body {
    --accent-color: #d26c6c;

    background-color: #e3e3e3;
    accent-color: var(--accent-color);

    display: grid;
}

header {
    grid-area: head;
}

aside {
    background-color: white;

    grid-area: nav;

    text-align: center;

    border: 1px solid black;
    border-radius: 3px;
    padding: 15px;
}

article {
    background-color: white;

    grid-area: main;

    border: 1px solid black;
    border-radius: 3px;

    padding: 15px;
}

footer {
    background-color: white;

    grid-area: foot;
}