* {
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;
} table {
border-collapse: collapse;
border-spacing: 0;
}  @font-face {
font-display: swap; font-family: 'Unbounded';
font-style: normal;
font-weight: 200;
src: url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/unbounded-v7-latin_latin-ext-200.woff2) format('woff2'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/unbounded-v7-latin_latin-ext-200.ttf) format('truetype'); } @font-face {
font-display: swap; font-family: 'Unbounded';
font-style: normal;
font-weight: 400;
src: url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/unbounded-v7-latin_latin-ext-regular.woff2) format('woff2'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/unbounded-v7-latin_latin-ext-regular.ttf) format('truetype'); } @font-face {
font-display: swap; font-family: 'Unbounded';
font-style: normal;
font-weight: 800;
src: url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/unbounded-v7-latin_latin-ext-800.woff2) format('woff2'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/unbounded-v7-latin_latin-ext-800.ttf) format('truetype'); } @font-face {
font-display: swap; font-family: 'Unbounded';
font-style: normal;
font-weight: 900;
src: url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/unbounded-v7-latin_latin-ext-900.woff2) format('woff2'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/unbounded-v7-latin_latin-ext-900.ttf) format('truetype'); } @font-face {
font-display: swap; font-family: 'Atkinson Hyperlegible';
font-style: normal;
font-weight: 400;
src: url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-regular.eot); src: url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-regular.eot?#iefix) format('embedded-opentype'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-regular.woff2) format('woff2'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-regular.woff) format('woff'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-regular.ttf) format('truetype'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-regular.svg#AtkinsonHyperlegible) format('svg'); } @font-face {
font-display: swap; font-family: 'Atkinson Hyperlegible';
font-style: italic;
font-weight: 400;
src: url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-italic.eot); src: url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-italic.eot?#iefix) format('embedded-opentype'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-italic.woff2) format('woff2'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-italic.woff) format('woff'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-italic.ttf) format('truetype'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-italic.svg#AtkinsonHyperlegible) format('svg'); } @font-face {
font-display: swap; font-family: 'Atkinson Hyperlegible';
font-style: normal;
font-weight: 700;
src: url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-700.eot); src: url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-700.eot?#iefix) format('embedded-opentype'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-700.woff2) format('woff2'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-700.woff) format('woff'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-700.ttf) format('truetype'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-700.svg#AtkinsonHyperlegible) format('svg'); } @font-face {
font-display: swap; font-family: 'Atkinson Hyperlegible';
font-style: italic;
font-weight: 700;
src: url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-700italic.eot); src: url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-700italic.eot?#iefix) format('embedded-opentype'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-700italic.woff2) format('woff2'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-700italic.woff) format('woff'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-700italic.ttf) format('truetype'), url(//konzeptwerk-neue-oekonomie.org/wp-content/themes/konzeptwerk/fonts/atkinson-hyperlegible-v10-latin-700italic.svg#AtkinsonHyperlegible) format('svg'); } 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; }
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);
} .knoe-taxmenu {
width: 100%;
padding: 2rem 0 0;
}
.knoe-taxmenu-heading {
color: var(--color-green-darker);
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);
}
.knoe_taxonomy_with_link {
text-decoration: none;
}
.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;
padding: var(--default-padding);
}
.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;
} .wp-block-gallery,
.wp-block-accordion,
.wp-block-site-logo {
margin: var(--default-padding) 0;
} .onlydesktop {
display: none;
}
@media (hover: hover) {
.onlymobile {
display: none !important;
}
.onlydesktop {
display: inherit;
}
}
body {
background: white;
} .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;
}
} .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 {
position: sticky;
top: 0;
width: 100%;
height: var(--header-height);
background: #fbfbfb;
display: flex;
justify-content: space-between;
align-items: stretch;
z-index: 999999; 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[title=donate] {
background: var(--color-green-lighter);
}
.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;
}
} @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 {
display: block;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: var(--color-purple);
color: white;
z-index: 9999999; 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%;
} .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-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;
} .header-menu-nav .overlay-nav>ul {
flex-direction: column;
justify-content: space-evenly;
gap: .5rem;
max-height: 90vh;
}
.header-menu-nav ul {
text-align: left;
}
.header-menu-nav a {
display: block;
color: inherit;
text-decoration: none;
padding: .5rem 1rem;
font-weight: normal;
}
.header-menu-nav a:hover,
.header-menu-nav a:focus,
.header-menu-nav .current-menu-item a {
text-decoration: underline;
} .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;
}
} .banner {
background: var(--color-green);
padding: 1rem;
flex-direction: column;
gap: 2rem;
display: none;
}
.banner.active {
display: flex;
}
.banner-content {
max-width: calc(1.5 * var(--default-max-width));
display: flex;
flex-direction: row;
gap: 2rem;
flex: 1;
max-width: var(--default-max-width);
}
.banner-content-image img {
width: 5rem;
height: 5rem;
border-radius: 50%;
object-fit: cover;
box-shadow: .2rem .2rem .4rem rgba(0, 0, 0, .2);
}
.banner-content-text {}
.banner-content-text p {
margin: 0;
}
.banner-content-text-announce {
font-weight: bold;
font-size: .8rem;
}
.banner-content-text-title {
color: white;
font-size: 1.2rem;
}
p.banner-content-text-meta {
font-size: .8rem;
margin-top: .5rem;
font-weight: bold;
}
.banner-buttons .button:not(.button-inverse) {
background-color: white;
border-color: white;
color: #333;
}
@media only screen and (min-width : 800px) {
.banner {
flex-direction: row;
align-items: center;
justify-content: center;
}
.banner-buttons {
flex-direction: column;
}
}  .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-thema-header .single-header-image {
background-color: var(--color-gray-lighter);
}
.single-thema-header path {
stroke: var(--term-color);
}
.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;
} @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-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;
} 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;
} @media only screen and (min-width : 1000px) {
main:not(.archive-person) {
flex-direction: row;
}
} .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 { }
.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 { } .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;
} @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-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 {
font-size: .8rem;
}
.sidebar-ansprechperson-details-text-phone {
font-size: .9rem;
margin-top: .5rem;
} .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); }
.thema-text {
flex: 1;
max-width: 32rem;
}
.thema-text-title {
font-size: 2rem;
font-weight: 600;
margin-bottom: 1rem;
}
.thema-text-description {} .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 {
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;
} @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;
}
} .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;
} @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 {
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 {
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;
} @media only screen and (min-width : 800px) {
.termin {
flex-direction: row;
}
.termin-text {
padding: 2rem 2rem 2rem 4rem;
margin: 0 0 0 -3rem;
}
} .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 {
width: var(--default-max-width);
max-width: 100%;
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;
} @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;
}
} .stelle {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
max-width: 48rem;
}
.stelle-image {
width: 15rem;
height: 15rem;
flex-shrink: 0;
z-index: 2;
}
.stelle-image img {
display: block;
object-fit: cover;
width: 100%;
height: 100%;
box-shadow: .2rem .2rem .4rem rgba(0, 0, 0, .2);
border-radius: 50%;
}
.stelle-text {
background: white;
padding: 6.5rem 1rem 1.5rem;
margin: -5rem 0 0;
}
.stelle-text-meta {}
.stelle-text-main {}
.stelle-text-main-title {
font-weight: 900;
font-size: 1.6rem;
margin: 1rem 0;
}
.stelle-text-main-subtitle {
font-weight: 300;
font-size: 1.3rem;
margin: 1rem 0;
}
.stelle-text-main-description {
font-size: .9rem;
margin: 2rem 0;
} @media only screen and (min-width : 800px) {
.stelle {
display: flex;
flex-direction: row;
}
.stelle-text {
padding: 1.5rem 1.5rem 1.5rem 7.5rem;
margin: 0 0 0 -5rem;
}
} .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;
} @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;
}
} .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;
} @media only screen and (min-width : 800px) {
.foerderer {
width: 11rem;
text-align: center;
}
} .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-noresults {
color: white;
padding: var(--default-padding);
max-width: var(--default-max-width);
margin: 0 auto;
} .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 {
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;
}
.archive-main-items .wraplist {
padding: 0;
} @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: 40rem 1 0;
max-width: 100vw;
}
.archive-themen {
max-width: unset;
padding: 0;
}
.archive-themen .verticallist {
gap: 0;
width: 100%;
} 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-themen {
padding: calc(2*var(--default-padding)) var(--default-padding);
background-color: var(--color-purple);
}
.frontpage-themen .frontpage-themen-title {
padding: 0;
}
.frontpage-themen .button {
background-color: var(--color-purple);
color: white;
border-color: white;
}
.frontpage-themen .button:hover {
background-color: white;
color: var(--color-purple);
}
.frontpage-newsletter {
padding: calc(2*var(--default-padding)) var(--default-padding);
}
.frontpage-imagesection {
display: flex;
align-items: stretch;
flex-direction: column;
}
.frontpage-imagesection>* {
flex: 1 0 0;
}
.frontpage-imagesection-image {
min-height: 22rem;
overflow: hidden;
position: relative;
}
.frontpage-imagesection--reverse .frontpage-imagesection-image {}
.frontpage-imagesection-image img,
.frontpage-imagesection-image video {
display: block;
object-fit: cover;
position: absolute;
min-width: 1000%;
min-height: 1000%;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%) scale(0.1);
z-index: -1;
}
.videocontrols {
position: absolute;
top: .5rem;
right: .5rem;
flex-direction: column;
}
.videocontrols .button {
border-radius: 50%;
padding: .5rem;
}
.videocontrols .button:disabled {
display: none;
}
.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-imagesection>* {
flex: 50% 1 1;
}
}
.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;
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 {
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,
.form textarea {
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 textarea {
padding: .25rem;
font-family: var(--font-body);
width: 100%;
height: 4rem;
}
.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;
} .requests-phone,
.requests-website {
display: none;
} .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 {
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 {
display: block;
padding: .3rem;
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;
}
}