:root {
  /* using built-in fonts that vary by platform for faster loading */
  /* https://github.com/system-fonts/modern-font-stacks#transitional */
  --streetsmn-font-serif: Charter, "Bitstream Charter", "Sitka Text", Cambria,
    serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol",
    "Noto Color Emoji";
  /* system-ui, then https://github.com/system-fonts/modern-font-stacks#neo-grotesque */
  --streetsmn-font-sans-serif: system-ui, Inter, Roboto, "Helvetica Neue",
    "Arial Nova", "Nimbus Sans", Arial, sans-serif, "Apple Color Emoji",
    "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-sans-serif: var(--streetsmn-font-sans-serif);

  --streetsmn-color-blue: #2f7ad3;
  --streetsmn-color-blue-text: #000;
  --streetsmn-color-blue-text-rgb: 0, 0, 0;
  --streetsmn-color-green: #55ac3a;
  --streetsmn-color-green-text: #000;
  --streetsmn-color-green-text-rgb: 0, 0, 0;
  --streetsmn-color-orange: #e37130;
  --streetsmn-color-orange-text: #000;
  --streetsmn-color-orange-text-rgb: 0, 0, 0;
  --streetsmn-color-yellow: #fcde02;
  --streetsmn-color-yellow-text: #000;
  --streetsmn-color-yellow-text-rgb: 0, 0, 0;
}

[data-bs-theme="dark"] {
  --bs-body-color: #f3f4f5;
  --bs-body-color-rgb: 243, 244, 245;
  --bs-dark: #18181b;
  /* make the body bg darker, and darken secondary and tertiary bg a smidge to match */
  --bs-body-bg: #18181b;
  --bs-body-bg-rgb: 24, 24, 27;
  --bs-secondary-bg: #32383e;
  --bs-secondary-bg-rgb: 50, 56, 62;
  --bs-tertiary-bg: #292e33;
  --bs-tertiary-bg-rgb: 41, 46, 51;

  --streetsmn-color-blue: #1061b2;
  --streetsmn-color-blue-text: #fff;
  --streetsmn-color-blue-text-rgb: 255, 255, 255;
  --streetsmn-color-green: #3b7c21;
  --streetsmn-color-green-text: #fff;
  --streetsmn-color-green-text-rgb: 255, 255, 255;
  --streetsmn-color-orange: #aa4d1f;
  --streetsmn-color-orange-text: #fff;
  --streetsmn-color-orange-text-rgb: 255, 255, 255;
  --streetsmn-color-yellow: #d8ba09;
  --streetsmn-color-yellow-text: #000;
  --streetsmn-color-yellow-text-rgb: 0, 0, 0;
}

body {
  font-family: var(--streetsmn-font-sans-serif);
}

.wrapper {
  padding-left: env(safe-area-inset-left, 0);
  padding-right: env(safe-area-inset-right, 0);
}

.container-content {
  max-width: 72ch;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  text-wrap: balance;
  text-wrap: pretty;
}

/* ensure twentytwelve assistive styles are present */
.assistive-text,
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  word-wrap: normal !important;
  border: 0;
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

h1 {
  margin-bottom: 1rem;
}

.entry-header {
  margin-bottom: 1.5rem;
}

.entry-header img {
  height: auto;
  width: 100%;
  object-fit: cover;
}

body:is(.search, .category, .archive) .post .entry-header {
  margin-bottom: 0.5rem;
}

.entry-author {
  font-weight: bold;
}

.post .entry-summary {
  font-family: var(--streetsmn-font-serif);
}

.post .entry-content {
  font-family: var(--streetsmn-font-serif);
  font-size: 1.125rem;
}

.post .entry-content :is(h2, h3, h4, h5, h6) {
  font-family: var(--streetsmn-font-serif);
}

.featured-image-caption {
  padding-top: 0.5rem;
  color: var(--bs-secondary-color);
  font-weight: normal;
  font-style: italic;
  font-size: 0.8125rem;
  line-height: 2;
}

/*
 * .wp-block-gallery uses an overlay and needs to always be its set color.
 * adding the :not() here also increases the specificity of the rule so that
 * we don't need to use !important
 */
[class^="wp-block-"]:not(.wp-block-gallery) figcaption {
  color: var(--bs-secondary-color);
}

.article-map {
  border: 0;
  height: 22rem;
  width: 100%;
  /* to show that content will load */
  background: var(--bs-secondary-bg);
}

.jp-relatedposts {
  font-family: var(--streetsmn-font-sans-serif);
}

/* contributors-page.php */
.contributors-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(21rem, 100%), 1fr));
  gap: 1.5rem;
}

.author-avatar img {
  border-radius: var(--bs-border-radius);
}

/* header */
#site-navigation {
  padding-top: env(safe-area-inset-top, 0);
  padding-left: env(safe-area-inset-left, 0);
  padding-right: env(safe-area-inset-right, 0);
}
.navbar form.input-group {
  width: auto;
}
/* kind of like .navbar-nav */
.navbar ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  --bs-nav-link-padding-x: 0;
  --bs-nav-link-padding-y: 0.5rem;
  --bs-nav-link-font-weight: ;
  --bs-nav-link-color: var(--bs-navbar-color);
  --bs-nav-link-hover-color: var(--bs-navbar-hover-color);
  --bs-nav-link-disabled-color: var(--bs-navbar-disabled-color);
}

.navbar li > a {
  display: block;
  padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
  font-size: var(--bs-nav-link-font-size);
  font-weight: var(--bs-nav-link-font-weight);
  color: var(--bs-nav-link-color);
  text-decoration: none;
  background: none;
  border: 0;
}

.navbar li > a:hover {
  color: var(--bs-nav-link-hover-color);
}

@media (min-width: 768px) {
  .navbar ul {
    flex-direction: row;
  }

  .navbar li > a {
    padding-right: var(--bs-navbar-nav-link-padding-x);
    padding-left: var(--bs-navbar-nav-link-padding-x);
  }
}

/* search */
.search-submit-button {
  /* this color matches the navbar link color */
  color: rgba(var(--bs-emphasis-color-rgb), 0.65);
  /* lighten the border to match the input and not draw so much attention to the search button */
  border-color: var(--bs-border-color);
}

/* footer */
#colophon {
  padding-bottom: env(safe-area-inset-bottom, 0);
  padding-left: env(safe-area-inset-left, 0);
  padding-right: env(safe-area-inset-right, 0);
}

body.logged-in #colophon li.login {
  display: none;
}

body:not(.logged-in) #colophon li.logout {
  display: none;
}

/* we cannot set the class name on these elements :( */
.footer-nav-menu .menu-item {
  /* .mb-2 */
  margin-bottom: 0.5rem;
}

.footer-nav-menu .menu-item a {
  /* adapted from .nav-link but removed padding, color, and transition */
  display: block;
  font-size: var(--bs-nav-link-font-size);
  font-weight: var(--bs-nav-link-font-weight);
  text-decoration: none;
  background: none;
  border: 0;

  /* .text-body-secondary */
  --bs-text-opacity: 1;
  color: var(--bs-secondary-color);
}

.site-share-page {
  --bs-btn-border-radius: 5em;
  position: fixed;
  bottom: calc(env(safe-area-inset-bottom) + 20px);
  right: calc(env(safe-area-inset-right) + 20px);
  aspect-ratio: 1;
}

/* twentytwelve_content_nav() */
nav.navigation {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

nav.navigation#nav-above {
  padding-bottom: 1rem;
  border-bottom: var(--bs-border-width) var(--bs-border-style)
    var(--bs-border-color);
}

nav.navigation#nav-below {
  padding-top: 1rem;
  border-top: var(--bs-border-width) var(--bs-border-style)
    var(--bs-border-color);
}

/* Comments */
#comments {
  margin-top: 3rem;
}

#comments .comment-author cite > span:not(.flag) {
  background: var(--bs-success);
  color: #fff;
  padding: 0.125rem 0.25rem;
  font-style: normal;
  font: 0.75rem var(--streetsmn-font-headline);
  margin: 0 0.75rem;
  text-transform: uppercase;
}

#comments .comment-content {
  word-break: break-word;
  overflow: hidden;
}

#comments .comment-content img,
#comments .comment-content iframe {
  max-width: 100%;
}

#comments .comments-title {
  font-family: var(--streetsmn-font-headline);
}

ol.commentlist {
  list-style: none;
  padding-left: 0;
}

ol.commentlist > li {
  margin: 1.75rem 0;
  padding: 0.75rem;
}

ol.commentlist > li .comment-meta img {
  float: right;
  padding: 0.75rem;
}

ol.commentlist > li .comment-meta a {
  color: var(--bs-secondary-text-emphasis);
  border-bottom: 0;
  font-size: 0.75rem;
}

ol.commentlist > li .comment-meta time {
  margin-left: 0.75rem;
}

ol.commentlist > li ol {
  list-style: none;
  padding-left: 1.25rem;
}

ol.commentlist > li li {
  padding: 0.75rem;
}

ol.commentlist .reply {
  text-align: right;
}

.comment.odd {
  background: var(--bs-secondary-bg);
}

/*
 * in content styles, these are generally set by the block editor and
 * difficult to track down
 */
.wp-caption {
  max-width: 100%;
}

.wp-caption.alignnone {
  margin: 0.9375rem 0;
}

.wp-caption.alignleft {
  clear: left;
  float: left;
  margin: 0.9375rem 0.9375rem 0.9375rem 0;
}

.wp-caption.alignright {
  clear: right;
  float: right;
  margin: 0.9375rem 0 0.9375rem 0.9375rem;
}

.wp-caption .wp-caption-text {
  margin: 0;
  padding-top: 0.75rem;
  font-size: 0.857142857rem;
  line-height: 2;
  font-style: italic;
  text-align: left;
  color: var(--bs-secondary-color);
}

iframe {
  max-width: 100%;
}

/* taxonomy */
body:is(.search, .category, .archive) article {
  margin-bottom: 7rem;
}

/*
 * home
 */

body.page-template-front-page .home-section {
  margin-bottom: 3rem;
}

body.page-template-front-page .front-widgets {
  /* default to black, but allow overriding by setting `--widget-link-rgb` */
  --widget-link-rgb: var(--bs-black-rgb);
  color: rgb(var(--widget-link-rgb));
  padding-top: 1rem;
  padding-bottom: 1rem;
}

body.page-template-front-page .front-widgets a {
  --bs-link-color-rgb: var(--widget-link-rgb);
  --bs-link-underline-opacity: 0.25;
  text-underline-offset: 0.25rem;
  text-decoration-color: rgba(
    var(--bs-link-color-rgb),
    var(--bs-link-underline-opacity, 1)
  );
}

body.page-template-front-page .front-widgets a:hover {
  --bs-link-underline-opacity: 1;
}

body.page-template-front-page .front-widgets.first {
  background: var(--streetsmn-color-blue);
  --widget-link-rgb: var(--streetsmn-color-blue-text-rgb);
}

body.page-template-front-page .front-widgets.second {
  background: var(--streetsmn-color-orange);
  --widget-link-rgb: var(--streetsmn-color-orange-text-rgb);
}

body.page-template-front-page .front-widgets.third {
  background: var(--streetsmn-color-green);
  --widget-link-rgb: var(--streetsmn-color-green-text-rgb);
}

body.page-template-front-page .home-tag {
  font-weight: bold;
}

body.page-template-front-page .home-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(20rem, 100%), 1fr));
  column-gap: 1.5rem;
  row-gap: 2.5rem;
}
body.page-template-front-page .home-grid--small {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr));
  column-gap: 1rem;
  row-gap: 2rem;
}

body.page-template-front-page .article-inline {
  display: flex;
  flex-flow: row wrap;
  column-gap: 1rem;
}
body.page-template-front-page .article-inline .article-inline-left {
  flex: 1 1 18rem;
}
body.page-template-front-page .article-inline .article-inline-right {
  flex: 1 1 50%;
}

body.page-template-front-page .home-article-title a {
  color: var(--bs-body-color);
  text-decoration: none;
}
body.page-template-front-page .home-article-title a:hover {
  color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
  text-decoration: underline;
}

body.page-template-front-page .home-article-image {
  margin-bottom: 0.75rem;
}

body.page-template-front-page .home-article-image img {
  display: block;
  height: 100%;
  width: 100%;
  object-fit: cover;
  /* 1200/630, our ideal feature image size */
  aspect-ratio: 1.91;
}

body.page-template-front-page .home-article .entry-author {
  margin-bottom: 0.5rem;
}

/* donations */
form[id*="give-form"] .give-donation-amount #give-amount,
form[id*="give-form"] .give-donation-amount #give-amount-text,
form[id*="give-form"] #give-final-total-wrap .give-final-total-amount {
  color: var(--bs-black);
}

#give-recurring-form .give-tooltip,
form.give-form .give-tooltip,
form[id*="give-form"] .give-tooltip {
  color: var(--bs-body-color);
}

#give-recurring-form .give-tooltip:hover,
form.give-form .give-tooltip:hover,
form[id*="give-form"] .give-tooltip:hover {
  color: var(--bs-body-color);
}

/* post bottom widget */
.post-bottom-widget {
  background: var(--streetsmn-color-yellow);
  --widget-link-rgb: var(--streetsmn-color-yellow-text-rgb);
  color: rgb(var(--widget-link-rgb));
}

.post-bottom-widget a {
  --bs-link-color-rgb: var(--widget-link-rgb);
  --bs-link-underline-opacity: 0.25;
  text-underline-offset: 0.25rem;
  text-decoration-color: rgba(
      var(--bs-link-color-rgb),
      var(--bs-link-underline-opacity, 1)
  );
}

.post-bottom-widget a:hover {
  --bs-link-underline-opacity: 1;
}

/* gsc search */
.gsc-control-cse {
  border-radius: var(--bs-border-radius);
}

#content .gsc-control-cse,
#content .gsc-control-cse .gsc-table-result {
  font-family: var(--streetsmn-font-sans-serif);
}

.gsc-control-cse ::selection {
  background-color: #b3d4fb;
}

input.gsc-input, .gsc-input-box, .gsc-input-box-hover, .gsc-input-box-focus {
  background: var(--bs-white);
  color: var(--bs-dark);
}

.gsc-completion-container {
  color: var(--bs-dark);
}

/* ads */
.global-ad {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bs-body-bg);
  max-width: 100%;
  overflow: hidden;
}
.global-ad > * {
  margin-block: 1rem;
}

.above-header-ad {
  background: var(--bs-secondary-bg);
}

.above-header-ad > * {
  max-width: 970px;
  max-height: 90px;
  width: 100%;
  height: 90px;
}

.medium-rectangle-ad > * {
  width: 100%;
  height: 280px;
  max-width: 300px;
  max-height: 280px;
}

ins.adsbygoogle[data-ad-status="unfilled"] {
  display: none !important;
}