html,body{
box-sizing:border-box;
font-size:10pt;
margin:0;
}

a,a:link,a:hover,a:visited,a:active{
color:inherit;
}

body{
background-color:rgb(234, 236, 237);
color:rgb(34,34,34);
}

div#content{
margin:2em auto auto auto;
}

nav{
font-family:tahoma, verdana;
font-size:8pt;
}

nav > span{
width:25%;
margin-top:1em;
margin-bottom:1em;
display:inline-block;
text-align:center;
}

#logo {
text-align:center;
margin-top:3em;
}

div#logo > img{
width:115px;
}

div#logo > div#name {
margin-top:.5em;
font-size:22pt;
text-transform:uppercase;
font-family: arial;
font-weight: bold;
letter-spacing:.2em;
}

div#logo > div#year{
margin-top:.5em;
font-size:16pt;
font-family: arial;
letter-spacing:.2em;
}

div#text{
padding:1em;
margin-top:2em;
font-family:arial;
letter-spacing:.06em;
font-size:12pt;
}

div#text::after{
clear:both;
content:' ';
}

div#text > div {
margin-top:1em;
}

#house{
width:100%;
}

footer{
font-size:12pt;
padding:2em;
background-color:rgba(128,139,148);
color:#e8e8e8;
font-family:arial;
}

footer > div > div {
    margin-top: 2em;
}
footer > div > div > label {
    display:block;
    margin-top: 1em;
    color:#ffffff;
    margin-bottom:.4em;
    margin-top:1.4em;
    letter-spacing:1.4;
}
footer > div > div > div.name {
font-weight:bold;
color:#ffffff;
letter-spacing:1;
margin-top:3em;
}

@media only screen and (min-width: 1024px) {
    div#content{
    width:1024px;
    }
    #logo{
    width:25%;
    }
    div#text{
    margin: 5em auto auto 14em;
    }
}

@media only screen and (min-width: 800px) {
    nav > span{
    width:12.5%;
    }
    div#text{
    float:left;
    }
    #logo{
    float:left;
    margin: 3em auto auto 4em;
    }
    div#text{
    margin: 5em auto auto 10em;
    }
    footer > div{
    display:table;
    width:100%;
    }
    footer > div > div{
    float:left;
    width:50%;
    }
    footer > div > div > div.name {
    margin-top:0;
    }
}
