body {
    color: #33290A;
    background: #F0ECE2;
}

#head {
    text-align: center;
    background: #FFFFFF;
    margin: 1em auto;
    padding: 1em;
    width: 45em;
    border: thin solid;
    border-color: #DDDDDD #CCCCCC #BBBBBB;
    box-shadow: 0 0.2em 0.3em #CCC999;
    border-radius: 0.6em;
}

#head h1 {
    text-align: center;
    margin: 0px 0 0px 0;
    text-shadow: 4px 4px 0 #BBBBBB;
    color: #000000;
    font-size: 5em;
}

#head h1 > a {
    color: #000000;
    transition: none;
}

#head ul {
    padding: 0;
    margin: 0;
    font-size: 1.1em;
    list-style: none;
}

#head li {
    display: inline-block; 
    float: none;
    padding: 0 1em;
}

#head li > a {
    color: #000000;
    white-space: nowrap;
    font-size: 80%;
}

#head li > a:hover,
#head li > a:active {
        color: #BBBBBB;
}

#source {
    width: 100%;
    margin-bottom: 0.2em;
}
#source td {
    padding: 0.2em;
    padding-left: 0.3em;
}

#source tr:nth-child(2n+1) {
    background-color: #EEEEEE;
}

#content{
    background: #FFFFFF;
    margin: 0.8em auto;
    padding: 1em 1em;
    width: 45em;
    border: thin solid;
    border-color: #DDDDDD #CCCCCC #BBBBBB;
    box-shadow: 0 0.2em 0.3em #CCC999;
    border-radius: 0.6em;
}

#content a {
    color: #245499;
    font-weight: bold;
    text-decoration: none;
    transition: color 0.25s;
}

#content a:hover,
a:active {
    color: #BBBBBB;
    font-weight: bold;
    text-decoration: none;
}

#about {
    text-align: center;
    font-size: 65%;
    font-style: italic;
}

#about a {
    color: #245499;
    font-weight: bold;
    text-decoration: none;
    transition: color 0.25s;
}

#about a:hover,
a:active {
    color: #BBBBBB;
    font-weight: bold;
    text-decoration: none;
}