/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
:root {
    --breadcrumb-divider: "»";
}

/*----------------
   sabon next
------------------*/
@font-face {
    font-family: 'SabonNext';
    /*font-family: 'sabon_next_lt_pro';*/
    src: url('/static/fonts/woff-sabonnext/SabonNextLTPro-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'SabonNext';
    /*font-family: 'sabon_next_lt_pro';*/
    src: url('/static/fonts/woff-sabonnext/SabonNextLTPro-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'SabonNext';
    /*font-family: 'sabon_next_lt_pro';*/
    src: url('/static/fonts/woff-sabonnext/SabonNextLTPro-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'SabonNext';
    /*font-family: 'sabon_next_lt_pro';*/
    src: url('/static/fonts/woff-sabonnext/SabonNextLTPro-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
}
@font-face {
    font-family: 'SabonNext_DP';
    /*font-family: 'sabon_next_lt_pro';*/
    src: url('/static/fonts/woff-sabonnext/SabonNextLTPro-Display.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'SabonNext_DP';
    /*font-family: 'sabon_next_lt_pro';*/
    src: url('/static/fonts/woff-sabonnext/SabonNextLTPro-DisplayIt.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}
/*----------------
  stone sans
------------------*/
@font-face {
    font-family: 'StoneSans';
    /*font-family: 'stone_sans_stdregular';*/
    src: url('/static/fonts/woff-stonesans/StoneSansStd-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'StoneSans';
    /*font-family: 'stone_sans_stdregular_italic';*/
    src: url('/static/fonts/woff-stonesans/StoneSansStd-RegularItalic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'StoneSans';
    /*font-family: 'stone_sans_stdbold';*/
    src: url('/static/fonts/woff-stonesans/StoneSansStd-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'StoneSans';
    /*font-family: 'stone_sans_stdbold_italic';*/
    src: url('/static/fonts/woff-stonesans/StoneSansStd-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
}
@font-face {
    font-family: 'StoneSans_SC';
    src: url('/static/fonts/woff-stonesans/StoneSansStdRegularSC.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
/*-----------------
   Norasi
-------------------*/
@font-face {
    font-family: 'Norasi';
    src: url('/static/fonts/woff-norasi/Norasi.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Norasi';
    src: url('/static/fonts/woff-norasi/Norasi-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Norasi';
    src: url('/static/fonts/woff-norasi/Norasi-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'Norasi';
    src: url('/static/fonts/woff-norasi/Norasi-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
}
/*-----------------
   FF Meta
-------------------*/
@font-face {
    font-family: 'FFMeta';
    src: url('/static/fonts/bookfonts/FFMetaPro-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'FFMetaSerif';
    src: url('/static/fonts/bookfonts/FFMetaSerifPro-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'FFMetaSerif';
    src: url('/static/fonts/bookfonts/FFMetaSerifPro-BookItalic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'FFMetaSerif';
    src: url('/static/fonts/bookfonts/FFMetaSerifPro-BookBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}
/*------
 Layout
------*/
#content {
    margin-block: 1rem 3rem;
}

@media (min-width: 576px) {
    #content {
        margin-top: 2rem;
    }
}

#welcome p, #welcome ul p, .archive p, .fullarchive p,/*.suttatoc li,*/
#new_index dd,
div.ebookItem,
div.full,
div.justli li,
li.faq_a,
ul.red {
    text-align: justify;
}
.archive {
    flex: 1;
    min-width: 0;
}
.archive h1, .archive h4, .archive .full {
    margin-left: 0;
    padding-left: 0;
}
.fullarchive {
    margin: 0 0 0 -4%;
}
.single {
    margin: 0 18% auto;
}
.full {
    text-indent: 0;
    margin: 1px auto;
    padding: 0 2% 0 8%;
    /*border:1px solid #ddd;*/
}
.full+.full {
    padding-top: 5% !important;
    /*border:1px solid #ddd;*/
}
.archive p.podcast {
    margin-left: 6%;
    /*border:1px solid #ddd;*/
}

/*------
sidebars
------*/

.sidebar_left {
    font-family: StoneSans, sans-serif;
    font-size: 11pt;

    position: sticky;
    top: 2.25rem;
    float: left;
    line-height: 175%;
    margin-top: -1rem;
    margin-left: -1rem;
    min-width: 4.5em;
    text-align: center;
    overflow-y: auto;
    max-height: 100vh;
    max-height: calc(100dvh - 4.5rem);
    padding: 0 0 0 1em;
    box-sizing: border-box
}

@media (min-width: 576px) {
    .sidebar_left {
        margin-top: -2rem;
    }
}

.sidebar_left a {
    display: block;
    padding: .25em;
    padding-top: .35em; /* This tweak centers the text vertically */
    border: solid 1px #b14c16;
}
.sidebar_left :not(.active) {
    border-block: none;
    border-right: none;
}
.sidebar_left .active {
    border-inline: none;
}

.scroll-shadow {
    overflow-x: hidden;
    scrollbar-color: rgba(0,0,0,0.05) white;
    scrollbar-width: thin;
    scrollbar-gutter: stable;
    transition: scrollbar-color .25s;
}
.scroll-shadow:hover, .scroll-shadow:focus {
    scrollbar-color: rgba(0,0,0,0.25) white;
}

.scroll-shadow::-webkit-scrollbar {
    width: 6px;
}
.scroll-shadow::-webkit-scrollbar-track {
    background-color: white;
}
.scroll-shadow::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0,0.05);
    transition: background-color .25s;
}
.scroll-shadow:focus::-webkit-scrollbar-thumb,
.scroll-shadow:hover::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0,0.25);
}

.scroll-shadow::before, .scroll-shadow::after {
    content: '';
    position: sticky;
    display: block;
    left: 0;
    height: 0;
    width: 100%;
    box-shadow: 0px 0 1em 1em white;
    background: white;
}
.scroll-shadow::before {
    top: 0;
    margin-bottom: 1.5em;
}
.scroll-shadow::after {
    bottom: 0;
    margin-top: 1.5em;
}


/*---------
  thai
----------*/

.thai h1, .thai h2, .thai {
    font-family: Norasi, sans-serif;
    font-size: 1.1em;
}
.thai li,
.thai p {
    margin-top: 0.06em;
    margin-bottom: 0.06em;
}
.thai .smalldate {
    font-size: 0.6em;
    padding-top: .7em;
}
.thai h1 {
    font-size: 1.4em;
}
.thai h2 {
    font-size: 1.25em;
    line-height: 1.1em;
}
.thai .accordion-button {
    font-size: inherit;
}
.th_month {
    margin: 1em 0 0.4em;
    font-size: 1.15em;
}
.th_year {
    font-size: 1.4em;
    letter-spacing: 0.1em;
    margin: 1em 0 0.4em 4%;
}
.th_new dd,
.th_new dt {
    font-family: Norasi, StoneSans, sans-serif;
    font-style: normal;
    font-size: 1.1em;
    line-height: 1.1em;
}
/*-------
 Russian
--------*/
.ru_nav {
    font-family: FFMeta, sans-serif;
}
#russian {
    font-family: FFMetaSerif, serif;
}
/*-------
 lists
--------*/

.suttatoc li {
    padding-left: 4%;
    text-indent: -4%;
    margin: 0.4em 0;
}
.suttatoc ul {
    margin-right: 4%;
    padding-left: 0;
}
.suttatoc a:not(.nobutton) {
    padding: 0.22em 0.44em 0 0.44em !important;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px !important;
    vertical-align: baseline;
    text-decoration: none !important;
    outline: none;
    background-color: #B87049;
    color: #f5f5f5 !important;
    border: 1px solid #B87049;
    font-size: 90%;
    text-align: left;
}
.suttatoc a:visited:not(.nobutton) {
    background-color:#999;
    border: 1px solid #999;
}
.suttatoc a:active:not(.nobutton),
.suttatoc a:hover:not(.nobutton) {
    border: 1px solid #B87049;
    background: #f5f5f5;
    color: #B87049 !important;
}
.suttatoc a:visited:hover:not(.nobutton) {
    border: 1px solid #808080;
    background: #f5f5f5;
    color: #808080 !important;
}
#jumpbuttons {
    text-align:center;
    font-size:66%;
    font-family: StoneSans, sans-serif;
}
#jumpbuttons a, #jumpbuttons a:visited {
    padding: 0.22em 0.44em 0 0.44em !important;
    -webkit-border-radius: 2px 12px 12px 2px;
    -moz-border-radius: 2px 12px 12px 2px;
    border-radius: 2px 12px 12px 2px !important;
    margin:0 0.5%;
    vertical-align: middle;
    text-decoration: none !important;
    outline: none;
    background-color:#EDE9E7;
    color: #707070 !important;
    border: 1px solid #EDE9E7;
}
#jumpbuttons a:active,
#jumpbuttons a:hover,
#jumpbuttons a:visited:hover {
    background-color: #B87049;
    color: #f5f5f5 !important;
    border: 1px solid #B87049;
}

/*-----
headings
-------*/
.year, .month, .th_year, .th_month, .zip {
    margin: 1em 0 0.4em;
    text-indent: 0;
}
.year {
    letter-spacing: 0.1em;
    font-size: 1.3em;
    font-family: StoneSans, sans-serif;
    list-style: none;
}
.month {
    letter-spacing: 0;
    font-size: 1.15em;
    font-family: StoneSans, sans-serif;
}
.nomonth {
    letter-spacing: 0;
    font-weight: normal;
    font-size: 0.7em;
    margin: 0;
}
.faq_q {
    font-weight: bold;
    margin: 1em 0 0.4em;
    letter-spacing: 1px;
}
.booklist {
    font-style: italic;
    margin: 1em 0 0.4em;
    letter-spacing: 1px;
}

/*----
spans
-----*/

.sm-cap {
    font-family: "StoneSans_SC";
}
.smalldate {
    font-size: 0.75em;
    padding-right: 2%;
}
kbd, code, .mono {
    font-family: 'Droid Sans Mono', monospace;
    vertical-align: baseline;
}
.smaller {
    font-size: 0.9rem;
}
.redfont {
    color: #dc3545;
}
.greenfont {
    color: #198754;
}
.diamond {
    font-size: 0.7em;
    vertical-align: 2px;
}
strong, .bold {
    font-weight: bold;
}
em, .italic {
    font-style: italic;
    vertical-align:baseline;
}
.sans, .pali {
    font-family: StoneSans,sans-serif;
}
.center {
    text-align: center;
    justify-content: center;
    text-indent: 0;
}

/*-----
various
-----*/
.first, .f {
    margin-top: 0.6em;
}
.clear {
    clear: both;
}
.half {
    margin-bottom: 0.6em;
}
/*-------
ebook
-------*/
.ebookItem {
    margin: 1.5em 0 0;
}
.ebookItem div {
    float: left;
    width: 3em;
    margin-right: 1.5em;
    font-family: StoneSans, sans-serif;
    font-size: 0.8em;
    border-right: 1px solid #999;
    padding-right: 0;
}
.ebookItem ul {
    padding: 0;
    height: 150px;
    list-style: none;
}
ul.ebookItem li {
    padding: 7% 0;
}
ul.fourformats li {
    padding: 15% 0;
}
ul.threeformats li {
    padding: 28% 0;
}
ul.oneformat li {
    padding: 125% 0;
}
/*.ebookItem li:first-child {padding-top:0}*/
/*.ebookItem li:last-of-type {padding-bottom:0}*/

.ebookImg {
    float: left;
    height: 150px;
    margin: 0.2em 1.2em 0.2em 1%;
    box-shadow: 2px 2px 2px #333;
}
.author {
    font-style: italic;
    font-size: 1em;
}
.title {
    font-weight: bold;
    font-size: 1em;
    text-underline-offset: .25em;
}
.month.books {
    font-style: normal;
    text-indent: 2em;
}

.ebookformats {
    padding: 2% 3%;
    display: flex;
    justify-content: space-around;
    text-align: center;
    background-color: white;
    clear: left;
}

/*section.ebookformats img {*/
.ebookformats a {
    /*margin-left:auto;*/
    /*margin-right:auto;*/
    /*width:36px; */
    padding: 0;
    font-family: StoneSans, sans-serif;
    font-size: 1rem;
    text-decoration: underline;
}

/*---------
 hyperlinks
 -------- */

:where(#content) a:link {
    color: #3d3d3d;
}
:where(#content) a:visited {
    color: #707070;
}
:where(#content) a:active,
:where(#content) a:hover,
:where(#content) a:visited:hover {
    color: #b8b8b8;
    background: #transparent;
}


.zip {
    padding-left: 0;
    font-style: italic;
    font-family: StoneSans, sans-serif;
    display: flex;
}
a.zip {
    margin: 0;
}

.zip img, .pdf img {
    width: 18px;
    height: 18px;
    flex: 0;
    vertical-align: -3px;
}

/*these keep the side bar items from fading out after being visited*/
#content .ebookItem a:visited,
#content .sidebar_left a:visited {
    color: #3d3d3d;
}
.ebookItem a:hover,
.ebookItem a:visited:hover,
.sidebar_left a:hover,
.sidebar_left a:visited:hover {
    color: #b8b8b8;
    background: transparent;
}
/*fade out images with mouse-over, and disable background gray fill*/
img.ebookImg:active,
img.ebookImg:hover,
img.ebookImg:visited:hover {
    opacity: 0.66;
    filter: alpha(opacity=66);
    background: transparent;
}
/*keep worldmap in navmenu from fading on hover*/
#worldMap img:active,
#worldMap img:hover,
#worldMap img:visited:hover {
    opacity: 1;
    filter: alpha(opacity=100);
}

/*these are the hyperlinks for the suttas*/
#sutta a:link,
#vinaya a:link {
    color: #b14c16;
    text-decoration: underline;
}
#sutta a:hover,
#vinaya a:hover {
    color: #d04a01;
}
#sutta a:visited:hover,
#vinaya a:visited:hover {
    color: #b8b8b8;
}
#sutta a.outlink:link,
#vinaya a.outlink:link,
a.outlink:link {
    color: blue;
}

/******* Pali and chanting **********/
.chant pre {
    font-family: inherit;
}
.chant .pali {
    font-style: italic;
    margin-top: 0;
    margin-bottom: 0;
}
.chant .english {
    font-style: normal;
    margin: 0 2% 1em;
}

/*-------------------
  new_index page
--------------------*/

dt {
    margin-top: 2em;
}
dd {
    margin-left: 4%;
    margin-top: 0.6em;
}

/** Search page view **/

#searchForm {
    margin-bottom: 2em;
}

.search-results {
    --bs-list-group-item-padding-y: 1em;
    --bs-list-group-item-padding-x: 0;
}

.search-result {
    display: flex;
    flex-wrap: wrap;
}

.search-result .breadcrumbs {
    margin-top: 1em;
    flex: 100%;
}

.search-result .search-icon {
    width: 1.5rem;
    height: 1.5rem;
    padding: .1em;
    box-sizing: border-box;
    margin-right: 1rem;
}

.snippet {
    border: 1px solid #ccc;
    border-radius: .375rem;
    padding: 1rem;
    margin: 1rem 0 0;
    flex: 100%;
    > p:last-child {
        margin: 0;
    }
}

/*------thai stuff---------*/
.th_nav {
    font-size: 1.0em;
    font-family: Norasi, sans-serif, serif;
}
.th_nav li ul li {
    white-space: nowrap;
}

/*------
 Talks (audio)
------*/
.audio-archive {
    --bs-list-group-item-padding-y: .25em;
    --bs-list-group-item-padding-x: 0;
}
li.li-audio {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border-bottom: dotted 1px #acacac;
}
li.li-audio a.audio {
    flex: 1;
    display: flex;
    gap: .5rem;
    text-decoration: none;
}
.li-audio .talk-info {
    flex: 100%;
    margin-top: .5em;
    font-style: italic;
}
li.li-audio.transcribed a.audio::after {
    content: "";
    background: no-repeat center / contain url("/static/images/pdf_36.png");
    width: 12px; height: 12px;
    align-self: center;
    margin-left: auto;
}
button.play {
    background: no-repeat center / contain border-box url(/static/images/play-glyph.png) transparent;
    vertical-align: middle;
    border: none;
    width: 1.5rem;
    height: 1.5rem;
    margin-right: 4%;
    padding: .1em;
    cursor: pointer;
}
button.play.playing {
    background-image: url(/static/images/stop-glyph.png);
}
.talk-links {
    display: flex;
    justify-content: space-evenly;
    margin: 1em 0;
}
.transcript {
    margin-top: 1em;
}
.transcript blockquote {
    quotes: initial;
}
.transcript blockquote p:first-child::before {
    content: open-quote;
}
.transcript blockquote p:last-child::after {
    content: close-quote;
}
audio.talk-player {
    display: block;
    width: 100%;
}
img.play {
    width: 14px;
    margin-left: -3%;
    margin-right: 4%;
    cursor: pointer;
    /* nec. for mobile devices */
    vertical-align: -2px;
}
h2 img.play {
    width: 23px;
    margin: 0;
    padding-right: 2.4%;
}
h1 img.play {
    width: 29px;
    margin: 0;
    padding-right: 2.4%;
}
audio.play {
    display: block;
    margin-bottom: 12px;
    margin-top: 10px;
    width:100%;
    flex: 100%;
}
h1 audio.play,
h2 audio.play {
    margin: 0.5em auto;
}

.breadcrumbs {
  border-radius: 5px;
  background: #f0f0f0;
  max-width: 100%;
}

#mainBreadcrumbs {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.breadcrumbs ol {
    display: flex;
    padding-left: 0;
    margin-bottom: 0;
}

.breadcrumbs ol li {
    font-family: StoneSans, sans-serif;
    font-size: .875rem;
    line-height: 2em;
    padding: 4px;
    padding-bottom: 2px;
    color: #333 !important;
    white-space: nowrap;

    flex: 0 0.3 auto;           /* 0.3 shrink factor */
    min-width: 4ch;
    display: flex;
}

/* Last child is shrunk with factor of 1, the first (or first two) is
   never shrunk. */
.breadcrumbs ol li:last-child {
    flex-shrink: 1;
}
.breadcrumbs ol li:first-child, .breadcrumbs-collapse ol li:nth-child(-n + 2) {
    flex-shrink: 0;
}

/* When breadcrumb is shrunk, truncate with an ellipsis. */
.breadcrumbs ol li a,
.breadcrumbs ol li span {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

/* Breadcrumbs collapse if they have more than four items */
.breadcrumbs.breadcrumbs-collapse ol:has(li:nth-child(5)) li {
    position: absolute;
    left: -999em;
    right: auto;
    display: inline;
}

.breadcrumbs.breadcrumbs-collapse ol:has(li:nth-child(5)) li:nth-last-child(2) {
    position: static;
    display: flex;
}

.breadcrumbs.breadcrumbs-collapse ol:has(li:nth-child(5)) li:nth-last-child(2) a::before {
    content: "← ";
}

.breadcrumbs.breadcrumbs-collapse ol:has(li:nth-child(5)) li:nth-last-child(2) a.short-title::after {
    content: " (" attr(data-long-title) ")";
}

.breadcrumbs ol li::after {
    content: var(--breadcrumb-divider);
    display: inline-block;
    position: relative;
    top: -0.1em;
    padding-left: 8px;
}

.breadcrumbs.breadcrumbs-collapse ol:has(li:nth-child(5)) li::after {
    content: none;
}

@media (min-width: 800px) {
    .breadcrumbs.breadcrumbs-collapse ol li {
        position: static !important;
        display: flex !important;
    }

    .breadcrumbs.breadcrumbs-collapse ol li::after {
        content: var(--breadcrumb-divider) !important;
    }

    .breadcrumbs ol li a::before, .breadcrumbs ol li a::after {
        content: none !important;
    }
}

.breadcrumbs ol li:last-child::after {
    content: none !important;
}

.breadcrumbs a {
    font: inherit;
  color: #666 !important;
  text-decoration: none !important;
}
.breadcrumbs a:hover {
  color: #999 !important;
  text-decoration: underline !important;
  text-underline-offset: .25em;
}

.breadcrumbs .current a {
  color: #b14c16 !important;
}

.archive #searchForm button[type="submit"] {
    display: none;
}

@media (min-width: 400px) {
    .archive #searchForm button[type="submit"] {
        display: block;
    }
}

.book-intro {
    display: grid;
    grid-template: "hgroup thumb" auto
                   "desc thumb" 1fr / 3fr minmax(110px, 1fr);
    gap: 1em;
    margin-bottom: 1em;
}

@media (max-width: 500px) {
    .book-intro {
        grid-template-areas: "hgroup thumb"
                             "desc desc";
    }
}

.book-intro hgroup {
    grid-area: hgroup;
}

.book-intro figure {
    grid-area: thumb;
    border-radius: var(--bs-btn-border-radius, .375em);
    overflow: hidden;
    height: fit-content;
    border: 1px solid lightgray;
}

.book-intro hgroup * {
    min-width: 10ch;
    width: fit-content;
}

.book-intro .book-description {
    grid-area: desc;
}

.book-toc .toc-nav, .book-toc .toc-nav .nav {
    --bs-nav-link-font-size: 1.1rem;
}

.book-toc .toc-nav > .nav-item > .nav-link {
    text-decoration: underline;
    text-underline-offset: .25rem;
    padding-left: .25rem;
}

.book-toc .toc-nav > .nav-item::before {
    content: "–";
    width: 1.5rem;
    text-align: center;
    color: var(--bs-gray-500);
    height: 1.5rem;
}

.book-card {
    display: grid !important;
    grid-template: "thumb content" auto / minmax(140px, 1fr) 2fr;
    gap: 0;
    overflow: hidden;
}

.book-card-content {
    grid-area: content;
}

.book-thumb {
    grid-area: thumb;
}