div.contents-item-locked { position:relative; }
div.contents-item-locked::after { content: ''; position: absolute; top: 0; right: 0; width: 0; height: 0; border-left: 50px solid transparent; border-top: 50px solid yellow; background-size: cover; border-width: 70px; }
div.contents-item-locked-image { position:absolute; top:8px; right:8px; z-index:10; }
div.contents-item-audio-image { position:absolute; bottom:8px; right:8px; width:24px; height:24px; z-index:10; }
.plan-days-scroller { overflow-x: scroll; white-space: nowrap; margin-top: 6px; margin-bottom: 6px; }
.plan-days-scroller::-webkit-scrollbar { display: none; }
.plan-days-scroller { -ms-overflow-style: none; scrollbar-width: none; }
.plan-day-box { display: inline-block; position:relative; width: 60px; height: 60px; border: 1px solid; border-bottom: 3px solid; text-align: center; cursor: pointer; }
.plan-day-box.selected { border-top: 3px solid; border-left: 3px solid; border-right: 3px solid; border-bottom: 3px; padding-bottom: 2px; }
.plan-day-box.blank { border-top: 1px; border-left: 1px; border-right: 1px; border-bottom: 3px solid; }
.plan-day-box-content { position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); }
.plan-checkbox-image { display:block; }
@font-face {
    font-family: font1;
    src: url('../fonts/CharisSIL-Regular.ttf');
    font-weight: normal; font-style: normal; 
}
@font-face {
    font-family: font1;
    src: url('../fonts/CharisSIL-Bold.ttf');
    font-weight: bold; font-style: normal; 
}

#container { font-family: font1; direction: LTR; font-size: 20px; font-weight: normal; font-style: normal; color: var(--TextColor); }
#content { padding-top: 16px; padding-bottom: 10px; }
#container.single { margin-inline-start: 5%; margin-inline-end: 5%; margin-bottom: 60px; }
#container.verse-by-verse { margin-inline-start: 5%; margin-inline-end: 5%; margin-bottom: 60px; }
#container.about { margin-inline-start: 4%; margin-inline-end: 4%; color: var(--TextColor); background-color: var(--BackgroundColor); }
#container.scrpopup { margin-inline-start: 4%; margin-inline-end: 4%; color: var(--TextColor); background-color: var(--FootnoteBackgroundColor); margin-top: 8px; }
#container.story { margin-inline-start: 5%; margin-inline-end: 5%; color: var(--TextColor); background-color: var(--BackgroundColor); margin-top: 2px; margin-bottom: 60px; }
#container.glossary { margin-inline-start: 4%; margin-inline-end: 4%; margin-top: 4px; background-color: var(--FootnoteBackgroundColor); }
a:link { color: var(--LinkColor); font-style: inherit;  }
a.verse-link { text-decoration: none; }
a.audio-link { text-decoration: underline; }
a.web-link { text-decoration: underline; }
a.email-link { text-decoration: underline; }
a.tel-link { text-decoration: underline; }
highlighting { background-color: var(--TextHighlightColor); }
div.c { text-align: start; color: var(--TitlesColor); font-size: 140%; font-weight: bold; }
div.cl { text-align: center; color: var(--TitlesColor); font-size: 130%; font-weight: bold; margin-top: 0.5em; }
span.v { color: var(--VerseNumberColor); font-size: 70%; position: relative; bottom: 0.3em; line-height: normal; }
span.vsp { font-size: 50%; line-height: normal; }
span.va { color: var(--VerseNumberColor); font-style: normal; font-size: 70%; position: relative; bottom: 0.3em; line-height: normal; }
span.ayah { font-size: 100%; bottom: 0em; }
div.s { text-align: start; padding-top: 24px; padding-bottom: 0px; color: var(--TitlesColor); font-weight: bold; font-size: 120%; page-break-after: avoid; }
div.s2 { text-align: start; padding-top: 20px; padding-bottom: 2px; color: var(--TitlesColor); font-weight: bold; font-size: 120%; page-break-after: avoid; }
div.ms { text-align: left; padding-top: 30px; padding-bottom: 0px; color: var(--TitlesColor); font-weight: bold; font-size: 120%; page-break-after: avoid; }
div.ms2 { text-align: center; padding-top: 30px; padding-bottom: 8px; color: var(--TitlesColor); font-weight: bold; font-size: 110%; page-break-after: avoid; }
div.r { text-align: center; padding-top: 14px; padding-bottom: 2px; font-style: normal; font-size: 90%; page-break-after: avoid; }
div.r a { color: var(--TextColor); }
div.s + div.r { padding-top: 0px; }
div.s2 + div.r { padding-top: 0px; }
div.sr { text-align: center; padding-bottom: 2px; font-style: normal; font-size: 90%; }
div.mr { text-align: left; font-style: normal; padding-top: 20px; padding-bottom: 0px;}
span.rq { font-style: normal; }
div.d { text-align: left; font-style: normal; }
/* div.sp { padding-top: 15px; font-style: normal; } */
div.sp { text-align: start; padding-top: 24px; padding-bottom: 0px; color: var(--TitlesColor); font-weight: bold; font-size: 120%; page-break-after: avoid; }
div.mt { text-align: center; color: var(--TitlesColor); font-weight: bold; font-size: 150%; page-break-after: avoid; }
div.mt2 { text-align: center; color: var(--TitlesColor); font-weight: bold; font-size: 110%; page-break-after: avoid; }
div.mt3 { text-align: center; color: var(--TitlesColor); font-weight: bold; font-size: 100%; page-break-after: avoid; }
div.mt4 { text-align: center; color: var(--TitlesColor); font-weight: bold; font-size: 90%; page-break-after: avoid; }
div.mte { text-align: center; color: var(--TitlesColor); font-weight: bold; font-size: 150%; }
div.mte2 { text-align: center; color: var(--TitlesColor); font-weight: bold; font-size: 110%; }
div.mte3 { text-align: center; color: var(--TitlesColor); font-weight: bold; font-size: 100%; }

div.p { padding-inline-start: 0%; padding-inline-end: 0%;  text-indent: 1.8em; }
div.m { padding-inline-start: 0%; padding-inline-end: 0%; padding-top: 12px; text-indent: 0; }
div.po { padding-inline-start: 0%; padding-inline-end: 0%; padding-top: 12px; text-indent: 0; }
div.cls { padding-inline-start: 0%; padding-inline-end: 0%; padding-top: 12px; text-indent: 0; text-align: end; }
div.pc { padding-inline-start: 0%; padding-inline-end: 0%; padding-top: 12px; text-indent: 0; text-align: center; }
div.pmo { padding-inline-start: 5%; padding-inline-end: 5%; padding-top: 12px; text-indent: 0; }
div.pm { padding-inline-start: 5%; padding-inline-end: 5%; padding-top: 12px; text-indent: 0; }
div.pmc { padding-inline-start: 5%; padding-inline-end: 5%; padding-top: 12px; text-indent: 0; }
div.pmr { padding-inline-start: 0%; padding-inline-end: 0%; padding-top: 6px; text-indent: 0; text-align: end; }
div.pr { padding-inline-start: 0%; padding-inline-end: 0%; padding-top: 12px; text-indent: 0; text-align: end; }
div.pi { padding-inline-start: 8%; padding-inline-end: 0%; padding-top: 12px; text-indent: 3%; }
div.pi2 { padding-inline-start: 10%; padding-inline-end: 0%; padding-top: 12px; text-indent: 3%; }
div.mi { padding-inline-start: 8%; padding-inline-end: 0%; padding-top: 12px; text-indent: 0; }
div.lit { text-align: end; }
/* div.q { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -15%; } */
div.q { padding-inline-start: 0%; padding-inline-end: 2%; text-indent: 1.8em; }
div.q-v { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -18%; }
div.q-vv { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -19%; }
div.q2 { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -8%; }
div.q2-v { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -11%; }
div.q2-vv { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -13%; }
div.q3 { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -5%; }
div.q3-v { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -8%; }
div.q3-vv { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -10%; }
div.q4 { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -2%; }
div.q4-v { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -5%; }
div.q4-vv { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -7%; }
div.qc { text-align: center; }
div.qr { text-align: end; }
div.qm { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -8%; }
div.qm2 { padding-inline-start: 20%; padding-inline-end: 2%; text-indent: -5%; }
div.qa { padding-top: 18px; padding-bottom: 4px; text-align: left; font-weight: 600;}
div.qd { font-style: normal; }
span.qs { font-style: normal; }
span.qac { font-weight: bold; font-style: normal; }
div.b { padding-top: 0px; line-height: 0%; }
div.sd { padding-top: 1em; }
div.sd2 { padding-top: 2em; }
div.top-spacing { padding-top: 12px; }
div.lh { padding-inline-start: 0%; padding-inline-end: 0%; padding-top: 12px; text-indent: 3%; }
div.li { padding-inline-start: 20%; text-indent: -15%; }
div.li-v { padding-inline-start: 20%; text-indent: -18%; }
div.li-vv { padding-inline-start: 20%; text-indent: -19%; }
div.li2 { padding-inline-start: 20%; text-indent: -8%; }
div.li2-v { padding-inline-start: 20%; text-indent: -11%; }
div.li2-vv { padding-inline-start: 20%; text-indent: -13%; }
div.li3 { padding-inline-start: 12%; }
div.lf { padding-inline-start: 0%; padding-inline-end: 0%; padding-top: 12px; text-indent: 0; }
span.add { font-style: normal; }
span.bk { font-style: normal; }
span.dc { font-style: normal; }
span.lit { font-weight: bold; }
span.nd { font-variant: small-caps; }
span.ord { font-size: 70%; position: relative; top: -0.4em; }
span.pn { font-style: normal; text-decoration: underline; text-underline-offset: 2px; }
span.png { text-decoration: underline; text-underline-offset: 2px; }
span.qt { font-style: normal; }
span.sig { font-style: normal; }
span.sls { font-style: normal; }
span.tl { font-style: normal; }
span.k { font-weight: bold; }
span.vp { color: var(--VerseNumberColor); font-size: 80%; }
span.wj { color: red; }
span.wg { }
span.wh { }
span.wa { }
span.em { font-style: normal; }
span.bd { font-weight: bold; }
span.it { font-style: normal; }
span.bdit { font-weight: bold; font-style: normal; }
span.ul { text-decoration: underline; text-underline-offset: 2px; }
span.sc { font-variant: small-caps; }
span.no { font-style: normal; font-weight: normal; font-variant: normal; }
span.fr { font-weight: bold; }
span.fk { font-weight: bold; }
span.fq { font-style: normal; }
span.fqa { font-style: normal; }
span.fl { font-style: normal; }
span.fv { color: var(--VerseNumberColor); font-size: 70%; font-style: normal; position: relative; top: -0.4em; }
span.fw { font-style: normal; }
#container.footnote { margin-inline-start: 4%; margin-inline-end: 4%; background-color: var(--FootnoteBackgroundColor); }
span.glossary { }
span.footnote { color: navy; }
span.xo { font-weight: bold; }
span.xk { font-weight: bold; }
span.xta { font-style: normal; }
#container.crossref { margin-inline-start: 4%; margin-inline-end: 4%; background-color: var(--FootnoteBackgroundColor); }
span.image { }
div.image-block { text-align: center; padding-top: 10px; padding-bottom: 10px; }
div.caption { text-align: center; padding-top: 6px; }
span.caption { font-style: normal; font-size: 90%; }
div.video-block { text-align: center; margin-top: 15px; margin-bottom: 20px; background-color: var(--VideoBackgroundColor); margin-inline-start: -5%; margin-inline-end: -5%; }
span.video-title { font-size: 90%; }
div.video-title { text-align: center; padding-top: 0.4em; padding-bottom: 0.4em; }
div.about-image-block { text-align: center; padding-top: 10px; padding-bottom: 10px; }
img.about-image { width: 50%; }
div.is { text-align: center; padding-top: 30px; padding-bottom: 2px; color: var(--TitlesColor); font-weight: bold; font-size: 110%; page-break-after: avoid; }
div.is2 { text-align: center; padding-top: 20px; padding-bottom: 2px; color: var(--TitlesColor); font-weight: bold; font-size: 110%; page-break-after: avoid; }
div.imt { text-align: center; padding-top: 30px; color: var(--TitlesColor); font-weight: bold; font-size: 120%; page-break-after: avoid; }
div.imt2 { text-align: center; padding-top: 20px; color: var(--TitlesColor); font-weight: bold; font-size: 110%; page-break-after: avoid; }
div.imte { text-align: center; color: var(--TitlesColor); font-weight: bold; font-size: 130%; }
div.imte2 { text-align: center; color: var(--TitlesColor); font-weight: bold; font-size: 130%; }
div.iot { text-align: start; color: var(--TitlesColor); font-weight: bold; }
span.ior { font-style: normal; }
div.io { padding-inline-start: 4%; }
div.io2 { padding-inline-start: 6%; }
div.io3 { padding-inline-start: 8%; }
div.iex { padding-top: 12px; font-style: normal; }
div.ip { padding-top: 12px; text-indent: 3%; }
div.ipi { padding-inline-start: 8%; padding-inline-end: 0%; padding-top: 12px; text-indent: 3%; }
div.ipr { padding-top: 12px; text-align: end; }
div.im { padding-top: 12px; text-indent: 0; }
div.ili { padding-top: 8px; padding-inline-start: 20%; text-indent: -15%; }
div.ili2 { padding-top: 8px; padding-inline-start: 20%; text-indent: -8%; }
div.ili3 { padding-top: 8px; padding-inline-start: 12%; }
div.iq { padding-inline-start: 5%; padding-top: 12px; padding-inline-end: 2%; }
div.ib { padding-top: 0px; line-height: 60%; }
div.resource-block { margin-top: 1em; margin-bottom: 1em; }
div.resource-content { padding: 1em 1em 1em 1em; font-size: 90%; background-color: var(--ResourceBackgroundColor); }
div.resource-title { font-size: 90%; font-weight: bold; }
button.resource-collapsible-button { color: var(--ResourceButtonTextColor); background-color: var(--ResourceButtonBackgroundColor); font-size: 90%; font-weight: bold; }
button.resource-collapsible-button:hover { background-color: var(--ResourceButtonHoverColor); }
div.resource-config-heading { font-weight: bold; text-align: center; padding-top: 20px; padding-bottom: 20px; }
div.resource-config-item { padding-top: 10px; }
div.resource-config-checkbox-left { float: inline-start; width: 28px; margin-inline-start: 3px; margin-inline-end: 3px; margin-top: 0px; }
div.resource-config-checkbox-right { float: inline-end; width: 28px; margin-inline-start: 3px; margin-inline-end: 3px; margin-top: 0px; }
.study-bible-block { }
.study-bible-collapsible-button { color: var(--ResourceButtonTextColor); background-color: var(--ResourceButtonBackgroundColor); font-size: 90%; }
.study-bible-collapsible-button:hover { color: var(--ResourceButtonTextColor); background-color: var(--ResourceButtonHoverColor); }
.study-bible-content { background-color: var(--ResourceBackgroundColor); font-size: 90%; }
table { font-size: 90%; }
td.th1 { text-align: start; font-style: normal; }
td.th2 { text-align: start; font-style: normal; }
td.th3 { text-align: start; font-style: normal; }
td.th4 { text-align: start; font-style: normal; }
td.th5 { text-align: start; font-style: normal; }
td.th6 { text-align: start; font-style: normal; }
td.thr1 { text-align: end; font-style: normal; }
td.thr2 { text-align: end; font-style: normal; }
td.thr3 { text-align: end; font-style: normal; }
td.thr4 { text-align: end; font-style: normal; }
td.thr5 { text-align: end; font-style: normal; }
td.thr6 { text-align: end; font-style: normal; }
td.tc1 { text-align: start; }
td.tc2 { text-align: start; }
td.tc3 { text-align: start; }
td.tc4 { text-align: start; }
td.tc5 { text-align: start; }
td.tc6 { text-align: start; }
td.tcr1 { text-align: end; }
td.tcr2 { text-align: end; }
td.tcr3 { text-align: end; }
td.tcr4 { text-align: end; }
td.tcr5 { text-align: end; }
td.tcr6 { text-align: end; }
div.hlp1 { background-color: var(--HighlighterPenYellow); color: var(--HighlighterPenTextColor); }
div.hlp2 { background-color: var(--HighlighterPenGreen); color: var(--HighlighterPenTextColor); }
div.hlp3 { background-color: var(--HighlighterPenBlue); color: var(--HighlighterPenTextColor); }
div.hlp4 { background-color: var(--HighlighterPenOrange); color: var(--HighlighterPenTextColor); }
div.hlp5 { background-color: var(--HighlighterPenPink); color: var(--HighlighterPenTextColor); }
div.selected { border-bottom: 1px dotted; text-decoration: none; }
div.footer { margin-top: 1.5em; padding-top: 12px; padding-bottom: 12px; padding-inline-start: 12px; padding-inline-end: 12px; background-color: var(--FooterBackgroundColor); }
div.footer-line { }
span.footer { font-size: 80%; }
div.footer-pane2 { background-color: var(--FooterPane2BackgroundColor); }
span.ref { color: var(--TitlesColor); font-weight: bold; font-size: 90%; }
span.reflink { white-space: nowrap; }
#container.contents { font-size: 20px; margin-inline-start: 1%; margin-inline-end: 3%; margin-bottom: 60px; background-color: var(--ContentsBackgroundColor); }
div.contents-item-block { position: relative; clear: both; overflow: hidden; margin-top: 6px; margin-bottom: 6px; padding-top: 6px; padding-bottom: 6px; padding-inline-start: 6px; padding-inline-end: 6px; box-shadow: 1px 1px 1px var(--ContentsItemBlockShadowColor); }
div.contents-heading-block { position: relative; clear: both; overflow: hidden; margin-top: 6px; margin-bottom: 3px; padding-top: 6px; padding-bottom: 3px; padding-inline-start: 6px; padding-inline-end: 6px; }
div.contents-text-block { overflow: hidden; }
div.contents-link-ref { background-color: var(--ContentsItemBlockRefColor); }
div.contents-link-screen { background-color: var(--ContentsItemBlockScreenColor); }
a.contents-link :hover { text-decoration: none; background-color: var(--ContentsItemTouchColor); }
div.contents-image-block { box-sizing: border-box; margin-inline-end: 12px; width: 50%; height: auto; float: inline-start; overflow: hidden; }
img.contents-image { width: 100%; height: auto; }
div.contents-title { color: var(--ContentsTitleColor); font-size: 100%; font-weight: bold; }
div.contents-subtitle { color: var(--ContentsSubtitleColor); font-size: 90%; font-weight: normal; }
div.contents-ref { color: var(--ContentsReferenceColor); font-size: 80%; font-style: normal; }
div.contents-heading-title { color: var(--ContentsHeadingTitleColor); font-size: 100%; font-weight: bold; }
div.contents-heading-subtitle { color: var(--ContentsHeadingSubtitleColor); font-size: 90%; font-weight: normal; }
#container.layout { font-size: 18px; margin-inline-start: 1%; margin-inline-end: 3%; background-color: var(--LayoutBackgroundColor); }
div.layout-title { color: var(--LayoutTitleColor); font-size: 90%; font-weight: bold; padding-bottom: 16px; }
div.layout-subtitle { color: var(--LayoutSubtitleColor); font-size: 90%; font-weight: bold; padding-top: 6px; padding-bottom: 6px; padding-inline-start: 12px; margin-top: 20px; margin-bottom: 6px; background-color: var(--LayoutSubtitleBackgroundColor); border-radius: 50px; }
div.layout-subtitle-first { margin-top: 0px; }
div.layout-item-block { clear: both; overflow: hidden; margin-top: 6px; margin-bottom: 6px; padding-top: 12px; padding-bottom: 12px; padding-inline-start: 12px; padding-inline-end: 12px; box-shadow: 1px 1px 1px var(--LayoutItemBlockShadowColor); }
div.layout-item-selected { background-color: var(--LayoutItemSelectedBackgroundColor); }
div.layout-text-block { overflow: hidden; }
div.layout-image-block { box-sizing: border-box; margin-inline-end: 12px; width: 50%; height: auto; float: inline-start; overflow: hidden; }
img.layout-image { width: 100%; height: auto; }
div.layout-item-name { color: var(--LayoutItemNameColor); font-size: 100%; font-weight: bold; }
div.layout-item-description { color: var(--LayoutItemDescriptionColor); font-size: 90%; font-weight: normal; }
div.layout-dropdown-right { float: inline-end; overflow: hidden; width: 28px; margin-inline-start: 3px; margin-inline-end: 3px; margin-top: 0px; }
div.layout-dropdown-left { float: inline-start; overflow: hidden; width: 28px; margin-inline-start: 3px; margin-inline-end: 3px; margin-top: 0px; }
div.verse-block { padding-top: 0.5em; }
div.verse-by-verse-block { padding-inline-start: 5%; padding-bottom: 1em; }
div.verse-by-verse-verse { padding-top: 0.5em; }
div.verse-by-verse-1 { color: var(--VerseByVerseColor1); }
div.verse-by-verse-2 { color: var(--VerseByVerseColor2); }
#container.annotations { margin-top: 6px; margin-bottom: 60px; background-color: var(--BackgroundColor); }
#container.annotation-note { margin-top: 6px; margin-bottom: 6px; background-color: var(--FootnoteBackgroundColor); }
div.annotation-item-block { background-color: var(--AnnotationItemBackgroundColor); box-shadow: 0 1px 2px rgba(0,0,0,0.2); border-radius: 2px; border-bottom: 1px hidden #fff; margin: 0 0 10px 0; padding-top: 8px; padding-bottom: 8px; }
div.annotation-item-color { height: 1.0em; width: 20px; margin-inline-start: 8px; margin-inline-end: 8px; border: 1px solid #C0C0C0; border-radius: 2px; }
div.annotation-item-icon { width: 28px; margin-inline-start: 8px; margin-inline-end: 8px; margin-top: 2px; }
div.annotation-item-menu { height: 40px; width: 20px; margin-inline-start: 8px; margin-inline-end: 8px; }
div.annotation-item-reference { font-family: font1; font-weight: bold; text-align: start; }
div.annotation-item-text { font-family: font1; font-weight: normal; text-align: start; }
div.annotation-item-title { font-family: font1; font-weight: normal; text-align: start; }
div.annotation-item-date { font-weight: normal; font-size: 70%; color: silver; margin-top: 0.5em; margin-inline-start: 8px; margin-inline-end: 8px; }
div.annotation-edit-button { height: 40px; width: 28px; margin-inline-start: 4px; margin-inline-end: 4px; }
img.annotation-note { height: 1.0em; width: 1.0em; vertical-align: middle; }
img.annotation-bookmark { height: 1.0em; width: 1.0em; vertical-align: middle; }
div.annotation-message-none { font-weight: bold; text-align: center; padding-top: 4em; padding-inline-start: 0.5em; padding-inline-end: 0.5em; }
div.annotation-message-none-info { font-weight: normal; text-align: center; padding-top: 1em; padding-inline-start: 0.5em; padding-inline-end: 0.5em; }
#container.history { margin-top: 6px; margin-bottom: 60px; background-color: var(--BackgroundColor); }
div.history-item-block { background-color: var(--HistoryItemBackgroundColor); box-shadow: 0 1px 2px rgba(0,0,0,0.2); border-radius: 6px; border-bottom: 1px hidden #fff; margin: 0 0 10px 0; padding-top: 8px; padding-bottom: 8px; padding-inline-start: 12px; padding-inline-end: 12px; }
div.history-item-book-collection { font-weight: normal; font-size: 80%; }
div.history-item-reference { font-family: font1; font-weight: bold; text-align: start; }
div.history-item-date { font-weight: normal; font-size: 70%; color: silver; margin-top: 0.5em; }
div.history-message-none { font-weight: bold; text-align: center; padding-top: 4em; padding-inline-start: 0.5em; padding-inline-end: 0.5em; }
div.history-message-none-info { font-weight: normal; text-align: center; padding-top: 1em; padding-inline-start: 0.5em; padding-inline-end: 0.5em; }
#container.downloads { margin-inline-start: 3%; margin-inline-end: 3%; margin-bottom: 60px; background-color: var(--BackgroundColor); }
div.download-title { font-weight: bold; padding-top: 6px; padding-bottom: 16px; }
div.download-select-all-items { padding-inline-start: 10px; padding-inline-end: 10px; padding-bottom: 10px; }
div.download-checkbox { width: 28px; margin-inline-start: 3px; margin-inline-end: 3px; margin-top: 0px; }
div.download-item { background-color: var(--DownloadItemBackgroundColor); box-shadow: 0 1px 2px rgba(0,0,0,0.2); border-radius: 2px; border: 2px solid #fff; margin: 0 0 10px 0; padding-top: 8px; padding-bottom: 8px; padding-inline-start: 12px; padding-inline-end: 12px; }
div.download-item-pending { border-color: #cccccc; }
div.download-item-downloading { border-color: #999999; }
div.download-item-selected { background-color: var(--DownloadSelectedBackgroundColor); border-color: var(--DownloadSelectedBackgroundColor); }
div.download-item-name { font-size: 90%; font-weight: bold; }
div.download-item-info { font-size: 70%; }
div.download-item-progress { background-color: var(--DownloadProgressBackgroundColor); }
div.download-item-progress-bar { background-color: var(--DownloadProgressBarColor); }
#container.feed { margin-inline-start: 3%; margin-inline-end: 3%; background-color: var(--BackgroundColor); }
div.feed-item { background-color: var(--DownloadItemBackgroundColor); box-shadow: 0 1px 2px rgba(0,0,0,0.2); border-radius: 2px; border: 2px solid #fff; margin: 0 0 10px 0; padding-top: 8px; padding-bottom: 8px; padding-inline-start: 12px; padding-inline-end: 12px; word-break: break-word; overflow-wrap: break-word; }
div.feed-title { font-weight: bold; padding-top: 6px; padding-bottom: 16px; }
div.feed-description { font-weight: normal; padding-top: 6px; padding-bottom: 16px; }
#container.plan-chooser { margin-inline-start: 3%; margin-inline-end: 3%; margin-bottom: 60px; background-color: var(--PlanBackgroundColor); }
#container.plan-details { margin-inline-start: 5%; margin-inline-end: 5%; background-color: var(--PlanBackgroundColor); }
#container.plan-day { margin-inline-start: 3%; margin-inline-end: 3%; background-color: var(--PlanBackgroundColor); }
div.plan-chooser-plan { clear: both; overflow: hidden; margin-top: 6px; margin-bottom: 6px; padding-top: 6px; padding-bottom: 6px; padding-inline-start: 6px; padding-inline-end: 6px; box-shadow: 1px 1px 1px var(--ContentsItemBlockShadowColor); }
div.plan-image-block { box-sizing: border-box; margin-inline-start: 12px; margin-inline-end: 12px; width: 50%; height: auto; float: inline-start; overflow: hidden; }
img.plan-image { width: 100%; height: auto; }
div.plan-chooser-title { color: var(--ContentsTitleColor); font-size: 100%; font-weight: bold; }
div.plan-chooser-days { color: var(--TextColor); font-size: 100%; font-weight: normal; }
div.plan-title { color: var(--TitlesColor); font-size: 100%; font-weight: bold; margin-top: 20px; }
div.plan-description { color: var(--TextColor); font-size: 90%; padding-top: 16px; padding-bottom: 12px; }
div.plan-state-and-date { color: var(--TitlesColor); font-size: 75%; padding-top: 16px; padding-bottom: 8px; }
a.plan-chooser-link { text-decoration: none; display: block; }
a.plan-chooser-link :hover { text-decoration: none; background-color: var(--PlanItemTouchColor); }
div.plan-items { margin-top: 20px; margin-inline-start: 0.2em; margin-inline-end: 0.2em; }
table.plan-items-table { border-collapse: separate; border-spacing: 6px 6px; }
table.plan-items-table-rtl { margin-inline-start: auto; }
div.plan-item-completed { text-decoration: line-through; }
div.plan-items-empty { margin-top: 50px; text-align: center; }
span.plan-item-reference { color: var(--TextColor); text-decoration: none; }
span.plan-item-notes { color: var(--TextColor); text-decoration: none; }
div.plan-item-heading { margin-top: 10px; margin-bottom: 5px; color: var(--TextColor); text-decoration: none; font-weight: bold; }
td.plan-item-title-rtl { text-align: end; }
td.plan-item-checkbox { vertical-align: middle; }
div.plan-day-box-selected { background-color: var(--PlanBackgroundColor); border-top-color: var(--TextColor); border-left-color: var(--TextColor); border-right-color: var(--TextColor); }
div.plan-day-box-unselected { background-color: var(--PlanDayUnselectedBackgroundColor); border-color: var(--TextColor); }
div.plan-day-box-empty { background-color: var(--PlanDayEmptyBackgroundColor); border-color: var(--TextColor); }
div.plan-day-box-weekday { font-size: 12px; }
div.plan-day-box-number { font-weight: bold; font-size: 20px; }
div.plan-day-box-month { font-size: 12px; }
div.plan-button { font-family: Roboto, Arial, Helvetica; font-weight: 500; letter-spacing: 1.1; color: var(--PlanButtonTextColor); background-color: var(--PlanButtonColor); font-size: 80%; margin-top: 16px; border: none; border-radius: 12px; cursor: pointer; text-align: center; vertical-align: middle; padding-top: 9px; padding-bottom: 9px; padding-inline-start: 12px; padding-inline-end: 12px; box-shadow: 0 0 5px -1px rgba(0,0,0,0.2); text-transform: uppercase; }
#container.plan-config { margin-inline-start: 5%; margin-inline-end: 5%; background-color: var(--PlanBackgroundColor); }
div.plan-config-info { margin-top: 30px; }
div.plan-config-button { margin-top: 12px; }
div.plan-progress-block { margin-top: 16px; margin-bottom: 6px; padding: 12px; background-color: var(--PlanProgressBackgroundColor); position: relative; user-select: none; }
div.plan-progress-title { text-align: center; font-weight: bold; font-size: 110%; padding-bottom: 10px; }
div.plan-progress-info { text-align: center; }
div.plan-progress-reference { text-align: center; }
div.plan-progress-button { font-family: Roboto, Arial, Helvetica; font-weight: 600; letter-spacing: 1.1; color: var(--PlanButtonTextColor); background-color: var(--PlanButtonColor); font-size: 80%; margin-top: 16px; border: none; border-radius: 12px; cursor: pointer; text-align: center; vertical-align: middle; padding-top: 9px; padding-bottom: 9px; padding-inline-start: 12px; padding-inline-end: 12px; box-shadow: 0 0 5px -1px rgba(0,0,0,0.2); text-transform: uppercase; }
#container.plan-setup { margin-inline-start: 5%; margin-inline-end: 5%; background-color: var(--PlanBackgroundColor); }
div.plan-setup-question { font-weight: bold; text-align: center; padding-top: 20px; padding-bottom: 12px; }
div.plan-setup-answer { margin-top: 16px; }
div.plan-setup-answers { margin-bottom: 36px; }
div.plan-setup-answer-radio-left { float: inline-start; width: 28px; margin-inline-start: 3px; margin-inline-end: 3px; margin-top: 0px; }
div.plan-setup-answer-radio-right { float: inline-end; width: 28px; margin-inline-start: 3px; margin-inline-end: 3px; margin-top: 0px; }
div.plan-setup-answer-name { overflow: hidden; }
div.plan-setup-answer-center { text-align: center; }
div.plan-setup-answer-date { font-size: 105%; background-color: var(--PlanDateTimeBackgroundColor); margin-top: 16px; margin-bottom: 20px; display: inline-block; text-align: center; border-radius: 12px; border: 1px; border-style: solid; padding-top: 8px; padding-bottom: 8px; padding-inline-start: 16px; padding-inline-end: 16px; }
div.plan-setup-answer-time { font-size: 140%; background-color: var(--PlanDateTimeBackgroundColor); margin-top: 16px; margin-bottom: 20px; display: inline-block; text-align: center; border-radius: 12px; border: 1px; border-style: solid; padding-top: 8px; padding-bottom: 8px; padding-inline-start: 16px; padding-inline-end: 16px; }
div.plan-setup-title { font-weight: bold; text-align: center; padding-top: 20px; padding-bottom: 12px; }
div.plan-setup-message { text-align: center; margin-top: 16px; margin-bottom: 50px; }
#container.search-results { margin-top: 6px; margin-bottom: 6px; background-color: var(--BackgroundColor); }
div.search-result-block { background-color: var(--AnnotationItemBackgroundColor); box-shadow: 0 1px 2px rgba(0,0,0,0.2); border-radius: 2px; border-bottom: 1px hidden #fff; margin: 0 0 10px 0; padding-top: 8px; padding-bottom: 8px; padding-inline-start: 8px; padding-inline-end: 8px; }
div.search-result-reference { font-family: font1; font-weight: bold; text-align: start; color: var(--TitlesColor); }
div.search-result-context { font-family: font1; font-weight: normal; text-align: start; }
#container.quiz { margin-top: 6px; margin-bottom: 60px; margin-inline-start: 2%; margin-inline-end: 2%; background-color: var(--BackgroundColor); }
div.quiz-question-number { text-align: center; margin-top: 0.5em; font-size: 150%; font-weight: bold; }
div.quiz-question { text-align: center; font-weight: bold; padding-top: 12px; padding-bottom: 12px; }
img.quiz-question-image { display: block; margin: auto; margin-top: 10px; margin-bottom: 10px; }
div.quiz-answer { text-align: center; margin-top: 6px; padding-inline-start: 0.5em; padding-inline-end: 0.5em; padding-top: 12px; padding-bottom: 12px; font-size: 100%; border: 0px; border-style: solid; border-radius: 50px; color: var(--QuizAnswerTextColor); background-color: var(--QuizAnswerBackgroundColor); }
div.quiz-answer-explanation { text-align: center; margin-top: 12px; font-size: 80%; font-weight: normal; }
div.quiz-score-block { text-align: center; margin-top: 60px; margin-bottom: 60px; }
span.quiz-score { text-align: center; font-size: 400%; font-weight: bold; padding: 12px; padding-inline-start: 0.5em; padding-inline-end: 0.5em; border: 0px; border-style: solid; border-radius: 50px; color: var(--QuizAnswerTextColor); background-color: var(--QuizAnswerBackgroundColor); }
div.quiz-score-before { text-align: center; font-weight: bold; padding-top: 12px; padding-bottom: 12px; margin-top: 20px; }
div.quiz-score-after { text-align: center; font-weight: bold; padding-top: 12px; padding-bottom: 12px; margin-top: 10px; }
div.quiz-score-commentary { text-align: center; font-weight: bold; padding-top: 12px; padding-bottom: 12px; margin-top: 10px; }
div.quiz-keypad-title { text-align: center; font-size: 120%; font-weight: bold; padding-top: 30px; padding-bottom: 20px; }
div.quiz-keypad-message { text-align: center; font-size: 100%; padding-top: 20px; padding-bottom: 20px; padding-inline-start: 5px; padding-inline-end: 5px; }
div.quiz-locked-title { text-align: center; font-size: 120%; font-weight: bold; padding-top: 30px; padding-bottom: 20px; }
div.quiz-locked-message { text-align: center; font-size: 100%; padding-top: 20px; padding-bottom: 24px; padding-inline-start: 5px; padding-inline-end: 5px; }
div.quiz-locked-name { text-align: center; font-size: 100%; font-weight: bold; padding-top: 6px; padding-bottom: 6px; padding-inline-start: 5px; padding-inline-end: 5px; }
#container.assistant-tasks { margin-inline-start: 5%; margin-inline-end: 5%; margin-top: 20px; margin-bottom: 80px; background-color: var(--AssistantBackgroundColor); }
#container.assistant-response { margin-inline-start: 5%; margin-inline-end: 5%; margin-top: 20px; margin-bottom: 80px; background-color: var(--AssistantBackgroundColor); }
div.assistant-reference { font-size: 100%; font-weight: bold; margin-top: 16px; margin-bottom: 12px; text-align: center; }
div.assistant-heading { font-size: 110%; font-weight: bold; margin-top: 16px; margin-bottom: 12px; text-align: center; }
div.assistant-message { font-size: 100%; margin-top: 60px; margin-bottom: 20px; text-align: center; }
div.assistant-task { margin-top: 24px; border: none; border-radius: 12px; cursor: pointer; text-align: center; vertical-align: middle; padding-top: 9px; padding-bottom: 9px; padding-inline-start: 12px; padding-inline-end: 12px; box-shadow: 0 0 5px -1px rgba(0,0,0,0.2); }
div.assistant-task-color-1 { color: var(--AssistantTaskColor1); background-color: var(--AssistantTaskBackgroundColor1); }
div.assistant-task-color-2 { color: var(--AssistantTaskColor2); background-color: var(--AssistantTaskBackgroundColor2); }
div.assistant-task-color-3 { color: var(--AssistantTaskColor3); background-color: var(--AssistantTaskBackgroundColor3); }
div.assistant-task-color-4 { color: var(--AssistantTaskColor4); background-color: var(--AssistantTaskBackgroundColor4); }
div.assistant-response { margin-top: 24px; margin-bottom: 24px; display: inline-block; }
div.assistant-response-p { padding-top: 10px; }
div.assistant-response-h1 { font-size: 110%; font-weight: bold; padding-top: 10px; }
div.assistant-response-h2 { font-size: 105%; font-weight: bold; padding-top: 10px; }
div.assistant-response-h3 { font-size: 100%; font-weight: bold; padding-top: 10px; }
div.assistant-response-h4 { font-size: 100%; font-weight: bold; padding-top: 10px; }
div.assistant-response-bq { font-size: 100%; font-weight: normal; padding-inline-start: 1em; }
div.assistant-footer { font-size: 90%; margin-top: 1.5em; padding-top: 12px; padding-bottom: 12px; padding-inline-start: 12px; padding-inline-end: 12px; background-color: var(--FooterBackgroundColor); }
div.assistant-button { font-family: Roboto, Arial, Helvetica; font-weight: 500; letter-spacing: 1.1; color: var(--AssistantButtonTextColor); background-color: var(--AssistantButtonColor); font-size: 80%; margin-top: 16px; border: none; border-radius: 12px; cursor: pointer; text-align: center; vertical-align: middle; padding-top: 9px; padding-bottom: 9px; padding-inline-start: 12px; padding-inline-end: 12px; box-shadow: 0 0 5px -1px rgba(0,0,0,0.2); text-transform: uppercase; }
#container.settings { margin-top: 6px; margin-bottom: 60px; margin-inline-start: 0; margin-inline-end: 0; background-color: var(--BackgroundColor); font-size: 16px; }
#container.settings-list { margin-top: 6px; margin-bottom: 6px; margin-inline-start: 3px; margin-inline-end: 3px; background-color: var(--DialogBackgroundColor); font-size: 16px; }
div.settings-category { color: var(--TitlesColor); font-weight: bold; margin-top: 12px; margin-inline-start: 6px; margin-inline-end: 6px; }
div.settings-item { padding: 16px; }
div.settings-separator { border-top: 1px solid var(--SettingsSeparatorColor); }
div.settings-title { color: var(--SettingsTitleColor); }
div.settings-summary { color: var(--SettingsSummaryColor); font-size: 90%; margin-top: 2px; }
div.settings-checkbox-right { float: inline-end; overflow: hidden; width: 28px; margin-inline-start: 3px; margin-inline-end: 3px; margin-top: 0px; }
div.settings-checkbox-left { float: inline-start; overflow: hidden; width: 28px; margin-inline-start: 3px; margin-inline-end: 3px; margin-top: 0px; }
div.settings-list-title { color: var(--TitlesColor); font-size: 20px; font-weight: bold; margin-top: 12px; margin-bottom: 16px; }
div.settings-list-entry { margin-top: 16px; margin-bottom: 16px; }
div.settings-list-entry-name { color: var(--SettingsTitleColor); overflow: hidden; font-size: 18px; margin-top: 6px; }
div.settings-radio-left { float: inline-start; width: 28px; margin-inline-start: 3px; margin-inline-end: 3px; margin-top: 0px; }
div.settings-radio-right { float: inline-end; width: 28px; margin-inline-start: 3px; margin-inline-end: 3px; margin-top: 0px; }
#container.message { margin: 0; background-color: var(--DialogBackgroundColor); font-size: 16px; }
div.message-title { padding-inline-start: 20px; padding-inline-end: 20px; padding-bottom: 8px; color: var(--TitlesColor); font-weight: bold; font-size: 125%; }
div.message-text { padding-inline-start: 20px; padding-inline-end: 20px; color: var(--TextColor); font-size: 100%; }
div.message-checkbox { padding-inline-start: 20px; padding-inline-end: 20px; padding-top: 24px; padding-bottom: 12px; }
div.message-checkbox-caption { color: var(--TextColor); font-size: 100%; overflow: hidden; }
div.message-checkbox-left { float: inline-start; overflow: hidden; width: 28px; margin-inline-start: 1px; margin-inline-end: 3px; margin-top: 0px; }
div.message-checkbox-right { float: inline-end; overflow: hidden; width: 28px; margin-inline-start: 3px; margin-inline-end: 1px; margin-top: 0px; }
div.message-footer { position: absolute; bottom: 0; margin: 0; min-height: 52px; width: 100%; }
button.message-button { color: var(--TitlesColor); background-color: transparent; font-weight: bold; letter-spacing: .08929em; text-transform: uppercase; height: 36px; min-width: 64px; vertical-align: middle; border: none; outline: none; padding: 0 16px; }
ui.user-account.background { background-color: var(--BackgroundColor); }
ui.user-account.title { color: var(--TitlesColor); }
ui.user-account.text { color: var(--TextColor); }
ui.user-account.hint { color: var(--HintColor); }
ui.user-account.button.major { color: var(--ShareButtonTextColor); background-color: var(--ShareButtonColor); text-transform: uppercase; }
ui.user-account.button.minor { color: var(--TextColor); }
img { max-width: 100%; }
.txs { display: inline; }
* { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
.icon-launch { height: 40px; width: 28px; margin-inline-start: 2px; margin-inline-end: 2px; }
.float-left { float: inline-start; overflow:hidden; }
.float-right { float: inline-end; overflow:hidden; }
.plan-close-icon { height:30px; width:18px; margin-inline-start:2px; margin-inline-end:2px; }
.icon-left { position: absolute; left:6px; }
.icon-right { position: absolute; right:6px; }

.video-container { position:relative; height:0; overflow:hidden; background-size:contain; background-repeat:no-repeat; background-position:center; }
.video-16-9 { padding-bottom:56.25%; }
.video-youtube { padding-top:0px; }
.video-vimeo { padding-top:0px; }
.video-jesus { padding-top:0px; padding-bottom: calc(56.25% + 16px); background-position: 8px 8px; background-size: calc(100% - 16px);}
.video-jesus-no-calc { padding-top:0px; padding-bottom: 59%; background-position: 8px 8px; background-size: 95%;}
.video-container iframe, .video-container object, .video-container embed { position:absolute; top:0; left:0; width:100%; height:100%; }
.video-container video { position:absolute; top:0; left:0; width:100%; height:100%; }
.video-container img { max-height:100%; max-width:100%; width:18%; height:auto; position:absolute; top:0; bottom:0; left:0; right:0; margin:auto; opacity:0.8; }

@media (min-width: 500px) {
    div.video-block {
        max-width: 480px;
        margin-inline-start: auto;
        margin-inline-end: auto;
    }
}
span.footnote > a:link { text-decoration: none; }
.collapsible-button { cursor: pointer; padding: 10px; width: 100%; border: none; text-align: start; outline: none; }
.collapsible-button:after { content: '\002B'; color: white; font-weight: bold; float: inline-end; margin-inline-start: 5px; }
.active:after { content: '\2212'; }
.collapsible-element { padding: 0; max-height: 0; overflow: hidden; transition: max-height 0.2s ease-out; }
#container[data-color-theme="Dark"] {

--PrimaryColor: #181818;
--PrimaryDarkColor: #121212;
--AccentColor: #121212;
--ActionBarColor: PrimaryColor;
--TextColor: #E0E0E0;
--TitlesColor: #E0E0E0;
--VerseNumberColor: #B2DFDB;
--TextHighlightColor: #ded8d8;
--LinkColor: #B2DFDB;
--HintColor: #A0A0A0;
--BackgroundColor: #000000;
--DialogBackgroundColor: #303030;
--FootnoteBackgroundColor: #1A1A1A;
--PopupBackgroundColor: #202020;
--FooterBackgroundColor: #252525;
--FooterPane2BackgroundColor: #252525;
--AnnotationItemBackgroundColor: #202020;
--HistoryItemBackgroundColor: #202020;
--DividerColor: #404040;
--ImageTabsBackgroundColor: #303030;
--BookTabsBackgroundColor: #1A1A1A;
--BookTabsIconColor: #E0E0E0;
--BookTabsTextColor: #E0E0E0;
--SliderBarColor: #FFFFFF;
--SliderProgressColor: #E0E0E0;
--DialogButtonColor: #E0E0E0;
--ShareButtonColor: PrimaryColor;
--ShareButtonTextColor: #FFFFFF;
--Pane1BackgroundColor: #000000;
--Pane2BackgroundColor: #101010;
--Pane1NameTextColor: #707070;
--Pane2NameTextColor: #707070;
--PaneSeparatorColor: #505050;
--PaneSeparatorHandleColor: #909090;
--PaneSeparatorHandleGripColor: #040404;
--PaneNameBorderColor: #707070;
--LayoutBackgroundColor: #000000;
--LayoutTitleColor: #E0E0E0;
--LayoutSubtitleColor: #E0E0E0;
--LayoutSubtitleBackgroundColor: #252525;
--LayoutItemNameColor: #E0E0E0;
--LayoutItemDescriptionColor: #E0E0E0;
--LayoutItemBlockShadowColor: #101010;
--LayoutItemSelectedBackgroundColor: #252525;
--ChapterButtonColor: #303030;
--ChapterButtonTextColor: #E0E0E0;
--ChapterButtonIntroColor: #383838;
--BookListDefaultColor: #101010;
--BookButtonDefaultColor: #202020;
--BookButtonTextColor: #E0E0E0;
--ButtonSelectedColor: #101010;
--Primary3Color: #101010;
--DrawerBackgroundColor: #101010;
--DrawerItemTextColor: #D0D0D0;
--DrawerItemIconColor: #C0C0C0;
--BottomNavigationBackgroundColor: #242424;
--BottomNavigationItemIconColor: #C0C0C0;
--BottomNavigationSelectedItemIconColor: #E0E0E0;
--BottomNavigationItemTextColor: #D0D0D0;
--BottomNavigationSelectedItemTextColor: #E0E0E0;
--SearchTextColor: #E0E0E0;
--SearchButtonColor: #505050;
--SearchButtonTextColor: #FFFFFF;
--SearchProgressButtonColor: #A0A0A0;
--SearchProgressButtonTextColor: #FFFFFF;
--SettingsTitleColor: #E0E0E0;
--SettingsSummaryColor: #B0B0B0;
--SettingsSeparatorColor: #404040;
--HighlighterPenYellow: #FFFFCC;
--HighlighterPenGreen: #D6FFEA;
--HighlighterPenBlue: #B8FBF9;
--HighlighterPenOrange: #FFE6BC;
--HighlighterPenPink: #FFD6FF;
--HighlighterPenTextColor: #000000;
--AudioBarColor: #242424;
--AudioBarIconColor: #C0C0C0;
--AudioBarPlayIconColor: #C0C0C0;
--ToolbarShadowColor: #404040;
--QuizAnswerBackgroundColor: #303030;
--QuizAnswerHighlightBackgroundColor: #202020;
--QuizAnswerTextColor: #E0E0E0;
--QuizRightAnswerBackgroundColor: #008000;
--QuizRightAnswerTextColor: #FFFFFF;
--QuizWrongAnswerBackgroundColor: #C11B17;
--QuizWrongAnswerTextColor: #FFFFFF;
--VideoBackgroundColor: #303030;
--TextSelectionBarColor: #242424;
--TextSelectionBarIconColor: #C0C0C0;
--ContentsBackgroundColor: #000000;
--ContentsItemBlockRefColor: #202020;
--ContentsItemBlockScreenColor: #202020;
--ContentsItemBlockShadowColor: #101010;
--ContentsItemTouchColor: #151515;
--ContentsTitleColor: #E0E0E0;
--ContentsSubtitleColor: #E0E0E0;
--ContentsReferenceColor: #E0E0E0;
--ContentsHeadingTitleColor: #E0E0E0;
--ContentsHeadingSubtitleColor: #E0E0E0;
--DownloadItemBackgroundColor: #202020;
--DownloadSelectedBackgroundColor: #404040;
--DownloadProgressBarColor: #FEFEFE;
--DownloadProgressBackgroundColor: #303030;
--PlanBackgroundColor: #000000;
--PlanButtonColor: #303030;
--PlanButtonTextColor: #E0E0E0;
--PlanTabsBackgroundColor: #1A1A1A;
--PlanTabsIconColor: #E0E0E0;
--PlanTabsTextColor: #E0E0E0;
--PlanDayUnselectedBackgroundColor: #1A1A1A;
--PlanDayEmptyBackgroundColor: #101010;
--PlanItemTouchColor: #151515;
--PlanProgressBackgroundColor: #252525;
--PlanDateTimeBackgroundColor: #1A1A1A;
--ResourceBackgroundColor: #202020;
--ResourceButtonBackgroundColor: #202020;
--ResourceButtonTextColor: #FFFFFF;
--ResourceButtonHoverColor: #202020;
--VerseByVerseColor1: #E0FFFF;
--VerseByVerseColor2: #FFB6C1;
--AssistantBackgroundColor: #000000;
--AssistantButtonColor: #303030;
--AssistantButtonTextColor: #E0E0E0;
--AssistantTaskColor1: #000000;
--AssistantTaskColor2: #000000;
--AssistantTaskColor3: #000000;
--AssistantTaskColor4: #000000;
--AssistantTaskBackgroundColor1: #D7E8FA;
--AssistantTaskBackgroundColor2: #E3F4E1;
--AssistantTaskBackgroundColor3: #FADDE1;
--AssistantTaskBackgroundColor4: #FFF9C4;
--CustomColor1: #FF0000;
--CustomColor2: #00FF00;
--CustomColor3: #0000FF;
--CustomColor4: #00FFFF;
--CustomColor5: #FFFF00;
}
#container[data-color-theme="Sepia"] {

--PrimaryColor: #4E342E;
--PrimaryDarkColor: #3E2723;
--AccentColor: #3E2723;
--ActionBarColor: PrimaryColor;
--TextColor: #5A4129;
--TitlesColor: #513A24;
--VerseNumberColor: #8D6E63;
--TextHighlightColor: #f6f6ea;
--LinkColor: #513A24;
--HintColor: #513A24;
--BackgroundColor: #E9D8BA;
--DialogBackgroundColor: #E9D8BA;
--FootnoteBackgroundColor: #E9D8BA;
--PopupBackgroundColor: #E9D8BA;
--FooterBackgroundColor: #DCCBAD;
--FooterPane2BackgroundColor: #D9C6A5;
--AnnotationItemBackgroundColor: #ECDDC4;
--HistoryItemBackgroundColor: #ECDDC4;
--DividerColor: #D1C3A8;
--ImageTabsBackgroundColor: #E9D8BA;
--BookTabsBackgroundColor: #E3CDA7;
--BookTabsIconColor: #513A24;
--BookTabsTextColor: #513A24;
--SliderBarColor: #D1C3A8;
--SliderProgressColor: #8D6E63;
--DialogButtonColor: PrimaryColor;
--ShareButtonColor: PrimaryColor;
--ShareButtonTextColor: #FFFFFF;
--Pane1BackgroundColor: #E9D8BA;
--Pane2BackgroundColor: #E6D3B2;
--Pane1NameTextColor: #AA796E;
--Pane2NameTextColor: #AA796E;
--PaneSeparatorColor: #AA796E;
--PaneSeparatorHandleColor: #AA796E;
--PaneSeparatorHandleGripColor: #D9C4BF;
--PaneNameBorderColor: #AA796E;
--LayoutBackgroundColor: #E9D8BA;
--LayoutTitleColor: #513A24;
--LayoutSubtitleColor: #513A24;
--LayoutSubtitleBackgroundColor: #DCCBAD;
--LayoutItemNameColor: #513A24;
--LayoutItemDescriptionColor: #5A4129;
--LayoutItemBlockShadowColor: #DCCBAD;
--LayoutItemSelectedBackgroundColor: #DCCBAD;
--ChapterButtonColor: #D7CCC8;
--ChapterButtonTextColor: #000000;
--ChapterButtonIntroColor: #EFEBE9;
--BookListDefaultColor: #DED4C1;
--BookButtonDefaultColor: #D7CCC8;
--BookButtonTextColor: #000000;
--Primary3Color:#101010;
--ButtonSelectedColor: #BCAAA4;
--DrawerBackgroundColor: #E9D8BA;
--DrawerItemTextColor: #212121;
--DrawerItemIconColor: #757575;
--BottomNavigationBackgroundColor: #ECDDC4;
--BottomNavigationItemIconColor: #757575;
--BottomNavigationSelectedItemIconColor: #151515;
--BottomNavigationItemTextColor: #212121;
--BottomNavigationSelectedItemTextColor: #151515;
--SearchTextColor: #000000;
--SearchButtonColor: #505050;
--SearchButtonTextColor: #FFFFFF;
--SearchProgressButtonColor: #A0A0A0;
--SearchProgressButtonTextColor: #FFFFFF;
--SettingsTitleColor: #000000;
--SettingsSummaryColor: #606060;
--SettingsSeparatorColor: #C9C2C0;
--HighlighterPenYellow: #FFFFCC;
--HighlighterPenGreen: #D6FFEA;
--HighlighterPenBlue: #B8FBF9;
--HighlighterPenOrange: #FFE6BC;
--HighlighterPenPink: #FFD6FF;
--HighlighterPenTextColor: #5A4129;
--AudioBarColor: #ECDDC4;
--AudioBarIconColor: #757575;
--AudioBarPlayIconColor: #757575;
--ToolbarShadowColor: #D0B294;
--QuizAnswerBackgroundColor: #D7CCC8;
--QuizAnswerHighlightBackgroundColor: #D3C6C1;
--QuizAnswerTextColor: #000000;
--QuizRightAnswerBackgroundColor: #008000;
--QuizRightAnswerTextColor: #FFFFFF;
--QuizWrongAnswerBackgroundColor: #C11B17;
--QuizWrongAnswerTextColor: #FFFFFF;
--VideoBackgroundColor: #E0E0E0;
--TextSelectionBarColor: #ECDDC4;
--TextSelectionBarIconColor: #757575;
--ContentsBackgroundColor: #E9D8BA;
--ContentsItemBlockRefColor: #F2E9D8;
--ContentsItemBlockScreenColor: #F2E9D8;
--ContentsItemBlockShadowColor: #E0E0E0;
--ContentsItemTouchColor: #EEEEEE;
--ContentsTitleColor: #513A24;
--ContentsSubtitleColor: #5A4129;
--ContentsReferenceColor: #5A4129;
--ContentsHeadingTitleColor: #5A4129;
--ContentsHeadingSubtitleColor: #5A4129;
--DownloadItemBackgroundColor: #ECDDC4;
--DownloadSelectedBackgroundColor: #DCCBAD;
--DownloadProgressBarColor: #4E342E;
--DownloadProgressBackgroundColor: #F3F3F3;
--PlanBackgroundColor: #E9D8BA;
--PlanButtonColor: #D7CCC8;
--PlanButtonTextColor: #000000;
--PlanTabsBackgroundColor: #E3CDA7;
--PlanTabsIconColor: #513A24;
--PlanTabsTextColor: #513A24;
--PlanDayUnselectedBackgroundColor: #E3CDA7;
--PlanDayEmptyBackgroundColor: #B48B6A;
--PlanItemTouchColor: #E5E5E5;
--PlanProgressBackgroundColor: #E3CDA7;
--PlanDateTimeBackgroundColor: #E3CDA7;
--ResourceBackgroundColor: #DECDB0;
--ResourceButtonBackgroundColor: #DECDB0;
--ResourceButtonTextColor: #E9D8BA;
--ResourceButtonHoverColor: #DECDB0;
--VerseByVerseColor1: #000080;
--VerseByVerseColor2: #8B008B;
--AssistantBackgroundColor: #E9D8BA;
--AssistantButtonColor: #D7CCC8;
--AssistantButtonTextColor: #000000;
--AssistantTaskColor1: #000000;
--AssistantTaskColor2: #000000;
--AssistantTaskColor3: #000000;
--AssistantTaskColor4: #000000;
--AssistantTaskBackgroundColor1: #D7E8FA;
--AssistantTaskBackgroundColor2: #E3F4E1;
--AssistantTaskBackgroundColor3: #FADDE1;
--AssistantTaskBackgroundColor4: #FFF9C4;
--CustomColor1: #FF0000;
--CustomColor2: #00FF00;
--CustomColor3: #0000FF;
--CustomColor4: #00FFFF;
--CustomColor5: #FFFF00;
}
#container[data-color-theme="Normal"] {

--PrimaryColor: #009688;
--PrimaryDarkColor: #00796B;
--AccentColor: #FF5722;
--ActionBarColor: PrimaryColor;
--TextColor: #000000;
--TitlesColor: #004D40;
--VerseNumberColor: #00796B;
--TextHighlightColor: #d2eae8;
--LinkColor: #004D40;
--HintColor: #101010;
--BackgroundColor: #FFFFFF;
--DialogBackgroundColor: #F0F0F0;
--FootnoteBackgroundColor: #E0E0E0;
--PopupBackgroundColor: #E6E6E6;
--FooterBackgroundColor: #E0E0E0;
--FooterPane2BackgroundColor: #D0D0D0;
--AnnotationItemBackgroundColor: #FFFFFF;
--HistoryItemBackgroundColor: #FFFFFF;
--DividerColor: #D0D0D0;
--ImageTabsBackgroundColor: #FFFFFF;
--BookTabsBackgroundColor: #E0E0E0;
--BookTabsIconColor: PrimaryColor;
--BookTabsTextColor: PrimaryColor;
--SliderBarColor: #D3D3D3;
--SliderProgressColor: #4DB6AC;
--DialogButtonColor: PrimaryColor;
--ShareButtonColor: PrimaryColor;
--ShareButtonTextColor: #FFFFFF;
--Pane1BackgroundColor: #F0F0F0;
--Pane2BackgroundColor: #E0E0E0;
--Pane1NameTextColor: #909090;
--Pane2NameTextColor: #909090;
--PaneSeparatorColor: #D0D0D0;
--PaneSeparatorHandleColor: #C0C0C0;
--PaneSeparatorHandleGripColor: #F0F0F0;
--PaneNameBorderColor: #D3D3D3;
--LayoutBackgroundColor: #F4F4F4;
--LayoutTitleColor: #004D40;
--LayoutSubtitleColor: #000000;
--LayoutSubtitleBackgroundColor: #E5E5E5;
--LayoutItemNameColor: #000000;
--LayoutItemDescriptionColor: #000000;
--LayoutItemBlockShadowColor: #E0E0E0;
--LayoutItemSelectedBackgroundColor: #B2DFDB;
--ChapterButtonColor: #B2DFDB;
--ChapterButtonTextColor: #000000;
--ChapterButtonIntroColor: #C9E8E6;
--BookListDefaultColor: #E8E8E8;
--BookButtonDefaultColor: #B2DFDB;
--BookButtonTextColor: #000000;
--ButtonSelectedColor: #80CBC4;
--Primary3Color:#abd8d4;
--DrawerBackgroundColor: #FFFFFF;
--DrawerItemTextColor: #212121;
--DrawerItemIconColor: #757575;
--BottomNavigationBackgroundColor: #FFFFFF;
--BottomNavigationItemIconColor: #757575;
--BottomNavigationSelectedItemIconColor: #009688;
--BottomNavigationItemTextColor: #212121;
--BottomNavigationSelectedItemTextColor: #009688;
--SearchTextColor: #000000;
--SearchButtonColor: #505050;
--SearchButtonTextColor: #FFFFFF;
--SearchProgressButtonColor: #A0A0A0;
--SearchProgressButtonTextColor: #FFFFFF;
--SettingsTitleColor: #000000;
--SettingsSummaryColor: #606060;
--SettingsSeparatorColor: #E0E0E0;
--HighlighterPenYellow: #FFFFCC;
--HighlighterPenGreen: #D6FFEA;
--HighlighterPenBlue: #B8FBF9;
--HighlighterPenOrange: #FFE6BC;
--HighlighterPenPink: #FFD6FF;
--HighlighterPenTextColor: #000000;
--AudioBarColor: #FFFFFF;
--AudioBarIconColor: #757575;
--AudioBarPlayIconColor: #757575;
--ToolbarShadowColor: #D0D0D0;
--QuizAnswerBackgroundColor: #B2DFDB;
--QuizAnswerHighlightBackgroundColor: #4DB6AC;
--QuizAnswerTextColor: #000000;
--QuizRightAnswerBackgroundColor: #008000;
--QuizRightAnswerTextColor: #FFFFFF;
--QuizWrongAnswerBackgroundColor: #C11B17;
--QuizWrongAnswerTextColor: #FFFFFF;
--VideoBackgroundColor: #E0E0E0;
--TextSelectionBarColor: #FFFFFF;
--TextSelectionBarIconColor: #757575;
--ContentsBackgroundColor: #F4F4F4;
--ContentsItemBlockRefColor: #FFFFFF;
--ContentsItemBlockScreenColor: #FDFDFD;
--ContentsItemBlockShadowColor: #E0E0E0;
--ContentsItemTouchColor: #EEEEEE;
--ContentsTitleColor: #004D40;
--ContentsSubtitleColor: #000000;
--ContentsReferenceColor: #000000;
--ContentsHeadingTitleColor: #000000;
--ContentsHeadingSubtitleColor: #000000;
--DownloadItemBackgroundColor: #FFFFFF;
--DownloadSelectedBackgroundColor: #E0E0E0;
--DownloadProgressBarColor: #009688;
--DownloadProgressBackgroundColor: #F3F3F3;
--PlanBackgroundColor: #F0F0F0;
--PlanButtonColor: #B2DFDB;
--PlanButtonTextColor: #000000;
--PlanTabsBackgroundColor: #E0E0E0;
--PlanTabsIconColor: PrimaryColor;
--PlanTabsTextColor: PrimaryColor;
--PlanDayUnselectedBackgroundColor: #E0E0E0;
--PlanDayEmptyBackgroundColor: #C0C0C0;
--PlanItemTouchColor: #E5E5E5;
--PlanProgressBackgroundColor: #E0E0E0;
--PlanDateTimeBackgroundColor: #E0E0E0;
--ResourceBackgroundColor: #C9E8E6;
--ResourceButtonBackgroundColor: #00695C;
--ResourceButtonTextColor: #FFFFFF;
--ResourceButtonHoverColor: #00796B;
--VerseByVerseColor1: #000080;
--VerseByVerseColor2: #8B008B;
--AssistantBackgroundColor: #F0F0F0;
--AssistantButtonColor: #DDDDDD;
--AssistantButtonTextColor: #000000;
--AssistantTaskColor1: #000000;
--AssistantTaskColor2: #000000;
--AssistantTaskColor3: #000000;
--AssistantTaskColor4: #000000;
--AssistantTaskBackgroundColor1: #D7E8FA;
--AssistantTaskBackgroundColor2: #E3F4E1;
--AssistantTaskBackgroundColor3: #FADDE1;
--AssistantTaskBackgroundColor4: #FFF9C4;
--CustomColor1: #FF0000;
--CustomColor2: #00FF00;
--CustomColor3: #0000FF;
--CustomColor4: #00FFFF;
--CustomColor5: #FFFF00;
}