@charset "UTF-8";
/* CSS Document */
@import 'fonts.css';

/* reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,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,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td { border:0; font-size:100%; margin:0; padding:0; }
a { outline:none; }
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; }
del,ins { text-decoration:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym { border:0; font-variant:normal; }
sup,sub { vertical-align:baseline; }
legend { color:#000; }
input,button,textarea,select,optgroup,option { font-family:inherit; font-size:inherit; font-style:inherit; font-weight:inherit; }
input,button,textarea,select { font-size:100%; }
blockquote {margin: 0;}

/* Clearfix */
.clearfix:before, .clearfix:after {content: " "; display: table;}
.clearfix:after {clear: both;}

*, *:before, *:after {padding: 0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;}
figure, figure:before, figure:after {padding: 0; margin: 0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;}


html {
-webkit-text-size-adjust: 100%;

--black: rgba(0,0,0,1);
--white: rgba(255,255,255,1);
--dark-grey: rgba(81,81,80,1);
--light-grey: rgba(227,227,226,1);
--color-1: rgba(43,49,24,1); /* ganz dunkel */
--color-2: rgba(159,163,146,1); /* bissl heller */
--color-3: rgba(229,232,221,1); /* hell */
--color-4: rgba(218,217,206,1); /* footer */
--overlay: rgba(0,0,0,0.2);
}

body {margin:0; color: var(--color-1); font-family: 'Golos Text', sans-serif; line-height: 1.5; font-weight: 400; font-variant-numeric: lining-nums;}
body.fixed {height: 100%; overflow: hidden;}

/***************************** FORMAT *****************************/
h1, h2, .splide-basic .extra, .h1 {font-size: 1.75em;}
h3, h4, .extra, h2.small {font-size: 1.25em;}
h5, h6, .hl-small h2, .hl-small h3, h3.small {font-size: 1.125em;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color: inherit; border: 0 !important; text-decoration: none;}

h1, h2, h3, h4, h5, h6 {font-weight: 300;}

h1, h2, h3, h4, .extra, .col-head, .entry-nav {line-height: 1.25;}
h1, h2, h3, h4, h5, h6, .extra {text-wrap: balance;}
/*blockquote {line-height: 1.375;}*/

.serif {font-family: 'Rufina', serif; font-variant-numeric: lining-nums;}
.sans {font-family: 'Golos Text', sans-serif;}

p + p, ul + p, ol + p, ul + ul, ol + ol,
blockquote + p, blockquote + ul, blockquote + ol,
p + h1, p + h2, p + h3, p + h4, p + h5, p + h6,
ul + h1, ul + h2, ul + h3, ul + h4, ul + h5, ul + h6,
ol + h1, ol + h2, ol + h3, ol + h4, ol + h5, ol + h6 {margin-top: 0.75em;}

h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p,
h1 + ul, h2 + ul, h3 + ul, h4 + ul, h5 + ul, h6 + ul,
h1 + ol, h2 + ol, h3 + ol, h4 + ol, h5 + ol, h6 + ol {margin-top: 0.375em;}

hr + *, * + hr, figure + blockquote, blockquote + figure {margin-top: 1em;}

p + ul, p + ol, .col-text p + p {margin-top: 0.25em;}

h1 + blockquote, h2 + blockquote, h3 + blockquote, h4 + blockquote, h5 + blockquote, h6 + blockquote, .splide-basic .extra + .big {margin-top: 0.5em;}
blockquote + h1, blockquote + h2, blockquote + h3, blockquote + h4, blockquote + h5, blockquote + h6,
p + blockquote, ul + blockquote, ol + blockquote,
.hl-small p + h2, .hl-small p + h3, .hl-small ul + h2, .hl-small ul + h3, .hl-small ol + h2, .hl-small ol + h3 {margin-top: 1.5em;}

blockquote > *, .big {font-size: 1.125em;}
.small {font-size: 0.875em;}
h1 .small {font-size: 0.75em;}

b, strong, .bold, .hl-small h2, .hl-small h3 {/*font-variant: normal;*/ font-weight: 600;}
blockquote em, .italic {font-weight: 300; font-style: italic;}

sub, sup, .sub, .sup {font-size: 0.75em;}
sub, .sub {vertical-align: sub;}
sup, .sup {vertical-align: top;}

.uc, .uppercase {text-transform: uppercase;}
.index {font-size: 2em;}

.white, .white *, .white a.phone, .white a.phone:hover {color: var(--white);}
.dark, .dark * {color: var(--color-1);}

ul {list-style-type: none;}
ul li {padding: 0 0 0.25rem 0.75rem; position: relative;}
ul li:before {content: '\00b7'; position: absolute; left: 0;} /*'\003e'*/
ul li:last-of-type, ol li:last-of-type {padding-bottom: 0;}

ol {list-style: none; counter-reset: list-count;}
ol li {padding: 0 0 0.25rem 1.375rem; position: relative; counter-increment: list-count;}
ol li:before {content: counter(list-count) '.'; position: absolute; left: 0; vertical-align: bottom;}

footer {font-style: inherit;}
footer li, .no-bull li {padding: 0;}
footer li:before, .no-bull li:before {content: '';}

.nobreak p {overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}

/***************************** LINKS/SPANS *****************************/
a, span, button {text-decoration: none; color: inherit;
transition: color .3s, background-color .3s, background-size .3s, border .3s, opacity .3s;}
a:hover {color: var(--color-2);}

a:focus-visible, button:focus-visible {outline-style: auto;}

.skip-link {display: block; padding: 0.5rem 1rem; background: var(--white); position: absolute; top: 0; left: 50%; transform: translate(-50%,-100%); transition: all .3s;}
.skip-link:focus {transform: translate(-50%,0); top: 0.5rem; z-index: 1;}

.white a:hover, a.white:hover {color: var(--color-2);}
.bg-color-2.white a:hover, .bg-color-2 a.white:hover {color: var(--color-3);}

a.phone, a.phone:hover {color: var(--color-1); cursor: text;}

button {-webkit-appearance: none; -moz-appearance: none; appearance: none; background: none; border: none; border-radius: none;}
button:hover {cursor: pointer;}

.white .ul, .white .ul-rev {background-image: linear-gradient(0deg, var(--white), var(--white));}
.ul, .dark .ul {background: linear-gradient(0deg, var(--color-1), var(--color-1)) no-repeat left bottom / 100% 0.0625rem;}
.ul-rev, .dark .ul-rev {background: linear-gradient(0deg, var(--color-1), var(--color-1)) no-repeat right bottom / 0 0.0625rem;}

.ul:hover, .ul:focus-visible, a:hover .ul {background-size: 0 0.0625rem; background-position-x: right;}
.ul-rev:hover, .ul-rev:focus-visible {background-size: 100% 0.0625rem; background-position-x: left;}

.bl {display: block;}

a svg {transition: fill .3s;}

.gal-open {width: 2rem; height: 2rem; position: absolute; bottom: 0.5rem; left: 0.5rem; background: var(--dark-grey) url(../images/layout/arrow-double.svg) center center/ 50% auto no-repeat; opacity: 0.3;}
.gal-open:hover, .gal-open:active {opacity: 1; background-size: 60% auto;}

.sr-only:not(:focus):not(:active) {clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px;}

.btn {display: inline-block; padding: 0.5rem 1rem; background: var(--color-1); border: 0.0625rem solid var(--color-1); color: var(--color-3);}
.btn:hover {color: var(--color-1); background: none;}
.side-content .btn {display: block;}

/***************************** LAYOUT *****************************/
/* BASIC */
.wrapper {height: auto; margin: 0 auto; max-width: 32rem; position: relative; padding: 0 0.5rem;}
main {display: block; transition: background .5s;}
.block * :not(a, span, button, .ul, .side-panel, .side-panel:after), .block .side-panel:not(.panel-wrap, .panel-cont) {transition: color .5s;}
.no-head {padding-top: 3.875rem;}

img, svg {width: 100%; display: block;}
.stretch-w img {width: 100%; height: auto;}
.stretch-h img, .f-height, .f-height img {width: auto; height: 100%;}

@supports (object-fit: cover){
.stretch-w img, .stretch-h img {width: 100%; height: 100%; object-fit: cover;}
}

.video {padding-bottom: 56.25%; position: relative;}
.video iframe, .video video, .img-wrap .bl {width: 100%; height: 100%; position: absolute; top: 0; left: 0;}

.video + *, * + .video, .text-img + *, * + .text-img, .map-wrap + *, * + .map-wrap {margin-top: 1em;}

.bg-color-white {background: var(--white);}
.bg-color-dark {background: var(--dark-grey);}
.bg-color-1 {background: var(--color-1);}
.bg-color-2 {background: var(--color-2);}
.bg-color-3 {background: var(--color-3);}
.bg-color-4 {background: var(--color-4);}

.t-color-1 {color: var(--color-1);}

.no-mob {display: none;}

.fill-w {fill: var(--white);}

/* HEADER */
#mh {position: absolute; width: 100%; z-index: 2; padding: 4.5rem 0 0 0; top: -4.5rem; transition: top .3s -1s;}
#mh.scroll {position: fixed; top: 0; padding-top: 0; transition: top .3s .2s; background: rgba(229,232,221,0.85);}

.mh-inner {padding: 0.875rem 1rem 0.5rem 1rem; border-bottom: 0.125rem solid var(--white); flex-wrap: nowrap; justify-content: space-between; align-items: center;}
#mh.scroll .mh-inner {padding: 0.5rem 1rem 0.25rem 1rem;}
#mh.scroll .mh-inner, #mh.mh-dark .mh-inner {border-bottom-color: var(--dark-grey);}

.logo-wrap {height: 1.375rem; width: auto; transition: height .3s; position: relative;}
#mh.scroll .logo-wrap {height: 1rem;}
.logo-wrap a, .logo {display: block; width: 100%; height: 100%;}
.mh-icon svg {height: 100%; width: auto; fill: var(--white); transition: fill .3s;}
#mh.scroll .mh-icon svg, #mh.mh-dark .mh-icon svg {fill: var(--dark-grey);}

#mh .mh-col {width: auto;}

.trigger {flex-wrap: nowrap; align-items: center;}
.pull-btn + .pull-btn {margin-left: 1rem;}

/* NAVI */
#mh ul {list-style-type: none;}
nav ul li {line-height: 1;}
#mh ul li:before {content: '';}

.nav-panel {display: none; width: 100%; height: 100%; position: fixed; right: 0; top: 0; z-index: 3; -ms-transform: translateY(-100%); -webkit-transform: translateY(-100%); transform: translateY(-100%); transition: transform .3s, opacity .5s; -webkit-overflow-scrolling: touch; opacity: 0; text-align: center; background: rgba(0,0,0,0.8); overflow: auto;}
.nav-panel.open {-ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); opacity: 1;}

.nav-panel .menu {width: 100%; min-height: 100%; position: relative; z-index: 2; /*height: 100%;*/ /*max-width: 50rem;*/ padding: 4.5rem 2rem; margin: 0 auto; justify-content: center; flex-wrap: nowrap;}

#mn li {padding: 0;}
#mn a {display: block;}

#mn a.active {color: var(--color-2);}

.tl + .tl {margin-top: 1em;}

.tl-item {font-size: 1.5em; padding: 1rem 0;}
.sl {font-size: 1.125em;}
.sl-item {padding: 0.5rem 0;}


/* nav pull */
.burger:before {top: 50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);}
#pull {width: 2.5rem; height: 2.5rem; padding: 0.625rem 0 0.625rem 0.75rem; position: relative; z-index: 12;}

.burger-wrap {position: relative; width: 100%; height: 100%;}

.burger, .burger:before, .burger:after {width: 100%; height: 0.125rem; display: block;
-webkit-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s;}
.burger:before, .burger:after {position: absolute; content: '';}
.burger:after {bottom: 0; top: auto;}
.burger, .burger:before, .burger:after, #mh.mh-dark .open .burger:before, #mh.mh-dark .open .burger:after, #mh.scroll .open .burger:before, #mh.scroll .open .burger:after {background: var(--white);}

#mh.scroll .burger, #mh.scroll .burger:before, #mh.scroll .burger:after,
#mh.mh-dark .burger, #mh.mh-dark .burger:before, #mh.mh-dark .burger:after, .close-side .burger:before, .close-side .burger:after {background: var(--dark-grey);}

.open .burger, #mh.scroll .open .burger, #mh.mh-dark .open .burger, #pull.open:hover .burger {background: none;}
.open .burger:before {top: 50%;
-webkit-transform: translateY(-50%) rotate(45deg); -ms-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg);}
.open .burger:after {top: 50%; bottom: auto;
-webkit-transform: translateY(-50%) rotate(-45deg); -ms-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg);}

#pull:hover .burger, #pull:hover .burger:before, #pull:hover .burger:after {background: var(--color-2);}

/* contact panel */
.mh-contact li {font-size: 1.125em; padding: 0 0 0.25rem 0;}
.mh-contact svg {fill: var(--white);}

.mh-contact .extra {font-size: 1.5em;}

.mh-contact ul + ul, .mh-contact p + ul {margin-top: 1em;}

.mh-contact .social {justify-content: center;}

/* contact pull */
#c-pull {height: 2rem; padding: 0.25rem; position: relative; z-index: 12;}
#c-pull:hover svg {fill: var(--color-2) !important;}

/* IMAGES/SLIDER */
.headimg, .img-block, .img-wrap {position: relative;}
.img-wrap {width: 100%;}

.slide {position: relative; background: var(--black);}
.slide .img-wrap, .headimg .img-wrap {position: static;}
.headimg .img-wrap/*, .img-high .img-wrap*/ {padding-bottom: 75%;}
.img-slim .img-wrap {padding-bottom: 33.33%;}
.img-low .img-wrap {padding-bottom: 56.25%;}
.img-mid .img-wrap {padding-bottom: 66.66%;}
.img-square .img-wrap {padding-bottom: 80%;}
.img-high .img-wrap {padding-bottom: 125%;}

.img-wrap img {position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}
.darkend img {opacity: 0.75;}

@supports (aspect-ratio: 1/1) {
.img-wrap {padding-bottom: 0 !important;}
.img-wrap img {position: relative; top: auto; left: auto; -ms-transform: translate(0,0); -webkit-transform: translate(0,0); transform: translate(0,0);}
.splide-basic .img-wrap {height: 100%;}

.headimg .img-wrap /*, .img-high .img-wrap*/ {aspect-ratio: 4/3;}
.img-slim .img-wrap {aspect-ratio: 3/1;}
.img-low .img-wrap {aspect-ratio: 16/9;}
.img-mid .img-wrap {aspect-ratio: 3/2;}
.img-square .img-wrap {aspect-ratio: 5/4;}
.img-high .img-wrap {aspect-ratio: 4/5;}
}

.splide figcaption, .headimg .maintitle {position: absolute; top: 0; left: 0; width: 80%; padding: 1rem;}
.headimg figcaption, .headimg .maintitle {top: 5rem;}
.splide-teaser figcaption {top: auto; bottom: 0;}

.splide-basic {background: var(--black);}
.splide-basic .slide, .mainimg {width: 100%; max-height: 80vh; overflow: hidden;}

.splide-basic .splide__arrow {border-color: var(--white); top: auto; transform: translateY(0); bottom: 2rem;}
.splide-teaser .splide__arrow {border-color: var(--white);}
.splide-basic .splide__arrow svg, .splide-teaser .splide__arrow svg {fill: var(--white);}

.splide-gallery {padding-bottom: 3rem;}
.splide-gallery .splide__arrow {top: auto; -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); bottom: 0;}
.splide-gallery .splide__arrow--next {right: auto; left: 4rem;}


.img-copy {position: absolute; padding: 0.5rem 1rem; left: 0; bottom: 0;}
.intro-img .img-copy {left: 0.5rem; bottom: 0.5rem;}

/* CONTENT */
.content, .block, .col, .single-head {width: 100%;}
.block {padding: 1rem 0;}
.block + .block-extra, .side-panel .block {padding-top: 0;} /* 14.11.2024 - .side-gal .block:first-of-type */

.cols, .rows {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-flow: row wrap; -ms-flex-wrap: wrap;}
.col, .row {-webkit-box-flex: initial; -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: initial; position: relative; float: left;}
.rows {flex-direction: column;}
.row {float: none;}

.mob-cols .col {width: auto;}

.pad-s {padding: 0.5rem;}
.pad-wrap {padding: 0.5rem 0;}
.pad-top {padding-top: 1.5rem;}
.pad-bottom {padding-bottom: 1.5rem;}

.col-img + .col-text, .gal-cap {padding-top: 0.375rem;}
.col-head + * {margin-top: 0.75rem;}

#newsbox {margin-top: -5rem;}
#newsbox .pad-wrap {padding: 1rem;}

.job-title {padding-bottom: 1.5rem;}

/* single page */
.single-head {padding-bottom: 1rem;}
.text-s + .text-l, .text-l + .text-s, .side-content + .side-content, .single-page .entry + .entry {margin-top: 1rem;}

.side-inner .single-page {padding: 0 1rem;}

/* map */
.map-wrap {width: 100%; height: 0; padding-bottom: 90%; position: relative; overflow: hidden;}
.map {width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 0;}
.popup-cont {display: none;}


/* gallery */
.side-panel {position: absolute; right: 0; top: 0; z-index: 3; display: none;}
.panel-wrap, .panel-cont {width: 100%; height: 100%; -ms-transform: translateX(100%); -webkit-transform: translateX(100%); transform: translateX(100%);}
.panel-wrap, .block .panel-wrap {position: fixed; right: 0; top: 0; z-index: 3; transition: transform .3s .3s !important;}
.side-panel.open .panel-wrap, .side-panel.open .panel-cont {-ms-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0);}
.panel-cont {position: absolute; right: 0; z-index: 3; padding: 5rem 0 2.25rem 0; background: rgba(255,255,255,1); transition: transform .3s; overflow: auto; -webkit-overflow-scrolling: touch;}
.side-panel.open .panel-wrap, .block .side-panel.open .panel-wrap {transition: none !important;}
.side-panel:after {display: block; content: ''; position: fixed; width: 0; height: 0; top: 0; left: 0; background: var(--overlay); opacity: 0; pointer-events: none; transition: opacity .3s;}
.side-panel.open:after {width: 100%; height: 100%; opacity: 1;}


.with-nav .side-inner {padding-bottom: 0;}
.side-panel .close-small {display: block; width: 2rem; height: 2rem; margin: 0 auto;}

.close-btn {width: 2.5rem; height: 2.5rem; position: absolute; z-index: 1; top: 1rem; right: 1rem; padding: 0.25rem 0 0.5rem 0.75rem;}

/* loader */
.loader-wrap {width: 100%; height: 100%; /*max-height: 101vh;*/ position: absolute; top: 0; left: 0; background: rgba(255,255,255,1); z-index: 100; }
.loader {width: 25%; height: 0; padding-bottom: 25%; position: absolute; top: 50vh; left: 50%; transform: translate(-50%,-50%);}

.spinner-bg, .spinner, .loader-icon {width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
/*.spinner-bg {background: var(--dark-grey);}*/
.spinner-bg:after {display: block; content: ''; width: 95%; height: 95%; position: absolute; z-index: 1; top: 2.5%; left: 2.5%; background: rgba(255,255,255,1);}

.spinner:before {display: block; content: ''; width: 25%; height: 25%; position: absolute; background: var(--dark-grey);}
.spinner {-ms-animation: move 2s infinite linear; -webkitanimation: move 2s infinite linear; animation: move 2s infinite linear;}

.loader-icon {/*background: url(../images/layout/logo-icon.svg) center center/ 50% auto no-repeat;*/ z-index: 1;
-ms-animation: pulse 1s infinite; -webkit-animation: pulse 1s infinite; animation: pulse 1s infinite;}

/* small close */
.close-small .close {width: 2rem; height: 2rem; position: relative; border-radius: 50%; margin: 0 auto; transition: border .3s, background .3s; border: 0.125rem solid var(--dark-grey);}
.close-small .cross {-ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);}

.cross:before, .cross:after {display: block; content: ''; width: 0.125rem; height: 66.66%; position: absolute; top: 50%; left: 50%; background: var(--dark-grey); transition: all .3s;}
.cross:before {-ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}
.cross:after {-ms-transform: translate(-50%,-50%) rotate(90deg); -webkit-transform: translate(-50%,-50%) rotate(90deg); transform: translate(-50%,-50%) rotate(90deg);}

.close-small:hover .close {border-color: rgba(127,127,127,1);}
.close-small:hover .cross:before, .close-small:hover .cross:after {background: rgba(127,127,127,1);}

/* FOOTER */
#mf {background: var(--color-4);}
/*.mf-inner {padding: 1rem;}*/
#mf .col + .col {margin-top: 1rem;}

#mf .icon, #mh .icon {width: 2rem;}
.social .col {width: auto !important;}
.social .col + .col {margin-top: 0 !important; margin-left: 1rem;}

#mf svg {fill: var(--color-1);}
#mf a:hover svg, .social a:hover svg {fill: var(--color-2);}

#mf ul + ul {margin-top: 0;}
#mf ul + .social {margin-top: 0.75em;}

/* back top*/
.arrow:before, .arrow:after {width: 0.125rem; height: 1rem; content: ''; position: absolute; display: block; background: rgba(255,255,255,1); top: 0;}

.arrow:before {transform: rotate(45deg); -webkit-transform: rotate(45deg); left: 0.625rem;}
.arrow:after {transform: rotate(-45deg); -webkit-transform: rotate(-45deg); right: 0.625rem;}

#back-top {width: 2.5rem; height: 2.5rem; position: fixed; right: 1rem; bottom: 1rem; display: none; z-index: 100;}
#back-top button, #back-top button:active {width: 2.5rem; height: 2.5rem; display: block; padding: 0.625rem 0.25rem; background: rgba(0,0,0,0.3); border-radius: 50%; -webkit-border-radius: 50%; transition: background 0.3s; -webkit-transition: background 0.3s;}
#back-top button:hover {background: var(--dark-grey);}
#back-top .arrow {width: 2rem; height: 1.25rem; position: relative;}

#back-top button:hover .arrow {animation: pulse 0.5s 1;}

/* pagination / entry nav */
.pagination {width: 100%; padding-top: 1rem;}

.pagination ul {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-flow: row nowrap; -ms-flex-wrap: nowrap; line-height: 1;}
.pagination ul li {-webkit-box-flex: initial; -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: initial; position: relative; float: left; padding: 0;}
.pagination ul li + li {margin-left: 0.125rem;}

.pagination a, .pagination span {min-width: 2.125rem; text-align: center; display: block; height: 100%; padding: 0.25rem 0.5rem;}
.pagination a {/*background: var(--dark-grey);*/}
.pagination span {/*background: var(--dark-grey);*/ opacity: 0.5;}
.pagination a:hover, .pagination a.active {/*background: var(--color-1);*/ color: var(--color-2);}

.entry-nav {border-top: 0.125rem solid var(--color-1);}
.white .entry-nav {border-top-color: var(--white);}

.nav-arr {display: none;}
.art-nav-text {display: block; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.side-panel .entry-nav-top {display: none;}
.side-panel .entry-nav {margin-bottom: 2rem;}

/* responsiveness
--------------------------------------------- */

/* medium */
@media screen and (min-width:24em) {
/* CONTENT */
.col-xs-s, .col-xs-m {width: 50%; max-width: 50%;}
}

/* medium */
@media screen and (min-width:48em) {
/***************************** FORMAT *****************************/
h1, h2, .splide-basic .extra, .h1 {font-size: 1.875em;}
h3, h4, .extra {font-size: 1.375em;}

.maintitle h1, .index {font-size: 2.25em;}
.form-head {font-size: 1.25em;}

.center-text {text-align: center;}
.right-al {text-align: right;}

/***************************** LAYOUT *****************************/
/* BASIC */
.no-head {padding-top: 5.375rem;}
.wrapper {max-width: 44rem; padding: 0;}

.no-mob {display: block;}

.intro .text-img + *, .intro * + .text-img {margin-top: 1.5em;}

/* HEADER */
.mh-inner {padding: 1.125rem 2rem 0.75rem 2rem;}
#mh.scroll .mh-inner {padding: 0.5rem 2rem 0.25rem 2rem;}

/* NAVI */
/*#mn ul {width: 50%;}*/
.tl-item, .mh-contact .extra {font-size: 2em;}
.sl, .mh-contact li {font-size: 1.375em;}

/* IMAGES/SLIDER */
.headimg .img-wrap {padding-bottom: 66.66%;}

@supports (aspect-ratio: 1/1) {
.headimg .img-wrap {aspect-ratio: 3/2;}
}

.splide-basic figcaption, .headimg .maintitle {width: 66.66%; padding: 3rem 2rem;}

.splide__arrow {width: 3rem; height: 3rem; border-color: var(--white);}
.splide__arrow--prev {left:2rem;}
.splide__arrow--next {right:2rem;}

.splide__arrow svg {fill: var(--white);}

.text-slide {width: 50%;}
.text-slide .text, .splide-gallery figcaption, .splide-teaser figcaption {padding: 1rem 2rem;}
.mob-intro, .hidden {display: none;}
.visible {display: flex;}

.splide-gallery {padding-bottom: 0;}
.splide-gallery .splide__arrow {top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); bottom: auto;}
.splide-gallery .splide__arrow--next {right: 2rem; left: auto;}

/* CONTENT */
.block {padding: 1.5rem 0;}

.cols-rev {flex-direction: row-reverse; justify-content: flex-end;}
.cols-rev .col {float: right;}

.v-center {align-items: center;}

.col-l {width: 66.66%; max-width: 66.66%;}
.col-m, .col-m-s {width: 50%; max-width: 50%;}
.col-s, .col-xs-s {width: 33.33%; max-width: 33.33%;}

.col-center {width: 85%; margin: 0 auto;}

.pad-s {padding: 0.5rem;}
.pad-wrap {padding: 0.5rem 1.5rem;} /*.mh-inner side-padding minus pad-s*/

.tile, .tile .rows {height: 100%;}

.job-title {padding-bottom: 2.5rem;}
.job-link {margin-top: auto;}

/* single page */
.single-head {padding-bottom: 1.25rem;}
.text-s + .text-l, .text-l + .text-s {margin-top: 1.25rem;}

.single-page .entry + .entry {margin-top: 1.5rem;}

/* map */
.map-wrap {padding-bottom: 56.25%;}

/* gallery */
.close-btn {top: 2rem; right: 2rem;}

/* loader */
.loader {width: 12.5%; padding-bottom: 12.5%;}

/* FOOTER */
.mf-inner {padding: 1rem 0;}
#mf .cols {flex-wrap: nowrap; justify-content: space-between;}
#mf .col {width: 33.33%/*auto*/;}
#mf .col + .col {margin-top: 0;}

.social {justify-content: center !important;}

/* pagination / entry nav */
.nav-arr {display: flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border-radius: 50%; border: 0.0625rem solid var(--color-1); position: absolute; top: 50%; transition: opacity .3s, border .3s;
-ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);}
.nav-arr svg {width: 70%; height: 70%; fill: var(--color-1);}
.white .nav-arr svg {fill: var(--white);}
.white .nav-arr {border-color: var(--white);}

a:hover .nav-arr {opacity: .7;}

.art-nav a {display: block; position: relative;}
.prev-art a {padding-left: 3rem;}
.prev-art .nav-arr {left: 0;}
.prev-art svg {transform: rotate(180deg);}
.next-art a {padding-right: 3rem;}
.next-art .nav-arr {right: 0;}

.pagination ul {justify-content: center;}
}

/* large */
@media screen and (min-width:64em) {
/***************************** FORMAT *****************************/
h1, h2, .splide-basic .extra, .h1 {font-size: 2em;}
h3, h4, .extra {font-size: 1.375em;}
h5, h6, blockquote > *, .big {font-size: 1.25em;}

.maintitle h1, .index {font-size: 2.5em;}

.side-content .btn {width: 100%;}

/***************************** LAYOUT *****************************/
/* BASIC */
.wrapper {max-width: 60rem;}

/* HEADER */
.mh-inner {padding: 1.75rem 3rem 1rem 3rem;}
#mh.scroll .mh-inner {padding: 0.75rem 3rem 0.5rem 3rem;}

.logo-wrap {height: 1.5rem;}

/* NAVI */
.nav-panel .menu {padding-bottom: 7.5rem; max-width: 60rem;}

.tl + .tl {margin-top: 1.5em;}

.sub-menu {justify-content: center;}
.sl {width: auto; font-size: 1.5em;}
.sl + .sl:before {content: '\002f' !important; position: relative; top: auto; bottom: 0.125rem;}

.tl-item, .mh-contact .extra {font-size: 2.5em;}
.sl-item {padding: 0.5rem 0.75rem; display: inline-block !important;}

.line-break {width: 100%;}

/* nav pull */
.mh-contact ul + ul, .mh-contact p + ul {margin-top: 1.5em;}

#mh .icon {width: 2.5rem;}

.mh-contact .social .col + .col {margin-left: 1.5rem;}

/* IMAGES/SLIDER */
.headimg .img-wrap {padding-bottom: 56.25%;}
@supports (aspect-ratio: 1/1) {
.headimg .img-wrap {aspect-ratio: 16/9;}
}

.splide-basic figcaption, .headimg .maintitle {width: 50%; padding: 3rem;}
.text-slide .text {padding: 3rem;}
.splide-gallery figcaption, .splide-teaser figcaption {padding: 2rem;}
.splide-teaser figcaption {width: 66.66%;}

.entry .stretch-w {width: 66.66%;}

.intro-img .img-copy {left: 0.75rem; bottom: 0.75rem;}

/* CONTENT */
.block {padding: 2.5rem 0;}

.pad-s {padding: 0.75rem;}
.pad-wrap {padding: 0.75rem 2.25rem;}
.pad-top {padding-top: 2.25rem;}
.pad-bottom {padding-bottom: 2.25rem;}

.col-m-s {width: 33.33%; max-width: 33.33%;}
.col-xl-l {width: 66.66%; max-width: 66.66%;}

.pos-right {margin-left: auto;}

#newsbox {margin-top: -8rem;}
#newsbox .pad-wrap {padding: 2rem;}

/* single page */
.single-head {padding-bottom: 1.5rem;}

.text-s + .text-l, .text-l + .text-s {margin-top: 0;}
.text-s {width: 30%; max-width: 30%;}
.text-l {width: 70%; max-width: 70%;}

.mc-right .text-s {padding-right: 0.75rem;}
.mc-right .text-l {padding-left: 1.5rem;}
.mc-left .text-s {padding-left: 0.75rem;}
.mc-left .text-l {padding-right: 1.5rem;}

.text-xl {width: 80%;}

.side-content + .side-content {margin-top: 1.5rem;}

/* gallery */
.panel-cont {width: 75%;}

.close-btn {right: 3rem;}

/* FOOTER */
/*#mf li + li:before {position: relative; content: '\007c'; margin: 0 0.375em;}*/


/* pagination / entry nav */
.nav-arr {width: 2.5rem; height: 2.5rem;}
.prev-art a {padding-left: 3.5rem;}
.next-art a {padding-right: 3.5rem;}
}

@media screen and (min-width:74em) {
/***************************** FORMAT *****************************/
main {font-size: 1.1em;}

/*h3, h4, .extra {font-size: 1.5em;}*/
h1, h2, .splide-basic .extra, .h1 {font-size: 2.25em;}
h3, h4, .extra {font-size: 1.5em;}
h5, h6, blockquote > *, .big, .text-slide .extra {font-size: 1.375em;}

.maintitle h1, .index {font-size: 2.75em;}
.text-slide h2 {font-size: 2em;}

.single-page h3, .single-page h4, .single-page .extra {font-size: 1.375em;}

.gal-open {width: 2.5rem; height: 2.5rem; bottom: 0.75rem; left: 0.75rem;}

/***************************** LAYOUT *****************************/
/* BASIC */
.wrapper {max-width: 70rem;}

.intro .text-img + *, .intro * + .text-img {margin-top: 2em;}

/* NAVI */
.tl + .tl {margin-top: 1.75em;}

/* IMAGES/SLIDER */
.intro-img .img-copy {left: 2rem; bottom: 1rem;}
.cols-rev .intro-img .img-copy {left: 1rem;}

/* CONTENT */
.block {padding: 3rem 0;}

.pad-s {padding: 1rem;}
.pad-wrap {padding: 0.75rem 2rem;}
.pad-top {padding-top: 3rem;}
.pad-bottom {padding-bottom: 3rem;}

.intro-text, .cols-rev .intro-img {padding-right: 2rem; padding-left: 1rem;}
.intro-img, .cols-rev .intro-text {padding-right: 1rem; padding-left: 2rem;}

/* single page */
.mc-right .text-s {padding-right: 1rem;}
.mc-right .text-l {padding-left: 2rem;}
.mc-left .text-s {padding-left: 1rem;}
.mc-left .text-l {padding-right: 2rem;}
}

@media screen and (min-width:90em) {
/***************************** FORMAT *****************************/
h1, h2, .splide-basic .extra, .h1 {font-size: 2.375em;}
.maintitle h1, .index {font-size: 3em;}

/***************************** LAYOUT *****************************/
/* BASIC */
.no-head {padding-top: 6.25rem;}
.wrapper {max-width: 80rem;}

.intro .text-img + *, .intro * + .text-img {margin-top: 2.5em;}

/* HEADER */
.mh-inner {padding: 2.375rem 4rem 1.25rem 4rem;}
#mh.scroll .mh-inner {padding: 0.75rem 4rem 0.5rem 4rem;}
/*.logo-wrap {height: 2rem;}*/
.logo-wrap {height: 1.625rem;}

/* NAVI */
.tl + .tl {margin-top: 2em;}

/* IMAGES/SLIDER */
.splide-basic figcaption, .headimg .maintitle {padding: 4rem;}
.splide__arrow {width: 3.5rem; height: 3.5rem;}
.text-slide {width: 40%;}
.text-slide .text {padding: 2rem 4rem;}

.splide-gallery figcaption, .splide-teaser figcaption {padding: 3rem;}

/* CONTENT */
.block {padding: 4rem 0;}

.pad-wrap {padding: 1rem 3rem;}

/*
.intro-text, .cols-rev .intro-img {padding-right: 2rem; padding-left: 1rem;}
.intro-img, .cols-rev .intro-text {padding-right: 1rem; padding-left: 2rem;}
*/

#newsbox {margin-top: -10rem;}
#newsbox .pad-wrap {padding: 3rem;}

.job-title {padding-bottom: 3.5rem;}

/* single page */
.mc-right .text-s {padding-right: 1.25rem;}
.mc-right .text-l {padding-left: 2.5rem;}
.mc-left .text-s {padding-left: 1.25rem;}
.mc-left .text-l {padding-right: 2.5rem;}

/* gallery */
.panel-cont {width: 66.66%;}

.close-btn {width: 3rem; height: 3rem; top: 3rem; right: 4rem;}

/* pagination / entry nav */
.nav-arr {width: 3rem; height: 3rem;}
.prev-art a {padding-left: 4rem;}
.next-art a {padding-right: 4rem;}
}

@media screen and (min-width:120em) {
body {font-size: 1.2em;}

.wrapper {max-width: 100rem;}

/* IMAGES/SLIDER */
.text-slide {width: 33.33%;}

.intro-img .img-copy {padding: 1rem 1.5rem;}

/* CONTENT */
.block {padding: 5rem 0;}
.pad-s {padding: 1.5rem;}
.pad-wrap {padding: 1rem 2.5rem;}
.pad-top {padding-top: 3.5rem;}
.pad-bottom {padding-bottom: 3.5rem;}

.intro-text, .cols-rev .intro-img {padding-right: 2.5rem; padding-left: 1.5rem;}
.intro-img, .cols-rev .intro-text {padding-right: 1.5rem; padding-left: 2.5rem;}


#newsbox {margin-top: -12.5rem;}

.job-title {padding-bottom: 5rem;}

/* FOOTER */
#mf .col {width: 25%;}
}
/* end responsiveness
--------------------------------------------- */

* + .no-marg {margin-top: 0;}


@-webkit-keyframes pulse {
0%, 100% {transform: scale(1);}
50% {transform: scale(1.1);}
}
@-moz-keyframes pulse {
0%, 100% {transform: scale(1);}
50% {transform: scale(1.1);}
}
@keyframes pulse {
0%, 100% {transform: scale(1);}
50% {transform: scale(1.1);}
}

@-webkit-keyframes move {
0%, 100% {transform: translate(0,0);}
25% {transform: translate(75%,0);}
50% {transform: translate(75%,75%);}
75% {transform: translate(0,75%);}
}
@-moz-keyframes move {
0%, 100% {transform: translate(0,0);}
25% {transform: translate(75%,0);}
50% {transform: translate(75%,75%);}
75% {transform: translate(0,75%);}
}
@keyframes move {
0%, 100% {transform: translate(0,0);}
25% {transform: translate(75%,0);}
50% {transform: translate(75%,75%);}
75% {transform: translate(0,75%);}
}
