@media (min-width: 600px) {
    div#container {
        width: 600px;
    }
    div.desc img {
        float: right;
        margin-left: 20px;
    }
}
@media (max-width: 599px) {
    div#container {
        width: 100%;
        padding-left: 15px;
        padding-right: 15px;
        box-sizing: border-box;
    }
    div.desc {
        width: 100%;
    }
    div.desc img {
        display: block;
        width: 60%;
        margin-left: auto;
        margin-right: auto;
    }
    a {
        word-wrap: break-word;
    }
}

div#container {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 50px;
}

body {
    font-family: "Verdana", "Arial", serif;
    margin-top: 60px;
    margin-bottom: 10px;
    margin-left: 0;
    margin-right: 0;
}

h1 {
    font-size: 40pt;
}

h2 {
    margin-top: 50px;
}

h3 {
    margin-left: 0;
    font-size: 1.1em;
}

p, dl, dd, li {
    font-family: "Arial", "Osaka", sans-serif;
}

dd {
    margin-top: 5px;
    margin-bottom: 5px;
}

div.desc dd img {
    float: none;
    margin-left: 0;
}

div.desc p, div.desc dl, div.desc ul{
    margin-left: 0;
}

div.desc dl ul {
    list-style-position: inside;
    margin-top: 0px;
    margin-left: 0px;
    padding-left: 0px;
}

div.desc dt {
    display: inline;
}

div.status {
    border: black solid 1px;
    border-radius: 0.3rem;
    padding: 1rem;
}
div.status h2 {
    margin-top: 0;
}
div.status div.legend {
    margin-top: 0.5rem;
    margin-bottom: 0;
}
div.status h2 small {
    font-size: 0.8rem;
}
div.status td, div.status th {
    width: 1.2rem;
    text-align: center;
}
div.status th.year {
    padding-right: 0.4rem;
    border-right: black solid 1px;
}