.bodycontainer {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas:
    "header"
    "aside"
    "content"
    "footer";
    height: 100%;
    width: 100%;
}

header {grid-area: header; width: 100%;}
aside {display: none; grid-area: aside; width: 100%;}
main {grid-area: content; width: 100%;}
footer {grid-area: footer; width: 100%;}

main p, main img, main .triptych {
    padding: .5em 0;
}

main img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
}

main p {
    max-width: 75%;
    margin: 0 auto;
}

main .clump {
    margin-bottom: 5em;
}

.diptych {
    max-width: 100%;
    display: grid;
    gap: .5em;
    grid-template-columns: repeat(2, 1fr);
    align-items: center;
}

.triptych {
    max-width: 100%;
    display: grid;
    gap: .5em;
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
}

.quadriptych {
    max-width: 100%;
    display: grid;
    gap: .5em;
    grid-template-columns: repeat(4, 1fr);
    align-items: center;
}


/*Wider than Tablet*/
@media only screen and (min-width: 761px){
    /* .hamburger {
        display: none;
    }
    
    .patty {
        background: rgb(41, 41, 41);
        height: 1px;
        width: 23px;
        margin: 6px 0;
    } */

    .bodycontainer {
        display: grid;
        grid-template-columns: repeat(3,auto);
        grid-template-areas:
        "header header header"
        "aside content content"
        "footer footer footer";
        background-color: rgb(30, 206, 144);
        height: 100%;
        width: 100%;
    }
    
    header {grid-area: header; width: 100%;}
    aside {display: grid; grid-area: aside; width: 100%;}
    /* .subnav {position: fixed;} */
    main {grid-area: content; width: 100%;}
    footer {grid-area: footer; width: 100%;}

    .diptych {
        max-width: 100%;
        display: grid;
        gap: 1em;
        grid-template-columns: repeat(2, 1fr);
        align-items: center;
    }

    .triptych {
        max-width: 100%;
        display: grid;
        gap: 1em;
        grid-template-columns: repeat(3, 1fr);
    }

    main .clump {
        margin-bottom: 10em;
    }
}