/* Site Scaling */

    body {
        margin-left: auto; 
        margin-right: auto;
        width: 90%;
        max-width: 800px;
    }

/* Color Scheme */

    @media (min-width: 640px) {
        html{
            background-color:#eaf6ff;
        }
    }


/* Font Scaling */

    @media (min-width: 640px) {
        h1{
            font-size: 2.5rem;
        }
    }

    @media (max-width: 500px) {
        h1{
            font-size: 2.5rem;
        }
    }

    
/* First Grid Layout. Justified to appear more "block-like"*/

    #inline-block aside{
        width: 170px;
        margin: 10px;
    }

    section#fixed-size-grid-items > ul {
        padding-left: 0px;
        display: flex;
        flex-wrap: wrap;
        text-align: justify;
        font-size: 0.8rem;
        list-style: none;
    }


/* Second Grid Layout. Justified to appear more "block-like"*/

    @media (min-width: 480px) {
        #stretchable-grid-items li{
            width: 50%;
        }
    }

    @media (min-width: 640px) {
        #stretchable-grid-items li{
            width: 25%;
        }
    }

    #stretchable-grid-items aside{
        margin: 10px;
    }

    #stretchable-grid-items ul{
        padding-left: 0;
        display: flex;
        flex-wrap: wrap;
        margin-left: -10px;
        margin-right: -10px;
        margin-top: 1rem;
        margin-bottom: 1rem;
        text-align: justify;
        font-size: 0.8rem;
        list-style: none;

    }

 
 