/* BODY */

body {margin: 1em; font-family: Georgia, Utopia, Palatino, sans-serif;}


/* LINKS */

a:link {color: #CC0000;}

a:visited {color: #660000;}

a:active {color: #FF0000;}


/* IMAGES */

img {max-width: 100%; border: 1px solid black;}

img.borderless {border: none;}

img.head {border: none;  border-bottom: medium #660000 solid;}

img.menu {float: right; clear: right; margin: 0.25em 0 0 1em;}

img.bookshelf {float: left; clear: left; margin: 0.25em 1em 0 0;}

img.album {float: left; margin: 0 1em .5em 0;}

img.bookbutton {float: right; margin: .5em 0 .5em 1em;}

@media (max-width: 54em) {
img {width: auto; height: auto;}
}


/* HEADERS, FOOTERS, NAV BLOCKS */

div.headerfooter {text-align: center; font-size: smaller; line-height: 2.0;}

div.albumheader {text-align: right; font-size: smaller; line-height: 2.0;}

div.nav, p.nav {text-align: center; line-height: 1.5;}

div.stores {text-align: center; line-height: 1.5;}

div.links, ul.links, blockquote.links, p.links {line-height: 1.5;}


/* DIVISIONS */

div.all {max-width: 52em; margin: auto;}

div.hanging {margin-left: 5%; text-indent: -5%;}

div.text {margin: 2em 0; line-height: 1.5;}

div.script {line-height: 1.5;}

div.note {margin: -.25em 0;}

div.intro {margin: 2.5em 0; line-height: 1.25;}

div.intro2 {margin: 4em 0 2em; line-height: 1.5;}

div.extras {border: double; color: black; background: #FFFFCC; margin: 1.25em 0; padding: 0 1em;}

div.note div.table {width: 100%; margin: .5em 0;}

div.one-and-a-half {margin: .5em 0;}

div.double {margin: 1em 0;}

div.triple {margin: 2em 0;}

div.doubleline {margin: 0 0 -.5em;}

div.tripleline {margin: 0 0 .5em;}

div.box {border: double 3px; background: rgba(255, 255, 204, .85); padding: 0.75em;}

div.bookbox1 {width: 66%; margin: auto; border: double 6px;}

div.bookbox2 {width: 66%; margin: auto; border: double 6px;}

div.bookbox3 {width: 90%; margin: auto; border: double 6px;}

div.menu h2, div.menu h3, div.menu h4 {clear: right;}
/* To prevent "jamming" of menu book cover images. */

div.menu h4.menusub {clear: none;}


/* BLOCK INSETS*/

/* At full width, 5% is about 2.5em, 7.5% is about 3.75em. */

blockquote {margin-left: 5%; margin-right: 5%;}

blockquote.doc {margin: 0 5%;}

@media (max-width: 33em) {
blockquote.doc {max-width: 27em; margin: auto;}
}

div.text blockquote {margin: 1em 7.5%;}

div.script blockquote {margin-top: -.5em; margin-left: 5%; margin-right: 5%;}

ul, ol, dl {padding-left: 5%;}

dd {margin-left: 5%;}

div.text ul, div.text ol, div.text dl {margin-top: 1em; margin-bottom: 1em;}

div.extras ul {margin-top: .5em; margin-bottom: 0.75em;}


/* PARAGRAPHS */

p {margin: 1em 0;}

div.text p.flush {margin: 0;}

div.text p.indented {margin: 0; text-indent: 5%;}

div.text p.hanging {margin: 0 0 0 5%; text-indent: -5%;}

div.script p.flush {margin-bottom: 0;}

div.script p.indented {margin: 0; text-indent: 5%;}

div.script p.hanging {margin: 0 0 0 5%; text-indent: -5%;}

div.script p.flush2 {margin-top: -.5em;}
/* For multi-paragraph speeches. */

div.script p.indented2 {margin-top: -.5em; text-indent: 5%;}
/* For multi-paragraph speeches. */

p.promo {border: double; color: black; background: #FFFFCC; padding: .5em; font-size: smaller; font-weight: bold; text-align: center;}

div.note p {margin: .5em 0;}

p.note {font-size: smaller;}

div.script p, div.script div {font-family: Verdana, Lucida, Geneva, sans-serif;}

p.name {margin: .5em 5% 0; text-align: right;}

p.letter {margin-left: 50%;}

p.picture {text-align: center;}

p.caption {line-height: 1.2;}

p.divider {margin: 1.5em 0 .5em; text-align: center;}

div.text ul p, div.text ol p, div.text dl p {margin: 0 0 .5em;}

div.ages p {text-align: center; margin: 0 0 .1em;}

div.note p.specialfeatures {margin-top: -.5em;}

p.variants {line-height: 1.5;}

p.bookinfo {text-align: center;}

p.docinfo {font-size: smaller;}

p.blognote {text-align: center; font-size: smaller; font-weight: bold;}

p.credit {font-size: smaller;}

p.picturecredit {text-align: center; font-size: smaller; margin-top: -1em;}

p.specialfeatures {text-align: center; font-size: smaller; margin-top: -1.25em;}

div.note p.specialfeatures {margin-top: -.75em;}

p.doclist {margin: .25em 0;}

p.booklist {text-align: center; margin: .25em 0;}


/* HEADINGS */

h1.hub {text-align: center; color: #660000;}

h1.booktitle, h2.booktitle, h3.booktitle, h4.booktitle {text-align: center; color: #660000;}

h2.bookinfo, h3.bookinfo, h4.bookinfo {text-align: center; color: #660000;}

h2.booksub {text-align: center; color: #660000; margin-top: -.75em;}

h3.booksub, h4.booksub {text-align: center; color: #660000; margin-top: -1em;}

h2.booktopper, h3.booktopper, h4.booktopper {text-align: center; color: #990000;}

h2.docsub {margin-top: -.75em;}

h3.docsub {margin-top: -1em;}

h2.menu {text-align: center;}

h3.menusub {text-align: center; margin-top: -1em;}

h4.menusub {margin-top: -1em;}

h3.tableheaderfooter {margin: 0; color: #990000;}

div.text h2, div.text h3, div.text h4 {margin: 1.5em 0 1em;}

div.extras h3 {margin: .5em 0 .5em;}


/* TABLES */

/* Banner and Notice table styles still have inconsistent coloring and text alignment. */

table {margin: auto; border-collapse: collapse;}

table.titlebox {width: 90%; color: #660000; border: outset 9px rgba(255, 153, 51, 1);}

table.titlebox td {text-align: center; padding: 1em;}

table.titlebox h1, table.titlebox h2, table.titlebox h3, table.titlebox h4 {margin: 0;}

table.inputs {width: 90%;}

table.inputs td {text-align: center;}

@media (max-width: 36em) {
table.inputs td {display: block; padding: .25em 0;}
}

table.banner {width: 90%; border: double 3px; text-align: center;}

table.banner td {text-align: center; padding: 0.75em;}

table.notice {width: 90%; border: double 3px;}

table.notice td {text-align: center; padding: .5em;}

table.download {width: 90%; border: double 3px; text-align: center; background: rgba(255, 204, 153, .85);}

table.download td {text-align: center; padding: 0.75em;}

table.audio {width: 90%; border: double; background: rgba(255, 204, 153, .85);}

blockquote table.audio {width: 100%;}

table.audio td {text-align: center; padding: 0.75em;}

table.video {width: 90%; border: double; background: rgba(255, 204, 153, .85);}

blockquote table.video {width: 100%;}

table.video td {text-align: center; padding: 0.75em;}

table.video td.graphic {width: 50%;}

@media (max-width: 40em) {
table.video td {display: block;}
table.video td.graphic {width: auto;}
}

table.book {width: 90%; margin: 1em auto; border: double;}

blockquote table.book {width: 100%;}

table.book td {text-align: center; padding: 0.75em;}

table.book td.graphic {text-align: right; width: 25%;}

@media (max-width: 36em) {
table.book td {display: block;}
table.book td.graphic {text-align: center; width: auto;}
}

/* For single-book boxes. */

table.bookbox1 {width: 100%;}

table.bookbox1 tr {vertical-align: middle;}

table.bookbox1 td {margin: 0; border: solid 2px white; border-bottom: none; text-align: center; padding: 0.75em; background: rgba(255, 153, 102, .85);}

@media (max-width: 42em) {
table.bookbox1 td {display: block; width: auto; border: none;}
}

/* For double-book boxes. */

table.bookbox2 {width: 100%;}

table.bookbox2 tr {vertical-align: top;}

table.bookbox2 td {width: 50%; margin: 0; border: solid 2px white; border-bottom: none; text-align: center; padding: 0.75em; background: rgba(255, 153, 102, .85);}

@media (max-width: 42em) {
table.bookbox2 td {display: block; width: auto;}
}

/* For triple-book boxes. */

table.bookbox3 {width: 100%;}

table.bookbox3 tr {vertical-align: top;}

table.bookbox3 td {width: 33%; margin: 0; border: solid 2px white; border-bottom: none; text-align: center; padding: 0.75em; background: rgba(255, 153, 102, .85);}

@media (max-width: 36em) {
table.bookbox3 td {display: block; width: auto;}
}

table.epigraph td {text-align: left;}

table.epigraph div {text-indent: -5%; padding: 0 2em;}

table.sign {border: 2px solid;}
/* For Peddler Polly. */

table.sign td {text-align: center; padding: 0.75em;}
/* For Peddler Polly. */

table.note {width: 100%;}

table.note tr {vertical-align: top;}

table.note td {width: 50%; padding: 0; padding-right: 4%; font-size: smaller;}

@media (max-width: 30em) {
table.note td {display: block; width: auto; padding-right: 0;}
}

table.verse {width: 100%; margin: 1em 0;}

table.verse td {padding: 0;}

table.verse td.tag {width: 3em; vertical-align: top;}

table.verse td.tag p {margin: 0;}

table.verse td.lines p {margin: 0 0 0 5%; text-indent: -5%;}


/* FORMS */

form {margin: 0;}
/* Prevents space added after forms by some browsers. */

form.buttonlink {text-align: center;}

input, textarea {margin: .5em 0; max-width: 100%;}

input[type=text], input[type=email], input[type=name], input[type=search], textarea {font-size: 11pt; font-family: Arial, Helvetica, sans-serif;}


/* SPANS */

span.nobreak {white-space: nowrap;}

span.monospace {font-family: 'Lucida Console', Monaco, monospace;}


/* HORIZONTAL RULES */

div.text hr {margin: 2.5em auto 1em;}

hr.topbottom {border: medium solid gray; margin: 1em 0;}

hr.picture {width: 50%; text-align: center;}


/* PRINT ONLY */

@media print {

div.headerfooter {display: none;}
div.text hr {display: none;}
blockquote.doc form {display: none;}

div.break {page-break-before: always;}
div.text h2, div.script h2 {page-break-before: always;}

h2, h3, h4 {page-break-after: avoid;}
p.caption {page-break-after: avoid;}

div.nobreak {page-break-inside: avoid;}
div.script p {page-break-inside: avoid;}
p.caption {page-break-inside: avoid;}
table.book {page-break-inside: avoid;}
table.verse {page-break-inside: avoid;}
td {page-break-inside: avoid;}

p {widows: 2; orphans: 2;}
div.text ul, div.text ol, div.text dl {widows: 2; orphans: 2;}

}