Last, the CSS. Everything is rolled into this one external sheet:

Code:
body {
 margin: 0; 
 text-align: center; 
 font-size: 100%;
}
/* viewer */
p,
.exifboxtable th,
#breadcrumb { 
 font-family: Helvetica Neue, Geneva, Arial, Verdana; 
 font-size: 0.8em; 
 color: #303030; 
 margin: 0; 
 text-align: left; 
}
p { 
 font-weight: normal; 
 line-height: 1.6em;
}
 img { border: none; }
#header {
 position: relative; 
 height: 50px; 
 width: 100%; 
 margin-top: 20px; 
 margin-bottom: 0; 
}
.headerbox {
 width: 60%; 
 height: 50px;
 margin-left: 20%; 
 font-family: Helvetica Neue, Geneva, Arial, Verdana; 
 font-size: 2em; 
 font-weight: normal; 
 color: #d3d3d3; 
}
#image {
 position: relative; 
 height: 500px; 
}
.imagebox {
 float: left; 
 width: 60%; 
 height: 500px; 
 margin: 0 0 0 20%;
 overflow: auto;
}
.imageshow { text-align: center; }
#exif {
 width: 100%; 
} 
.exifbox { 
 width: 50%; 
 margin-left: 25%; 
}
.exifboxtable {
 text-align: center; 
}
.exifboxtable table {
 width: 100%; 
 padding: 0; 
 border-collapse: collapse; 
 border: none; 
}
.exifboxtable td,
.exifboxtable th { width: 33%; vertical-align: top; padding: 0; }
.exifboxtable th { font-weight: bold; line-height: 3em; }
#breadcrumb { position: absolute; }
#breadcrumb a { display: block; float: left; margin: 1em 0 0 3em; }
#exifdump { display: none; }
/* navigator */
div#wrap {
 width: 98%;
 margin: 0 auto;
 overflow: auto;
}
div.item {
 float: left;
 width: 205px;
 overflow: auto;
 text-align: left;
 font: normal 0.8em/1.0em Calibri, Arial, Helvetica, sans-serif;
 border: 1px solid #999;
 border-radius: 5px;
}
div.thum {
 text-align: center;
 margin: 5px 0 1em 0;
}
.item ul {
 list-style: none;
 margin: 1em 0;
 padding: 0;
}
.item li {
 margin-left: 5px;
}