/* 
general appearance tweaks 
 these are mostly not needed but the site looks nicer this way
*/

body {

 font-family: verdana, sans-serif; /* sans-serif font is better for websites */
 background: url('../images/swirls.gif') fixed;
}

#main {
 margin-left: 180px;
 margin-right: 10px;
 max-width: 450px;
}

#main p {
  color: #000000;
  background-color: #FFFFFF;
}

h1 {
 text-align: center; /* Centered title */
 font-family: arial, sans-serif;
}

h2 {
 font-family: arial, sans-serif;
}

.example {
 border: 4px solid #eee;
}

a img {
 border: none;
}

/* 
Navigation bar 
 without this CSS the site will look very ugly xD
*/

/* to fix IE's inability to display "position: fixed" */
#navbar_box {
 position: absolute;
 top: 0;
 left: 0;
 width: 165px;
 max-height: 340px;
}

#navbar {
/* position: fixed; */
}

#navbar h2 {
 text-align: center;
 font-size: 14pt;
}

#navbar ul {
/* removing list formatting */
 list-style-type: none;
 margin-left: 0;
 padding-left: 5px;
}

#navbar li {
 margin-left: 0;
 font-size: 10pt;
}

#navbar a {
 display: block; /* Makes navbar links into block buttons */
 color: #000000;
 background: #eeeeee;
 width: 100%;
 text-decoration: none;
 font-variant: small-caps;
 margin-top: 2px;
 padding-left: 4px;
 border-left: 10px solid #aaa;
}

#navbar a.on {
 font-weight:bold;
}

#navbar a:hover {
 color: #fff;
 background: #333;
 border-left: 10px solid #ddd; 
}