*	{margin:0;padding:0}
html,body	{height:100%;font-size:1.2em;line-height:1.4em;color:black}
/* Note: if the following 2 .woff files are in another location, please edit the two url() specifiers, below. */
@font-face {
    font-family: 'liberationsans';
    src: url('fonts/liberationsans.eot');
    src: url('fonts/liberationsans.eot?#iefix') format('embedded-opentype'),
         url('fonts/liberationsans.woff') format('woff'),
         url('fonts/liberationsans.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
html,body	{font-family: 'liberationsans','Liberation Serif','Liberation Sans','sans';}
h1 { font-weight: normal; }
.main	{min-height:100%;margin-bottom:-4em;padding:0.5em}
.main:after	{content:"";display:block}
li	{list-style:disc inside}
ul.cmenu ul{display:none}
ul.cmenu li:hover>ul{display:block}
ul.cmenu ul{position: absolute;left:-1px;top:98%}
ul.cmenu ul ul{position: absolute;left:98%;top:-2px}
ul.cmenu,ul.cmenu ul {margin:0px;list-style:none;padding:0px 2px 2px 0px;background-color:#000000;border-color:#cccccc #111111 #111111 #cccccc;border-width:1px;border-style:solid}
ul.cmenu table {border-collapse:collapse}ul.cmenu {display:block;zoom:1;float: left}
ul.cmenu li{display:block;margin:2px 0px 0px 2px;font-size:0px}
ul.cmenu a:active, ul.cmenu a:focus {outline-style:none}
ul.cmenu a, ul.cmenu li.dis a:hover, ul.cmenu li.sep a:hover	{display:block;vertical-align:middle;background-color:#000000;border-width:1px;border-color:#333333;border-style:solid;
 text-align:center;text-decoration:none;padding:2px 5px 2px 10px;_padding-left:0;font-style: normal;font-size: 16pt;color: #eeeeee;text-decoration:none;cursor:default}
ul.cmenu span{overflow:visible}
ul.cmenu li {float:left}
ul.cmenu ul li {float:none}
ul.cmenu ul a {text-align:center;white-space:nowrap}
ul.cmenu li.sep{text-align:center;padding:0px;line-height:0;height:100%}
ul.cmenu li.sep span{float:none;padding-right:0;width:3px;height:100%;	display:inline-block;background-color:#cccccc #111111 #111111 #cccccc;	background-image:none}
ul.cmenu ul li.sep span{width:100%;height:3px}
ul.cmenu li:hover{position:relative}
ul.cmenu li:hover>a{background-color:#377D9F !important;border-color:#377D9F;border-style:solid;font-style: normal;font-size: 16pt;color: #FFFFFF;text-decoration:none}
ul.cmenu li a:hover{position:relative;background-color:#377D9F;border-color:#377D9F;border-style:solid;font-style: normal;font-size:16pt;color:#FFFFFF;text-decoration:none}
ul.cmenu li.dis a {color:#666 !important}
ul.cmenu a:hover ul,ul.cmenu a:hover a:hover ul{display:block}
ul.cmenu a:hover ul ul{display:none}
ul.cmenu span{display:block;background-position:right center;background-repeat: no-repeat;padding-right:12px}
a.xx	{background-color:#333333 !important}
a.nn	{background-color:#202050 !important}
a.oo	{background-color:#205030 !important}
a.aa	{background-color:#333300 !important}
html[dir=rtl] body	{text-align:right;direction:rtl}
span.add	{font-style:italic}
.popup,.crpopup	{position:absolute;bottom:0;display:none;background-color:#ffffd0;border:.1em solid #333;width:15em;height:auto;padding:1em;line-height:1em;text-indent:0em;margin 0.5em 0.5em 0.5em 0.5em}
.notemark:hover .popup	{display:block}
.notemark:hover .crpopup	{display:block}
.b	{display:block;margin-left:12em;text-indent:-2em}
.bdit,.bk,.fk	{font-weight:bold;font-style:italic}
.fw {font-weight:bold}
.ebm,.ebp,.ebq1,.ebq2,.ebq3,.cov,.cd,.conc,.cls	{display:block;margin:.5em 0 .5em 0}
.cd,.conc,.cls	{text-align:justify}
.cd,.conc	{color:rgb(0,0,128)}
.cov	{text-align:center}
.d	{font-weight:bold;display:block;margin-top:1.4em}
.ebp	{text-indent:2em}
.ebq1	{margin-left:12em;text-indent:-4em}
.ebq2	{margin-left:8em;text-indent:-4em}
.ebq3	{margin-left:6em;text-indent:-4em}
.ebs,.ebs1,.ebs2,.ebs3	{font-weight:bold;display:block;margin:.5em 0 .5em 0;text-indent:2em;color:rgb(0,0,128)}
.ebs1	{font-size:1.2em}
.ebs3	{font-size:0.9em}
.fm,.notemark	{vertical-align:super;margin-left:.16em;line-height:0;position: relative;text-decoration:none;color:rgb(0,0,128)}
.fp	{display:block;margin:.5em 0 .5em 12em}
.f,.glo	{display:block;margin:.5em 0 .5em 0;color:rgb(0,0,128)}
.f,.x	{margin:2em;text-size:0.7em;color:rgb(0,0,128)}
.fv	{color:maroon}
.glo	{font-weight:bold;text-indent:2em}
.ib,.idx,.ie,.iex,.intro,.ip,.ili,.ili1,.io,.io1,.io2,.io3,.io4,.io,.io1,.io2,.io3,.io4,.im,.imi,.imq,.imt,.imt1,.imt2,.imt3,.imte,.iot,.ipr,.iq,.iq1,.iq2,.iq3,
.is,.is1,.is2,.is3,.notebackref,.f,.x,.notemark	{color:blue;font-size:14pt}
.ib,.idx,.ie,.iex,.intro,.ip,.zp	{margin:.5em 0 .5em 0;text-indent:2em;display:block}
.ili,.ili1,.io,.io1,.io2,.io3,.io4	{margin:.5em 0 .5em 2em;list-style-type:square;display:list-item}
.io,.io1,.io2,.io3,.io4	{list-style-type:none}
.io2	{margin-left:4em}
.io3	{margin-left:6em}
.io4	{margin-left:8em}
.im,.imi,.imq	{display:block;margin-bottom:.5em}
.imi	{text-indent:2em;margin:.5em 12em 0 12em}
.imq	{text-indent:2em;margin:.5em 0 0 12em}
.imt,.imt1,.imt2,.imt3,.imte,.iot	{font-weight:bold;display:block;margin:.5em 0 .5em 0;text-indent:2em}
.imt2,.iot	{text-indent:2em}
.ipi,.ipq,.pref,.pub,.pubinfo,.spine,
.ipr,.iq,.iq1,.iq2,.iq3	{display:block;margin:.5em 0 .5em 2em;text-indent:2em}
.iq,.iq1,.iq2,.iq3	{text-indent:-8em;margin-left:12em}
.iq2	{text-indent:-4em}
.iq3	{text-indent:-2em}
.is,.is1,.is2,.is3	{font-weight:bold;display:block;margin:.5em 0 .5em 0;color:rgb(0,0,128)}
.is,.is1	{font-size:1.2em}
.is3	{font-size:0.9em}
.keyword,.keyword1,.keyword2,.keyword3	{font-weight:bold;display:block;margin:.5em 12em .5em 0;text-indent:-12em}
.keyword2	{text-indent:-4em}
.keyword3	{text-indent:-2em}
.li,.li1,.ph,.ph1	{display:list-item;list-style-type:none;text-indent:2em}
.li2,.ph2,.phi,.li3,.ph3	{display:list-item;list-style-type:none;text-indent:4em}
.li3,.ph3	{text-indent:12em}
.m	{margin-top:0}
.mainindex	{background:rgb(240,255,244);max-width:40em}
.mi	{text-indent:2em;margin-top:0}
.mr	{display:block;margin:.5em 0 .5em 0;text-align:center;text-indent:2em}
.ms2,.ms3	{font-weight:bold;display:block;margin:.5em 0 .5em 0;text-align:center;text-indent:2em}
h1,h2,h3,.mt,.mt1,.mte,
.mte1,.mt2,.mte2,.mt3,.mte3	{font-weight:bold;font-size:1.2em;text-align:center}
.mt,.mt1,.mte,.mte1	{font-size:1.4em}
.mt2,mte2	{font-size:1.2em}
.qac,.k1,.nd,.xk,.k,.ior,.bd	{font-weight:bold}
.sc {font-variant: small-caps}
.qs	{text-align:right}
.ndx,.no,.ft	{font-weight:normal}
.rr,.rq,.rq,.fq,.fqa,.it,.em,.sls,.sp	{font-style:italic}
.w,.wg,.wh,.wr,.zc	{font-style:normal}
.wj	{color:rgb(128,0,0)}
.qt	{font-style:oblique}
.ord	{vertical-align:super;text-decoration:underline}
.nb, .ps { text-indent: 0em; margin-top: 0em }
.p,.p1,.pb,.pde,.pdi	{text-indent:2em;margin-top:.5em}
.p,.nb	{display:block;font-size:1em}
.pc	{margin-top:.5em;text-align:center}
.pm,.pmo,.pmc,.psi,.pi,.pi1,.pi2,.pi3,
.pmr,.pr	{text-indent:2em}
.pi,.pi1	{margin:.5em 0 0 2em}
.pi2	{margin:.5em 0 0 4em}
.pi3	{margin:.5em 0 0 12em}
.pm,.pmo,.pmc,.psi,.pmr,.pr	{margin:.5em 2em 0 2em}
.q,.q1,.q2,.q3	{margin-top:0pt}
.q,.q1,.q2,.q3	{margin-top:0pt}
html[dir=ltr] .q,.q1	{text-indent:-2em;margin-left:2em}
html[dir=ltr] .q2	{text-indent:-1em; margin-left:2em}
html[dir=ltr] .q3	{text-indent:-1em; margin-left:3em}
html[dir=rtl] .q,.q1	{text-indent:-2em;margin-right:2em}
html[dir=rtl] .q2	{text-indent:-1em; margin-right:2em}
html[dir=rtl] .q3	{text-indent:-1em; margin-right:3em}
.qa	{margin:.5em 0 .5em 0;font-weight:bold;display:block;text-align:center}
.qc	{text-align:center}
.qm,.qm1,.qm2,.qm3	{margin-top:0;text-indent:-8em;margin-left:6em;margin-right:6em}
.qm2	{text-indent:-6em}
.qm3	{text-indent:-2em}
.r,.sr	{font-style:italic;text-align:center;margin-bottom:.5em}
.s2,.s3	{font-weight:bold;text-align:center}
.s,.s1	{font-weight:bold;text-align:center;margin-top:.6em}
.toc,.toc1,.toc2	{display:block;font-size:1em}
.toc 	{margin-left:1em;margin-right:1em}
.toc1	{margin-left:2em;margin-right:2em}
.toc2 	{font-size:0.9em;margin-left:3em;margin-right:3em}
.chapterlabel	{text-align:center;margin-top:1em;font-size:1.1em}
.chapter	{font-size:1.5em;font-weight:bold;float:left;margin-right:.3em;vertical-align:top}
.p .chapter, .q .chapter,
.q1 .chapter .q2 .chapter,
.q3 .chapter, .poetry .chapter	{margin-right:1em}
.verse	{white-space:nowrap;vertical-align:super;font-size:.6em;line-height:0}
.footnote,
.crossRefNote	{display: block; margin-top:.5em;margin-left:0em}
.notebackref	{margin: 1em}
.fine,.copyright,.figcopr	{font-size:10pt;color:#333333}
.figref	{font-style:italic;font-size:10pt;color:#000040}
.figCaption	{font-size:11pt;color:#000040}
ul.tnav	{list-style-type:none;padding:5px;margin-left:0;text-align:center}
.tnav li	{display:inline}
.tnav a	{display:inline-block;border:1px solid #000;padding:5px;background-color:#00CFFF;text-decoration:none;color:#000;border-radius:5px;min-width:1.5em}
.tnav a:visited	{color:#404000}
.tnav a:link	{color:#000040}
.tnav a:hover	{color:#FFFFFF;background-color:#204880}

ul.vnav	{list-style-type:none;padding:5px;margin-left:0;text-align:center;float:left}
.vnav li	{list-style-type:none}
.vnav a	{display:block;padding:3px;background-color:#036;border-bottom:1px solid #eee;text-decoration:none;width:12rem}
.vnav a:visited	{color:#ffff66}
.vnav a:link	{color: #ffffff}
.vnav a:hover	{background-color:#0520ff !important;color:#ffffff}

div.bookList	{float:left;margin:0px;padding:3px;width:13rem;background:rgb(223,255,255)}
/* Include padding and borders when calculating element widths. */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    height: auto;
    min-height 100%;
    font-size: 100%;
    background-color: #204030;
}

body {
    height: auto;

    /* About 20px with the usual browser default. */
    font-size: 1.25rem;
    line-height: 1.5;

    /* Center the whole page and limit reading line length. */
    max-width: 72ch;
    margin: 0 auto;
    min-height: 100vh;
    background-color: #e0ffe0;

    /* Comfortable edges, including on narrow phones. */
    padding: 0.75rem 1rem 2rem;

    /* Allow unusually long words or URLs to wrap if necessary. */
    overflow-wrap: anywhere;
}

/* Replace the existing full-height / negative-margin layout. */
.main {
    min-height: 0;
    margin: 0;
    padding: 0;
}

/* Let illustrations fit the reading column. */
img,
svg,
video {
    max-width: 100%;
    height: auto;
}

/* Give navigation buttons room to wrap and easy touch targets. */
ul.tnav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.5rem 0;
}

.tnav a {
    min-width: 2.75rem;
    min-height: 2.75rem;
    padding: 0.35rem 0.65rem;
}

/* Existing footnote margins consume too much width on phones. */
.f,
.x {
    margin: 1rem 0;
    line-height: 1.5;
}

/* All wrapped poetry lines start 4em from the column edge. */
html .main .q,
html .main .q1,
html .main .q2 {
    display: block;
    margin: 0;
    padding: 0;
    padding-inline-start: 4em;
}

/* First-level poetry starts at the column edge. */
html .main .q,
html .main .q1 {
    text-indent: -4em;
}

/* Second-level poetry starts 2em from the column edge. */
html .main .q2 {
    text-indent: -2em;
}
/* Third-level poetry starts 3em from the column edge. */
html .main .q3 {
    text-indent: -1em;
}

/* Responsive book picker */
body.book-picker-page {
    width: min(100% - 2rem, 72rem);
    max-width: none;
    padding: clamp(1.25rem, 4vw, 3rem) 0;
}

.book-picker {
    width: 100%;
}

.page-header {
    margin: 0 0 clamp(1.5rem, 4vw, 2.5rem);
    text-align: center;
}

.page-header .eyebrow {
    margin: 0 0 0.5rem;
    color: var(--accent);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.page-header h1 {
    margin: 0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2rem, 5vw, 3rem);
    font-weight: 500;
    letter-spacing: -0.035em;
    line-height: 1.1;
}

.testament {
    margin-top: 1.25rem;
    padding: clamp(1rem, 3vw, 1.75rem);
    border: 1px solid var(--border);
    border-radius: 1rem;
    background: var(--raised-surface);
}

.testament h2 {
    margin: 0 0 1rem;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.35rem;
    font-weight: 500;
    text-align: left;
}

.book-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 9.5rem), 1fr));
    gap: 0.625rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.book-list li {
    min-width: 0;
    list-style: none;
}

.book-link {
    display: flex;
    min-height: 2.875rem;
    align-items: center;
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--border);
    border-radius: 0.625rem;
    background: var(--surface);
    color: var(--text);
    font-size: 0.9375rem;
    line-height: 1.25;
    text-decoration: none;
    transition: border-color 150ms ease, background-color 150ms ease, color 150ms ease, transform 150ms ease;
}

.book-link:hover {
    transform: translateY(-1px);
    border-color: var(--accent);
    background: var(--hover);
    color: #f3f7fa;
}

.book-link:focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .book-link {
        transition-duration: 0.01ms;
    }
}

/* Dark reading palette */
:root {
    color-scheme: dark;
    --page-background: #0b1220;
    --surface: #111b2a;
    --raised-surface: #192638;
    --text: #e5eaf0;
    --muted-text: #a6b4c4;
    --link: #9bc8e8;
    --accent: #8fc8c0;
    --border: #34465a;
    --hover: #315767;
}

html {
    background-color: var(--page-background);
}

html,
body {
    color: var(--text);
}

body {
    background-color: var(--surface);
}

.mainindex,
div.bookList {
    background-color: var(--raised-surface);
}

.popup,
.crpopup {
    color: var(--text);
    background-color: var(--raised-surface);
    border-color: var(--border);
}

.cd,
.conc,
.ebs,
.ebs1,
.ebs2,
.ebs3,
.is,
.is1,
.is2,
.is3,
.fm,
.notemark,
.f,
.x,
.glo,
.ib,
.idx,
.ie,
.iex,
.intro,
.ip,
.zp,
.ili,
.ili1,
.io,
.io1,
.io2,
.io3,
.io4,
.im,
.imi,
.imq,
.imt,
.imt1,
.imt2,
.imt3,
.imte,
.iot,
.ipr,
.iq,
.iq1,
.iq2,
.iq3,
.notebackref {
    color: var(--link);
}

.wj {
    color: #f0a6a0;
}

.fv {
    color: #e8c98b;
}

.chapter,
.chapterlabel {
    color: var(--accent);
}

.fine,
.copyright,
.figcopr {
    color: var(--muted-text);
}

.figref,
.figCaption {
    color: #b8c9dc;
}

ul.cmenu,
ul.cmenu ul {
    background-color: var(--raised-surface);
    border-color: var(--border);
}

ul.cmenu a,
ul.cmenu li.dis a:hover,
ul.cmenu li.sep a:hover {
    color: var(--text);
    background-color: var(--surface);
    border-color: var(--border);
}

ul.cmenu li:hover > a,
ul.cmenu li a:hover {
    color: #f3f7fa;
    background-color: var(--hover) !important;
    border-color: var(--hover);
}

ul.cmenu li.dis a {
    color: var(--muted-text) !important;
}

.tnav a {
    color: var(--text);
    background-color: var(--raised-surface);
    border-color: var(--border);
}

.tnav a:visited {
    color: #c4b5df;
}

.tnav a:link {
    color: var(--link);
}

.tnav a:hover {
    color: #f3f7fa;
    background-color: var(--hover);
}

.vnav a {
    color: var(--text);
    background-color: var(--raised-surface);
    border-bottom-color: var(--border);
}

.vnav a:visited,
.vnav a:link {
    color: var(--text);
}

.vnav a:hover {
    color: #f3f7fa;
    background-color: var(--hover) !important;
}
