body {
margin: 0;
padding: 0;
font-family: Verdana, sans-serif;
font-size: small;
background: #fff;
}

/* layout structure */
#wrap {
min-width: 500px;
max-width: 1400px;
background: url(img/wrap-bg.gif) repeat-y 70% 0;
}

#content {
float: right;
width: 80%;
font-size: 125%;
line-height: 2.0em;
color: #333;
}

#sidebar {
float: left;
width: 25%;
}


#footer {
clear: both;
background: #828377 url(img/footer-bg.gif) repeat-x top
left;
}

#footer p {
margin: 0;
padding: 15px;
font-size: 85%;
color: #333;
background: #6cf
}


/* header */
#header {
border-bottom: 3px solid #6cf;
background: #B4E637 url(img/header-bg.gif) repeat-x top
left;
}

#header h1 {
margin: 0;
padding: 25px;
font-family: Georgia, serif;
font-size: 180%;
color: #374C0E;
background: url(sigla3.jpg) no-repeat top left;
background-color: #6cf;
height: 100px;
}

#content h2 {
margin: 0 0 1em 0;
padding: 0;
font-family: Georgia, serif;
font-size: 150%;
font-weight: normal;
color: #663; }

#content h3 {
margin: 0 0 1em 0;
padding: 25px;
font-family: Georgia, serif;
font-size: 120%;
font-weight: normal;
color: #374C0E;
}

#navlist
{
color: white;
background: #17a;
border-bottom: 0.2em solid #17a;
border-right: 0.2em solid #17a;
padding: 0 1px;
margin-left: 0.5em;
width: 12em;
font: normal 1.33em Verdana, sans-serif;
}

#navlist li
{
list-style: none;
margin: 0;
font-size: 1em;
background-position: 100% .4em;
padding-right: .6em;
}

#navlist a
{
display: block;
text-decoration: none;
margin-bottom: 0.5em;
margin-top: 0.5em;
margin-left: 5px;
color: white;
background: #39c;
border-width: 1px;
border-style: solid;
border-color: #5bd #035 #068 #6cf;
border-left: 1em solid #fc0;
padding: 0.25em 0.5em 0.4em 0.75em;
}

#active:hover li { display: block; }
#active li { display: none; }


#active2:hover li { display: block; }
#active2 li { display: none; }

#navlist a#current { border-color: #5bd #035 #068 #f30; }

#navlist a#current2 { border-color: #5bd #035 #068 #f30; }


#navlist a
{
voice-family: "\"}\"";
voice-family: inherit;
width: 9.6em;
/* Tantek-hack should only used if Internet-Explorer 6 is in standards-compliant mode */
}

#navcontainer>#navlist a
{
width: auto;
/* only necessary if you use the hacks above for the Internet Explorer */
}

#navlist a:hover, #navlist a#current:hover
{
background: #28b;
border-color: #069 #6cf #5bd #fc0;
padding: 0.4em 0.35em 0.25em 0.9em;
}

#navlist a:active, #navlist a#current:active
{
background: #17a;
border-color: #069 #6cf #5bd white;
padding: 0.4em 0.35em 0.25em 0.9em;
}


#navcontainer a
{
color: yellow;
background-color: #69c;
width: 120px;
display: block;
}

#navcontainer a:visited
{
color: blue;
background-color: #28b;
}

#navcontainer a:active
{
color: white;
background-color: #28b;
}

#navcontainer a:hover
{
color: white;
background-color: #28b;
}


/* gutters */

#content .gutter {
padding: 25px;
background: url(img/content-bg.gif) repeat-x top left;
}

#sidebar .gutter {
padding: 15px;
}

dl.feature {
margin: 15px 0;
padding: 15px;
border-top: 1px dotted #ccc;
border-bottom: 1px dotted #ccc;
}

dl.feature:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

dl.feature dt {
margin: 0 0 .5em 0;
font-family: Georgia, serif;
font-size: 140%;
color: #306EFF;
}

dl.feature dt img {
float: left;
margin: 0 15px 0 0;
padding: 0 4px 4px 0;
background: url(img/photo-frame.gif) no-repeat bottom
right;
}

dl.feature dd {
margin-left: 169px;
font-size: 90%;
line-height: 1.5em;
color: #666;
}

<!--
    .mynotes { font-size: 10pt }
    .blue { color: #0000FF }
    -->