:root {
  --Grid-Gutter: var(--Spacing-06);
  --Grid-Gutter-: var(--Spacing-06-);
  --Container-Max-Width: calc(1140px + (var(--Grid-Gutter) * 2));
  --Content-Max-Width: 792px;
  --Font-Family: "Nunito Sans", sans-serif;
  --Scrollbar-Width: 0px;
  --100vw: calc(100vw - var(--Scrollbar-Width));
  --Outline-Container: solid 4px var(--Color-Primary);
  --Z-Index-Header: 100;
  --Button-Border-Radius: 38px;
  --Transition-Base: all .2s ease-in-out;
  --Transition-Move: all .2s ease-in-out;
  --Transition-Fade: opacity .15s linear;
  --Transition-Collapse: height .35s ease;
  --Transition-Collapse2: max-height .35s ease;
  --Container-Width: calc(var(--100vw) - (var(--Grid-Gutter) * 2));
  --Breakpoint-xs: 0px;
  --Breakpoint-s: 544px;
  --Breakpoint-m: 768px;
  --Breakpoint-l: 1280px;
  --Breakpoint-xl: 1440px;
}
:root .klaro.klaro-theme-vz {
  --klaro-primary-color: var(--Color-Primary);
  --klaro-button-border-radius: 2rem;
  --klaro-button-bg-hover: #fff;
  --klaro-button-focus-outline: 2px solid var(--Color-Text);
  --klaro-dialog-focus-outline: 2px solid var(--Color-Text);
}
@media (min-width: calc(1440px + 48px)) {
  :root {
    --Container-Width: calc(1187px - (var(--Grid-Gutter) * 2));
  }
}
@media (prefers-reduced-motion: no-preference) {
  :root {
    scroll-behavior: smooth;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
:root {
  --darkest: #0d0b0a;
  --darker: #292828;
  --dark: #737272;
  --grey-dark: #8c8c8c;
  --grey-not-dark: #d9d9d9;
  --not-white: #f4f3f3;
  --bg-color: var(--grey-not-dark);
  --text-color: var(--darkest);
  --dark-blue: #122860;
  --blue: #019cde;
  --accent: var(--dark-blue);
}

/* Dark theme */
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --bg-color: var(--darker);
    --text-color: var(--grey-not-dark);
    --accent: var(--blue);
  }
  /* Add a bit of transparency so light media isn't so glaring in dark mode */
  img,
  video {
    opacity: 0.8;
  }
}
:root {
  --Font-Size-h0: 4.6875rem;
  --Font-Size-h1: 2rem;
  --Font-Size-h2: 1.75rem;
  --Font-Size-h3: 1.25rem;
  --Font-Size-h4: 1.125rem;
  --Font-Size-h5: 1.125rem;
  --Font-Size-h6: 1.125rem;
  --Font-Size-XXL: 1.25rem;
  --Font-Size-XL: 1.125rem;
  --Font-Size-L: 1.125rem;
  --Font-Size-M: 1rem;
  --Font-Size-S: 1rem;
  --Font-Size-XS: 0.875rem;
}
@media (min-width: 768px) {
  :root {
    --Font-Size-h0: 4.6875rem;
    --Font-Size-h1: 2rem;
    --Font-Size-h2: 1.75rem;
    --Font-Size-h3: 1.25rem;
    --Font-Size-h4: 1.125rem;
    --Font-Size-h5: 1.125rem;
    --Font-Size-h6: 1.125rem;
    --Font-Size-XXL: 1.625rem;
    --Font-Size-XL: 1.5rem;
    --Font-Size-L: 1.25rem;
    --Font-Size-M: 1.125rem;
    --Font-Size-S: 1rem;
    --Font-Size-XS: 0.875rem;
  }
}
@media (min-width: 1280px) {
  :root {
    --Font-Size-h0: 4.6875rem;
    --Font-Size-h1: 2.375rem;
    --Font-Size-h2: 2rem;
    --Font-Size-h3: 1.25rem;
    --Font-Size-h4: 1.125rem;
    --Font-Size-h5: 1.125rem;
    --Font-Size-h6: 1.125rem;
    --Font-Size-XXL: 1.625rem;
    --Font-Size-XL: 1.5rem;
    --Font-Size-L: 1.25rem;
    --Font-Size-M: 1.125rem;
    --Font-Size-S: 1rem;
    --Font-Size-XS: 0.875rem;
  }
}
:root {
  --Spacing-01: 0.0625rem;
  --Spacing-01-: -0.0625rem;
  --Spacing-02: 0.125rem;
  --Spacing-02-: -0.125rem;
  --Spacing-03: 0.25rem;
  --Spacing-03-: -0.25rem;
  --Spacing-04: 0.5rem;
  --Spacing-04-: -0.5rem;
  --Spacing-05: 0.75rem;
  --Spacing-05-: -0.75rem;
  --Spacing-06: 1rem;
  --Spacing-06-: -1rem;
  --Spacing-07: 1.5rem;
  --Spacing-07-: -1.5rem;
  --Spacing-08: 2rem;
  --Spacing-08-: -2rem;
  --Spacing-09: 2.5rem;
  --Spacing-09-: -2.5rem;
  --Spacing-10: 3rem;
  --Spacing-10-: -3rem;
  --Spacing-11: 4rem;
  --Spacing-11-: -4rem;
  --Spacing-12: 5rem;
  --Spacing-12-: -5rem;
  --Spacing-container: 2rem;
  --Spacing-container-: -2rem;
}
@media (min-width: 768px) {
  :root {
    --Spacing-container: 4rem;
    --Spacing-container-: -4rem;
  }
}
@media (min-width: 1280px) {
  :root {
    --Spacing-01: 0.125rem;
    --Spacing-01-: -0.125rem;
    --Spacing-02: 0.25rem;
    --Spacing-02-: -0.25rem;
    --Spacing-03: 0.5rem;
    --Spacing-03-: -0.5rem;
    --Spacing-04: 0.75rem;
    --Spacing-04-: -0.75rem;
    --Spacing-05: 1rem;
    --Spacing-05-: -1rem;
    --Spacing-06: 1.5rem;
    --Spacing-06-: -1.5rem;
    --Spacing-07: 2rem;
    --Spacing-07-: -2rem;
    --Spacing-08: 2.5rem;
    --Spacing-08-: -2.5rem;
    --Spacing-09: 3rem;
    --Spacing-09-: -3rem;
    --Spacing-10: 4rem;
    --Spacing-10-: -4rem;
    --Spacing-11: 5rem;
    --Spacing-11-: -5rem;
    --Spacing-12: 6rem;
    --Spacing-12-: -6rem;
    --Spacing-container: 5rem;
    --Spacing-container-: -5rem;
  }
}
[data-theme=bright] {
  background: var(--Color-Background);
  color: var(--Color-Text);
}

[data-theme=dark] {
  background: var(--Color-Background);
  color: var(--Color-Text);
}

@font-face {
  font-display: swap;
  font-family: "Nunito Sans";
  font-style: normal;
  font-weight: 400 800;
  src: url("../fonts/nunito-sans/NunitoSans-VariableFontYTLCopszwdthwght.woff2") format("woff2");
}
@media screen and (prefers-reduced-motion: no-preference) {
  @view-transition {
    navigation: auto;
  }
}
body {
  view-transition-name: page;
}

.layout-content {
  view-transition-name: content;
}

::view-transition-old(page) {
  animation: pulse 1s;
}

::view-transition-new(page) {
  animation: pulse 1s;
}

@keyframes fadeinout {
  0%, 100% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
}
@keyframes blur {
  0%, 90% {
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -o-filter: blur(0px);
    -ms-filter: blur(0px);
  }
  50% {
    -webkit-filter: blur(50px);
    -moz-filter: blur(50px);
    -o-filter: blur(50px);
    -ms-filter: blur(50px);
  }
}
@keyframes slide-out {
  0% {
    transform: translateX(0%);
  }
  100% {
    opacity: 0;
    transform: translateX(calc(50% * var(--direction, 1)));
  }
}
@keyframes pulse {
  0% {
    background-color: var(--accent);
  }
  100% {
    background-color: var(--bg-color);
  }
}
@keyframes slide-in {
  0% {
    opacity: 0;
    transform: translateX(calc(-50% * var(--direction, 1)));
  }
  100% {
    transform: translateX(0%);
  }
}
main {
  padding-top: var(--Spacing-06);
}

body {
  font-family: var(--Font-Family);
  font-size: var(--Font-Size-M);
  font-weight: 400;
  line-height: 1.5;
  color: var(--text-color);
  background-color: var(--bg-color);
}
body a {
  text-underline-offset: 5px;
  text-decoration-color: var(--accent);
  color: var(--accent);
}
body a:hover {
  text-underline-offset: 7px;
}

img {
  filter: grayscale(1) saturate(2);
}

.node--type-event:hover img,
img:hover {
  filter: none;
}

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --bg-color: var(--darker);
    --text-color: var(--grey-not-dark);
    --accent: var(--blue);
  }
  img {
    filter: sepia(1);
  }
  /* Add a bit of transparency so light media isn't so glaring in dark mode */
  img,
  video {
    opacity: 0.8;
  }
}
.page-title {
  margin-bottom: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 800;
}
@media (min-width: 544px) {
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    margin-left: var(--Spacing-06-);
  }
}

.node--view-mode-card h2 {
  margin-left: 0;
}

h1 {
  font-size: var(--Font-Size-h1);
}

h2 {
  font-size: var(--Font-Size-h2);
}

h3 {
  font-size: var(--Font-Size-h3);
}

h4 {
  font-size: var(--Font-Size-h4);
}

.layout-builder,
.layout-builder-block {
  background-color: var(--bg-color);
  color: var(--text-color);
}

.field--name-field-event__date {
  font-weight: 700;
}

@keyframes swing {
  0% {
    transform: rotate(0deg);
  }
  25% {
    transform: rotate(25deg);
  }
  50% {
    transform: rotate(-20deg);
  }
  75% {
    transform: rotate(15deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
.node--sticky {
  position: relative;
  z-index: 1;
}
.node--sticky .field--name-field-description {
  max-width: 80%;
}
.node--sticky .sticky-icon {
  position: absolute;
  bottom: var(--Spacing-08);
  left: 80%;
  width: auto;
  height: 6rem;
  z-index: -1;
  pointer-events: none;
  fill: hsl(from var(--bg-color) h s calc(l - 4));
}
.node--sticky:hover .sticky-icon {
  animation: swing 1s ease-in-out infinite;
}

.event__link,
.field--name-field-tags {
  margin: var(--Spacing-08) 0;
}
.event__link a,
.field--name-field-tags a {
  background-color: hsl(from var(--bg-color) h s calc(l - 4));
  color: var(--text-color);
  padding: var(--Spacing-05);
}

.node--view-mode-card {
  padding: var(--Spacing-10) 0;
  border-bottom: 1px solid hsl(from var(--bg-color) h s calc(l - 15));
}
.node--view-mode-card:hover {
  border-color: var(--accent);
  transform: scale(1.01);
}

.views-exposed-form {
  margin-bottom: var(--Spacing-06);
}

.feed-icons {
  margin-top: var(--Spacing-04);
}

.block-views-blockevents-upcoming,
.block-views-blockevents-past {
  margin-top: var(--Spacing-10);
}
.block-views-blockevents-upcoming h2,
.block-views-blockevents-past h2 {
  margin-top: 0;
  margin-bottom: 0;
  padding-bottom: var(--Spacing-08);
}

.view-filters {
  display: none;
}

@media print {
  .feature-bar {
    visibility: hidden;
  }
}
/* Simple CSS 2.3.5 Drupal (CMS) flavour */
/* https://github.com/kevquirk/simple.css */
/* Global variables. */
/* Reset box-sizing */
*, *::before, *::after {
  box-sizing: border-box;
}

/* Reset default appearance */
textarea,
select,
input,
progress {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

html {
  /* Set the font globally */
  font-family: var(--sans-font);
  scroll-behavior: smooth;
}

/* Make the body a nice central block */
/* Drupal flavour: Move layout content */
.layout-container {
  color: var(--text);
  background-color: var(--bg);
  line-height: 1.5;
  display: grid;
  grid-template-columns: 1fr min(45rem, 90%) 1fr;
  margin: 0;
}

.layout-container > * {
  grid-column: 2;
}

/* Make the header bg full width, but the content inline with body */
/* Add a little padding to ensure spacing is correct between content and header nav */
body > footer {
  margin-top: 4rem;
  padding: 2rem 1rem 1.5rem 1rem;
  color: var(--text-light);
  text-align: center;
  border-top: 1px solid var(--border);
}

.layout-container {
  /* Format headers */
  /* Prevent long strings from overflowing container */
  /* Fix line height when title wraps */
  /* Reduce header size on mobile */
  /* Format links & buttons */
  /* Set the cursor to '?' on an abbreviation and style the abbreviation to show that there is more information underneath */
  /* Format navigation */
  /* Use flexbox to allow items to wrap, as needed */
  /* List items are inline elements, make them behave more like blocks */
  /* Reduce nav side on mobile */
  /* Consolidate box styling */
  /* Make aside full-width on mobile */
  /* Don't double separators when chaining sections */
  /* Format tables */
  /* Format forms */
  /* Add arrow to drop-down */
  /* checkbox and radio button style */
  /* Makes input fields wider on smaller screens */
  /* Set a height for color input */
  /* do not show border around file selector button */
  /* Misc body elements */
  /* Use mono font for code elements */
  /* Fix embedded code within pre */
  /* Progress bars */
  /* Declarations are repeated because you */
  /* cannot combine vendor-specific selectors */
  /* Superscript & Subscript */
  /* Prevent scripts from affecting line-height. */
  /* Classes for notices */
}
.layout-container p {
  margin: 1.5rem 0;
}
.layout-container p, .layout-container h1, .layout-container h2, .layout-container h3, .layout-container h4, .layout-container h5, .layout-container h6 {
  overflow-wrap: break-word;
}
.layout-container h1,
.layout-container h2,
.layout-container h3 {
  line-height: 1.1;
}
.layout-container input[type=range] {
  padding: 0;
}
.layout-container abbr[title] {
  cursor: help;
  text-decoration-line: underline;
  text-decoration-style: dotted;
}
.layout-container aside, .layout-container details, .layout-container pre, .layout-container progress {
  background-color: var(--accent-bg);
  border: 1px solid var(--border);
  border-radius: var(--standard-border-radius);
  margin-bottom: 1rem;
}
.layout-container aside {
  width: 30%;
  padding: 0 15px;
  margin-inline-start: 15px;
  float: right;
}
.layout-container *[dir=rtl] aside {
  float: left;
}
@media only screen and (max-width: 720px) {
  .layout-container aside {
    width: 100%;
    float: none;
    margin-inline-start: 0;
  }
}
.layout-container article:has(.node), .layout-container fieldset, .layout-container dialog {
  padding: 1rem;
  margin-bottom: 1rem;
}
.layout-container section {
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 2rem 1rem;
  margin: 3rem 0;
}
.layout-container section + section,
.layout-container section:first-child {
  border-top: 0;
  padding-top: 0;
}
.layout-container section + section {
  margin-top: 0;
}
.layout-container section:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.layout-container details {
  padding: 0.7rem 1rem;
}
.layout-container summary {
  cursor: pointer;
  font-weight: bold;
  padding: 0.7rem 1rem;
  margin: -0.7rem -1rem;
  word-break: break-all;
}
.layout-container details[open] > summary + * {
  margin-top: 0;
}
.layout-container details[open] > summary {
  margin-bottom: 0.5rem;
}
.layout-container details[open] > :last-child {
  margin-bottom: 0;
}
.layout-container table {
  border-collapse: collapse;
  margin: 1.5rem 0;
}
.layout-container figure > table {
  width: max-content;
  margin: 0;
}
.layout-container td,
.layout-container th {
  border: 1px solid var(--border);
  text-align: start;
  padding: 0.5rem;
}
.layout-container th {
  background-color: var(--accent-bg);
  font-weight: bold;
}
.layout-container tr:nth-child(even) {
  /* Set every other cell slightly darker. Improves readability. */
  background-color: var(--accent-bg);
}
.layout-container table caption {
  font-weight: bold;
  margin-bottom: 0.5rem;
}
.layout-container textarea,
.layout-container select,
.layout-container input {
  font-family: inherit;
  padding: 0.5rem;
  border-radius: var(--standard-border-radius);
  box-shadow: none;
  max-width: 100%;
  display: inline-block;
}
.layout-container textarea,
.layout-container select,
.layout-container input:not(.button) {
  color: var(--text);
  background-color: var(--bg);
  border: 1px solid var(--border);
}
.layout-container label {
  display: block;
}
.layout-container textarea:not([cols]) {
  width: 100%;
}
.layout-container select:not([multiple]) {
  background-image: linear-gradient(45deg, transparent 49%, var(--text) 51%), linear-gradient(135deg, var(--text) 51%, transparent 49%);
  background-position: calc(100% - 15px), calc(100% - 10px);
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  padding-inline-end: 25px;
}
.layout-container *[dir=rtl] select:not([multiple]) {
  background-position: 10px, 15px;
}
.layout-container input[type=checkbox],
.layout-container input[type=radio] {
  vertical-align: middle;
  position: relative;
  width: min-content;
  border: 1px solid var(--text-color);
}
.layout-container input[type=checkbox] + label,
.layout-container input[type=radio] + label {
  display: inline-block;
}
.layout-container input[type=radio] {
  border-radius: 100%;
}
.layout-container input[type=checkbox]:checked,
.layout-container input[type=radio]:checked {
  background-color: var(--accent);
}
.layout-container input[type=checkbox]:checked::after {
  /* Creates a rectangle with colored right and bottom borders which is rotated to look like a check mark */
  content: " ";
  width: 0.18em;
  height: 0.32em;
  border-radius: 0;
  position: absolute;
  top: 0.05em;
  left: 0.17em;
  background-color: transparent;
  border-right: solid var(--bg) 0.08em;
  border-bottom: solid var(--bg) 0.08em;
  transform: rotate(45deg);
}
.layout-container input[type=radio]:checked::after {
  /* creates a colored circle for the checked radio button  */
  content: " ";
  width: 0.25em;
  height: 0.25em;
  border-radius: 100%;
  position: absolute;
  top: 0.125em;
  background-color: var(--bg);
  left: 0.125em;
  font-size: 32px;
}
@media only screen and (max-width: 720px) {
  .layout-container textarea,
  .layout-container select,
  .layout-container input {
    width: 100%;
  }
}
.layout-container input[type=color] {
  height: 2.5rem;
  padding: 0.2rem;
}
.layout-container input[type=file] {
  border: 0;
}
.layout-container hr {
  border: none;
  height: 1px;
  background: var(--border);
  margin: 1rem auto;
}
.layout-container mark {
  padding: 2px 5px;
  border-radius: var(--standard-border-radius);
  background-color: var(--marked);
  color: black;
}
.layout-container mark a {
  color: #0d47a1;
}
.layout-container img,
.layout-container video {
  max-width: 100%;
  height: auto;
  border-radius: var(--standard-border-radius);
}
.layout-container figure {
  margin: 0;
  display: block;
  overflow-x: auto;
}
.layout-container figure > img,
.layout-container figure > picture > img {
  display: block;
  margin-inline: auto;
}
.layout-container figcaption {
  text-align: center;
  color: var(--text-light);
  margin-block: 1rem;
}
.layout-container blockquote {
  margin-inline-start: 2rem;
  margin-inline-end: 0;
  margin-block: 2rem;
  padding: 0.4rem 0.8rem;
  border-inline-start: 0.35rem solid var(--accent);
  color: var(--text-light);
  font-style: italic;
}
.layout-container cite {
  color: var(--text-light);
  font-style: normal;
}
.layout-container dt {
  color: var(--text-light);
}
.layout-container code,
.layout-container pre,
.layout-container pre span,
.layout-container kbd,
.layout-container samp {
  font-family: var(--mono-font);
  color: var(--code);
}
.layout-container kbd {
  color: var(--preformatted);
  border: 1px solid var(--preformatted);
  border-bottom: 3px solid var(--preformatted);
  border-radius: var(--standard-border-radius);
  padding: 0.1rem 0.4rem;
}
.layout-container pre {
  padding: 1rem 1.4rem;
  max-width: 100%;
  overflow: auto;
  color: var(--preformatted);
}
.layout-container pre code {
  color: var(--preformatted);
  background: none;
  margin: 0;
  padding: 0;
}
.layout-container progress {
  width: 100%;
}
.layout-container progress:indeterminate {
  background-color: var(--accent-bg);
}
.layout-container progress::-webkit-progress-bar {
  border-radius: var(--standard-border-radius);
  background-color: var(--accent-bg);
}
.layout-container progress::-webkit-progress-value {
  border-radius: var(--standard-border-radius);
  background-color: var(--accent);
}
.layout-container progress::-moz-progress-bar {
  border-radius: var(--standard-border-radius);
  background-color: var(--accent);
  transition-property: width;
  transition-duration: 0.3s;
}
.layout-container progress:indeterminate::-moz-progress-bar {
  background-color: var(--accent-bg);
}
.layout-container dialog {
  background-color: var(--bg);
  max-width: 40rem;
  margin: auto;
}
.layout-container dialog::backdrop {
  background-color: var(--bg);
  opacity: 0.8;
}
@media only screen and (max-width: 720px) {
  .layout-container dialog {
    max-width: calc(100vw - 2rem);
  }
}
.layout-container sup, .layout-container sub {
  vertical-align: baseline;
  position: relative;
}
.layout-container sup {
  top: -0.4em;
}
.layout-container sub {
  top: 0.3em;
}
.layout-container .notice {
  background: var(--accent-bg);
  border: 2px solid var(--border);
  border-radius: var(--standard-border-radius);
  padding: 1.5rem;
  margin: 2rem 0;
}

/* Print */
@media print {
  @page {
    margin: 1cm;
  }
  body {
    display: block;
  }
  body > header {
    background-color: unset;
  }
  body > header nav,
  body > footer {
    display: none;
  }
  article {
    border: none;
    padding: 0;
  }
  a[href^=http]::after {
    content: " <" attr(href) ">";
  }
  abbr[title]:after {
    content: " (" attr(title) ")";
  }
  a {
    text-decoration: none;
  }
  p {
    widows: 3;
    orphans: 3;
  }
  hr {
    border-top: 1px solid var(--border);
  }
  mark {
    border: 1px solid var(--border);
  }
  pre, table, figure, img, svg {
    break-inside: avoid;
  }
  pre code {
    white-space: pre-wrap;
  }
}
.container {
  max-width: 900px;
  margin: 100px auto;
}

.entity-moderation-form,
.node--unpublished {
  background: var(--unpublished-bg);
}