/*
  Theme Name: Konzeptwerk
  Author: Hannes Welk
  Description: Theme für die Konzeptwerk Neue Ökonomie Hauptseite, erstellt am 22.05.2024
  */

  /* --------------------------------------------------
     reset
  -------------------------------------------------- */

  * { 
    box-sizing:border-box;
    outline:0;
  }

  html { 
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,
  del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,
  b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,
  article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, 
  menu, nav, output, ruby, section, summary,time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
  }

  article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

/*  ol, ul { list-style: none; }*/

  table {
    border-collapse: collapse;
    border-spacing: 0;
  }


  /* --------------------------------------------------
     font import
  -------------------------------------------------- */



/* unbounded-200 - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 200;
  src: url('fonts/unbounded-v7-latin_latin-ext-200.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/unbounded-v7-latin_latin-ext-200.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* unbounded-regular - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/unbounded-v7-latin_latin-ext-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/unbounded-v7-latin_latin-ext-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* unbounded-800 - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 800;
  src: url('fonts/unbounded-v7-latin_latin-ext-800.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/unbounded-v7-latin_latin-ext-800.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* unbounded-900 - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/unbounded-v7-latin_latin-ext-900.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/unbounded-v7-latin_latin-ext-900.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

  /* atkinson-hyperlegible-regular - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Atkinson Hyperlegible';
    font-style: normal;
    font-weight: 400;
    src: url('fonts/atkinson-hyperlegible-v10-latin-regular.eot'); /* IE9 Compat Modes */
    src: url('fonts/atkinson-hyperlegible-v10-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/atkinson-hyperlegible-v10-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('fonts/atkinson-hyperlegible-v10-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('fonts/atkinson-hyperlegible-v10-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('fonts/atkinson-hyperlegible-v10-latin-regular.svg#AtkinsonHyperlegible') format('svg'); /* Legacy iOS */
  }
  /* atkinson-hyperlegible-italic - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Atkinson Hyperlegible';
    font-style: italic;
    font-weight: 400;
    src: url('fonts/atkinson-hyperlegible-v10-latin-italic.eot'); /* IE9 Compat Modes */
    src: url('fonts/atkinson-hyperlegible-v10-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/atkinson-hyperlegible-v10-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('fonts/atkinson-hyperlegible-v10-latin-italic.woff') format('woff'), /* Modern Browsers */
         url('fonts/atkinson-hyperlegible-v10-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('fonts/atkinson-hyperlegible-v10-latin-italic.svg#AtkinsonHyperlegible') format('svg'); /* Legacy iOS */
  }
  /* atkinson-hyperlegible-700 - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Atkinson Hyperlegible';
    font-style: normal;
    font-weight: 700;
    src: url('fonts/atkinson-hyperlegible-v10-latin-700.eot'); /* IE9 Compat Modes */
    src: url('fonts/atkinson-hyperlegible-v10-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/atkinson-hyperlegible-v10-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
         url('fonts/atkinson-hyperlegible-v10-latin-700.woff') format('woff'), /* Modern Browsers */
         url('fonts/atkinson-hyperlegible-v10-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
         url('fonts/atkinson-hyperlegible-v10-latin-700.svg#AtkinsonHyperlegible') format('svg'); /* Legacy iOS */
  }
  /* atkinson-hyperlegible-700italic - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Atkinson Hyperlegible';
    font-style: italic;
    font-weight: 700;
    src: url('fonts/atkinson-hyperlegible-v10-latin-700italic.eot'); /* IE9 Compat Modes */
    src: url('fonts/atkinson-hyperlegible-v10-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/atkinson-hyperlegible-v10-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('fonts/atkinson-hyperlegible-v10-latin-700italic.woff') format('woff'), /* Modern Browsers */
         url('fonts/atkinson-hyperlegible-v10-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('fonts/atkinson-hyperlegible-v10-latin-700italic.svg#AtkinsonHyperlegible') format('svg'); /* Legacy iOS */
  }






/* --------------------------------------------------
   typography
-------------------------------------------------- */

html {
  font-size:15px;
}

  @media only screen and (min-width :  600px) { html { font-size:16px; } }
  @media only screen and (min-width :  800px) { html { font-size:17px; } }
  @media only screen and (min-width : 1000px) { html { font-size:18px; } }
  @media only screen and (min-width : 1200px) { html { font-size:19px; } }

body {
  font-family:var(--font-body);
  font-size:1rem;
  line-height:1.5;
  color:#333;
}

h1,h2,h3,h4,.heading {
  font-family:var(--font-head);
  line-height: 1.2;
  font-weight:900;
  hyphens:auto;
/*  hyphenate-limit-chars: 10 3 4;*/
}

h1 {
  font-size:4rem;
  font-weight:900;
  margin-bottom:3rem;
}

  .title-xxl { font-size:2.75rem; }
  .title-xl  { font-size:2.5rem; }
  .title-l   { font-size:2.25rem; }
  .title-m   { font-size:2rem; }
  .title-s   { font-size:1.75rem; }
  .title-xs  { font-size:1.5rem; }
  .title-xxs { font-size:1.25rem; }

@media only screen and (min-width :  850px) { 
  .title-xxl { font-size:4.5rem; }
  .title-xl  { font-size:4.25rem; }
  .title-l   { font-size:4rem; }
  .title-m   { font-size:3.75rem; }
  .title-s   { font-size:3.5rem; }
  .title-xs  { font-size:2.25rem; }
  .title-xxs { font-size:3rem; }
}

h2 {
    font-size:2rem;
    font-weight:300;
    margin: 3rem 0 2rem;
}

h3 {
  font-size: 1.3rem;
  font-weight: 900;
  margin: 2rem 0 1rem;
}

h4 {
  font-size:1rem;
  font-weight:900;
  margin: 2rem 0 1rem;
}

p {
  margin:1.6rem 0;
}

p:first-child,
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child {
  margin-top:0;
}

p:last-child {
  margin-bottom:0;
}

a {
  color:inherit;
  text-decoration: underline;
}

strong {
    font-weight:700;
}

.black {
    font-weight:900;
}

em {
  font-style:italic;
}

.small {
  font-size:80%;
}

*:focus {
  outline: 2px solid var(--color-purple);
}




/* --------------------------------------------------
   single elements / modules
-------------------------------------------------- */

.knoe-taxmenu {
  width:100%;
  padding:2rem 0 0;
}

  .knoe-taxmenu-heading {
    color:var(--color-green-dark);
    margin: 2rem 0 1rem;
    padding-bottom: .5rem;
    border-bottom:2px solid var(--color-green-light);
    font-size:.8rem;
    font-weight:bold;
  }

    .knoe-taxmenu-heading span {
      font-size: 1.1rem;
      display:block;
      color: white;
      text-transform: uppercase;
    }

.knoe_taxonomy_with_color {
  color:var(--term-color);
}

  .knoe_taxonomy_with_color path {
    stroke:var(--term-color);
  }

.horizontallist {
  list-style: none;
  width:100%;
  padding: var(--default-padding);
  display:flex;
  gap:1rem;
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  scrollbar-color: white rgba(0,0,0,.2);
}

  .horizontallist li {
    flex-shrink:0;
    max-width: 80vw;
  }

    .horizontallist li > * {
      height:100%;
    }

.verticallist {
  list-style: none;
  display:flex;
  padding: var(--default-padding);
  flex-direction: column;
  gap:2rem;
  align-items: center;
}

  .verticallist li {
    width:100%;
  }

    .verticallist li > * {
      margin:0 auto;
    }

.wraplist {
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  justify-content: flex-start;
}

  .wraplist li {
    flex-shrink:0;
  }

    .wraplist li > * {
      height:100%;
    }

.sliderbuttons {
  position:absolute;
  right:var(--default-padding);
  top:var(--default-padding);
  display:flex;
  gap:.6rem;
}

.single-pagearea-header .sliderbuttons {
  top:0;
}

  .sliderbuttons .button {
    background:transparent;
    color:white;
    border:none;
    padding:.4rem;
    border-radius:50%;
  }

  .sliderbuttons .button:hover {
    background:transparent;
  }

  .sliderbuttons .button:focus {
    background:rgba(255,255,255,.2);
    outline:none;
  }

    .sliderbuttons .button-icon {
      width:.8rem;
    }

      .sliderbuttons .button-icon path {
        stroke-width:3;
      }



/* --------------------------------------------------
   general
-------------------------------------------------- */

.onlydesktop { display:none; }

@media (hover: hover) {
  .onlymobile { display:none !important; }
  .onlydesktop { display:inherit; }
}

body {
  background:white;
}








/* --------------------------------------------------
   cookie banner
-------------------------------------------------- */

.cookiebanner {
  display:none;
  position:fixed;
  bottom:-100%;
  transition:bottom .5s ease-out;
  width:100%;
  background:rgb(51,51,51);
  color:white;
  display:flex;
  flex-direction: column;
  gap:2rem;
  justify-content: center;
  z-index:10;
  padding:var(--default-padding);
}

  .cookiebanner.active {
    bottom:0;
  }

  .cookiebanner > * {
    flex:1 0 0;
    max-width:var(--default-max-width);
  }

  .cookiebanner-title span {
    font-size:3rem;
  }

  .cookiebanner .button:not(.button-inverse) {
    background-color: white;
    border-color:white;
    color:rgb(51 51 51);
  }

  .cookiebanner .button:focus {
    outline:2px solid #ccc;
  }

@media only screen and (min-width : 900px) { 

  .cookiebanner { flex-direction:row; }

}







/* --------------------------------------------------
   skip link (for screen readers)
-------------------------------------------------- */

.skiplink {
  display:block;
  position:absolute;
  top:-100%;
  background:var(--color-purple);
  padding:.5rem;
  text-align:center;
  color:white;
  font-size: .8rem;
  font-weight: bold;
}

.skiplink:focus {
  position:static;
}







/* --------------------------------------------------
   header
-------------------------------------------------- */

header {
  position:sticky;
  top:0;
  width:100%;
  height:var(--header-height);
  background:#fbfbfb;
  display:flex;
  justify-content: space-between;
  align-items: stretch;
  z-index:999999; /* so it sits on top of the wordpress admin bar */
  box-shadow:0 .25rem .5rem rgba(0,0,0,.2);
}

  .header-logo {
  }

    .header-logo svg {
      display:block;
      height:100%;
      width:auto;
      padding:1vh;
    }

  .header-menu {
    display:flex;
    height:100%;
  }

    .header-menu ul {
      list-style: none;
      display:flex;
      height:100%;
    }

      .header-menu li {
      }

    .header-logo:focus,
    .header-menu a:focus,
    .header-menu .button:focus {
      outline:none;
      background:var(--color-purple-lightest);
    }

    .header-menu #menu-headermenue a {
      display:flex;
      align-items: center;
      padding:0 .9rem;
      height:100%;
      font-weight:bold;
      font-size:.8rem;
      text-decoration: none;
    }

    .header-menu a:hover,
    .header-menu .current-menu-item a {
      background:var(--color-purple);
      color:white;
    }

    .header-menu .button {
      background:transparent;
      border-radius: 0;
      border:none;
      color:#333;
      box-shadow: none;
      padding: .5rem 1.2rem;
    }

      .header-menu .button-label {
        display:none;
      }

    .header-menu .button:hover  {
      background:var(--color-purple);
      color:white;
    }

@media only screen and (min-width : 1050px) { 

    .header-menu .button { padding: .5rem .9rem; }

      .header-menu .button-label { display:inherit; }
}


/* hide header nav items on small screens */

@media only screen and (max-width : 1050px) { 
  .header-menu > ul > li:nth-child(8) { display:none; }
}

@media only screen and (max-width :  950px) { 
  .header-menu > ul > li:nth-child(7) { display:none; }
}

@media only screen and (max-width :  850px) { 
  .header-menu > ul > li:nth-child(6) { display:none; }
}

@media only screen and (max-width :  750px) { 
  .header-menu > ul > li:nth-child(5) { display:none; }
}

@media only screen and (max-width :  650px) { 
  .header-menu > ul > li:nth-child(4) { display:none; }
}

@media only screen and (max-width :  550px) { 
  .header-menu > ul > li:nth-child(3) { display:none; }
}

@media only screen and (max-width :  450px) { 
  .header-menu > ul > li:nth-child(2) { display:none; }
}

@media only screen and (max-width :  400px) { 
  .header-menu > ul > li:nth-child(1) { display:none; }
}








/* --------------------------------------------------
   overlay
-------------------------------------------------- */

.overlay {
  display:block;
  position:fixed;
  top:0;bottom:0;
  left:0;right:0;
  background:var(--color-purple);
  color:white;
  z-index:9999999; /* so it sits on top of the header bar */
  padding:calc(2 * var(--default-padding));
  cursor: default;
  animation:overlayFadeIn .3s ease;
}

header button.closed .overlay {
  display:none;
}

    @keyframes overlayFadeIn {
      from {
        opacity:0;
        transform: translateX(50%);
      }

      to {
        opacity:1;
        transform: translateX(0%);
      }
    }

  .overlay-close {
    position:absolute;
    top:1rem;
    right:1rem;
    padding:1rem;
    border:none;
    background:transparent;
    cursor:pointer;
    color:var(--color-purple-darker);
  }

    .overlay-close:hover,
    .overlay-close:focus {
      color:white;
    }

  .overlay-nav {
    display:flex;    
    height: 100%;
    align-items: center;
    font-size:1rem;
  }

  .overlay ul {
    list-style: none;
  }

  .overlay-nav > ul {
    width:100%;
  }

  /* overlay language menu */

      .header-menu-language .gtranslate_wrapper {
        width:100%;
      }

        .header-menu-language .gtranslate_wrapper a {
          display:block;
          font-family: var(--font-head);
          font-size:2.5rem;
          font-weight:bold;
          color:var(--color-purple-darker);
          text-align: center;
          padding:2rem 1rem;
        }


        .header-menu-language a.glink.gt-current-lang,
        .header-menu-language a.glink:hover {
          color:white;
        }

  /* overlay search menu */

      .overlay-nav .searchform {
        width:100%;
      }

      .overlay-nav .searchform > div {
        flex-direction: column;
        align-items: center;
      }

      .overlay-nav .searchform input[type="text"] {
        width:100%;
        font-size:3rem;
        font-family:var(--font-head);
        text-align:center;
      }

/* overlay main navigation menu */

.header-menu-nav .overlay-nav > ul { 
  flex-direction:column;
  justify-content: space-evenly;
  gap:2rem;
}

.header-menu-nav ul {
  text-align: left;
}

  .header-menu-nav a {
    display:block;
    color:inherit;
    text-decoration: none;
    padding:.5rem 1rem;
  }

  .header-menu-nav a:hover,
  .header-menu-nav a:focus,
  .header-menu-nav .current-menu-item a {
    text-decoration:underline;
  }

  /* navigation subtitles */
  .header-menu-nav a[href='#'] {
    font-family: var(--font-head);
    font-size:1.2rem;
    display:block;
    margin-bottom:.5rem;
    padding:1rem;
    border-bottom:2px solid var(--color-purple-darker);
    text-transform: uppercase;
    pointer-events: none;
    cursor: default;
    font-weight:bold;
    color:var(--color-purple-darker);
  }

    .header-menu-nav .sub-menu {
      height:unset;
      flex-direction:row;
      flex-wrap:wrap;
      gap:.5rem;
    }

      .header-menu-nav .sub-menu li {

      }

@media only screen and (min-width :  800px) { 

  .header-menu-nav .overlay-nav > ul { 
    flex-wrap:wrap;
    flex-direction: row;
    gap: 0;
  }

    .header-menu-nav .overlay-nav > ul > .menu-item-has-children {
      flex-basis:50%;
    }

    .header-menu-nav .sub-menu {
      flex-direction:column;
    }

}




/* --------------------------------------------------
   main
-------------------------------------------------- */





/* --------------------------------------------------
   single page
-----------------------------------------------------
   single page header 
---------------------------------------------------- */

.single-header {
  box-shadow:.2rem .2rem .4rem rgba(0,0,0,.2);
  position:relative;

}

  .single-header-image {
    padding:1rem;
    display:flex;
    justify-content: center;
    align-items: center;
    min-height:50vh;
    background-position: center center;
    background-size:cover;
  }

    .single-header-image img {
      object-fit: cover;
      width:100%;
      height:100%;
    }

    .single-header-image .single-header-image-publikation {
      object-fit: contain;
      max-height:32rem;
    }

    .single-header-image-termin {
      text-align:center;
      font-weight:bold;
      line-height:1;
    }

      .single-header-image-termin-day {
        font-family:var(--font-head);
        font-size:6rem;
        color:white;
      }

      .single-header-image-termin-month {
        display:block;
        font-size:1.5rem;
        text-transform: uppercase;
      }

    .single-header-image-icon {
      width:10rem;
      height:10rem;
    }

      .single-header-image-icon svg {
        width:100%;
        height:auto;
      }

        .single-header-image-icon path {
          stroke-dashoffset:70;
          stroke-dasharray:70;
          animation:iconReveal 1.5s ease-out .5s forwards;
        }

        @keyframes iconReveal {
          from {
            stroke-dashoffset:70;
          }

          to {
            stroke-dashoffset:0;
          }
        }

  .single-header-text {
    padding:calc(1.5 * var(--default-padding));
  }

    .single-header-text-meta {
      margin-top:0;
      margin-bottom:2rem;
      text-transform:uppercase;
      font-size:.8rem;
    }

      .single-header-text-meta-line {
        display:flex;
        gap:.25rem;
      }

        .single-header-text-meta svg {
          width:1rem;
          height:auto;
        }

          .single-header-text-meta path {
            stroke:currentColor;
          }

      .single-header-text-meta-team:hover { color:var(--color-green); }
      .single-header-text-meta-team:hover path { stroke:var(--color-green); } 

    .single-header-text-subtitle {
      margin:0;
    }



/* >800px */

@media only screen and (min-width :  800px) { 

.single-header {
  display:flex;
  align-items: stretch;
}

  .single-header-image,
  .single-header-text {
    flex:50% 0 0;
  }

  .single-header-image {
    border-bottom:none;
    min-height:65vh;
  }

    .single-header-image img {
    }

  .single-header-text {
    display:flex;
    flex-direction:column;
    justify-content: center;
  }

}



/* --------------------------------------------------
   single page associated
---------------------------------------------------- */

.single-associated {
  padding:var(--default-padding);
  text-align:center;
  background:var(--color-green);
}

  .single-associated-project {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    text-decoration: none;
  }

  .single-associated-project img {
    width: 4rem;
    height: 4rem;
    object-fit: cover;
    border-radius: 50%;
    box-shadow:.2rem .2rem .4rem rgba(0,0,0,.2);
  }

    .single-associated-project span {
      text-align: left;
    }

    .single-associated-project-title {
      display:block;
      font-family: var(--font-head);
      font-weight:900;
      color:white;
    }


/* --------------------------------------------------
   single page main 
---------------------------------------------------- */

main {
  width:100%;
  padding:5rem 1rem;
  display:flex;
  justify-content:center;
  align-items: flex-start;
  gap:5rem;
  flex-direction:column;
}

  .content {
    max-width:var(--default-max-width);
  }

    .content ul {
      padding-left:40px;
    }

      .content li {
        padding:.25rem 0;
      }

      .content blockquote {
        font-family:var(--font-head);
        font-size:1.3rem;
        font-weight:300;
        padding-left:2rem;
        padding:2rem 0 2rem 2rem;
        position:relative;
      }

      .content blockquote:before {
        content: '”';
        font-style:normal;
        font-size:3rem;
        position:absolute;
        left:0;
        top:0;
        color:var(--color-green);
        font-weight:900;
      }


/* 
  for pages with sidebars
  switch to horizontal layout
  >1000px
*/

@media only screen and (min-width : 1000px) { 

main:not(.archive-person) {
  flex-direction:row;
}

}


/* --------------------------------------------------
   single page areas 
---------------------------------------------------- */

.single-pagearea {
  border-top:.5rem solid var(--color-green-light);
  padding:calc(2 * var(--default-padding)) 0;
  background-color:var(--color-green);
}

  .single-pagearea-header {
    padding:0 var(--default-padding);
    position:relative;
  }

    .single-pagearea-header h2 {
      color:white;
      text-transform: uppercase;
      font-weight:900;
      margin-bottom:3rem;
      padding-bottom:.5rem;
      font-size:1.1rem;
      border-bottom:2px solid rgba(0,0,0,.2);
    }

  .single-pagearea .wraplist,
  .single-pagearea .horizontallist {
    /*padding:0 var(--default-padding);*/
  }

.single-team {
}

  .single-team .wraplist {
    justify-content: center;
  }

.single-foerderer {
  background:white;
}

  .single-foerderer .single-pagearea-header h2 {
    color:black;
  }

.single-material {
  border-top:.5rem solid var(--color-gray-light);
  background-color:var(--color-gray);
}

.material {
  max-width: var(--default-max-width);
  display:flex;
}

  .material-icon {
    margin-top:1rem;
    width:6rem;
    height:6rem;
    flex-shrink: 0;
    background:var(--color-purple);
    padding:.5rem;
    border-radius:50%;
    display: flex;
    justify-content: center;
    align-items:center;
    box-shadow:.2rem .2rem .4rem rgba(0,0,0,.2);
    z-index:2;
  }

    .material-icon svg {
      width:2rem;
      height:auto;
    }

      .material-icon path {
        stroke:white;
      }

  .material-text {
    flex:1;
    padding:2rem 2rem 2rem 4rem;
    margin-left:-3rem;
    position:relative;
    background:white;
  }

    .material-text-title {
      font-size:1.5rem;
      font-weight:900;
      margin:0;
    }

    .material-text-buttons {
      /*margin:0;*/
    }


/* --------------------------------------------------
   sidebar 
---------------------------------------------------- */

.sidebar {
    width:100%;
    display:flex;
    flex:1;
    flex-direction:column;
    gap:3rem;
}

  .sidebar h3 {
    font-family:var(--font-body);
    text-transform: uppercase;
    font-size: .8rem;
    color:#666;
  }

  .sidebar h3:first-of-type {
    margin-top:0;
  }


/* >800px */

@media only screen and (min-width : 1000px) { 

  .sidebar {
    max-width:calc(var(--default-max-width) / 1.618);
    position: sticky;
    top: calc(var(--default-padding) + var(--header-height));
    flex-direction:column;
  }

}



/* --------------------------------------------------
   sidebar ansprechperson
---------------------------------------------------- */

.sidebar-ansprechperson {
}

.sidebar-ansprechperson-details {
    display:flex;
    gap:1rem;
    align-items: center;
    margin-bottom:2rem;
  }

    .sidebar-ansprechperson-details-image {
      width:5rem;
      height:5rem;
      flex-shrink:0;
    }

      .sidebar-ansprechperson-details-image img {
        display:block;
        width:100%;
        height:100%;
        object-fit: cover;
        border-radius:50%;
        background:#eee;
      }

      .sidebar-ansprechperson-details-text p {
        text-align: left;
        margin:0;
      }

      .sidebar-ansprechperson-details-text-name {
        font-weight:bold;
      }

      .sidebar-ansprechperson-details-text-pronouns,
      .sidebar-ansprechperson-details-text-team {
        font-size:.8rem;
      }







/*
--------------------------------------------------
   thema
-------------------------------------------------- 
*/

.thema {
  display:flex;
  gap:3rem;
  flex-direction:column;
  align-items: center;
  justify-content: center;
  padding:calc(1.5 * var(--default-padding));
}

@media only screen and (min-width :  800px) {  .thema { flex-direction:row; align-items: flex-start; } }


  .thema-icon {
    width:6rem;
    height:6rem;
  }

    .thema-icon svg {
      display:block;
      width:100%;
      height:100%;
    }

      .thema-icon path {
        stroke:var(--term-color);
        /*stroke-width: 1px;*/
      }

  .thema-text {
    flex:1;
    max-width:32rem;
  }

    .thema-text-title {
      font-size:2rem;
      font-weight:600;
      margin-bottom:1rem;
    }

    .thema-text-description {
    }





/*
--------------------------------------------------
   general meta text (author, category, etc)
-------------------------------------------------- 
*/

.metatext {
  margin-top:0;
  margin-bottom:1rem;
  text-transform:uppercase;
  font-size:.8rem;
}

  .metatext-line {
    margin:0;
    display:flex;
    gap:.25rem;
  }

  .metatext-line-thema {
    padding-bottom:.5rem;
  }

    .metatext svg {
      width:1rem;
      height:auto;
      color:inherit;
    }

      .metatext path {
        stroke:currentColor;
      }





/*
--------------------------------------------------
   projekt
-------------------------------------------------- 
*/

.projekt {
  width:100%;
  max-width:52rem;
  display:flex;
  gap:2rem;
  flex-direction:column;
  align-items: center;
}

  .projekt-image {
    width:15rem;
    height:15rem;
    flex-shrink:0;
    z-index:2;
  }

    .projekt-image img {
      display:block;
      object-fit:cover;
      width:100%;
      height:100%;
      box-shadow:.2rem .2rem .4rem rgba(0,0,0,.2);
      border-radius:50%;
    }

  .projekt-text {
    padding:5rem 1rem 1.5rem;
    margin:-5rem 0 0;
    background:white;
  }

    .projekt-text-title {
      font-size:1.5rem;
      font-weight:600;
      margin:1rem 0;
    }

    .projekt-text-subtitle {
      margin:1rem 0;
      font-size:1.2rem;
      font-weight:300;
    }


/* >800px */

@media only screen and (min-width :  800px) { 

  .projekt {
    flex-direction:row;
    align-items: flex-start;
  }

  .projekt-text {
    padding:1.5rem 1.5rem 1.5rem 5rem;
    margin:0 0 0 -5rem;
  }

    .projekt-text-title {
      font-size:2rem;
    }

    .projekt-text-subtitle {
      font-size:1.5rem;
    }

}

/*
       .--.                   .---.
   .---|__|           .-.     |~~~|
.--|===|--|_          |_|     |~~~|--.
|  |===|  |'\     .---!~|  .--|   |--|
|%%|   |  |.'\    |===| |--|%%|   |  |
|%%|   |  |\.'\   |   | |__|  |   |  |
|  |   |  | \  \  |===| |==|  |   |  |
|  |   |__|  \.'\ |   |_|__|  |~~~|__|
|  |===|--|   \.'\|===|~|--|%%|~~~|--|
^--^---'--^    `-'`---^-^--^--^---'--' hjw

--------------------------------------------------
   publikation
-------------------------------------------------- */

.publikation {
  width:100%;
  max-width:48rem;
}

  .publikation-image {
    width:14rem;
    flex-shrink:0;
    padding:0 0 2rem 0;
    display:flex;
    margin:auto;
    z-index:2;
  }

    .publikation-image img {
      width:100%;
      height:auto;
      box-shadow:.2rem .2rem .4rem rgba(0,0,0,.2);
    }

  .publikation-text {
    background:white;
    padding:5rem 1rem 1.5rem;
    margin:-5rem 0 0;
  }

    .publikation-text-meta {
    }

    .publikation-text-main {
    }

    .publikation-text-main-title {
      font-weight: 900;
      font-size: 1.6rem;
      margin:1rem 0;
    }

    .publikation-text-main-subtitle {
      font-weight: 300;
      font-size: 1.3rem;
      margin:1rem 0;
    }

    .publikation-text-main-description {
      font-size:.9rem;
      margin:2rem 0;
    }


/* >800px */

@media only screen and (min-width :  800px) { 

  .publikation {
    display:flex;
    flex-direction:row;
    align-items: flex-start;
  }

  .publikation-image {
    padding:0 2rem 0 0;
  }

  .publikation-text {
    padding:1.5rem 1.5rem 1.5rem 6.5rem;
    margin:0 0 0 -5rem;
  }

}











/* --------------------------------------------------
   person
-------------------------------------------------- */


.person {
  max-width:25rem;
  display:flex;
  flex-direction: column;
}

  .person-header {
    display:flex;
    flex-direction:column;
    align-items: center;
    width:100%;
    margin-bottom:1rem;
  }

    .person-header-image {
      width:10rem;
      height:10rem;
      flex-shrink:0;
      position:relative;
      background: var(--color-green-light);
      border-radius: 50%;
      box-shadow:.2rem .2rem .4rem rgba(0,0,0,.2);
    }

      .person-header-image img {
        width:100%;
        height:100%;
        object-fit: cover;
        border-radius:50%;
      }

      .person-header-image-auszeit {
        position: absolute;
        bottom: -.5rem;
        left: 50%;
        transform: translateX(-50%);
        padding: .4rem 1rem;
        background: var(--color-gray-dark);
        color: white;
        font-size: .8rem;
        font-weight: bold;
        white-space: nowrap;
      }

    .person-main {
      padding: 5em 1rem 1rem;
      margin-top:-5rem;
      background:white;
      display: flex;
      flex-direction: column;
      flex: 1;
    }

      .person-main-text {
        display: flex;
        flex-direction: column;
        flex: 1;
      }

        .person-main-text-meta {
          margin-bottom:.25rem;
        }

        .person-main-text-name {
          margin:0 0 .5rem;
        }

        .person-main-text-pronouns {
          font-size:1.1rem;
          margin:0 0 1rem;
          font-weight:300;
        }

    .person-main-buttons {
      margin-top:1.5rem;
    }






/* --------------------------------------------------
   termin 
-------------------------------------------------- */


.termin {
  max-width: var(--default-max-width);
  display:flex;
  flex-direction:column;
}

  .termin-date {
    width:6rem;
    height:6rem;
    flex-shrink: 0;
    background:var(--color-purple);
    color:white;
    font-weight:bold;
    text-align:center;
    padding:.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-shadow:.2rem .2rem .4rem rgba(0,0,0,.2);
    z-index:2;
  }

    .termin-date-day {
      font-family: var(--font-head);
      font-size:1.6rem;
    }

    .termin-date-month {
      font-size:.9rem;
      text-transform: uppercase;
    }

  .termin-text {
    flex:1;
    padding:4rem 1rem 2rem;
    margin:-3rem 0 0;
    position:relative;
    background:white;
  }

    .termin-text-title {
      font-size:1.5rem;
      font-weight:900;
      margin:0;
    }

    .termin-text-subtitle {
      margin-top:.5rem;
    }

    .termin-text-buttons {
      margin:0;
    }


/* >800px */

@media only screen and (min-width :  800px) { 

  .termin {
    flex-direction:row;
  }

  .termin-text {
    padding:2rem 2rem 2rem 4rem;
    margin:0 0 0 -3rem;
  }

}




/* --------------------------------------------------
   blogpost 
-------------------------------------------------- */

.post {
  display:flex;
  flex-direction:column;
  align-items: center;
}

  .post-image {
    width:14rem;
    height:14rem;
    flex-shrink: 0;
    box-shadow:.2rem .2rem .4rem rgba(0,0,0,.2);
    background:white;
    z-index:2;
  }

    .post-image img {
      width:100%;
      height:100%;
      object-fit:cover;
    }

  .post-text {
    max-width:var(--default-max-width);
    padding:var(--default-padding);
    background:white;
    padding:5rem 1rem 2rem;
    margin:-3rem 0 0;
  }

    .post-text-title {
      margin:1rem 0;
      font-weight:900;
      font-size:1.7rem;
    }

    .post-text-subtitle {
      margin-bottom:2rem;
      font-weight:300;
    }


/* >800px */

@media only screen and (min-width :  800px) { 

  .post {
    flex-direction:row;
    align-items: flex-start;
  }

  .post-text {
    padding:2rem 2rem 2rem 5rem;
    margin:0 0 0 -3rem;
  }

}





/* --------------------------------------------------
   artikel
-------------------------------------------------- */

.artikel {
  display:flex;
  flex-direction:column;
  align-items: center;
  gap:var(--default-padding);
  max-width:48rem;
}

  .artikel-logo {
    width:10rem;
    height:10rem;
    flex-shrink:0;
    padding:1rem;
    background:white;
    box-shadow:.2rem .2rem .4rem rgba(0,0,0,.2);
    z-index:2;
  }

    .artikel-logo img {
      width:100%;
      height:100%;
      object-fit: contain;
      object-position: center;
    }

  .artikel-text {
    padding:5rem 1rem 2rem;
    margin:-4rem 0 0;
    background:white;
    max-width:var(--default-max-width);
  }

    .artikel-text-title {
      font-size:1.5rem;
      font-weight:900;
      margin:.5rem 0 1rem;
    }


/* >800px */

@media only screen and (min-width :  800px) { 

  .artikel {
    flex-direction:row;
    align-items: flex-start;
  }

  .artikel-text {
    padding:2rem 2rem 2rem 5rem;
    margin:0 0 0 -4rem;
  }

}




/* --------------------------------------------------
   foerderer
-------------------------------------------------- */

.foerdererlist {
  list-style: none;
  display:flex;
  gap:4rem;
  justify-content: center;
  align-items: center;
  flex-wrap:wrap;
}

  .foerderer {
    width:9rem;
    text-align:center;
  }

    .foerderer a {
      display:block;
    }

      .foerderer img {
        display:block;
        width:100%;
        height:auto;
      }


/* >800px */

@media only screen and (min-width :  800px) { 

  .foerderer {
    width:11rem;
    text-align:center;
  }

}





/* --------------------------------------------------
   search 
-------------------------------------------------- */

.searchform > div {
  display:flex;
  gap:1rem;
}

  .searchform input[type="text"] {
    flex:1;
    background:transparent;
    color:white;
    font-weight:bold;
    font-family:var(--font-body);
    font-size:.9rem;
    padding:.5rem;
    border:none;
    border-bottom:2px solid white;
  }

  .searchform input[type="text"]:focus {
    background:rgba(255,255,255,.1);
    outline:none;
  }

  .searchform input[type="submit"] {
    background-color:transparent;
    color:white;
    font-size:.8rem;
    font-family:var(--font-body);
    padding:.5rem .8rem;
    border:2px solid white;
    border-radius:.8rem;
    line-height:1rem;
    font-weight:bold;
    cursor:pointer;
  }

  .searchform input[type="submit"]:hover {
    background-color:rgba(255,255,255,.2);
  }

.searchresult {
  background:white;
  padding:var(--default-padding);
  max-width:var(--default-max-width);
}

  .searchresult-title {
    font-size:1.6rem;
    font-weight:bold;
    margin-top:1.5rem;
  }

.archive-search-noresults {
  color:white;
}



/* --------------------------------------------------
    page intro
    (for archive and form pages) 
---------------------------------------------------- */

.page-intro {
  display:flex;
  flex-direction: column;
  padding:var(--default-padding) 0;
  background-color: rgba(0, 0, 0, .3);
  color:white;
}

  .page-intro > * {
    padding:var(--default-padding);
  }

  .page-intro h1 {
    margin:0;
  }

@media only screen and (min-width :  800px) { 

  .page-intro { flex-direction:row; }
  .page-intro > * { flex:50% 0 0; }
  .page-intro-description { max-width:var(--default-max-width); }

}




/* --------------------------------------------------
   archive page 
---------------------------------------------------- */

.archive {
  background-color:var(--color-green);
  display:inherit;
  padding:0;
}

  .archive-main {

  }

    .archive-main-nav {
      padding:var(--default-padding);
    }

    .archive-main-nav .button {
      border-color:white;
      color:white;
      background:transparent;
    }

    .archive-main-nav .button:hover {
      background:var(--color-green-light);
    }

    .archive-main-nav .button:focus {
      outline: 2px solid var(--color-green-light);
    }

    .archive-main-nav .button-team {
      color:var(--term-color) !important;
    }

    .archive-main-nav .button.active {
      color:#333;
      border-color:#f7f7f7;
      background:white;
    }

    .archive-main-nav .button.active:hover {
      background:white;
    }

    .archive-main-items {
      padding: var(--default-padding) calc(var(--default-padding) * 0.5);
    }

      .archive-main-items-subheading {
        font-size:1.1rem;
        text-transform: uppercase;
        color:white;
        padding-bottom:.5rem;
        border-bottom:2px solid var(--color-green-light);
        margin:6rem 0 4rem;
      }

/* on larger screens, display archive navigation sideways and sticky */

@media only screen and (min-width : 1100px) { 

  .archive-main {
    display:flex;
    align-items: flex-start;
    gap:1rem;
  }

  .archive-main-nav {
    position: sticky;
    top: 0;
    flex:1 1 12rem;
  }

  .archive-main-items {
    flex:4 1 0;
    padding:calc(var(--default-padding) * 2) var(--default-padding);
  }

}

.archive-person .wraplist li,
.single-team .wraplist li {
  flex:20rem 1 0;
}

  .archive-person .wraplist .person, 
  .single-team .wraplist .person {
    margin:0 auto;
  }

.archive-themen .wraplist li {
  flex:30rem 1 0;
  max-width: 100vw;
}

.archive-themen {
  max-width: unset;
  padding:0;
}

  .archive-themen .verticallist {
    gap:0;
    width:100%;
  }



/* --------------------------------------------------
   frontpage
-------------------------------------------------- */

main.frontpage {
  padding:0;
  display:block;
}

.frontpage-projects,
.frontpage-calendar,
.frontpage-publications,
.frontpage-blog,
.frontpage-news {
  padding:calc(1.5*var(--default-padding)) 0;
  background:var(--color-green);
}

.frontpage-newsletter {
  padding:calc(2*var(--default-padding)) var(--default-padding);
}

.frontpage-imagesection {
  display:flex;
  align-items: stretch;
  flex-direction:column;
}

  .frontpage-imagesection > * {
    flex:50% 1 1;
  }

  .frontpage-imagesection-image {
  }

  .frontpage-imagesection--reverse .frontpage-imagesection-image {
  }

    .frontpage-imagesection-image img,
    .frontpage-imagesection-image video {
      display:block;
      object-fit: cover;
      width:100%;
      height:0;min-height:100%;
      min-height:30rem;
    }

  .frontpage-imagesection-text {
    padding:calc(2*var(--default-padding)) var(--default-padding);
    align-self: center;
  }

    .frontpage-imagesection-text > * {
      max-width:var(--default-max-width);
      margin-left: auto;
      margin-right: auto;
    }

    .frontpage-imagesection-text h1 {
      font-size:2rem;
      margin-bottom:1rem;
    }

    .frontpage-imagesection-text h2 {
      font-size:1.75rem;
      font-weight:900;
      margin-bottom:.75rem;
    }

    .frontpage-imagesection-text h3 {
      font-size:1.4rem;
      font-weight:300;
    }

@media only screen and (min-width : 800px) { 

    .frontpage-imagesection-text h1 {
      font-size:3rem;
    }

    .frontpage-imagesection-text h2 {
      font-size:2.5rem;
    }

    .frontpage-imagesection-text h3 {
      font-size:1.8rem;
    }

  .frontpage-imagesection {
    flex-direction: row;
  }

  .frontpage-imagesection--reverse {
    flex-direction: row-reverse;
  }

}




  .frontpage-area-title {
    padding:var(--default-padding);
    position:relative;
  }

    .frontpage-area-title h2 {
      color:white;
      margin:0 0 1rem;
      padding-bottom:.5rem;
      padding-right:4rem;
      text-transform: uppercase;
      font-size:1.1rem;
      font-weight:900;
      border-bottom:2px solid rgba(0,0,0,.2);
    }

  .frontpage-hero {
  }


.frontpage-newsletter {
  display:flex;
  flex-direction: column;
  gap:var(--default-padding);
  background:var(--color-purple);
}

  .frontpage-newsletter-title {
    flex-basis:50%;
  }

    .frontpage-newsletter-title h2 {
      font-size:2.5rem;
      font-weight:900;
      color:white;
    }

  .frontpage-newsletter-form {
    flex-basis:50%;
  }

  .frontpage-newsletter form {
    width:100%;
    display:flex;
    flex-direction: column;
    gap:1rem;
  }

    .frontpage-newsletter input[type=text] {
      flex:1;
      padding:1rem;
      background:white;
      border:none;
      font-family:'Atkinson Hyperlegible', sans-serif;
      font-size: 1rem;
    }

    .frontpage-newsletter input[type=submit] {
      width: min-content;
    }

    .frontpage-newsletter-smallprint {
      margin-top:1rem;
      font-size:.8rem;
      opacity:.8;
      color:white;
    }

  @media only screen and (min-width :  800px) { 

    .frontpage-newsletter-title h2 {
      font-size:3.5rem;
    }

    .frontpage-newsletter {
      flex-direction: row;
      align-items: center;
    }

  }

.frontpage-testimonials {
  color:black;
}

  .testimonials {
    list-style: none;
    display:flex;
    flex-direction: column;
  }

    .testimonial {
      padding:var(--default-padding);
    }

      .testimonial-quote {
        font-family:var(--font-head);
        font-weight:300;
        font-size:1.4rem;
      }

      .testimonial-author {
        font-size:.8rem;
        text-transform: uppercase;
        opacity:.8;
      }

  @media only screen and (min-width :  800px) { 
    .testimonials {
      flex-direction: row;
    }

      .testimonial {
        flex-basis:50%;
      }

      .testimonial:first-child {
      }

      .testimonial-quote {
        font-size:1.8rem;
      }
  }

.frontpage-requests {
}

    .frontpage-requests label,
    .frontpage-requests select,
    .frontpage-requests input {
      font-size:1.1rem;
      line-height:1.6;
      height:1.8rem;
    }

    .frontpage-requests select,
    .frontpage-requests input {
      font-weight:bold;
      border:none;
      border-bottom:1px dashed black;
    }

    .frontpage-requests input[type="submit"] {
      font-size:.8rem;
      line-height:1;
      height:unset;
      border: 2px solid var(--color-purple);
      padding: .5rem .8rem;
    }




/* --------------------------------------------------
   form pages
   (requests and newsletter)
----------------------------------------------------- */

.form {
  display:inherit;
  padding:0;
  background-color: var(--color-purple);
}

  .form-content {
    padding:var(--default-padding);
  }

    .form-content form,
    .form-content .form-message {
      width:100%;
      max-width:var(--default-max-width);
      margin:0 auto;
      background:white;
      padding:calc(1.5 * var(--default-padding));
    }

  .form h2 {
    margin-bottom:2rem;
    font-size:1.5rem;
    font-weight:bold;
  }

  .form .form-warning {
    display:none;
    padding:1rem;
    border:1px solid red;
    font-size:.8rem;
    color:red;
    background:rgba(255,0,0,.1);
  }

    .form label,
    .form select,
    .form input {
      font-size:1.1rem;
      line-height:1.6;
      height:1.8rem;
    }

    .form select,
    .form input {
      font-weight:bold;
      border:none;
      border-bottom:1px dashed black;
    }

    .form input[type=number] {
      width:10rem;
    }

    .form input.missing {
      background:rgba(255,0,0,.1);
    }

    .form input:focus {
      outline:none;
      background:var(--color-purple-lightest);
    }

    .form input[type=submit] {
      font-size:.8rem;
      border:2px solid var(--color-purple);
      line-height:1;
      height:unset;
    }

    .form div[data-type] p {
      animation:requestsFadein .3s ease;
    }

    @keyframes requestsFadein {
      from {
        opacity:0;
        transform: translateY(100%);
      }

      to {
        opacity:1;
        transform: translateY(0%);
      }
    }

    .requests-namesender {
      font-family:var(--font-head);
      font-size:1.5rem;
      font-weight:bold;
      display:block;
    }




/* --------------------------------------------------
   newsletter page
----------------------------------------------------- */

.wpcf7-form {
}

  .wpcf7 label {
    text-transform:uppercase;
    font-size:.9rem;
    opacity:.8;
    margin-bottom:.5rem;
  }

  .wpcf7 input[type="text"], 
  .wpcf7 input[type="email"] {
    display:block;
    width:100%;
    font-size:1rem;
    padding:.5rem;
    font-family:var(--font-body);
  }

  .wpcf7-form-control-wrap:first-of-type {
    display:inline-block;
    margin-top:.5rem;
  }

  .wpcf7 input[type="checkbox"] {
    height:unset;
  }

  .wpcf7 input[type="submit"] {
    background:var(--color-purple);
    color:white;
    padding:.5rem .8rem;
    border:2px solid var(--color-purple);
    border-radius:.8rem;
    text-decoration: none;
    font-size:.8rem;
    line-height:1rem;
    font-weight:bold;
    cursor:pointer;
  }




/* --------------------------------------------------
   footer
-------------------------------------------------- */

footer {
  background:var(--color-purple-darker);
  color:white;
}

  footer .button {
    color: white;
    border-color: var(--color-purple-lighter);
  }

  footer .button:hover {
    background-color:var(--color-purple-lighter);
  }

  footer ul {
    list-style: none;
  }

  .footer-newsletter {
    padding:var(--default-padding);
  }

    .footer-newsletter form {
      width:100%;
      max-width:var(--default-max-width);
      margin:0 auto;
      display:flex;
      flex-direction: column;
      gap:1rem;
    }

      .footer-newsletter input[type=text] {
        flex:1;
        padding:.75rem;
        background:white;
        border:none;
        font-family:'Atkinson Hyperlegible', sans-serif;
        font-size: .8rem;
      }

      .footer-newsletter input[type=submit] {
        width: min-content;
      }

    .footer-newsletter-smallprint {
      font-size:.8rem;
      max-width:var(--default-max-width);
      margin:1rem auto 0;
    }

  .footer-social,
  .footer-admin,
  .footer-menu > ul {
    display:flex;
    justify-content: center;
    padding:var(--default-padding);
  }

    .footer-social .buttonset {
      justify-content: center;
      list-style: none;
    }

  .footer-menu > ul {
    gap: var(--default-padding);
    flex-wrap:wrap;
    font-size:.8rem;
    text-transform: uppercase;
  }


    .footer-menu > ul > .menu-item-has-children {
      flex-basis:8rem;
    }

      .footer-menu a {
        color:var(--color-purple-lightest);
        text-decoration: none;
      }

      .footer-menu a:hover,
      .footer-menu .current-menu-item a {
        color:white;
      }

      .footer-menu a[href='#'] {
        pointer-events: none;
        cursor: default;
        font-weight:bold;
        color:white;
      }

  @media only screen and (min-width :  800px) { 

    .footer-newsletter form { flex-direction: row; } 

    .footer-menu > ul { gap:calc(2*var(--default-padding)); } 


    .footer-menu > ul > .menu-item-has-children {
      flex-basis:10rem;
    }
  }