/* navbar offset */
body {
    padding-top: 70px;
}

/* Text for the icon-only menu items: hidden on desktop but still read by screen readers, and
   shown beside the icon when the menu is collapsed into a list. */
.nav-label {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

/* The menu doesn't fit on one row below 992px: it wrapped to two rows and covered the top of the
   page. Collapse it behind the toggle button until then instead of Bootstrap's 768px. Theme
   stylesheets load after this file and carry Bootstrap's own breakpoint rules, so these selectors
   are one class more specific. */
@media (max-width: 991px) {
    .navbar-fixed-top .navbar-header {
        float: none;
    }

    .navbar-fixed-top .navbar-toggle {
        display: block;
    }

    .navbar-fixed-top .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
    }

    .navbar-fixed-top .navbar-collapse.collapse {
        display: none !important;
    }

    /* no height cap or scroll container here: the dropdowns float over the page and would be
       clipped, and Bootstrap's 340px cap cut the menu's background off partway down */
    .navbar-fixed-top .navbar-collapse.collapse.in {
        display: block !important;
    }

    .navbar-fixed-top .navbar-collapse.collapse {
        max-height: none;
    }

    .navbar-fixed-top .navbar-nav {
        float: none !important;
        margin: 7.5px -15px;
    }

    .navbar-fixed-top .navbar-nav > li {
        float: none;
    }

    .navbar-fixed-top .navbar-nav > li > a {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .navbar-fixed-top .navbar-left,
    .navbar-fixed-top .navbar-right {
        float: none !important;
    }

    .navbar-fixed-top .navbar-right {
        margin-right: -15px;
    }

    /* open under the item's label rather than at the far right edge */
    .navbar-fixed-top .navbar-right .dropdown-menu {
        left: 0;
        right: auto;
    }

    .navbar-fixed-top .navbar-form {
        margin: 8px 0;
        padding: 0 15px;
    }

    .navbar-fixed-top .nav-label {
        position: static;
        width: auto;
        height: auto;
        margin: 0 0 0 .5em;
        overflow: visible;
        clip: auto;
    }

    .navbar-fixed-top .nav-icon-suffix {
        display: none;
    }
}

/* on phones Bootstrap shows the dropdowns inline, so the open menu can scroll safely; let it use
   the screen height instead of Bootstrap's 340px */
@media (max-width: 767px) {
    .navbar-fixed-top .navbar-collapse.in {
        max-height: calc(100vh - 50px);
        overflow-y: auto;
    }
}

/* Mini calendar, calendar, and RSS styles */
/* colors are translucent grays over the theme background and text inherits, so the calendars
   stay readable on dark themes like Cyborg as well as light ones */
.minicalendar {
    border: 1px solid rgba(128, 128, 128, .5);
    margin-bottom: 20px;
    /* fill the column; fixed layout keeps all seven day columns the same width */
    width: 100%;
    table-layout: fixed;
}

.minicalendar th,
.minicalendar td {
    border: 1px solid rgba(128, 128, 128, .25);
    padding: 0;
    height: 2.2em;
    text-align: center;
    vertical-align: middle;
}

/* below desktop the sidebar spans the screen: cap the width so the calendar doesn't stretch
   across a tablet, and make the day cells taller for touch */
@media (max-width: 991px) {
    .minicalendar {
        max-width: 28em;
    }

    .minicalendar th,
    .minicalendar td {
        height: 2.75em;
    }
}

.minicalendarth {
    background: rgba(128, 128, 128, .15);
    color: inherit;
    font-weight: bold;
}

.minicalendaroffrow {
    background: rgba(128, 128, 128, .15);
}

.minicalendarrow {
    background: transparent;
    color: inherit;
}

.minicalendarsub {
    background: rgba(128, 128, 128, .15);
    text-align: center;
}

/* year view: one month per row on phones, more side by side as the column widens */
.fullcalendars {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 20em), 1fr));
    gap: 1.5em;
    /* don't stretch shorter months to the height of their neighbors */
    align-items: start;
    margin-top: 1em;
}

.fullcalendar {
    border: 1px solid rgba(128, 128, 128, .5);
    width: 100%;
    /* equal width day columns regardless of content */
    table-layout: fixed;
    margin: 0;
    font-size: 1.1em;
}

.fullcalendar caption {
    color: inherit;
    font-size: 1.15em;
    font-weight: bold;
}

.fullcalendar th,
.fullcalendar td {
    border: 1px solid rgba(128, 128, 128, .25);
}

.fullcalendarth {
    background: rgba(128, 128, 128, .15);
    color: inherit;
    padding: .35em 0;
    text-align: center;
    overflow: hidden;
    text-overflow: clip;
    white-space: nowrap;
}

.fullcalendaroffrow {
    background: rgba(128, 128, 128, .15);
}

.fullcalendarrow {
    background: transparent;
    color: inherit;
    height: 3.8em;
    padding: .25em .35em;
    position: relative;
    vertical-align: top;
}

.fullcalendarday {
    font-weight: bold;
}

/* entry count, a link to that day */
.fullcalendar a.fullcalendarcount {
    position: absolute;
    right: .3em;
    bottom: .25em;
    min-width: 1.6em;
    padding: 0 .35em;
    border-radius: .8em;
    background: rgba(128, 128, 128, .25);
    font-size: .8em;
    font-weight: bold;
    line-height: 1.7em;
    text-align: center;
    text-decoration: none;
}

.fullcalendarsub {
    background: rgba(128, 128, 128, .15);
    padding: .35em 0;
    text-align: center;
}

/* RSS Feed Reader/Subscription */

.RssItems {

}

.RssItem {
    margin: 1em 0 1.5em 3.5em;
    padding: 10px;
    padding-bottom: 1.5em;
}

.RssItemTitle {
    font-size: 1.2em;
    line-height: 1.5;
    background-color: #F2F2F2;
    color: black;
    padding: 5px;
    -moz-border-radius: 10%;
    -moz-opacity: .75;
}

.RssItemTitle:hover {
    color: white;
    background-color: black;
}

.RssItemTitle a, .RssItemTitle a:visited, .RssItemTitle a:link {
    color: gray;
    font-weight: bold;
    text-decoration: none;
    background: transparent;
}

.RssItemTitle a:hover {
    color: silver;
    background: transparent;
    text-decoration: none;
}

.RssItemPubDate {
    font-size: 10px;
    display: block;
    float: left;
    color: gray;
    margin-top: .2em;
}

.RssItemDesc {
    font-size: 10px;
    line-height: 1.5;
    color: black;
    margin: 1em 0 0 0;
    padding: 0;
}

.RssReadMore {
    display: block;
    clear: both;
}

.RssTechnoratiTrack {
    display: block;
    float: right;
}

#box1 {
    visibility: hidden;
    border: 1px solid gray;
    position: absolute;
    background: #F8F8F8;
    padding: 0;
    width: 250px;
    z-index: 10;
}

/* Tags */

.TagCloud {

}

.TagCloudSmall {
    font-size: .7em;
}

.TagCloudMedium {
    font-size: 1.0em;
}

.TagCloudLarge {
    font-size: 1.3em;
}
/* single picture page: keep tall pictures within the screen */
.picture-page figure {
    margin: 0 0 20px;
}

.picture-page figure img {
    max-height: 80vh;
    width: auto;
}

.picture-page figcaption {
    margin-top: 8px;
}

/* Entry action icons (edit, delete, favorite). Buttons are styled to look like the old icon links
   and sized to at least 24px, with a gap so delete isn't easily tapped instead of edit. */
.entry-action,
.btn-link.entry-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    min-height: 28px;
    padding: 0 4px;
    margin-right: 8px;
    border: 0;
    font-size: 1.15em;
    line-height: 1;
    vertical-align: middle;
    text-decoration: none;
}

/* ==========================================================================
   Readability and accessibility rules shared by every theme. Theme stylesheets load after this
   file, so selectors that compete with a theme rule start with "html" to be one step more
   specific. Each theme sets its colors at the end of its own file; --jj-focus and --jj-disabled
   below are the defaults for light themes.
   ========================================================================== */

:root {
    --jj-focus: #0b3d66;
    --jj-disabled: #737373;
}

/* 16px text with roomier lines; most themes ship 13-15px at 1.43 */
html body {
    font-size: 16px;
    line-height: 1.6;
}

/* links inside posts are underlined so they don't rely on color alone. The entry title and the
   action icons below it are inside .ebody too, but they're clearly links without it. */
html .ebody a {
    text-decoration: underline;
    text-underline-offset: 2px;
}

html .ebody h1 a, html .ebody h2 a, html .ebody h3 a, html .ebody h4 a,
html .ebody td > div > a, html .ebody a.entry-action {
    text-decoration: none;
}

html .ebody h1 a:hover, html .ebody h2 a:hover, html .ebody h3 a:hover, html .ebody h4 a:hover {
    text-decoration: underline;
}

/* sidebar section labels have inline 10px styles, hence !important */
.menuentity > strong {
    font-size: 12px !important;
    letter-spacing: 1.5px !important;
}

/* disabled pager button: readable, dashed so it reads as unavailable */
html .pager .disabled > a, html .pager .disabled > a:hover, html .pager .disabled > a:focus,
html .pager .disabled > span {
    color: var(--jj-disabled);
    border-style: dashed;
}

/* placeholder text was 1.4-2.9:1 in most themes */
html .form-control::placeholder {
    color: var(--jj-placeholder, #737373);
    opacity: 1;
}

/* visible keyboard focus */
html a:focus-visible, html button:focus-visible, html .btn:focus-visible,
html input:focus-visible, html select:focus-visible, html textarea:focus-visible,
html [tabindex]:focus-visible {
    outline: 3px solid var(--jj-focus);
    outline-offset: 2px;
}

/* white ring on the navbar (not its dropdowns, which sit on the page color); themes with a light
   navbar set --jj-nav-focus */
html .navbar-nav > li > a:focus-visible, html .navbar-brand:focus-visible,
html .navbar-toggle:focus-visible, html .navbar-form input:focus-visible {
    outline-color: var(--jj-nav-focus, #ffffff);
    outline-offset: -3px;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}