/**
 * Theme Name:     The Laundry Room
 * Author:         Ron Angelo, Cat Lady Firebird
 * Template:       asteroid
 * Text Domain:	   The Laundry Room
 * Description:    A heavily customized version of Ron Angelo\'s Asteroid theme, used at The Laundry Room (LFVoy.net).
 * Theme URI:      https://lfvoy.net
 * Author URI:     https://lfvoy.net
 * Version:        1.0
 */

/* ===============================================================
I hate repetition. And manual updating. So let's don't.
=============================================================== */

:root {

    /* ===== Colors ===== */

    --tlr-page-bg: #C7EAFC;

    --tlr-content-bg: #fff;
    --tlr-content-text: #222;

    --tlr-link: #15477C;
    --tlr-link-hover: #222;

    --tlr-heading: #15477C;

    --tlr-border: #222;
    --tlr-border-light: #ccc;

    --tlr-muted: #666;
    --tlr-muted-dark: #555;

    --tlr-button-bg: #e6e6e6;
    --tlr-button-hover: #dcdcdc;
    --tlr-button-shadow: #999;

    --tlr-danger: #cc0000;

    --tlr-table-caption-bg: #f0e0d4;
    --tlr-table-heading-bg: #eadde4;

    /* ===== Images ===== */

    --tlr-canvas: url('https://lfvoy.net/wp-content/uploads/admin-meta/canvas.jpg');
    --tlr-page-bg-image: url('https://lfvoy.net/wp-content/uploads/admin-meta/default-background.png');

    /* ===== Fonts ===== */

    --tlr-body-font: "Lora", serif;
    --tlr-heading-font: "Young Serif", serif;
    --tlr-menu-font: "Capriola", sans-serif;

    /* ===== Dimensions ===== */

    --tlr-content-width: 1220px;
    --tlr-main-width: 830px;
    --tlr-sidebar-width: 360px;

}


/* ===============================================================
Box and text shadows go all splody.
Really, folks, we know it's a web site. No need to pretend.
================================================================ */

#container,
#container.cf,
#footer,
#below-menu,
#nav .sub-menu,
#nav .children,
.archive-info,
.blog-view,
.continue-reading,
.continue-reading:hover,
.attachment-nav .link-prev a,
.attachment-nav .link-next a,
.comment-body,
.comment-reply-link,
.comment-form-author input,
.comment-form-email input,
.comment-form-url input,
.comment-form-comment textarea,
.author-info,
.author-latest-posts,
.wrap-404-box,
#widgets-wrap-footer-3 {
    box-shadow: none;
}

#footer {
    box-shadow: none !important;
}

#site-title,
#footer,
#below-menu,
#nav .menu a,
#nav .menu a:hover,
#nav .menu ul a:hover,
#nav .sub-menu li a,
#nav .children li a,
#nav .current-menu-item,
#nav .current-menu-ancestor,
#nav .current_page_ancestor,
#nav .current_page_item,
.archive-title,
.continue-reading:hover,
.entry-title a,
.page-nav > *,
.comment-nav > *,
.author-info .title,
.author-latest-posts-title,
.widget-after-post .widget-title,
.wp-pagenavi a,
.wp-pagenavi span {
    text-shadow: none;
}

#container,
#nav .menu,
#nav .menu > li,
#nav .menu > ul > .page_item,
#content,
.search-form,
#footer,
.archive-info {
    border: 0 none;
}

/* =====================================================================
Ron's a great programmer. Sense of design? Not so much.
So we'll just hide the most egregious of the problems.
===================================================================== */

.entry-meta-top,
.entry-tags,
#site-description,
.post-nav.cf,
#footer-bottom {
    display: none;
    visibility: hidden;
}

.widget-footer-3 .widget-title {
    background: none;
    border-left: none;
    border-right: none;
}

/* ====================================================================
Global site styles
==================================================================== */

html,
body {
    background-color: var(--tlr-page-bg);
    background-image: var(--tlr-page-bg-image);
    background-repeat: repeat;
    background-position: center top;
    background-size: auto;
    background-attachment: fixed;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    color: var(--tlr-content-text);
    font-family: var(--tlr-body-font);
}

a,
a:visited,
.entry-header a,
.widget-sidebar a,
.wpcf7-not-valid-tip,
h4,
#footer a,
#footer a:hover,
#footer-links a,
#footer-links a:hover
{
    color: var(--tlr-link);
}

#header a {
  color: var(--tlr-heading);
}

#header a:hover {
  color: var(--tlr-link);
}

a:hover,
a:focus,
.entry-header a:hover,
.widget-sidebar a:hover {
    color: var(--tlr-link-hover);
}

abbr,
acronym {
    text-decoration: none;
    border-bottom: 1px dotted var(--tlr-border);
}

hr {
    height: 1px;
    background-color: var(--tlr-border);
    border: none;
    border-top: 1px solid var(--tlr-border);
}

table caption {
  background-color: /* var(--tlr-table-caption-bg) */ #e9d8ca;
  padding: 8px 3px;
  border: 1px solid #aaa; /* Table Border Color inherited from parent stylesheet */
  font-weight: bold;
  text-align: left;
}

th {
  text-align:center;
  font-weight:bold;
  vertical-align:top;
  background: var(--tlr-table-heading-bg);
  border-top: 0 none;
}

td {
    text-align: left;
    vertical-align: top;
}

table.timeline-table tbody tr:nth-child(even),
table.episode-table tbody tr:nth-child(even) {
    background-color: #eee; /* All RIGHT. We'll hard code this color too. */
}

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

.corrected-date {
  	color: #cc0000;
}

/* ===============================================================
Layout
=============================================================== */

div#container,
#container,
#container.cf {
    width: var(--tlr-content-width) !important;
    max-width: var(--tlr-content-width) !important;
}

#content {
    width: var(--tlr-main-width) !important;
    max-width: var(--tlr-main-width) !important;
    padding-left: 20px;
    padding-right: 10px;
}

#sidebar {
    width: var(--tlr-sidebar-width) !important;
    max-width: var(--tlr-sidebar-width) !important;
    font-size: 14px;
}

#respond {
    padding-left: 20px;
    padding-right: 0;
}

.single-view {
    padding: 10px 12px;
}

.widget-sidebar {
    padding-right: 0;
    padding-left: 10px;
}

#widgets-wrap-header {
    display: block;
    float: right;
    font-family: var(--tlr-body-font);
    font-size: 24px;
}

#footer,
#footer p,
#footer-area,
#widgets-wrap-footer-full,
#footer-area.cf,
#custom-html-2,
#custom-html-2 .textwidget,
#custom-html-2 .ll-footer-text {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    min-height: 0 !important;
}

#footer .widget {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* ===============================================================
Canvas surfaces
=============================================================== */

#header,
#nav,
#nav .menu > li > a,
#nav .menu > ul > .page_item > a,
#nav .sub-menu li,
#nav .children li,
#content,
#sidebar,
#main,
#footer,
#footer-bottom,
.search-form,
.widget-sidebar .widget-title,
.archive-title,
.wrap-404-box,
.wrap-404-box h2,
.page-nav > *,
.comment-nav > *,
#wp-calendar th,
.wp-pagenavi a,
.wp-pagenavi span,
.author-info.cf h4.title {
    background: var(--tlr-canvas);
}

#content article,
input,
textarea,
.author-info.cf {
    background: var(--tlr-content-bg);
}

#content article.sticky {
    background-image: none;
}

/* ===============================================================
Borders and structural elements
=============================================================== */

#header {
    min-height: 110px;
    border-top: 1px solid var(--tlr-border);
    border-right: 1px solid var(--tlr-border);
    border-left: 1px solid var(--tlr-border);
}

#main,
#footer.cf,
#nav.cf.drop {
    border-right: 1px solid var(--tlr-border);
    border-left: 1px solid var(--tlr-border);
}

#footer {
    border-top: 1px solid var(--tlr-border);
}

#footer.cf {
    border-bottom: 1px solid var(--tlr-border);
}

#nav,
.widget-sidebar .widget-title,
.archive-title,
.wrap-404-box {
    border-top: 1px solid var(--tlr-border);
    border-bottom: 1px solid var(--tlr-border);
    border-left: 0 none;
    border-right: 0 none;
}

#content article,
input,
textarea,
.author-info.cf {
    border: 1px solid var(--tlr-border);
}

#content article.sticky {
    border: 1px solid var(--tlr-link);
}

.entry-content,
#widgets-wrap-after-post-content {
    border-top: 1px solid var(--tlr-border);
}

.caption-style-image {
  	background-color: #eee;
  	border: 1px solid #CCC;
  	padding: 4px;
}

.post-nav {
    border-top: 1px solid var(--tlr-border);
    border-bottom: 1px solid var(--tlr-border);
}

.entry-meta-bottom,
.entry-title,
#bottom-navi,
#respond,
.author-description a {
    border: 0 none;
}

.continue-reading {
    border: 1px solid var(--tlr-border);
}

.asteroid-widget li {
    border-bottom: 1px solid var(--tlr-border-light);
}

h4.title,
.wrap-404-box h2,
.archive-description {
    border-bottom: 1px solid var(--tlr-border);
}

/* ===============================================================
Typography
=============================================================== */

#site-title,
#site-title a {
    font-family: var(--tlr-heading-font);
}

#nav .menu,
#nav .menu a,
.entry-title,
.entry-title a,
.post-title,
.post-title a,
.page-title,
.entry-content h1,
.entry-content h2,
.entry-content h3,
.wp-caption-text,
input[type="search"],
input[type="submit"],
input,
textarea {
    font-family: var(--tlr-menu-font);
}

.entry-content,
.entry-content p,
.entry-content h4,
.entry-content h5,
.entry-content h6,
.entry-content small,
.entry-summary,
.entry-excerpt,
blockquote,
blockquote p,
#sidebar,
#sidebar .widget,
#footer,
div.entry-date,
.post-nav,
.archive-description,
.wrap-404-box,
#bottom-navi,
.entry-content summary {
    font-family: var(--tlr-body-font);
}

.widget-title,
.widget-sidebar .widget-title {
    font-family: var(--tlr-menu-font);
    font-weight: normal;
    text-align: center;
}

h1#site-title,
h2#site-title {
    font-size: 66px;
    font-weight: normal;
    line-height: 95%;
}

#nav .menu li a,
h2.widget-title,
.archive-title,
.wrap-404-box h2 {
    text-transform: uppercase;
    font-weight: normal;
}

h1.entry-title,
h3 {
    font-weight: normal;
}

.entry-title,
.entry-title a,
.entry-title a:link,
.entry-title a:visited {
    color: var(--tlr-link);
  	font-weight: normal;
}

.entry-title a:hover,
.entry-title a:focus,
.entry-title a:active {
    color: var(--tlr-link);
}

div.entry-date {
    font-size: 105%;
}

.entry-excerpt,
.entry-content {
    color: var(--tlr-content-text);
    padding-top: 5px;
    font-size: 16px;
    line-height: 140%;
    text-align: justify;
    hyphens: auto;
}

.entry-content ul,
.entry-content ul li,
.entry-content ul li a,
.entry-content ol,
.entry-content ol li,
.entry-content ol li a,
table {
    font-family: var(--tlr-body-font);
}

.entry-content p,
.post-nav,
.archive-description,
.single-view .entry-content,
.wrap-404-box,
#bottom-navi {
    font-size: 16px;
    line-height: 140%;
}

.entry-content small {
    font-size: 13px;
    line-height: 130%;
}

.author-description {
    font-size: 110%;
}

#footer-links,
#respond,
input[type="search"],
input[type="submit"],
input,
textarea {
    font-size: 14px;
}

.ll-footer-text {
    text-align: center;
    font-style: italic;
}

blockquote.wpprq-quote {
    margin: 0;
    border: 0 none;
    background: none;
    font-family: var(--tlr-body-font);
}

.wp-caption-text {
    text-align: center;
}

/* ===============================================================
Links and buttons
=============================================================== */

a:hover {
    font-weight: bold;
}

#header a:hover,
h1#site-title a:hover,
h2#site-title a:hover {
    font-weight: normal;
}

input[type="submit"],
.start-here-button,
input[type="search"],
input,
textarea {
    color: var(--tlr-content-text);
}

.entry-content a {
    text-decoration: none;
    border-bottom: 1px solid var(--tlr-border-light);
}

.entry-content a:hover,
.entry-content a:focus {
    border-bottom: 1px solid var(--tlr-border);
}

.entry-content summary {
  display: inline-block;
  color: var(--tlr-link);
  border-bottom: 1px dotted var(--tlr-border-light);
}

.entry-content a.start-here-button,
.entry-content a.start-here-button:link,
.entry-content a.start-here-button:visited {
    text-decoration: none !important;
    border-bottom: none !important;
    font-weight: bold !important;
  	color: var(--tlr-content-text);
}

.entry-content a.start-here-button:hover,
.entry-content a.start-here-button:focus,
.entry-content a.start-here-button:active {
  background-color: var(--tlr-heading);
}

.start-here-button:active {
    box-shadow: 0 1px 0 var(--tlr-button-shadow);
    transform: translateY(1px);
}

.author-description a {
    text-decoration: none;
    background: var(--tlr-content-bg);
}

.entry-content ol.story-toc {
  font-family: var(--tlr-body-font);
}

.entry-content ul.story-toc-emoji,
.entry-content ul.story-list.has-emoji-markers {
    list-style: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.entry-content ul.story-list.has-emoji-markers,
.entry-content ul.story-list.has-emoji-markers li {
    list-style: none !important;
    list-style-type: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.entry-content ul.story-list.has-emoji-markers li::marker {
    content: "" !important;
}

.entry-content ul.story-list.has-emoji-markers li::before {
    content: none !important;
    display: none !important;
}

.story-toc-emoji,
.story-list.has-emoji-markers {
    list-style: none;
    padding-left: -5px;
  	margin-left: -5px;
}

.story-toc-emoji .story-toc-item,
.story-list-icon {
    margin-left: 0;
    padding-left: 0;
    list-style: none;
}

.story-toc-excerpt,
.reference-toc-excerpt {
  margin-left: 24px;
}

.story-toc-icon, .story-list-icon,
.reference-list-icon {
    display: inline-block;
    width: 1.25em;
}

/* ===============================================================
Navigation
=============================================================== */

#nav .menu li a,
#footer {
    color: var(--tlr-content-text);
}

#nav .menu li a:hover,
#nav .menu li a:focus {
    background: var(--tlr-link);
    color: var(--tlr-content-bg);
}

.continue-reading, 
.continue-reading.cf {
  	background: var(--tlr-link);
    color: var(--tlr-content-bg);
}



#nav .sub-menu li a {
    background-color: #eee;
}

#nav .sub-menu li,
#nav .children li {
    border-bottom: 0 none;
    text-align: center;
}

#nav .menu > .menu-item-has-children > a::after,
#nav .menu > ul > .page_item_has_children > a::after,
#nav .menu > .menu-item-has-children > a:hover::after,
#nav .menu > ul > .page_item_has_children > a:hover::after,
#nav .sub-menu > .menu-item-has-children > a,
#nav .children > .page_item_has_children > a,
#nav .sub-menu > .menu-item-has-children > a:hover,
#nav .children > .page_item_has_children > a:hover {
    content: none;
    background-image: none;
    background-position: initial;
    background-repeat: no-repeat;
}

li.categories {
    list-style-type: none;
    margin-top: 15px;
}

.continue-reading:hover,
.continue-reading:focus {
    background: var(--tlr-content-bg);
  	color: var(--tlr-content-link);
}

/* ===============================================================
Images
=============================================================== */

/* img {
    border: 1px solid var(--tlr-border);
} */

#header img,
.blog-view .entry-thumbnail,
.wp-post-image {
    border: 0 none;
}

#header img {
    padding: 5px 0;
}

img.alignright {
    margin: 0 0 10px 10px;
}

img.alignleft {
    margin: 0 10px 0 10px;
}

.entry-content a:has(img),
#caption a:has(img),
#sidebar a:has(img) {
    text-decoration: none !important;
    border-bottom: 0 !important;
}

/* ===============================================================
Forms
=============================================================== */

input[type="text"],
input[type="email"],
input[type="url"],
textarea,
.wpcf7-validates-as-url {
    width: 100%;
    color: var(--tlr-muted);
}

/* ===============================================================
Archive, post, and page display
=============================================================== */

.archive-description {
    background: none;
    border-top: none;
    padding: 10px 0;
    text-align: justify;
}

.wrap-404-box h2 {
    border-top: none;
    border-left: none;
    border-right: none;
    color: var(--tlr-content-text);
}

.chapter-nav,
.author-note {
    border-top: 1px solid var(--tlr-border);
    padding-top: 10px;
}

.chapter-nav {
    text-align: center;
}

.breadcrumbs,
.slim-seo-breadcrumbs,
.mature-rating, 
.page-breadcrumbs {
    text-align: right;
    font-family: var(--tlr-body-font);
    font-size: 85%;
    margin-top: -10px;
    margin-bottom: 15px;
}


.page-breadcrumbs {
  	font-size:85%;
  	margin-top:-5px;
}

.slim-seo-breadcrumbs {
  	font-size: 100%;
}

.mature-rating {
    font-size: 13px;
}

.mature-rating,
.story-rating-mature {
    color: var(--tlr-danger);
    font-weight: bold;
}

.mature-rating {
    font-style: italic;
}

.post-date {
    font-style: italic;
}

p.ack-after-verse {
    text-align: center;
    font-style: italic;
}

.attribution {
    font-size: 85%;
}

.disclaimer-text {
    text-align: justify;
    hyphens: auto;
}

.blog-post-bottom {
    border-bottom: 1px solid var(--tlr-border);
    margin-top: -2px;
    padding-bottom: 8px;
    clear: both;
}

.blog-post-date {
    float: left;
    margin-top: 0;
    margin-bottom: 15px;
    font-family: var(--tlr-body-font);
    font-size: 85%;
    font-style: italic;
}

.blog-entry-date {
    font-size: 105%;
}

/* ===============================================================
Sidebar and widgets
=============================================================== */

section#quotescollection-2 {
    float: right;
    max-width: 500px;
    padding-right: 25px;
    font-size: 75%;
    font-style: italic;
    text-align: right;
    hyphens: auto;
}

.attribution {
  width: 500px;
  text-align: right;
  padding-right: 35px;
}

.story-details-widget {
    padding-top: 8px;
}

.story-details-widget p {
    margin-bottom: 0;
}

/* ===============================================================
Progress bars
=============================================================== */

div.wppb-progress > span.red {
    background: var(--tlr-heading);
    background: linear-gradient(
        to bottom,
        var(--tlr-link) 0%,
        var(--tlr-link) 10%,
        var(--tlr-heading) 55%,
        var(--tlr-heading) 100%
    );
}

div.wppb-progress > span.green {
    background: var(--tlr-muted-dark);
}

/* ===============================================================
Story and reference components
=============================================================== */


.story-index h3 {
    padding-top: 15px;
}

.story-index {
  margin-top: -15px;
}

.story-pill,
.story-pill:link,
.story-pill:visited,
.story-index summary,
.start-here-button {
    display: inline-block;
    width: auto;
    margin-top: 0.5rem;
    padding: 0.35rem 0.8rem;
    background: var(--tlr-link);
    color: #fff !important;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    font-weight: bold;
    text-decoration: none;
    list-style: none;
    font-family: var(--tlr-body-font);
}

.story-index,
.story-index summary,
.story-list,
.story-list li,
.story-list a {
    font-family: var(--tlr-body-font);
}

.story-index summary::-webkit-details-marker {
    display: none;
}

.story-pill:hover,
.story-pill:focus,
.story-pill:active {
  background-color: var(--tlr-heading);
}

.story-index summary:hover,
.story-index summary:focus,
.start-here-button:hover,
.start-here-button:focus {
    background: var(--tlr-heading);
    color: #fff !important;
}

.ll-story-bottom-nav {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1em;

    margin: 2em 0;
    padding: 0.75em 0;

    border-top: 1px solid #bbb;
    border-bottom: 1px solid #bbb;

    font-family: var(--tlr-body-font);
    font-size: 1rem;
}

.ll-story-bottom-nav a {
    color: var(--tlr-link);
    text-decoration: none;
}

.ll-story-nav-previous {
    justify-self: start;
}

.ll-story-nav-parent {
    justify-self: center;
    text-align: center;
    font-weight: bold;
}

.ll-story-nav-next {
    justify-self: end;
    text-align: right;
}

.ll-story-prev {
    justify-self: start;
}

.ll-story-toc-link {
    justify-self: center;
}

.ll-story-next {
    justify-self: end;
}

.character-grid {
    border-collapse: collapse;
    border: none;
}

.character-grid td,
.character-grid th {
    border: none;
    padding: 10px;
    text-align: center;
    vertical-align: top;
}

.character-grid .wp-caption .wp-caption-text {
    font-size: 100%;
    color: var(--tlr-content-text);
}

.character-credit {
    font-size: 85%;
    font-style: italic;
    color: var(--tlr-muted-dark);
}

/* Character Infobox */

.ll-character-infobox {
    margin-bottom: 8px;
    overflow: auto;
}

.ll-character-infobox-image img,
.ll-character-image {
    max-height: 240px;
    width: auto;
    height: auto;
}

.ll-character-icon {
    display: inline-block;
    width: 1.5em;
  	margin-right: .4em;
  	vertical-align: middle;
}

.ll-character-infobox-facts {
    border-collapse: collapse;
    margin: 0 0 1em;
}

.ll-character-infobox-facts th,
.ll-character-infobox-facts td {
    border: 1px solid #ccc;
    padding: .35em .6em;
    vertical-align: top;
  	font-size: 90%;
  	font-family: var(--tlr-body-font);
}

.ll-character-infobox-facts th {
    width: 1%;
    background: #eee;
    text-align: left;
    white-space: nowrap;
    font-weight: bold;
}

.ll-character-infobox-links {
    margin-top: 0px;
}

.ll-character-infobox-links a {
    margin-right: .5em;
    white-space: nowrap;
}

.ll-character-infobox-content {
  	/* overflow: hidden; */
}

.ll-character-infobox-image {
    margin-left: 1em;
}


.reference-list.has-emoji-markers {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}

.reference-list.has-emoji-markers > li {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}

.reference-list.has-emoji-markers > li::marker {
    content: "";
}

.ll-family-tree,
.ll-family-tree ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ll-family-tree ul {
    margin-left: 1.5em;
}

.ll-family-tree > ul {
    margin-left: 0;
}

.ll-family-tree li {
    position: relative;
    list-style: none;
    margin: 0;
    padding: .25em 0 .25em 1.5em;
}

.ll-family-tree li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    border-left: 1px solid var(--tlr-border-light, #bbb);
}

.ll-family-tree li::after {
    content: "";
    position: absolute;
    left: 0;
    top: .95em;
    width: 1em;
    border-top: 1px solid var(--tlr-border-light, #bbb);
}

.ll-family-tree li:last-child::before {
    bottom: auto;
    height: .95em;
}

.ll-family-tree > ul > li {
    padding-left: 0;
}

.ll-family-tree > ul > li::before,
.ll-family-tree > ul > li::after {
    display: none;
}

.ft-spouse {
  	font-style: italic;
}

.ft-spouse a {
  	color: var(--tlr-content-text);
}

.ft-strike {
  	text-decoration: line-through;
}

/* ===============================================================
Responsive
=============================================================== */

@media (max-width: 700px) {
    .ll-recent-posts-page-grid {
        grid-template-columns: 1fr;
    }
}