
body {
  margin: 0; padding: 0;
  background-color: #fc4; color: #0a0a0a;
  font-family: Arial, sans-serif;
}

div#page {position: relative; width: 100%; height: 100%;}

div#top {position: static; width: 100%; height: 9em; background-color: #6c3;}

div#left {
  position: absolute;
  left: 0em; top: 0em; width: 11em; height: 100%;
  background-color: #29d;
}

div#square {
  position: absolute;
  left: 0em; top: 0em; width: 11em; height: 9em;
  background-color: #f00;
}

div#content {
  position: relative;
  left: 15em; top: 0em; width: 57em;
  font-size: 75%;
  padding: 2em;
  z-index: 1;
}

div#title {
  position: absolute;
  left: 4.2em; top: 2.5em; max-width: 60em;
  z-index: 1;
}

div#menu {
  position: absolute; left: 18em; top: 10em; z-index: 2;
  font-family: Tahoma, Arial, sans-serif;
  font-size: 70%; font-weight: bold; letter-spacing: 0.2em;
  color: #222;
}

img#picture {position: absolute; left: 1.75em; top: 11em;}

p, li {line-height: 150%;}

p {margin: 1.2em 0.2em;}

ul {margin-top: 1.2em; margin-bottom: 1.2em;}

h1 {
  font-size: 400%; font-weight: normal; letter-spacing: 20px;
  color: white;
  margin: 0;
}

h2 {
  font-size: 200%; font-weight: normal; letter-spacing: 3px;
  margin: 0em 0em 0.5em;
  color: #333;
  clear: both;
}

h3 {
  font-size: 155%; font-weight: normal; letter-spacing: 1px;
  margin: 0em 0em 0.7em;
  color: #333;
  clear: both;
}

h4 {
  font-size: 110%; font-weight: bold; letter-spacing: 1px;
  margin: 0em 0em 1em;
  color: #322;
  clear: both;
}

h5 {
  font-size: 100%; font-weight: bold;
  margin: 0em 0em 1em;
  color: #332;
  clear: both;
}

img {border: 0;}

img.left {float: left; margin: 0em 1.5em 1em 0em;}

img.preview {width: 120px; height: 120px;}

b {color: #222;}

p.preview img {width: 120px; height: 120px; margin: 0.25em; padding: 0;}

p.gallery span {
  display: inline-block;
  margin: 0.2em; padding: 0.1em; width: 150px;
  vertical-align: top;
  font-size: 82%; line-height: 140%;
}

p.gallery span img {margin: 0.1em;}

li {margin-bottom: 0.3em;}

li li {list-style: disc;}

.compact li {margin: 0;}

.spaced li {margin-bottom: 1em;}

ul ul {margin-top: 0.9em;}

.email {color: #a30; font-weight: bold;}

a:link {color: #a30; font-weight: bold;}

a:active {color: #ffc; font-weight: bold;}

a:hover {color: #ffc; font-weight: bold;}

a:visited {color: #830; font-weight: bold;}

#menu a {text-decoration: none; color: #333;}

#menu a:active {color: white;}

#menu a:hover {color: white;}

#menu a:visited {}

table {width: 105%; font-size: 100%;}

th {text-align: left; border-bottom: #555 solid 1px;}

th.name {width: 65%;}

th.size {width: 15%;}

.col {display: inline-block; width: 15em; margin-bottom: 0.5em; padding-right: 0.2em;}

.expanded {width: 100%;}

.vcenter {vertical-align: middle;}

.button {padding-top: 4px;}

hr {
  height: 0; margin: 0em 0em 0.7em;
  border-top: #863 dotted 1px; border-bottom: none;
}

#more {display: none;}

#hide {display: none;}
