


/* -------------------------------------------------- generic ---------- */

*{-webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0;} html{-webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%;} ul, li, a, h1, h2, h3, p{position: relative; display: inline-block;} ul, li, a, img, p, h1, h2, h3{vertical-align: middle;} :focus{outline: none;} a{line-height: 0; text-decoration: none;} 



/* -------------------------------------------------- fonts ---------- */

@font-face{font-family: "AvenirNextLTPro-Medium"; src: url("Fonts/AvenirNextLTPro-Medium.woff2") format("woff2 supports variations"), url("Fonts/AvenirNextLTPro-Medium.woff2") format("woff2-variations"), url("Fonts/AvenirNextLTPro-Medium.woff") format("woff supports variations"), url("Fonts/AvenirNextLTPro-Medium.woff") format("woff-variations"), url("Fonts/AvenirNextLTPro-Medium.ttf") format("truetype supports variations"), url("Fonts/AvenirNextLTPro-Medium.ttf") format("truetype-variations"); font-weight: 100 900;}

@font-face{font-family: "AvenirNextLTPro-Demi"; src: url("Fonts/AvenirNextLTPro-Demi.woff2") format("woff2 supports variations"), url("Fonts/AvenirNextLTPro-Demi.woff2") format("woff2-variations"), url("Fonts/AvenirNextLTPro-Demi.woff") format("woff supports variations"), url("Fonts/AvenirNextLTPro-Demi.woff") format("woff-variations"), url("Fonts/AvenirNextLTPro-Demi.ttf") format("truetype supports variations"), url("Fonts/AvenirNextLTPro-Demi.ttf") format("truetype-variations"); font-weight: 100 900;}

@font-face{font-family: "AvenirNextLTPro-Bold"; src: url("Fonts/AvenirNextLTPro-Bold.woff2") format("woff2 supports variations"), url("Fonts/AvenirNextLTPro-Bold.woff2") format("woff2-variations"), url("Fonts/AvenirNextLTPro-Bold.woff") format("woff supports variations"), url("Fonts/AvenirNextLTPro-Bold.woff") format("woff-variations"), url("Fonts/AvenirNextLTPro-Bold.ttf") format("truetype supports variations"), url("Fonts/AvenirNextLTPro-Bold.ttf") format("truetype-variations"); font-weight: 100 900;}

*{font-family: 'AvenirNextLTPro-Medium', sans-serif;} [class*="link-"] p{font-family: 'AvenirNextLTPro-Demi', sans-serif;} .h0, h1, .h1, h2, .h2, h3, .h3, .written-bold, [class*="link-"] .h2, [class*="link-"] .h3, label{font-family: 'AvenirNextLTPro-Bold', sans-serif;} 

p{word-break: break-word; -webkit-hyphens: auto; -ms-hyphens: auto; -o-hyphens: auto; hyphens: auto;} .h1, .h2{word-break: normal; -webkit-hyphens: manual; -ms-hyphens: manual; -o-hyphens: manual; hyphens: manual;}



/* -------------------------------------------------- color / hover ---------- */

#body-main.toggle, #body-footer.toggle{opacity: .17;} .opacity-high{opacity: .75;} .opacity-middle{opacity: .41;} .opacity-low{opacity: .24/*.17*/;} 

.color-set-light, .color-set-dark .color-invers, .color-set-dark .front-invers{--color-back: #DDE5ED; --color-front: #004F59;} .color-set-dark, .color-set-light .color-invers, .color-set-light .front-invers{--color-back: #004F59; --color-front: #DDE5ED;} :root{--color-ci: #009CA6;} [class*="color-set-"], [class*="color-set-"] .color-invers, .back-back{background-color: var(--color-back);} [class*="symbol-"] [class*="shape-"]{background-color: var(--color-front);} ::-webkit-input-placeholder{color: var(--color-front);} ::-moz-placeholder{color: var(--color-front);} :-ms-input-placeholder{color: var(--color-front);} ::-ms-input-placeholder{color: var(--color-front);} h1, h2, p, a, label, input, textarea, select, ::placeholder{color: var(--color-front);} 

.js-cursor-outer, .js-cursor-inner{background-color: var(--color-ci);} .back-ci{background-color: var(--color-ci);} .front-ci{color: var(--color-ci);} 

.link-default:hover, .link-navigation:hover, .back-light{background-color: hsla(187,100%,17%,0.1);} .link-button{background-color: hsla(187,100%,17%,0.2);} .link-button:hover{background-color: hsla(187,100%,17%,0.4);} .link-contact:hover{background-color: hsla(187,100%,17%,0.7);} 

[class*="table-"] td{border-top-color: hsla(187,100%,17%,0.4);} input, textarea, select{background-color: hsla(187,100%,17%,0.1);} input:hover, textarea:hover, select:hover{background-color: hsla(187,100%,17%,0.2);} 

.image-contain{-webkit-filter: drop-shadow(0px 400px 0 var(--color-front));filter: drop-shadow(0px 400px 0 var(--color-front)); -webkit-transform: translateY(-400px); -ms-transform: translateY(-400px); transform: translateY(-400px);} 



/* -------------------------------------------------- gradient ---------- */

[class*="gradient-"]{pointer-events: none;} .gradient-horizontal{background-image: -webkit-gradient(linear, left top, right top, from(var(--color-back)), color-stop(10%, transparent), color-stop(90%, transparent), to(var(--color-back)));background-image: -o-linear-gradient(left, var(--color-back) 0%, transparent 10%, transparent 90%, var(--color-back) 100%);background-image: linear-gradient(90deg, var(--color-back) 0%, transparent 10%, transparent 90%, var(--color-back) 100%);} .gradient-vertical{background-image: -webkit-gradient(linear, left bottom, left top, from(var(--color-back)), color-stop(10%, transparent), color-stop(90%, transparent), to(var(--color-back)));background-image: -o-linear-gradient(bottom, var(--color-back) 0%, transparent 10%, transparent 90%, var(--color-back) 100%);background-image: linear-gradient(0deg, var(--color-back) 0%, transparent 10%, transparent 90%, var(--color-back) 100%);} .gradient-radial{background-image: -o-radial-gradient(transparent 0%, transparent 70%, var(--color-back) 100%);background-image: radial-gradient(transparent 0%, transparent 70%, var(--color-back) 100%);} 



/* -------------------------------------------------- cursor ---------- */

.js-cursor-outer, .js-cursor-inner{position: fixed; display: block; left: -100px; top: 0; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); border: none; border-radius: 50%; z-index: 999; pointer-events: none;} .js-cursor-outer{-webkit-transition: left .07s ease-out, top .07s ease-out, width .29s ease-in-out, height .29s ease-in-out, background-color .29s, opacity .29s ease-in-out;-o-transition: left .07s ease-out, top .07s ease-out, width .29s ease-in-out, height .29s ease-in-out, background-color .29s, opacity .29s ease-in-out;transition: left .07s ease-out, top .07s ease-out, width .29s ease-in-out, height .29s ease-in-out, background-color .29s, opacity .29s ease-in-out;} .js-cursor-inner{-webkit-transition: left .19s ease-out, top .19s ease-out, width .29s ease-in-out, height .29s ease-in-out, background-color .29s, opacity .29s ease-in-out;-o-transition: left .19s ease-out, top .19s ease-out, width .29s ease-in-out, height .29s ease-in-out, background-color .29s, opacity .29s ease-in-out;transition: left .19s ease-out, top .19s ease-out, width .29s ease-in-out, height .29s ease-in-out, background-color .29s, opacity .29s ease-in-out;}

.js-cursor-outer{width: 41px; height: 41px; opacity: 0.11;} .js-cursor-inner{width: 6px; height: 6px; opacity: 1;} .js-cursor-outer.hover{width: 147px; height: 147px; opacity: 0.11;} .js-cursor-inner.hover{width: 147px; height: 147px; opacity: 0;} .js-cursor-hover{cursor: pointer;}



/* -------------------------------------------------- pattern ---------- */

/*[class*="pattern-"]{position: absolute; display: block; right: 50%; bottom: 50%; transform: translate(50%,50%); width: 100%; height: 100%;}
.pattern-pixel{background-color: rgba(87,152,152,0.29); background-size: 4px 4px; background-image: linear-gradient(var(--color-back) 0.4px, transparent 0.4px), linear-gradient(to right, var(--color-back) 0.4px, transparent 0.4px); opacity: 0.7;}*/



/* -------------------------------------------------- variables ---------- */

#html-body{--padding-horizontal: 0.015; --padding-vertical: calc(0.55vw + 0.55vh + 5.5px); --padding-button: calc(0.5vw + 0.5vh + 5px); --padding-form: calc(0.2vw + 0.2vh + 2px); --overlay-factor: -3.5vw; --transform-offset: -3vw;} 



/* -------------------------------------------------- space ---------- */

[class*="space-"]{position: relative; display: block; width: 100%;} .section-layer-full{width: 100%; max-width: var(--layer-max);} .section-layer-default{width: calc(100% - var(--layer-diff) * 100% + 2 * var(--padding-horizontal) * 100%); max-width: calc((1 - var(--layer-diff)) * var(--layer-max));} .section-layer-thin{width: calc(100% - 2 * var(--layer-diff) * 100% + 2 * var(--padding-horizontal) * 100%); max-width: calc((1 - 2 * var(--layer-diff)) * var(--layer-max));} 

.space-high{height: calc(16 * var(--padding-vertical));} .space-default{height: calc(5 * var(--padding-vertical));} .space-flat{height: var(--padding-vertical);} .space-mini{padding-top: calc(var(--padding-horizontal) * 100%);} .padding-flat{padding: calc(var(--padding-vertical) / 2) calc(var(--padding-horizontal) * 100%);} .padding-default{padding: var(--padding-vertical) calc(var(--padding-horizontal) * 100%);} .padding-wide{padding: calc(2 * var(--padding-vertical)) calc(2 * var(--padding-horizontal) * 100%);} .padding-side{padding: 0 calc(2 * var(--padding-horizontal) * 100%);} .padding-small{padding: var(--padding-vertical) calc(var(--padding-horizontal) * 0.25 * 100%);} .padding-button{padding: var(--padding-button) calc(var(--padding-button) * 1.4);} 



/* -------------------------------------------------- global ---------- */

#body-header, #body-main, #body-footer{width: 100%;} #body-header{z-index: 7;} #body-main{z-index: 1;} #body-footer{z-index: 4;} hr{border: none; height: 0;} [class*="-section"]{position: relative; display: block; width: 100%; margin: 0 auto; text-align: center; overflow: hidden;} [class*="layer-"]{position: relative; display: block; margin: 0 auto;} [class*="grid-"], [class*="inline-"]{position: relative; display: inline-block; vertical-align: middle;} [class*="grid-"], [class*="inline-"]{text-align: left;} 

.grid-100, .inline-100{width: 100%;} .inline-75{width: 75%;} .inline-67{width: 66.67%;} .inline-50{width: 50%;} .inline-33{width: 33.33%;} .inline-25{width: 25%;} .inline-fix{width: calc(5 * var(--padding-horizontal) * 100% + 170px);} .inline-flex{width: calc((1 - 5 * var(--padding-horizontal)) * 100% - 170px);} .grid-0, .inline-0{display: none; visibility: hidden;} .text-left{text-align: left;} .text-center{text-align: center;} .text-right{text-align: right;} .vertical-bottom{vertical-align: bottom;} .vertical-top{vertical-align: top;} .overflow-hidden{overflow: hidden;} 

[class*="overlay-"], [class*="transform-"]{position: relative; display: block;} .overlay-left{margin-left: var(--overlay-factor);} .overlay-right{margin-right: var(--overlay-factor);} .overlay-horizontal{margin: 0 var(--overlay-factor);} .transform-left{-webkit-transform: translate(var(--transform-offset),0);-ms-transform: translate(var(--transform-offset),0);transform: translate(var(--transform-offset),0);} .transform-right{-webkit-transform: translate(calc(-1 * var(--transform-offset)),0);-ms-transform: translate(calc(-1 * var(--transform-offset)),0);transform: translate(calc(-1 * var(--transform-offset)),0);} .transform-top{-webkit-transform: translate(0px,calc(-2.5 * var(--padding-vertical)));-ms-transform: translate(0px,calc(-2.5 * var(--padding-vertical)));transform: translate(0px,calc(-2.5 * var(--padding-vertical)));} .transform-bottom{-webkit-transform: translate(0px,calc(2.5 * var(--padding-vertical)));-ms-transform: translate(0px,calc(2.5 * var(--padding-vertical)));transform: translate(0px,calc(2.5 * var(--padding-vertical)));} 



/* -------------------------------------------------- frames ---------- */

[class*="frame-relative-"], [class*="frame-absolute-"], [class*="frame-fixed-"]{display: block; width: 100%;} [class*="frame-relative-"]{position: relative; display: block; height: auto;} [class*="frame-absolute-"], [class*="frame-fixed-"]{right: 50%; bottom: 50%; -webkit-transform: translate(50%,50%); -ms-transform: translate(50%,50%); transform: translate(50%,50%);} [class*="frame-absolute-"]{position: absolute;} [class*="frame-fixed-"]{position: fixed;}

.frame-relative-1to1{padding-top: 100%;} .frame-relative-4to3{padding-top: 75%;} .frame-relative-3to4{padding-top: 133.33%;} .frame-relative-3to2{padding-top: 66.66%;} .frame-relative-16to9{padding-top: 56.25%;} .frame-relative-9to16{padding-top: 177.77%;} .frame-relative-2to1{padding-top: 50%;} .frame-relative-fixed{padding-top: calc(400px + 20%);} .frame-absolute-cover, .frame-fixed-cover{height: 100%;} .frame-absolute-auto, .frame-fixed-auto{height: auto;} .height-110p{height: 110%;}

.frame-relative-brand{padding-top: 33.33%;} .frame-relative-logo{padding-top: 30%;} .frame-absolute-top{bottom: auto; top: 0; -webkit-transform: translate(50%,0); -ms-transform: translate(50%,0); transform: translate(50%,0);} .frame-absolute-bottom{bottom: 0; -webkit-transform: translate(50%,0); -ms-transform: translate(50%,0); transform: translate(50%,0);} .frame-absolute-city{right: 80%; bottom: 77.5%; width: auto;} .frame-absolute-location{-webkit-transform: translate(50%,9%);-ms-transform: translate(50%,9%);transform: translate(50%,9%); width: auto;} 



/* -------------------------------------------------- images ---------- */

.image-relative, .image-cover, .image-contain, .image-icon{position: relative; display: block;} .image-relative{height: auto;} .image-cover, .image-contain{width: 100%; height: 100%;} .image-cover{-o-object-fit: cover;object-fit: cover; -o-object-position: center center; object-position: center center;} .image-contain{-o-object-fit: contain;object-fit: contain;} .image-absolute{position: absolute; display: block; right: 50%; bottom: 50%; -webkit-transform: translate(50%,50%); -ms-transform: translate(50%,50%); transform: translate(50%,50%); width: 100%; height: auto;} .image-inline{width: 21px;} [class*="image-symbol-"]{width: calc((12px + 0.3vw) * 1.5); height: auto; vertical-align: middle;} .image-symbol-left{-webkit-transform: translate(0,-1px);-ms-transform: translate(0,-1px);transform: translate(0,-1px);} .image-symbol-right{margin-left: var(--padding-link); -webkit-transform: translate(0,-1px); -ms-transform: translate(0,-1px); transform: translate(0,-1px);} [class*="link-"]:hover .image-symbol-left{-webkit-transform: translate(-2px,-1px);-ms-transform: translate(-2px,-1px);transform: translate(-2px,-1px);} [class*="link-"]:hover .image-symbol-right{-webkit-transform: translate(2px,-1px);-ms-transform: translate(2px,-1px);transform: translate(2px,-1px);} 



/* -------------------------------------------------- symbols ---------- */

[class*="symbol-"]{position: relative; display: inline-block; vertical-align: middle;} [class*="symbol-"] [class*="shape-"], [class*="symbol-"] [class*="text-"]{position: absolute; display: block; right: 50%; bottom: 50%; -webkit-transform: translate(50%,50%); -ms-transform: translate(50%,50%); transform: translate(50%,50%); -webkit-transition-duration: .27s; -o-transition-duration: .27s; transition-duration: .27s;}

.symbol-navigation{display: block; width: 32px; height: 54px;} .symbol-navigation [class*="shape-"]{-webkit-transform: translate(50%,50%)rotate(0deg);-ms-transform: translate(50%,50%)rotate(0deg);transform: translate(50%,50%)rotate(0deg); width: 32px; height: 3px;} .symbol-navigation .shape-0{bottom: 30.5px;} .symbol-navigation .shape-1{bottom: 23.5px;} #body-header.toggle .symbol-navigation [class*="shape-"]{bottom: 27px;} #body-header.toggle .symbol-navigation .shape-0{-webkit-transform: translate(50%,50%)rotate(-45deg);-ms-transform: translate(50%,50%)rotate(-45deg);transform: translate(50%,50%)rotate(-45deg);} #body-header.toggle .symbol-navigation .shape-1{-webkit-transform: translate(50%,50%)rotate(45deg);-ms-transform: translate(50%,50%)rotate(45deg);transform: translate(50%,50%)rotate(45deg);}

.symbol-dot{position: relative; display: block;} .symbol-dot [class*="shape-"]{width: 20%; height: 20%; border-radius: 50%;}

.symbol-information{display: inline-block; width: calc(2 * var(--padding-vertical)); height: calc(2 * var(--padding-vertical));} 
.symbol-information .shape-0{width: 12px; height: 3px;} 
.symbol-information .shape-1{width: 3px; height: 12px;} 
.js-information-item.on .symbol-information .shape-1{height: 3px;} 

.symbol-vertical{position: absolute; display: block; right: 87%; bottom: 50%; -webkit-transform: translate(50%,50%); -ms-transform: translate(50%,50%); transform: translate(50%,50%); width: 2px; height: 100%;} .symbol-vertical [class*="shape-"]{width: 100%; height: calc(87% - 87px);} 

[class*="addon-"]{position: absolute; display: block; top: 2px; -webkit-transform: translate(50%,-50%); -ms-transform: translate(50%,-50%); transform: translate(50%,-50%); width: 25px; border-radius: 999px;} [class*="addon-"] .image-absolute{width: 59%;} .addon-00{right: 12px;} .addon-01{right: 39px;} 



/* -------------------------------------------------- list, table, icon ---------- */

[class*="list-"], [class*="list-"] .list-item, [class*="icon-"]{position: relative; display: block;} [class*="list-"] .list-item{list-style: none; vertical-align: middle;} 

.list-link{display: block; margin: 0 calc(-5 * var(--padding-link));} .list-link .list-item{display: inline-block; margin: var(--padding-link) var(--padding-link);} .list-link [class*="link-"] p{padding: var(--padding-link) var(--padding-link);} .list-link .link-contact{margin: var(--padding-link) calc(var(--padding-link) * 4);} .list-block .list-item{display: block;} 

.list-symbol .list-item{margin-top: calc(var(--padding-vertical) / 2); padding-left: calc(2 * var(--padding-vertical));} .list-symbol [class*="symbol-"], .list-symbol p{vertical-align: top;} .list-symbol [class*="symbol-"]{position: absolute; left: calc(var(--padding-vertical) / 3); -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%); width: calc(2 * var(--padding-vertical)); height: calc(2 * var(--padding-vertical));} 

[class*="table-"]{width: 100%; border-spacing: 8px 0;} [class*="table-"] th, [class*="table-"] td{padding: calc(var(--padding-vertical) / 2) calc(var(--padding-horizontal) * 100%);} [class*="table-"] td{border-top-style: solid; border-top-width: 1.5px; vertical-align: middle;} [class*="table-"] thead{display: none;} [class*="table-"] .row-first td{border: none;} 

.icon-p-left{padding-left: calc(2 * var(--padding-vertical));} .icon-h3-left{padding-left: calc(2.7 * var(--padding-vertical));} .icon-p-right{padding-right: calc(2 * var(--padding-vertical));} .icon-h3-right{padding-right: calc(2.7 * var(--padding-vertical));} [class*="icon-"] .image-icon{position: absolute; -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%);} .icon-p-left .image-icon, .icon-h3-left .image-icon{left: 0;} .icon-p-right .image-icon, .icon-h3-right .image-icon{right: 0;} 
[class*="icon-p-"] .image-icon{width: calc(1.5 * var(--padding-vertical)); height: calc(1.5 * var(--padding-vertical));} [class*="icon-h3-"] .image-icon{width: calc(2.1 * var(--padding-vertical)); height: calc(2.1 * var(--padding-vertical));} 


/* -------------------------------------------------- links ---------- */

[class*="link-"]{position: relative; display: inline-block;} [class*="link-"] p{text-decoration: none;} .link-text{display: inherit !important; text-decoration: underline;} .link-default, .link-button, .link-contact, .link-navigation{border-radius: 999px;} 

.link-icon .image-contain{-webkit-transform: scale(1.1);-ms-transform: scale(1.1);transform: scale(1.1);} .link-brand{width: 100%; z-index: 11;} .link-brand .image-absolute{width: 100%;} .bond-left{padding-left: var(--padding-link); border-top-left-radius: 0; border-bottom-left-radius: 0;} .bond-right{padding-right: var(--padding-link); border-top-right-radius: 0; border-bottom-right-radius: 0;} 

.hover-invers [class*="link-"]{opacity: .41;} .hover-invers [class*="link-"]:hover{opacity: 1;} 

.link-location{width: calc(2.1 * var(--padding-vertical));} .link-location .image-relative{width: 100%;} .link-location p{position: absolute; display: block; right: 0%; bottom: 59%; -webkit-transform: translate(100%,50%); -ms-transform: translate(100%,50%); transform: translate(100%,50%); width: calc(80px + 2vw);}



/* #######################################################################
##################################################### modules ############
####################################################################### */ 



/* -------------------------------------------------- fade in on scroll ---------- */

[class*="js-fadein-"]{overflow-y: visible;} [class*="js-fadein-fast-"]{-webkit-transition: opacity 590ms ease-in-out 59ms, -webkit-transform 870ms ease-in-out 87ms;transition: opacity 590ms ease-in-out 59ms, -webkit-transform 870ms ease-in-out 87ms;-o-transition: transform 870ms ease-in-out 87ms, opacity 590ms ease-in-out 59ms;transition: transform 870ms ease-in-out 87ms, opacity 590ms ease-in-out 59ms;transition: transform 870ms ease-in-out 87ms, opacity 590ms ease-in-out 59ms, -webkit-transform 870ms ease-in-out 87ms;} [class*="js-fadein-slow-"]{-webkit-transition: opacity 1440ms ease-in-out 144ms, -webkit-transform 1910ms ease-in-out 191ms;transition: opacity 1440ms ease-in-out 144ms, -webkit-transform 1910ms ease-in-out 191ms;-o-transition: transform 1910ms ease-in-out 191ms, opacity 1440ms ease-in-out 144ms;transition: transform 1910ms ease-in-out 191ms, opacity 1440ms ease-in-out 144ms;transition: transform 1910ms ease-in-out 191ms, opacity 1440ms ease-in-out 144ms, -webkit-transform 1910ms ease-in-out 191ms;}



/* -------------------------------------------------- informations ---------- */

.js-information-item{position: relative; display: block; padding: calc(var(--padding-vertical) / 2) 0;} .information-title{position: relative; display: inline-block; width: 100%; height: auto; padding-right: calc(3 * var(--padding-vertical));} .information-description{max-height: 0; overflow: hidden; opacity: 0;} .information-description p{display: block;} .symbol-information{position: absolute; right: 0; -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%);} 

.js-information-item, .information-description{-webkit-transition-duration: .71s;-o-transition-duration: .71s;transition-duration: .71s;} .js-information-item.on .information-description{max-height: 870px; opacity: 1;} 



/* -------------------------------------------------- roll ---------- */

.horizontal-roll, .horizontal-roll .roll-wrapper{position: relative; display: block;} .horizontal-roll{width: 100%; height: auto; padding: 0; overflow: hidden;} .horizontal-roll .roll-wrapper{-webkit-transform: translate(0px,0px);-ms-transform: translate(0px,0px);transform: translate(0px,0px);} .horizontal-roll .list-item{display: inline-block; width: 6.25%; height: auto; vertical-align: middle; text-align: left;} .horizontal-roll .horizontal-item{position: relative; display: block; padding: 0 40%;} 

@-webkit-keyframes animation-roll-impressions{0%{-webkit-transform: translate(0px,0px);transform: translate(0px,0px);} 100%{-webkit-transform: translate(-50%,0px);transform: translate(-50%,0px);}} .horizontal-roll .roll-wrapper{width: 533.33%; -webkit-animation: animation-roll-impressions 47s linear infinite; animation: animation-roll-impressions 47s linear infinite;} 



/* -------------------------------------------------- roll logo ---------- */

 .inline-100{--roll-width: 1.0;} .roll-logo-07{--logo-count: 7;} 

.horizontal-roll, .horizontal-roll .roll-wrapper{position: relative; display: block;} .horizontal-roll{width: 100%; height: auto; padding: 0; overflow: hidden;} .horizontal-roll .roll-wrapper{-webkit-transform: translate(0px,0px);-ms-transform: translate(0px,0px);transform: translate(0px,0px); width: calc((80% + 800px) * var(--logo-count) * 0.5 / var(--roll-width)); -webkit-animation: animation-roll-infinity calc(7s * var(--logo-count)) linear infinite; animation: animation-roll-infinity calc(7s * var(--logo-count)) linear infinite;} .horizontal-roll .list-item{display: inline-block; width: calc(0.5 * 100% / var(--logo-count)); height: auto; vertical-align: middle; text-align: left;} .horizontal-roll .horizontal-item{position: relative; display: block; padding: 0 20%;} 

@-webkit-keyframes animation-roll-infinity{0%{-webkit-transform: translate(0px,0px);transform: translate(0px,0px);} 100%{-webkit-transform: translate(-50%,0px);transform: translate(-50%,0px);}} 



/* -------------------------------------------------- slide ---------- */

.horizontal-slide, .horizontal-slide .slide-wrapper{position: relative; display: block; margin: 0 auto; height: auto;} .horizontal-slide{width: 100%; overflow: hidden;} .horizontal-slide .slide-wrapper{-webkit-transition: -webkit-transform .29s;transition: -webkit-transform .29s;-o-transition: transform .29s;transition: transform .29s;transition: transform .29s, -webkit-transform .29s; padding: 0 2.5%;} .horizontal-slide .slide-wrapper .list-item{position: relative; display: inline-block; width: 16.66%; vertical-align: top;}

.horizontal-slide .horizontal-item{position: relative; display: block; padding: 0 6%;} .horizontal-slide .slide-wrapper{width: 240%;}



/* -------------------------------------------------- marquee ---------- */

/*[class*="marquee-"]{--gap: 0px; position: relative; display: flex; width: 100%; height: auto; overflow: hidden; user-select: none;} [class*="marquee-"] p{flex-shrink: 0; display: flex; justify-content: space-around; min-width: 100%;} [class*="marquee-"], [class*="marquee-"] p{gap: var(--gap);} [class*="marquee-"] p span{position: relative; display: inline-block; width: 24px; vertical-align: middle; text-align: center;}

.marquee-left p{animation: animation-marguee-left 24s linear infinite;} .marquee-right p{animation: animation-marguee-right 24s linear infinite;} @keyframes animation-marguee-left{from{transform: translateX(calc(0% - var(--gap)));}to{transform: translateX(-100%);}} @keyframes animation-marguee-right{from{transform: translateX(calc(-100% - var(--gap)));}to{transform: translateX(0);}}*/



/* -------------------------------------------------- multistep form ---------- */

.slide-multistep{width: 100%; height: auto; padding: 0; vertical-align: middle; overflow: hidden;} .slide-multistep-wrapper{-webkit-transform: translate(0px,0px);-ms-transform: translate(0px,0px);transform: translate(0px,0px);} .slide-multistep .multistep-tab{height: auto; vertical-align: top;}

#form-initial .slide-multistep-wrapper{width: 200%;} #form-initial .slide-multistep .multistep-tab{width: 50%;} 

[class*="multistep-"]{position: relative; display: inline-block;} [class*="multistep-"] input, [class*="multistep-"] textarea, [class*="form-"] select{padding: var(--padding-button) calc(2 * var(--padding-button));} [class*="form-"] input, [class*="form-"] select, [class*="form-"] textarea, [class*="form-"] select, [class*="form-"] fieldset{vertical-align: top; border: none; border-radius: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none;} [class*="form-"]{margin: 0 calc(-1 * var(--padding-form));} [class*="form-"] .slide-multistep{margin: var(--padding-form) 0;} [class*="form-"] [class*="grid-"], [class*="form-"] [class*="inline-"]{padding: var(--padding-form) var(--padding-form); vertical-align: middle;} [class*="multistep-"] label, [class*="multistep-"] input, [class*="multistep-"] select, [class*="multistep-"] textarea, [class*="form-"] fieldset{display: block; width: 100%;} 

[class*="multistep-"] .label-default{position: absolute; padding-left: calc(3 * var(--padding-form)); pointer-events: none;} [class*="multistep-"] label, .multistep-links .multistep-tab p{line-height: calc(var(--padding-form) + 8px); font-size: calc(var(--padding-form) / 2 + 8px); font-weight: 500; letter-spacing: calc(var(--padding-form) / 3 + 1px); opacity: .84; z-index: 7;} [class*="multistep-"] label a p{text-decoration: underline;} [class*="multistep-"] input, [class*="multistep-"] select, [class*="multistep-"] textarea, .link-multistep{position: relative;} [class*="multistep-"] input, [class*="multistep-"] select, [class*="multistep-"] fieldset, [class*="multistep-"] textarea{margin-top: var(--padding-form);} [class*="multistep-"] textarea{resize: none;} [class*="multistep-"] input{-webkit-transition-duration: .14s;-o-transition-duration: .14s;transition-duration: .14s;} ::-webkit-input-placeholder{opacity: .29;} ::-moz-placeholder{opacity: .29;} :-ms-input-placeholder{opacity: .29;} ::-ms-input-placeholder{opacity: .29;} ::placeholder{opacity: .29;}

.list-indicator .list-item{position: relative; display: none;} .list-indicator .list-item.toggle{display: block;} .symbol-indicator{position: relative; display: block; width: 100%; height: 3px; margin: 7px 0; overflow: hidden;} .symbol-indicator [class*="shape-"]{height: 3px;} .symbol-indicator .shape-0{width: 100%; opacity: .14;} .symbol-indicator .shape-1{left: 0; right: auto; -webkit-transform: translate(0,50%); -ms-transform: translate(0,50%); transform: translate(0,50%); width: 0; -webkit-transition-duration: .57s; -o-transition-duration: .57s; transition-duration: .57s;}

.form-multistep .image-absolute{right: calc(2 * var(--padding-form)); bottom: calc(50% - 4px); -webkit-transform: translate(0,50%); -ms-transform: translate(0,50%); transform: translate(0,50%); width: auto; height: 42%;}

.inline-select{width: 100%;} .inline-input{display: none; width: 50%;} .inline-select.toggle{width: 50%;} .inline-input.toggle{display: inline-block;} 



/* -------------------------------------------------- more ---------- */

.main-section-legal p{padding: var(--padding-link) 0;} .main-section-legal [class*="list-"] p{padding: 0 0;} .main-section-legal .link-default{padding: 0 calc(2 * var(--padding-link));} 

/*#backlink .image-relative{display: inline-block; margin-left: 2px; width: 25px;}*/ #matomo-opt-out{padding: calc(0.9vw + 0.9vh + 9px) 1.25%;} #matomo-opt-out input{margin-right: calc(0.45vw + 0.45vh + 4.5px); margin-top: calc(0.45vw + 0.45vh + 4.5px);} #matomo-opt-out label{margin: calc(0.9vw + 0.9vh + 9px) 0;} 



/* -------------------------------------------------- transition ---------- */

.js-approach-item{-webkit-transition: opacity .17s;-o-transition: opacity .17s;transition: opacity .17s;}
#html-body, [class*="link-"], [class*="image-symbol-"], input, textarea, select{-webkit-transition-duration: .27s;-o-transition-duration: .27s;transition-duration: .27s;}
#body-main, #body-footer, .frame-navigation{-webkit-transition-duration: .54s;-o-transition-duration: .54s;transition-duration: .54s;}



/* #######################################################################
##################################################### signature ##########
####################################################################### */ 



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

[class*="navigation-"]{z-index: 10;} #body-header{position: absolute;} .header-navigation, .link-navigation{position: relative; display: block;} [class*="grid-nav-"]{vertical-align: middle;} .link-navigation{z-index: 11; cursor: pointer;} 



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

.overflow-hidden .js-parallax-frame .frame-absolute-cover,  .js-parallax-frame .frame-absolute-cover{height: calc(100% + 100px);} 
.zindex-front{z-index: 7;} 



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



/* -------------------------------------------------- media query ---------- */

/*[class*="inline-"], [class*="grid-"]{outline: solid 2px blue;} [class*="list-"]{outline: solid 2px red;}*/ 

@media(max-width: 1039px){
    #html-body{--layer-max: calc(580px + 11.6%); --layer-diff: 0.10; --padding-link: 0.4vw;}
    
    .grid-75, .grid-67, .grid-62, .grid-60, .grid-50, .grid-40, .grid-38, .grid-33, .grid-fix, .grid-flex{width: 100%;} .grid-25, .grid-20{width: 50%;} .mobile-100{width: 100%;} [class*="desktop-absolute-"]{position: relative; display: block; right: auto; bottom: auto; -webkit-transform: translate(0,0); -ms-transform: translate(0,0); transform: translate(0,0);} .list-symbol [class*="symbol-"], [class*="icon-p-"] .image-icon{top: calc((18px + 0.45vw) / 2);} [class*="icon-h3-"] .image-icon{top: calc((22px + 1.1vw) / 2);} .symbol-information{top: calc(9px + 0.225vw + var(--padding-vertical) / 2);} 
    
    .link-navigation{display: inline-block;} .frame-navigation{position: fixed; display: block; right: 0; bottom: 100%; width: 100%; height: 100%; background-color: var(--color-back); margin-left: 0;} #body-header.toggle .frame-navigation{bottom: 0;} .frame-navigation .list-link{position: absolute; display: block; right: 50%; bottom: 42%; -webkit-transform: translate(50%,50%); -ms-transform: translate(50%,50%); transform: translate(50%,50%);} .frame-navigation .list-link .list-item{display: block; width: auto/*calc(128px + 12.8vw)*/; padding: var(--padding-vertical) 0;} .only-mobile, [class*="list-"] .only-mobile{display: block;} .only-desktop, [class*="list-"] .only-desktop{display: none;} .link-button, .link-contact{padding: calc(var(--padding-button) * 1.8) calc(var(--padding-button) * 2);} .link-default, .link-icon, .link-navigation{padding: calc(var(--padding-button) * 1) calc(var(--padding-link) * 5);} .bond-left{padding-left: var(--padding-link);} .bond-right{padding-right: var(--padding-link);} 
    
	p, label, input, textarea, select, .link-text{line-height: calc(18px + 0.45vw); font-size: calc(12px + 0.3vw);} 
    [class*="link-"] p, .written-small{line-height: calc(16.8px + 0.42vw); font-size: calc(10.8px + 0.27vw);} 
    h3, .h3{line-height: calc(22px + 1.1vw); font-size: calc(16px + 0.8vw);} 
    h2, .h2{line-height: calc(24px + 2.4vw); font-size: calc(21px + 2.1vw); /*letter-spacing: calc(-0.5px - 0.05vw);*/} 
    h1, .h1{line-height: calc(31px + 3.1vw); font-size: calc(29px + 2.9vw); letter-spacing: calc(-0.5px - 0.05vw);} 
    .h0{line-height: calc(34px + 3.4vw); font-size: calc(34px + 3.4vw); letter-spacing: calc(-1px - 0.1vw);} 
    
    .indent-left-small, .indent-left-wide{padding-left: 15%;} .indent-right-small, .indent-right-wide{padding-right: 15%;} [class*="indent-"]{padding: 0 6.5%;} [class*="form-"] input, [class*="form-"] select, [class*="form-"] textarea, [class*="form-"] select{border-radius: calc((16.8px + 0.42vw) / 2 + var(--padding-button));} 
    }
@media(min-width: 1040px){
    #html-body{--layer-max: 2400px; --layer-diff: 0.25; --padding-link: 4px;}
    
    .grid-75{width: 75%;} .grid-67{width: 66.67%;} .grid-62{width: 61.8%;} .grid-60{width: 60%;} .grid-50{width: 50%;} .grid-40{width: 40%;} .grid-38{width: 38.2%;} .grid-33{width: 33.33%;} .grid-25{width: 25%;} .grid-20{width: 20%;} .grid-fix{width: calc(4 * var(--padding-horizontal) * 100% + 220px);} .grid-flex{width: calc((1 - 4 * var(--padding-horizontal)) * 100% - 220px);} [class*="desktop-absolute-"]{position: absolute; display: block; bottom: 50%; -webkit-transform: translate(0,50%); -ms-transform: translate(0,50%); transform: translate(0,50%);} .desktop-absolute-left{left: 0;} .desktop-absolute-middle{right: 50%; -webkit-transform: translate(50%,50%); -ms-transform: translate(50%,50%); transform: translate(50%,50%);} .desktop-absolute-right{right: 0;} .list-symbol [class*="symbol-"], [class*="icon-p-"] .image-icon{top: calc((18px + 0.45vw) / 2);} [class*="icon-h3-"] .image-icon{top: calc((19px + 0.95vw) / 2);} .symbol-information{top: calc(9px + 0.225vw + var(--padding-vertical) / 2);} 
    
    .link-navigation{display: none;} .frame-navigation{position: relative; display: inline-block; right: auto; width: auto; height: auto; background-color: transparent; margin-left: calc(var(--padding-link) * 8);} .frame-navigation .list-link{position: relative; display: block; right: auto; bottom: auto; -webkit-transform: translate(0,0); -ms-transform: translate(0,0); transform: translate(0,0);} .frame-navigation .list-link .list-item{display: inline-block;  padding: 0 0;} .only-mobile, [class*="list-"] .only-mobile, .frame-navigation .list-link .only-mobile{display: none;} .only-desktop, [class*="list-"] .only-desktop{display: inline-block;} .link-button, .link-contact{padding: calc(var(--padding-button) * 1.1) calc(var(--padding-button) * 2);} .link-default, .link-icon, .link-navigation{padding: var(--padding-link) calc(var(--padding-link) * 5);} .bond-left{padding-left: var(--padding-link);} .bond-right{padding-right: var(--padding-link);} 
    
	p, label, input, textarea, select, .link-text{line-height: calc(18px + 0.45vw); font-size: calc(12px + 0.3vw);} 
    [class*="link-"] p, .written-small{line-height: calc(16.8px + 0.42vw); font-size: calc(10.8px + 0.27vw);} 
    h3, .h3{line-height: calc(19px + 0.95vw); font-size: calc(13px + 0.65vw);} 
    h2, .h2{line-height: calc(21px + 2.1vw); font-size: calc(18px + 1.8vw); /*letter-spacing: calc(-0.5px - 0.05vw);*/} 
    h1, .h1{line-height: calc(25px + 2.5vw); font-size: calc(25px + 2.5vw); letter-spacing: calc(-0.5px - 0.05vw);} 
    .h0{line-height: calc(34px + 3.4vw); font-size: calc(34px + 3.4vw); letter-spacing: calc(-1px - 0.1vw);} 
    
    .indent-left-small{padding-left: 17.4%;} .indent-left-middle{padding-left: 23.7%;} .indent-left-wide{padding-left: 30%;} .indent-right-small{padding-right: 17.4%;} .indent-right-middle{padding-right: 23.7%;} .indent-right-wide{padding-right: 30%;} [class*="form-"] input, [class*="form-"] select, [class*="form-"] textarea, [class*="form-"] select{border-radius: calc((16.8px + 0.42vw) / 2 + var(--padding-button));} 
    }



/* #######################################################################
##################################################### more media #########
####################################################################### */ 



/* -------------------------------------------------- touch ---------- */

@media(pointer: coarse){
    .js-cursor-outer, .js-cursor-inner{display: none;}
}



/* -------------------------------------------------- print ---------- */

@media screen {
    .js-enable [class*="js-fadein-"]{opacity: 0;} .js-enable .js-fadein-slow-left, .js-enable .js-fadein-fast-left{-webkit-transform: translate(58px,0);-ms-transform: translate(58px,0);transform: translate(58px,0);} .js-enable .js-fadein-slow-right, .js-enable .js-fadein-fast-right{-webkit-transform: translate(-58px,0);-ms-transform: translate(-58px,0);transform: translate(-58px,0);} .js-enable .js-fadein-slow-up, .js-enable .js-fadein-fast-up{-webkit-transform: translate(0,29px);-ms-transform: translate(0,29px);transform: translate(0,29px);} /*.js-enable .js-fadein-down{transform: translate(0,-41px);}*/ .js-enable [class*="js-fadein-"].on{opacity: 1; -webkit-transform: translate(0,0); -ms-transform: translate(0,0); transform: translate(0,0);} 
    }
@media print {
    .js-enable [class*="js-fadein-"]{opacity: 1;} .js-enable .js-fadein-slow-left, .js-enable .js-fadein-fast-left{-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);} .js-enable .js-fadein-slow-right, .js-enable .js-fadein-fast-right{-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);} .js-enable .js-fadein-slow-up, .js-enable .js-fadein-fast-up{-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);} /*.js-enable .js-fadein-down{transform: translate(0,0);}*/ .js-enable [class*="js-fadein-"].on{opacity: 1; -webkit-transform: translate(0,0); -ms-transform: translate(0,0); transform: translate(0,0);} 
    }

