/* 
  35mm Photo Viewer V4a
  ---------------------
  Lots of style.
*/

a img {
 border:none;
}

body {
 background:#ccc url(../image/picture_frame.gif) 50% 50% no-repeat;
}

body,
h1,h2,h3,
button {
 font:normal 9px "small fonts";
}

h1,h2,h3 {
 margin:0px;
}

h1 {
 /*text-transform:uppercase;*/
 font-weight:bold;
}

h2,h3 {
 margin:0px;
 margin-top:0.25em;
 margin-bottom:0.1em;
}

p {
 margin:0px;
 padding:5px 0px 0px 0px;
}

p.nospacing {
 padding:0px;
}

ul {
 margin:0px;
 padding:0px;
}

.clear {
 clear:both;
 line-height:1px;
 font-size:1px;
}

#photo {
 position:absolute;
 width:800px;
 height:600px;
 /* ie:mac \*/
 left:50%;
 top:50%;
 margin-left:-400px;
 margin-top:-300px;
 /* ie:mac end */
 /* border:12px solid #fff; */
}

/* collection */

#photoSelector {
 margin-top:45px; /* 50px */
 width:256px;
}

html>body #photoSelector {
 top:8px;
 width:256px;
 -moz-opacity:0.95;
}

#photoSelector.inactive {
 filter:alpha(opacity=50);
 -moz-opacity:0.5;
}

#photoSelector a {
 text-decoration:none;
}

#header {
 display:none;
 height:16px;
}

#photoSelector div.collection,
#photoSelector div.item {
 line-height:1.3em; /* IE float-related display fix */
 clear:both;
 padding-bottom:5px;
}

#photoSelector div.collection h3 {
 clear:both;
}

#photoSelector div.collection hr {
 margin:0px;
 padding:0px;
 height:1px;
 line-height:1px;
 width:255px;
 w\idth:250px;
 margin-left:5px;
}

#photoSelector h2 {
 margin:0px;
}

#photoSelector div.collection h2,
#photoSelector ul li.page div.collection ul,
#photoSelector div.item h2.png,
#photoSelector div.item .content {
 padding-left:8px;
 padding-top:2px;
 width:255px;
 w\idth:248px; /* ie6 */
}

#photoSelector div.item .content {
 w\idth:239px !important;
 padding-right:7px;
}

#photoSelector div.item h2,
#photoSelector div.collection h2 {
 padding-top:5px;
 padding-bottom:3px;
}

html>body #photoSelector ul li.page div.collection ul,
html>body #photoSelector div.item .content {
 /* mozilla float fix */
 float:left;
}

#photoSelector ul li.page div.collection div.clear,
#photoSelector div.item div.clear {
 /* bottom */
 height:11px;
 line-height:11px;
}

#pageTabs {
 display:none;
}

#photoSelector .pages {
 padding-bottom:0px !important;
}

#photoSelector .pages ul li {
 /* page menu */
 float:left;
 display:inline;
}

#photoSelector .pages ul li a {
 float:left;
 display:inline;
 text-decoration:none;
 margin-right:0.3em;
 padding:0px 0.4em 0px 0.4em;
 margin-bottom:-1px;
 width:11px;
 height:8px;
 line-height:12px;
 margin-top:4px;
}

#photoSelector .pages ul li a:hover,
#photoSelector .pages ul li a.active {
 height:12px;
 margin-top:0px;
}

#photoSelector .pages ul li span {
 display:none;
}

#photoSelector ul li.page {
 /* group of photos */
 /* float:left; */
 display:inline;
}

#photoSelector ul li.page div.title {
 margin-top:10px;
}

#photoSelector ul li.page div.title a {
 padding:0px 3px 0px 3px;
}

#photoSelector ul li.page ul li {
 /* photo item container */
 float:left;
 display:inline;
 position:relative;
}

/* IE 5:win32 display fix */

#photoSelector ul li.page div.collection li {
 height:1em;
 position:relative;
 float:none;
}

#photoSelector ul li.page div.collection ul li a,
a.related {
 /* photo item link */
 float:left;
 display:inline;
 width:16px;
 height:15px;
}

#photoSelector ul li.page div.collection span {
 /* text descriptions */
 display:none;
}

#photoSelector div.item.nophotos a {
 float:none;
 clear:none;
 display:inline;
 width:auto;
}

/* Thumbnail previews */

#thumbnailContainer {
 position:absolute;
 z-index:3;
 display:none;
 width:71px;
 height:55px;
 filter:alpha(opacity=95);
 background:transparent url(../image/thumbnail_shadow.png) 0px 0px no-repeat;
}

#thumbnailContainer div.thumbnail {
 /* scoped within body */
 margin-left:2px;
 margin-top:1px;
 width:66px;
 w\idth:64px;
 height:48px;
 background:#ccc url() 0px 0px no-repeat;
 border:1px solid #fff;
}


#bookmark {
 position:absolute;
 left:0px;
 bottom:0px;
 margin-bottom:1px;
 margin-left:3px;
 width:16px;
 z-index:2;
}

#pageTabs ul {
 padding-top:5px;
}

/* recycled from v2 */

#caption-container {
 position:absolute;
 width:800px;
 height:600px;
 left:50%;
 top:50%;
 margin-left:-400px;
 margin-top:-300px;
}

#caption {
 position:absolute;
 left:50%;
 bottom:0px;
 width:792px;
 margin-left:-400px;
 padding:2px 0px 4px 8px;
 background-image:url(../image/alpha/caption_shade.png);
}

#caption div {
 position:absolute;
 left:0px;
 top:0px;
 padding-left:16px;
 width:776px;
 font:10px tahoma,arial;
 font-weight:bold;
}

#caption div.bookmark a {
 position:relative;
}

#caption div.shade0 {
 left:0px;
 top:0px;
 display:none;
 color:#000;
}

#caption div.shade1 {
 left:9px;
 top:3px;
 color:#333;
}

html>body #caption div.shade1 {
 color:#000;
}

#caption div.shade2 { 
 position:relative;
 color:#fff;
}

/* image loader */

#loader {
 position:absolute;
 left:50%;
 top:50%;
 margin-left:-34px;
 margin-top:-17px;
}

#loader,
#loader div {
 width:67px;
 height:35px;
 z-index:4;
}

#loader div {
 position:absolute;
 left:0px;
 top:0px;
}

#container {
 position:absolute;
 z-index:2;
 width:258px;
 left:50%;
 margin-left:-129px;
 top:10%;
 /* sometimes scrollbars appear on this container, but aren't needed */
 overflow:hidden;
}

/* #container>#controls */

#controls .tab {
 position:absolute;
 top:0px;
 width:24px;
 height:17px;
 cursor:pointer;
 cursor:hand;
 background-position:0px 3px;
 background-repeat:no-repeat;
}

#controls .tab:hover,
#controls .tab.hoverIE,
#controls .tab.active,
#controls .tab.activeIE {
 background-position:0px 0px;
 background-repeat:no-repeat;
}

#controls .tab.active,
#controls .tab.activeIE,
#controls .tab.active:hover {
 z-index:1; /* sit on top */
}

#controls .tab.photos,
#controls .tab.photosIE {
 left:5px;
}

#controls .tab.search,
#controls .tab.searchIE {
 left:25px;
}

#controls .tab.about,
#controls .tab.aboutIE {
 left:45px;
}

#controls .bar {
 position:absolute;
 left:0px;
 top:13px;
 padding-left:5px;
 padding-top:5px;
 width:256px;
 w\idth:251px;
 height:32px;
}

/* page controls */


#controls a {
 float:left;
 display:inline;
 width:16px;
 height:12px;
}

#controls a.pageLink {
 float:left;
 display:inline;
 border:none;
 font-size:1px;
 width:14px;
 height:16px;
 line-height:16px;
}

#controls a.pageLink:hover {
 outline:none;
 border:none;
}

#controls a.pageLink:focus,
#controls a.pageLink.selected {
 outline:none;
 border:none;
}

/* Search form - #controls>#search */

#controls form,
#controls div.photoControls {
 display:none;
 position:absolute;
 /* Needs to be absolute to access input under ie:win32 - may be due to PNG */
 left:5px;
 top:18px; /* 16 */
 height:18px;
 margin:0px;
 padding:0px;
 width:246px;
}

#controls div.photoControls {
 display:none;
}

#controls div.photoControls h2,
#controls form h2 {
 float:left;
 display:inline;
 margin:0px;
 padding:0px;
 font-weight:bold;
 margin-left:3px;
 margin-top:3px;
 text-transform:uppercase;
 width:68px;
}

#controls form input {
 float:left;
 display:inline;
 border:0px;
 margin:0px;
 /* margin-left:70px; */
 padding:0px;
 width:135px;
 w\idth:132px;
 height:14px;
 padding-left:3px;
 padding-top:4px;
 font:9px small fonts;
 font-weight:bold;
}

#controls form a.go {
 float:left;
 display:inline;
 border:0px;
 margin:0px;
 padding:0px;
 width:24px;
 height:17px;
}

#controls form a.go.enabled {
 cursor:pointer;
 cursor:hand;
}

#controls a.minimize {
 float:right;
 display:inline;
 width:16px;
 height:17px;
 cursor:pointer;
 cursor:hand;
}

/* photo controls */

#search {
 /* search results container */
}

#search .results {
 /* container element */
 margin-top:45px;
}

#search .results .result {
 height:72px;
 min-height:72px;
 clear:both;
 -moz-opacity:0.95;
 cursor:pointer;
 cursor:hand;
 width:256px; /* ie 5.0 */
}

#search .results .result .details {
 padding-left:6px;
 padding-top:6px;
 height:65px;
}

#search .results .result .details .thumbnailContainer {
 float:left;
 display:inline;
 width:73px;
 w\idth:70px;
 height:56px;
 margin-left:3px;
 margin-top:2px;
}

#search .results .result .details .thumbnailContainer .thumbnail {
 width:66px;
 w\idth:64px;
 height:48px;
 margin-left:2px;
 margin-top:1px;
}

#search .results .result .details .description {
 float:left;
 display:inline;
 width:160px;
 margin-left:8px;
 margin-top:2px;
 font:9px small fonts;
}

#debug {
 position:absolute;
 top:8px;
 left:8px;
 padding:5px;
 width:270px;
 height:500px;
 overflow:auto;
 font:9px lucida console;
 display:none;
}

#pages {
 padding-top:1px;
}

#photoSelector div.container ul#pages li.page {
 /* hide pages by default */
 display:none;
}

#about-descriptor {
 position:absolute;
 left:8px;
 top:18px;
 z-index:2;
 width:240px;
 height:16px;
 display:none;
}

#about-descriptor h2,
#about-content h2 {
 font-weight:bold;
 text-transform:uppercase;
}

#photoIcons {
 position:absolute;
 left:-128px;
 top:-128px;
}

/* JS-driven audio */

div.movieContainer {
 position:absolute;
 left:-200px;
 width:100px;
 height:100px;
}