body {
    font-family: sans-serif;
    background-color: white;
}

img {
    margin: 0;
    border: none;
}

h1,h2,h3,h4 {
    color: #0020C0;
}

h2 a, h2 a:hover {
    color: #0020C0;
}

td {
    vertical-align: top;
}

textarea, input {
    border: 1px solid grey;
    margin: 0;
}

a {
    color: #3060FF;
    text-decoration: none;
}

a:hover {
    color: #FF4000;
}

.framed {
    border: 1px solid black;
}

.fl {
    float: left;
}

.person {
    width:  200;
    height: 300;
    margin: 1em;
    text-align: center;
}

.clear {
    clear: both;
}

#header {
    padding: 1em;
}

#header img {
    float: left;
    margin-right: 1em;
}

#navi {
  border-top: 1px solid black;
  border-bottom: 1px solid black;
  font-weight: bold;
}

#footer {
  font-size: small;
  border-top: 1px solid black;
}
#footer a {
  border-bottom: 1px solid white;
}
#footer a.selected {
  border-bottom: 1px solid black;
}

#navi, #footer {
  text-align: center;
  padding-top:    0.2em;
  padding-bottom: 0.2em;
}
#navi a, #footer a {
  padding: 0.2em;
  margin:  0em;
  border-left: 1px solid white;
  border-right: 1px solid white;
}
#navi a.selected, #navi a:hover, #footer a.selected {
  background-color: #0020C0;
  color: white;
  border-left: 1px solid black;
  border-right: 1px solid black;
}

#picture {
    width: 650px;
}

#picture img {
    width: 640px;
}

#thumbnails {
    width:  300px;
}

#pictureframe {
}

#thumbnails img {
    opacity: 0.8;
}

#thumbnails .selected, #thumbnails a:hover img {
    opacity: 1;
}