body
{
    background: url(pi.gif) repeat-x;
    font-family: Helvetica, Arial;
}

td
{
    vertical-align: top;
}

applet
{
    width: 720px;
    height: 540px;
}

.header
{
    color: DarkSlateGray;
    clear: both;
    border-bottom: 0.05em solid black;
    padding: 0.4em 0em;
    margin: 0.4em 0em;
}

.left
{
    float: left;
    padding: 0;
    margin: 0;
    width: 20%;
}

.right
{
    float: right;
    padding: 0;
    margin: 0;
    width: 80%;
}

.menu
{
    padding: 0.4em 0.4em 0.4em 0em;
    margin: 0.4em 0em;
}

.content
{
    border-left: 0.05em solid black;
    padding: 0.4em 0em 0.4em 0.4em;
    margin: 0.4em 0em;
}

.footer
{
    clear: both;
    border-top: 0.05em solid black;
    padding: 0.4em 0em;
    margin: 0.4em 0em;
}

.nowrap
{
    white-space: nowrap;
}

@media (max-width: 50em)
{
    .left
    {
        width: 100%;
    }

    .right
    {
        width: 100%;
    }

    .content
    {
        border-left: none;
        border-bottom: 0.05em solid black;
        padding: 0.4em 0em;
    }
}