*
{
    margin: 0px;
    padding: 0px;
}

body
{
    width: 90%;
    max-width: 1024px;
    margin: 0 auto;
    border: 2px solid black;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;
    background-color: rgba(52, 51, 51, 0.981);
}

em
{
    color: blue;
}

header
{
    width: 96.875%;
    padding: 15px 1.5625%;
    border-bottom: 2px solid black;
    text-align: center;
    background-color: darkblue;
}

main
{
    width: 89.375%;
    padding: 15px 1.5625%;
    float: left;
}

aside
{
    width: 40%;
    padding: 15px 1.5625%;
    float: left;
    color: purple;
    background-color: bisque;
}

footer
{
    clear: both;
    width: 96.875%;
    padding: 5px 0.52%;
    border-top: 2px solid black;
    color: chocolate;
    background-color: darkblue;
}

aside img
{
    width: 46%;
    max-width: 960px;
    margin-bottom: .5em;
}

section
{
    width: 50%;
    margin: 0px auto;
    padding: 10px 1.042%;
    color: purple;
    background-color: bisque;
    float: right;
}

#mobile_menu {display: none;}
@media only screen and (max-width: 960px)
{
    aside {font-size: 0.85em;}
    section h1 {font-size: 1.5em;}
    section p {font-size: 0.75em;}
    h4 {font-size: 1em;}
    h2 {font-size: 1.5em;}
    h1 {font-size: 2.5em;}
    #nav_menu ul li a {font-size: 0.85em;}
}
#mobile_menu {display: block;}

ul
{
    list-style: none;
    list-style-position: inside;
}

nav
{
    width: 97.92%;
    padding: 10px 1.042%;
    margin-bottom: 10px 1.042%;
    border: 2px solid black;
}

#container
{
    width: 100%;
    margin: 0 auto;
    background-color: black;
}

@media (max-width: 960px)
{
    aside, section
    {
        float: none;
        width: 95%;
        margin: 0 0 1rem 0;
    }
}

main img.responsive
{
    width: 100%;
    max-width: 960px;
}