/* stylesheet for david morrish / deadcat press */

body {background: #111 url(images/frieze.gif) repeat-y center; color: #525045; font-family: Georgia, serif; text-align: center; margin: 0;}

a {text-decoration: none;}
a:link,a:visited {color: #3a4677;}
a:hover,a:active {color: #4258af; text-decoration: underline;}
a img {border: none;}

/*
#cbbd82 background / matte colour for book pages
*/

/* layout divs */
div {text-align: left; border: 0px white solid;}
#book {position: relative; width: 880px; height: 615px; left: 8px; background: url(images/book.jpg) no-repeat; margin-top: 8px; margin-left: auto; margin-right: auto; overflow: visible;}
.verso {float: left; width: 435px; height: 550px; overflow: auto;}
.versoinside {margin: 40px 20px 20px 30px;}
.recto {float: right; width: 435px; height: 550px; overflow: auto;}
.rectoinside {margin: 40px 30px 20px 20px;}

/* layout for pages with images that spread across both pages (ex: Panoramas from Spain) */
.double {float: left; width: 874px; height: 550px; overflow: auto;}
.doubleimage {margin-top: 40px; text-align: center;}
.doubleimage img, .doubleimage .shadow {margin-left: auto; margin-right: auto;}
.double p {text-align: left;}
.doubletext .title {margin-top: 1em;} /* margin-left and width determined using javascript */

#versopagehead {position: absolute; top: 13px; left: 17px; width: 418px; font-size: 0.75em; color: #6d6852; text-align: center; overflow: visible; z-index: 5;}
#rectopagehead {position: absolute; top: 13px; left: 447px; width: 418px; font-size: 0.75em; color: #6d6852; text-align: center; overflow: visible; z-index: 5;}
#versopagehead a:link, #versopagehead a:visited, #rectopagehead a:link, #rectopagehead a:visited {color: #6d6852;}

.panel {position: relative; display: none;}


/* index page table of contents */
#tocindex .toc-header {font-size: 1.2em; text-align: center; margin-bottom: 1.2em;}
#tocindex .toc-subheader {margin-top: 0.5em; margin-bottom: 0.5em;}
#tocindex .toc {list-style: none; margin: 0; padding: 0; font-style: italic;}
#tocindex .toc li {margin-bottom: 0.8em; font-size: 0.95em;}
#tocindex .toc ul {list-style: none; margin: 0; padding: 0;}
#tocindex .toc ul li {padding-left: 11px; margin-bottom: 0.4em;}
#tocindex .tocli {}
#tocindex .tocli-lit {background: url(images/arrow-white.gif) -3px 3px no-repeat;}
#tocindex .leftcolumn {float: left; width: 180px; padding-right: 4px; border-right: 1px #9b9262 solid;}
#tocindex .rightcolumn {float: right; width: 180px;}
#tocindex .top li {padding-left: 11px;}
#tocindex .bottom li {padding-left: 11px;}
#tocindex .bottom {clear: both;}

/* "website by matthew hollett" on index page */
.byline {float: right; font-size: 0.65em; color: #333; margin-top: 0; margin-right: 14px;}
.byline a:link, .byline a:visited {color: #444;}
.byline a:hover, .byline a:active {color: #444;}


/* gallery pages table of contents */
#toclink {position: absolute; top: 0; left: -54px; width: 55px; height: 55px; background: url(images/toc.gif) no-repeat 0px 0px;}
#tocbookmark {display: none; position: absolute; top: 58px; left: -88px; width: 84px; font-size: 0.75em; font-family: Trebuchet MS, sans-serif; line-height: 1.1em; text-align: right; margin: 0; padding: 0;}
#tocbookmark .toc {margin: 0; padding: 0; list-style: none; padding-top: 0.5em; border-top: 1px #2c2b26 solid;}
#tocbookmark .toc li {margin: 0; padding: 0; margin-bottom: 0.6em;}
#tocbookmark .toc ul {list-style: none; margin: 0; padding: 0;}
#tocbookmark .toc ul li {margin: 0; padding: 0; margin-bottom: 0.6em;}
#tocbookmark .toc-subheader {display: none;}
#tocbookmark .top {padding-top: 0; border: 0;}

#tocbookmark .tocli {}
#tocbookmark a.toca-current {color: #ddd; cursor: default;}
#tocbookmark a.toca-current:hover {text-decoration: none;}


/* gallery pages */
#loading {position: absolute; top: 250px; left: 150px; width: 150px; font-style: italic; font-size: 0.8em; color: #6d6852; text-align: center;}
#book .panel {margin-left: 4px;} /* panels on all gallery pages need a slight left margin */
#book .verso .panel {margin-left: 0;} /* panels on index page don't */
.caption {font-size: 0.9em; margin-left: 5px;}
.title {margin-top: 3em; font-size: 1em; font-style: italic; margin-bottom: 0;}
.info {font-size: 0.7em; color: #6d6852; margin-top: 1em; margin-bottom: 2em;}
.media {}
.size {}
.date {}
.edition {}
.statement {line-height: 1.4em;}
.centered {margin-left: 0; margin-right: 0; text-align: center;}
.vcentered {} /* vertically centered using javascript; this is only used on the index page. */

#tray {position: absolute; left: 0px; top: 560px; width: 880px; height: 55px; overflow: hidden;}
.lefthand {float: left; width: 80px; height: 48px; background: url(images/hand-left.gif) no-repeat 0px 0px; margin-right: 20px; opacity: .65; filter: alpha(opacity=65);}
.thumb {float: left; margin-right: 10px; opacity: .50; filter: alpha(opacity=50); border: 0px white solid;}
.thumb-lit {float: left; margin-right: 10px; opacity: .99; filter: alpha(opacity=99);}
.lefthand:hover,.thumb:hover {opacity: .99; filter: alpha(opacity=99);}


/* news page */
.news {border: 1px #988654 dotted; margin-bottom: 2em; padding: 10px; font-size: 0.85em;}
.post-title {font-variant: small-caps; margin-top: 0.5em; margin-bottom: 0.25em;}
.post-date {color: #6d6852; font-size: 0.85em; margin-top: 0; margin-bottom: 1em;}
.post-content {margin-bottom: 0;}

.post-content ul {}
.post-content li {}

#news-archives {display: none;}
#news-archives-link.closed {padding-left: 15px; background: url(images/expand-plus.gif) 0px center no-repeat; cursor: default;}
#news-archives-link.open {padding-left: 15px; background: url(images/expand-minus.gif) 0px center no-repeat; cursor: default;}
#news-archives-link.closed:hover, #news-archives-link.open:hover {color: #fff; text-decoration: none;}

ul.recent {padding: 0; margin: 0; list-style: none; overflow: hidden;}
ul.recent li {float: left; padding: 0; margin: 0; margin-right: 12px; margin-bottom: 12px; width: 52px; height: 52px;}
ul.recent li img {width: 50px; height: 50px; border: 1px solid #988654;}
ul.recent li img:hover {border-color: #fff;}


/* links page */
.links ul {list-style: none; margin: 0; padding: 0; font-size: 0.9em;}
.links ul li {margin-bottom: 0.4em; padding-top: 2px; border-top: 1px #988654 dotted;}
.links ul li ul {margin-top: 5px; margin-bottom: 1.5em; padding-left: 17px; font-size: 0.8em; line-height: 1.4em;}
.links ul li ul li {margin: 0; padding: 0; margin-bottom: 0.4em; list-style-image: url(images/expand-bullet.gif); border: 0;}

#expandable li ul, #expandable2 li ul {display: none;}
a.links-subheader {padding-left: 14px; background: url(images/expand-plus.gif) 0px center no-repeat; cursor: pointer;}
a.links-subheader:hover {color: #fff; text-decoration: none;}
a.links-subheader-selected {padding-left: 14px; background: url(images/expand-minus.gif) 0px center no-repeat; cursor: default;}
a.links-subheader-selected:hover {color: #525045; text-decoration: none;}


/* addendum page */
.addendum ul {list-style: none; margin: 0; padding: 0; padding-left: 10px; font-size: 0.95em;}
.addendum ul li {margin-bottom: 0.4em; padding-top: 2px; padding-left: 10px; background: url(images/bullet.gif) 0px center no-repeat;}


/* To add shadows automatically generated by javascript to an image, assign class="shadow" to the image.
   Note that setting the image's padding or margin with style tags will mess up the shadow placement.
   The javascript function shadows() is run on every page as part of the onloads() function.
   
   Also note that there are several images on the site with shadows added using Photoshop instead,
    which works better for the artistamps and for tilted images. */

div.shadow {
 position: relative;
 padding: 0 1px;
 background: #a79c6b;
 border-left: 1px #bfb27a solid;
 border-right: 1px #bfb27a solid;
}

div.shadow img {
 padding: 0; padding-bottom: 4px;
 background: white url(images/shadow_bottom.png) repeat-x bottom left;
}

div.shadow img.matte {
 padding: 5px 5px 9px 5px;
 background: white url(images/shadow_bottom.png) repeat-x bottom left;
}

/* this is necessary because shadow script changes img into div (no longer affected by text-align: center) */
.centered div.shadow {
 margin-left: auto;
 margin-right: auto;
}

div.shadow div.topleft {
 width: 2px;
 height: 4px;
 background: url(images/shadow_tlcorner.png) no-repeat top left;
 position: absolute;
 top: 0px;
 left: -1px;
}

div.shadow div.topright {
 width: 2px;
 height: 4px;
 background: url(images/shadow_trcorner.png) no-repeat top right;
 position: absolute;
 top: 0px;
 right: -1px;
}

div.shadow div.bottomleft {
 width: 4px;
 height: 4px;
 background: url(images/shadow_blcorner.png) no-repeat bottom left;
 position: absolute;
 bottom: 0px;
 left: -1px;
}

div.shadow div.bottomright {
 width: 4px;
 height: 4px;
 background: url(images/shadow_brcorner.png) no-repeat bottom right;
 position: absolute;
 bottom: 0px;
 right: -1px;
}