/*
Theme Name: Knock LA - 2020

Author: Knock LA
Author URI: https://knock-la.com
Version: 1.0
Requires at least: 5.4
Text Domain: knock-la

*/

@import url("//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css");
@import url("shared.css");

/* Resets and Boilerplates  */
* {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
  display: block;
}
audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}
audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

audio:not([controls]) {
  display: none;
}
[hidden] {
  display: none;
}

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  font-size: 1em;
  line-height: 1.4;
}

a {
  text-decoration: none;
  outline: none;
}
a:hover,
a:active {
  outline: 0;
}

img {
  border: 0;
  -ms-interpolation-mode: bicubic;
  vertical-align: middle;
}

/* FORMS */

label {
  cursor: pointer;
}
button[disabled],
input[disabled] {
  cursor: default;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  cursor: pointer;
  -webkit-appearance: button;
  *overflow: visible;
}

/* * Consistent box sizing and appearance */
input {
  border-radius: 0;
}

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
  *width: 13px;
  *height: 13px;
}
input[type="search"] {
  -webkit-appearance: none;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
} /* Remove inner padding and border in FF3/4: h5bp.com/l */
textarea {
  overflow: auto;
  vertical-align: top;
  resize: vertical;
} /* * 1. Remove default vertical scrollbar in IE6/7/8/9 * 2. Allow only vertical resizing */

.button {
  line-height: 1;
}

.hide {
  display: none !important;
  visibility: hidden;
}
hr.foot {
  border: 0px;
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0px;
  margin: 0;
  padding: 0;
  height: 0px;
}

::-moz-selection {
  color: var(--main-text-color);
  background: var(--color-seafoam);
  text-shadow: none;
}
::selection {
  color: var(--main-text-color);
  background: var(--color-seafoam);
  text-shadow: none;
}
a:link {
  -webkit-tap-highlight-color: var(--color-seafoam);
  text-shadow: none;
}

.left,
.alignleft {
  float: left;
}
.right,
.alignright {
  float: right;
}
.aligncenter {
  margin: 0 auto;
  display: block;
}

a {
  color: var(--main-text-color);
}
a:hover {
  color: var(--main-link-color);
}

img,
embed,
iframe,
object {
  max-width: 100%;
  height: auto;
}

body {
  color: var(--main-text-color);
  background: var(--main-background-color);
  font-size: var(--main-font-size);
  font-family: var(--content-font-family);
  letter-spacing: 0.012em;
  margin-top: 2rem;
}

.button,
.wp-block-button a,
.wp-block-button__link {
  font-family: var(--headline-font-family);
}

nav {
  font-family: var(--headline-font-family);
}

/* Layout */
#container {
  margin: 0 auto;
}

section {
  padding: 0 1.6rem;
  max-width: var(--main-content-width);
}

.wrapper {
  max-width: var(--main-content-width);
  margin: 0 auto;
  box-sizing: border-box;
  width: calc(100% - var(--content-bottom-margin));
  position: relative;
}

/* Header */
header {
  margin-bottom: var(--content-bottom-margin);
  display: flex;
}
body.single header,
body.page:not(.home) header {
  margin-bottom: calc(2 * var(--content-bottom-margin));
}

header .wrapper > * {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

header .wrapper div + div {
  border-top: 1px solid #979797;
  margin-top: 1rem;
  padding-top: 1.5rem;
}

header h1 {
  margin-bottom: 0;
}
header h1 a {
  display: block;
  background: white;
  padding: 0.5rem;
  margin-left: -0.5rem;
  border-radius: 2px;
}
header h1 a span {
  display: none;
}

header h1 a:hover {
  background-color: var(--color-knock-red);
}
/* header h1 a svg {transition: .3s ease-in-out all;} */
header h1 a svg #KNOCKLA-text-KNOCK {
  font-size: 48px;
}
header h1 a svg .KNOCKLA-text-litter-letter {
  font-size: 30px;
}

/*header h1 a:hover svg {transform: scale(1.05);} */
header h1 a:hover svg #logo-h1-wrapper {
  fill: var(--color-white);
}

@media (prefers-color-scheme: dark) {
  header h1 a {
    background-color: var(--main-background-color);
  }

  header h1 a svg #logo-h1-wrapper {
    fill: var(--color-white);
  }

  header h1 a:hover {
    background-color: var(--color-knock-red);
  }
}

#menu-site-menu li a {
  font-weight: 600;
  font-size: 0.8125rem;
  padding: 10px;
  color: var(--main-text-color);
  text-transform: none;
  border-bottom: 2px solid transparent;
  letter-spacing: 0;
}

#header-fundraise-button {
  border-radius: 2px;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 2;
  vertical-align: middle;
  padding: 0.2rem 0.5rem 0;
  letter-spacing: 0.1em;
  background-color: var(--button-background-color);
  color: var(--button-foreground-color);
  border: 2px var(--button-background-color) solid;
  transition: ease-out 0.3s background-color;
}

#header-fundraise-button:hover {
  background-color: var(--button-foreground-color);
  color: var(--button-background-color);
  border: 2px solid;
}

.single-post #header-fundraise-button {
  position: sticky;
  top: 0;
}

@media (prefers-color-scheme: dark) {
  #header-fundraise-button {
    background-color: var(--color-knock-red);
    color: var(--color-white);
    border: 2px var(--color-knock-red) solid;
  }

  #header-fundraise-button:hover {
    background-color: var(--color-white);
    color: var(--color-knock-red);
    border: 2px transparent solid;
  }
}

header #header-search-form {
  position: relative;
  display: flex;
}

header #header-search-form form {
  display: flex;
  position: absolute;
  top: -10px;
  right: 0;
  z-index: 1;
  opacity: 0;
  right: 35px;
  background: rgba(255, 255, 255, 0.8);
  border: var(--main-background-color) 2px solid;
  border-radius: 3px;
  padding: 5px;
  pointer-events: none;
  transition: ease-out 0.3s opacity;
}

header #header-search-form:hover form {
  opacity: 1;
  pointer-events: all;
}

header #header-search-form form > * {
  margin: 5px;
}

header #header-search-form form label span {
  display: none;
}

header #header-search-form #header-search-button {
  border-radius: 2px;
  font-weight: 600;
  text-transform: uppercase;
  line-height: 2;
  vertical-align: middle;
  padding: 0.2rem 0.5rem 0;
}

@media (prefers-color-scheme: dark) {
  header #header-search-form input {
    color: var(--color-blackout);
  }

  header #header-search-form #header-search-button svg #Desktop {
    stroke: var(--main-text-color);
  }
}

#mobile-nav-container {
  display: none;
}

header .header-menus {
  flex-grow: 1;
  justify-content: space-between;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}

header nav {
}
header nav ul {
  display: flex;
  list-style: none;
  justify-content: flex-start;
  margin-left: -10px; /* If the final nav is left aligned */
}
header nav li {
}
header nav a {
  padding: 8px 10px;
  color: var(--main-text-color);
  /*text-transform: uppercase; - Getting rid of the uppercase because it looks clunky */
  display: block;
}
header .header-menus nav a {
  font-weight: 500;
  font-size: 0.8125rem;
  padding: 10px;
  color: var(--color-knock-red);
  text-transform: uppercase;
  border-bottom: 2px solid transparent;
}
header .header-menus nav a:hover {
  color: var(--color-blue);
}

@media (prefers-color-scheme: dark) {
  header .header-menus nav a {
    color: var(--color-seafoam);
  }

  header .header-menus nav a:hover {
    color: var(--main-text-color);
  }
}

header .header-menus nav#main-header-menu .menu-title {
  font-weight: 700;
  font-size: 0.8125rem;
  padding: 10px;
  /* color: var(--color-knock-red); */
  text-transform: uppercase;
}

/*
@media (prefers-color-scheme: dark) {
  header .header-menus nav#main-header-menu .menu-title {
    color: var(--color-seafoam);
  }
}
*/

[id*="social"] a {
  padding-top: 8px;
}

[id*="social"] .logopath {
  fill: var(--color-knock-red);
}
[id*="social"] a:hover .logopath {
  fill: var(--main-link-color);
}
[id*="social"] a[href*="instagram"]:hover .logopath {
  fill: #a3069b;
}

[id*="social"] a[href*="twitch"]:hover .logopath {
  fill: #6441a4;
}

[id*="social"] a[href*="youtube"]:hover .logopath {
  fill: #ff0000;
}

@media (prefers-color-scheme: dark) {
  [id*="social"] .logopath {
    fill: var(--color-seafoam);
  }

  [id*="social"] a:hover .logopath {
    fill: var(--color-blue);
  }
}

#toggle-mobile-nav {
  display: none;
  pointer-events: none;
}

#toggle-mobile-nav #Hamburger {
  stroke: var(--main-text-color);
}

.post-template-page_full-bleed-header:not(.navigationShown) #toggle-mobile-nav g#Hamburger,
.page-template-page_full-bleed-header:not(.navigationShown) #toggle-mobile-nav g#Hamburger {
  stroke: var(--color-white);
}

.post-template-page_full-bleed-header.navigationShown) #toggle-mobile-nav g#Hamburger,
.page-template-page_full-bleed-header.navigationShown) #toggle-mobile-nav g#Hamburger {
  stroke: var(--color-black);
}

#main {
}
/* Front Page */

/* Section Layouts */
.wp-block-latest-posts.is-grid {
  justify-content: space-between;
}
.wp-block-latest-posts.is-grid li {
  margin: 0;
}

ul.wp-block-latest-posts:not(.wp-block-knockla-recent-posts) li a {
  display: block;
}

ul.wp-block-latest-posts.wp-block-knockla-recent-posts li a {
  color: inherit;
}

ul.wp-block-latest-posts li .wp-block-latest-posts__post-primary-tag {
  text-transform: uppercase;
  font-weight: 500;
  font-size: 0.8125rem;
  padding: 10px 0;
  color: var(--color-black);
  text-transform: uppercase;
  border-bottom: 2px solid transparent;
  font-family: var(--headline-font-family);
  display: block;
}

ul.wp-block-latest-posts li .wp-block-latest-posts__post-title {
  font-size: var(--content-headline-listings-font-size);
  color: var(--color-black);
  letter-spacing: 0;
  line-height: 1.375rem;
  font-family: var(--headline-font-family);
  font-weight: 500;
  display: block;
  margin-bottom: 9px;
  margin-right: 0.5rem;
  text-decoration: none;
}

ul.wp-block-latest-posts li a:hover .wp-block-latest-posts__post-title {
  text-decoration: underline;
}

ul.wp-block-latest-posts li .wp-block-latest-posts__featured-image {
  margin-bottom: 0.3157894737rem;
}

ul.wp-block-latest-posts li .wp-block-latest-posts__featured-image img {
  width: 100%;
  max-width: 100%;
  height: auto;
}

ul.wp-block-latest-posts li .wp-block-latest-posts__featured-image + .wp-block-latest-posts__post-title {
  margin-top: 1rem;
}

ul.wp-block-latest-posts li .wp-block-latest-posts__post-author {
  margin-bottom: 0.3157894737rem;
  font-family: var(--headline-font-family);
}
ul.wp-block-latest-posts li .wp-block-latest-posts__post-author:before {
  content: "By ";
}

ul.wp-block-latest-posts li .wp-block-latest-posts__post-date {
  margin-bottom: 0.3157894737rem;
  font-family: var(--headline-font-family);
}

.wp-block-latest-posts__post-subtitle {
  font-size: 0.875rem;
  color: var(--color-mid-gray);
  letter-spacing: 0;
  line-height: 1.375rem;
}

.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-subtitle li {
  margin-bottom: 2rem;
}

.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-subtitle li > *,
.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-subtitle li a > * {
  display: inline;
  font-family: var(--headline-font-family);
}

.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-excerpt li > * {
  font-family: var(--headline-font-family);
}

.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-excerpt .wp-block-latest-posts__post-date,
.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-excerpt .wp-block-latest-posts__post-author,
.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-subtitle .wp-block-latest-posts__post-date,
.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-subtitle .wp-block-latest-posts__post-author {
  font-size: 0.8125rem;
  color: var(--color-knock-red);
  letter-spacing: 0;
  font-weight: 550;
  display: inline;
}

@media (prefers-color-scheme: dark) {
  .wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-subtitle .wp-block-latest-posts__post-date,
  .wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-subtitle .wp-block-latest-posts__post-author {
    color: var(--color-seafoam);
  }
}

.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-subtitle .wp-block-latest-posts__post-author:before {
  content: " | ";
}

.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-subtitle .wp-block-latest-posts__post-author:after {
  content: "";
  display: block;
}

.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-subtitle .wp-block-latest-posts__post-title {
  line-height: 1.375rem;
}
.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-subtitle .wp-block-latest-posts__post-excerpt {
  font-size: var(--content-headline-listings-font-size);
}

.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-subtitle .wp-block-latest-posts__post-subtitle {
  font-size: 1.1875rem;
  line-height: 1.375rem;
  font-weight: 300;
}
.wp-block-latest-posts.wp-block-latest-posts__list.has-dates.has-author.is-style-date-byline-title-subtitle .wp-block-latest-posts__post-subtitle:before {
  content: " ";
}

ul.wp-block-latest-posts li .wp-block-latest-posts__post-excerpt {
  font-size: 0.9rem;
  color: #7b7b7b;
  letter-spacing: 0;
  line-height: 1.4rem;
}

.wp-block-cover,
.wp-block-cover-image {
  box-sizing: border-box;
}

.wp-block-group.has-background {
  padding: var(--content-bottom-margin);
}

.wp-block-separator.has-text-color.has-background.has-text-white-background-color.has-text-white-color {
  border-top: 1px solid white;
  margin-bottom: 0.5rem;
}

.wp-block-separator.has-text-color.has-background.has-text-black-background-color.has-text-black-color {
  border-top: 1px solid var(--color-black);
  margin-bottom: 0.5rem;
}

/* Podcast Block */
.podcast-block .wp-block-column {
  flex: auto auto auto;
}
.podcast-block .wp-block-column:not(:first-child) {
  margin-left: 0;
}
.podcast-block h4 {
  font-weight: 300;
  font-size: 1rem;
  margin-bottom: 0;
}
.podcast-block h3 {
  font-weight: 300;
  font-size: 1.3684210526rem;
  line-height: 1.6842105263rem;
}

.podcast-block .has-text-white-color a {
  color: var(--color-white);
}
.podcast-block .has-text-white-color a:hover {
  color: var(--color-seafoam);
}

/* Topic Roll */

.wp-block-knock-la-topic-roll h4 {
  text-transform: uppercase;
  letter-spacing: 0.3em;
  font-weight: 200;
  font-size: 1.6rem;
  padding-right: calc(1 * var(--content-bottom-margin));
}

.wp-block-knock-la-topic-roll ul li {
  padding: 0 10px;
}
.wp-block-knock-la-topic-roll ul li a {
  list-style: none;
  padding: 10px 10px 8px;
  color: white;
  border-radius: 2px;
  background-color: var(--color-blue);
  font-family: var(--headline-font-family);
  border: 2px solid;
  font-weight: 300;
}

.wp-block-knock-la-topic-roll ul li a:hover {
  background-color: var(--color-white);
  color: var(--color-blue);
  border: 2px var(--color-blue) solid;
}

/* Article Style */
article {
  position: relative;
}

.page article.page {
  margin-bottom: calc(3 * var(--content-bottom-margin));
}

/* Sticky Fundraise Button */

body:not(.single-post) #article-content-fundraise-button-wrapper {
  display: none;
}

#article-content-fundraise-button-wrapper {
  max-width: var(--main-content-width);
  margin: 0 auto var(--content-bottom-margin);
  width: 100vw;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  transition: ease-out 0.3s opacity;
}

#article-content-fundraise-button-wrapper.show {
  opacity: 1;
  pointer-events: all;
}

#article-content-fundraise-button svg {
  width: 58px;
  height: 58px;
  margin: 0 auto 0.5em;
  display: block;
}

#article-content-fundraise-button svg #Hand {
  fill: var(--button-foreground-color);
}

#article-content-fundraise-button {
  border-radius: 0px;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 2;
  vertical-align: middle;
  background-color: var(--button-background-color);
  color: var(--button-foreground-color);
  border: 2px var(--button-background-color) solid;
  position: fixed;
  top: var(--content-bottom-margin);
  padding: 0.4em 0.5rem;
  z-index: 3;
  text-align: center;
  max-width: 130px;
  box-sizing: border-box;
}

#article-content-fundraise-button .button-description {
  font-family: var(--content-font-family);
  display: inline-block;
  text-transform: none;
  font-size: 0.7rem;
  line-height: 0.9rem;
  font-style: italic;
  letter-spacing: 0.04em;
}

#article-content-fundraise-button .button-label {
  display: block;
  letter-spacing: 0.1em;
}

#article-content-fundraise-button:hover {
  background-color: var(--color-knock-rust);
  color: var(--button-foreground-color);
  border-color: var(--color-knock-rust);
}

@media (max-width: 720px) {
  #article-content-fundraise-button-wrapper {
    background-color: var(--button-background-color);
    color: white;
    top: 0;
    position: fixed;
    z-index: 3;
    margin: 0;
    padding: 0;
  }

  #article-content-fundraise-button {
    position: static;
    border: none;
    border-right: none;
    padding: 1em 0.75em;
    display: flex;
    max-width: 100vw;
    align-items: center;
    align-content: center;
    line-height: 1;
    box-sizing: border-box;
  }
  #article-content-fundraise-button:hover {
    border: none;
    border-right: none;
  }

  #article-content-fundraise-button > *,
  #article-content-fundraise-button svg,
  #article-content-fundraise-button .button-label,
  #article-content-fundraise-button .button-description {
    display: block;
    margin: 0 0.5em 0 0;
    line-height: 1;
  }

  #article-content-fundraise-button svg {
    width: 24px;
    height: 24px;
    order: 1;
  }

  #article-content-fundraise-button .button-label {
    order: 2;
  }
  #article-content-fundraise-button .button-description {
    order: 3;
  }
}

/* Article Header */
.single .article-header,
.page .article-header {
  max-width: var(--content-content-width);
  margin: 0 auto var(--content-bottom-margin);
  width: calc(100% - var(--content-bottom-margin));
  position: relative;
}

.article-header .article-header-content {
  width: 100%;
}

.article-header .article-title {
  font-size: 2.5rem;
  font-weight: 600;
  line-height: 3rem;
  letter-spacing: 0;
  margin-bottom: calc(0.5 * var(--content-bottom-margin));
}

.article-header .article-subtitle {
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 140%;
  color: var(--color-mid-gray);
  margin-bottom: calc(0.25 * var(--content-bottom-margin));
}

.article-header .article-tax {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  border-bottom: 1px var(--color-knock-red) solid;
  margin-bottom: calc(1 * var(--content-bottom-margin));
}

@media (prefers-color-scheme: dark) {
  .article-header .article-tax {
    border-bottom: 1px var(--color-seafoam) solid;
  }
}

.article-header .article-header-tags {
  order: 2;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 0;
}

.article-header .article-header-tags > a {
  text-transform: uppercase;
  font-weight: 500;
  font-size: 0.8125rem;
  padding: 0.6rem 0.6rem 0.5rem;
  color: var(--color-black);
  text-transform: uppercase;
  font-family: var(--headline-font-family);
  display: block;
}

.article-header .article-header-tags > a:hover {
  color: var(--color-white);
  background: var(--color-knock-red);
}

@media (prefers-color-scheme: dark) {
  .article-header .article-header-tags > a:hover {
    color: var(--color-blackout);
    background: var(--color-seafoam);
  }
}

.article-header .article-header-tags > h6 {
  line-height: 1;
  font-weight: 400;
  margin: 0;
  letter-spacing: 0.3em;
  color: var(--color-white);
  background: var(--color-mid-gray);
}

.article-header .article-tax a.the-primary-tag {
  order: 1;
  display: block;
  font-weight: 550;
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 0.2rem;
  color: inherit;
  border: 1px solid var(--color-knock-red);
  border-bottom: 0;
  color: var(--color-knock-red);
  margin: 0;
  line-height: 1rem;
  padding: 0.7rem 0.6rem 0.56rem;
  vertical-align: bottom;
  font-family: var(--headline-font-family);
}

.article-header .article-tax a.the-primary-tag:hover {
  color: var(--color-white);
  background: var(--color-knock-red);
}

@media (prefers-color-scheme: dark) {
  .article-header .article-tax a.the-primary-tag {
    border: 1px solid var(--color-seafoam);
    color: var(--color-seafoam);
  }
  .article-header .article-tax a.the-primary-tag:hover {
    color: var(--color-blackout);
    background: var(--color-seafoam);
  }
}

.article-header .article-authors,
.article-header .article-date {
  font-size: 1rem;
  display: inline;
}
.article-header .article-authors a,
.article-header .article-date a {
  border-bottom: 2px solid;
}

.byline {
  font-family: var(--headline-font-family);
}
.byline a {
  color: inherit;
}

/* Article Content */

.article-content {
  clear: both;
  margin: 0 auto;
  font-size: var(--main-font-size);
  line-height: 1.625;
  font-weight: var(--content-font-weight);
}
.article-content > p:not([class*="wp-block"]),
.article-content > ul:not([class*="wp-block"]),
.article-content > ol:not([class*="wp-block"]),
.article-content > blockquote:not([class*="wp-block"]),
.article-content > img:not([class*="wp-block"]),
.article-content > figure:not([class*="wp-block"]) {
  margin-bottom: var(--content-bottom-margin);
}
.article-content p {
}
.article-content ul:not([class*="block"]),
.article-content ol:not([class*="block"]) {
  padding-left: var(--content-bottom-margin);
  box-sizing: border-box;
}
.article-content blockquote {
  /*  font-family: serif; */
  padding: 0 var(--content-bottom-margin);
  box-sizing: border-box;
}
.article-content img {
  max-width: 100%;
}

.article-content > p:not([class*="wp-block"]) a,
.article-content > ul:not([class*="wp-block"]) a,
.article-content > ol:not([class*="wp-block"]) a,
.article-content > blockquote:not([class*="wp-block"]) a,
.article-content > img:not([class*="wp-block"]) a,
.article-content > figure:not([class*="wp-block"]) a,
.article-content figcaption a,
.article-content .c-accordion__content a {
  text-decoration: underline;
  color: var(--main-link-color);
}

.article-content .show-links a {
  text-decoration: underline;
}

.article-content > p:not([class*="wp-block"]) a:hover,
.article-content > ul:not([class*="wp-block"]) a:hover,
.article-content > ol:not([class*="wp-block"]) a:hover,
.article-content > blockquote:not([class*="wp-block"]) a:hover,
.article-content > img:not([class*="wp-block"]) a:hover,
.article-content > figure:not([class*="wp-block"]) a:hover,
.article-content .c-accordion__content a:hover,
.article-content .show-links a:hover {
  text-decoration: none;
}

.article-content .wp-block-button__link {
  font-family: var(--headline-font-family);
  text-decoration: none;
  border: 2px solid transparent;
}

.article-content a.wp-block-button__link:hover {
  font-family: var(--headline-font-family);
  text-decoration: none;
  border: 2px solid;
}

.article-content figure.wp-block-image img {
  margin-bottom: 0.3em;
}

.article-content figcaption {
  font-style: italic;
  font-size: 0.875em; /* 0.6em */
  line-height: 1.5;
  text-align: center;
}

.article-content figure.sensitive {
  position: relative;
}

.article-content figure.sensitive .senstive-warning {
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.9);
  display: flex;
  align-content: center;
  align-items: center;
  justify-content: center;
  justify-items: center;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  box-sizing: border-box;
  padding: 0% 25%;
  cursor: grab;
  color: var(--color-knock-red);
  overflow: hidden;
}

.article-content figure.sensitive .senstive-warning:hover {
  background: rgba(255, 255, 255, 1);
  color: var(--main-text-color);
}

.article-content figure.sensitive.show .senstive-warning {
  pointer-events: none;
  opacity: 0;
  visibility: 0;
}

.article-content figure.sensitive .senstive-warning .sensitive-warning-copy {
  font-family: var(--headline-font-family);
  font-weight: 500;
  text-align: center;
}

.article-content .knockla-footnote {
  position: relative;
  font-style: normal;
  border-bottom: dashed thin;
  cursor: help;
  color: var(--color-knock-rust);
}

.article-content .knockla-footnote:before {
  display: block;
  position: absolute;
  bottom: 0;
  overflow: visible;
  padding: 0.5em;
  font-size: 0.9em;
  line-height: 1.3;
  background: var(--color-knock-rust);
  color: var(--main-background-color);
  content: attr(alt);
  border-radius: 2px;
  margin-bottom: 1.3em;
  width: auto;
  pointer-events: none;
  opacity: 0;
  transition: all 0.3s ease;
  border: 2px solid var(--main-background-color);
  width: 110%;
  margin-left: -5%;
}

.article-content .knockla-footnote:hover:before {
  pointer-events: all;
  opacity: 1;
}

.article-content .font-headline,
.article-content .font-headline * {
  font-family: var(--headline-font-family);
}
.article-content .font-body,
.article-content .font-body * {
  font-family: var(--content-font-family);
}

/* A class for the reusable block at the bottom of an article */

.article-callout {
  padding: 1rem 1rem 0.05rem;
  background-color: var(--color-light-gray);
  font-family: var(--headline-font-family);
  margin-top: var(--content-bottom-margin);
  margin-bottom: var(--content-bottom-margin);
  border-radius: 3px;
}

.article-callout p {
  margin-bottom: calc(0.6 * var(--content-bottom-margin));
}
.article-footer {
  max-width: var(--content-content-width);
  margin: 0 auto var(--content-bottom-margin);
  width: calc(100% - var(--content-bottom-margin));
}

.author-bio {
  border-top: 1px solid var(--color-knock-red);
  margin-top: calc(1 * var(--content-bottom-margin));
  padding-top: calc(1 * var(--content-bottom-margin));
  margin-bottom: calc(1 * var(--content-bottom-margin));
  color: var(--color-mid-gray);
  display: flex;
  font-size: 0.875rem;
}

.author-bio p {
  font-family: var(--headline-font-family);
}

.author-image {
  padding-right: calc(1 * var(--content-bottom-margin));
}

.author-image img {
  border-radius: 50%;
  width: 5rem;
  height: 5rem;
}

.author-name {
  font-size: 1rem;
  margin-bottom: 0.5rem;
}

/* modifications to author info for author pages */

.archive.author .author-bio {
  border-top: none;
  font-size: 1.125rem;
  margin-top:  0;
  padding-bottom: calc(1 * var(--content-bottom-margin));
  padding-top: 0;
}

.archive.author .author-image {
  min-width: 80px;
}

.archive.author .author-image img {
  width: 80px;
  height: 80px;
}

/* IF we were to use the jetpack related post block */

#jp-relatedposts {
  max-width: var(--content-content-width);
  margin: 0 auto var(--content-bottom-margin);
  width: calc(100% - var(--content-bottom-margin));
  position: relative;
}

#jp-relatedposts h3.jp-relatedposts-headline {
  font-family: var(--headline-font-family);
  font-size: 1.2em;
  font-weight: 400;
}

#jp-relatedposts .jp-relatedposts-items-visual h4.jp-relatedposts-post-title {
  font-size: var(--content-headline-listings-font-size);
  color: var(--color-black);
  letter-spacing: 0;
  line-height: 1.375rem;
  font-family: var(--headline-font-family);
  font-weight: 500;
  display: block;
  margin-bottom: 9px;
  margin-right: 0.5rem;
  text-decoration: none;
}

#jp-relatedposts .jp-relatedposts-items-visual .jp-relatedposts-post img.jp-relatedposts-post-img {
  margin-bottom: calc(0.5 * var(--content-bottom-margin));
}

#jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-context,
#jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-date {
  font-size: 0.9rem;
  color: #7b7b7b;
  letter-spacing: 0;
  line-height: 1.4rem;
  margin-top: 0.5em;
  margin-bottom: 1em;
}

/* Alignment Classes ------------------------- */
/* It goes no alignment, Align Wide (some left and right margin), then Align Full (full window width no left and right margin) */

.article-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
  max-width: var(--content-content-width);
  margin: 0 auto var(--content-bottom-margin);
  width: calc(100% - var(--content-bottom-margin));
  box-sizing: border-box;
}

[class*="__inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
  max-width: var(--main-content-width);
  width: 100%;
}

.alignnone,
.aligncenter,
.alignleft,
.alignright,
.alignwide {
  margin: 0 auto var(--content-bottom-margin);
}

[class*="__inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright) {
  margin-left: auto;
  margin-right: auto;
}

/* Full */

.alignfull {
  margin-top: 0;
  margin-right: auto;
  margin-bottom: var(--content-bottom-margin);
  margin-left: auto;
  max-width: 100vw;
  position: relative;
  width: 100%;
  box-sizing: border-box;
}

[class*="__inner-container"] > .alignfull {
  max-width: 100%;
}

/* Wide */

.alignwide {
  max-width: 90vw;
  position: relative;
  width: calc(100% - var(--content-bottom-margin));
  box-sizing: border-box;
}

/* Replacement rules 3/9/2021 */

.alignwide {
  max-width: var(--main-content-width);
  margin: 0 auto var(--content-bottom-margin);
  width: calc(100% - var(--content-bottom-margin));
  box-sizing: border-box;
}

[class*="__inner-container"] > .alignwide {
  width: 100%;
}

/* Center */

.aligncenter,
.aligncenter img {
  margin-left: auto;
  margin-right: auto;
}

/* Left and right */

.alignleft,
.alignright {
  max-width: 50%;
}

.alignleft {
  /*rtl:ignore*/
  float: left;
  margin: 0.3rem var(--content-bottom-margin) var(--content-bottom-margin) var(--content-bottom-margin);
}

.alignright {
  /*rtl:ignore*/
  float: right;
  margin: 0.3rem var(--content-bottom-margin) var(--content-bottom-margin) var(--content-bottom-margin);
}

[class*="wp-block"].alignfull:not(.has-background) [class*="__inner-container"] > .alignleft,
[class*="wp-block"].alignfull:not(.has-background) [class*="__inner-container"] > p .alignleft,
[class*="wp-block"].alignfull:not(.has-background) [class*="__inner-container"] > .wp-block-image .alignleft {
  /*rtl:ignore*/
  margin-left: var(--content-bottom-margin);
}

[class*="wp-block"].alignfull:not(.has-background) [class*="__inner-container"] > .alignright,
[class*="wp-block"].alignfull:not(.has-background) [class*="__inner-container"] > p .alignright,
[class*="wp-block"].alignfull:not(.has-background) [class*="__inner-container"] > .wp-block-image .alignright {
  /*rtl:ignore*/
  margin-right: var(--content-bottom-margin);
}

.wp-block-column:not(:first-child) {
  margin-left: 1.5rem;
}
/* Entry Media ------------------------------- */

.alignfull > figcaption,
.alignfull > .wp-caption-text {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--main-content-width);
  width: calc(100% - calc(2.5 * var(--content-bottom-margin)));
}

figure.wp-block-image figcaption {
  font-size: 0.875rem;
}

/* Block Customizations */
@media (min-width: 480px) and (max-width: 920px) {
  .wp-block-columns.alignwide.is-style-collapse-wrap {
    display: flex;
    flex-wrap: wrap;
  }

  .wp-block-columns.alignwide.is-style-collapse-wrap .wp-block-column:not(:only-child) {
    flex-basis: 100% !important;
    flex-grow: 1;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch;
    align-content: stretch;
    margin-left: 0;
    margin-bottom: var(--content-bottom-margin);
  }

  .wp-block-columns.alignwide.is-style-collapse-wrap .wp-block-column:last-child {
    margin-bottom: 0;
  }

  .wp-block-columns.alignwide.is-style-collapse-wrap .wp-block-column + .wp-block-column {
    margin-top: 0;
  }

  .wp-block-columns.alignwide.is-style-collapse-wrap .wp-block-column .wp-block-spacer {
    display: none;
  }

  .wp-block-columns.alignwide.is-style-collapse-wrap .wp-block-column > *:not(:first-child) {
    margin-left: var(--content-bottom-margin);
  }
}

@media (min-width: 782px) and (max-width: 920px) {
  .wp-block-columns.alignwide.is-style-collapse-wrap {
    flex-wrap: wrap !important;
  }
}

.wp-block-cover,
.wp-block-cover-image {
  padding: 0;
  height: 100%;
  align-items: center;
  display: flex;
  flex-wrap: wrap;
}

.wp-block-cover-image.has-background-dim:not(.has-background-gradient)::before,
.wp-block-cover-image .wp-block-cover__gradient-background,
.wp-block-cover.has-background-dim:not(.has-background-gradient)::before,
.wp-block-cover .wp-block-cover__gradient-background {
  transition: ease-out 0.3s opacity;
  opacity: 0.7;
}

.wp-block-cover-image .wp-block-cover__inner-container,
.wp-block-cover .wp-block-cover__inner-container {
  margin: var(--content-bottom-margin); /*  margin-left; margin-right */
}

.home.page-template-default .wp-block-cover__inner-container {
  display: flex;
  flex-direction: column;
  height: calc(100% - 2 * var(--content-bottom-margin));
}

.home.page-template-default .wp-block-cover__inner-container h4 {
  margin-bottom: 0;
  margin-top: auto;
}

.wp-block-cover p {
  height: 100%;
  display: flex;
  align-items: stretch;
  align-content: stretch;
}

.wp-block-cover p a {
  display: block;
  flex-grow: 1;
  vertical-align: middle;
  height: 100%;
  display: flex;
  align-items: center;
  padding: 1rem;
  text-decoration: none;
}
.wp-block-cover p a:hover {
  color: inherit;
}

.wp-block-cover .has-text-white-color a {
  color: var(--color-white);
}
.wp-block-cover .has-text-white-color a:hover {
  color: var(--color-seafoam);
}

.wp-block-embed.aligncenter .wp-block-embed__wrapper > * {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Columns */

/* Article Footer */
.article-footer {
  clear: both;
}

/* Pages */

.page-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
  max-width: var(--main-content-width);
  margin: 0 auto var(--content-bottom-margin);
  width: calc(100% - var(--content-bottom-margin));
}

body.post-template-page_full-bleed-header,
body.page-template-page_full-bleed-header {
  margin-top: 0;
}

body.post-template-page_full-bleed-header header,
body.page-template-page_full-bleed-header header {
  margin-bottom: 0;
  padding-top: 2rem;
}

.post-template-page_full-bleed-header header,
.page-template-page_full-bleed-header header {
  position: absolute;
  top: 0;
  width: 100%;
}

.post-template-page_full-bleed-header header h1,
.page-template-page_full-bleed-header header h1 {
  z-index: 99;
}

.post-template-page_full-bleed-header header h1 a svg #logo-h1-wrapper,
.page-template-page_full-bleed-header header h1 a svg #logo-h1-wrapper {
  fill: white;
}

.post-template-page_full-bleed-header header h1 a:hover svg #logo-h1-wrapper,
.page-template-page_full-bleed-header header h1 a:hover svg #logo-h1-wrapper {
  fill: white;
}

.post-template-page_full-bleed-header header h1 a:hover,
.post-template-page_full-bleed-header header h1 a,
.page-template-page_full-bleed-header header h1 a:hover,
.page-template-page_full-bleed-header header h1 a {
  background-color: transparent;
}

.post-template-page_full-bleed-header .article-header,
.post-template-page_full-bleed-header .header-menus,
.post-template-page_full-bleed-header #site-header-menu.desktop-nav,
.post-template-page_full-bleed-header #header-fundraise-button,
.page-template-page_full-bleed-header .article-header,
.page-template-page_full-bleed-header .header-menus,
.page-template-page_full-bleed-header #site-header-menu.desktop-nav,
.page-template-page_full-bleed-header #header-fundraise-button {
  display: none;
}

.post-template-page_full-bleed-header .article-content > .wp-block-cover:first-child,
.page-template-page_full-bleed-header .article-content > .wp-block-cover:first-child {
  height: 100vh;
}

.post-template-page_full-bleed-header .article-content > .wp-block-cover:first-child .wp-block-cover__inner-container,
.page-template-page_full-bleed-header .article-content > .wp-block-cover:first-child .wp-block-cover__inner-container {
  max-width: var(--main-content-width);
  margin: 0 auto;
  box-sizing: border-box;
  width: calc(100% - var(--content-bottom-margin));
  position: relative;
}

/* Archives */

.archive-title-wrapper {
  max-width: var(--main-content-width);
  margin: 0 auto var(--content-bottom-margin);
  width: calc(100% - var(--content-bottom-margin));
}

.archive-title-wrapper > * {
  font-size: 2.84rem;
  text-align: left;
  margin: 0 auto;
}

.archive-title-wrapper .archive-title-prefix {
  font-size: 1.05rem;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-weight: 300;
  margin-top: calc(0.5 * var(--content-bottom-margin));
}

.archive article .article-header .article-header-thumbnail,
.search article .article-header .article-header-thumbnail {
  display: block;
}

.archive #main,
.search #main {
  max-width: var(--main-content-width);
  margin: 0 auto var(--content-bottom-margin);
  width: calc(100% - var(--content-bottom-margin));
}

.archive #main article,
.search #main article {
  margin-bottom: calc(2 * var(--content-bottom-margin));
}

.archive .featured-category-posts,
.search .featured-category-posts {
  max-width: calc(var(--main-content-width) + 2rem);
  margin: 0 auto var(--content-bottom-margin);
  width: calc(100% - var(--content-bottom-margin) + 2rem);
  display: flex;
  flex-wrap: nowrap;
}

.archive .featured-category-posts article,
.search .featured-category-posts article {
  padding: 1rem;
  flex: 1 1 0px;
}

.archive .featured-category-posts[data-post-count="1"] article .article-header,
.search .featured-category-posts[data-post-count="1"] article .article-header {
  display: flex;
}

.archive .featured-category-posts[data-post-count="1"] article .article-header .article-header-thumbnail,
.search .featured-category-posts[data-post-count="1"] article .article-header .article-header-thumbnail {
  max-width: calc(50% - (var(--content-bottom-margin) / 2));
  margin-right: var(--content-bottom-margin);
}

.archive .featured-category-posts article .article-header .article-header-thumbnail,
.search .featured-category-posts article .article-header .article-header-thumbnail {
  margin-bottom: var(--content-bottom-margin);
}

.archive article .article-header .article-header-tags,
.search article .article-header .article-header-tags {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
}

@media (max-width: 720px) {
  .archive .featured-category-posts[data-post-count="4"],
  .archive .featured-category-posts[data-post-count="3"],
  .search .featured-category-posts[data-post-count="4"],
  .search .featured-category-posts[data-post-count="3"] {
    flex-wrap: wrap;
    max-width: 100%;
  }

  .archive .featured-category-posts[data-post-count="4"] article,
  .search .featured-category-posts[data-post-count="4"] article {
    flex-basis: 50%;
    max-width: 50%;
    box-sizing: border-box;
  }

  .archive .featured-category-posts[data-post-count="3"] article,
  .search .featured-category-posts[data-post-count="3"] article {
    flex: auto;
    width: 100%;
  }

  .archive .featured-category-posts[data-post-count="3"] article .article-header,
  .search .featured-category-posts[data-post-count="3"] article .article-header {
    display: flex;
  }

  .archive .featured-category-posts[data-post-count="3"] article .article-header .article-header-thumbnail,
  .search .featured-category-posts[data-post-count="3"] article .article-header .article-header-thumbnail {
    max-width: calc(50% - (var(--content-bottom-margin) / 2));
    margin-right: var(--content-bottom-margin);
  }

  .archive .featured-category-posts[data-post-count="2"],
  .search .featured-category-posts[data-post-count="2"] {
  }

  .archive .featured-category-posts[data-post-count="1"],
  .search .featured-category-posts[data-post-count="1"] {
  }
}

@media (max-width: 480px) {
  .archive .featured-category-posts,
  .search .featured-category-posts {
    display: block;
  }

  .archive .featured-category-posts[data-post-count] article,
  .search .featured-category-posts[data-post-count] article {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
  }

  .archive .featured-category-posts[data-post-count] article .article-header,
  .search .featured-category-posts[data-post-count] article .article-header {
    display: block;
  }

  .archive .featured-category-posts[data-post-count] article .article-header .article-header-thumbnail,
  .search .featured-category-posts[data-post-count] article .article-header .article-header-thumbnail {
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
    width: 100%;
  }
}

/* Archive Latest Posts -- The main query */
/*
.archive-latest-posts-title {
  max-width: var(--main-content-width);
  margin: 0 auto var(--content-bottom-margin);
  width: calc(100% - var(--content-bottom-margin));
  font-size: 2rem;
  margin-top: calc(1 * var(--content-bottom-margin));
  padding-top: calc(1 * var(--content-bottom-margin));
  border-top: 1px solid #979797;

  letter-spacing: 0.3em;
  font-weiught: 200;
}*/

.archive-latest-posts-title {
  max-width: var(--main-content-width);
  margin: 0 auto var(--content-bottom-margin);
  width: calc(100% - var(--content-bottom-margin));
  font-size: 1.6em;
  margin-top: calc(1 * var(--content-bottom-margin));
  background: var(--color-knock-red);
  color: var(--color-white);
  padding: 1rem;
  font-weiught: 200;
  letter-spacing: 0.1em;
  box-sizing: border-box;
}
.archive #main .article-header,
.search #main .article-header {
  display: flex;
}

.archive #main .article-header .article-header-thumbnail,
.search #main .article-header .article-header-thumbnail {
  max-width: 25%;
  margin-right: var(--content-bottom-margin);
}

@media (max-width: 480px) {
  .archive #main .article-header,
  .search #main .article-header {
  }

  .archive #main .article-header > *,
  .search #main .article-header > * {
    width: 100%;
    max-width: 100%;
    margin-right: 0;
  }
}

.archive .article-header .article-title,
.search .article-header .article-title {
  font-size: 1.2rem;
  line-height: 1.7rem;
  font-weight: 400;
  margin-top: calc(0.5 * var(--content-bottom-margin));
}

.archive .article-header .article-subtitle,
.search .article-header .article-subtitle {
  font-size: 1rem;
  color: var(--color-mid-gray);
  letter-spacing: 0;
  line-height: 1.375rem;
}

/* Search */

.search-title-bar {
}

.search-title-bar {
  max-width: var(--main-content-width);
  margin: 0 auto var(--content-bottom-margin);
  width: calc(100% - var(--content-bottom-margin));
}

.search-title-bar > * {
  font-size: 1.84rem;
  text-align: center;
}

.search .search-title-bar form {
  display: flex;
  align-items: center;
}

.search .search-title-bar form label {
  display: flex;
  align-items: center;
}

/* Pagination */

.navigation .content-wrapper {
  display: flex;
  margin-top: var(--content-bottom-margin);
  max-width: var(--main-content-width);
  margin: 0 auto var(--content-bottom-margin);
  width: calc(100% - var(--content-bottom-margin));
}
.navigation .content-wrapper span {
  flex-grow: 1;
}
.navigation .content-wrapper span.previous-page {
  text-align: left;
  margin-left: -10px;
}
.navigation .content-wrapper span.next-page {
  text-align: right;
  margin-right: -10px;
}

.navigation .content-wrapper span a {
  transition: ease-out 0.3s background-color;
  padding: 10px 10px 8px;
  border-radius: 2px;
  font-family: var(--headline-font-family);
  font-weight: 300;
  background-color: var(--color-white);
  color: var(--color-blue);
  border: 2px var(--color-blue) solid;
}
.navigation .content-wrapper span a:hover {
  background-color: var(--color-blue);
  color: white;
  border: 2px solid;
}

@media (prefers-color-scheme: dark) {
  .navigation .content-wrapper span a {
    background-color: var(--color-knock-red);
    color: var(--color-white);
    border: 2px var(--color-knock-red) solid;
  }
  .navigation .content-wrapper span a:hover {
    background-color: var(--color-white);
    color: var(--color-knock-red);
    border: 2px transparent solid;
  }
}

/* Forms */

form {
}
form fieldset {
  margin-bottom: calc(0.75 * var(--content-bottom-margin));
}
form label {
  display: block;
  font-family: var(--headline-font-family);
}
form input,
form textarea {
  font-family: inherit;
  background: var(--form-input-background-color);
  border: 2px solid var(--color-mid-gray);
  padding: 0.2rem 0.5rem 0;
  border-radius: 2px;
  font-family: var(--headline-font-family);
  line-height: 2;
  vertical-align: middle;
  transition: ease-out 0.3s background-color;
}

form input:focus,
form textarea:focus {
  border: 2px solid var(--form-input-border-focus-color);
}

form input[type="submit"] {
  font-weight: 600;
  text-transform: uppercase;
  background-color: var(--form-input-submit-background-color);
  color: var(--form-input-submit-foreground-color);
  border: 2px var(--form-input-submit-background-color) solid;
}

form input[type="submit"]:hover {
  background-color: var(--form-input-submit-foreground-color);
  color: var(--form-input-submit-background-color);
  border: 2px solid;
}

/* Footer */
footer {
  background: var(--footer-background-color);
  color: var(--footer-foreground-color);
  /* margin-top: calc(2.5 * var(--content-bottom-margin));*/
  padding: var(--content-bottom-margin) 0;
  font-weight: 500;
  font-size: 0.8125rem;
  font-family: var(--headline-font-family);
}

footer .footer-site-name {
  margin-bottom: 0;
}
footer .footer-site-name a {
  padding: 0.5rem;
  margin-left: -0.5rem;
  margin-bottom: 0;
}
footer .footer-site-name a span {
  display: none;
}
footer .footer-site-name a svg #logo-h1-wrapper {
  fill: white;
}
footer .footer-site-name a svg #KNOCKLA-text-KNOCK {
  font-size: 48px;
}
footer .footer-site-name a svg .KNOCKLA-text-litter-letter {
  font-size: 30px;
}

#footer-widgets {
  list-style: none;
}

#footer-widgets > li {
  width: 100%;
}

#footer-widgets .textwidget {
  font-size: 0.8125rem;
  font-family: var(--headline-font-family);
  font-weight: 500;
  max-width: 380px;
  line-height: 1.25rem;
  margin-bottom: 2.5rem;
}

#footer-widgets .menu {
  list-style: none;
  display: flex;
  margin-left: -10px;
  flex-wrap: wrap;
}
#footer-widgets .menu li {
}
#footer-widgets .menu li a {
  font-weight: 500;
  font-size: 0.8125rem;
  padding: 10px;
  color: var(--footer-foreground-color);
  text-transform: uppercase;
  border-bottom: 2px solid transparent;
  font-family: var(--headline-font-family);
  white-space: pre;
  display: block;
}
#footer-widgets .menu li a:hover {
  color: var(--footer-foreground-color);
  border-color: var(--footer-foreground-color);
}

.klaviyo-form .ql-editor p .ql-font-league-spartan-variable {
  color: var(--main-text-color);
  line-height: 1.4375;
}


/* Tables */

/*
If max-height: 400px causes issues, scope the following to something like:
.wp-block-table.maxh400px

and then add that class in "Edit as HTML" option for tables:
<figure class="wp-block-table is-style-stripes maxh400px">

see https://knock-la.com/exclusive-members-of-lapd-task-force-only-arrest-black-people/
*/
.wp-block-table {
  max-height: 400px;
  overflow: scroll;
}

.wp-block-table th {
  font-size: 80%;
  min-width: 8rem;
  text-align: left;
}

.wp-block-table.is-style-stripes {
  border-bottom: 0 none;
}

@media (prefers-color-scheme: dark) {
  .wp-block-table.is-style-stripes tbody tr:nth-child(2n+1) {
    background-color: #1f1f1f;
  }
}

/* Accordion Block - https://wordpress.org/plugins/accordion-blocks/ */

.c-accordion__title {
  margin-bottom: 0;
}

.c-accordion__item {
    padding: 1rem;
    border: 2px solid gray;
}

/* Media Queries */

/* > 950px, 950px - 720px, < 720px , < 480px */

@media (min-width: 950px) {
}

@media (max-width: 950px) and (min-width: 720px) {
}

@media (max-width: 720px) {
  /* Mobile Nav */

  header #header-fundraise-button,
  header #header-search-form,
  header .desktop-nav {
    display: none;
  }

  #mobile-nav-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    max-height: 100vh;
    z-index: 100;
    pointer-events: none;
    opacity: 0;
    display: block;
  }

  body.navigationShown {
    overflow: hidden;
  }
  body.navigationShown #mobile-nav-container {
    opacity: 1;
    pointer-events: all;
    display: flex;
    flex-wrap: wrap;
  }

  body #mobile-nav-container nav ul {
    display: flex;
    font-size: 26px;
    line-height: 1.7;
    padding: 10px 20px;
    position: relative;
    left: 300vw;
    background: rgba(255, 255, 255, 0.9);
    overflow-y: scroll;
    box-sizing: border-box;
    right: 0px;
    transition: all 0.3s ease;
    display: flex;
    flex-wrap: wrap;
    pointer-events: none;
    height: 100%;
    width: 100vw;
    align-content: center;
    transform: translate3d(0, 0, 0);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
  }
  body.navigationShown #mobile-nav-container nav ul {
    transform: translate3d(-300vw, 0, 0);
    pointer-events: all;
  }

  @media (prefers-color-scheme: dark) {
    body #mobile-nav-container nav ul {
      background: rgba(0, 0, 0, 0.9);
    }

    body #mobile-nav-container .search-form svg #Desktop {
      stroke: var(--main-text-color);
    }
  }

  #mobile-nav-container nav ul li {
    display: block;
    width: 100%;
    text-align: center;
  }
  #mobile-nav-container nav ul li a {
    font-weight: 500;
  }

  #mobile-nav-container nav ul li form.search-form {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #mobile-nav-container nav ul li form.search-form input {
    font-weight: 500;
    margin: 0 0.2em;
    font-size: 26px;
    padding: 0;
  }

  #mobile-nav-container nav ul li form.search-form input[type="search"] {
    border-width: 0px 0px 2px 0px;
    background-color: transparent;
  }

  #mobile-nav-container nav ul li form.search-form input[type="submit"] {
    display: none;
  }

  #mobile-nav-container nav ul li form.search-form label:hover svg * {
    stroke: var(--main-link-color);
  }

  #mobile-nav-container nav[id*="social"] ul {
    flex-wrap: nowrap;
  }

  #mobile-nav-container [id*="social"] a svg {
    width: 30px;
    height: 30px;
    /* width: calc((100vw - (6 * var(--content-bottom-margin))) / 5);
    height: calc((100vw - (6 * var(--content-bottom-margin))) / 5); */
  }

  #mobile-nav-container [id*="social"] .logopath {
    fill: var(--main-text-color);
  }

  #toggle-mobile-nav {
    display: block;
    pointer-events: all;
    position: absolute;
    top: 0;
    right: 0;
    line-height: 42px;
    vertical-align: middle;
    padding: 1rem 0px;
    overflow: hidden;
    z-index: 9999;
  }

  g#Hamburger line {
    transition: all 0.3s ease;
    transform: rotate(0deg);
    transform-origin: 14% 50%;
    position: relative;
  }

  .navigationShown #toggle-mobile-nav #Hamburger g#Hamburger {
    stroke: var(--color-black);
  }

  .navigationShown #toggle-mobile-nav g#Hamburger line {
    /* stroke:#fff; */
    position: fixed;
  }

  .navigationShown g#Hamburger:hover {
    opacity: 0.8;
  }
  .navigationShown g#Hamburger #Line1 {
    transform: rotate(45deg);
  }
  .navigationShown g#Hamburger #Line2 {
    opacity: 0;
  }
  .navigationShown g#Hamburger #Line3 {
    transform: rotate(-45deg);
  }

  body {
    margin-top: 1rem;
  }

  body header {
    margin-bottom: 0;
  }

  body.single header,
  body.page:not(.home) header {
    margin-bottom: calc(0.5 * var(--content-bottom-margin));
  }

  header .wrapper div + div,
  header .header-menus {
    border-top: 1px solid #979797;
    margin-top: 0.25rem;
    padding-top: 0.25rem;
  }

  .archive-title-wrapper {
    max-width: var(--main-content-width);
    margin: calc(0.5 * var(--content-bottom-margin)) auto;
    width: calc(100% - var(--content-bottom-margin));
  }

  .archive #main .article-header .article-header-thumbnail,
  .search #main .article-header .article-header-thumbnail {
    max-width: 33%;
    margin-right: var(--content-bottom-margin);
  }

  /* Footer Mobile Nav */

  #footer-widgets .menu {
    list-style: none;
    display: flex;
    margin-left: -10px;
    flex-wrap: wrap;
  }
  #footer-widgets .menu li {
    display: inline-block;
    flex-grow: 1;
    width: 50%;
  }

  #footer-widgets .menu li a {
    font-weight: 500;
    font-size: 0.8125rem;
    margin: 6px 10px;
    padding: 0;
    color: white;
    display: inline-block;
    text-transform: uppercase;
    border-bottom: 2px solid;
  }
  #footer-widgets .menu li a:hover {
    border-bottom: 2px solid transparent;
  }
}

@media (max-width: 599px) {
  .wp-block-column:not(:first-child) {
    margin-left: 0;
  }

  .wp-block-column + .wp-block-column {
    margin-top: calc(1 * var(--content-bottom-margin));
  }
}

@media (max-width: 480px) {
  h3 {
    font-size: 2.1rem;
  }

  .page article.page {
    margin-bottom: calc(1 * var(--content-bottom-margin));
  }

  .article-header .article-tax {
    flex-wrap: wrap;
  }

  .article-header .article-tax .article-header-tags {
    order: 1;
    margin-left: -5px;
  }

  .article-header .article-title {
    font-size: 2.3rem;
    font-weight: 600;
    line-height: 2.7rem;
    letter-spacing: 0;
    margin-bottom: calc(0.5 * var(--content-bottom-margin));
  }
  .article-header .article-subtitle {
    margin-bottom: 0.6rem;
  }

  .wp-block-column:not(:first-child) {
    margin-left: 0;
  }

  .archive-title-wrapper > * {
    font-size: 2.84rem;
  }

  .archive #main .article-header,
  .search #main .article-header {
    display: block;
  }
  .archive #main .article-header .article-header-thumbnail,
  .search #main .article-header .article-header-thumbnail {
    max-width: 100%;
    margin-right: 0;
    margin-bottom: calc(1 * var(--content-bottom-margin));
  }
}