body {
 font-family:"Trebuchet MS",sans-serif;
 font-size:4mm;
}
div, form, table {
 margin:0;
 padding:0;
}
img {
 margin:0;
 border:none;
 padding:0;
}

h1,h2 {
 margin:0;
}

button {
 margin:2px 0 2px 0;
 border:solid 2px gray;
 background-color:#fafafa;
 text-align:center;
 font-size:12pt;
 font-weight:bold;
}
button.off {
 border:solid 2px #ccc;
 background-color:#f4f4f4;
 color:#ccc;
}

/* Set the vertical spacing. #main has no margin, everything else
 * sits above or below it. */
#path, #header, #browser {
 margin-bottom:8px;
}
#pages, #status {
 margin-top:8px;
}

/* DIV wrapper for content. */
#wrap {
 width:860px;
 margin-left:auto;
 margin-right:auto;
 padding-left:20px;
 padding-right:20px;
}

#path {
 padding:2px 5px;
 background-color:#f4f4f4;
}

#download {
 float:right;
}

/* banner header */
#header {
 border:none;
 width:100%;
}
#header tr {
 vertical-align:bottom;
}
#header .bottom_right {
 text-align:right;
}

/* #thumbs
 * album, thumbnail view.
 */
div#thumbs {
 width:560px;
 text-align:left;
 margin-left:auto;
 margin-right:auto;
}
div#thumbs img {
 display:inline;
}

table#thumbs {
 margin-left:auto;
 margin-right:auto;
}
table#thumbs td {
 padding-left:10px;
 padding-right:10px;
 width:240px;
 vertical-align:top;
}
table#thumbs h3 {
 margin-bottom:3px;
}
table#thumbs p {
 margin-top:0.5ex;
}
#thumbs a {
 text-decoration:none;
}
#thumbs p.caption {
  width:auto;
  margin:0;
  padding:0;
}
#thumbs p.num_comments {
  float:none;
  margin:0;
  padding:0;
  font-size:smaller;
}


/* Carousel */
.carousel #main {
 width:516px;
 float:left;
}
#browser {
 margin:0;
 border:solid #ccc 1px;
 padding:4px 6px 4px 6px;
 width:330px;
 float:left;
 background:#f4f4f4;
}
#browser .thumb {
 margin:2px 0 2px 0;
 border:none;
 width:330px;
 height:75px;
}
#browser .thumb a {
 float:left;
 clear:left;
 margin-right:5px;
 width:75px;
 height:75px;
}
#browser .thumb div {
 float:left;
 margin:0;
 padding:0;
 width:250px;
 height:75px;
 overflow:hidden;
}
#browser .thumb h3,
#browser .thumb p {
 margin:0px;
 padding:0px;
}
#browser .thumb p {
 font-size:0.8em;
}
#browser div.here {
 background:#fafafa;
}
#browser button {
 width:75px;
}
#browser .img_last {
 border-bottom:dashed 1px black;
}
.date_time {
 color:gray;
}
.num_comments {
 float:right;
 margin-left:1ex;
 margin-right:1ex;
 color:gray;
}


/* .iconbox
 * Container for icons. Formats the icons and implements link hover.
 */
.iconbox * {
 vertical-align:middle;
}
.iconbox img, .iconbox a.on img {
 margin:1px;
 padding:3px;
 filter:alpha(opacity=100);
 -moz-opacity:1;
 opacity:1;
}
.iconbox a img, .iconbox a.off:hover img {
 filter:alpha(opacity=30);
 -moz-opacity:.3;
 opacity:.3;
}
.iconbox a:hover img {
 background-color:white;
 margin:0px;
 border:solid 1px #ccc;
 filter:alpha(opacity=100);
 -moz-opacity:1;
 opacity:1;
}

.dir #pages, .dir #status, .carousel #status {
 float:left;
 width:100%;
}

/* directory thumbnails */
.dir table.thumb {
 margin:1px;
 border:none;
 border-collapse:collapse;
 height:75px;
}
.dir table.thumb td {
 vertical-align:top;
}
.dir table.thumb td.thumb {
 width:118px;
 padding-bottom:5px;
}
.dir table.thumb td.iconbox {
 vertical-align:bottom;
}
.dir table.thumb td.detail * {
 margin:0px;
 padding:0px;
}
.dir #header table.thumb {
 margin-top:10px ;
}
.dir #main table.thumb {
 margin-right:15px;
 float:left;
 width:413px;
}


/* #single
 * Contains the main image on 'single' pages.
 */
#single {
 text-align:center
}
#single img {
 margin-left:auto;
 margin-right:auto;
}

/* #pages
 * Index-bar at the bottom of paged 'directory' and 'album' pages.
 */
#pages {
 padding:2px 5px;
 background-color:#f4f4f4;
 text-align:center;
 font-size:12pt;
 font-weight:bold;
}
#pages span, #pages a {
 margin-left:2px;
 margin-right:2px;
 padding-left:5px;
 padding-right:5px;
}
#pages span.off {
 border:solid 1px #ccc;
 color:#ccc;
 background-color:#f4f4f4;
}
#pages span.here {
 border:solid 1px black;
 color:white;
 background-color:#a33;
}
#pages a {
 border:solid 1px #ccc;
 color:black;
 background-color:white;
 text-decoration:none;
}
#pages a:hover {
 background-color:#ccc;
}

/* #status */
#status {
 margin-left:auto;
 margin-right:auto;
 text-align:center;
 font-size:x-small;
}
.alert {
 border:solid red 2px;
 padding:3px;
}

/* title */
h1, .title #title_txt {
 font-family:"Trebuchet MS",sans-serif;
 font-size:2em;
 font-weight:bold;
}

/* caption */
.caption { margin:1em 0 }
.caption #cap_txt {
 margin:0px;
 padding:0px
}
p.caption, .caption #cap_txt {
 width:400px;
 font-family:"Trebuchet MS",sans-serif;
 font-size:1em;
}
#cap_ctrl {
 position:relative; /* Fixes IE idiocy. */
 padding:0 3px;
 background-color:#f4f4f4;
 border:solid 1px gray;
 font-size:x-small;
 text-decoration:none;
}

/* exif */
.exif {
 font-size:smaller;
 color:gray;
}

/* comments */
.comments { margin:1em 0 }
.comment  { margin-bottom:0.5em }
.comment #cmt_txt {
 margin:1ex 0;
 padding:0px
}
div.comment, .comment #cmt_txt {
 width:400px;
 font-family:"Trebuchet MS",sans-serif;
 font-size:1em;
}
a.control {
 position:relative; /* Fixes IE idiocy. */
 padding:0 3px;
 background-color:#f4f4f4;
 border:solid 1px gray;
 font-size:x-small;
 font-weight:normal;
 text-decoration:none;
}
.comment p { margin:0; overflow:hidden }
.comment p.by { font-size:smaller; color:gray; }
.author { font-weight:bold }
.comment td { vertical-align:top }
.latest #main {
 margin-left:auto;
 margin-right:auto;
 width:560px;
}
.latest th { text-align:right }
.latest td.square { width:75px }
.latest td.inp { vertical-align:bottom }
.latest .control {
 display:block;
 font-size:16px;
 width:1em;height:1em;
 text-align:center;
 vertical-align:baseline;
 padding:0px;
 margin:3px;
}

/* fade (zoom:1 fixes IE hasLayout property.) */
.fade9 { zoom:1;filter:alpha(opacity=90); -moz-opacity:.9; opacity:.9; }
.fade8 { zoom:1;filter:alpha(opacity=80); -moz-opacity:.8; opacity:.8; }
.fade7 { zoom:1;filter:alpha(opacity=70); -moz-opacity:.7; opacity:.7; }
.fade6 { zoom:1;filter:alpha(opacity=60); -moz-opacity:.6; opacity:.6; }
.fade5 { zoom:1;filter:alpha(opacity=50); -moz-opacity:.5; opacity:.5; }
.fade4 { zoom:1;filter:alpha(opacity=40); -moz-opacity:.4; opacity:.4; }
.fade3 { zoom:1;filter:alpha(opacity=30); -moz-opacity:.3; opacity:.3; }
.fade2 { zoom:1;filter:alpha(opacity=20); -moz-opacity:.2; opacity:.2; }
.fade1 { zoom:1;filter:alpha(opacity=10); -moz-opacity:.1; opacity:.1; }
.fade0 { zoom:1;filter:alpha(opacity=0); -moz-opacity:0; opacity:0; }

