@font-face { font-family: RelevantPro; src: url('../font/RelevantPro-Normal.woff2') format('woff2'), url('../font/RelevantPro-Normal.woff') format('woff'), url('../font/RelevantPro-Normal.eot') format('eot'); font-weight: 400; }
@font-face { font-family: RelevantPro; src: url('../font/RelevantPro-Bold.woff2'), url('../font/RelevantPro-Bold.woff') format('woff'), url('../font/RelevantPro-Bold.eot') format('eot'); font-weight: 700; }
/**
 * © 2020-2025 Higi Bigler (nullnulleins.ch). All rights reserved.
 */

* { margin: 0; padding: 0; }
html, body { height: 100%; }
/*          italic small-caps bold */
body { font: normal normal normal 1em/1.25 RelevantPro, Helvetica, Arial, sans-serif; margin: 0; padding: 0; -webkit-text-size-adjust: none; overflow-y: scroll; background-color: #FFF; letter-spacing: .04em; }

/* structure */
header { position: fixed; z-index: 2; background-color: #FFF; padding: 0; top: 0; left: 0; right: 0; letter-spacing: .05em; min-height: 3.3em; box-sizing: border-box; }
body.donation header { top: 2em; }
#navigation { width: 94%; max-width: 60em; margin: 0 auto; padding: 0 3%; display: flex; flex-direction: column; justify-content: space-around; min-height: inherit; text-transform: uppercase; font-weight: 700; }
#navigation ul { list-style: none; margin: 0; padding-top: .15em; }
#navigation > ul { display: flex; justify-content: space-between; flex-wrap: wrap; }
#navigation > ul > li.parent { position: relative; white-space: nowrap; }
#navigation > ul > li.parent > a { position: relative; z-index: 2; display: block; }
#navigation > ul > li.parent > a span { display: block; }
#navigation ul ul { position: absolute; display: none; top: 0; padding: 2em 0 .7em; z-index: 0; min-width: 100%; }
#navigation ul ul ul { display: none; }
#smartmenu { display: none; }
#smartcover { display: none; }
header .footer { display: none; }
header .footer a[href='#impressum'] { display: none; }

#navigation ul ul:after { content: ''; display: block; width: 300vw; background-color: #FFF; left: -100vw; position: absolute; top: 2em; bottom: 0; z-index: -1; }
body.nojs #navigation > ul > li:hover > ul, #navigation > ul > li.hover > ul { display: block; }
#navigation ul ul li { white-space: nowrap; font-size: 75%; line-height: 1.5; }
nav a { text-decoration: none; color: inherit; }
main nav { font-weight: 700; }
main nav ol { list-style: none; counter-reset: subsubnavigation; }
main nav ol li { counter-increment: subsubnavigation; display: flex; }
main nav ol li:before { content: counter(subsubnavigation) '.'; display: inline-block; flex-grow: 0; min-width: 1.5em; }
main nav a { text-decoration: underline; }
main nav a:hover { text-decoration: none; }

.fixedwidth { max-width: 60em; margin: 0 auto; padding: 0 3%; position: relative; }

.footer { text-align: center; padding: 5.5em 0 3.5em; position: relative; }
.footer > div > * { font-size: 75%; line-height: 1.5; }
.footer ul { width: auto; list-style: none; display: inline-flex; margin: 0; padding: 0 3% .75em; flex-wrap: wrap; justify-content: center; }
.footer ul li { margin: 0 .75em 0 0; white-space: nowrap; }
.footer ul li:last-child { margin: 0; }
.footer div img { width: 12.5em; height: 11.4em; }
.footer p:last-child { margin-bottom: 0; }
.footer a.active { text-decoration: none; }
#impressum { padding-top: 1em; }
body:not(.nojs) #impressum { display: none; }

#slider { height: 100vh; background-color: #EFEFEF; box-sizing: border-box; padding: 3.3em 0 0; }
#slider div div { background-size: cover; background-position: center; }
#slider div div .gvideoembed { position: relative; padding-bottom: 0 !important; height: 100% !important; background-image: none !important; background-color: transparent; }

section { /*border-top: 1px solid rgba(0,0,0,.25); min-height: 30vh;*/ position: relative; padding: 0; margin: 0; }
section article { padding: 4.5em 0 .5em; }
section.news > article { padding-bottom: 2.5em; }
section.news .eternalscroller article { position: relative; }
section:first-child { min-height: 3.3em; padding: 0; }
/**/
section a.anchor { position: absolute; top: -3.3em; }
section section a.anchor { top: -4.8em; }
section:first-child a.anchor { top: 0em; }
article.news a.anchor { margin-top: 1px; }
body.donation section a.anchor { top: -5.3em; }
body.donation section section a.anchor { top: -6.8em; }

section section article { padding: 1em 0; }

main > section { counter-reset: subsubcontent; }
section section { counter-increment: subsubcontent; }
section section h3.navigationlabel { display: flex; }
section section h3.navigationlabel:before { content: counter(subsubcontent) '.'; min-width: 1.5em; }

article.news { border-bottom: 1px solid #000; padding: 1.25em 0 .5em; }
article.news:first-child { padding-top: .25em; }
a.morelink { margin: 1em 0 0; display: inline-block; }

.collapse { overflow: hidden; position: relative; }
.collapse .handle { position: absolute; bottom: 0; left: 0; right: 0; padding-top: 2em; }
.collapse.expanded { height: unset !important; overflow: visible; }
.collapse.expanded .handle { display: none; }

article.news > div { margin: 1em 0; }
.wp-block-image { margin: 1em 0; }
a.wp-block-file__button { display: none; }

/**/
div.staffwrapper { display: flex; flex-wrap: wrap; margin: -1em 0 1em }
h2 + div.staffwrapper { margin-top: 0; }
div.staff { margin: 1.25em 0 0; display: flex; flex-direction: row-reverse; width: 100%; position: relative; }
div.staff.title { width: 100%; }
div.staff div.text { flex-grow: 1; display: flex; flex-direction: column; justify-content: center; padding-right: 1em; }
div.staff div.text *:last-child { margin-bottom: 0; }
div.staff div.image { max-width: 15em; flex-shrink: 0; width: 50%; padding-right: 1em; box-sizing: border-box; }
div.staff div.image figure { height: 0; padding-bottom: 125.4166666666667%; }
div.staff div.image img { margin: .125em 1em .25em 0; width: 100%; height: auto; }
div.staff.gloryawwwcontrolwrapper figure { background-color: rgba(255,255,255,.25); margin: .125em 0; }

/* donations */
#donation { background-color: #9BCCBE; position: fixed; top: 0; left: 0; right: 0; color: #FFF; z-index: 3; height: 2em; white-space: nowrap; }
#donation > a { text-decoration: none; display: block; height: 2em; }
#donation > a > div { padding: .375em 1.625em 0; z-index: 1; /*font-size: 81.25%;*/ }
#donation > a > div:first-child { text-align: center; position: relative; padding-left: 13em; padding-right: 13em; }
#donation > a > div:nth-child(2) { text-align: right; position: absolute; right: 0; top: 0; }
#donation a > #donationprogress { background-color: #17947E; position: absolute; z-index: 0; height: 100%; padding: 0; box-sizing: border-box; top: 0; left: 0; animation: 2s ease-out 0s 1 slideInFromLeft; }
@keyframes slideInFromLeft {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(0);
    }
}
#donationbutton { position: absolute; top: 21vh; right: 12vw; z-index: 2; width: 11em; height: 11em; border-radius: 50%; text-transform: uppercase; text-align: center; display: flex; justify-content: center; flex-direction: column; color: #007666; font-weight: bold; }
#donationbutton div { font-size: 100%; line-height: 1.15; transform: rotate(-15deg); }
#donationbutton span { display: block; font-size: 170%; }
#donationbutton svg { width: 100%; height: 100%; position: absolute; }
#donationbutton svg circle { stroke: #17947e; stroke-width: 2px; fill: transparent; }
#donationbutton svg circle.progress { stroke-width: 18px; stroke: #17947e; stroke-dasharray: 565.452px, 565.452px; stroke-dashoffset: 565.452px; transition: stroke-dashoffset 2s ease-out; transform: rotate(-105deg); transform-origin: 50% 50%; }
body.gvideoloaded #donationbutton { display: none; }

/* disruptor */
#disruptor { position: absolute; top: 21vh; right: 12vw; z-index: 2; width: min(18em,60vw); display: none; }
#disruptor > div { position: relative; }
#disruptor > div > div { position: absolute; width: 100%; }
#disruptor.rotate > div > div:first-child { z-index: 1; }
#disruptor img { width: 100%; height: 100%; object-fit: contain; object-position: center; }
#disruptor a.closebutton { font-size: 150%; text-decoration: none; background-color: white; border-radius: 50%; width: 1em; height: 1em; display: block; line-height: .85em; text-align: center; position: absolute; top: 0; left: 100%; }

a { outline: none; text-decoration: underline; color: inherit; }
/*a.phone { text-decoration: none; }*/
a:hover { text-decoration: none; }
a img { border: none; }

h2, p, ul, ol { margin: 0 0 1em 0; }
h2, h3, h4 { font-size: 100%; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
h2 + p > img, h2 + p > span.gvideoembed { margin-top: 1em; }
h3, h4 { text-transform: none; margin: 0; }
h3 span.date { font-weight: 400; font-size: 75%; line-height: 1.25; display: block; }
main ul, #ckeditorarea ul { list-style: none; }
main p + ul, #ckeditorarea p + ul { margin-top: -1em; }
main ul li, #ckeditorarea ul li { padding-left: 1.5em; position: relative; }
main ul li:before, #ckeditorarea ul li:before { content: '•'; position: absolute; left: 0; }
main ul li > p, #ckeditorarea ul li > p { margin: 0; }

blockquote { color: #999; font-weight: 700; }

/* gvideoembed */
span.gvideoembed { display: block; background-size: cover; background-position: center; position: relative; max-width: 100% !important; padding-bottom: 56.25%; height: 0 !important; overflow: hidden; transition: all .25s; cursor: pointer; background-color: #000; }
span.gvideoembed:hover { opacity: .9; }
span.gvideoembed a.gvideoembed { display: none; }
span.gvideoembed:before { opacity: .5; content: ''; display: block; border-radius: 0; width: 50px; height: 50px; background-color: #FFF; position: absolute; left: 50%; top: 50%; margin: -25px 0 0 -25px; padding: 0; transition: all .25s; }
span.gvideoembed:after { opacity: .9; content: ''; position: absolute; left: 50%; top: 50%; margin: -12px 0 0 -9px; width:0; height:0; border-top: 12px solid transparent; border-bottom: 12px solid transparent; border-left: 22px solid #000; transition: all .25s; }
span.gvideoembed:hover:before, span.gvideoembed:hover:after { opacity: .85; }
span.gvideoembed.loaded, span.gvideoembed.loaded:hover { opacity: 1; cursor: wait; }
span.gvideoembed.loaded:after, span.gvideoembed.loaded:before { display: none; }
.gvideoembed iframe, .gvideoembed object, .gvideoembed embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; }

/* image2 */
main img { display: block; max-width: 100%; height: auto; }
main img[src*="qr"] { mix-blend-mode: darken; }
figure { margin: 0; padding: 0; }
figure.gimagecaptioned { margin-bottom: 2em; }
figure.gimagecaptioned figcaption { font-size: 90%; margin-top: .5em; max-width: 100%; }
.gimagecenter { text-align: center; }
.gimagecenter figcaption, .gimagecenter img { margin-left: auto; margin-right: auto; text-align: left; }
.gimageleft { float: left; margin: .2em 1em 1em 0; max-width: 50%; }
.gimageright { float: right; margin: .2em 0 1em 1em; max-width: 50%; }
img.gimageleft, img.gimageright, .gimageleft img, .gimageright img { height: auto; }
.gimageleft img, .gimageright img { width: 100%; }

/* gallery */
.galleryembedder { max-width: 30em; position: relative; margin: 1.35em 0 1.125em; display: block; }
.galleryembedder span.caption { position: absolute; top: 0; bottom: 0; left: 0; right: 0; display: flex; justify-content: space-around; flex-direction: column; text-align: center; color: #FFF; }
.galleryembedder span.caption span span { display: block; }
.galleryembedder img { mix-blend-mode: multiply; /*transition: opacity .3s;*/ }
/*.galleryembedder a:hover img { opacity: .9; }*/
.pswp__ui--fit .pswp__top-bar, .pswp__ui--fit .pswp__caption, .pswp__caption, .pswp__top-bar { background-color: transparent; }
.pswp__button--arrow--left:before, .pswp__button--arrow--right:before { background-color: transparent; }
.pswp__caption__center { text-align: center; max-width: 100%; margin: 0 auto; font-size: 100%; padding: 1em; line-height: inherit; color: #FFF; }
.pswp__caption p { margin: 0; }
.pswp__caption span { display: block; margin: 0 auto; max-width: 60em; }
.pswp__caption span.copyright { display: block; font-weight: 400; font-size: 75%; margin: .5em auto 0 auto; text-align: left; max-width: 100%; }
.pswp--zoomed-in .pswp__caption { opacity: 0; }

/* form */
form label > span:first-child { display: none; }
main form ul { display: flex; flex-wrap: wrap; margin: 0 -.5em; }
main form ul li { width: 50%; box-sizing: border-box; padding: 0 .5em; margin: .5em 0 0; }
main form ul li:before { display: none; }
main form ul li.hidden { display: none; }
main form ul li.checkbox { margin: 1.5em 0 1.25em; }
main form ul li.checkbox label { display: block; overflow: hidden; margin: .25em 0 0; position: relative; }
main form ul li.checkbox label > span { padding: .5em .75em .5em 2.5em; display: block; }
main form ul li.company, main form ul li.message, main form ul li.note, main form ul li.options, main form ul li.submit { width: 100%; }
main form ul li.note span { padding-left: .75em; }
main form ul li.company { padding-right: 1.5em; }
main form ul li.company input { width: 50%; }
main form ul li.zip { width: 15%; }
main form ul li.city { width: 35%; }
form ul li.dingsbums { position: absolute; left: -100vw; }
main form input, main form select, main form textarea { background-color: rgba(255,255,255,.75); width: 100%; }
main form button, main form input[type="submit"] { background-color: rgba(0,0,0,.35); color: #FFF; width: auto; }
main form input, main form select, main form textarea, main form button { font-family: inherit; font-size: inherit; line-height: inherit; box-sizing: border-box; border: none; padding: .35em .75em; border-radius: 0; }
main form input[type="text"],
main form input[type="email"],
main form input[type="tel"],
main form input[type="number"],
main form input[type="search"],
main form input[type="password"],
main form input[type="submit"],
main form button, main form textarea, main form select, main form option { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; outline: 0; box-shadow: none; -webkit-border-radius: 0; border-radius: 0; }
main form input[disabled], main form button[disabled], main form textarea[disabled], main form li.checkbox input[type=checkbox][disabled] + span:after { opacity: .7; }

main form#login { max-width: 30em; }
main form#login ul li { width: 100%; }
main form .formfoot { margin: .5em 0 0; }

p + p.logoutlink { margin-top: -1em; }

main form li.checkbox div.label > span { display: none; }
main form li.checkbox input[type=checkbox] { width: auto; position: absolute; left: -2em; }
main form li.checkbox input[type=checkbox] + span:after { display: block; content: ''; width: 2em; height: 2em; position: absolute; left: 0; top: 0; background-color: rgba(255,255,255,.75); z-index: 1; }
main form li.checkbox input[type=checkbox]:checked + span:before { display: block; content: '×'; position: absolute; left: 0; top: 0; z-index: 2; color: #000; font-size: 150%; text-align: center; width: 1.3333em; line-height: 1.225; }

main form ul li.error input, main form ul li.error textarea, main form ul li.error input[type=checkbox] + span:after { box-shadow: inset 0 0 0 2px #EA572F; }

::-webkit-input-placeholder { color: #000; opacity: 1; }
::-moz-placeholder { color: #000; opacity: 1; }
:-ms-input-placeholder { color: #000; opacity: 1; }
:-moz-placeholder { color: #000; opacity: 1; }
::placeholder { color: #000; opacity: 1; }

form div.message { padding: .35em .75em; margin: .5em 0 0; background-color: rgba(0,0,0,.25); color: #FFF; font-weight: 700; }
form div.message p { margin: 0; }
form div.message.error { background-color: #EA572F; }

/* payrexx */
a[href*="https://cutohof.payrexx.com/de/pay?cid=7004ac71"] { background-color: rgba(0,0,0,.35); display: inline-block; padding: .35em .75em; color: #FFF; text-decoration: none; margin: 0 .5em 0 0; }
a[href*="https://cutohof.payrexx.com/de/pay?cid=7004ac71"]:hover { opacity: .75; }

/**/
.clearfix:before, .clearfix:after { content: ' '; display: table; }
.clearfix:after { clear: both; }
.noselect { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
span.nowrap { white-space: nowrap; }
span.hyphenate { -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }
sup, sub { vertical-align: text-top; font-size: 75%; }
sub { vertical-align: text-bottom; }

/* content to be read by screen-reader but not visible */
.invisible { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* mdi */
span.mdi.mdi-gsize-xs { font-size: 50%; }
span.mdi.mdi-gsize-s { font-size: 75%; }
span.mdi.mdi-gsize-l { font-size: 135%; line-height: 1.2; }
span.mdi.mdi-gsize-xl { font-size: 170%; }
span.mdi > span { display: none; }

/* twocolumns */
@media only screen and (min-width: 630px) {
	.twocolumns { display: flex; width: 100%; flex-direction: row; }
	.twocolumns:not(:first-child) { margin-top: -1.25em; }
	.twocolumns:not(:last-child) { margin-bottom: -1.25em; }
	.twocolumns > div { flex-grow: 1; width: 50%; }
	.twocolumns > div.twocolumns-left { padding-right: .675em; }
	.twocolumns > div.twocolumns-right { padding-left: .675em; }
}

@media only screen and (min-width: 1240px) {
	body { font-size: 1.075em; }
}
@media only screen and (min-width: 1600px) {
	body { font-size: 1.125em; }
}
@media only screen and (min-width: 1800px) {
	body { font-size: 1.25em; }
}

@media only screen and (max-width: 1100px) {
	body { font-size: 1.125em; }
	header { transform: translateX(100%); transition: transform .3s; position: fixed; top: 0; bottom: 0; left: auto !important; right: 0; justify-content: space-between; overflow-y: auto; display: flex; flex-direction: column; width: 91%; max-width: 20em; }
	body.donation header { top: 2em; }
	#navigation { display: flex; max-width: unset; flex-grow: .5; padding: 6vh 0 4vh; flex-shrink: 0; }
	#navigation ul { flex-direction: column; text-align: center; font-size: 125% /*6vw*/; width: 100%; flex-grow: 0; }
	#navigation ul li:hover ul, #navigation ul li.hover ul { display: none; }
	#smartcover { background-color: transparent; z-index: 1; position: fixed; top: 0; left: 0; right: 0; bottom: 0; }
	#smartmenu { position: fixed; right: 0; top: 0; cursor: pointer; text-decoration: none; z-index: 11; display: block; padding: 4% 3%; /* mix-blend-mode: difference;*/ }
	body.donation #smartmenu { top: 2em; }
	#smartbutton { display: inline-block; width: 32px; height: 13px; vertical-align: middle; border-top: 3px solid #FFF; border-bottom: 3px solid #FFF; position: relative; transition: .15s ease-out all; }
	#smartbutton:before, #smartbutton:after { content: ''; width: 32px; height: 3px; background-color: #FFF; position: absolute; top: 5px; left: 7px; margin-left: -7px; transition: .15s linear all; transform-origin: 50% 50%; }
	body.smartnavigation { overflow: hidden; }
	body.smartnavigation #smartbutton { border-color: transparent; }
	body.smartnavigation #smartbutton:after { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
	body.smartnavigation #smartbutton:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); }
	body.smartnavigation #smartbutton:before, body.smartnavigation #smartbutton:after { width: 36px; margin-left: -9px; background-color: #000; }
	body.smartnavigation header { transform: translateX(0vw); }
	body.smartnavigation #smartcover { display: block; }
	header .footer { display: block; padding: 1em 0; text-transform: none; }
	.footer div img { width: 10em; height: 9.1333em; }
	section a.anchor { top: 0; }
	body.donation section a.anchor { top: -2em; }
	section section a.anchor { top: -1.5em; }
	body.donation section section a.anchor { top: -3.5em; }
	/**/
	#slider { padding: 0; }
	body.donation #slider { padding: 2em 0 0; }
}
@media only screen and (max-width: 766px) {
	#donation > a > div:first-child { padding-left: 1em; padding-right: 1em; }
	#donation > a > div:nth-child(2) { display: none; }
	#donationbutton { font-size: 70%; }
}
@media only screen and (max-width: 640px) {
	main form ul li.company { padding-right: .5em; }
	main form ul li.company input { width: 100%; }
	main form ul li.address { width: 100%; }
	main form ul li.zip { width: 25%; }
	main form ul li.city { width: 75%; }
}

@media only screen and (max-width: 1000px) {
	div.staffwrapper { display: block;  margin: 0 0 1em }
	div.staff { width: unset; }
	div.staff div.image { width: 33.3333%; }
}