body {
    max-width: 50em;            
    margin: 0 auto 4em;         
    padding: 1.6em 1.5em 0 50px; 
}

#navigation {
    padding: 3px 0 0.5em 0; 
    margin: 0 0.25em 0; 
    border-bottom: 2px solid #778; 
    float: left; 
    width: 100%; 
    clear: both;
}

#navigation li {
    list-style: none; 
    margin: 0; 
    display: inline; 
    float: left; 
    font-size: 0.8125em;
}

#navigation li a {
    padding: 3px 0.5em; 
    margin-left: 3px; 
    border: 1px solid black; 
    background: #aae; 
    text-decoration: none; 
    float: left;
}

#navigation li a:link {
    color: black;
}

#navigation li a:visited {
    color: black;
}

#navigation li a:hover, #navigation li a:focus, #navigation li a:active {
    color: #000; 
    background: #aae; 
    border-color: #227; 
    float: left;
}

h1 { 
    font-family: inherit;
    font-size: 170%; 
    color: #005aaa;
    display: inline;
}

h2, h5 {
    display: inline;
    color: #002aaa;
}

.note {
    background:#c0d8c0;
}

.img-box{
    height:500px;
}

img {
    width:auto;
    height:auto;
    max-width:100%;
    max-height:100%;
    position: relative;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%)
}

#form li {
     clear: both;
     list-style: none;
}

.mark {
    display: block;
    float: left;
    overflow: hidden;
    width: 78px;
    height: 29px;
    padding-right: 10px;
    text-align: justify;
    text-align-last: justify;
    line-height: 2;
}