* {
    padding: 0; margin: 0; border: 0; box-sizing: border-box;
}

body {
    font-size: 30px;
    text-align: center;
}

#container {
    min-width: 1100px; max-width: 1800px; height: calc(200vh - 200px);
    margin: 30px auto;
    justify-content: center;
}

#logo {
    background-color: lightgrey;
    width: 100%; height: 10%;
    margin-bottom: 8px;
}

#body {
    width: 100%; height: 83%;
    justify-content: space-between;
}

#body:nth-child(2) {
    display: block;
}

#body:nth-child(3) {
    display: block;
}

#sidebarnavigation {
    height: 100%; width: 40%;
    float: left;
}

#header-banner {
    background-color: lightgrey;
    height: 35%; width: 60%;
    float: right;
    background-image: url(/images/purpleskies.jpg)
}

#bodyarea {
    background-color: lightgrey;
    height: 65%; width: 60%;
    float: right;
    margin-top: 20px;
}

#footer {
    background-color: lightgrey;
    width: 100%; height: 5%;
    margin-top: 25px;
}