/* VISUAL LAYOUT OF THE PAGE
   Notice that padding is ususally done in pixels, since that is more pleasing to the eye. */
body{ margin: 0;
      padding: 0; }
#header{ margin: 20px 0 10px 0;
         padding: 0 1em; }
#navbar{ position: fixed;
         top: 4.5em;
         right: 0;
         width: 6em;
         padding: 10px;
         padding-right: 10px+1em;
         border-style: dotted none dotted dotted;
         border-width: 1px; }
#footer{ padding-top: 3em; }
#main{ padding-right: 9em;
       padding-left: 1em; }



/* TEXT DISPLAY
   To not get link destinations specify all types of non-destination links */
body{ text-decoration: none;
      font-family: sans-serif; }
a:link,a:visited { text-decoration: none; }
a:link:hover,a:visited:hover,a:active{ text-decoration: underline; }
#footer img{ border: 0; }
p{ text-indent: 2em; }
p+p,pre+p,ul+p{ text-indent: 0em; }

h1{ font-size: 120% }
h2{ font-size: 100% }

#header{ font-size: 150%;
         font-weight: bold; }
#navbar{ white-space: nowrap;
         font-variant: small-caps; }



/* COLOR-SCHEME
   dynamic colors based on page age (so the page literally ages) would be really cool! */
body{ background: #f0f0f0;
      color: #333333 }
#header{ background: #80b3ff; }
#navbar{ background: #e0e0e0; }
a:link,a:visited:hover{ color: #1f9c00; }
a:visited{ color:#0e4900 }