html { 
  background: #eee; 
  color: #000; 
  font-family: "Futura" , "Helvetica" , "Verdana" , sans-serif;
  font-size: 10pt;
  font-weight: normal;
  font-style: normal;
  margin: 0;
  padding: 0;
}

h1 {
  font-size: 18pt;
  font-weight: bold;
  margin: 0 15px;
  padding: 0.3em 0;
}

h1 span {
  font-size: 10pt;
  font-weight: normal;
}

p {
   margin: 0 15px;
   padding: 0.2em 0 ;
}

p.fineprint {
	font-size: 8pt;
}

a {
  text-decoration: none;
}

a:link , a:visited {
  color: #00f;
}

a:hover {
  color: #a8a8ff;
  text-decoration: underline;
}

a:active {
  color: #000;
}

.error {
  font-size: 12pt;
  color: #f00;
}


/* main index of photo galleries */

#gallerylist {
 position: absolute;
 background: transparent;
 left: 15px;
 padding-bottom: 3em;
}

#gallerylist a {
  position: relative;
  display: block;
  margin: 0 0 10px;
  width: 600px;
  height: 110px;
  color: #000;
  text-decoration: none;
}

/* hey! this doesn't do anything, but it's like candy to MSIE */
#gallerylist a:hover {
  background: transparent;
}

#gallerylist a .linkbody {
  float: left;
  background: #d5d5d5;
  position: relative;
  width: 534px;
  height: 110px;
}

#gallerylist a:hover .linkbody {
  background: #b66;
}

#gallerylist a .image {
  position: absolute;
  width: 120px;
  height: 90px;
  top: 10px;
  left: 10px;
}

.title_description {
  position: absolute;
  top: 10px;
  left: 130px;
  font-size: 12pt;
  height: 90px;
  width: 386px;
  margin-left: 7px;
  overflow: auto;
  background: transparent;
  font-weight: bold;
}

#gallerylist .nphotos {
  font-size: 8pt;
  font-weight: normal;
  margin-left: 1em; 
}

#gallerylist .description {
  font-size: 10pt;
  font-weight: normal;
}

/* the slick slanty edges */

#gallerylist a .left {
  border-width: 110px 33px 0 0;
}

#gallerylist a:link .left , #gallerylist a:visited .left {
  border-right-color: #d5d5d5;
}

#gallerylist a:hover .left , #gallerylist a:active .left {
  border-right-color: #b66;
}

#gallerylist a .right {
  border-width: 0 0 110px 33px;
}

#gallerylist a:link .right , #gallerylist a:visited .right {
  border-left-color: #d5d5d5;
}

#gallerylist a:hover .right , #gallerylist a:active .right {
  border-left-color: #b66;
}

/* gallery thumbnail index pages */

#gallery {
  position: absolute;
  background: transparent;
  left: 15px;
  padding-bottom: 4em;
  font-size: 10pt;
}

#gallery a {
  position: absolute;
  text-decoration: none;
}

#gallery a img {
  border: none;
}

/* spans are used to indicate the pictures already visited by the user */

#gallery a span {
  display: none;
  position: absolute;
  bottom: 0;
  right: 0;
  height: 1.4em;
  padding: 0;
  background: transparent;
  text-decoration: none;
  width: 1.4em;
  z-index: 2;
  text-align: center;
  color: #eee;
  font-size: 14pt;
}

#gallery a span.shadow {
  position: absolute;
  color: #444;
  z-index: 1;
  bottom: -0.11em;
  right: -0.09em;
}

#gallery a:visited span {
  display: inline;
}

/* photo box; the container is for msie, which is stupid */

#photocontainer {
   width: 100%;
   text-align: center;
}

#photo {
  position: relative;
  top: 0;
  background: transparent;
  width: 800px;
  height: 600px;
  margin-left: auto;
  margin-right: auto;
  padding: 1.5em 10px 4em 10px;
  overflow: visible;
}

#photo p {
  position: absolute;
  background: transparent;
  color: #000;
  height: 1.5em;
  top: 0;
  z-index: 1;
  padding: 0.1em;
  margin: 0;
}

#photo p.caption {
  left: 10px;
  text-align: left;
}

#photo p.number {
  right: 10px;
  text-align: right;
}

#photo p.name {
  display: none;
}


/* navigation for the full-size photo pages */

#navigation {
  background: transparent;
  color: #000000;
  width: 800px;
  top: 1.5em;
  padding: 0;
  position: absolute;
  height: 1.4em;
  left: 10px;
  font-family: "Verdana", sans-serif;
  text-align: center;
  z-index: 1;
}

#navigation a {
  font-size: 16pt;
  position: absolute;
  height: 1.4em;
  padding: 0.0em 0.1em;
  background: transparent;
  text-decoration: none;
  width: 1.4em;
  z-index: 1;
}

#navigation a:link , #navigation a:visited {
  color: #eeeeee;
}

#navigation a:hover {
  color: #f00;
}

#navigation a:active {
  color: #222222;
}

/* navigation link positions */

#navigation .center {
  position: absolute;
  top: .25em;
  left: 50%;
  margin-left: -0.75em;
  text-align: center;
}      
#navigation .left {
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
}
#navigation .right {
  position: absolute;
  top: 0;
  right: 0;
  text-align: center;
}

/* shadows for visibility in high-contrast situations */

#navigation .shadow {
  position: absolute;
  padding: 0.0em 0.1em;
  margin-left: 0;
  background: transparent;
  text-decoration: none;
  height: 1.4em;
  color: #444;
  z-index: -1;
  text-align:center;
  width: 1.4em;
}

/* offsets for shadows */

#navigation .cshift {
  top: -.12em;
  left: 0;
}
#navigation .lshift {
  top: 0;
  left: -0.15em;
}
#navigation .rshift {
  top: 0;
  right: -0.15em;
}