@charset "UTF-8";
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, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, input, select {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
body {
line-height: 1;
color: black;
background: white;
}
ol, ul {
list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
@font-face {
font-family: Archivo;
src: url(../fonts/ArchivoNarrow-Regular.ttf);
font-weight: normal;
}
@font-face {
font-family: Archivo;
src: url(../fonts/ArchivoNarrow-Italic.ttf);
font-style: italic;
}
@font-face {
font-family: Archivo;
src: url(../fonts/ArchivoNarrow-Medium.ttf);
font-weight: 500;
}
@font-face {
font-family: Archivo;
src: url(../fonts/ArchivoNarrow-MediumItalic.ttf);
font-weight: 500;
font-style: italic;
}
@font-face {
font-family: Archivo;
src: url(../fonts/ArchivoNarrow-Bold.ttf);
font-weight: bold;
}
@font-face {
font-family: Archivo;
src: url(../fonts/ArchivoNarrow-BoldItalic.ttf);
font-weight: bold;
font-style: italic;
}
/*******************************************/
/*
/* Mixins
*/
.shadow-inset {
box-shadow: inset 0px 1px 4px rgba(0, 0, 0, 0.25);
}
:root {
--c-copy: #272727;
--c-head: var(--c-copy);
--c-red: #9A0F0F;
--c-red-light: #603E3E;
--c-blau: #24285d;
--c-blue: var(--c-blau);
--c-rot: var(--c-red);
--c-corporate: var(--c-red);
--c-copy-light: #695F5C;
--c-grey: #ededed;
--c-grey-dark: #d0cdcd;
--c-grey-deep: #968e90;
--c-gray: var(--c-grey);
--c-weiss: #ffffff;
--c-subtil: #e6e2e1;
--c-subtle: #e6e2e1;
--fs-copy: clamp(16px,1.4vw,24px);
--fs-large: 1.25em;
--ff-copy: "Archivo",sans-serif;
--ff-head: "Archivo",sans-serif;
--ff-fixed: "Archivo",sans-serif;
--fw-medium: 500;
--max-width: calc(100% - 4rem);
--width-margin: 2rem;
--article-width: 768px;
--article-width-wide: 1512px;
--article-width-slim: 960px;
--m-vert: 40px;
--m-vert-slim: 20px;
--gap: 0.8333333333rem;
--m-vert-2x: calc(2 * var(--m-vert));
--gap-2x: calc(2 * var(--gap));
--gap-3x: calc(3 * var(--gap));
--gap-4x: calc(4 * var(--gap));
--gap-6x: calc(6 * var(--gap));
--radius: 0.8333333333rem;
--radius-small: 0.2083333333rem;
--shadow: 0px 4px 20px rgba(0, 0, 0, 0.15);
--shadow-flat: 0px 2px 10px rgba(0, 0, 0, 0.15);
}
@media (min-width: 970px) {
:root {
--max-width: 951px;
--width-margin: calc(50vw - var(--max-width) * 0.5);
}
}
@media (min-width: 970px) and (min-width: 1280px) {
:root {
--width-margin: calc(50% - var(--max-width) * 0.5);
}
}
@media (min-width: 1280px) {
:root {
--article-width: 960px;
}
}
@media (min-width: 1024px) {
:root {
--m-vert: 106px;
--m-vert-slim: 58px;
}
}
div.gap {
width: var(--gap);
}
div.gap2x {
width: var(--gap-2x);
}
div.m-vert {
width: var(--m-vert);
}
div.m-vert-slim {
width: var(--m-vert-slim);
}
div.width-margin {
width: var(--width-margin);
}
div.article-width {
width: var(--article-margin);
}
.ty b, footer b, .popin b,
.personpopin b,
.ty strong,
footer strong,
.popin strong,
.personpopin strong,
.typography b,
article b,
.content b,
.typography strong,
article strong,
.content strong {
font-weight: bold;
}
.ty i, footer i, .popin i,
.personpopin i,
.ty em,
footer em,
.popin em,
.personpopin em,
.typography i,
article i,
.content i,
.typography em,
article em,
.content em {
font-style: italic;
}
.ty blockquote, footer blockquote, .popin blockquote,
.personpopin blockquote,
.ty pre,
footer pre,
.popin pre,
.personpopin pre,
.typography blockquote,
article blockquote,
.content blockquote,
.typography pre,
article pre,
.content pre {
padding: 1rem 0;
}
.ty .wp-block-quote, footer .wp-block-quote, .popin .wp-block-quote,
.personpopin .wp-block-quote,
.ty blockquote,
footer blockquote,
.popin blockquote,
.personpopin blockquote,
.typography .wp-block-quote,
article .wp-block-quote,
.content .wp-block-quote,
.typography blockquote,
article blockquote,
.content blockquote {
padding: 0;
line-height: 1.4;
border-left: solid 2px var(--c-rot);
padding-left: var(--gap-2x);
}
.ty .wp-block-quote p:last-child, footer .wp-block-quote p:last-child, .popin .wp-block-quote p:last-child,
.personpopin .wp-block-quote p:last-child,
.ty blockquote p:last-child,
footer blockquote p:last-child,
.popin blockquote p:last-child,
.personpopin blockquote p:last-child,
.typography .wp-block-quote p:last-child,
article .wp-block-quote p:last-child,
.content .wp-block-quote p:last-child,
.typography blockquote p:last-child,
article blockquote p:last-child,
.content blockquote p:last-child {
margin-bottom: 0;
}
.ty pre, footer pre, .popin pre,
.personpopin pre,
.typography pre,
article pre,
.content pre {
font-family: var(--ff-fixed);
line-height: 1.5;
background: black;
color: white;
}
.ty dd, footer dd, .popin dd,
.personpopin dd,
.ty dt,
footer dt,
.popin dt,
.personpopin dt,
.ty ul,
footer ul,
.popin ul,
.personpopin ul,
.ty ol,
footer ol,
.popin ol,
.personpopin ol,
.ty p,
footer p,
.popin p,
.personpopin p,
.typography dd,
article dd,
.content dd,
.typography dt,
article dt,
.content dt,
.typography ul,
article ul,
.content ul,
.typography ol,
article ol,
.content ol,
.typography p,
article p,
.content p {
margin-bottom: 1em;
line-height: 1.7;
}
.ty .small, footer .small, .popin .small,
.personpopin .small,
.typography .small,
article .small,
.content .small {
font-size: 0.75em;
}
.ty .wp-block-jwk-intro, footer .wp-block-jwk-intro, .popin .wp-block-jwk-intro,
.personpopin .wp-block-jwk-intro,
.ty .abstract,
footer .abstract,
.popin .abstract,
.personpopin .abstract,
.typography .wp-block-jwk-intro,
article .wp-block-jwk-intro,
.content .wp-block-jwk-intro,
.typography .abstract,
article .abstract,
.content .abstract {
font-size: 1.2em;
}
.ty p:last-child, footer p:last-child, .popin p:last-child,
.personpopin p:last-child,
.typography p:last-child,
article p:last-child,
.content p:last-child {
margin-bottom: 0;
}
.ty ul:first-child, footer ul:first-child, .popin ul:first-child,
.personpopin ul:first-child,
.typography ul:first-child,
article ul:first-child,
.content ul:first-child {
margin-top: 0;
}
.ty ul:last-child, footer ul:last-child, .popin ul:last-child,
.personpopin ul:last-child,
.typography ul:last-child,
article ul:last-child,
.content ul:last-child {
margin-bottom: 0;
}
.ty ul li:not([class]), footer ul li:not([class]), .popin ul li:not([class]),
.personpopin ul li:not([class]),
.ty ul li.block-editor-block-list__block,
footer ul li.block-editor-block-list__block,
.popin ul li.block-editor-block-list__block,
.personpopin ul li.block-editor-block-list__block,
.typography ul li:not([class]),
article ul li:not([class]),
.content ul li:not([class]),
.typography ul li.block-editor-block-list__block,
article ul li.block-editor-block-list__block,
.content ul li.block-editor-block-list__block {
margin-top: 10px;
padding-left: 20px;
margin-left: 0;
background: url("../images/Bullet.svg") no-repeat 0 0.5em;
}
.ty ul li:not([class]):nth-child, footer ul li:not([class]):nth-child, .popin ul li:not([class]):nth-child,
.personpopin ul li:not([class]):nth-child,
.ty ul li.block-editor-block-list__block:nth-child,
footer ul li.block-editor-block-list__block:nth-child,
.popin ul li.block-editor-block-list__block:nth-child,
.personpopin ul li.block-editor-block-list__block:nth-child,
.typography ul li:not([class]):nth-child,
article ul li:not([class]):nth-child,
.content ul li:not([class]):nth-child,
.typography ul li.block-editor-block-list__block:nth-child,
article ul li.block-editor-block-list__block:nth-child,
.content ul li.block-editor-block-list__block:nth-child {
margin: 0;
}
.ty ul ul, footer ul ul, .popin ul ul,
.personpopin ul ul,
.typography ul ul,
article ul ul,
.content ul ul {
margin-left: 1em;
}
.ty ul li, footer ul li, .popin ul li,
.personpopin ul li,
.typography ul li,
article ul li,
.content ul li {
list-style-type: none;
}
.ty ol li, footer ol li, .popin ol li,
.personpopin ol li,
.typography ol li,
article ol li,
.content ol li {
list-style-type: decimal;
margin-left: 1em;
margin-bottom: 1em;
}
.ty ul, footer ul, .popin ul,
.personpopin ul,
.ty ol,
footer ol,
.popin ol,
.personpopin ol,
.typography ul,
article ul,
.content ul,
.typography ol,
article ol,
.content ol {
margin: 1em 0;
line-height: 1.4;
}
.ty caption, footer caption, .popin caption,
.personpopin caption,
.ty .h1,
footer .h1,
.popin .h1,
.personpopin .h1,
.ty h1,
footer h1,
.popin h1,
.personpopin h1,
.ty h2,
footer h2,
.popin h2,
.personpopin h2,
.ty h3,
footer h3,
.popin h3,
.personpopin h3,
.ty h4,
footer h4,
.popin h4,
.personpopin h4,
.ty h5,
footer h5,
.popin h5,
.personpopin h5,
.typography caption,
article caption,
.content caption,
.typography .h1,
article .h1,
.content .h1,
.typography h1,
article h1,
.content h1,
.typography h2,
article h2,
.content h2,
.typography h3,
article h3,
.content h3,
.typography h4,
article h4,
.content h4,
.typography h5,
article h5,
.content h5 {
margin-top: 1em;
margin-bottom: 1em;
line-height: 1.2;
font-family: var(--ff-head);
font-weight: normal;
}
.ty caption.has-background, footer caption.has-background, .popin caption.has-background,
.personpopin caption.has-background,
.ty .h1.has-background,
footer .h1.has-background,
.popin .h1.has-background,
.personpopin .h1.has-background,
.ty h1.has-background,
footer h1.has-background,
.popin h1.has-background,
.personpopin h1.has-background,
.ty h2.has-background,
footer h2.has-background,
.popin h2.has-background,
.personpopin h2.has-background,
.ty h3.has-background,
footer h3.has-background,
.popin h3.has-background,
.personpopin h3.has-background,
.ty h4.has-background,
footer h4.has-background,
.popin h4.has-background,
.personpopin h4.has-background,
.ty h5.has-background,
footer h5.has-background,
.popin h5.has-background,
.personpopin h5.has-background,
.typography caption.has-background,
article caption.has-background,
.content caption.has-background,
.typography .h1.has-background,
article .h1.has-background,
.content .h1.has-background,
.typography h1.has-background,
article h1.has-background,
.content h1.has-background,
.typography h2.has-background,
article h2.has-background,
.content h2.has-background,
.typography h3.has-background,
article h3.has-background,
.content h3.has-background,
.typography h4.has-background,
article h4.has-background,
.content h4.has-background,
.typography h5.has-background,
article h5.has-background,
.content h5.has-background {
margin-top: 0;
margin-bottom: 0;
padding-top: 1em;
padding-bottom: 1em;
}
.ty caption a, footer caption a, .popin caption a,
.personpopin caption a,
.ty .h1 a,
footer .h1 a,
.popin .h1 a,
.personpopin .h1 a,
.ty h1 a,
footer h1 a,
.popin h1 a,
.personpopin h1 a,
.ty h2 a,
footer h2 a,
.popin h2 a,
.personpopin h2 a,
.ty h3 a,
footer h3 a,
.popin h3 a,
.personpopin h3 a,
.ty h4 a,
footer h4 a,
.popin h4 a,
.personpopin h4 a,
.ty h5 a,
footer h5 a,
.popin h5 a,
.personpopin h5 a,
.typography caption a,
article caption a,
.content caption a,
.typography .h1 a,
article .h1 a,
.content .h1 a,
.typography h1 a,
article h1 a,
.content h1 a,
.typography h2 a,
article h2 a,
.content h2 a,
.typography h3 a,
article h3 a,
.content h3 a,
.typography h4 a,
article h4 a,
.content h4 a,
.typography h5 a,
article h5 a,
.content h5 a {
text-decoration: none;
color: var(--c-copy);
}
.ty caption a:hover, footer caption a:hover, .popin caption a:hover,
.personpopin caption a:hover,
.ty .h1 a:hover,
footer .h1 a:hover,
.popin .h1 a:hover,
.personpopin .h1 a:hover,
.ty h1 a:hover,
footer h1 a:hover,
.popin h1 a:hover,
.personpopin h1 a:hover,
.ty h2 a:hover,
footer h2 a:hover,
.popin h2 a:hover,
.personpopin h2 a:hover,
.ty h3 a:hover,
footer h3 a:hover,
.popin h3 a:hover,
.personpopin h3 a:hover,
.ty h4 a:hover,
footer h4 a:hover,
.popin h4 a:hover,
.personpopin h4 a:hover,
.ty h5 a:hover,
footer h5 a:hover,
.popin h5 a:hover,
.personpopin h5 a:hover,
.typography caption a:hover,
article caption a:hover,
.content caption a:hover,
.typography .h1 a:hover,
article .h1 a:hover,
.content .h1 a:hover,
.typography h1 a:hover,
article h1 a:hover,
.content h1 a:hover,
.typography h2 a:hover,
article h2 a:hover,
.content h2 a:hover,
.typography h3 a:hover,
article h3 a:hover,
.content h3 a:hover,
.typography h4 a:hover,
article h4 a:hover,
.content h4 a:hover,
.typography h5 a:hover,
article h5 a:hover,
.content h5 a:hover {
color: black;
}
.ty caption:first-child, footer caption:first-child, .popin caption:first-child,
.personpopin caption:first-child,
.ty .h1:first-child,
footer .h1:first-child,
.popin .h1:first-child,
.personpopin .h1:first-child,
.ty h1:first-child,
footer h1:first-child,
.popin h1:first-child,
.personpopin h1:first-child,
.ty h2:first-child,
footer h2:first-child,
.popin h2:first-child,
.personpopin h2:first-child,
.ty h3:first-child,
footer h3:first-child,
.popin h3:first-child,
.personpopin h3:first-child,
.ty h4:first-child,
footer h4:first-child,
.popin h4:first-child,
.personpopin h4:first-child,
.ty h5:first-child,
footer h5:first-child,
.popin h5:first-child,
.personpopin h5:first-child,
.typography caption:first-child,
article caption:first-child,
.content caption:first-child,
.typography .h1:first-child,
article .h1:first-child,
.content .h1:first-child,
.typography h1:first-child,
article h1:first-child,
.content h1:first-child,
.typography h2:first-child,
article h2:first-child,
.content h2:first-child,
.typography h3:first-child,
article h3:first-child,
.content h3:first-child,
.typography h4:first-child,
article h4:first-child,
.content h4:first-child,
.typography h5:first-child,
article h5:first-child,
.content h5:first-child {
margin-top: 0;
}
.ty caption.has-background, footer caption.has-background, .popin caption.has-background,
.personpopin caption.has-background,
.ty .h1.has-background,
footer .h1.has-background,
.popin .h1.has-background,
.personpopin .h1.has-background,
.ty h1.has-background,
footer h1.has-background,
.popin h1.has-background,
.personpopin h1.has-background,
.ty h2.has-background,
footer h2.has-background,
.popin h2.has-background,
.personpopin h2.has-background,
.ty h3.has-background,
footer h3.has-background,
.popin h3.has-background,
.personpopin h3.has-background,
.ty h4.has-background,
footer h4.has-background,
.popin h4.has-background,
.personpopin h4.has-background,
.ty h5.has-background,
footer h5.has-background,
.popin h5.has-background,
.personpopin h5.has-background,
.typography caption.has-background,
article caption.has-background,
.content caption.has-background,
.typography .h1.has-background,
article .h1.has-background,
.content .h1.has-background,
.typography h1.has-background,
article h1.has-background,
.content h1.has-background,
.typography h2.has-background,
article h2.has-background,
.content h2.has-background,
.typography h3.has-background,
article h3.has-background,
.content h3.has-background,
.typography h4.has-background,
article h4.has-background,
.content h4.has-background,
.typography h5.has-background,
article h5.has-background,
.content h5.has-background {
padding: 0.4em 1em;
}
.ty .h1, footer .h1, .popin .h1,
.personpopin .h1, .ty h1, footer h1, .popin h1,
.personpopin h1,
.typography .h1,
article .h1,
.content .h1,
.typography h1,
article h1,
.content h1 {
font-size: 1.6666666667em;
text-transform: uppercase;
}
@media (min-width: 768px) {
.ty .h1, footer .h1, .popin .h1,
.personpopin .h1, .ty h1, footer h1, .popin h1,
.personpopin h1,
.typography .h1,
article .h1,
.content .h1,
.typography h1,
article h1,
.content h1 {
font-size: 2.25em;
}
}
.ty .h2, footer .h2, .popin .h2,
.personpopin .h2,
.ty h2,
footer h2,
.popin h2,
.personpopin h2,
.typography .h2,
article .h2,
.content .h2,
.typography h2,
article h2,
.content h2 {
font-size: 1.9583333333em;
}
.ty caption, footer caption, .popin caption,
.personpopin caption,
.ty .h3,
footer .h3,
.popin .h3,
.personpopin .h3,
.ty h3,
footer h3,
.popin h3,
.personpopin h3,
.typography caption,
article caption,
.content caption,
.typography .h3,
article .h3,
.content .h3,
.typography h3,
article h3,
.content h3 {
font-size: 1.4583333333em;
color: var(--c-rot);
}
.ty h4, footer h4, .popin h4,
.personpopin h4,
.ty h5,
footer h5,
.popin h5,
.personpopin h5,
.typography h4,
article h4,
.content h4,
.typography h5,
article h5,
.content h5 {
font-size: 1.1666666667em;
}
.ty h1 + *, footer h1 + *, .popin h1 + *,
.personpopin h1 + *,
.ty h2 + *,
footer h2 + *,
.popin h2 + *,
.personpopin h2 + *,
.ty h3 + *,
footer h3 + *,
.popin h3 + *,
.personpopin h3 + *,
.ty .coltop + h1,
footer .coltop + h1,
.popin .coltop + h1,
.personpopin .coltop + h1,
.ty .coltop + h2,
footer .coltop + h2,
.popin .coltop + h2,
.personpopin .coltop + h2,
.ty .coltop + h3,
footer .coltop + h3,
.popin .coltop + h3,
.personpopin .coltop + h3,
.ty .coltop + h4,
footer .coltop + h4,
.popin .coltop + h4,
.personpopin .coltop + h4,
.ty .coltop + h5,
footer .coltop + h5,
.popin .coltop + h5,
.personpopin .coltop + h5,
.ty a[name=copytop] + h1,
footer a[name=copytop] + h1,
.popin a[name=copytop] + h1,
.personpopin a[name=copytop] + h1,
.ty a[name=copytop] + h2,
footer a[name=copytop] + h2,
.popin a[name=copytop] + h2,
.personpopin a[name=copytop] + h2,
.ty a[name=copytop] + h3,
footer a[name=copytop] + h3,
.popin a[name=copytop] + h3,
.personpopin a[name=copytop] + h3,
.ty a[name=copytop] + h4,
footer a[name=copytop] + h4,
.popin a[name=copytop] + h4,
.personpopin a[name=copytop] + h4,
.ty a[name=copytop] + h5,
footer a[name=copytop] + h5,
.popin a[name=copytop] + h5,
.personpopin a[name=copytop] + h5,
.typography h1 + *,
article h1 + *,
.content h1 + *,
.typography h2 + *,
article h2 + *,
.content h2 + *,
.typography h3 + *,
article h3 + *,
.content h3 + *,
.typography .coltop + h1,
article .coltop + h1,
.content .coltop + h1,
.typography .coltop + h2,
article .coltop + h2,
.content .coltop + h2,
.typography .coltop + h3,
article .coltop + h3,
.content .coltop + h3,
.typography .coltop + h4,
article .coltop + h4,
.content .coltop + h4,
.typography .coltop + h5,
article .coltop + h5,
.content .coltop + h5,
.typography a[name=copytop] + h1,
article a[name=copytop] + h1,
.content a[name=copytop] + h1,
.typography a[name=copytop] + h2,
article a[name=copytop] + h2,
.content a[name=copytop] + h2,
.typography a[name=copytop] + h3,
article a[name=copytop] + h3,
.content a[name=copytop] + h3,
.typography a[name=copytop] + h4,
article a[name=copytop] + h4,
.content a[name=copytop] + h4,
.typography a[name=copytop] + h5,
article a[name=copytop] + h5,
.content a[name=copytop] + h5 {
margin-top: 0;
}
.ty .wp-caption p, footer .wp-caption p, .popin .wp-caption p,
.personpopin .wp-caption p,
.typography .wp-caption p,
article .wp-caption p,
.content .wp-caption p {
font-size: 0.8em;
margin: 0.5em 0 1em 0;
}
.ty a, footer a, .popin a,
.personpopin a,
.typography a,
article a,
.content a {
color: var(--c-corporate);
}
.ty a:hover, footer a:hover, .popin a:hover,
.personpopin a:hover,
.typography a:hover,
article a:hover,
.content a:hover {
color: var(--c-head);
}
.ty a:hover:active, footer a:hover:active, .popin a:hover:active,
.personpopin a:hover:active,
.typography a:hover:active,
article a:hover:active,
.content a:hover:active {
color: var(--c-corporate);
}
html {
zoom: 100%;
box-sizing: border-box;
}
html * {
box-sizing: border-box;
}
*,
*:before,
*:after {
box-sizing: inherit;
}
body {
background: #e1e1e1;
font-family: var(--ff-copy);
font-size: var(--fs-copy);
-webkit-font-smoothing: antialiased;
color: var(--c-copy);
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 100vh;
align-items: stretch;
}
body.scroll-lock {
overflow: hidden;
}
.wrap {
overflow: hidden;
width: var(--max-width);
margin: 0 auto;
position: relative;
}
#wrapall {
margin: 0 auto;
width: 100%;
max-width: 1280px;
background: #ededed;
box-shadow: 0 0 24px rgba(0, 0, 0, 0.1), 0 0 10px rgba(0, 0, 0, 0.1);
}
header#header {
padding: var(--gap) 0 var(--gap) var(--gap-2x);
display: flex;
background: var(--c-grey);
font-size: 19px;
}
header#header.fixed {
position: fixed;
left: 0;
top: 0;
width: 100%;
z-index: 3086;
transform: translateY(-100%);
transition: transform 0.3s ease-in-out;
}
header#header.fixed.show {
transform: translateY(0);
}
header#header a {
text-decoration: none;
color: var(--ff-copy);
}
@media (max-width: 1023px) {
header#header .logo {
width: 160px;
}
}
header#header .nav {
flex-grow: 1;
display: flex;
flex-direction: column-reverse;
align-items: stretch;
padding-right: var(--gap-2x);
position: relative;
z-index: 1989;
}
header#header .nav nav.main {
border-top: solid 3px var(--c-blau);
padding-top: 10px;
padding-bottom: 5vw;
}
@media (min-width: 1024px) {
header#header .nav nav.main {
border-top: solid 5px var(--c-blau);
padding-bottom: 3px;
}
}
header#header .nav nav > ul {
display: flex;
justify-content: flex-end;
}
@media (max-width: 1023px) {
header#header .nav nav > ul {
display: none;
}
}
header#header .nav nav > ul li {
position: relative;
}
header#header .nav nav > ul > li:not(:last-child) {
margin-right: var(--gap-2x);
}
header#header .nav nav > ul > li > a {
text-transform: uppercase;
font-weight: bold;
}
header#header .nav nav > ul > li ul.sub-menu {
position: relative;
z-index: 2;
padding: var(--gap-2x) var(--gap-2x) 0;
background-color: var(--c-grey);
display: none;
position: absolute;
top: 1em;
left: 0;
white-space: nowrap;
}
header#header .nav nav > ul > li ul.sub-menu li:last-child {
padding-bottom: var(--gap-2x);
}
header#header .nav nav > ul > li ul.sub-menu li:not(:first-child) {
padding-top: 0.5em;
margin-top: 0.5em;
border-top: solid 1px var(--c-copy);
}
header#header .nav nav > ul li:hover > a {
color: var(--c-corporate);
}
header#header .nav nav > ul li:hover > ul.sub-menu {
display: block;
}
header#header .nav > div {
display: flex;
justify-content: flex-end;
align-items: center;
padding-bottom: 10px;
}
header#header .nav > div .search {
margin: 0 var(--gap-4x) 0 var(--gap-2x);
}
@media (max-width: 1023px) {
header#header .nav > div .search {
display: none;
}
}
header#header .nav > div .search form {
border-radius: 0.5em;
background: rgba(0, 0, 0, 0.2);
display: flex;
align-items: center;
padding: 0 0.5em;
}
header#header .nav > div .search form input[type=search] {
background-color: transparent;
height: 2em;
}
header#header .nav > div .search form button {
border: none;
background: transparent;
padding: 0;
padding-top: 0.1em;
}
header#header #mobile_menu {
display: flex;
position: fixed;
background-color: var(--c-subtle);
z-index: 4086;
left: 0;
top: 0;
width: 100%;
height: 100vh;
overflow: auto;
padding: var(--gap-3x);
flex-direction: column;
justify-content: space-between;
align-items: center;
font-size: 1.1em;
transform: translateY(-100%);
transition: transform 800ms;
}
header#header #mobile_menu a {
color: var(--c-copy);
}
header#header #mobile_menu a:hover {
color: var(--c-corporate);
}
@media (min-width: 1024px) {
header#header #mobile_menu {
font-size: 1.2em;
}
}
header#header #mobile_menu.open {
transition: transform 400ms;
transform: translateY(0);
}
header#header #mobile_menu > div {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
width: 100%;
}
header#header #mobile_menu > div.mobilemain {
display: flex;
justify-content: center;
align-items: center;
align-self: center;
flex-grow: 1;
}
header#header #mobile_menu > div.mobilemain img {
margin-bottom: var(--gap-4x);
}
@media (max-width: 767px) {
header#header #mobile_menu > div.mobilemain img {
width: 186px;
margin-top: var(--gap-4x);
}
}
header#header #mobile_menu > div.mobilemain > ul {
display: grid;
gap: var(--gap);
}
@media (min-width: 768px) {
header#header #mobile_menu > div.mobilemain > ul {
gap: var(--gap-3x);
grid-template-columns: 1fr 1fr 1fr;
}
}
@media (min-width: 1024px) {
header#header #mobile_menu > div.mobilemain > ul {
grid-template-columns: 1fr 1fr 1fr;
}
}
header#header #mobile_menu > div.mobilemain > ul > li > a {
font-weight: bold;
text-transform: uppercase;
}
header#header #mobile_menu > div.mobilemain > ul ul.sub-menu {
margin-top: 0.5em;
}
header#header #mobile_menu > div.mobilemain > ul ul.sub-menu > li {
line-height: 1.2;
}
header#header #mobile_menu > div.mobilemain > ul ul.sub-menu > li > a {
display: block;
padding: 0.5em 0;
}
@media (min-width: 1024px) {
header#header #mobile_menu > div.mobilemain > ul ul.sub-menu > li > a {
font-size: 0.86em;
}
}
header#header #mobile_menu > div.mobilemain > ul ul.sub-menu > li:not(:first-child) {
border-top: solid 1px var(--c-grey-deep);
}
header#header #mobile_menu > div.footer {
width: 100%;
}
@media (min-width: 1024px) {
header#header #mobile_menu > div.footer {
font-size: 0.86em;
}
}
header#header #mobile_menu > div.footer ul {
width: 100%;
display: flex;
justify-content: center;
}
header#header #mobile_menu > div.footer ul li {
margin: 0 0.5em;
}
header#header #mobile_menu > div > div > ul > li, header#header #mobile_menu > div > ul > li {
margin: 0.5em 0;
}
header#header #mobile_menu > div > div > ul > li.kontakt, header#header #mobile_menu > div > div > ul > li.contact, header#header #mobile_menu > div > ul > li.kontakt, header#header #mobile_menu > div > ul > li.contact {
font-weight: bold;
}
header#header #mobile_menu > div .footer {
font-size: 0.86em;
}
header#header .trigger {
position: relative;
display: block;
cursor: pointer;
z-index: 2186;
height: 24px;
margin-bottom: 3px;
width: 34px;
}
@media (min-width: 1024px) {
header#header .trigger {
margin-top: 0;
height: 26px;
}
}
header#header .trigger > span {
display: block;
width: 100%;
height: 4px;
border-radius: 2px;
background-color: black !important;
position: absolute;
left: 0;
transition: background-color 400ms;
}
header#header .trigger > span.ff1 {
top: 0;
}
header#header .trigger > span.ff2 {
top: 50%;
transform: translateY(-2px);
}
header#header .trigger > span.ff3 {
bottom: 0;
}
header#header .trigger.menu {
position: fixed;
z-index: 4086;
right: var(--gap);
top: var(--gap);
}
header#header .trigger.open > span.ff1 {
background-color: white;
top: 50%;
transform: translateY(-50%) rotate(45deg);
}
header#header .trigger.open > span.ff2 {
background-color: white;
opacity: 0;
}
header#header .trigger.open > span.ff3 {
background-color: white;
top: 50%;
transform: translateY(-50%) rotate(-45deg);
}
.donation-trigger {
z-index: 3586;
position: fixed;
cursor: pointer;
width: 3.2em;
right: var(--gap);
bottom: var(--gap);
}
@media (min-width: 1540px) {
.donation-trigger {
bottom: auto;
top: 50%;
transform: translateY(-50%);
width: auto;
}
}
.donation-trigger span {
position: absolute;
top: 50%;
left: -0.5em;
transform: translate(-100%, -50%);
background: #695F5C;
padding: 0.3em 0.8em;
color: white;
border-radius: 2em;
display: none;
}
.donation-trigger:hover span {
display: block;
}
.content > h1:first-child, .content > h2:first-child {
margin-top: var(--m-vert-slim) !important;
}
.content ._brlbs-switch-consent, .content > .wp-block-column:not(.wide), .content > .wp-block-jwk-personcta, .content > .wrapThis, .content > div.wp-block-group, .content > .wp-block-buttons, .content > .wp-block-columns, .content > .wp-block-jwk-accordion, .content > div.wp-block-jwk-intro, .content > ul, .content > ol, .content > blockquote, .content > form, .content > p, .content > dd, .content > h1, .content > h2, .content > h3, .content > h4, .content > h5, .content > h6, .content > figure {
max-width: var(--article-width);
margin-left: var(--width-margin);
margin-right: var(--width-margin);
}
.content > h1.has-background, .content > h2.has-background, .content > h3.has-background, .content > h4.has-background {
max-width: none;
padding-left: var(--width-margin);
padding-right: var(--width-margin);
margin-left: 0;
margin-right: 0;
}
.content > p, .content > ul, .content > ol, .content > blockquote {
color: var(--c-copy-light);
}
.content > ul {
margin-top: 2em;
margin-bottom: 2em;
}
.content h2 + ul {
margin-top: 1em;
}
.content > .wp-block-group {
margin-left: auto;
margin-right: auto;
}
.content > .wp-block-group:not(:last-child) {
margin-bottom: 1em;
}
.content li {
background: none;
padding-left: 0;
}
.content .wp-block-columns:not(:first-child) {
margin-top: 3rem;
}
.content .wp-block-columns:not(:last-child) {
margin-bottom: 3rem;
}
.content .wp-block-group__inner-container .wp-block-columns {
margin-top: 0rem;
margin-bottom: 0rem;
}
.content .wp-block-df-block-df-abstract {
margin-bottom: 3rem;
}
.content div:not(.wp-element-button).has-background {
padding: var(--gap-2x);
}
.content .has-df-copy-light-background-color,
.content .has-df-red-background-color {
color: white;
}
.content .has-df-copy-light-background-color.wp-element-button:hover,
.content .has-df-red-background-color.wp-element-button:hover {
background-color: white !important;
color: var(--c-rot);
}
.content .has-df-copy-light-background-color li:not([class]),
.content .has-df-copy-light-background-color li.block-editor-block-list__block,
.content .has-df-red-background-color li:not([class]),
.content .has-df-red-background-color li.block-editor-block-list__block {
background: url("../images/Bullet-w.svg") no-repeat 0 0.5em;
}
.content div.has-background.wp-block-group {
padding: var(--gap-2x);
}
.content a.wp-element-button.wp-block-button__link {
border: solid 1px white;
}
.content .wp-block-column:has(h4.has-background) h4 {
margin-bottom: 1em;
}
.content .wp-block-column:has(h4.has-background) p,
.content .wp-block-column:has(h4.has-background) ul,
.content .wp-block-column:has(h4.has-background) h4 {
padding-left: 1rem;
}
.wp-block-jwk-hero {
position: relative;
padding-bottom: var(--m-vert-slim);
margin-bottom: var(--m-vert-slim);
}
.wp-block-jwk-hero img {
width: 100%;
}
.wp-block-jwk-hero .bild {
position: relative;
width: 100%;
padding-bottom: 56%;
}
@media (min-width: 1280px) and (max-height: 900px) {
.wp-block-jwk-hero .bild {
padding-bottom: 40%;
}
}
.wp-block-jwk-hero .bild video,
.wp-block-jwk-hero .bild img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.wp-block-jwk-hero .bild > div {
position: absolute;
top: 0;
left: 0;
width: 100%;
padding: 0 var(--gap-2x);
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: 1.6em;
text-transform: uppercase;
color: white;
}
@media (min-width: 768px) {
.wp-block-jwk-hero .bild > div {
padding-bottom: calc(2 * var(--m-vert-slim));
}
}
@media (min-width: 1024px) {
.wp-block-jwk-hero .bild > div {
font-size: 5em;
}
}
@media (min-width: 1280px) and (max-height: 900px) {
.wp-block-jwk-hero .bild > div {
font-size: 4em;
}
}
.wp-block-jwk-hero .bild > div p {
text-align: center;
margin: 0;
line-height: 1;
}
@media (min-width: 768px) {
.wp-block-jwk-hero .text {
position: absolute;
left: 0;
bottom: 0;
max-width: 50%;
}
}
.wp-block-jwk-hero .text > div:last-child {
position: relative;
z-index: 2;
color: white !important;
padding: var(--gap) var(--gap-2x);
}
@media (min-width: 768px) {
.wp-block-jwk-hero .text > div:last-child {
padding: var(--gap-3x);
}
}
.wp-block-jwk-hero .text > div:last-child h1,
.wp-block-jwk-hero .text > div:last-child h2 {
margin: 0;
text-transform: uppercase;
}
.wp-block-jwk-hero .text > div:last-child h2 {
font-size: var(--fs-large);
}
.wp-block-jwk-hero .text .wp-block-buttons {
margin-top: var(--gap);
}
.wp-block-jwk-hero .text .wp-block-buttons .wp-element-button {
padding-top: 0.5em;
padding-bottom: 0.5em;
}
@keyframes quote {
0% {
transform: scale(1, -1);
}
100% {
transform: scale(1, 1);
}
}
.wp-block-jwk-quote {
padding-left: var(--width-margin);
margin-top: var(--m-vert-slim);
margin-bottom: var(--m-vert-slim);
display: flex;
justify-content: flex-end;
}
.wp-block-jwk-quote > div {
font-size: var(--fs-large);
border: solid 1px var(--c-corporate);
border-width: 2px 0 0 2px;
padding: var(--gap) var(--gap-2x) 0 var(--gap-2x);
}
.wp-block-jwk-quote > div blockquote {
border: none;
padding: 0;
font-family: var(--ff-copy);
transform: scale(1, -1);
max-width: 800px;
color: var(--c-rot);
}
.wp-block-jwk-quote > div span {
margin-left: var(--gap-2x);
display: block;
width: 3em;
border-top: solid 1px var(--c-copy);
border-left: solid 1px var(--c-copy);
display: none;
}
.wp-block-jwk-quote > div.admin blockquote {
transform: none;
}
.wp-block-jwk-quote.in-viewport > div blockquote {
animation: quote 800ms ease-in-out forwards;
animation-delay: 1s;
}
.wp-block-jwk-angebote {
grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 768px) {
.wp-block-jwk-angebote {
grid-template-columns: repeat(4, 1fr) !important;
}
}
.wp-block-jwk-angebote.largeText {
font-size: var(--fs-large);
text-transform: uppercase;
font-weight: bold;
}
.wp-block-jwk-angebote:not(:has(.block-editor-inner-blocks)) {
display: none;
grid-template-columns: repeat(2, 1fr);
}
.wp-block-jwk-angebote:not(:has(.block-editor-inner-blocks)).show {
display: grid;
}
.wp-block-jwk-angebote .block-editor-block-list__layout {
display: none;
display: grid !important;
}
.wp-block-columns:has(.wp-block-jwk-angebote) {
margin-left: 0;
margin-right: 0;
width: 100%;
max-width: none;
}
.wp-block-columns .wp-block-jwk-angebote,
.wp-block-columns .wp-block-jwk-angebote .block-editor-block-list__layout {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important;
}
@media (min-width: 1024px) {
.content > .wp-block-jwk-angebote {
display: grid !important;
grid-template-columns: repeat(4, 1fr);
}
}
div.offer,
a.offer {
position: relative;
display: block;
width: 100%;
padding-bottom: 100%;
}
div.offer > div,
a.offer > div {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
}
div.offer > div > div,
a.offer > div > div {
background-color: var(--c-copy);
background-size: cover;
width: calc(100% - var(--gap-2x));
height: calc(100% - var(--gap-2x));
padding: var(--gap);
border-radius: 50%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
}
@media (min-width: 1024px) {
div.offer > div > div,
a.offer > div > div {
width: calc(100% - var(--gap-4x));
height: calc(100% - var(--gap-4x));
}
}
div.offer > div > div p,
a.offer > div > div p {
color: white;
margin: 0;
line-height: 1;
}
div.offer:hover,
a.offer:hover {
cursor: pointer;
}
div.offer:hover > div > div,
a.offer:hover > div > div {
transform: scale(1.05);
}
.wp-block-jwk-persons {
background: var(--c-grey-dark);
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
padding: var(--m-vert-slim) var(--m-vert);
}
.wp-block-jwk-persons:not(:has(img)) {
align-items: flex-end;
}
.wp-block-jwk-persons.count1 {
padding: var(--gap-2x);
}
.wp-block-jwk-persons.count1 > div {
padding: 0;
display: flex;
align-items: center;
width: auto !important;
text-align: left;
}
.wp-block-jwk-persons.count1 > div .person__image {
flex-shrink: 0;
margin-bottom: 0;
margin-right: var(--gap);
}
@media (min-width: 768px) {
.wp-block-jwk-persons.count1 > div .person__image {
margin-right: var(--gap-2x);
}
}
.wp-block-jwk-persons.count1 > div .person__image img, .wp-block-jwk-persons.count1 > div .person__image svg {
width: 86px;
}
@media (min-width: 768px) {
.wp-block-jwk-persons.count1 > div .person__image img, .wp-block-jwk-persons.count1 > div .person__image svg {
width: 100%;
}
}
.wp-block-jwk-persons.count1 > div h2 {
margin: 0;
}
.wp-block-jwk-persons > div {
padding: var(--gap-2x) 0;
width: 100%;
text-align: center;
}
@media (min-width: 768px) {
.wp-block-jwk-persons > div {
width: 50%;
}
}
@media (min-width: 1024px) {
.wp-block-jwk-persons > div {
width: 33%;
}
}
.wp-block-jwk-persons > div p {
line-height: 1.4;
margin: 0;
}
.wp-block-jwk-persons > div .person__image {
margin-bottom: var(--gap);
padding: 0 var(--gap);
}
@media (min-width: 1024px) {
.wp-block-jwk-persons > div .person__image {
padding: 0;
}
}
.wp-block-jwk-persons > div .person__image > div {
margin: 0 auto;
width: 100%;
padding-bottom: 100%;
position: relative;
overflow: hidden;
border-radius: 50%;
}
@media (min-width: 1024px) {
.wp-block-jwk-persons > div .person__image > div {
width: 150px;
padding-bottom: 150px;
}
}
.wp-block-jwk-persons > div .person__image > div img, .wp-block-jwk-persons > div .person__image > div svg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.wp-block-jwk-persons > div .position {
height: 2.4em;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.86em;
}
.wp-block-jwk-persons > div .person__content:not(.nopics) .position {
height: auto;
}
.wp-block-jwk-persons > div .person__content:not(.nopics) .position.bottom {
display: none;
}
.wp-block-jwk-persons > div .person__content.nopics h3 {
margin-bottom: 0;
}
.wp-block-jwk-persons > div .person__content.nopics .position {
height: auto !important;
margin-bottom: 0.3em;
}
.wp-block-jwk-persons > div .person__content.nopics .position.top {
display: none;
}
.wp-block-jwk-persons > div h3 {
font-size: 1.4em;
color: var(--c-copy);
margin-bottom: 0.3em;
margin-top: 0.3em;
}
.wp-block-jwk-persons > div.nopics {
margin: 0;
}
.wp-block-jwk-persons > div a {
color: var(--c-copy);
text-decoration: none;
}
.wp-block-jwk-persons > div a:hover {
color: var(--c-corporate);
}
@keyframes personpopin {
0% {
opacity: 0;
transform: translate(-50%, -50%) scale(0.5);
}
10% {
opacity: 1;
}
95% {
transform: translate(-50%, -50%) scale(1.05);
}
98% {
transform: translate(-50%, -50%) scale(0.98);
}
100% {
opacity: 1;
transform: translate(-50%, -50%) scale(1);
}
}
@keyframes popinmobile {
0% {
opacity: 0;
transform: translateY(-50%) scale(0.5);
}
10% {
opacity: 1;
}
95% {
transform: translateY(-50%) scale(1.05);
}
98% {
transform: translateY(-50%) scale(0.98);
}
100% {
opacity: 1;
transform: translateY(-50%) scale(1);
}
}
.popin,
.personpopin {
box-shadow: var(--shadow);
position: fixed;
z-index: 2086;
padding: var(--gap-2x);
background: var(--c-subtle);
border-radius: 1em;
}
@media (max-width: 1023px) {
.popin,
.personpopin {
left: var(--gap);
right: var(--gap);
top: 50000px;
transform: translate(0, -50%);
}
}
@media (min-width: 1024px) {
.popin,
.personpopin {
left: 50%;
top: 50000px;
transform: translate(-50%, -50%);
width: 680px;
}
}
@media (min-width: 1024px) {
.popin,
.personpopin {
padding: var(--gap-4x);
}
}
.popin > p:first-child,
.personpopin > p:first-child {
font-size: 1.4em;
font-weight: bold;
}
@media (max-width: 1023px) {
.popin > p:first-child,
.personpopin > p:first-child {
display: none;
}
}
.popin .person,
.personpopin .person {
display: flex;
}
@media (max-width: 1023px) {
.popin .person,
.personpopin .person {
flex-direction: column;
align-items: center;
text-align: center;
}
}
.popin .person + p,
.personpopin .person + p {
margin-top: var(--gap-2x);
}
@media (max-width: 1023px) {
.popin .person + p,
.personpopin .person + p {
display: none;
}
}
.popin .person__image,
.personpopin .person__image {
margin-bottom: var(--gap);
}
.popin .person__image img,
.personpopin .person__image img {
max-width: 150px;
border-radius: 75px;
overflow: hidden;
}
@media (min-width: 1024px) {
.popin .person__image,
.personpopin .person__image {
margin-bottom: 0;
margin-right: var(--gap-2x);
}
}
.popin .person__content h3,
.personpopin .person__content h3 {
margin: 0;
}
.popin .person__content p,
.personpopin .person__content p {
line-height: 1.4;
margin: 0;
}
.popin .person__content p.position,
.personpopin .person__content p.position {
opacity: 0.5;
margin-bottom: 1em;
}
.popin .person__content a,
.personpopin .person__content a {
color: var(--c-copy);
text-decoration: none;
}
.popin .person__content a:hover,
.personpopin .person__content a:hover {
color: var(--c-corporate);
}
.popin .close,
.personpopin .close {
position: absolute;
right: var(--gap-2x);
top: var(--gap-2x);
color: var(--c-corporate);
cursor: pointer;
}
.popin.open,
.personpopin.open {
animation: popinmobile 0.3s ease-in-out;
top: 50%;
}
@media (min-width: 1024px) {
.popin.open,
.personpopin.open {
top: 50%;
animation: personpopin 0.3s ease-in-out;
}
}
.popin.close,
.personpopin.close {
top: 50%;
opacity: 0;
transform: translateY(-50%) scale(0.86);
transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}
@media (min-width: 1024px) {
.popin.close,
.personpopin.close {
transform: translate(-50%, -50%) scale(0.86);
}
}
.popin.show,
.personpopin.show {
top: 50%;
}
.person-trigger.side {
z-index: 2089;
cursor: pointer;
position: fixed;
left: 0;
bottom: var(--gap);
display: flex;
justify-content: flex-end;
align-items: center;
background: var(--c-corporate);
color: white;
border-radius: 0 124px 124px 0;
line-height: 0;
}
@media (min-width: 1024px) {
.person-trigger.side {
bottom: auto;
top: 50%;
transform: translateY(-50%);
}
}
@media (min-width: 1024px) {
.person-trigger.side {
font-size: 1.4em;
padding: var(--gap) var(--gap) var(--gap) var(--gap);
}
}
.person-trigger.side span:first-child {
display: none;
margin-right: var(--gap);
}
@media (min-width: 1024px) {
.person-trigger.side:hover {
padding-left: var(--gap-2x);
}
.person-trigger.side:hover span:first-child {
display: block;
}
}
body.has-personcta .person-trigger.side,
body.has-wp-block-jwk-personcta .person-trigger.side,
body:has(.wp-block-jwk-personcta) .person-trigger.side {
display: none;
}
.wp-block-jwk-intro {
margin-bottom: var(--m-vert-slim);
}
.wp-block-jwk-gruppe {
display: flex;
margin: 0 auto var(--gap);
}
@media (max-width: 1023px) {
.wp-block-jwk-gruppe {
flex-direction: column;
}
}
@media (min-width: 1024px) {
.wp-block-jwk-gruppe {
align-items: stretch;
max-width: var(--article-width-wide);
}
}
.wp-block-jwk-gruppe.reverse {
flex-direction: column;
}
@media (min-width: 1024px) {
.wp-block-jwk-gruppe.reverse {
flex-direction: row-reverse;
}
}
.wp-block-jwk-gruppe .image {
width: 100%;
flex-shrink: 0;
position: relative;
}
.wp-block-jwk-gruppe .image img {
width: 100%;
}
@media (min-width: 1024px) {
.wp-block-jwk-gruppe .image {
max-width: 540px;
}
.wp-block-jwk-gruppe .image img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
}
.wp-block-jwk-gruppe .image > div {
width: 100%;
height: 100%;
position: relative;
z-index: 1;
}
.wp-block-jwk-gruppe .image h3 {
z-index: 2;
position: absolute;
left: 0;
width: 100%;
text-align: center;
color: white;
margin: 0;
font-size: 2em;
}
.wp-block-jwk-gruppe .image h3:not(.top) {
top: 50%;
transform: translateY(-50%);
}
.wp-block-jwk-gruppe .image h3.top {
top: 1em;
}
.wp-block-jwk-gruppe .image h3.black {
color: var(--c-copy);
}
.wp-block-jwk-gruppe .table {
flex-grow: 1;
padding: var(--gap-2x);
background: var(--c-subtil);
display: grid;
}
@media (min-width: 768px) {
.wp-block-jwk-gruppe .table {
grid-template-columns: 1fr 1fr;
}
}
.wp-block-jwk-gruppe .table > div {
padding: 0.5em;
}
.wp-block-jwk-gruppe .table > div.label {
font-weight: bold;
padding: 1em 0 0 0;
}
@media (min-width: 768px) {
.wp-block-jwk-gruppe .table > div.label {
border-bottom: solid 1px var(--c-copy);
}
}
@media (min-width: 768px) {
.wp-block-jwk-gruppe .table > div.label {
padding: 0.5em 0;
}
}
.wp-block-jwk-gruppe .table > div.value {
padding: 0 0 0.5em 0;
}
.wp-block-jwk-gruppe .table > div.value:not(:last-child) {
border-bottom: solid 1px var(--c-copy);
}
@media (min-width: 768px) {
.wp-block-jwk-gruppe .table > div.value {
padding: 0.5em 0;
}
}
@media (max-width: 767px) {
.wp-block-jwk-gruppe .table > div.value p:first-child:not(:only-child) {
margin-top: 1em;
}
}
.wp-block-jwk-gruppe .table > div.value p:not(:only-child) {
margin-bottom: 0.5em;
}
.wp-block-jwk-gruppe .table > div.value p:last-child {
margin-bottom: 0;
}
.wp-block-jwk-gruppe .table > div.value .button {
width: 100%;
}
@media (max-width: 768px) {
.wp-block-jwk-gruppe .table > div.value .button {
margin-top: 1em;
}
}
:not(.wp-block-jwk-galerie):not(.wp-block-jwk-gruppe) + .wp-block-jwk-gruppe {
margin-top: var(--m-vert);
}
.wp-block-jwk-galerie + .wp-block-jwk-gruppe {
margin-top: var(--gap);
}
.wp-block-jwk-gruppe + :not(.wp-block-jwk-gruppe):not(.wp-block-jwk-galerie) {
margin-bottom: var(--m-vert);
}
.wp-block-jwk-galerie .swiper-slide div {
width: 100%;
padding-bottom: 56%;
position: relative;
border-radius: var(--radius);
overflow: hidden;
}
.wp-block-jwk-tile {
background: var(--c-copy);
color: white !important;
position: relative;
width: 100%;
padding-bottom: 100%;
}
.wp-block-jwk-tile p {
color: white !important;
}
.wp-block-jwk-tile .inner {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.wp-block-jwk-tile .inner > div {
position: relative;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: var(--gap-2x);
text-transform: uppercase;
text-align: center;
font-size: var(--fs-large);
}
.wp-block-jwk-news {
margin: var(--gap);
padding: var(--gap-4x) var(--gap-2x);
background: var(--c-subtil);
}
.wp-block-jwk-news h2 {
padding-left: var(--gap-2x);
margin: 0;
font-weight: bold;
text-transform: uppercase;
margin: 0 0 0.5em;
}
.wp-block-jwk-news a, .wp-block-jwk-news span {
text-decoration: none;
color: var(--c-copy);
}
.wp-block-jwk-news a > div, .wp-block-jwk-news span > div {
display: flex;
flex-direction: column;
justify-content: space-between;
padding: var(--gap);
background-color: rgba(0, 0, 0, 0.1);
margin-bottom: var(--gap-2x);
min-height: 246px;
}
.wp-block-jwk-news a:hover > div, .wp-block-jwk-news span:hover > div {
background-color: rgba(0, 0, 0, 0.2);
}
.wp-block-jwk-news .swiper-container {
overflow: hidden;
}
.wp-block-jwk-news .swiper-container .swiper-slide date {
color: var(--c-grey-deep);
font-size: 0.8333333333em;
padding: var(--gap) 0 0 var(--gap);
}
.wp-block-jwk-news .swiper-container .swiper-slide div.top {
display: flex;
align-items: flex-start;
justify-content: space-between;
}
.wp-block-jwk-news .swiper-container .swiper-slide div.top .image {
position: relative;
width: 124px;
height: 124px;
}
.wp-block-jwk-news .swiper-container .swiper-slide div.top .image img {
border-radius: 50%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.wp-block-jwk-news .swiper-container .swiper-slide div:not(.top) {
padding: var(--gap);
}
.wp-block-jwk-news .swiper-container .swiper-slide div:not(.top) h3 {
font-size: 1em;
color: var(--c-copy);
margin: 0;
}
.wp-block-jwk-news .swiper-container .swiper-slide div:not(.top) p {
font-size: 1em;
}
.wp-block-jwk-news .swiper-container .swiper-slide div:not(.top) p.subtitle {
font-size: 0.8333333333em;
color: white;
margin: 0;
padding: 0;
}
.wp-block-jwk-news .swiper-container .swiper-slide p {
font-size: 0.8333333333em;
}
.wp-block-jwk-news .nav {
margin-top: var(--gap-2x);
display: flex;
align-items: center;
justify-content: center;
}
.wp-block-jwk-news .nav.admin {
display: none;
}
.wp-block-jwk-news .nav svg, .wp-block-jwk-news .nav li {
cursor: pointer;
}
.wp-block-jwk-news .nav .swiper-pagination {
display: flex;
align-items: center;
justify-content: center;
padding: 0;
margin: 0 0.5em;
list-style: none;
}
.wp-block-jwk-news .nav .swiper-pagination span {
display: block;
margin: 0;
padding: 0;
width: 0.3em;
height: 0.3em;
border-radius: 50%;
background: var(--c-grey-deep);
opacity: 1;
margin: 0 0.5em;
}
.wp-block-jwk-news .nav .swiper-pagination span.swiper-pagination-bullet-active {
background: var(--c-copy);
}
.wp-block-jwk-numbers {
padding: var(--gap-2x);
}
.wp-block-jwk-numbers .radial {
position: relative;
width: 100%;
padding-bottom: 100%;
}
.wp-block-jwk-numbers .number {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.wp-block-jwk-numbers .number div {
position: absolute;
left: 0;
top: 50%;
width: 100%;
transform: translateY(-50%);
text-align: center;
}
.wp-block-jwk-numbers .number div span {
font-size: 3em;
}
.wp-block-jwk-numbers .number div p {
line-height: 1;
margin: 0 !important;
}
.wp-block-jwk-numbers > p {
margin-top: var(--gap);
font-size: 1.1em;
line-height: 1.1;
text-transform: uppercase;
text-align: center;
}
.wp-block-jwk-numbers .circle {
fill: none;
}
.wp-block-jwk-numbers .circle .elapsed {
stroke-width: 7px;
stroke: var(--c-grey-dark);
}
.wp-block-jwk-numbers .circle path {
stroke-width: 7px;
stroke-linecap: round;
display: none;
}
.wp-block-jwk-numbers .circle path.active {
display: block;
}
.wp-block-jwk-themen {
background-color: var(--c-grey);
}
.wp-block-jwk-themen .inner {
display: grid;
gap: 1px;
margin: 1px 0;
}
@media (min-width: 524px) {
.wp-block-jwk-themen .inner.cells2, .wp-block-jwk-themen .inner.cells4, .wp-block-jwk-themen .inner.cells6, .wp-block-jwk-themen .inner.cells8, .wp-block-jwk-themen .inner.cells10, .wp-block-jwk-themen .inner.cells12, .wp-block-jwk-themen .inner.cells14, .wp-block-jwk-themen .inner.cells16, .wp-block-jwk-themen .inner.cells18, .wp-block-jwk-themen .inner.cells20, .wp-block-jwk-themen .inner.cells22, .wp-block-jwk-themen .inner.cells24, .wp-block-jwk-themen .inner.cells26, .wp-block-jwk-themen .inner.cells28, .wp-block-jwk-themen .inner.cells30 {
grid-template-columns: 1fr 1fr;
}
.wp-block-jwk-themen .inner.cells3, .wp-block-jwk-themen .inner.cells5, .wp-block-jwk-themen .inner.cells6, .wp-block-jwk-themen .inner.cells9, .wp-block-jwk-themen .inner.cells12, .wp-block-jwk-themen .inner.cells15, .wp-block-jwk-themen .inner.cells18, .wp-block-jwk-themen .inner.cells21, .wp-block-jwk-themen .inner.cells24, .wp-block-jwk-themen .inner.cells27, .wp-block-jwk-themen .inner.cells30 {
grid-template-columns: 1fr 1fr 1fr;
}
}
@media (min-width: 1024px) {
.wp-block-jwk-themen .inner.cells4, .wp-block-jwk-themen .inner.cells7, .wp-block-jwk-themen .inner.cells8, .wp-block-jwk-themen .inner.cells12, .wp-block-jwk-themen .inner.cells16, .wp-block-jwk-themen .inner.cells20, .wp-block-jwk-themen .inner.cells24, .wp-block-jwk-themen .inner.cells28 {
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.wp-block-jwk-themen .inner.cells5 {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
}
@media (min-width: 1280px) {
.wp-block-jwk-themen .inner.cells6, .wp-block-jwk-themen .inner.cells12, .wp-block-jwk-themen .inner.cells11, .wp-block-jwk-themen .inner.cells13, .wp-block-jwk-themen .inner.cells17, .wp-block-jwk-themen .inner.cells23, .wp-block-jwk-themen .inner.cells18, .wp-block-jwk-themen .inner.cells24, .wp-block-jwk-themen .inner.cells30 {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
.wp-block-jwk-themen .inner.cells6.cells7, .wp-block-jwk-themen .inner.cells6.cells17, .wp-block-jwk-themen .inner.cells6.cells10, .wp-block-jwk-themen .inner.cells6.cells15, .wp-block-jwk-themen .inner.cells6.cells20, .wp-block-jwk-themen .inner.cells6.cells25, .wp-block-jwk-themen .inner.cells6.cells30, .wp-block-jwk-themen .inner.cells12.cells7, .wp-block-jwk-themen .inner.cells12.cells17, .wp-block-jwk-themen .inner.cells12.cells10, .wp-block-jwk-themen .inner.cells12.cells15, .wp-block-jwk-themen .inner.cells12.cells20, .wp-block-jwk-themen .inner.cells12.cells25, .wp-block-jwk-themen .inner.cells12.cells30, .wp-block-jwk-themen .inner.cells11.cells7, .wp-block-jwk-themen .inner.cells11.cells17, .wp-block-jwk-themen .inner.cells11.cells10, .wp-block-jwk-themen .inner.cells11.cells15, .wp-block-jwk-themen .inner.cells11.cells20, .wp-block-jwk-themen .inner.cells11.cells25, .wp-block-jwk-themen .inner.cells11.cells30, .wp-block-jwk-themen .inner.cells13.cells7, .wp-block-jwk-themen .inner.cells13.cells17, .wp-block-jwk-themen .inner.cells13.cells10, .wp-block-jwk-themen .inner.cells13.cells15, .wp-block-jwk-themen .inner.cells13.cells20, .wp-block-jwk-themen .inner.cells13.cells25, .wp-block-jwk-themen .inner.cells13.cells30, .wp-block-jwk-themen .inner.cells17.cells7, .wp-block-jwk-themen .inner.cells17.cells17, .wp-block-jwk-themen .inner.cells17.cells10, .wp-block-jwk-themen .inner.cells17.cells15, .wp-block-jwk-themen .inner.cells17.cells20, .wp-block-jwk-themen .inner.cells17.cells25, .wp-block-jwk-themen .inner.cells17.cells30, .wp-block-jwk-themen .inner.cells23.cells7, .wp-block-jwk-themen .inner.cells23.cells17, .wp-block-jwk-themen .inner.cells23.cells10, .wp-block-jwk-themen .inner.cells23.cells15, .wp-block-jwk-themen .inner.cells23.cells20, .wp-block-jwk-themen .inner.cells23.cells25, .wp-block-jwk-themen .inner.cells23.cells30, .wp-block-jwk-themen .inner.cells18.cells7, .wp-block-jwk-themen .inner.cells18.cells17, .wp-block-jwk-themen .inner.cells18.cells10, .wp-block-jwk-themen .inner.cells18.cells15, .wp-block-jwk-themen .inner.cells18.cells20, .wp-block-jwk-themen .inner.cells18.cells25, .wp-block-jwk-themen .inner.cells18.cells30, .wp-block-jwk-themen .inner.cells24.cells7, .wp-block-jwk-themen .inner.cells24.cells17, .wp-block-jwk-themen .inner.cells24.cells10, .wp-block-jwk-themen .inner.cells24.cells15, .wp-block-jwk-themen .inner.cells24.cells20, .wp-block-jwk-themen .inner.cells24.cells25, .wp-block-jwk-themen .inner.cells24.cells30, .wp-block-jwk-themen .inner.cells30.cells7, .wp-block-jwk-themen .inner.cells30.cells17, .wp-block-jwk-themen .inner.cells30.cells10, .wp-block-jwk-themen .inner.cells30.cells15, .wp-block-jwk-themen .inner.cells30.cells20, .wp-block-jwk-themen .inner.cells30.cells25, .wp-block-jwk-themen .inner.cells30.cells30 {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
}
.wp-block-jwk-themen .inner .cell {
padding: var(--gap-2x);
text-align: center;
color: white;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.wp-block-jwk-themen .inner .cell h2 {
font-size: 1.3125em;
}
.wp-block-jwk-themen .inner .cell.no-colour {
background-color: #E6E2E1;
}
.wp-block-jwk-themen .inner .cell.no-colour h2 {
font-size: 1.125em;
}
.wp-block-jwk-themen .inner .cell a.button.outline {
display: block;
}
.wp-block-jwk-themen .inner .cell a.button.outline:not(:last-child) {
margin-bottom: var(--gap);
}
.wp-block-jwk-themen .inner .cell:not(.has-colour) {
color: var(--c-copy);
}
.wp-block-jwk-themen .inner .cell:not(.has-colour) a.button.outline {
color: var(--c-copy);
border: solid 1px var(--c-copy);
}
.wp-block-jwk-themen .inner .cell:not(.has-colour) a.button.outline:hover {
color: var(--c-copy);
border-color: var(--c-copy);
}
.wp-block-jwk-themen .inner:has(img) {
margin-top: var(--m-vert-slim);
}
.wp-block-jwk-themen .inner:has(img) .cell {
position: relative;
padding-top: 4em;
padding-bottom: 4em;
}
.wp-block-jwk-themen .inner:has(img) .cell img {
max-width: 6em;
position: absolute;
left: 50%;
top: 0;
transform: translate(-50%, -50%);
border-radius: 200px;
overflow: hidden;
}
.wp-block-jwk-accordion {
background-color: white;
}
.wp-block-jwk-accordion + .wp-block-jwk-accordion {
margin-top: var(--gap);
}
.wp-block-jwk-accordion + :not(.wp-block-jwk-accordion) {
margin-top: var(--m-vert);
}
.wp-block-jwk-accordion:last-child {
margin-bottom: var(--m-vert);
}
.wp-block-jwk-accordion > h2 {
display: flex;
align-items: center;
justify-content: space-between;
padding: var(--gap-2x) var(--gap-2x);
border: solid 1px var(--c-grey);
margin: 0 !important;
cursor: pointer;
font-size: 1.4rem;
}
@media (max-width: 768px) {
.wp-block-jwk-accordion > h2 {
flex-direction: column;
align-items: stretch;
font-size: 1.1em;
}
.wp-block-jwk-accordion > h2 span + span {
margin-top: 1rem;
}
}
@media (min-width: 768px) {
.wp-block-jwk-accordion > h2 {
padding: 0.5em 0.5em 0.5em var(--gap-2x);
}
}
.wp-block-jwk-accordion > h2:hover {
color: var(--c-copy);
}
.wp-block-jwk-accordion > h2 span.button {
padding: 0;
font-size: 1rem;
color: var(--c-corporate);
background-color: transparent;
white-space: nowrap;
}
.wp-block-jwk-accordion > h2 span.button:hover {
color: var(--c-copy);
background: transparent;
}
.wp-block-jwk-accordion .inner__content {
padding: var(--gap-2x);
}
.wp-block-jwk-accordion .block:first-child {
margin-top: 0;
}
.wp-block-jwk-accordion:not(.open) h2 .close {
display: none;
}
.wp-block-jwk-accordion.open h2 .open {
display: none;
border-bottom: none;
}
.wp-block-jwk-accordion.open .inner {
border: solid 1px var(--c-grey);
border-top: none;
}
.wp-block-jwk-accordion.open h2 {
border-bottom: none;
}
.wp-block-jwk-accordion .wp-block-accordion__content {
transition: height 400ms;
}
.wp-block-jwk-accordion .wp-block-accordion__content:not(.open) {
height: 0;
overflow: hidden;
}
.wp-block-jwk-themen {
background-color: var(--c-grey);
}
.wp-block-jwk-themen .inner {
display: grid;
gap: 1px;
margin: 1px 0;
}
@media (min-width: 524px) {
.wp-block-jwk-themen .inner.cells2, .wp-block-jwk-themen .inner.cells4, .wp-block-jwk-themen .inner.cells6, .wp-block-jwk-themen .inner.cells8, .wp-block-jwk-themen .inner.cells10, .wp-block-jwk-themen .inner.cells12, .wp-block-jwk-themen .inner.cells14, .wp-block-jwk-themen .inner.cells16, .wp-block-jwk-themen .inner.cells18, .wp-block-jwk-themen .inner.cells20, .wp-block-jwk-themen .inner.cells22, .wp-block-jwk-themen .inner.cells24, .wp-block-jwk-themen .inner.cells26, .wp-block-jwk-themen .inner.cells28, .wp-block-jwk-themen .inner.cells30 {
grid-template-columns: 1fr 1fr;
}
.wp-block-jwk-themen .inner.cells3, .wp-block-jwk-themen .inner.cells5, .wp-block-jwk-themen .inner.cells6, .wp-block-jwk-themen .inner.cells9, .wp-block-jwk-themen .inner.cells12, .wp-block-jwk-themen .inner.cells15, .wp-block-jwk-themen .inner.cells18, .wp-block-jwk-themen .inner.cells21, .wp-block-jwk-themen .inner.cells24, .wp-block-jwk-themen .inner.cells27, .wp-block-jwk-themen .inner.cells30 {
grid-template-columns: 1fr 1fr 1fr;
}
}
@media (min-width: 1024px) {
.wp-block-jwk-themen .inner.cells4, .wp-block-jwk-themen .inner.cells7, .wp-block-jwk-themen .inner.cells8, .wp-block-jwk-themen .inner.cells12, .wp-block-jwk-themen .inner.cells16, .wp-block-jwk-themen .inner.cells20, .wp-block-jwk-themen .inner.cells24, .wp-block-jwk-themen .inner.cells28 {
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.wp-block-jwk-themen .inner.cells5 {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
}
@media (min-width: 1280px) {
.wp-block-jwk-themen .inner.cells6, .wp-block-jwk-themen .inner.cells12, .wp-block-jwk-themen .inner.cells11, .wp-block-jwk-themen .inner.cells13, .wp-block-jwk-themen .inner.cells17, .wp-block-jwk-themen .inner.cells23, .wp-block-jwk-themen .inner.cells18, .wp-block-jwk-themen .inner.cells24, .wp-block-jwk-themen .inner.cells30 {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
.wp-block-jwk-themen .inner.cells6.cells7, .wp-block-jwk-themen .inner.cells6.cells17, .wp-block-jwk-themen .inner.cells6.cells10, .wp-block-jwk-themen .inner.cells6.cells15, .wp-block-jwk-themen .inner.cells6.cells20, .wp-block-jwk-themen .inner.cells6.cells25, .wp-block-jwk-themen .inner.cells6.cells30, .wp-block-jwk-themen .inner.cells12.cells7, .wp-block-jwk-themen .inner.cells12.cells17, .wp-block-jwk-themen .inner.cells12.cells10, .wp-block-jwk-themen .inner.cells12.cells15, .wp-block-jwk-themen .inner.cells12.cells20, .wp-block-jwk-themen .inner.cells12.cells25, .wp-block-jwk-themen .inner.cells12.cells30, .wp-block-jwk-themen .inner.cells11.cells7, .wp-block-jwk-themen .inner.cells11.cells17, .wp-block-jwk-themen .inner.cells11.cells10, .wp-block-jwk-themen .inner.cells11.cells15, .wp-block-jwk-themen .inner.cells11.cells20, .wp-block-jwk-themen .inner.cells11.cells25, .wp-block-jwk-themen .inner.cells11.cells30, .wp-block-jwk-themen .inner.cells13.cells7, .wp-block-jwk-themen .inner.cells13.cells17, .wp-block-jwk-themen .inner.cells13.cells10, .wp-block-jwk-themen .inner.cells13.cells15, .wp-block-jwk-themen .inner.cells13.cells20, .wp-block-jwk-themen .inner.cells13.cells25, .wp-block-jwk-themen .inner.cells13.cells30, .wp-block-jwk-themen .inner.cells17.cells7, .wp-block-jwk-themen .inner.cells17.cells17, .wp-block-jwk-themen .inner.cells17.cells10, .wp-block-jwk-themen .inner.cells17.cells15, .wp-block-jwk-themen .inner.cells17.cells20, .wp-block-jwk-themen .inner.cells17.cells25, .wp-block-jwk-themen .inner.cells17.cells30, .wp-block-jwk-themen .inner.cells23.cells7, .wp-block-jwk-themen .inner.cells23.cells17, .wp-block-jwk-themen .inner.cells23.cells10, .wp-block-jwk-themen .inner.cells23.cells15, .wp-block-jwk-themen .inner.cells23.cells20, .wp-block-jwk-themen .inner.cells23.cells25, .wp-block-jwk-themen .inner.cells23.cells30, .wp-block-jwk-themen .inner.cells18.cells7, .wp-block-jwk-themen .inner.cells18.cells17, .wp-block-jwk-themen .inner.cells18.cells10, .wp-block-jwk-themen .inner.cells18.cells15, .wp-block-jwk-themen .inner.cells18.cells20, .wp-block-jwk-themen .inner.cells18.cells25, .wp-block-jwk-themen .inner.cells18.cells30, .wp-block-jwk-themen .inner.cells24.cells7, .wp-block-jwk-themen .inner.cells24.cells17, .wp-block-jwk-themen .inner.cells24.cells10, .wp-block-jwk-themen .inner.cells24.cells15, .wp-block-jwk-themen .inner.cells24.cells20, .wp-block-jwk-themen .inner.cells24.cells25, .wp-block-jwk-themen .inner.cells24.cells30, .wp-block-jwk-themen .inner.cells30.cells7, .wp-block-jwk-themen .inner.cells30.cells17, .wp-block-jwk-themen .inner.cells30.cells10, .wp-block-jwk-themen .inner.cells30.cells15, .wp-block-jwk-themen .inner.cells30.cells20, .wp-block-jwk-themen .inner.cells30.cells25, .wp-block-jwk-themen .inner.cells30.cells30 {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
}
.wp-block-jwk-themen .inner .cell {
padding: var(--gap-2x);
text-align: center;
color: white;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.wp-block-jwk-themen .inner .cell h2 {
font-size: 1.3125em;
}
.wp-block-jwk-themen .inner .cell.no-colour {
background-color: #E6E2E1;
}
.wp-block-jwk-themen .inner .cell.no-colour h2 {
font-size: 1.125em;
}
.wp-block-jwk-themen .inner .cell a.button.outline {
display: block;
}
.wp-block-jwk-themen .inner .cell a.button.outline:not(:last-child) {
margin-bottom: var(--gap);
}
.wp-block-jwk-themen .inner .cell:not(.has-colour) {
color: var(--c-copy);
}
.wp-block-jwk-themen .inner .cell:not(.has-colour) a.button.outline {
color: var(--c-copy);
border: solid 1px var(--c-copy);
}
.wp-block-jwk-themen .inner .cell:not(.has-colour) a.button.outline:hover {
color: var(--c-copy);
border-color: var(--c-copy);
}
.wp-block-jwk-themen .inner:has(img) {
margin-top: var(--m-vert-slim);
}
.wp-block-jwk-themen .inner:has(img) .cell {
position: relative;
padding-top: 4em;
padding-bottom: 4em;
}
.wp-block-jwk-themen .inner:has(img) .cell img {
max-width: 6em;
position: absolute;
left: 50%;
top: 0;
transform: translate(-50%, -50%);
border-radius: 200px;
overflow: hidden;
}
.wp-block-jwk-wirkfaktoren {
margin-top: var(--m-vert-slim);
display: flex;
flex-wrap: wrap;
}
.wp-block-jwk-wirkfaktoren > div {
width: 100%;
padding-bottom: 50%;
flex-shrink: 0;
position: relative;
overflow: hidden;
}
@media (min-width: 1024px) {
.wp-block-jwk-wirkfaktoren > div {
width: 50%;
}
}
.wp-block-jwk-wirkfaktoren .circle {
background-color: var(--c-copy);
background-size: cover;
background-position: center center;
position: relative;
padding-bottom: 50%;
}
@media (min-width: 768px) {
.wp-block-jwk-wirkfaktoren .circle {
padding-bottom: 33%;
}
}
@media (min-width: 1024px) {
.wp-block-jwk-wirkfaktoren .circle {
padding-bottom: 50%;
}
}
.wp-block-jwk-wirkfaktoren .circle > div {
position: absolute;
left: 50%;
top: 0;
transform: translate(-50%, -50%) rotate(90deg);
}
@media (min-width: 1024px) {
.wp-block-jwk-wirkfaktoren .circle > div {
left: 0;
top: 50%;
width: 100%;
height: 100%;
transform: translate(-50%, -50%) rotate(0deg);
}
}
.wp-block-jwk-wirkfaktoren .circle svg {
transition: transform 400ms;
height: 100%;
width: 100%;
}
.wp-block-jwk-wirkfaktoren .circle span {
display: block;
position: absolute;
left: 50%;
bottom: var(--gap-2x);
transform: translateX(-50%);
font-size: 1.6em;
padding: 0 var(--gap);
color: white;
text-align: center;
margin: 0;
}
@media (min-width: 1024px) {
.wp-block-jwk-wirkfaktoren .circle span {
left: auto;
bottom: auto;
right: 0;
top: 50%;
width: 50%;
transform: translateY(-50%);
}
}
.wp-block-jwk-wirkfaktoren .slider {
background: var(--c-subtle);
}
@media (max-width: 1023px) {
.wp-block-jwk-wirkfaktoren .slider {
display: flex;
flex-direction: column-reverse;
position: relative;
padding-top: var(--gap-2x);
padding-bottom: 0;
}
}
@media (min-width: 1024px) {
.wp-block-jwk-wirkfaktoren .slider .swiper-container {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
}
.wp-block-jwk-wirkfaktoren .slider .swiper-container .swiper-slide {
height: auto;
display: flex;
}
.wp-block-jwk-wirkfaktoren .slider .swiper-container .inner {
padding: var(--gap-3x);
}
@media (min-width: 768px) {
.wp-block-jwk-wirkfaktoren .slider .swiper-container .inner {
font-size: 0.86em;
}
.wp-block-jwk-wirkfaktoren .slider .swiper-container .inner p {
font-size: 0.86em;
}
}
.wp-block-jwk-wirkfaktoren .nav {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
}
@media (min-width: 1024px) {
.wp-block-jwk-wirkfaktoren .nav {
position: absolute;
z-index: 2;
left: 50%;
width: auto;
transform: translateX(-50%);
bottom: var(--gap);
}
}
.wp-block-jwk-wirkfaktoren .nav .swiper-button-disabled {
opacity: 0.5;
}
.wp-block-jwk-wirkfaktoren .nav svg:not(.swiper-button-disabled) {
cursor: pointer;
}
.wp-block-jwk-wirkfaktoren .nav .swiper-pagination {
margin: 0 8px;
display: flex;
}
.wp-block-jwk-wirkfaktoren .nav .swiper-pagination-bullet {
width: 8px;
height: 8px;
margin: 0 4px;
border-radius: 4px;
cursor: pointer;
background-color: rgba(0, 0, 0, 0.5);
}
.wp-block-jwk-wirkfaktoren .nav .swiper-pagination-bullet:hover, .wp-block-jwk-wirkfaktoren .nav .swiper-pagination-bullet.swiper-pagination-bullet-active {
background-color: rgb(0, 0, 0);
}
.df-blocks-upload-wrap {
position: relative;
}
.df-blocks-upload-wrap .df-blocks-upload-button {
cursor: pointer;
position: absolute;
color: white;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
padding: 0.5em 1.5em;
border: solid 1px white;
border-radius: 8px;
}
.df-ui,
.df-upload {
position: relative;
}
.df-ui .df-button,
.df-ui .df-upload-button,
.df-upload .df-button,
.df-upload .df-upload-button {
font-family: sans-serif;
line-height: 1;
cursor: pointer;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
padding: 0.5em 1.5em 0.4em;
border: solid 1px white !important;
color: white !important;
background-color: var(--c-corporate) !important;
white-space: nowrap;
font-size: 1rem;
z-index: 2015;
border-radius: 8px;
}
.df-ui .df-button.minus, .df-ui .df-button.plus,
.df-ui .df-upload-button.minus,
.df-ui .df-upload-button.plus,
.df-upload .df-button.minus,
.df-upload .df-button.plus,
.df-upload .df-upload-button.minus,
.df-upload .df-upload-button.plus {
display: flex;
justify-content: center;
align-items: center;
padding: 0;
border-radius: 20px;
width: 40px;
height: 40px;
background-image: url('data:image/svg+xml;utf8,<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><line x1="1.74846e-07" y1="16" x2="32" y2="16" stroke="white" stroke-width="4"/> <line x1="16" y1="32" x2="16" stroke="white" stroke-width="4"/> </svg>');
background-position: center;
background-size: 28px;
background-repeat: no-repeat;
}
.df-ui .df-button.minus.minus, .df-ui .df-button.plus.minus,
.df-ui .df-upload-button.minus.minus,
.df-ui .df-upload-button.plus.minus,
.df-upload .df-button.minus.minus,
.df-upload .df-button.plus.minus,
.df-upload .df-upload-button.minus.minus,
.df-upload .df-upload-button.plus.minus {
background-image: url('data:image/svg+xml;utf8,<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><line x1="1.74846e-07" y1="16" x2="32" y2="16" stroke="white" stroke-width="4"/> </svg>');
}
.df-ui .df-button.small,
.df-ui .df-upload-button.small,
.df-upload .df-button.small,
.df-upload .df-upload-button.small {
font-size: 0.86rem;
}
.df-ui .df-button:hover,
.df-ui .df-upload-button:hover,
.df-upload .df-button:hover,
.df-upload .df-upload-button:hover {
background-color: var(--c-corporate) !important;
}
.df-ui .df-button.top-left, .df-ui .df-button.topleft,
.df-ui .df-upload-button.top-left,
.df-ui .df-upload-button.topleft,
.df-upload .df-button.top-left,
.df-upload .df-button.topleft,
.df-upload .df-upload-button.top-left,
.df-upload .df-upload-button.topleft {
left: 1em;
top: 1em;
transform: none;
}
.df-ui .df-button.top-right, .df-ui .df-button.topright,
.df-ui .df-upload-button.top-right,
.df-ui .df-upload-button.topright,
.df-upload .df-button.top-right,
.df-upload .df-button.topright,
.df-upload .df-upload-button.top-right,
.df-upload .df-upload-button.topright {
left: auto;
right: 1em;
top: 1em;
transform: none;
}
.df-ui .df-button.rightcenter, .df-ui .df-button.right-center,
.df-ui .df-upload-button.rightcenter,
.df-ui .df-upload-button.right-center,
.df-upload .df-button.rightcenter,
.df-upload .df-button.right-center,
.df-upload .df-upload-button.rightcenter,
.df-upload .df-upload-button.right-center {
left: auto;
right: 0;
transform: translate(50%, -50%);
}
.df-ui .df-button.static,
.df-ui .df-upload-button.static,
.df-upload .df-button.static,
.df-upload .df-upload-button.static {
position: static;
transform: none;
left: 0;
top: 0;
margin: 1em 0;
}
article {
clear: both;
margin: 0 auto;
}
article figure {
margin: 0;
}
table {
width: 100%;
}
table tr:not(:first-child) td {
border-top: solid 1px var(--c-copy);
}
table td, table th {
padding: 0.4em 0.5em;
}
body:not(.wp-admin) form p {
margin: 0;
}
body:not(.wp-admin) label {
display: inline-block;
}
body:not(.wp-admin) textarea,
body:not(.wp-admin) input[type=email],
body:not(.wp-admin) input[type=search],
body:not(.wp-admin) input[type=tel],
body:not(.wp-admin) input[type=text] {
font-family: var(--ff-copy);
padding: 0.8em;
margin: 0;
width: 100%;
border: none;
font-size: 1em;
border-radius: var(--radius);
}
body:not(.wp-admin) input[type=checkbox],
body:not(.wp-admin) input[type=radio],
body:not(.wp-admin) input[type=submit],
body:not(.wp-admin) input[type=button],
body:not(.wp-admin) select {
cursor: pointer;
}
body:not(.wp-admin) .gfield--type-honeypot {
display: none;
}
body:not(.wp-admin) .gform_wrapper {
margin-bottom: var(--m-vert);
}
body:not(.wp-admin) .gform_wrapper .ginput_container_name,
body:not(.wp-admin) .gform_wrapper .gform_fields {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
gap: 0.5em;
}
body:not(.wp-admin) .gform_wrapper .ginput_container_name > *,
body:not(.wp-admin) .gform_wrapper .gform_fields > * {
grid-column: span 6;
}
body:not(.wp-admin) .gform_wrapper .ginput_container_name .name_first,
body:not(.wp-admin) .gform_wrapper .ginput_container_name .name_last,
body:not(.wp-admin) .gform_wrapper .ginput_container_name .gfield--width-half,
body:not(.wp-admin) .gform_wrapper .gform_fields .name_first,
body:not(.wp-admin) .gform_wrapper .gform_fields .name_last,
body:not(.wp-admin) .gform_wrapper .gform_fields .gfield--width-half {
grid-column: span 3;
}
body:not(.wp-admin) .gform_wrapper .ginput_container_name .gfield--width-third,
body:not(.wp-admin) .gform_wrapper .gform_fields .gfield--width-third {
grid-column: span 2;
}
body:not(.wp-admin) .gform_wrapper .ginput_container {
margin: 0;
}
body:not(.wp-admin) .gform_wrapper .gfield_label {
margin: 0.5em 0;
}
body:not(.wp-admin) .gform_wrapper .gform_fields .gfield {
margin: 0 0 0.5em;
}
body:not(.wp-admin) .gform_wrapper .gform_fields .gfield legend,
body:not(.wp-admin) .gform_wrapper .gform_fields .gfield label {
opacity: 0.5;
padding-left: 0.8em;
}
body:not(.wp-admin) .gform_wrapper .gform_footer {
margin-top: var(--gap-2x);
display: flex;
justify-content: flex-end;
}
body:not(.wp-admin) .gform_wrapper .hidden_label label {
display: none;
}
body:not(.wp-admin) .gform_wrapper .hidden_label input {
margin-top: 0;
}
.multiply {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: var(--c-rot);
mix-blend-mode: multiply;
}
body.frontend a.button,
body.frontend .button {
display: inline-block;
padding: 0.6em 1.5em;
background: var(--c-corporate);
color: white;
text-decoration: none;
border-radius: 1.5em;
font-family: var(--ff-copy);
}
body.frontend a.button:has(span),
body.frontend .button:has(span) {
padding: 0.3em 1.5em 0.2em 0.6em;
display: inline-flex;
align-items: center;
justify-content: center;
}
body.frontend a.button:has(span) img,
body.frontend .button:has(span) img {
height: 1.8em;
margin-right: 0.5em;
}
body.frontend a.button:hover,
body.frontend .button:hover {
background: var(--c-copy);
cursor: pointer;
}
body.frontend a.button.outline,
body.frontend .button.outline {
background: transparent;
border: 1px solid white;
}
body.frontend a.button.outline:hover,
body.frontend .button.outline:hover {
background: white;
color: var(--c-corporate);
}
.wp-element-button {
text-transform: uppercase;
}
.upload {
position: relative;
}
.upload.pa1 {
position: absolute;
}
.upload button {
position: absolute;
right: 1em;
top: 1em;
z-index: 1986;
background: white;
}
.upload button.bottom.center {
top: auto;
right: auto;
bottom: 1em;
left: 50%;
transform: translateX(-50%);
}
.swiper-container {
overflow: hidden;
}
.popin:has(h3:first-child) h3:first-child {
margin-top: 1em;
}
@media (min-width: 1024px) {
.popin {
width: 640px;
}
.popin:not(.personpopin) {
width: 860px;
}
}
@media (min-width: 1024px) and (min-width: 1280px) {
.popin:not(.personpopin) {
width: 1120px;
}
}
@media (min-width: 1024px) {
.popin .inner {
-moz-columns: 2;
columns: 2;
}
}
/*
/* Formate
*/
article.format-video iframe {
max-width: 100%;
}
.credits {
color: var(--c-copy);
}
.credits p {
font-size: 1em;
margin: 0;
float: left;
margin: 0 20px 0 0;
}
.credits a {
text-decoration: none;
}
.credits ul {
font-size: 1em;
float: left;
margin: 0 20px 0 0;
}
.credits ul li {
float: left;
background: none;
padding: 0;
margin: 0;
}
.credits ul li:after {
content: ", ";
}
.credits ul li:first-child, .credits ul li:last-child {
content: "";
}
.credits ul li:first-child:after, .credits ul li:last-child:after {
content: "";
}
@media (min-width: 550px) {
.f-left,
.alignleft {
float: left;
}
}
@media (min-width: 550px) {
.f-right,
.alignright {
float: right;
}
}
.aligncenter,
.alignright,
.alignleft {
display: block;
margin: 0 auto;
}
@media (min-width: 550px) {
.aligncenter,
.alignright,
.alignleft {
display: inline;
margin: 0 10px 10px 0;
}
}
@media (min-width: 550px) {
.alignright {
display: inline;
margin: 0 0 10px 10px;
}
}
.a-left,
.text-left {
text-align: left;
}
.a-right,
.text-right {
text-align: right;
}
#wrapall:has(.content section.has-background:last-child) + footer {
margin-top: 0;
}
body:not(:has(.wp-block-jwk-persons:last-child)) footer {
margin-top: var(--m-vert);
}
footer {
background-color: #a6a6a6;
color: var(--c-copy);
padding-top: var(--m-vert-slim);
}
footer a {
text-decoration: none;
color: var(--c-copy);
}
footer a:hover {
color: var(--c-copy);
text-decoration: underline;
}
footer ul {
margin-top: 0;
}
footer ul li:not([class]),
footer ul li.block-editor-block-list__block {
margin: 0 0 0.2em 0;
background: none;
padding: 0;
}
footer p {
margin-top: 0;
margin-bottom: 0.2em;
line-height: 1.4;
}
footer nav ul _li:not(:first-child) {
margin-top: 0.5em;
margin-bottom: 0.4em;
padding-top: 0.5em;
border-top: solid 1px white;
}
footer .nav {
padding: 0 var(--m-vert-slim);
display: grid;
gap: var(--gap);
}
@media (min-width: 768px) {
footer .nav {
padding-bottom: var(--m-vert-slim);
}
}
@media (min-width: 768px) {
footer .nav {
grid-template-columns: 1fr 1fr 1fr;
}
}
footer .nav address {
margin-top: var(--m-vert-slim);
}
footer .secondary {
padding: var(--gap) var(--m-vert-slim);
background-color: #bfbfbf;
display: grid;
}
@media (min-width: 768px) {
footer .secondary {
grid-template-columns: 1fr 1fr;
}
}
footer .secondary .caritas {
align-items: center;
display: flex;
display: flex;
}
@media (max-width: 767px) {
footer .secondary .caritas {
justify-content: center;
}
}
footer .secondary .caritas img {
flex-shrink: 0;
height: 3.5em;
margin-right: 1em;
}
footer .secondary .caritas p {
font-size: 0.86em !important;
}
footer .secondary .social {
display: flex;
justify-content: center;
margin-top: var(--m-vert-slim);
align-items: center;
}
@media (min-width: 768px) {
footer .secondary .social {
margin-top: 0;
justify-content: flex-end;
}
}
footer .secondary .social a {
text-decoration: none;
margin-left: var(--gap-2x);
display: flex;
align-items: center;
}
footer .secondary .social a img {
height: 1.2em;
}
@media (min-width: 768px) {
footer .secondary .social a img {
height: 1.8em;
}
}
footer .secondary .social a span {
margin-left: 0.6em;
}
.pr {
position: relative;
}
.pr.pa1 {
width: 100%;
padding-bottom: 100%;
}
.pr.pa1.wide {
padding-bottom: 56%;
}
.pa {
position: absolute;
}
.pa.l0 {
left: 0;
}
.pa.t0 {
top: 0;
}
.pa.r0 {
right: 0;
}
.pa.b0 {
bottom: 0;
}
.pa1 {
display: block;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.pa1.of {
-o-object-fit: cover;
object-fit: cover;
}
.fxc {
display: flex;
justify-content: center;
align-items: center;
}
.fxsb {
display: flex;
justify-content: space-between;
align-items: center;
}
.fxsb.afs {
align-items: flex-start;
}
.fxsb.afe {
align-items: flex-end;
}
.txc {
text-align: center;
}
.hideMove {
position: fixed;
top: -5000px;
}
.clear {
clear: both;
}
.printonly {
display: none;
}
.wp-caption,
img {
max-width: 100%;
height: auto;
}
.text-center {
text-align: center;
}
.blur-50 {
filter: url("#sharpBlur");
}
.hideSvgSoThatItSupportsFirefox {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
:root {
--f-spinner-width: 36px;
--f-spinner-height: 36px;
--f-spinner-color-1: rgba(0, 0, 0, 0.1);
--f-spinner-color-2: rgba(17, 24, 28, 0.8);
--f-spinner-stroke: 2.75;
}
.f-spinner {
margin: auto;
padding: 0;
width: var(--f-spinner-width);
height: var(--f-spinner-height);
}
.f-spinner svg {
width: 100%;
height: 100%;
vertical-align: top;
animation: f-spinner-rotate 2s linear infinite;
}
.f-spinner svg * {
stroke-width: var(--f-spinner-stroke);
fill: none;
}
.f-spinner svg *:first-child {
stroke: var(--f-spinner-color-1);
}
.f-spinner svg *:last-child {
stroke: var(--f-spinner-color-2);
animation: f-spinner-dash 2s ease-in-out infinite;
}
@keyframes f-spinner-rotate {
100% {
transform: rotate(360deg);
}
}
@keyframes f-spinner-dash {
0% {
stroke-dasharray: 1, 150;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -35;
}
100% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -124;
}
}
.f-zoomInUp {
animation: 0.2s ease-out 0.1s both f-zoomInUp;
}
.f-zoomOutDown {
animation: 0.2s ease-in both f-zoomOutDown;
}
@keyframes f-zoomInUp {
from {
transform: scale(0.975) translate3d(0, 16px, 0);
opacity: 0;
}
to {
transform: scale(1) translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes f-zoomOutDown {
to {
transform: scale(0.975) translate3d(0, -16px, 0);
opacity: 0;
}
}
.f-throwOutUp {
animation: 0.175s ease-out both f-throwOutUp;
}
.f-throwOutDown {
animation: 0.175s ease-out both f-throwOutDown;
}
@keyframes f-throwOutUp {
to {
transform: translate3d(0, -150px, 0);
opacity: 0;
}
}
@keyframes f-throwOutDown {
to {
transform: translate3d(0, 150px, 0);
opacity: 0;
}
}
.f-fadeIn {
animation: 0.2s ease both f-fadeIn;
z-index: 2;
}
.f-fadeOut {
animation: 0.2s ease both f-fadeOut;
z-index: 1;
}
@keyframes f-fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes f-fadeOut {
100% {
opacity: 0;
}
}
.f-fadeSlowIn {
animation: 0.5s ease both f-fadeSlowIn;
z-index: 2;
}
.f-fadeSlowOut {
animation: 0.5s ease both f-fadeSlowOut;
z-index: 1;
}
@keyframes f-fadeSlowIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes f-fadeSlowOut {
100% {
opacity: 0;
}
}
.f-fadeFastIn {
animation: 0.2s ease-out both f-fadeFastIn;
z-index: 2;
}
.f-fadeFastOut {
animation: 0.2s ease-out both f-fadeFastOut;
z-index: 2;
}
@keyframes f-fadeFastIn {
0% {
opacity: 0.75;
}
100% {
opacity: 1;
}
}
@keyframes f-fadeFastOut {
100% {
opacity: 0;
}
}
.f-crossfadeIn {
animation: 0.2s ease-out both f-crossfadeIn;
z-index: 2;
}
.f-crossfadeOut {
animation: 0.1s linear 0.1s both f-crossfadeOut;
z-index: 1;
}
@keyframes f-crossfadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes f-crossfadeOut {
100% {
opacity: 0;
}
}
.f-slideIn.from-next {
animation: 0.85s cubic-bezier(0.16, 1, 0.3, 1) f-slideInNext;
}
.f-slideIn.from-prev {
animation: 0.85s cubic-bezier(0.16, 1, 0.3, 1) f-slideInPrev;
}
.f-slideOut.to-next {
animation: 0.85s cubic-bezier(0.16, 1, 0.3, 1) f-slideOutNext;
}
.f-slideOut.to-prev {
animation: 0.85s cubic-bezier(0.16, 1, 0.3, 1) f-slideOutPrev;
}
@keyframes f-slideInPrev {
0% {
transform: translateX(100%);
}
100% {
transform: translate3d(0, 0, 0);
}
}
@keyframes f-slideInNext {
0% {
transform: translateX(-100%);
}
100% {
transform: translate3d(0, 0, 0);
}
}
@keyframes f-slideOutNext {
100% {
transform: translateX(-100%);
}
}
@keyframes f-slideOutPrev {
100% {
transform: translateX(100%);
}
}
.f-classicIn.from-next {
animation: 0.85s cubic-bezier(0.16, 1, 0.3, 1) f-classicInNext;
z-index: 2;
}
.f-classicIn.from-prev {
animation: 0.85s cubic-bezier(0.16, 1, 0.3, 1) f-classicInPrev;
z-index: 2;
}
.f-classicOut.to-next {
animation: 0.85s cubic-bezier(0.16, 1, 0.3, 1) f-classicOutNext;
z-index: 1;
}
.f-classicOut.to-prev {
animation: 0.85s cubic-bezier(0.16, 1, 0.3, 1) f-classicOutPrev;
z-index: 1;
}
@keyframes f-classicInNext {
0% {
transform: translateX(-75px);
opacity: 0;
}
100% {
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes f-classicInPrev {
0% {
transform: translateX(75px);
opacity: 0;
}
100% {
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes f-classicOutNext {
100% {
transform: translateX(-75px);
opacity: 0;
}
}
@keyframes f-classicOutPrev {
100% {
transform: translateX(75px);
opacity: 0;
}
}
:root {
--f-button-width: 40px;
--f-button-height: 40px;
--f-button-border: 0;
--f-button-border-radius: 0;
--f-button-color: #374151;
--f-button-bg: #f8f8f8;
--f-button-hover-bg: #e0e0e0;
--f-button-active-bg: #d0d0d0;
--f-button-shadow: none;
--f-button-transition: all 0.15s ease;
--f-button-transform: none;
--f-button-svg-width: 20px;
--f-button-svg-height: 20px;
--f-button-svg-stroke-width: 1.5;
--f-button-svg-fill: none;
--f-button-svg-filter: none;
--f-button-svg-disabled-opacity: 0.65;
}
.f-button {
display: flex;
justify-content: center;
align-items: center;
box-sizing: content-box;
position: relative;
margin: 0;
padding: 0;
width: var(--f-button-width);
height: var(--f-button-height);
border: var(--f-button-border);
border-radius: var(--f-button-border-radius);
color: var(--f-button-color);
background: var(--f-button-bg);
box-shadow: var(--f-button-shadow);
pointer-events: all;
cursor: pointer;
transition: var(--f-button-transition);
}
@media (hover: hover) {
.f-button:hover {
color: var(--f-button-hover-color);
background-color: var(--f-button-hover-bg);
}
}
.f-button:active:not([disabled]) {
background-color: var(--f-button-active-bg);
}
.f-button svg {
width: var(--f-button-svg-width);
height: var(--f-button-svg-height);
fill: var(--f-button-svg-fill);
stroke: currentColor;
stroke-width: var(--f-button-svg-stroke-width);
stroke-linecap: round;
stroke-linejoin: round;
transform: var(--f-button-transform);
filter: var(--f-button-svg-filter);
pointer-events: none;
}
.f-button[disabled] {
cursor: default;
}
.f-button[disabled] svg {
opacity: var(--f-button-svg-disabled-opacity);
}
.f-carousel__nav .f-button.is-prev, .f-carousel__nav .f-button.is-next, .fancybox__nav .f-button.is-prev, .fancybox__nav .f-button.is-next {
position: absolute;
z-index: 1;
}
.is-horizontal .f-carousel__nav .f-button.is-prev, .is-horizontal .f-carousel__nav .f-button.is-next, .is-horizontal .fancybox__nav .f-button.is-prev, .is-horizontal .fancybox__nav .f-button.is-next {
top: 50%;
transform: translateY(-50%);
}
.is-horizontal .f-carousel__nav .f-button.is-prev, .is-horizontal .fancybox__nav .f-button.is-prev {
left: var(--f-button-prev-pos);
}
.is-horizontal .f-carousel__nav .f-button.is-next, .is-horizontal .fancybox__nav .f-button.is-next {
right: var(--f-button-next-pos);
}
.is-horizontal.is-rtl .f-carousel__nav .f-button.is-prev, .is-horizontal.is-rtl .fancybox__nav .f-button.is-prev {
left: auto;
right: var(--f-button-next-pos);
}
.is-horizontal.is-rtl .f-carousel__nav .f-button.is-next, .is-horizontal.is-rtl .fancybox__nav .f-button.is-next {
right: auto;
left: var(--f-button-prev-pos);
}
.is-vertical .f-carousel__nav .f-button.is-prev, .is-vertical .f-carousel__nav .f-button.is-next, .is-vertical .fancybox__nav .f-button.is-prev, .is-vertical .fancybox__nav .f-button.is-next {
top: auto;
left: 50%;
transform: translateX(-50%);
}
.is-vertical .f-carousel__nav .f-button.is-prev, .is-vertical .fancybox__nav .f-button.is-prev {
top: var(--f-button-next-pos);
}
.is-vertical .f-carousel__nav .f-button.is-next, .is-vertical .fancybox__nav .f-button.is-next {
bottom: var(--f-button-next-pos);
}
.is-vertical .f-carousel__nav .f-button.is-prev svg, .is-vertical .f-carousel__nav .f-button.is-next svg, .is-vertical .fancybox__nav .f-button.is-prev svg, .is-vertical .fancybox__nav .f-button.is-next svg {
transform: rotate(90deg);
}
html.with-fancybox {
scroll-behavior: auto;
width: auto;
overflow: visible;
}
html.with-fancybox body {
touch-action: none;
}
html.with-fancybox body.compensate-for-scrollbar {
width: auto;
overflow: hidden !important;
overscroll-behavior-y: none;
margin-right: var(--fancybox-scrollbar-compensate, 0);
}
.fancybox__container {
--fancybox-color: #dbdbdb;
--fancybox-hover-color: #fff;
--fancybox-bg: rgba(24, 24, 27, 0.98);
--fancybox-slide-gap: 10px;
--f-spinner-width: 50px;
--f-spinner-height: 50px;
--f-spinner-color-1: rgba(255, 255, 255, 0.1);
--f-spinner-color-2: #bbb;
--f-spinner-stroke: 3.65;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
direction: ltr;
display: flex;
flex-direction: column;
box-sizing: border-box;
margin: 0;
padding: 0;
color: #f8f8f8;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
overflow: visible;
z-index: 1050;
outline: none;
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust: none;
text-size-adjust: 100%;
}
.fancybox__container *, .fancybox__container *::before, .fancybox__container *::after {
box-sizing: inherit;
}
.fancybox__backdrop {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: -1;
background: var(--fancybox-bg);
opacity: var(--fancybox-opacity, 1);
will-change: opacity;
}
.fancybox__carousel {
position: relative;
box-sizing: border-box;
flex: 1;
min-height: 0;
z-index: 10;
overflow-y: visible;
overflow-x: clip;
}
.fancybox__viewport {
width: 100%;
height: 100%;
}
.fancybox__track {
display: flex;
margin: 0 auto;
height: 100%;
transform: matrix(1, 0, 0, 1, 0, 0);
will-change: transform;
}
.fancybox__slide {
flex: 0 0 auto;
position: relative;
display: flex;
flex-direction: column;
align-items: center;
margin: 0 var(--fancybox-slide-gap) 0 0;
padding: 4px;
width: 100%;
height: 100%;
overflow: auto;
}
.fancybox__container:not(.is-compact) .fancybox__slide.has-close-btn {
padding-top: 40px;
}
.fancybox__slide.has-iframe, .fancybox__slide.has-video, .fancybox__slide.has-html5video {
overflow: hidden;
}
.fancybox__slide.has-image {
overflow: hidden;
}
.fancybox__slide.has-image.is-selected {
overflow: visible;
}
.fancybox__slide::before, .fancybox__slide::after {
content: "";
flex: 0 0 0;
margin: auto;
}
.fancybox__content {
align-self: center;
display: flex;
flex-direction: column;
position: relative;
margin: 0;
padding: 2rem;
max-width: 100%;
color: var(--fancybox-content-color, #374151);
background: var(--fancybox-content-bg, #fff);
cursor: default;
border-radius: 0;
z-index: 20;
}
.is-loading .fancybox__content {
opacity: 0;
}
.is-draggable .fancybox__content {
cursor: move;
cursor: grab;
}
.can-zoom_in .fancybox__content {
cursor: zoom-in;
}
.can-zoom_out .fancybox__content {
cursor: zoom-out;
}
.is-dragging .fancybox__content {
cursor: move;
cursor: grabbing;
}
.fancybox__content [data-selectable], .fancybox__content [contenteditable] {
cursor: auto;
}
.fancybox__slide.has-image > .fancybox__content {
padding: 0;
background: rgba(0, 0, 0, 0);
min-height: 1px;
background-repeat: no-repeat;
background-size: contain;
background-position: center center;
transition: none;
transform: matrix(1, 0, 0, 1, 0, 0);
will-change: transform, width, height;
}
.fancybox-image {
margin: auto;
display: block;
width: 100%;
height: 100%;
min-height: 0;
-o-object-fit: contain;
object-fit: contain;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.hide-image .fancybox-image {
opacity: 0;
}
.fancybox__caption {
align-self: center;
max-width: 100%;
flex-shrink: 0;
margin: 0;
padding: 14px 0 4px 0;
overflow-wrap: anywhere;
line-height: 1.375;
color: var(--fancybox-color, currentColor);
opacity: var(--fancybox-opacity, 1);
cursor: auto;
visibility: visible;
}
.is-loading .fancybox__caption, .is-closing .fancybox__caption {
opacity: 0;
visibility: hidden;
}
.is-compact .fancybox__caption {
padding-bottom: 0;
}
.f-button.is-close-btn {
--f-button-svg-stroke-width: 2;
position: absolute;
top: 0;
right: 8px;
z-index: 40;
}
.fancybox__content > .f-button.is-close-btn {
--f-button-color: #fff;
--f-button-bg: transparent;
--f-button-hover-bg: transparent;
--f-button-active-bg: transparent;
--f-button-svg-width: 22px;
--f-button-svg-height: 22px;
position: absolute;
top: -38px;
right: 0;
width: 34px;
height: 34px;
border-radius: 4px;
color: var(--fancybox-color, #fff);
opacity: 0.75;
}
.is-loading .fancybox__content > .f-button.is-close-btn {
visibility: hidden;
}
.is-zooming-out .fancybox__content > .f-button.is-close-btn {
visibility: hidden;
}
.fancybox__content > .f-button.is-close-btn:hover {
opacity: 1;
}
.fancybox__footer {
padding: 0;
margin: 0;
position: relative;
}
.fancybox__footer .fancybox__caption {
width: 100%;
padding: 24px;
opacity: var(--fancybox-opacity, 1);
transition: all 0.25s ease;
}
.is-compact .fancybox__footer {
position: absolute;
bottom: 0;
left: 0;
right: 0;
z-index: 20;
background: rgba(24, 24, 27, 0.5);
}
.is-compact .fancybox__footer .fancybox__caption {
padding: 12px;
}
.is-compact .fancybox__content > .f-button.is-close-btn {
--f-button-svg-width: 18px;
--f-button-svg-height: 18px;
--f-button-svg-filter: none;
top: 5px;
right: 5px;
border-radius: 50%;
color: #fff;
background: rgba(0, 0, 0, 0.6);
}
.fancybox__nav {
--f-button-width: 50px;
--f-button-height: 50px;
--f-button-border: 0;
--f-button-border-radius: 50%;
--f-button-color: var(--fancybox-color);
--f-button-hover-color: var(--fancybox-hover-color);
--f-button-bg: transparent;
--f-button-hover-bg: rgba(24, 24, 27, 0.3);
--f-button-active-bg: rgba(24, 24, 27, 0.5);
--f-button-shadow: none;
--f-button-transition: all 0.15s ease;
--f-button-transform: none;
--f-button-svg-width: 26px;
--f-button-svg-height: 26px;
--f-button-svg-stroke-width: 2.5;
--f-button-svg-fill: none;
--f-button-svg-filter: drop-shadow(1px 1px 1px rgba(24, 24, 27, 0.5));
--f-button-svg-disabled-opacity: 0.65;
--f-button-next-pos: 1rem;
--f-button-prev-pos: 1rem;
opacity: var(--fancybox-opacity, 1);
}
.fancybox__nav :focus {
outline: none;
}
.fancybox__nav :focus-visible {
box-shadow: inset 0 0 0 1px #f8f8f8;
}
.fancybox__nav .f-button:before {
position: absolute;
content: "";
top: -30px;
right: -20px;
left: -20px;
bottom: -30px;
z-index: 1;
}
.is-idle .fancybox__nav {
animation: 0.15s ease-out both f-fadeOut;
}
.is-idle.is-compact .fancybox__footer {
animation: 0.15s ease-out both f-fadeOut;
}
.fancybox__slide > .f-spinner {
position: absolute;
top: 50%;
left: 50%;
margin: var(--f-spinner-top, calc(var(--f-spinner-width) * -0.5)) 0 0 var(--f-spinner-left, calc(var(--f-spinner-height) * -0.5));
z-index: 30;
cursor: pointer;
}
.fancybox-protected {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 40;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.fancybox-ghost {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
min-height: 0;
-o-object-fit: contain;
object-fit: contain;
z-index: 40;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
pointer-events: none;
}
.fancybox-focus-guard {
position: fixed;
top: 1px;
left: 1px;
width: 1px;
height: 0px;
padding: 0px;
margin: -1px;
overflow: hidden;
clip: rect(0px, 0px, 0px, 0px);
white-space: nowrap;
border-width: 0px;
}
.fancybox__container:not([aria-hidden]) {
opacity: 0;
}
.fancybox__container.is-animated[aria-hidden=false] > *:not(.fancybox__backdrop, .fancybox__carousel), .fancybox__container.is-animated[aria-hidden=false] .fancybox__carousel > *:not(.fancybox__viewport), .fancybox__container.is-animated[aria-hidden=false] .fancybox__slide > *:not(.fancybox__content) {
animation: 0.25s ease 0.1s backwards f-fadeIn;
}
.fancybox__container.is-animated[aria-hidden=false] .fancybox__backdrop {
animation: 0.35s ease backwards f-fadeIn;
}
.fancybox__container.is-animated[aria-hidden=true] > *:not(.fancybox__backdrop, .fancybox__carousel), .fancybox__container.is-animated[aria-hidden=true] .fancybox__carousel > *:not(.fancybox__viewport), .fancybox__container.is-animated[aria-hidden=true] .fancybox__slide > *:not(.fancybox__content) {
animation: 0.15s ease forwards f-fadeOut;
}
.fancybox__container.is-animated[aria-hidden=true] .fancybox__backdrop {
animation: 0.35s ease forwards f-fadeOut;
}
.has-iframe .fancybox__content, .has-map .fancybox__content, .has-pdf .fancybox__content, .has-youtube .fancybox__content, .has-vimeo .fancybox__content, .has-html5video .fancybox__content {
max-width: 100%;
flex-shrink: 1;
min-height: 1px;
overflow: visible;
}
.has-iframe .fancybox__content, .has-map .fancybox__content, .has-pdf .fancybox__content {
width: 100%;
height: 100%;
}
.fancybox__container:not(.is-compact) .has-iframe .fancybox__content, .fancybox__container:not(.is-compact) .has-map .fancybox__content, .fancybox__container:not(.is-compact) .has-pdf .fancybox__content {
width: calc(100% - 120px);
height: 90%;
}
.has-youtube .fancybox__content, .has-vimeo .fancybox__content, .has-html5video .fancybox__content {
width: 960px;
height: 540px;
max-width: 100%;
max-height: 100%;
}
.has-map .fancybox__content, .has-pdf .fancybox__content, .has-youtube .fancybox__content, .has-vimeo .fancybox__content, .has-html5video .fancybox__content {
padding: 0;
background: rgba(24, 24, 27, 0.9);
color: #fff;
}
.has-map .fancybox__content {
background: #e5e3df;
}
.fancybox__html5video, .fancybox__iframe {
border: 0;
display: block;
height: 100%;
width: 100%;
background: rgba(0, 0, 0, 0);
}
.fancybox-placeholder {
border: 0 !important;
clip: rect(1px, 1px, 1px, 1px) !important;
-webkit-clip-path: inset(50%) !important;
clip-path: inset(50%) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
width: 1px !important;
white-space: nowrap !important;
}
.f-thumbs {
--f-thumb-width: 96px;
--f-thumb-height: 72px;
--f-thumb-gap: 4px;
--f-thumb-outline: 0;
--f-thumb-outline-color: #5eb0ef;
--f-thumb-opacity: 1;
--f-thumb-hover-opacity: 1;
--f-thumb-selected-opacity: 1;
--f-thumb-border-radius: 2px;
--f-thumb-offset: 0px;
position: relative;
margin: 0;
padding: 0 var(--f-thumb-gap);
overflow: hidden;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
perspective: 1000px;
transform: translateZ(0);
}
.f-thumbs.is-classic {
--f-thumb-opacity: 0.5;
--f-thumb-hover-opacity: 1;
--f-thumb-selected-opacity: 1;
}
.f-thumbs.is-modern {
--f-thumb-extra-gap: 20px;
--f-thumb-clip-width: 46px;
}
.f-thumbs .f-spinner {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 2px;
background-image: linear-gradient(#ebeff2, #e2e8f0);
z-index: -1;
}
.f-thumbs .f-spinner svg {
display: none;
}
.f-thumbs__viewport {
width: 100%;
height: auto;
overflow: hidden;
transform: translate3d(0, 0, 0);
backface-visibility: hidden;
}
.f-thumbs__track {
display: flex;
margin: 0 auto;
padding: 8px 0 12px 0;
}
.f-thumbs__slide {
position: relative;
flex: 0 0 auto;
box-sizing: content-box;
display: flex;
align-items: center;
justify-content: center;
padding: 0;
margin: 0;
width: var(--f-thumb-width);
min-width: var(--f-thumb-width);
height: var(--f-thumb-height);
overflow: visible;
cursor: pointer;
}
.f-thumbs__slide.is-loading img {
opacity: 0;
}
.is-classic .f-thumbs__slide {
margin: 0 var(--f-thumb-gap) 0 0;
}
.is-modern .f-thumbs__track {
width: -moz-max-content;
width: max-content;
}
.is-modern .f-thumbs__track::before {
content: "";
position: absolute;
top: 0;
bottom: 0;
left: calc(var(--left, 0) * 1px);
width: calc(100% - var(--width, 0) * 1px);
cursor: pointer;
}
.is-modern .f-thumbs__slide {
--clip-path: inset( 0 calc( (var(--f-thumb-width, 0) - var(--f-thumb-clip-width, 0)) * 0.5 * (1 - var(--progress, 0)) ) round var(--f-thumb-border-radius, 0) );
transform: translate3d(calc(var(--shift, 0) * -1px), 0, 0);
transition: none;
pointer-events: none;
}
.is-modern .f-thumbs__slide:focus-within {
filter: drop-shadow(-1px 0px 0px var(--f-thumb-outline-color)) drop-shadow(2px 0px 0px var(--f-thumb-outline-color)) drop-shadow(0px -1px 0px var(--f-thumb-outline-color)) drop-shadow(0px 2px 0px var(--f-thumb-outline-color));
}
.is-modern .f-thumbs__slide > * {
-webkit-clip-path: var(--clip-path);
clip-path: var(--clip-path);
will-change: clip-path;
}
.is-modern.is-resting .f-thumbs__slide {
transition: all 0.33s ease;
}
.is-modern.is-resting .f-thumbs__slide > * {
transition: all 0.33s ease;
}
.f-thumbs__slide__button {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
border: 0;
position: relative;
border-radius: var(--f-thumb-border-radius);
overflow: hidden;
background: rgba(0, 0, 0, 0);
outline: none;
cursor: pointer;
pointer-events: auto;
touch-action: manipulation;
transition: opacity 0.2s ease;
opacity: var(--f-thumb-opacity);
}
.f-thumbs__slide__button:hover {
opacity: var(--f-thumb-hover-opacity);
}
.f-thumbs__slide__button:focus-visible {
opacity: var(--f-thumb-selected-opacity);
}
.is-nav-selected .f-thumbs__slide__button {
opacity: var(--f-thumb-selected-opacity);
}
.is-nav-selected .f-thumbs__slide__button::after {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
height: auto;
bottom: 0;
border: var(--f-thumb-outline, 0) solid var(--f-thumb-outline-color, transparent);
border-radius: var(--f-thumb-border-radius);
animation: f-fadeIn 0.2s ease;
}
.f-thumbs__slide__img {
position: absolute;
overflow: hidden;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
padding: var(--f-thumb-offset);
box-sizing: border-box;
-o-object-fit: cover;
object-fit: cover;
}
.fancybox__thumbs {
position: relative;
opacity: var(--fancybox-opacity, 1);
transition: all 0.25s ease;
}
.fancybox__thumbs.is-modern {
--f-thumb-outline: 2px;
--f-thumb-outline-color: #ededed;
--f-thumb-opacity: 1;
--f-thumb-hover-opacity: 1;
--f-thumb-border-radius: 2px;
--f-thumb-width: 96px;
--f-thumb-clip-width: 46px;
--f-thumb-height: 72px;
--f-thumb-gap: 6px;
--f-thumb-extra-gap: 20px;
}
.fancybox__thumbs.is-classic {
--f-thumb-outline: 2px;
--f-thumb-outline-color: #ededed;
--f-thumb-opacity: 0.5;
--f-thumb-hover-opacity: 1;
--f-thumb-border-radius: 2px;
--f-thumb-width: 96px;
--f-thumb-height: 72px;
--f-thumb-gap: 8px;
}
.is-compact .fancybox__thumbs {
--f-thumb-width: 64px;
--f-thumb-clip-width: 32px;
--f-thumb-height: 48px;
--f-thumb-extra-gap: 12px;
}
.is-closing .fancybox__thumbs {
transition: none !important;
}
.fancybox__thumbs.is-hidden {
height: 0px !important;
}
.fancybox__thumbs .f-spinner {
background-image: linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05));
}
.fancybox__toolbar {
--f-progress-color: var(--fancybox-color, rgba(255, 255, 255, 0.94));
--f-button-width: 46px;
--f-button-height: 46px;
--f-button-color: var(--fancybox-color);
--f-button-hover-color: var(--fancybox-hover-color);
--f-button-bg: rgba(24, 24, 27, 0.65);
--f-button-hover-bg: rgba(70, 70, 73, 0.65);
--f-button-active-bg: rgba(90, 90, 93, 0.65);
--f-button-border-radius: 0;
--f-button-svg-width: 24px;
--f-button-svg-height: 24px;
--f-button-svg-stroke-width: 1.5;
--f-button-svg-filter: drop-shadow(1px 1px 1px rgba(24, 24, 27, 0.15));
--f-button-svg-fill: none;
--f-button-svg-disabled-opacity: 0.65;
display: flex;
flex-direction: row;
justify-content: space-between;
margin: 0;
padding: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI Adjusted", "Segoe UI", "Liberation Sans", sans-serif;
color: var(--fancybox-color, currentColor);
opacity: var(--fancybox-opacity, 1);
text-shadow: var(--fancybox-toolbar-text-shadow, 1px 1px 1px rgba(0, 0, 0, 0.5));
pointer-events: none;
z-index: 20;
}
.fancybox__toolbar :focus-visible {
z-index: 1;
}
.fancybox__toolbar.is-absolute, .is-compact .fancybox__toolbar {
position: absolute;
top: 0;
left: 0;
right: 0;
}
.is-idle .fancybox__toolbar {
pointer-events: none;
animation: 0.15s ease-out both f-fadeOut;
}
.fancybox__toolbar__column {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-content: flex-start;
}
.fancybox__toolbar__column.is-left, .fancybox__toolbar__column.is-right {
flex-grow: 1;
flex-basis: 0;
}
.fancybox__toolbar__column.is-right {
display: flex;
justify-content: flex-end;
flex-wrap: nowrap;
}
.fancybox__infobar {
padding: 0 5px;
line-height: var(--f-button-height);
text-align: center;
font-size: 17px;
font-variant-numeric: tabular-nums;
-webkit-font-smoothing: subpixel-antialiased;
cursor: default;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.fancybox__infobar span {
padding: 0 5px;
}
.fancybox__infobar:not(:first-child):not(:last-child) {
background: var(--f-button-bg);
}
[data-fancybox-toggle-slideshow] {
position: relative;
}
[data-fancybox-toggle-slideshow] .f-progress {
height: 100%;
opacity: 0.3;
}
[data-fancybox-toggle-slideshow] svg g:first-child {
display: flex;
}
[data-fancybox-toggle-slideshow] svg g:last-child {
display: none;
}
.has-slideshow [data-fancybox-toggle-slideshow] svg g:first-child {
display: none;
}
.has-slideshow [data-fancybox-toggle-slideshow] svg g:last-child {
display: flex;
}
[data-fancybox-toggle-fullscreen] svg g:first-child {
display: flex;
}
[data-fancybox-toggle-fullscreen] svg g:last-child {
display: none;
}
:-webkit-full-screen [data-fancybox-toggle-fullscreen] svg g:first-child {
display: none;
}
:fullscreen [data-fancybox-toggle-fullscreen] svg g:first-child {
display: none;
}
:-webkit-full-screen [data-fancybox-toggle-fullscreen] svg g:last-child {
display: flex;
}
:fullscreen [data-fancybox-toggle-fullscreen] svg g:last-child {
display: flex;
}
.f-progress {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 3px;
transform: scaleX(0);
transform-origin: 0;
transition-property: transform;
transition-timing-function: linear;
background: var(--f-progress-color, var(--f-carousel-theme-color, #0091ff));
z-index: 30;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
pointer-events: none;
}
/*# sourceMappingURL=site.css.map*/