body
{
    margin: 0;
    padding: 0;
    background: #ffffd0 url(yellow.gif) repeat;
    font-family: "comic sans ms";
    font-size: 100%;
    line-height: 150%;
}

img
{
    border: 0px;
}

img.floatRight
{
    float: right;
    margin: 10px;
}

img.w3Icon
{
    left: 10px;
    position: absolute;
    margin-top: 15px;
}

body > #menubar
{
    position: fixed;
    background: #c6c6ff url(blue.gif) repeat;
}

#menubar
{
    position: absolute;
    top: 0;
    left: 0;
    width: 200px;
    height: 100%;
    overflow: auto;
    border-right:1px solid #000;
}

#logo
{
    width: 200px;
    height: 200px;
    background-color: #000000;
}

#contents
{
    width: auto;
    margin-left: 190px;
    padding: 20px;
    text-align: justify;
}

#contents h1
{
    letter-spacing: 3px;
    text-align: center;
    font-size: 250%;
    text-decoration: blink;
    color: #ffe400;
    line-height: 200%;
    background-color: #0000aa;
    border-style: groove;
    border-width: 3px;
}

#contents h2
{
    letter-spacing: 3px;
    text-align: center;
    line-height: 200%;
    background-color: #c0c0ff;
    border-style: groove;
    border-width: 3px;

}

#contents h2 a
{
    color: #0000a0;
}

#contents h3
{
    line-height: 200%;
    line-height: 200%;
    text-decoration: underline;
    color: #00a000;
}

.toolbar
{
width: 200px;
background: #c6c6ff url(blue.gif) repeat;

}

.toolbar a
{
color: #0000a0;
text-decoration: none;
text-align: center;
font-weight: bold;
font-size: 13px;
display: block;
padding: 3px 0px;
width: 165px;
background: #c0c0ff ;
border-top: 2px groove #c0c0ff;
border-bottom: 2px groove #c0c0ff;
border-left: 2px groove #c0c0ff;
border-right: 2px groove #c0c0ff;
margin-left: 5px;
margin-top: 5px;
overflow: visible;
}

.toolbar a:hover
{
color: #000090;
border-top: 3px outset #a0a0ff;
border-bottom: 3px outset #a0a0ff;
border-left: 3px outset #a0a0ff;
border-right: 3px outset #a0a0ff;
background-color: #a0a0ff;
margin-top: 3px;
}
