*,:after,:before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

ol,ul {
    padding: 0
}

.otgs-development-site-front-end {
    display: none!important
}

blockquote,body,dd,dl,figcaption,figure,h1,h2,h3,h4,h5,h6,li,ol,p,ul {
    margin: 0
}

body {
    text-rendering: geometricPrecision;
    line-height: 1.5;
    min-height: 100vh;
    overflow-x: hidden;
    scroll-behavior: smooth
}

body.noscroll {
    overflow: hidden
}

@media only screen and (min-width: 1025px) {
    html {
        scroll-behavior:auto
    }

    body.wolfpack-desktop {
        height: 100vh;
        overflow: hidden
    }
}

section {
    width: 100%;
}

hr {
    border: 0;
    border-top: 1px solid #ccc;
    display: block;
    margin: rem(16) 0;
    padding: 0
}

li,ol,ul {
    list-style: none;
    margin: 0;
    padding: 0
}

a:not([class]) {
    -webkit-text-decoration-skip: ink;
    text-decoration-skip-ink: auto
}

img {
    display: block;
    height: auto
}

article>*+* {
    margin-top: 1em
}

button,input,select,textarea {
    cursor: pointer;
    font: inherit
}

a {
    cursor: pointer!important;
    opacity: 1;
    text-decoration: none
}

@media (prefers-reduced-motion:reduce) {
    * {
        -webkit-animation-duration: .01ms!important;
        animation-duration: .01ms!important;
        -webkit-animation-iteration-count: 1!important;
        animation-iteration-count: 1!important;
        scroll-behavior: auto!important;
        -webkit-transition-duration: .01ms!important;
        transition-duration: .01ms!important
    }
}

html.lenis,html.lenis body {
    height: auto
}

.lenis.lenis-smooth {
    scroll-behavior: auto!important
}

.lenis.lenis-smooth [data-lenis-prevent] {
    -ms-scroll-chaining: none;
    overscroll-behavior: contain
}

.lenis.lenis-stopped {
    overflow: hidden
}

.lenis.lenis-smooth iframe {
    pointer-events: none
}

@font-face {
    font-family: aeonik;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/aeonik/Aeonik-Regular.otf);
    src: url(../fonts/aeonik/Aeonik-Regulard41d.eot?#iefix) format("embedded-opentype"),url(../fonts/aeonik/Aeonik-Regular.woff2) format("woff2"),url(../fonts/aeonik/Aeonik-Regular.woff) format("woff"),url(../fonts/aeonik/Aeonik-Regular.ttf) format("truetype")
}

@font-face {
    font-family: aeonik;
    font-style: normal;
    font-weight: 500;
    src: url(../fonts/aeonik/Aeonik-Medium.otf);
    src: url(../fonts/aeonik/Aeonik-Mediumd41d.eot?#iefix) format("embedded-opentype"),url(../fonts/aeonik/Aeonik-Medium.woff2) format("woff2"),url(../fonts/aeonik/Aeonik-Medium.woff) format("woff"),url(../fonts/aeonik/Aeonik-Medium.ttf) format("truetype")
}

.splitting .word {
    display: inline-block;
    overflow: hidden
}

.splitting .char {
    display: inline-block;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: -webkit-transform 1s cubic-bezier(.3,.86,.36,.95);
    transition: -webkit-transform 1s cubic-bezier(.3,.86,.36,.95);
    transition: transform 1s cubic-bezier(.3,.86,.36,.95);
    transition: transform 1s cubic-bezier(.3,.86,.36,.95),-webkit-transform 1s cubic-bezier(.3,.86,.36,.95)
}

.image-zoom {
    -webkit-transform: translateZ(0) scale(1.2);
    transform: translateZ(0) scale(1.2)
}

.line {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: left;
    transform-origin: left
}

.fade,.fade-up {
    opacity: 0
}

.fade-up {
    -webkit-transform: translateY(15%);
    transform: translateY(15%)
}

@media only screen and (max-width: 1024px) {
    [data-parallax-image] {
        -webkit-transform:translateZ(0)!important;
        transform: translateZ(0)!important
    }
}

button,input,label,select,textarea {
    background: none;
    border: 0;
    border-radius: 0;
    display: inline-block;
    font-family: aeonik,Helvetica,Arial,sans-serif;
    font-size: 13px;
    line-height: 1;
    margin: 0;
    padding: 0;
    vertical-align: middle;
    white-space: normal
}

input:focus {
    outline: 0
}

input,textarea {
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

button,input[type=button],input[type=checkbox],input[type=radio],input[type=reset],input[type=submit],select {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=month],input[type=number],input[type=password],input[type=range],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week] {
    -webkit-font-smoothing: inherit!important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: 0;
    border-radius: 0;
    height: auto;
    margin: 0;
    outline: none;
    outline-color: transparent
}

input[type=checkbox] {
    -webkit-appearance: none;
    border: 1px solid gray;
    border-radius: 0;
    height: .9375rem;
    margin: 0 .6em 0 0;
    width: .9375rem
}

input[type=checkbox]:checked {
    background-image: url(../svg/check-solid.html);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 69%
}

input[type=radio] {
    border-radius: 0;
    height: 1.625rem;
    margin: 0;
    width: .9375rem
}

input[type=file] {
    -webkit-font-smoothing: inherit!important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: 0;
    height: auto;
    outline: none;
    outline-color: transparent
}

input[type=search] {
    -webkit-appearance: textfield;
    -webkit-box-sizing: content-box
}

input::-webkit-inner-spin-button,input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type=number] {
    -moz-appearance: textfield
}

::-webkit-search-decoration {
    display: none
}

button,input[type=button],input[type=reset],input[type=submit] {
    overflow: visible;
    width: auto
}

::-webkit-file-upload-button {
    background: none;
    border: 0;
    padding: 0
}

textarea {
    overflow: auto;
    vertical-align: top
}

select {
    -webkit-font-smoothing: inherit!important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: 0;
    height: auto;
    outline: none;
    outline-color: transparent
}

select[multiple] {
    vertical-align: top
}

.title-1,h1 {
    color: #141414;
    font: 400 2.25rem aeonik,Helvetica,Arial,sans-serif;
    line-height: .9
}

@media only screen and (min-width: 600px) {
    .title-1,h1 {
        font-size:4.5rem
    }
}

@media only screen and (min-width: 1024px) {
    .title-1,h1 {
        font-size:6.25rem
    }
}

.title-2,h2 {
    color: #141414;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.15
}

@media only screen and (min-width: 600px) {
    .title-2,h2 {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .title-2,h2 {
        font-size:3.75rem
    }
}

.title-3,h3 {
    color: #141414;
    font: 400 1.5rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.2
}

@media only screen and (min-width: 600px) {
    .title-3,h3 {
        font-size:2.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .title-3,h3 {
        font-size:2.75rem
    }
}

.title-4,h4 {
    font: 400 1.125rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.1
}

@media only screen and (min-width: 600px) {
    .title-4,h4 {
        font-size:1.5rem
    }
}

@media only screen and (min-width: 1024px) {
    .title-4,h4 {
        font-size:2rem
    }
}

.title-5,h5 {
    font: 400 1.125rem aeonik,Helvetica,Arial,sans-serif
}

@media only screen and (min-width: 600px) {
    .title-5,h5 {
        font-size:1.375rem
    }
}

@media only screen and (min-width: 1024px) {
    .title-5,h5 {
        font-size:1.5rem
    }
}

.title-6,h6 {
    font: 400 1rem aeonik,Helvetica,Arial,sans-serif
}

@media only screen and (min-width: 600px) {
    .title-6,h6 {
        font-size:1.125rem
    }
}

@media only screen and (min-width: 1024px) {
    .title-6,h6 {
        font-size:1.25rem
    }
}

body {
    color: #141414;
    font: 500 1rem/1.25 aeonik,Helvetica,Arial,sans-serif
}

.paragraph,p {
    color: #141414;
    font: 400 .875rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.1
}

@media only screen and (min-width: 600px) {
    .paragraph,p {
        font-size:1.0625rem
    }
}

@media only screen and (min-width: 1024px) {
    .paragraph,p {
        font-size:1.0625rem
    }
}

.list,ul {
    margin-bottom: 2em
}

.list li,ul li {
    color: #141414;
    font: 400 .875rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.1;
    line-height: 1.2;
    padding: .4em 0 .4em 25px;
    position: relative
}

@media only screen and (min-width: 600px) {
    .list li,ul li {
        font-size:1.0625rem
    }
}

@media only screen and (min-width: 1024px) {
    .list li,ul li {
        font-size:1.0625rem
    }
}

.list li:before,ul li:before {
    background-color: #141414;
    content: "";
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    top: 1em;
    width: 15px
}

ol {
    counter-reset: item;
    margin-bottom: 2em
}

ol li {
    color: #141414;
    font: 400 .875rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.1;
    line-height: 1.2;
    padding: .4em 0 .4em 25px;
    position: relative
}

@media only screen and (min-width: 600px) {
    ol li {
        font-size:1.0625rem
    }
}

@media only screen and (min-width: 1024px) {
    ol li {
        font-size:1.0625rem
    }
}

ol li:before {
    content: counter(item) ". ";
    counter-increment: item;
    display: block;
    font-weight: 500;
    left: 0;
    position: absolute;
    top: .4em
}

::-moz-selection {
    background-color: #dadada;
    border: 0;
    outline: none;
    text-shadow: none
}

::selection {
    background-color: #dadada;
    border: 0;
    outline: none;
    text-shadow: none
}

.container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 25px;
    padding-right: 25px
}

@media only screen and (min-width: 600px) {
    .container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

.page-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    min-height: 100%;
    position: relative
}

.header {
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 111
}

.header--small .header__container {
    padding-top: 15px
}

@media only screen and (min-width: 37.5rem) {
    .header--small .header__container {
        padding-top:20px
    }
}

.header--small .header__link {
    -webkit-transform: scale(.7);
    transform: scale(.7)
}

.header--hide .header__container {
    -webkit-transform: translateY(-105%);
    transform: translateY(-105%)
}

.header:has(.menu.menu--open) .header__container {
    -webkit-transform: none;
    transform: none
}

.header__container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-left: auto;
    margin-right: auto;
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 30px;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

@media only screen and (min-width: 600px) {
    .header__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .header__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .header__container {
        padding-top:40px
    }
}

.header__link {
    max-width: 160px;
    -webkit-transform-origin: center left;
    transform-origin: center left;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95);
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .header__link {
        max-width: 150px;
    }
}

.header__logo {
    width: 100%;
    will-change: transform
}

.header__logo--dark {
    display: none
}

.header__right {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    grid-gap: 40px;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-end;
    justify-content: flex-end
}

.header__language {
    left: 25px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95);
    z-index: 2
}

.header__language--open {
    opacity: 1;
    pointer-events: all
}

.header__language--open li a {
    color: #fff!important
}

@media only screen and (min-width: 37.5rem) {
    .header__language {
        display:block;
        left: 0;
        opacity: 1;
        pointer-events: all;
        position: relative
    }
}

.header__language .wpml-ls-legacy-list-horizontal {
    border: none;
    padding: 0
}

.header__language .wpml-ls-legacy-list-horizontal ul li:before {
    display: none
}

.header__language .wpml-ls-legacy-list-horizontal ul li a {
    color: #fff;
    font-size: .9375rem;
    font-weight: 500;
    padding: 0
}

@media only screen and (min-width: 64rem) {
    .header__language .wpml-ls-legacy-list-horizontal ul li a {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .header__language .wpml-ls-legacy-list-horizontal ul li a:hover {
        opacity: .4
    }
}

.header__menu {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    background-color: #141414;
    border-radius: 7px;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    padding: 15px 18px 15px 15px;
    position: relative;
    z-index: 2
}

@media only screen and (min-width: 37.5rem) {
    .header__menu {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .header__menu:hover {
        background-color: #fff;
        padding: 15px 25px
    }

    .header__menu:hover:after {
        -webkit-transform: translateX(10px);
        transform: translateX(10px)
    }

    .header__menu:hover .header__menu-open {
        color: #141414
    }

    .header__menu:hover .header__menu-close {
        left: 25px
    }

    .header__menu:hover .header__menu-line {
        background-color: #141414
    }
}

.header__menu--open {
    background-color: #fff
}

.header__menu--open .header__menu-open {
    opacity: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.header__menu--open .header__menu-close {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.header__menu--open .header__menu-icon {
    margin-left: 20px;
    -webkit-transform: scale(.6);
    transform: scale(.6)
}

.header__menu--open .header__menu-line {
    background-color: #141414
}

.header__menu--open .header__menu-line:first-of-type {
    -webkit-transform: rotate(45deg) translate(4px,4px);
    transform: rotate(45deg) translate(4px,4px)
}

.header__menu--open .header__menu-line:nth-of-type(2) {
    -webkit-transform: rotate(-45deg) translate(4px,-4px);
    transform: rotate(-45deg) translate(4px,-4px)
}

.header__menu-open {
    color: #fff
}

.header__menu-close,.header__menu-open {
    font-size: .9375rem;
    font-weight: 500;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

.header__menu-close {
    color: #141414;
    left: 15px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    -webkit-transform: translateY(50%);
    transform: translateY(50%)
}

.header__menu-icon {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    grid-gap: 10px;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    margin-left: 15px
}

.header__menu-icon,.header__menu-line {
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

.header__menu-line {
    background-color: #fff;
    height: 2px;
    width: 36px
}

.menu {
    -ms-overflow-style: none;
    background-color: #141414;
    -webkit-clip-path: polygon(0 0,50% 0,50% 0,100% 0,100% -100%,50% -100%,50% 0,0 0);
    clip-path: polygon(0 0,50% 0,50% 0,100% 0,100% -100%,50% -100%,50% 0,0 0);
    height: 100vh;
    left: 0;
    overflow: scroll;
    pointer-events: none;
    position: fixed;
    scrollbar-width: none;
    top: 0;
    -webkit-transition: .75s cubic-bezier(.3,.86,.36,.95);
    transition: .75s cubic-bezier(.3,.86,.36,.95);
    width: 100%;
    z-index: 1
}

.menu::-webkit-scrollbar {
    display: none
}

.menu--open {
    -webkit-clip-path: polygon(0 0,50% 0,50% 0,100% 0,100% 100%,50% 100%,50% 100%,0 100%);
    clip-path: polygon(0 0,50% 0,50% 0,100% 0,100% 100%,50% 100%,50% 100%,0 100%);
    pointer-events: all
}

@media only screen and (min-width: 64rem) {
    .menu {
        -webkit-box-align:center;
        -ms-flex-align: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-align-items: center;
        align-items: center;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: center;
        justify-content: center
    }
}

.menu__container {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .menu__container {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        grid-template-columns: repeat(2,1fr);
        padding-bottom: 130px;
        padding-top: 130px
    }
}

.menu__contact {
    align-self: flex-end;
    display: grid;
    grid-row: 2/3;
    grid-template-columns: 1fr;
    margin-left: auto;
    margin-right: auto;
    padding: 70px 25px;
    width: 100%
}

@media only screen and (min-width: 600px) {
    .menu__contact {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .menu__contact {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .menu__contact {
        grid-template-columns:repeat(2,1fr);
        padding-bottom: 100px;
        padding-top: 100px
    }
}

@media only screen and (min-width: 64rem) {
    .menu__contact {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        align-self: flex-start;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        grid-column: 1/2;
        grid-row: 1/2;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        max-width: none;
        padding: 0 16.66666%
    }
}

.menu__infos {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    grid-row: 1/2;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    margin-bottom: 40px
}

.menu__address {
    color: #fff;
    font-size: 1.0625rem;
    margin-bottom: 20px
}

@media only screen and (min-width: 64rem) {
    .menu__address {
        -webkit-transition:.4s cubic-bezier(.3,.86,.36,.95);
        transition: .4s cubic-bezier(.3,.86,.36,.95)
    }

    .menu__address:hover {
        opacity: .5
    }
}

.menu__email,.menu__phone {
    color: #fff;
    font-size: 1.0625rem
}

@media only screen and (min-width: 64rem) {
    .menu__email,.menu__phone {
        -webkit-transition:.4s cubic-bezier(.3,.86,.36,.95);
        transition: .4s cubic-bezier(.3,.86,.36,.95)
    }

    .menu__email:hover,.menu__phone:hover {
        opacity: .5
    }
}

.menu__social-medias {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    grid-gap: 5px;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    grid-row: 3/4;
    -webkit-justify-content: flex-start;
    justify-content: flex-start
}

@media only screen and (min-width: 37.5rem) {
    .menu__social-medias {
        grid-column:1/2;
        grid-row: 2/3
    }
}

@media only screen and (min-width: 64rem) {
    .menu__social-medias {
        margin-bottom:290px
    }
}

.menu__social-media {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 40px;
    -webkit-justify-content: center;
    justify-content: center;
    width: 40px
}

@media only screen and (min-width: 64rem) {
    .menu__social-media {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .menu__social-media:hover {
        opacity: .4;
        -webkit-transform: scale(.9);
        transform: scale(.9)
    }
}

.menu__policy {
    color: #fff;
    font-size: .875rem;
    grid-row: 2/3;
    margin-bottom: 40px
}

@media only screen and (min-width: 37.5rem) {
    .menu__policy {
        grid-column:2/3;
        grid-row: 1/2
    }
}

@media only screen and (min-width: 64rem) {
    .menu__policy {
        margin-bottom:0;
        -webkit-transition: .4s cubic-bezier(.3,.86,.36,.95);
        transition: .4s cubic-bezier(.3,.86,.36,.95)
    }

    .menu__policy:hover {
        opacity: .5
    }
}

.menu__menu {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    grid-gap: 20px;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    align-self: flex-start;
    border-bottom: 1px solid #676767;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    grid-row: 1/2;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    margin-left: auto;
    margin-right: auto;
    padding: 140px 25px 70px;
    width: 100%
}

@media only screen and (min-width: 600px) {
    .menu__menu {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .menu__menu {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .menu__menu {
        grid-gap:40px;
        padding-bottom: 100px;
        padding-top: 150px
    }
}

@media only screen and (min-width: 64rem) {
    .menu__menu {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        border-bottom: none;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: center;
        justify-content: center;
        max-width: none;
        padding: 0 16.66666%
    }

    .menu__menu:after {
        background-color: #676767;
        content: "";
        display: block;
        height: 100vh;
        left: 50%;
        position: fixed;
        top: 0;
        width: 1px
    }
}

.menu__link {
    color: #fff;
    font-size: 2rem;
    font-weight: 400
}

@media only screen and (min-width: 37.5rem) {
    .menu__link {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 64rem) {
    .menu__link {
        position:relative
    }

    .menu__link:after {
        background-color: #fff;
        bottom: -5px;
        content: "";
        display: block;
        height: 1px;
        left: 0;
        position: absolute;
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: left;
        transform-origin: left;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95);
        width: 100%
    }

    .menu__link:hover:after {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.transition {
    -webkit-animation-duration: .5s;
    animation-duration: .5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-timing-function: cubic-bezier(.3,.86,.36,.95);
    animation-timing-function: cubic-bezier(.3,.86,.36,.95);
    background-color: #e5e8e5;
    height: 100vh;
    left: 0;
    pointer-events: none;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1111
}

.transition--open {
    -webkit-animation-name: open-transition;
    animation-name: open-transition
}

@-webkit-keyframes open-transition {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes open-transition {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.transition--load {
    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
    -webkit-animation-name: load-transition;
    animation-name: load-transition
}

@-webkit-keyframes load-transition {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes load-transition {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.error404 .header__logo--white,.page-template-tp-contact .header__logo--white,.page-template-tp-policy .header__logo--white,.page-template-tp-products .header__logo--white,.single-products .header__logo--white {
    display: none
}

.error404 .header__logo--dark,.page-template-tp-contact .header__logo--dark,.page-template-tp-policy .header__logo--dark,.page-template-tp-products .header__logo--dark,.single-products .header__logo--dark {
    display: block
}

.error404 .header__language .wpml-ls-legacy-list-horizontal ul li a,.page-template-tp-contact .header__language .wpml-ls-legacy-list-horizontal ul li a,.page-template-tp-policy .header__language .wpml-ls-legacy-list-horizontal ul li a,.page-template-tp-products .header__language .wpml-ls-legacy-list-horizontal ul li a,.single-products .header__language .wpml-ls-legacy-list-horizontal ul li a {
    color: #141414
}

.page-template-tp-expertise .header__menu,.page-template-tp-projects .header__menu,.single-projects .header__menu {
    background-color: #fff
}

.page-template-tp-expertise .header__menu-close,.page-template-tp-expertise .header__menu-open,.page-template-tp-projects .header__menu-close,.page-template-tp-projects .header__menu-open,.single-projects .header__menu-close,.single-projects .header__menu-open {
    color: #141414
}

.page-template-tp-expertise .header__menu-line,.page-template-tp-projects .header__menu-line,.single-projects .header__menu-line {
    background-color: #141414
}

.cky-btn {
    border-radius: 7px!important
}

.footer {
    background-color: #141414;
    overflow: hidden;
    position: relative;
    width: 100%
}

.footer__line {
    background-color: #676767;
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    top: 0;
    width: 100vw
}

.footer__marquee {
    -webkit-animation: scrolling 20s linear infinite;
    animation: scrolling 20s linear infinite;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 30px 0;
    width: 100%
}

@-webkit-keyframes scrolling {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    to {
        -webkit-transform: translatex(-208vw);
        transform: translatex(-208vw)
    }
}

@keyframes scrolling {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    to {
        -webkit-transform: translatex(-208vw);
        transform: translatex(-208vw)
    }
}

@media only screen and (min-width: 37.5rem) {
    .footer__marquee {
        padding:35px 0
    }
}

.footer__logo-container {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100vw;
    -ms-flex: 0 0 100vw;
    flex: 0 0 100vw;
    margin: 0 2vw
}

.footer__logo {
    display: block;
    width: 100%
}

.footer__logo--dark {
    display: none
}

.footer__container {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 25px;
    padding-left: 25px;
    padding-right: 25px
}

@media only screen and (min-width: 600px) {
    .footer__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .footer__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .footer__container {
        grid-gap:16px;
        grid-template-columns: 3fr 2fr 1fr
    }
}

@media only screen and (min-width: 64rem) {
    .footer__container {
        grid-template-columns:repeat(7,2fr)
    }
}

.footer__container-line {
    background-color: #676767;
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    width: 100vw
}

.footer__contact {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    grid-column: 1/3;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    margin-bottom: 40px;
    margin-top: 40px;
    padding-right: 25%
}

@media only screen and (min-width: 37.5rem) {
    .footer__contact {
        grid-column:1/2;
        margin-bottom: 30px;
        margin-top: 50px;
        padding-right: 0
    }
}

@media only screen and (min-width: 64rem) {
    .footer__contact {
        grid-column:1/3;
        margin-bottom: 90px
    }
}

.footer__address {
    color: #fff;
    font-size: .9375rem;
    font-weight: 300;
    margin-bottom: 20px
}

@media only screen and (min-width: 64rem) {
    .footer__address {
        font-size:1.0625rem;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .footer__address:hover {
        opacity: .4
    }
}

.footer__phone {
    color: #fff;
    font-size: .9375rem;
    font-weight: 300
}

@media only screen and (min-width: 64rem) {
    .footer__phone {
        font-size:1.0625rem;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .footer__phone:hover {
        opacity: .4
    }
}

.footer__email {
    color: #fff;
    font-size: .9375rem;
    font-weight: 300;
    text-decoration: underline
}

@media only screen and (min-width: 64rem) {
    .footer__email {
        font-size:1.0625rem;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .footer__email:hover {
        opacity: .4
    }
}

.footer__menu {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    grid-gap: 10px;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start
}

@media only screen and (min-width: 37.5rem) {
    .footer__menu {
        margin-bottom:30px;
        margin-top: 50px
    }
}

@media only screen and (min-width: 64rem) {
    .footer__menu {
        margin-bottom:90px
    }
}

.footer__menu--main {
    grid-column: 1/2
}

@media only screen and (min-width: 37.5rem) {
    .footer__menu--main {
        grid-column:2/3
    }
}

@media only screen and (min-width: 64rem) {
    .footer__menu--main {
        grid-column:3/4;
        padding-left: 45%
    }
}

.footer__menu--secondary {
    grid-column: 2/3
}

@media only screen and (min-width: 37.5rem) {
    .footer__menu--secondary {
        grid-column:3/4
    }
}

@media only screen and (min-width: 64rem) {
    .footer__menu--secondary {
        grid-column:4/5;
        padding-left: 45%
    }
}

.footer__link {
    color: #fff;
    font-size: .9375rem;
    font-weight: 500
}

@media only screen and (min-width: 64rem) {
    .footer__link {
        font-size:1.0625rem;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .footer__link:hover {
        opacity: .4
    }
}

.footer__social-medias {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    grid-gap: 5px;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    grid-column: 1/3;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    margin-bottom: 40px;
    margin-top: 50px
}

@media only screen and (min-width: 37.5rem) {
    .footer__social-medias {
        grid-column:1/4;
        grid-row: 2/3;
        margin-bottom: 60px;
        margin-top: 0
    }
}

@media only screen and (min-width: 64rem) {
    .footer__social-medias {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        grid-column: 6/8;
        grid-row: 1/2;
        -webkit-justify-content: flex-end;
        justify-content: flex-end;
        margin-bottom: 90px;
        margin-top: 50px
    }
}

.footer__social-media {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 40px;
    -webkit-justify-content: center;
    justify-content: center;
    width: 40px
}

@media only screen and (min-width: 64rem) {
    .footer__social-media {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .footer__social-media:hover {
        opacity: .4;
        -webkit-transform: scale(.9);
        transform: scale(.9)
    }
}

.footer__end {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    grid-gap: 20px;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    grid-column: 1/3;
    -webkit-justify-content: center;
    justify-content: center;
    padding-top: 30px;
    position: relative
}

@media only screen and (min-width: 37.5rem) {
    .footer__end {
        grid-gap:15px;
        display: grid;
        grid-column: 1/4;
        grid-template-columns: repeat(2,1fr);
        padding-top: 25px
    }
}

@media only screen and (min-width: 64rem) {
    .footer__end {
        grid-column:1/8;
        grid-template-columns: repeat(3,1fr)
    }
}

.footer__end-line {
    background-color: #676767;
    display: block;
    height: 1px;
    left: -25px;
    position: absolute;
    top: 0;
    width: 100vw
}

@media only screen and (min-width: 37.5rem) {
    .footer__end-line {
        left:-50px
    }
}

@media only screen and (min-width: 64rem) {
    .footer__end-line {
        left:-30px
    }
}

@media only screen and (min-width: 1600px) {
    .footer__end-line {
        left:calc(-50vw - -770px)
    }
}

.footer__policies {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    grid-gap: 20px;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center
}

@media only screen and (min-width: 37.5rem) {
    .footer__policies {
        -webkit-box-orient:horizontal;
        -webkit-box-direction: normal;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        grid-column: 1/3;
        -webkit-justify-content: space-between;
        justify-content: space-between
    }
}

@media only screen and (min-width: 64rem) {
    .footer__policies {
        -webkit-box-pack:center;
        -ms-flex-pack: center;
        grid-gap: 35px;
        grid-column: 2/3;
        -webkit-justify-content: center;
        justify-content: center
    }
}

.footer__policy {
    color: #fff;
    font-size: .875rem;
    font-weight: 400;
    text-align: center
}

@media only screen and (min-width: 64rem) {
    .footer__policy {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .footer__policy:hover {
        opacity: .4
    }
}

.footer__copyright {
    color: #fff;
    font-size: .875rem;
    font-weight: 400;
    text-align: center
}

@media only screen and (min-width: 37.5rem) {
    .footer__copyright {
        text-align:left
    }
}

@media only screen and (min-width: 64rem) {
    .footer__copyright {
        grid-column:1/2;
        grid-row: 1/2
    }
}

.footer__credits {
    color: #fff;
    font-size: .875rem;
    font-weight: 400;
    text-align: center
}

@media only screen and (min-width: 37.5rem) {
    .footer__credits {
        text-align:right
    }
}

@media only screen and (min-width: 64rem) {
    .footer__credits {
        grid-column:3/4;
        grid-row: 1/2
    }
}

.footer__credits a {
    color: #fff
}

@media only screen and (min-width: 64rem) {
    .footer__credits a {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .footer__credits a:hover {
        opacity: .4
    }
}

.error404 .footer,.page-template-tp-contact .footer,.page-template-tp-policy .footer,.page-template-tp-products .footer,.single-products .footer {
    background-color: #fff;
    border-color: #676767
}

.error404 .footer__marquee,.page-template-tp-contact .footer__marquee,.page-template-tp-policy .footer__marquee,.page-template-tp-products .footer__marquee,.single-products .footer__marquee {
    border-color: #676767
}

.error404 .footer__logo--white,.page-template-tp-contact .footer__logo--white,.page-template-tp-policy .footer__logo--white,.page-template-tp-products .footer__logo--white,.single-products .footer__logo--white {
    display: none
}

.error404 .footer__logo--dark,.page-template-tp-contact .footer__logo--dark,.page-template-tp-policy .footer__logo--dark,.page-template-tp-products .footer__logo--dark,.single-products .footer__logo--dark {
    display: block
}

.error404 .footer__address,.error404 .footer__copyright,.error404 .footer__credits,.error404 .footer__credits a,.error404 .footer__email,.error404 .footer__link,.error404 .footer__phone,.error404 .footer__policy,.page-template-tp-contact .footer__address,.page-template-tp-contact .footer__copyright,.page-template-tp-contact .footer__credits,.page-template-tp-contact .footer__credits a,.page-template-tp-contact .footer__email,.page-template-tp-contact .footer__link,.page-template-tp-contact .footer__phone,.page-template-tp-contact .footer__policy,.page-template-tp-policy .footer__address,.page-template-tp-policy .footer__copyright,.page-template-tp-policy .footer__credits,.page-template-tp-policy .footer__credits a,.page-template-tp-policy .footer__email,.page-template-tp-policy .footer__link,.page-template-tp-policy .footer__phone,.page-template-tp-policy .footer__policy,.page-template-tp-products .footer__address,.page-template-tp-products .footer__copyright,.page-template-tp-products .footer__credits,.page-template-tp-products .footer__credits a,.page-template-tp-products .footer__email,.page-template-tp-products .footer__link,.page-template-tp-products .footer__phone,.page-template-tp-products .footer__policy,.single-products .footer__address,.single-products .footer__copyright,.single-products .footer__credits,.single-products .footer__credits a,.single-products .footer__email,.single-products .footer__link,.single-products .footer__phone,.single-products .footer__policy {
    color: #141414
}

.error404 .footer__social-media,.page-template-tp-contact .footer__social-media,.page-template-tp-policy .footer__social-media,.page-template-tp-products .footer__social-media,.single-products .footer__social-media {
    -webkit-filter: invert(1);
    filter: invert(1)
}

.error404 .footer__end:before,.page-template-tp-contact .footer__end:before,.page-template-tp-policy .footer__end:before,.page-template-tp-products .footer__end:before,.single-products .footer__end:before {
    background-color: #676767
}

.projects {
    background-color: #141414;
    position: relative
}

.projects__line {
    background-color: #676767;
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    top: 0;
    width: 100vw
}

.projects__container {
    margin-left: auto;
    margin-right: auto;
    padding: 70px 25px
}

@media only screen and (min-width: 600px) {
    .projects__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .projects__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .projects__container {
        padding-bottom:100px;
        padding-top: 100px
    }
}

@media only screen and (min-width: 64rem) {
    .projects__container {
        padding-bottom:90px;
        padding-top: 90px
    }
}

.projects__header {
    margin-bottom: 70px
}

@media only screen and (min-width: 37.5rem) {
    .projects__header {
        margin-bottom:100px
    }
}

@media only screen and (min-width: 64rem) {
    .projects__header {
        grid-gap:16px;
        display: grid;
        grid-template-columns: 7fr 5fr;
        margin-bottom: 80px
    }
}

.projects__title {
    color: #141414;
    color: #fff;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.15;
    line-height: 1.1;
    margin-bottom: 20px;
    width: 100%
}

@media only screen and (min-width: 600px) {
    .projects__title {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .projects__title {
        font-size:3.75rem
    }
}

.projects__title .word {
    height: 1.2em;
    margin: -.2em 0
}

@media only screen and (min-width: 37.5rem) {
    .projects__title {
        width:83.33333%
    }
}

@media only screen and (min-width: 64rem) {
    .projects__title {
        margin-bottom:0;
        width: 70%
    }
}

.projects__text {
    color: #fff;
    margin-bottom: 40px;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .projects__text {
        width:83.33333%
    }
}

@media only screen and (min-width: 64rem) {
    .projects__text {
        margin-bottom:15px;
        width: 90%
    }
}

.projects__button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #2c2c2c;
    border-radius: 7px;
    color: #fff;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 17px 20px
}

@media only screen and (min-width: 37.5rem) {
    .projects__button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .projects__button:hover {
        background-color: #fff;
        color: #141414;
        padding: 17px 40px
    }

    .projects__button:hover:after {
        -webkit-transform: translateX(10px);
        transform: translateX(10px)
    }
}

.projects__button:after {
    background-image: url(../svg/technoprofil-arrow.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    margin-left: 50px;
    width: 10px
}

@media only screen and (min-width: 37.5rem) {
    .projects__button:after {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }
}

.projects__projects {
    height: calc(700dvh - 1860px);
    position: relative;
    width: 100%
}

.projects__project {
    overflow-clip-margin: .5px;
    border-radius: 20px;
    display: block;
    margin-left: -15px;
    overflow: hidden;
    overflow: clip;
    position: -webkit-sticky;
    position: sticky;
    top: 60px;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: calc(100% + 30px)
}

@media only screen and (min-width: 37.5rem) {
    .projects__project {
        margin-left:-35px;
        width: calc(100% + 70px)
    }
}

@media only screen and (min-width: 64rem) {
    .projects__project {
        margin-left:-20px;
        width: calc(100% + 40px)
    }
}

.projects__project:first-of-type {
    top: 40px
}

.projects__project:nth-of-type(2) {
    top: 80px
}

.projects__project:nth-of-type(3) {
    top: 120px
}

.projects__project:nth-of-type(4) {
    top: 160px
}

.projects__project:nth-of-type(5) {
    top: 200px
}

.projects__project:nth-of-type(6) {
    top: 240px
}

.projects__project:nth-of-type(7) {
    top: 280px
}

.projects__project:nth-of-type(8) {
    top: 320px
}

.projects__project:nth-of-type(9) {
    top: 360px
}

.projects__project:nth-of-type(10) {
    top: 400px
}

.projects__project:first-of-type .projects__project-background {
    background-color: #fff
}

.projects__project:nth-of-type(2) .projects__project-background {
    background-color: #eaeaea
}

.projects__project:nth-of-type(3) .projects__project-background {
    background-color: #ddd
}

.projects__project:nth-of-type(4) .projects__project-background {
    background-color: #d3d3d3
}

.projects__project:nth-of-type(5) .projects__project-background {
    background-color: #c3c3c3
}

.projects__project:nth-of-type(6) .projects__project-background {
    background-color: #b3b3b3
}

.projects__project:after {
    content: "";
    display: block;
    padding-bottom: calc(100dvh - 320px)
}

.projects__project:not(.projects__project:first-of-type) {
    margin-top: 60px
}

.projects__project-content {
    height: 100%;
    left: 0;
    padding: 20px;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2
}

@media only screen and (min-width: 37.5rem) {
    .projects__project-content {
        padding:35px
    }
}

@media only screen and (min-width: 64rem) {
    .projects__project-content {
        padding:40px
    }
}

.projects__project-gradient--top {
    background: -webkit-gradient(linear,left top,left bottom,from(#141414),to(transparent));
    background: linear-gradient(180deg,#141414,transparent);
    content: "";
    display: block;
    height: 100px;
    left: 0;
    opacity: .6;
    position: absolute;
    top: 0;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .projects__project-gradient--top {
        height:200px
    }
}

.projects__project-gradient--bottom {
    background: -webkit-gradient(linear,left bottom,left top,from(#141414),to(transparent));
    background: linear-gradient(0deg,#141414,transparent);
    bottom: 0;
    content: "";
    display: block;
    height: 100px;
    left: 0;
    opacity: .6;
    position: absolute;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .projects__project-gradient--bottom {
        height:200px
    }
}

.projects__project-title {
    color: #fff;
    position: absolute;
    right: 20px;
    text-align: right;
    top: 20px;
    width: calc(100% - 40px)
}

@media only screen and (min-width: 37.5rem) {
    .projects__project-title {
        right:35px;
        top: 35px;
        width: calc(100% - 70px)
    }
}

@media only screen and (min-width: 64rem) {
    .projects__project-title {
        right:40px;
        top: 35px;
        width: 50%
    }
}

.projects__project-type-container {
    grid-gap: 8px;
    bottom: 20px;
    display: grid;
    grid-template-columns: auto 1fr;
    left: 20px;
    position: absolute;
    z-index: 2
}

@media only screen and (min-width: 37.5rem) {
    .projects__project-type-container {
        bottom:45px;
        left: 35px
    }
}

@media only screen and (min-width: 64rem) {
    .projects__project-type-container {
        bottom:40px;
        left: 40px
    }
}

.projects__project-type {
    color: #fff;
    padding-top: 7px
}

@media only screen and (min-width: 37.5rem) {
    .projects__project-type {
        padding-top:0
    }
}

.projects__project-button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #141414;
    background-color: #fff;
    border-radius: 7px;
    bottom: 20px;
    color: #fff;
    color: #141414;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 17px;
    position: absolute;
    right: 20px;
    z-index: 2
}

@media only screen and (min-width: 37.5rem) {
    .projects__project-button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .projects__project-button:hover {
        background-color: #141414;
        color: #fff;
        padding: 10px 35px
    }

    .projects__project-button {
        bottom: 35px;
        padding: 10px 25px;
        right: 35px
    }
}

@media only screen and (min-width: 64rem) {
    .projects__project-button {
        bottom:40px;
        right: 40px
    }
}

.projects__project-button span {
    display: none
}

@media only screen and (min-width: 37.5rem) {
    .projects__project-button span {
        display:inline-block
    }
}

.projects__project-button:after {
    background-image: url(../svg/technoprofil-arrow.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    margin-left: 0;
    width: 10px
}

@media only screen and (min-width: 37.5rem) {
    .projects__project-button:after {
        display:none
    }
}

.projects__project-image {
    background-color: #141414;
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1
}

.projects__project-background {
    background-color: #141414;
    height: calc(100% - 2px);
    left: 1px;
    position: absolute;
    top: 1px;
    width: calc(100% - 2px)
}

.projects__all-container {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    margin-top: 40px;
    width: 100%
}

.projects__all,.projects__all-container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.projects__all {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    background-color: #2c2c2c;
    border-radius: 7px;
    color: #fff;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 17px 20px
}

@media only screen and (min-width: 37.5rem) {
    .projects__all {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .projects__all:hover {
        background-color: #fff;
        color: #141414;
        padding: 17px 40px
    }

    .projects__all:hover:after {
        -webkit-transform: translateX(10px);
        transform: translateX(10px)
    }
}

.projects__all:after {
    background-image: url(../svg/technoprofil-arrow.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    margin-left: 50px;
    width: 10px
}

@media only screen and (min-width: 37.5rem) {
    .projects__all:after {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }
}

.single-products .projects {
    background-color: #fff;
    border-top: 1px solid #141414
}

.single-products .projects__text,.single-products .projects__title {
    color: #141414
}

.cta {
    background-color: #141414
}

.cta__container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    padding: 100px 25px
}

@media only screen and (min-width: 600px) {
    .cta__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .cta__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .cta__container {
        padding-bottom:200px;
        padding-top: 200px
    }
}

.cta__title {
    color: #fff;
    margin-bottom: 30px;
    text-align: center
}

@media only screen and (min-width: 37.5rem) {
    .cta__title {
        margin-bottom:40px;
        max-width: 600px;
        width: 50%
    }
}

.cta__button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #2c2c2c;
    border-radius: 7px;
    color: #fff;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 17px 20px
}

@media only screen and (min-width: 37.5rem) {
    .cta__button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .cta__button:hover {
        background-color: #fff;
        color: #141414;
        padding: 17px 40px
    }

    .cta__button:hover:after {
        -webkit-transform: translateX(10px);
        transform: translateX(10px)
    }
}

.cta__button:after {
    background-image: url(../svg/technoprofil-arrow.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    margin-left: 50px;
    width: 10px
}

@media only screen and (min-width: 37.5rem) {
    .cta__button:after {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }
}

.page-template-tp-products .cta,.single-products .cta {
    background-color: #fff
}

.page-template-tp-products .cta__title,.single-products .cta__title {
    color: #141414
}

@media only screen and (min-width: 64rem) {
    .page-template-tp-products .cta__button:hover,.single-products .cta__button:hover {
        background-color:#e5e8e5
    }
}

.home-hero {
    overflow: hidden;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.home-hero:after {
    background: -webkit-gradient(linear,left bottom,left top,from(#141414),to(transparent));
    background: linear-gradient(0deg,#141414,transparent);
    bottom: 0;
    content: "";
    display: block;
    height: 550px;
    left: 0;
    opacity: .5;
    position: absolute;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .home-hero:after {
        height:320px
    }
}

.home-hero__container {
    margin-left: auto;
    margin-right: auto;
    padding: 200px 25px 25px;
    position: relative;
    z-index: 1
}

@media only screen and (min-width: 600px) {
    .home-hero__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .home-hero__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .home-hero__container {
        padding-bottom:50px;
        padding-top: 500px
    }
}

@media only screen and (min-width: 64rem) {
    .home-hero__container {
        padding-bottom:30px;
        padding-top: 350px
    }
}

.home-hero__title {
    color: #fff;
    margin-bottom: 60px;
    width: 100%
}

.home-hero__title .char {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

@media only screen and (min-width: 37.5rem) {
    .home-hero__title {
        margin-bottom:60px
    }
}

@media only screen and (min-width: 64rem) {
    .home-hero__title {
        margin-bottom:130px
    }
}

.home-hero__infos {
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .home-hero__infos {
        grid-gap:16px;
        display: grid;
        grid-template-columns: repeat(2,1fr)
    }
}

@media only screen and (min-width: 64rem) {
    .home-hero__infos {
        grid-template-columns:9fr 5fr
    }
}

@media only screen and (min-width: 1200px) {
    .home-hero__infos {
        grid-template-columns:9fr 3fr
    }
}

.home-hero__text-container {
    grid-gap: 32px;
    display: grid;
    grid-template-columns: auto 1fr;
    margin-bottom: 40px;
    padding-top: 20px;
    position: relative
}

@media only screen and (min-width: 37.5rem) {
    .home-hero__text-container {
        margin-bottom:0;
        padding-right: 50px;
        padding-top: 30px
    }
}

.home-hero__line {
    background-color: #e5e8e5;
    display: block;
    height: 1px;
    left: 0;
    opacity: .3;
    position: absolute;
    top: 0;
    width: 100%
}

.home-hero__text {
    color: #fff;
    font-size: .8125rem;
    font-weight: 500
}

@media only screen and (min-width: 37.5rem) {
    .home-hero__text {
        font-size:1.0625rem
    }
}

@media only screen and (min-width: 64rem) {
    .home-hero__text {
        max-width:500px
    }
}

.home-hero__video-container {
    border-radius: 10px;
    cursor: pointer;
    overflow: hidden;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .home-hero__video-container:hover .home-hero__video {
        -webkit-transform:scale(1.05);
        transform: scale(1.05)
    }

    .home-hero__video-container:hover .home-hero__play {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }
}

.home-hero__video {
    pointer-events: none;
    -webkit-transition: .75s cubic-bezier(.3,.86,.36,.95);
    transition: .75s cubic-bezier(.3,.86,.36,.95)
}

.home-hero__play {
    bottom: 10px;
    pointer-events: none;
    position: absolute;
    right: 10px;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95);
    z-index: 1
}

.home-hero__image-container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border-top-right-radius: 50px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 100%;
    -webkit-justify-content: center;
    justify-content: center;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100%
}

.home-hero__image-container:before {
    background-color: #141414;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    opacity: .3;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1
}

.home-hero__image {
    height: 120%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: -10%;
    width: 100%
}

.video-lightbox {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 100vh;
    -webkit-justify-content: center;
    justify-content: center;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    top: 0;
    -webkit-transition: .75s cubic-bezier(.3,.86,.36,.95) .15s;
    transition: .75s cubic-bezier(.3,.86,.36,.95) .15s;
    width: 100%;
    z-index: 1111
}

.video-lightbox--open {
    opacity: 1;
    pointer-events: all;
    -webkit-transition: .75s cubic-bezier(.3,.86,.36,.95) 0s;
    transition: .75s cubic-bezier(.3,.86,.36,.95) 0s
}

.video-lightbox--open .video-lightbox__video {
    opacity: 1;
    pointer-events: all;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .15s;
    transition: .5s cubic-bezier(.3,.86,.36,.95) .15s
}

.video-lightbox__close {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #141414;
    background-color: #fff;
    border-radius: 7px;
    color: #fff;
    color: #141414;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 10px 25px;
    position: absolute;
    right: 20px;
    top: 20px;
    z-index: 1
}

@media only screen and (min-width: 37.5rem) {
    .video-lightbox__close {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .video-lightbox__close:hover {
        background-color: #141414;
        color: #fff;
        padding: 10px 35px
    }
}

.video-lightbox__container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 100%;
    -webkit-justify-content: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    max-height: 100%;
    padding: 70px 25px;
    pointer-events: none;
    position: relative;
    width: 100%;
    z-index: 1
}

@media only screen and (min-width: 600px) {
    .video-lightbox__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .video-lightbox__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .video-lightbox__container {
        padding-bottom:100px;
        padding-top: 100px
    }
}

.video-lightbox__video {
    border-radius: 10px;
    height: 100%;
    opacity: 0;
    overflow: hidden;
    -webkit-transform: scale(.9);
    transform: scale(.9);
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) 0s;
    transition: .5s cubic-bezier(.3,.86,.36,.95) 0s;
    width: 75%
}

.video-lightbox__background {
    background-color: #141414ee;
    cursor: pointer;
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.home-about {
    background-color: #141414
}

.home-about__container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 70px
}

@media only screen and (min-width: 600px) {
    .home-about__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .home-about__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .home-about__container {
        padding-top:100px
    }
}

@media only screen and (min-width: 64rem) {
    .home-about__container {
        padding-bottom:200px;
        padding-top: 115px;
        position: relative
    }
}

.home-about__title-container {
    margin-bottom: 70px
}

@media only screen and (min-width: 37.5rem) {
    .home-about__title-container {
        margin-bottom:100px
    }
}

@media only screen and (min-width: 64rem) {
    .home-about__title-container {
        margin-bottom:50px;
        position: relative;
        z-index: 1
    }
}

.home-about__title {
    color: #141414;
    color: #fff;
    font: 400 1.5rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.2;
    margin-bottom: 20px
}

@media only screen and (min-width: 600px) {
    .home-about__title {
        font-size:2.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .home-about__title {
        font-size:2.75rem
    }
}

@media only screen and (min-width: 37.5rem) {
    .home-about__title {
        margin-bottom:40px
    }
}

@media only screen and (min-width: 64rem) {
    .home-about__title {
        width:66.66666%
    }
}

.home-about__button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #2c2c2c;
    border-radius: 7px;
    color: #fff;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 17px 20px
}

@media only screen and (min-width: 37.5rem) {
    .home-about__button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .home-about__button:hover {
        background-color: #fff;
        color: #141414;
        padding: 17px 40px
    }

    .home-about__button:hover:after {
        -webkit-transform: translateX(10px);
        transform: translateX(10px)
    }
}

.home-about__button:after {
    background-image: url(../svg/technoprofil-arrow.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    margin-left: 50px;
    width: 10px
}

@media only screen and (min-width: 37.5rem) {
    .home-about__button:after {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }
}

.home-about__list {
    border-top: 1px solid #676767
}

@media only screen and (min-width: 64rem) {
    .home-about__list {
        margin-left:58.33333%;
        position: relative;
        width: 41.66666%;
        z-index: 1
    }

    .home-about__list:hover .home-about__service-title {
        color: #676767
    }
}

.home-about__item {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-align-items: center;
    align-items: center;
    border-bottom: 1px solid #676767;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    padding: 15px 0;
    position: relative;
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .home-about__item:hover .home-about__service-title {
        color:#fff
    }

    .home-about__item:hover .home-about__service-image {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.home-about__item:after {
    background-image: url(../svg/technoprofil-arrow.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    width: 10px
}

.home-about__service-title {
    color: #fff;
    font-size: 1.125rem;
    font-weight: 400;
    position: relative;
    width: 75%;
    z-index: 1
}

@media only screen and (min-width: 37.5rem) {
    .home-about__service-title {
        font-size:1.375rem;
        width: 80%
    }
}

@media only screen and (min-width: 64rem) {
    .home-about__service-title {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }
}

.home-about__service-image {
    border-radius: 10px;
    display: none;
    height: 144px;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    width: 212px
}

@media only screen and (min-width: 64rem) {
    .home-about__service-image {
        display:block;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        right: 90px;
        -webkit-transform: scale(.7);
        transform: scale(.7);
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }
}

.home-about__image {
    margin-left: -25px;
    mix-blend-mode: lighten;
    width: 100vw
}

@media only screen and (min-width: 37.5rem) {
    .home-about__image {
        margin-left:-50px
    }
}

@media only screen and (min-width: 64rem) {
    .home-about__image {
        bottom:0;
        height: 650px;
        left: 0;
        margin-left: 0;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center;
        position: absolute;
        width: 58.33333%
    }
}

.home-know-how {
    background-color: #141414;
    position: relative
}

.home-know-how__container {
    margin-left: auto;
    margin-right: auto;
    padding: 95px 25px;
    position: relative;
    z-index: 1
}

@media only screen and (min-width: 600px) {
    .home-know-how__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .home-know-how__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .home-know-how__container {
        padding-bottom:200px;
        padding-top: 200px
    }
}

@media only screen and (min-width: 64rem) {
    .home-know-how__container {
        padding-bottom:220px;
        padding-top: 220px
    }
}

.home-know-how__title {
    color: #141414;
    color: #fff;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    font-size: 2.5rem;
    line-height: 1.15;
    line-height: .95;
    text-align: center;
    width: 100%
}

@media only screen and (min-width: 600px) {
    .home-know-how__title {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .home-know-how__title {
        font-size:3.75rem
    }
}

.home-know-how__title .word {
    height: 1.2em;
    margin: -.2em 0
}

@media only screen and (min-width: 37.5rem) {
    .home-know-how__title {
        font-size:5rem
    }
}

@media only screen and (min-width: 64rem) {
    .home-know-how__title {
        font-size:5.625rem;
        margin: 0 12.5%;
        width: 75%
    }
}

@media only screen and (min-width: 1400px) {
    .home-know-how__title {
        font-size:7.5rem;
        margin: 0 16.66666%;
        width: 66.66666%
    }
}

.home-know-how__image-container {
    border-top-right-radius: 50px;
    height: 100%;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .home-know-how__image-container {
        border-top-right-radius:70px
    }
}

.home-know-how__image {
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: 0;
    width: 100%
}

.home-products {
    background-color: #141414;
    position: relative
}

.home-products__container {
    display: grid;
    grid-template-columns: 1fr;
    margin-left: auto;
    margin-right: auto;
    padding: 70px 25px
}

@media only screen and (min-width: 600px) {
    .home-products__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .home-products__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .home-products__container {
        grid-template-columns:repeat(3,1fr);
        padding-bottom: 100px;
        padding-top: 100px
    }
}

@media only screen and (min-width: 64rem) {
    .home-products__container {
        grid-template-columns:repeat(4,1fr);
        padding-bottom: 135px
    }
}

.home-products__sub-title {
    color: #fff;
    font-size: .9375rem;
    font-weight: 400;
    grid-row: 1/2;
    margin-bottom: 55px;
    padding-right: 50%;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .home-products__sub-title {
        font-size:1.1875rem;
        grid-column: 1/4;
        margin-bottom: 65px
    }
}

@media only screen and (min-width: 64rem) {
    .home-products__sub-title {
        grid-column:1/5;
        margin-bottom: 25px;
        padding-right: 75%
    }
}

.home-products__line {
    background-color: #676767;
    content: "";
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    width: 100vw
}

.home-products__sub-title-text {
    position: relative;
    top: 15px
}

.home-products__header {
    grid-row: 2/3;
    margin-bottom: 70px
}

@media only screen and (min-width: 37.5rem) {
    .home-products__header {
        grid-column:1/4;
        margin-bottom: 50px
    }
}

@media only screen and (min-width: 64rem) {
    .home-products__header {
        grid-column:3/5;
        margin-bottom: 70px;
        margin-top: 50px;
        padding-left: 16.66666%
    }
}

.home-products__title {
    color: #141414;
    color: #fff;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.15;
    line-height: 1.1;
    margin-bottom: 20px;
    width: 100%
}

@media only screen and (min-width: 600px) {
    .home-products__title {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .home-products__title {
        font-size:3.75rem
    }
}

.home-products__title .word {
    height: 1.2em;
    margin: -.2em 0
}

@media only screen and (min-width: 37.5rem) {
    .home-products__title {
        width:83.33333%
    }
}

@media only screen and (min-width: 64rem) {
    .home-products__title {
        margin-bottom:15px;
        width: 100%
    }
}

.home-products__text {
    color: #fff;
    line-height: 1.25;
    margin-bottom: 40px;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .home-products__text {
        width:83.33333%
    }
}

@media only screen and (min-width: 64rem) {
    .home-products__text {
        width:80%
    }
}

.home-products__button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #2c2c2c;
    border-radius: 7px;
    color: #fff;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 17px 20px
}

@media only screen and (min-width: 37.5rem) {
    .home-products__button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .home-products__button:hover {
        background-color: #fff;
        color: #141414;
        padding: 17px 40px
    }

    .home-products__button:hover:after {
        -webkit-transform: translateX(10px);
        transform: translateX(10px)
    }
}

.home-products__button:after {
    background-image: url(../svg/technoprofil-arrow.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    margin-left: 50px;
    width: 10px
}

@media only screen and (min-width: 37.5rem) {
    .home-products__button:after {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }
}

.home-products__image {
    border-top-left-radius: 70px;
    grid-row: 9/10;
    margin-top: 30px;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .home-products__image {
        grid-column:1/4;
        grid-row: 3/4;
        margin-bottom: 50px;
        margin-left: 33.33333%;
        margin-top: 0;
        width: 66.66666%
    }
}

@media only screen and (min-width: 64rem) {
    .home-products__image {
        grid-column:1/3;
        grid-row: 2/4;
        height: 100%;
        margin-bottom: 0;
        margin-left: 0;
        padding-bottom: 15px;
        width: 100%
    }
}

.home-products__product-container {
    margin-bottom: 20px;
    width: 75%
}

@media only screen and (min-width: 37.5rem) {
    .home-products__product-container {
        margin-bottom:0;
        width: 100%
    }
}

.home-products__product-container:nth-of-type(odd) {
    margin-left: 25%
}

@media only screen and (min-width: 37.5rem) {
    .home-products__product-container:nth-of-type(odd) {
        margin-left:0
    }

    .home-products__product-container:nth-of-type(2) {
        grid-column: 1/2;
        grid-row: 4/5
    }
}

@media only screen and (min-width: 64rem) {
    .home-products__product-container:nth-of-type(2) {
        grid-column:4/5;
        grid-row: 3/4
    }
}

@media only screen and (min-width: 37.5rem) {
    .home-products__product-container:nth-of-type(3) {
        grid-column:3/4;
        grid-row: 4/5
    }
}

@media only screen and (min-width: 64rem) {
    .home-products__product-container:nth-of-type(3) {
        grid-column:1/2;
        grid-row: 4/5
    }
}

@media only screen and (min-width: 37.5rem) {
    .home-products__product-container:nth-of-type(4) {
        grid-column:2/3;
        grid-row: 5/6
    }
}

@media only screen and (min-width: 64rem) {
    .home-products__product-container:nth-of-type(4) {
        grid-column:3/4;
        grid-row: 4/5
    }
}

@media only screen and (min-width: 37.5rem) {
    .home-products__product-container:nth-of-type(5) {
        grid-column:1/2;
        grid-row: 6/7
    }
}

@media only screen and (min-width: 64rem) {
    .home-products__product-container:nth-of-type(5) {
        grid-column:2/3;
        grid-row: 5/6
    }
}

@media only screen and (min-width: 37.5rem) {
    .home-products__product-container:nth-of-type(6) {
        grid-column:3/4;
        grid-row: 6/7
    }
}

@media only screen and (min-width: 64rem) {
    .home-products__product-container:nth-of-type(6) {
        grid-column:4/5;
        grid-row: 5/6
    }
}

.home-products__product {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border-radius: 20px;
    display: block;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100%
}

.home-products__product:after {
    content: "";
    display: block;
    padding-bottom: 100%
}

@media only screen and (min-width: 64rem) {
    .home-products__product:hover .card-infos {
        opacity:1
    }

    .home-products__product:hover .card-title {
        opacity: 0;
        -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95) 0s;
        transition: .3s cubic-bezier(.3,.86,.36,.95) 0s
    }

    .home-products__product:hover .card-button-container {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .2s;
        transition: .5s cubic-bezier(.3,.86,.36,.95) .2s
    }

    .home-products__product:hover .card-button-container:after {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .3s;
        transition: .5s cubic-bezier(.3,.86,.36,.95) .3s
    }

    .home-products__product:hover .card-background {
        -webkit-transform: scaleY(1);
        transform: scaleY(1)
    }
}

.home-products__product .card-image {
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: 0;
    width: 100%
}

.home-products__product .card-number {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .875rem;
    font-weight: 300;
    height: 40px;
    -webkit-justify-content: center;
    justify-content: center;
    left: 20px;
    position: absolute;
    top: 20px;
    width: 40px;
    z-index: 2
}

@media only screen and (min-width: 64rem) {
    .home-products__product .card-number {
        left:30px;
        top: 30px
    }
}

.home-products__product .card-infos {
    display: none
}

@media only screen and (min-width: 64rem) {
    .home-products__product .card-infos {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        color: #fff;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        font-size: .875rem;
        font-weight: 400;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        left: 30px;
        line-height: 1.4;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        top: 110px;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95);
        width: calc(100% - 60px);
        z-index: 2
    }

    .home-products__product .card-infos strong {
        font-weight: 600
    }
}

.home-products__product .card-title {
    grid-gap: 15px;
    border-top: 1px solid #f7f8f7;
    bottom: 20px;
    color: #fff;
    display: grid;
    font-size: .9375rem;
    font-weight: 500;
    grid-template-columns: 1fr auto;
    left: 20px;
    padding-top: 15px;
    position: absolute;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .2s;
    transition: .5s cubic-bezier(.3,.86,.36,.95) .2s;
    width: calc(100% - 40px);
    z-index: 2
}

@media only screen and (min-width: 37.5rem) {
    .home-products__product .card-title {
        font-size:1.1875rem
    }
}

@media only screen and (min-width: 64rem) {
    .home-products__product .card-title {
        bottom:30px;
        font-size: 1.375rem;
        left: 30px;
        width: calc(100% - 60px)
    }
}

.home-products__product .card-button-container {
    display: none
}

@media only screen and (min-width: 64rem) {
    .home-products__product .card-button-container {
        bottom:20px;
        left: 30px;
        opacity: 0;
        padding-top: 12px;
        -webkit-transform: translateY(10px);
        transform: translateY(10px);
        width: calc(100% - 60px);
        z-index: 2
    }

    .home-products__product .card-button-container,.home-products__product .card-button-container:after {
        display: block;
        position: absolute;
        -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95) 0s;
        transition: .3s cubic-bezier(.3,.86,.36,.95) 0s
    }

    .home-products__product .card-button-container:after {
        background-color: #f7f8f7;
        content: "";
        height: 1px;
        left: 0;
        top: 0;
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: left;
        transform-origin: left;
        width: 100%
    }
}

.home-products__product .card-button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #141414;
    background-color: #fff;
    border-radius: 7px;
    color: #fff;
    color: #141414;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 10px 25px
}

@media only screen and (min-width: 37.5rem) {
    .home-products__product .card-button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .home-products__product .card-button:hover {
        background-color: #141414;
        color: #fff;
        padding: 10px 35px
    }
}

.home-products__product .card-background {
    display: none
}

@media only screen and (min-width: 64rem) {
    .home-products__product .card-background {
        background-color:#000;
        display: block;
        height: 100%;
        left: 0;
        pointer-events: none;
        position: absolute;
        top: 0;
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: top;
        transform-origin: top;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95);
        width: 100%;
        z-index: 1
    }
}

.home-products__product:after {
    padding-bottom: 110%
}

@media only screen and (min-width: 37.5rem) {
    .home-products__product:after {
        padding-bottom:120%
    }
}

.about-hero {
    background-color: #141414;
    overflow: hidden;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.about-hero__container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 200px
}

@media only screen and (min-width: 600px) {
    .about-hero__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .about-hero__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .about-hero__container {
        padding-top:240px
    }
}

@media only screen and (min-width: 64rem) {
    .about-hero__container {
        margin-left:58.33333%;
        padding-bottom: 400px;
        padding-right: 50px;
        padding-top: 320px;
        position: relative;
        z-index: 2
    }
}

.about-hero__title {
    color: #141414;
    color: #fff;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.15;
    margin-bottom: 150px
}

@media only screen and (min-width: 600px) {
    .about-hero__title {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .about-hero__title {
        font-size:3.75rem
    }
}

@media only screen and (min-width: 64rem) {
    .about-hero__title {
        margin-bottom:0
    }
}

.about-hero__line {
    display: none
}

@media only screen and (min-width: 64rem) {
    .about-hero__line {
        background-color:#676767;
        display: block;
        height: 100%;
        left: 50%;
        position: absolute;
        top: 0;
        width: 1px;
        z-index: 2
    }
}

.about-hero__background {
    display: none
}

@media only screen and (min-width: 64rem) {
    .about-hero__background {
        background-color:#141414;
        display: block;
        height: 100%;
        position: absolute;
        right: 0;
        top: 0;
        width: 50%;
        z-index: 1
    }
}

.about-hero__image-container {
    border-top: 1px solid #676767;
    overflow: hidden;
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .about-hero__image-container {
        border-top:none;
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        width: 50%
    }
}

.about-hero__image {
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .about-hero__image {
        height:100%;
        left: 0;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center;
        position: absolute;
        top: 0;
        width: 100%
    }
}

.about-about {
    background-color: #141414;
    border-top: 1px solid #676767
}

.about-about__container {
    margin-left: auto;
    margin-right: auto;
    padding: 70px 25px 100px
}

@media only screen and (min-width: 600px) {
    .about-about__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .about-about__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .about-about__container {
        padding-bottom:150px;
        padding-top: 100px
    }
}

@media only screen and (min-width: 64rem) {
    .about-about__container {
        grid-gap:16px;
        display: grid;
        grid-template-columns: 1fr 3fr 1fr 6fr 1fr;
        padding-bottom: 175px;
        padding-top: 140px
    }
}

.about-about__title {
    color: #141414;
    color: #fff;
    font: 400 1.5rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.2;
    margin-bottom: 40px;
    width: 100%
}

@media only screen and (min-width: 600px) {
    .about-about__title {
        font-size:2.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .about-about__title {
        font-size:2.75rem
    }
}

@media only screen and (min-width: 37.5rem) {
    .about-about__title {
        margin-bottom:50px
    }
}

@media only screen and (min-width: 64rem) {
    .about-about__title {
        grid-column:4/5;
        grid-row: 1/2;
        margin-bottom: 0
    }
}

.about-about__text {
    color: #fff;
    font-size: 1rem;
    margin-bottom: 70px;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .about-about__text {
        font-size:1.1875rem;
        margin-bottom: 0;
        margin-left: 50%;
        width: 50%
    }
}

@media only screen and (min-width: 64rem) {
    .about-about__text {
        grid-column:2/3;
        grid-row: 1/2;
        margin-left: 0;
        width: 100%
    }
}

.about-about__image-container--small {
    border-top-left-radius: 70px;
    margin-bottom: 50px;
    overflow: hidden;
    width: 75%
}

@media only screen and (min-width: 37.5rem) {
    .about-about__image-container--small {
        margin-bottom:0;
        width: 33.33333%
    }
}

@media only screen and (min-width: 64rem) {
    .about-about__image-container--small {
        grid-column:2/3;
        grid-row: 2/3;
        width: 100%
    }
}

.about-about__image-container--big {
    border-top-right-radius: 70px;
    overflow: hidden;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .about-about__image-container--big {
        margin-left:40%;
        margin-top: -80px;
        width: 60%
    }
}

@media only screen and (min-width: 64rem) {
    .about-about__image-container--big {
        grid-column:4/5;
        grid-row: 3/4;
        margin-left: 0;
        margin-top: -150px;
        width: 100%
    }
}

.about-about__image {
    width: 100%
}

.about-strengths {
    background-color: #141414;
    position: relative
}

.about-strengths__container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    padding: 70px 25px 30px;
    position: relative;
    z-index: 1
}

@media only screen and (min-width: 600px) {
    .about-strengths__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .about-strengths__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .about-strengths__container {
        padding-bottom:50px;
        padding-top: 100px
    }
}

@media only screen and (min-width: 64rem) {
    .about-strengths__container {
        padding-bottom:30px;
        padding-top: 120px
    }
}

.about-strengths__sub-title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    font-size: .875rem;
    height: 90px;
    -webkit-justify-content: center;
    justify-content: center;
    margin-bottom: 20px;
    padding: 10px;
    text-align: center;
    width: 90px
}

@media only screen and (min-width: 37.5rem) {
    .about-strengths__sub-title {
        margin-bottom:30px
    }
}

@media only screen and (min-width: 64rem) {
    .about-strengths__sub-title {
        margin-bottom:35px
    }
}

.about-strengths__title {
    color: #141414;
    color: #fff;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    font-size: 2.5rem;
    line-height: 1.15;
    line-height: .95;
    margin-bottom: 70px;
    text-align: center;
    width: 100%
}

@media only screen and (min-width: 600px) {
    .about-strengths__title {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .about-strengths__title {
        font-size:3.75rem
    }
}

.about-strengths__title .word {
    height: 1.2em;
    margin: -.2em 0
}

@media only screen and (min-width: 37.5rem) {
    .about-strengths__title {
        font-size:5rem;
        margin-bottom: 100px
    }
}

@media only screen and (min-width: 64rem) {
    .about-strengths__title {
        font-size:5.625rem;
        margin: 0 12.5% 190px;
        width: 75%
    }
}

@media only screen and (min-width: 1400px) {
    .about-strengths__title {
        font-size:7.5rem;
        margin: 0 16.66666% 190px;
        width: 66.66666%
    }
}

.about-strengths__image-container {
    border-top-right-radius: 50px;
    height: 100%;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100%
}

.about-strengths__image-container:before {
    background-color: #141414;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    opacity: .2;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1
}

@media only screen and (min-width: 37.5rem) {
    .about-strengths__image-container {
        border-top-right-radius:70px
    }
}

.about-strengths__image {
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: 0;
    width: 100%
}

.about-strengths__strengths {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: 1fr
}

@media only screen and (min-width: 64rem) {
    .about-strengths__strengths {
        grid-gap:16px;
        grid-template-columns: repeat(3,1fr)
    }
}

.about-strengths__strength {
    background-color: #fff;
    border-radius: 3px;
    padding: 20px;
    position: relative
}

@media only screen and (min-width: 37.5rem) {
    .about-strengths__strength {
        padding:30px 25px
    }
}

.about-strengths__strength-number {
    font-size: .75rem;
    font-weight: 500;
    position: absolute;
    right: 20px;
    top: 20px
}

@media only screen and (min-width: 37.5rem) {
    .about-strengths__strength-number {
        right:25px;
        top: 30px
    }
}

.about-strengths__strength-title {
    color: #141414;
    font-size: 1.125rem;
    margin-bottom: 40px;
    width: calc(100% - 40px)
}

@media only screen and (min-width: 37.5rem) {
    .about-strengths__strength-title {
        font-size:1.375rem;
        margin-bottom: 50px
    }
}

@media only screen and (min-width: 64rem) {
    .about-strengths__strength-title {
        margin-bottom:100px
    }
}

.about-strengths__strength-text {
    font-size: .875rem
}

.about-strengths__strength-text .text {
    display: block;
    padding-left: 1em;
    position: relative
}

.about-strengths__strength-text .text:first-of-type {
    display: none
}

.about-strengths__strength-text .dash {
    left: 0;
    position: absolute
}

@media only screen and (min-width: 37.5rem) {
    .about-strengths__strength-text {
        font-size:.875rem;
        width: 66.66666%
    }
}

@media only screen and (min-width: 64rem) {
    .about-strengths__strength-text {
        font-size:.875rem;
        width: 100%
    }
}

.about-team {
    background-color: #141414;
    position: relative
}

.about-team__container {
    margin-left: auto;
    margin-right: auto;
    padding: 70px 25px 35px
}

@media only screen and (min-width: 600px) {
    .about-team__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .about-team__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .about-team__container {
        padding-bottom:50px;
        padding-top: 100px
    }
}

@media only screen and (min-width: 64rem) {
    .about-team__container {
        padding-bottom:60px;
        padding-top: 110px
    }
}

.about-team__header {
    margin-bottom: 60px;
    position: relative;
    z-index: 1
}

@media only screen and (min-width: 37.5rem) {
    .about-team__header {
        margin-bottom:0;
        width: 50%
    }
}

@media only screen and (min-width: 64rem) {
    .about-team__header {
        margin-left:8.33333%;
        width: 33.33333%
    }
}

.about-team__title {
    color: #fff;
    line-height: 1.1;
    margin-bottom: 20px;
    width: 100%
}

.about-team__title .word {
    height: 1.2em;
    margin: -.2em 0
}

@media only screen and (min-width: 37.5rem) {
    .about-team__title {
        margin-bottom:15px
    }
}

.about-team__text {
    color: #fff;
    font-size: 1rem;
    line-height: 1.25
}

@media only screen and (min-width: 37.5rem) {
    .about-team__text {
        font-size:1.0625rem
    }
}

.about-team__content {
    padding-top: 20px
}

@media only screen and (min-width: 37.5rem) {
    .about-team__content {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: space-between;
        justify-content: space-between;
        margin-top: -80px
    }
}

@media only screen and (min-width: 64rem) {
    .about-team__content {
        margin-top:-220px
    }
}

.about-team__line {
    background-color: #676767;
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    width: 100vw
}

.about-team__persons {
    grid-gap: 16px;
    display: grid;
    grid-template-columns: repeat(2,1fr);
    margin-bottom: 40px
}

@media only screen and (min-width: 37.5rem) {
    .about-team__persons {
        grid-gap:40px;
        margin-bottom: 0;
        padding-top: 180px;
        width: 50%
    }
}

@media only screen and (min-width: 64rem) {
    .about-team__persons {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        grid-gap: 80px;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        margin-left: 8.33333%;
        padding-top: 300px;
        width: 33.33333%
    }
}

.about-team__person {
    margin-top: 15px
}

.about-team__name {
    color: #fff;
    font-weight: 600
}

@media only screen and (min-width: 37.5rem) {
    .about-team__name {
        font-size:.875rem
    }
}

.about-team__position {
    color: #fff
}

@media only screen and (min-width: 37.5rem) {
    .about-team__position {
        font-size:.875rem
    }
}

.about-team__images {
    display: grid;
    grid-template-columns: repeat(2,1fr)
}

@media only screen and (min-width: 37.5rem) {
    .about-team__images {
        width:50%
    }
}

@media only screen and (min-width: 64rem) {
    .about-team__images {
        margin-right:8.33333%
    }
}

.about-team__images-line {
    background-color: #676767;
    bottom: 345px;
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    width: 100vw;
    z-index: 1
}

@media only screen and (min-width: 37.5rem) {
    .about-team__images-line {
        bottom:475px
    }
}

@media only screen and (min-width: 64rem) {
    .about-team__images-line {
        bottom:760px
    }
}

.about-team__image {
    position: relative;
    width: calc(100% + 50px)
}

.about-team__image:nth-of-type(2) {
    margin-left: -50px
}

.about-team__group-image-container {
    border-top-right-radius: 70px;
    height: 250px;
    margin-top: 60px;
    overflow: hidden;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .about-team__group-image-container {
        height:375px;
        margin-top: 50px
    }
}

@media only screen and (min-width: 64rem) {
    .about-team__group-image-container {
        height:630px;
        margin-top: 70px
    }
}

.about-team__group-image {
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: 0;
    width: 100%
}

.about-jobs {
    background-color: #141414
}

.about-jobs__container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 35px
}

@media only screen and (min-width: 600px) {
    .about-jobs__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .about-jobs__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .about-jobs__container {
        padding-top:50px
    }
}

@media only screen and (min-width: 64rem) {
    .about-jobs__container {
        padding-bottom:150px;
        padding-top: 115px;
        position: relative
    }
}

.about-jobs__title-container {
    margin-bottom: 70px
}

@media only screen and (min-width: 37.5rem) {
    .about-jobs__title-container {
        margin-bottom:100px
    }
}

@media only screen and (min-width: 64rem) {
    .about-jobs__title-container {
        margin-bottom:120px;
        position: relative;
        z-index: 1
    }
}

.about-jobs__title {
    color: #141414;
    color: #fff;
    font: 400 1.5rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.2;
    line-height: 1.1
}

@media only screen and (min-width: 600px) {
    .about-jobs__title {
        font-size:2.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .about-jobs__title {
        font-size:2.75rem
    }
}

.about-jobs__title .word {
    height: 1.2em;
    margin: -.2em 0
}

@media only screen and (min-width: 64rem) {
    .about-jobs__title {
        width:66.66666%
    }
}

.about-jobs__list {
    border-top: 1px solid #676767
}

@media only screen and (min-width: 64rem) {
    .about-jobs__list {
        margin-left:58.33333%;
        min-height: 300px;
        position: relative;
        width: 41.66666%;
        z-index: 1
    }

    .about-jobs__list:hover .about-jobs__job-title {
        color: #676767
    }
}

.about-jobs__item {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-align-items: center;
    align-items: center;
    border-bottom: 1px solid #676767;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    padding: 15px 0;
    position: relative;
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .about-jobs__item:hover .about-jobs__job-title {
        color:#fff
    }

    .about-jobs__item:hover .about-jobs__job-image {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.about-jobs__item:after {
    background-image: url(../svg/technoprofil-arrow.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    width: 10px
}

.about-jobs__job-title {
    color: #fff;
    font-size: 1.125rem;
    font-weight: 400;
    position: relative;
    width: 75%;
    z-index: 1
}

@media only screen and (min-width: 37.5rem) {
    .about-jobs__job-title {
        font-size:1.375rem;
        width: 80%
    }
}

@media only screen and (min-width: 64rem) {
    .about-jobs__job-title {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }
}

.about-jobs__job-image {
    border-radius: 10px;
    display: none;
    height: 144px;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center top;
    object-position: center top;
    width: 212px
}

@media only screen and (min-width: 64rem) {
    .about-jobs__job-image {
        display:block;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        right: 90px;
        -webkit-transform: scale(.7);
        transform: scale(.7);
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }
}

.about-jobs__image {
    margin-left: -25px;
    mix-blend-mode: lighten;
    width: 100vw
}

@media only screen and (min-width: 37.5rem) {
    .about-jobs__image {
        margin-left:-50px
    }
}

@media only screen and (min-width: 64rem) {
    .about-jobs__image {
        bottom:0;
        height: 650px;
        left: 0;
        margin-left: 0;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center;
        position: absolute;
        width: 58.33333%
    }
}

.about-form {
    background-color: #141414;
    position: relative
}

.about-form__container {
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 70px;
    padding-left: 25px;
    padding-right: 25px
}

@media only screen and (min-width: 600px) {
    .about-form__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .about-form__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .about-form__container {
        padding-bottom:100px
    }
}

@media only screen and (min-width: 64rem) {
    .about-form__container {
        padding-bottom:90px
    }
}

.about-form__title {
    color: #141414;
    font: 400 1.5rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.2;
    margin-bottom: 30px
}

@media only screen and (min-width: 600px) {
    .about-form__title {
        font-size:2.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .about-form__title {
        font-size:2.75rem
    }
}

@media only screen and (min-width: 37.5rem) {
    .about-form__title {
        margin-bottom:50px
    }
}

@media only screen and (min-width: 64rem) {
    .about-form__title {
        margin-left:16.66666%;
        margin-right: 16.66666%;
        width: 50%
    }
}

.about-form__text {
    color: #676767;
    font-size: .875rem;
    margin-bottom: 10px;
    text-align: right;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .about-form__text {
        font-size:.875rem
    }
}

@media only screen and (min-width: 64rem) {
    .about-form__text {
        font-size:.875rem;
        margin-left: 16.66666%;
        margin-right: 16.66666%;
        width: 66.66666%
    }
}

.about-form__form {
    background-color: #e5e8e5;
    border-radius: 10px;
    padding: 30px 20px
}

@media only screen and (min-width: 37.5rem) {
    .about-form__form {
        padding:50px
    }
}

@media only screen and (min-width: 64rem) {
    .about-form__form {
        padding:100px 0
    }
}

.about-form__form .gform_anchor {
    position: absolute;
    top: 0
}

.about-form__form .gform_required_legend {
    display: none
}

.about-form__form :focus {
    outline: none
}

.about-form__form .gform_fields,.about-form__form .gform_footer {
    grid-gap: 16px;
    display: grid;
    grid-template-columns: 1fr;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .about-form__form .gform_fields,.about-form__form .gform_footer {
        grid-template-columns:repeat(2,1fr)
    }
}

@media only screen and (min-width: 64rem) {
    .about-form__form .gform_fields,.about-form__form .gform_footer {
        margin:0 16.66666%;
        width: 66.66666%
    }
}

.about-form__form .gform_validation_errors {
    margin-bottom: 20px;
    width: 100%
}

.about-form__form .gform_validation_errors h1,.about-form__form .gform_validation_errors h2,.about-form__form .gform_validation_errors h3,.about-form__form .gform_validation_errors h4,.about-form__form .gform_validation_errors h5,.about-form__form .gform_validation_errors h6,.about-form__form .gform_validation_errors p {
    color: #141414;
    font: 400 .875rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.1
}

@media only screen and (min-width: 600px) {
    .about-form__form .gform_validation_errors h1,.about-form__form .gform_validation_errors h2,.about-form__form .gform_validation_errors h3,.about-form__form .gform_validation_errors h4,.about-form__form .gform_validation_errors h5,.about-form__form .gform_validation_errors h6,.about-form__form .gform_validation_errors p {
        font-size:1.0625rem
    }
}

@media only screen and (min-width: 1024px) {
    .about-form__form .gform_validation_errors h1,.about-form__form .gform_validation_errors h2,.about-form__form .gform_validation_errors h3,.about-form__form .gform_validation_errors h4,.about-form__form .gform_validation_errors h5,.about-form__form .gform_validation_errors h6,.about-form__form .gform_validation_errors p {
        font-size:1.0625rem
    }
}

@media only screen and (min-width: 64rem) {
    .about-form__form .gform_validation_errors {
        margin:0 16.66666% 20px;
        width: 66.66666%
    }
}

.about-form__form .gform_confirmation_message {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    background-color: #f7f8f7;
    border-radius: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    padding: 25px 20px;
    text-align: center;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .about-form__form .gform_confirmation_message {
        padding:40px 30px
    }
}

@media only screen and (min-width: 64rem) {
    .about-form__form .gform_confirmation_message {
        margin-left:16.66666%;
        margin-right: 16.66666%;
        padding: 40px 15%;
        width: 66.66666%
    }
}

.about-form__form form:not(#gform_2):not(#gform_3) {
    grid-gap: 16px;
    display: grid;
    grid-template-columns: 1fr;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .about-form__form form:not(#gform_2):not(#gform_3) {
        grid-template-columns:repeat(2,1fr)
    }
}

@media only screen and (min-width: 64rem) {
    .about-form__form form:not(#gform_2):not(#gform_3) {
        margin:0 16.66666%;
        width: 66.66666%
    }
}

.about-form__form .input-container {
    position: relative;
    width: 100%
}

.about-form__form .input-container .ginput_container,.about-form__form .input-container:not(.gfield) {
    background-color: #fff;
    border-radius: 3px
}

@media only screen and (min-width: 37.5rem) {
    .about-form__form .input-container--textarea {
        grid-column:1/3
    }
}

.about-form__form .input-container--dropdown {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start
}

.about-form__form .input-container--dropdown .ginput_container,.about-form__form .input-container--dropdown .ginput_container select {
    width: 100%
}

.about-form__form .input-container--dropdown:after {
    background-image: url(../svg/technoprofil-dropdown.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    pointer-events: none;
    position: absolute;
    right: 20px;
    width: 10px
}

.about-form__form .input-container label {
    color: #676767;
    font-size: .875rem;
    font-weight: 400;
    left: 20px;
    pointer-events: none;
    position: absolute;
    top: 21px;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

.about-form__form .input-container.gfield:has(.ginput_container input:not(:-moz-placeholder-shown)) label:not(.gfield--type-fileupload label),.about-form__form .input-container.gfield:has(.ginput_container select:not(:-moz-placeholder-shown)) label:not(.gfield--type-fileupload label),.about-form__form .input-container.gfield:has(.ginput_container textarea:not(:-moz-placeholder-shown)) label:not(.gfield--type-fileupload label) {
    top: 14px;
    transform: scale(.8)
}

.about-form__form .input-container.gfield:has(.ginput_container input:not(:-ms-input-placeholder)) label:not(.gfield--type-fileupload label),.about-form__form .input-container.gfield:has(.ginput_container select:not(:-ms-input-placeholder)) label:not(.gfield--type-fileupload label),.about-form__form .input-container.gfield:has(.ginput_container textarea:not(:-ms-input-placeholder)) label:not(.gfield--type-fileupload label) {
    top: 14px;
    transform: scale(.8)
}

.about-form__form .input-container.gfield:has(.ginput_container input:focus) label:not(.gfield--type-fileupload label),.about-form__form .input-container.gfield:has(.ginput_container input:not(:placeholder-shown)) label:not(.gfield--type-fileupload label),.about-form__form .input-container.gfield:has(.ginput_container select:focus) label:not(.gfield--type-fileupload label),.about-form__form .input-container.gfield:has(.ginput_container select:not(:placeholder-shown)) label:not(.gfield--type-fileupload label),.about-form__form .input-container.gfield:has(.ginput_container textarea:focus) label:not(.gfield--type-fileupload label),.about-form__form .input-container.gfield:has(.ginput_container textarea:not(:placeholder-shown)) label:not(.gfield--type-fileupload label) {
    top: 14px;
    -webkit-transform: scale(.8);
    transform: scale(.8)
}

.about-form__form .input-container input,.about-form__form .input-container select,.about-form__form .input-container textarea {
    color: #141414;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.2;
    padding: 20px;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95);
    width: calc(100% - 40px)
}

.about-form__form .input-container input:not(:-moz-placeholder-shown),.about-form__form .input-container select:not(:-moz-placeholder-shown),.about-form__form .input-container textarea:not(:-moz-placeholder-shown) {
    padding: 30px 20px 10px
}

.about-form__form .input-container input:not(:-ms-input-placeholder),.about-form__form .input-container select:not(:-ms-input-placeholder),.about-form__form .input-container textarea:not(:-ms-input-placeholder) {
    padding: 30px 20px 10px
}

.about-form__form .input-container input:focus,.about-form__form .input-container input:not(:placeholder-shown),.about-form__form .input-container select:focus,.about-form__form .input-container select:not(:placeholder-shown),.about-form__form .input-container textarea:focus,.about-form__form .input-container textarea:not(:placeholder-shown) {
    padding: 30px 20px 10px
}

.about-form__form .input-container input:not(:-moz-placeholder-shown)~label,.about-form__form .input-container select:not(:-moz-placeholder-shown)~label,.about-form__form .input-container textarea:not(:-moz-placeholder-shown)~label {
    top: 14px;
    transform: scale(.8)
}

.about-form__form .input-container input:not(:-ms-input-placeholder)~label,.about-form__form .input-container select:not(:-ms-input-placeholder)~label,.about-form__form .input-container textarea:not(:-ms-input-placeholder)~label {
    top: 14px;
    transform: scale(.8)
}

.about-form__form .input-container input:focus~label,.about-form__form .input-container input:not(:placeholder-shown)~label,.about-form__form .input-container select:focus~label,.about-form__form .input-container select:not(:placeholder-shown)~label,.about-form__form .input-container textarea:focus~label,.about-form__form .input-container textarea:not(:placeholder-shown)~label {
    top: 14px;
    -webkit-transform: scale(.8);
    transform: scale(.8)
}

.about-form__form .input-container textarea {
    min-height: 160px
}

.about-form__form .input-container.gfield--type-fileupload label {
    background-color: #e5e8e5;
    border-radius: 7px;
    height: calc(100% - 14px);
    left: 7px;
    padding: 9px 15px;
    top: 7px
}

.about-form__form .input-container.gfield--type-fileupload label,.about-form__form .input-container .ginput_container_fileupload {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center
}

.about-form__form .input-container .ginput_container_fileupload input {
    opacity: 0
}

.about-form__form .input-container .gform_fileupload_rules {
    color: #676767;
    font-size: .875rem;
    font-weight: 500;
    left: 155px;
    padding-right: 25px;
    pointer-events: none;
    position: absolute;
    top: auto
}

.about-form__form .input-container .ginput_preview_list,.about-form__form .input-container .instruction {
    display: none
}

.about-form__form .input-container .gfield_validation_message {
    color: #141414;
    font-size: .75rem;
    font-weight: 400;
    margin-bottom: 10px;
    margin-top: 10px
}

.about-form__form .checkbox-container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    grid-gap: 15px;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    margin-bottom: 30px
}

@media only screen and (min-width: 37.5rem) {
    .about-form__form .checkbox-container {
        grid-column:1/3
    }
}

.about-form__form .checkbox-container p {
    font-size: .9375rem;
    font-weight: 400;
    margin-bottom: 10px;
    width: 100%
}

.about-form__form .checkbox-container input {
    cursor: pointer;
    height: 0;
    opacity: 0;
    position: absolute;
    width: 0
}

.about-form__form .checkbox-container input:checked~.checkmark:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.about-form__form .checkbox-container .checkmark {
    background-color: #fff;
    border-radius: 4px;
    height: 14px;
    left: 0;
    position: absolute;
    top: 0;
    width: 14px
}

.about-form__form .checkbox-container .checkmark:after {
    background-color: #141414;
    border-radius: 3px;
    content: "";
    display: block;
    height: 10px;
    left: 2px;
    opacity: 0;
    position: absolute;
    top: 2px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
    transition: .3s cubic-bezier(.3,.86,.36,.95);
    width: 10px
}

.about-form__form .checkbox-container label {
    color: #676767;
    cursor: pointer;
    font-size: .875rem;
    font-weight: 400;
    padding-left: 22px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.about-form__form .consent-container {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    grid-gap: 12px;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    margin-bottom: 10px;
    margin-top: 10px
}

@media only screen and (min-width: 37.5rem) {
    .about-form__form .consent-container {
        grid-column:1/3
    }
}

.about-form__form .consent-container p {
    font-size: .9375rem;
    font-weight: 400;
    margin-bottom: 10px;
    width: 100%
}

.about-form__form .consent-container input {
    cursor: pointer;
    height: 0;
    opacity: 0;
    position: absolute;
    width: 0
}

.about-form__form .consent-container input:checked~.checkmark:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.about-form__form .consent-container .checkmark {
    background-color: #fff;
    border-radius: 4px;
    height: 14px;
    left: 0;
    position: absolute;
    top: 0;
    width: 14px
}

.about-form__form .consent-container .checkmark:after {
    background-color: #141414;
    border-radius: 3px;
    content: "";
    display: block;
    height: 10px;
    left: 2px;
    opacity: 0;
    position: absolute;
    top: 2px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
    transition: .3s cubic-bezier(.3,.86,.36,.95);
    width: 10px
}

.about-form__form .consent-container label {
    color: #676767;
    cursor: pointer;
    font-size: .875rem;
    font-weight: 400;
    padding-left: 22px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.about-form__form .g-recaptcha {
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .about-form__form .g-recaptcha {
        grid-column:1/3
    }
}

.about-form__form .button-container {
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .about-form__form .button-container {
        grid-column:1/3
    }
}

.about-form__form .gform_footer {
    margin-top: 30px
}

@media only screen and (min-width: 37.5rem) {
    .about-form__form .gform_footer {
        margin-top:40px
    }
}

.about-form__form .button-container,.about-form__form .gform_footer {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    position: relative
}

@media only screen and (min-width: 37.5rem) {
    .about-form__form .button-container:hover input,.about-form__form .gform_footer:hover input {
        background-color:#fff;
        color: #141414;
        padding: 16px 30px
    }

    .about-form__form .button-container:hover:after,.about-form__form .gform_footer:hover:after {
        -webkit-transform: translateX(-10px);
        transform: translateX(-10px)
    }
}

.about-form__form .button-container:after,.about-form__form .gform_footer:after {
    background-image: url(../svg/technoprofil-arrow.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    margin-left: 50px;
    pointer-events: none;
    position: absolute;
    right: 20px;
    top: 19px;
    width: 10px
}

@media only screen and (min-width: 37.5rem) {
    .about-form__form .button-container:after,.about-form__form .gform_footer:after {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }
}

.about-form__form .button-container input,.about-form__form .gform_footer input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #141414;
    border-radius: 7px;
    color: #fff;
    font-size: .9375rem;
    font-weight: 500;
    outline: none;
    padding: 16px 20px;
    text-align: left;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95);
    width: 100%
}

.about-form__form .button-container .gform_ajax_spinner,.about-form__form .gform_footer .gform_ajax_spinner {
    display: none!important
}

.about-form__form .form-section {
    font-size: 1.0625rem;
    font-weight: 400;
    margin-bottom: 30px;
    margin-top: 20px
}

@media only screen and (min-width: 37.5rem) {
    .about-form__form .form-section {
        grid-column:1/3
    }
}

.expertise-fixed {
    display: none
}

@media only screen and (min-width: 64rem) {
    .expertise-fixed {
        -webkit-box-align:center;
        -ms-flex-align: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-align-items: center;
        align-items: center;
        bottom: 40px;
        display: -webkit-inline-box;
        display: -webkit-inline-flex;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: center;
        justify-content: center;
        left: 0;
        position: fixed;
        width: 100%;
        z-index: 1
    }
}

.expertise-fixed__container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    grid-gap: 3px;
    -webkit-align-items: center;
    align-items: center;
    background-color: #e5e8e5;
    border-radius: 7px;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    padding: 3px
}

.expertise-fixed__link {
    background-color: #fff;
    border-radius: 7px;
    color: #676767;
    font-size: .9375rem;
    font-size: 500;
    padding: 8px 25px;
    -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
    transition: .3s cubic-bezier(.3,.86,.36,.95)
}

.expertise-fixed__link--active,.expertise-fixed__link:hover {
    background-color: #141414;
    color: #fff
}

.expertise-hero {
    background-color: #141414;
    position: relative;
    z-index: 2
}

@media only screen and (min-width: 37.5rem) {
    .expertise-hero {
        -ms-flex-line-pack:end;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-align-content: flex-end;
        align-content: flex-end;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        height: calc(100vh + 50px);
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        min-height: 850px
    }
}

@media only screen and (min-width: 64rem) {
    .expertise-hero {
        height:calc(100vh + 120px);
        min-height: 850px
    }
}

.expertise-hero__container {
    margin-left: auto;
    margin-right: auto;
    padding: 200px 25px 70px
}

@media only screen and (min-width: 600px) {
    .expertise-hero__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .expertise-hero__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .expertise-hero__container {
        padding-bottom:100px;
        padding-top: 0
    }
}

@media only screen and (min-width: 64rem) {
    .expertise-hero__container {
        padding-bottom:150px
    }
}

.expertise-hero__header {
    margin-bottom: 70px
}

@media only screen and (min-width: 37.5rem) {
    .expertise-hero__header {
        margin-bottom:200px
    }
}

@media only screen and (min-width: 64rem) {
    .expertise-hero__header {
        margin-bottom:230px;
        z-index: 1
    }
}

.expertise-hero__line {
    background-color: #676767;
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    width: 100vw;
    z-index: 1
}

.expertise-hero__title {
    color: #141414;
    color: #fff;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.15;
    padding-bottom: 20px;
    position: relative;
    z-index: 1
}

@media only screen and (min-width: 600px) {
    .expertise-hero__title {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .expertise-hero__title {
        font-size:3.75rem
    }
}

.expertise-hero__text-container {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: auto 1fr;
    margin-top: 30px;
    position: relative;
    z-index: 1
}

@media only screen and (min-width: 64rem) {
    .expertise-hero__text-container {
        margin-left:50%;
        width: 50%
    }
}

.expertise-hero__text {
    color: #fff;
    font-weight: 500
}

.expertise-hero__links {
    grid-gap: 10px;
    display: grid;
    grid-template-columns: 1fr
}

@media only screen and (min-width: 37.5rem) {
    .expertise-hero__links {
        grid-gap:16px;
        grid-template-columns: repeat(2,1fr)
    }
}

@media only screen and (min-width: 64rem) {
    .expertise-hero__links {
        grid-template-columns:repeat(4,1fr)
    }
}

.expertise-hero__link {
    background: -webkit-gradient(linear,left bottom,left top,from(transparent),color-stop(50%,transparent),color-stop(50%,#fff),to(#fff));
    background: linear-gradient(0deg,transparent,transparent 50%,#fff 0,#fff);
    background-position: bottom;
    background-size: 100% 200%;
    border: 1px solid #fff;
    border-radius: 7px;
    padding: 25px;
    position: relative;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95);
    z-index: 1
}

@media only screen and (min-width: 64rem) {
    .expertise-hero__link:hover {
        background-position:top
    }

    .expertise-hero__link:hover .expertise-hero__link-text {
        color: #141414
    }

    .expertise-hero__link:hover .expertise-hero__link-number {
        opacity: 0
    }

    .expertise-hero__link:hover .expertise-hero__link-arrow {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    .expertise-hero__link:hover+.expertise-hero__image-container {
        opacity: .2;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.expertise-hero__link-text {
    color: #fff;
    display: block;
    font-size: 1rem;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95);
    width: calc(100% - 40px)
}

@media only screen and (min-width: 37.5rem) {
    .expertise-hero__link-text {
        font-size:1.125rem
    }
}

@media only screen and (min-width: 64rem) {
    .expertise-hero__link-text {
        font-size:1.375rem
    }
}

.expertise-hero__link-number {
    color: #fff;
    font-size: .75rem;
    position: absolute;
    right: 25px;
    top: 25px;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

.expertise-hero__link-arrow {
    display: none
}

@media only screen and (min-width: 64rem) {
    .expertise-hero__link-arrow {
        display:block;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        right: 25px;
        top: 25px;
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
        -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
        transition: .3s cubic-bezier(.3,.86,.36,.95)
    }
}

.expertise-hero__image-container {
    display: none
}

.expertise-hero__image-container:after {
    background: -webkit-gradient(linear,left top,right top,from(transparent),to(#141414));
    background: linear-gradient(90deg,transparent,#141414);
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    z-index: 1
}

.expertise-hero__image-container:before {
    background: -webkit-gradient(linear,left top,left bottom,from(transparent),to(#141414));
    background: linear-gradient(180deg,transparent,#141414);
    bottom: 0;
    content: "";
    display: block;
    height: 200px;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: 1
}

@media only screen and (min-width: 64rem) {
    .expertise-hero__image-container {
        bottom:125px;
        display: block;
        height: 100%;
        left: 0;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
        -webkit-transition: .7s cubic-bezier(.3,.86,.36,.95);
        transition: .7s cubic-bezier(.3,.86,.36,.95);
        width: 75%
    }

    .expertise-hero__image {
        display: block;
        -webkit-filter: grayscale(100%);
        filter: grayscale(100%);
        height: 100%;
        left: 0;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center;
        position: absolute;
        top: 0;
        width: 100%
    }
}

.expertise-expertise {
    background-color: #141414;
    position: relative
}

.expertise-expertise__container {
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 40px;
    padding-left: 25px;
    padding-right: 25px
}

@media only screen and (min-width: 600px) {
    .expertise-expertise__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .expertise-expertise__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .expertise-expertise__container {
        padding-bottom:70px
    }
}

@media only screen and (min-width: 64rem) {
    .expertise-expertise__container {
        padding-bottom:170px
    }
}

.expertise-expertise__expertise {
    padding-bottom: 60px;
    padding-top: 60px
}

@media only screen and (min-width: 37.5rem) {
    .expertise-expertise__expertise {
        padding-bottom:80px;
        padding-top: 80px
    }
}

@media only screen and (min-width: 64rem) {
    .expertise-expertise__expertise {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        display: grid;
        grid-template-columns: 5fr 1fr 6fr;
        padding-bottom: 120px;
        padding-top: 145px
    }
}

.expertise-expertise__line {
    background-color: #676767;
    display: block;
    height: 1px;
    left: 0;
    margin-top: -60px;
    position: absolute;
    width: 100vw
}

@media only screen and (min-width: 37.5rem) {
    .expertise-expertise__line {
        margin-top:-80px
    }
}

@media only screen and (min-width: 64rem) {
    .expertise-expertise__line {
        margin-top:-145px
    }
}

.expertise-expertise__header {
    margin-bottom: 30px
}

@media only screen and (min-width: 37.5rem) {
    .expertise-expertise__header {
        margin-bottom:40px
    }
}

@media only screen and (min-width: 64rem) {
    .expertise-expertise__header {
        grid-column:1/2;
        grid-row: 1/4;
        margin-bottom: 0
    }
}

.expertise-expertise__number {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .875rem;
    font-weight: 300;
    height: 40px;
    -webkit-justify-content: center;
    justify-content: center;
    margin-bottom: 15px;
    width: 40px
}

@media only screen and (min-width: 64rem) {
    .expertise-expertise__number {
        grid-column:1/2;
        grid-row: 1/2;
        margin-top: -55px
    }
}

.expertise-expertise__title {
    color: #fff;
    margin-bottom: 40px
}

@media only screen and (min-width: 64rem) {
    .expertise-expertise__title {
        margin-bottom:30px
    }
}

.expertise-expertise__button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #2c2c2c;
    border-radius: 7px;
    color: #fff;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    margin-bottom: 40px;
    padding: 17px 20px
}

@media only screen and (min-width: 37.5rem) {
    .expertise-expertise__button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .expertise-expertise__button:hover {
        background-color: #fff;
        color: #141414;
        padding: 17px 40px
    }

    .expertise-expertise__button:hover:after {
        -webkit-transform: translateX(10px);
        transform: translateX(10px)
    }
}

.expertise-expertise__button:after {
    background-image: url(../svg/technoprofil-arrow.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    margin-left: 50px;
    width: 10px
}

@media only screen and (min-width: 37.5rem) {
    .expertise-expertise__button:after {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }
}

.expertise-expertise__text {
    color: #fff;
    font-size: 1rem;
    font-weight: 500;
    margin-bottom: 40px
}

@media only screen and (min-width: 37.5rem) {
    .expertise-expertise__text {
        font-size:1.1875rem
    }
}

@media only screen and (min-width: 64rem) {
    .expertise-expertise__text {
        grid-column:3/4;
        grid-row: 1/2
    }
}

.expertise-expertise__image-container {
    border-radius: 10px;
    overflow: hidden;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .expertise-expertise__image-container {
        grid-column:3/4;
        grid-row: 2/3
    }
}

.expertise-expertise__image {
    width: 100%
}

.expertise-expertise__sub-expertise {
    grid-gap: 10px;
    display: grid;
    grid-template-columns: 1fr
}

@media only screen and (min-width: 64rem) {
    .expertise-expertise__sub-expertise {
        grid-column:3/4;
        grid-row: 2/3
    }
}

.expertise-expertise__sub-expertise-container {
    background: -webkit-gradient(linear,left bottom,left top,from(transparent),color-stop(50%,transparent),color-stop(50%,#fff),to(#fff));
    background: linear-gradient(0deg,transparent,transparent 50%,#fff 0,#fff);
    background-position: 0 99%;
    background-size: 105% 250%;
    border: 1px solid #fff;
    border-radius: 7px;
    position: relative;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

.expertise-expertise__sub-expertise-container--opened {
    background-position: 0 1%;
    border-color: #fff
}

.expertise-expertise__sub-expertise-container--opened .expertise-expertise__sub-expertise-title {
    color: #141414
}

.expertise-expertise__sub-expertise-container--opened .expertise-expertise__sub-expertise-arrow {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.expertise-expertise__sub-expertise-container--other {
    border: 1px solid #676767
}

.expertise-expertise__sub-expertise-container--other .expertise-expertise__sub-expertise-title {
    color: #676767
}

.expertise-expertise__sub-expertise-arrow {
    pointer-events: none;
    position: absolute;
    right: 15px;
    top: 23px;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

@media only screen and (min-width: 37.5rem) {
    .expertise-expertise__sub-expertise-arrow {
        right:20px;
        top: 29px
    }
}

.expertise-expertise__sub-expertise-title {
    color: #fff;
    cursor: pointer;
    font-size: 1.125rem;
    font-weight: 500;
    padding: 15px;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95);
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .expertise-expertise__sub-expertise-title {
        font-size:1.375rem;
        padding: 20px
    }
}

.expertise-expertise__sub-expertise-text-container {
    height: 0;
    overflow: hidden;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

.expertise-expertise__sub-expertise-text {
    font-size: .875rem;
    margin-top: 10px;
    padding: 0 15px 15px;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .expertise-expertise__sub-expertise-text {
        font-size:.875rem;
        padding: 0 20px 20px
    }
}

@media only screen and (min-width: 64rem) {
    .expertise-expertise__sub-expertise-text {
        font-size:.875rem
    }
}

.page-template-tp-expertise .cta,.page-template-tp-expertise .footer,.page-template-tp-expertise .projects {
    position: relative;
    z-index: 2
}

.products-hero {
    position: relative
}

.products-hero__container {
    margin-left: auto;
    margin-right: auto;
    padding: 150px 25px 70px
}

@media only screen and (min-width: 600px) {
    .products-hero__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .products-hero__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .products-hero__container {
        padding-bottom:100px;
        padding-top: 200px
    }
}

@media only screen and (min-width: 64rem) {
    .products-hero__container {
        padding-bottom:40px;
        padding-top: 250px
    }
}

.products-hero__links {
    grid-gap: 10px;
    display: grid;
    grid-template-columns: 1fr;
    margin-bottom: 50px
}

@media only screen and (min-width: 37.5rem) {
    .products-hero__links {
        grid-gap:16px;
        grid-template-columns: repeat(2,1fr);
        margin-bottom: 70px
    }
}

@media only screen and (min-width: 64rem) {
    .products-hero__links {
        margin-bottom:60px;
        margin-left: 58.33333%;
        width: 33.33333%
    }
}

.products-hero__link {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-align-items: center;
    align-items: center;
    background: -webkit-gradient(linear,left bottom,left top,from(transparent),color-stop(50%,transparent),color-stop(50%,#e5e8e5),to(#e5e8e5));
    background: linear-gradient(0deg,transparent,transparent 50%,#e5e8e5 0,#e5e8e5);
    background-position: 0 99%;
    background-size: 105% 250%;
    border: 1px solid #e5e8e5;
    border-radius: 7px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    padding: 20px;
    position: relative;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

@media only screen and (min-width: 37.5rem) {
    .products-hero__link {
        padding:25px
    }
}

@media only screen and (min-width: 64rem) {
    .products-hero__link:hover {
        background-position:0 1%
    }

    .products-hero__link:hover .products-hero__link-arrow {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

.products-hero__link-text {
    color: #141414;
    display: block;
    font-size: 1.125rem;
    font-weight: 400;
    width: calc(100% - 40px)
}

@media only screen and (min-width: 37.5rem) {
    .products-hero__link-text {
        font-size:1.375rem;
        width: calc(100% - 50px)
    }
}

@media only screen and (min-width: 64rem) {
    .products-hero__link-arrow {
        opacity:0;
        pointer-events: none;
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
        -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
        transition: .3s cubic-bezier(.3,.86,.36,.95)
    }
}

.products-hero__title {
    color: #141414;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.15;
    padding-bottom: 40px;
    position: relative
}

@media only screen and (min-width: 600px) {
    .products-hero__title {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .products-hero__title {
        font-size:3.75rem
    }
}

@media only screen and (min-width: 37.5rem) {
    .products-hero__title {
        width:50%
    }
}

@media only screen and (min-width: 64rem) {
    .products-hero__title {
        padding-bottom:30px;
        width: 41.66666%
    }
}

.products-hero__line {
    background-color: #676767;
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    width: 100vw
}

.products-hero__image {
    position: relative;
    width: 100%;
    z-index: 1
}

@media only screen and (min-width: 37.5rem) {
    .products-hero__image {
        margin-left:33.33333%;
        margin-top: -80px;
        width: 66.66666%
    }
}

@media only screen and (min-width: 64rem) {
    .products-hero__image {
        bottom:0;
        margin-left: 50%;
        margin-top: 0;
        max-height: 360px;
        -o-object-fit: contain;
        object-fit: contain;
        -o-object-position: left;
        object-position: left;
        position: absolute;
        right: 0;
        width: 50%
    }
}

.products-hero__text-container {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: 1fr;
    padding-top: 40px;
    position: relative
}

@media only screen and (min-width: 64rem) {
    .products-hero__text-container {
        margin-top:100px;
        padding-bottom: 50px;
        padding-top: 0;
        width: 41.66666%
    }
}

.products-hero__text-container:after {
    background-color: #676767;
    content: "";
    display: block;
    height: 1px;
    left: -25px;
    position: absolute;
    top: 0;
    width: 100vw
}

@media only screen and (min-width: 37.5rem) {
    .products-hero__text-container:after {
        left:-50px
    }
}

@media only screen and (min-width: 64rem) {
    .products-hero__text-container:after {
        display:none
    }
}

@media only screen and (min-width: 37.5rem) {
    .products-hero__text {
        font-size:.875rem
    }
}

@media only screen and (min-width: 64rem) {
    .products-hero__text {
        font-size:1.0625rem
    }
}

.products-description__container {
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 30px;
    padding-left: 25px;
    padding-right: 25px
}

@media only screen and (min-width: 600px) {
    .products-description__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .products-description__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .products-description__container {
        padding-bottom:50px
    }
}

@media only screen and (min-width: 64rem) {
    .products-description__container {
        padding-bottom:40px
    }
}

.products-description__content {
    background-color: #e5e8e5;
    border-radius: 10px;
    padding: 40px 30px
}

@media only screen and (min-width: 37.5rem) {
    .products-description__content {
        padding:70px 50px
    }
}

@media only screen and (min-width: 64rem) {
    .products-description__content {
        grid-gap:16px;
        display: grid;
        grid-template-columns: 1fr 3fr 1fr 5fr 1fr;
        padding: 115px 0
    }
}

.products-description__title {
    color: #141414;
    font: 400 1.5rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.2;
    margin-bottom: 40px
}

@media only screen and (min-width: 600px) {
    .products-description__title {
        font-size:2.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .products-description__title {
        font-size:2.75rem
    }
}

@media only screen and (min-width: 37.5rem) {
    .products-description__title {
        margin-bottom:70px
    }
}

@media only screen and (min-width: 64rem) {
    .products-description__title {
        grid-column:4/5;
        margin-bottom: 0
    }

    .products-description__text-container {
        grid-column: 2/3;
        grid-row: 1/2
    }
}

.products-description__text {
    font-size: .9375rem;
    line-height: 1.25;
    margin-bottom: 20px
}

@media only screen and (min-width: 37.5rem) {
    .products-description__text {
        font-size:1.125rem;
        width: 66.66666%
    }
}

@media only screen and (min-width: 64rem) {
    .products-description__text {
        font-size:1.375rem;
        margin-bottom: 25px;
        width: 100%
    }
}

.products-description__button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #141414;
    border-radius: 7px;
    color: #fff;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 10px 25px
}

@media only screen and (min-width: 37.5rem) {
    .products-description__button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .products-description__button:hover {
        background-color: #141414;
        color: #fff;
        padding: 10px 35px
    }
}

.products-products__container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 25px;
    padding-right: 25px
}

@media only screen and (min-width: 600px) {
    .products-products__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .products-products__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

.products-products__product {
    padding-bottom: 70px;
    padding-top: 70px;
    position: relative
}

@media only screen and (min-width: 37.5rem) {
    .products-products__product {
        padding-bottom:100px;
        padding-top: 100px
    }
}

@media only screen and (min-width: 64rem) {
    .products-products__product {
        padding-bottom:90px;
        padding-top: 80px
    }
}

.products-products__product:after {
    background-color: #676767;
    content: "";
    display: block;
    height: 1px;
    left: -25px;
    position: absolute;
    top: 0;
    width: 100vw
}

@media only screen and (min-width: 37.5rem) {
    .products-products__product:after {
        left:-50px
    }
}

@media only screen and (min-width: 64rem) {
    .products-products__product:after {
        left:-30px
    }
}

@media only screen and (min-width: 1600px) {
    .products-products__product:after {
        left:calc(-50vw - -770px)
    }
}

.products-products__product-title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #e5e8e5;
    border-radius: 3px;
    color: #141414;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    margin-bottom: 10px;
    padding: 4px 8px
}

.products-products__product-text {
    color: #141414;
    font: 400 1.5rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.2;
    line-height: 1.1;
    margin-bottom: 70px
}

@media only screen and (min-width: 600px) {
    .products-products__product-text {
        font-size:2.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .products-products__product-text {
        font-size:2.75rem
    }
}

.products-products__product-text .word {
    height: 1.2em;
    margin: -.2em 0
}

@media only screen and (min-width: 37.5rem) {
    .products-products__product-text {
        margin-bottom:100px;
        width: 83.33333%
    }
}

@media only screen and (min-width: 64rem) {
    .products-products__product-text {
        margin-bottom:110px;
        width: 50%
    }
}

.products-products__finishes {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: 1fr
}

@media only screen and (min-width: 37.5rem) {
    .products-products__finishes {
        grid-gap:16px;
        grid-template-columns: repeat(2,1fr)
    }
}

@media only screen and (min-width: 64rem) {
    .products-products__finishes {
        grid-template-columns:repeat(3,1fr)
    }
}

.products-products__finish {
    border-radius: 20px;
    display: block;
    overflow: hidden;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.products-products__finish:after {
    content: "";
    display: block;
    padding-bottom: 100%
}

@media only screen and (min-width: 64rem) {
    .products-products__finish:hover .card-infos {
        opacity:1
    }

    .products-products__finish:hover .card-title {
        opacity: 0;
        -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95) 0s;
        transition: .3s cubic-bezier(.3,.86,.36,.95) 0s
    }

    .products-products__finish:hover .card-button-container {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .2s;
        transition: .5s cubic-bezier(.3,.86,.36,.95) .2s
    }

    .products-products__finish:hover .card-button-container:after {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .3s;
        transition: .5s cubic-bezier(.3,.86,.36,.95) .3s
    }

    .products-products__finish:hover .card-background {
        -webkit-transform: scaleY(1);
        transform: scaleY(1)
    }
}

.products-products__finish .card-image {
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: 0;
    width: 100%
}

.products-products__finish .card-number {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .875rem;
    font-weight: 300;
    height: 40px;
    -webkit-justify-content: center;
    justify-content: center;
    left: 20px;
    position: absolute;
    top: 20px;
    width: 40px;
    z-index: 2
}

@media only screen and (min-width: 64rem) {
    .products-products__finish .card-number {
        left:30px;
        top: 30px
    }
}

.products-products__finish .card-infos {
    display: none
}

@media only screen and (min-width: 64rem) {
    .products-products__finish .card-infos {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        color: #fff;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        font-size: .875rem;
        font-weight: 400;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        left: 30px;
        line-height: 1.4;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        top: 110px;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95);
        width: calc(100% - 60px);
        z-index: 2
    }

    .products-products__finish .card-infos strong {
        font-weight: 600
    }
}

.products-products__finish .card-title {
    grid-gap: 15px;
    border-top: 1px solid #f7f8f7;
    bottom: 20px;
    color: #fff;
    display: grid;
    font-size: .9375rem;
    font-weight: 500;
    grid-template-columns: 1fr auto;
    left: 20px;
    padding-top: 15px;
    position: absolute;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .2s;
    transition: .5s cubic-bezier(.3,.86,.36,.95) .2s;
    width: calc(100% - 40px);
    z-index: 2
}

@media only screen and (min-width: 37.5rem) {
    .products-products__finish .card-title {
        font-size:1.1875rem
    }
}

@media only screen and (min-width: 64rem) {
    .products-products__finish .card-title {
        bottom:30px;
        font-size: 1.375rem;
        left: 30px;
        width: calc(100% - 60px)
    }
}

.products-products__finish .card-button-container {
    display: none
}

@media only screen and (min-width: 64rem) {
    .products-products__finish .card-button-container {
        bottom:20px;
        left: 30px;
        opacity: 0;
        padding-top: 12px;
        -webkit-transform: translateY(10px);
        transform: translateY(10px);
        width: calc(100% - 60px);
        z-index: 2
    }

    .products-products__finish .card-button-container,.products-products__finish .card-button-container:after {
        display: block;
        position: absolute;
        -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95) 0s;
        transition: .3s cubic-bezier(.3,.86,.36,.95) 0s
    }

    .products-products__finish .card-button-container:after {
        background-color: #f7f8f7;
        content: "";
        height: 1px;
        left: 0;
        top: 0;
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: left;
        transform-origin: left;
        width: 100%
    }
}

.products-products__finish .card-button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #141414;
    background-color: #fff;
    border-radius: 7px;
    color: #fff;
    color: #141414;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 10px 25px
}

@media only screen and (min-width: 37.5rem) {
    .products-products__finish .card-button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .products-products__finish .card-button:hover {
        background-color: #141414;
        color: #fff;
        padding: 10px 35px
    }
}

.products-products__finish .card-background {
    display: none
}

@media only screen and (min-width: 64rem) {
    .products-products__finish .card-background {
        background-color:#000;
        display: block;
        height: 100%;
        left: 0;
        pointer-events: none;
        position: absolute;
        top: 0;
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: top;
        transform-origin: top;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95);
        width: 100%;
        z-index: 1
    }
}

.products-products__finish-button,.products-products__finish-infos {
    display: none
}

@media only screen and (min-width: 64rem) {
    .product-hero {
        height:100dvh;
        min-height: 630px
    }
}

.product-hero__container {
    margin-left: auto;
    margin-right: auto;
    padding: 150px 25px 50px
}

@media only screen and (min-width: 600px) {
    .product-hero__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .product-hero__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .product-hero__container {
        padding-bottom:75px;
        padding-top: 250px
    }
}

@media only screen and (min-width: 64rem) {
    .product-hero__container {
        display:grid;
        grid-template-columns: repeat(2,1fr);
        height: 100%;
        padding-bottom: 30px;
        padding-top: 130px;
        position: relative
    }
}

.product-hero__content {
    padding-bottom: 40px;
    position: relative
}

@media only screen and (min-width: 37.5rem) {
    .product-hero__content {
        padding-bottom:50px
    }
}

@media only screen and (min-width: 64rem) {
    .product-hero__content {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: flex-end;
        justify-content: flex-end;
        padding-bottom: 0;
        padding-right: 30px;
        padding-top: 100px;
        position: static
    }
}

.product-hero__content:after {
    background-color: #676767;
    bottom: 0;
    content: "";
    display: block;
    height: 1px;
    left: -25px;
    position: absolute;
    width: 100vw
}

@media only screen and (min-width: 37.5rem) {
    .product-hero__content:after {
        left:-50px
    }
}

@media only screen and (min-width: 64rem) {
    .product-hero__content:after {
        height:calc(100% + 90px);
        left: 50%;
        top: 0;
        width: 1px
    }
}

.product-hero__header {
    margin-bottom: 70px
}

@media only screen and (min-width: 37.5rem) {
    .product-hero__header {
        margin-bottom:80px
    }
}

@media only screen and (min-width: 64rem) {
    .product-hero__header {
        margin-bottom:160px
    }
}

.product-hero__title {
    color: #141414;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.15;
    margin-bottom: 10px
}

@media only screen and (min-width: 600px) {
    .product-hero__title {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .product-hero__title {
        font-size:3.75rem
    }
}

.product-hero__types {
    grid-gap: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}

.product-hero__type,.product-hero__types {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start
}

.product-hero__type {
    background-color: #e5e8e5;
    border-radius: 3px;
    color: #141414;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: .9375rem;
    font-weight: 500;
    padding: 4px 8px
}

.product-hero__text-container {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: 1fr
}

.product-hero__text {
    font-size: 1.0625rem
}

@media only screen and (min-width: 37.5rem) {
    .product-hero__text {
        width:83.33333%
    }
}

.product-hero__finish-container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border-radius: 20px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    margin-top: 40px;
    overflow: hidden;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .product-hero__finish-container {
        margin-top:50px
    }
}

@media only screen and (min-width: 64rem) {
    .product-hero__finish-container {
        margin-left:30px;
        margin-top: 0;
        width: calc(100% - 30px)
    }
}

.product-hero__finish-container:after {
    content: "";
    display: block;
    padding-bottom: 100%
}

@media only screen and (min-width: 37.5rem) {
    .product-hero__finish-container:after {
        padding-bottom:50%
    }
}

@media only screen and (min-width: 64rem) {
    .product-hero__finish-container:after {
        padding-bottom:100%
    }
}

.product-hero__finish-content {
    grid-gap: 15px;
    border-top: 1px solid #f7f8f7;
    bottom: 25px;
    display: grid;
    grid-template-columns: 1fr auto;
    left: 25px;
    padding-top: 15px;
    position: absolute;
    width: calc(100% - 50px);
    z-index: 1
}

@media only screen and (min-width: 37.5rem) {
    .product-hero__finish-content {
        bottom:20px;
        left: 20px;
        width: calc(100% - 40px)
    }
}

.product-hero__finish-name {
    -ms-flex-item-align: center;
    -webkit-align-self: center;
    align-self: center;
    color: #fff;
    font-size: .9375rem;
    font-weight: 500
}

@media only screen and (min-width: 37.5rem) {
    .product-hero__finish-name {
        font-size:1.1875rem
    }
}

.product-hero__finish-button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #141414;
    background-color: #fff;
    border-radius: 7px;
    color: #fff;
    color: #141414;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 10px 15px
}

@media only screen and (min-width: 37.5rem) {
    .product-hero__finish-button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .product-hero__finish-button:hover {
        background-color: #141414;
        color: #fff;
        padding: 10px 35px
    }
}

.product-hero__image {
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: 0;
    width: 100%
}

.product-specs__container {
    margin-left: auto;
    margin-right: auto;
    padding: 50px 25px 70px
}

@media only screen and (min-width: 600px) {
    .product-specs__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .product-specs__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__container {
        padding-bottom:100px;
        padding-top: 75px
    }
}

@media only screen and (min-width: 64rem) {
    .product-specs__container {
        padding-top:90px
    }
}

.product-specs__content {
    background-color: #141414;
    border-radius: 20px
}

@media only screen and (min-width: 64rem) {
    .product-specs__content {
        display:grid;
        grid-template-columns: repeat(2,1fr)
    }
}

.product-specs__table {
    -ms-overflow-style: none;
    overflow-x: scroll;
    padding: 35px 20px 70px;
    scrollbar-width: none
}

.product-specs__table::-webkit-scrollbar {
    display: none
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__table {
        padding:35px 50px 55px
    }
}

@media only screen and (min-width: 64rem) {
    .product-specs__table {
        padding:35px 60px
    }
}

.product-specs__header {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-bottom: 50px;
    padding-bottom: 35px;
    position: relative
}

.product-specs__header:after {
    background-color: #676767;
    bottom: 0;
    content: "";
    display: block;
    height: 1px;
    left: -60px;
    position: absolute;
    width: calc(100% + 120px)
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__header {
        -webkit-box-orient:horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row
    }
}

.product-specs__logo {
    max-width: 250px;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__logo {
        max-width:225px;
        width: 50%
    }
}

.product-specs__download {
    color: #fff;
    font-size: .9375rem;
    margin-top: 20px
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__download {
        margin-top:0
    }
}

@media only screen and (min-width: 64rem) {
    .product-specs__download {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .product-specs__download:hover {
        opacity: .4
    }
}

.product-specs__type {
    grid-gap: 20px;
    border-bottom: 1px solid #676767;
    display: grid;
    grid-template-columns: 150px 340px;
    padding-bottom: 20px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__type {
        grid-template-columns:3fr 6fr;
        width: 100%
    }
}

.product-specs__details-row-title,.product-specs__details-title,.product-specs__finishes-title,.product-specs__origin-title,.product-specs__type-title {
    color: #fff;
    font-size: .875rem;
    font-weight: 600
}

.product-specs__origin {
    grid-gap: 20px;
    border-bottom: 1px solid #676767;
    display: grid;
    grid-template-columns: 150px 340px;
    padding-bottom: 20px;
    padding-top: 20px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__origin {
        grid-template-columns:3fr 6fr;
        width: 100%
    }
}

.product-specs__finishes {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: 150px 340px;
    padding-bottom: 20px;
    padding-top: 20px
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__finishes {
        grid-template-columns:3fr 6fr;
        width: 100%
    }
}

.product-specs__details-row-text,.product-specs__finishes-text,.product-specs__origin-text,.product-specs__type-text {
    color: #fff;
    font-size: .875rem;
    font-weight: 400
}

.product-specs__details {
    margin-top: 20px
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__details {
        margin-top:40px
    }
}

.product-specs__details-header {
    grid-gap: 20px;
    border-bottom: 1px solid #676767;
    display: grid;
    grid-template-columns: 150px 100px 100px 100px;
    padding-bottom: 8px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__details-header {
        grid-template-columns:3fr 2fr 2fr 2fr;
        width: 100%
    }
}

.product-specs__details-row {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: 150px 100px 100px 100px;
    padding-top: 12px
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__details-row {
        grid-template-columns:3fr 2fr 2fr 2fr
    }
}

.product-specs__cta {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border-top: 1px solid #676767;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    padding: 70px 20px
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__cta {
        padding:100px 50px
    }
}

@media only screen and (min-width: 64rem) {
    .product-specs__cta {
        border-left:1px solid #676767;
        border-top: none;
        height: 100%;
        padding: 150px 0
    }
}

.product-specs__cta-title {
    color: #fff;
    font-size: 1.375rem;
    margin-bottom: 30px;
    text-align: center
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__cta-title {
        font-size:2rem;
        margin-bottom: 40px
    }
}

@media only screen and (min-width: 64rem) {
    .product-specs__cta-title {
        margin-left:8.33333%;
        margin-right: 8.33333%;
        width: 66.66666%
    }
}

.product-specs__cta-button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #141414;
    background-color: #fff;
    border-radius: 7px;
    color: #fff;
    color: #141414;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 10px 25px
}

@media only screen and (min-width: 37.5rem) {
    .product-specs__cta-button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .product-specs__cta-button:hover {
        background-color: #141414;
        color: #fff;
        padding: 10px 35px
    }
}

.product-finishes {
    border-top: 1px solid #676767
}

.product-finishes__container {
    margin-left: auto;
    margin-right: auto;
    padding: 70px 25px
}

@media only screen and (min-width: 600px) {
    .product-finishes__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .product-finishes__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .product-finishes__container {
        padding-bottom:100px;
        padding-top: 100px
    }
}

@media only screen and (min-width: 64rem) {
    .product-finishes__container {
        padding-bottom:170px;
        padding-top: 80px
    }
}

.product-finishes__header {
    margin-bottom: 70px
}

@media only screen and (min-width: 37.5rem) {
    .product-finishes__header {
        margin-bottom:100px
    }
}

@media only screen and (min-width: 64rem) {
    .product-finishes__header {
        width:66.66666%
    }
}

.product-finishes__sub-title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #e5e8e5;
    border-radius: 3px;
    color: #141414;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    margin-bottom: 10px;
    padding: 4px 8px
}

.product-finishes__finishes {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: 1fr
}

@media only screen and (min-width: 37.5rem) {
    .product-finishes__finishes {
        grid-gap:16px;
        grid-template-columns: repeat(2,1fr)
    }
}

@media only screen and (min-width: 64rem) {
    .product-finishes__finishes {
        grid-template-columns:repeat(3,1fr)
    }
}

.product-finishes__finish {
    border-radius: 20px;
    display: block;
    overflow: hidden;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.product-finishes__finish:after {
    content: "";
    display: block;
    padding-bottom: 100%
}

@media only screen and (min-width: 64rem) {
    .product-finishes__finish:hover .card-infos {
        opacity:1
    }

    .product-finishes__finish:hover .card-title {
        opacity: 0;
        -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95) 0s;
        transition: .3s cubic-bezier(.3,.86,.36,.95) 0s
    }

    .product-finishes__finish:hover .card-button-container {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .2s;
        transition: .5s cubic-bezier(.3,.86,.36,.95) .2s
    }

    .product-finishes__finish:hover .card-button-container:after {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .3s;
        transition: .5s cubic-bezier(.3,.86,.36,.95) .3s
    }

    .product-finishes__finish:hover .card-background {
        -webkit-transform: scaleY(1);
        transform: scaleY(1)
    }
}

.product-finishes__finish .card-image {
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: 0;
    width: 100%
}

.product-finishes__finish .card-number {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .875rem;
    font-weight: 300;
    height: 40px;
    -webkit-justify-content: center;
    justify-content: center;
    left: 20px;
    position: absolute;
    top: 20px;
    width: 40px;
    z-index: 2
}

@media only screen and (min-width: 64rem) {
    .product-finishes__finish .card-number {
        left:30px;
        top: 30px
    }
}

.product-finishes__finish .card-infos {
    display: none
}

@media only screen and (min-width: 64rem) {
    .product-finishes__finish .card-infos {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        color: #fff;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        font-size: .875rem;
        font-weight: 400;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        left: 30px;
        line-height: 1.4;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        top: 110px;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95);
        width: calc(100% - 60px);
        z-index: 2
    }

    .product-finishes__finish .card-infos strong {
        font-weight: 600
    }
}

.product-finishes__finish .card-title {
    grid-gap: 15px;
    border-top: 1px solid #f7f8f7;
    bottom: 20px;
    color: #fff;
    display: grid;
    font-size: .9375rem;
    font-weight: 500;
    grid-template-columns: 1fr auto;
    left: 20px;
    padding-top: 15px;
    position: absolute;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .2s;
    transition: .5s cubic-bezier(.3,.86,.36,.95) .2s;
    width: calc(100% - 40px);
    z-index: 2
}

@media only screen and (min-width: 37.5rem) {
    .product-finishes__finish .card-title {
        font-size:1.1875rem
    }
}

@media only screen and (min-width: 64rem) {
    .product-finishes__finish .card-title {
        bottom:30px;
        font-size: 1.375rem;
        left: 30px;
        width: calc(100% - 60px)
    }
}

.product-finishes__finish .card-button-container {
    display: none
}

@media only screen and (min-width: 64rem) {
    .product-finishes__finish .card-button-container {
        bottom:20px;
        left: 30px;
        opacity: 0;
        padding-top: 12px;
        -webkit-transform: translateY(10px);
        transform: translateY(10px);
        width: calc(100% - 60px);
        z-index: 2
    }

    .product-finishes__finish .card-button-container,.product-finishes__finish .card-button-container:after {
        display: block;
        position: absolute;
        -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95) 0s;
        transition: .3s cubic-bezier(.3,.86,.36,.95) 0s
    }

    .product-finishes__finish .card-button-container:after {
        background-color: #f7f8f7;
        content: "";
        height: 1px;
        left: 0;
        top: 0;
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: left;
        transform-origin: left;
        width: 100%
    }
}

.product-finishes__finish .card-button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #141414;
    background-color: #fff;
    border-radius: 7px;
    color: #fff;
    color: #141414;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 10px 25px
}

@media only screen and (min-width: 37.5rem) {
    .product-finishes__finish .card-button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .product-finishes__finish .card-button:hover {
        background-color: #141414;
        color: #fff;
        padding: 10px 35px
    }
}

.product-finishes__finish .card-background {
    display: none
}

@media only screen and (min-width: 64rem) {
    .product-finishes__finish .card-background {
        background-color:#000;
        display: block;
        height: 100%;
        left: 0;
        pointer-events: none;
        position: absolute;
        top: 0;
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: top;
        transform-origin: top;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95);
        width: 100%;
        z-index: 1
    }

    .product-finishes__finish:hover .product-finishes__finish-name {
        opacity: 1
    }
}

.projects-hero {
    background-color: #141414;
    position: relative
}

.projects-hero__container {
    margin-left: auto;
    margin-right: auto;
    padding: 200px 25px 70px
}

@media only screen and (min-width: 600px) {
    .projects-hero__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .projects-hero__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .projects-hero__container {
        padding-bottom:100px;
        padding-top: 250px
    }
}

@media only screen and (min-width: 64rem) {
    .projects-hero__container {
        padding-top:300px
    }
}

.projects-hero__title {
    color: #141414;
    color: #fff;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.15;
    padding-bottom: 20px
}

@media only screen and (min-width: 600px) {
    .projects-hero__title {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .projects-hero__title {
        font-size:3.75rem
    }
}

.projects-hero__line {
    background-color: #676767;
    content: "";
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    width: 100vw
}

.projects-hero__text-container {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: auto 1fr;
    margin-top: 30px
}

@media only screen and (min-width: 64rem) {
    .projects-hero__text-container {
        margin-left:50%;
        width: 50%
    }
}

.projects-hero__text {
    color: #fff
}

.projects-projects {
    background-color: #141414
}

.projects-projects__container {
    display: grid;
    grid-template-columns: 1fr;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 70px;
    padding-left: 25px;
    padding-right: 25px
}

@media only screen and (min-width: 600px) {
    .projects-projects__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .projects-projects__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px;
    }
}

@media only screen and (min-width: 37.5rem) {
    .projects-projects__container {
        padding-bottom:100px;
    }
}

@media only screen and (min-width: 64rem) {
    .projects-projects__container {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        grid-column-gap: 16px;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        padding-bottom: 80px;
    }
}

.projects-projects__categories {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -ms-overflow-style: none;
    -webkit-align-items: center;
    align-items: center;
    border: 1px solid #707070;
    border-radius: 7px;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    grid-row: 1/2;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    justify-self: flex-start;
    margin-bottom: 20px;
    overflow-x: scroll;
    padding: 3px;
    scrollbar-width: none;
    white-space: nowrap;
    width: 100%
}

.projects-projects__categories::-webkit-scrollbar {
    display: none
}

@media only screen and (min-width: 64rem) {
    .projects-projects__categories {
        grid-column:1/3;
        grid-row: 1/2;
        margin-bottom: 15px
    }
}

.projects-projects__category {
    background-color: #141414;
    border-radius: 7px;
    color: #fff;
    cursor: pointer;
    font-size: .875rem;
    font-weight: 500;
    padding: 5px 40px;
    text-align: center;
    -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
    transition: .3s cubic-bezier(.3,.86,.36,.95)
}

@media only screen and (min-width: 64rem) {
    .projects-projects__category:hover {
        background-color:#2c2c2c
    }
}

.projects-projects__category--selected {
    background-color: #fff;
    color: #141414
}

@media only screen and (min-width: 64rem) {
    .projects-projects__category--selected:hover {
        background-color:#fff
    }
}

.projects-projects__filters-container {
    grid-row: 2/3;
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .projects-projects__filters-container {
        width:calc(16.66666% - 16px)
    }
}

.projects-projects__products {
    margin-bottom: 40px;
    width: 100%
}

.projects-projects__products--opened .projects-projects__products-arrow {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
}

@media only screen and (min-width: 64rem) {
    .projects-projects__products {
        margin-bottom:10px
    }
}

.projects-projects__products-title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-align-items: center;
    align-items: center;
    border-bottom: 1px solid #676767;
    color: #fff;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .875rem;
    font-weight: 500;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    padding: 10px;
    width: 100%
}

.projects-projects__products-arrow {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.projects-projects__products-container {
    grid-gap: 18px;
    display: grid;
    grid-template-columns: 1fr;
    height: 0;
    overflow: hidden;
    padding-top: 20px;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

@media only screen and (min-width: 37.5rem) {
    .projects-projects__products-container {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        grid-row-gap: 20px;
        grid-column-gap: 30px;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start
    }
}

@media only screen and (min-width: 64rem) {
    .projects-projects__products-container {
        grid-gap:25px;
        display: grid;
        grid-template-columns: 1fr;
        padding-top: 25px
    }
}

.projects-projects__product {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    color: #fff;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .875rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding-left: 10px;
    position: relative
}

.projects-projects__product:before {
    background-color: #fff;
    border-radius: 4px;
    content: "";
    display: block;
    height: 15px;
    margin-right: 8px;
    width: 15px
}

.projects-projects__product:after {
    background-color: #141414;
    border-radius: 3px;
    content: "";
    display: block;
    height: 11px;
    left: 12px;
    opacity: 0;
    position: absolute;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
    transition: .3s cubic-bezier(.3,.86,.36,.95);
    width: 11px
}

.projects-projects__product--selected:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.projects-projects__locations {
    margin-bottom: 40px;
    width: 100%
}

.projects-projects__locations--opened .projects-projects__locations-arrow {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
}

@media only screen and (min-width: 64rem) {
    .projects-projects__locations {
        margin-bottom:0
    }
}

.projects-projects__locations-title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-align-items: center;
    align-items: center;
    border-bottom: 1px solid #676767;
    color: #fff;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .875rem;
    font-weight: 500;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    padding: 10px;
    width: 100%
}

.projects-projects__locations-arrow {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.projects-projects__locations-container {
    grid-gap: 18px;
    display: grid;
    grid-template-columns: 1fr;
    height: 0;
    overflow: hidden;
    padding-top: 20px;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

@media only screen and (min-width: 37.5rem) {
    .projects-projects__locations-container {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        grid-row-gap: 20px;
        grid-column-gap: 30px;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start
    }
}

@media only screen and (min-width: 64rem) {
    .projects-projects__locations-container {
        grid-gap:25px;
        display: grid;
        grid-template-columns: 1fr;
        padding-top: 25px
    }
}

.projects-projects__location {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    color: #fff;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .875rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding-left: 10px;
    position: relative
}

.projects-projects__location:before {
    background-color: #fff;
    border-radius: 4px;
    content: "";
    display: block;
    height: 15px;
    margin-right: 8px;
    width: 15px
}

.projects-projects__location:after {
    background-color: #141414;
    border-radius: 3px;
    content: "";
    display: block;
    height: 11px;
    left: 12px;
    opacity: 0;
    position: absolute;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
    transition: .3s cubic-bezier(.3,.86,.36,.95);
    width: 11px
}

.projects-projects__location--selected:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.projects-projects__title-container {
    grid-gap: 20px;
    background-color: #e5e8e5;
    border-radius: 10px;
    display: grid;
    grid-template-columns: 1fr;
    margin-bottom: 40px;
    padding: 25px 20px;
    -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
    transition: .3s cubic-bezier(.3,.86,.36,.95);
    width: 100%
}

.projects-projects__title-container--hide {
    opacity: 0
}

@media only screen and (min-width: 37.5rem) {
    .projects-projects__title-container {
        grid-gap:16px;
        grid-template-columns: 2fr 4fr;
        padding: 40px 30px
    }
}

@media only screen and (min-width: 64rem) {
    .projects-projects__title-container {
        margin-bottom:16px;
        padding: 40px
    }
}

.projects-projects__title {
    font-size: 1.125rem;
    width: 75%
}

@media only screen and (min-width: 37.5rem) {
    .projects-projects__title {
        width:100%
    }
}

@media only screen and (min-width: 64rem) {
    .projects-projects__title {
        font-size:1.375rem
    }
}

.projects-projects__text {
    font-size: .875rem
}

@media only screen and (min-width: 37.5rem) {
    .projects-projects__text {
        font-size:.875rem
    }
}

@media only screen and (min-width: 64rem) {
    .projects-projects__text {
        font-size:.875rem
    }
}

.projects-projects__projects-container {
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .projects-projects__projects-container {
        /* width:83.33333%; */
    }
}

.projects-projects__projects {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: 1fr;
    -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
    transition: .3s cubic-bezier(.3,.86,.36,.95)
}

.projects-projects__projects--hide {
    opacity: 0;
    -webkit-transform: translateY(100px);
    transform: translateY(100px)
}

@media only screen and (min-width: 37.5rem) {
    .projects-projects__projects {
        grid-gap:16px;
        grid-template-columns: repeat(2,1fr)
    }
}

@media only screen and (min-width: 64rem) {
    .projects-projects__projects {
        grid-template-columns:repeat(3,1fr)
    }
}

.projects-projects__project {
    border-radius: 20px;
    display: block;
    overflow: hidden;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.projects-projects__project:after {
    content: "";
    display: block;
    padding-bottom: 100%
}

@media only screen and (min-width: 64rem) {
    .projects-projects__project:hover .card-infos {
        opacity:1
    }

    .projects-projects__project:hover .card-title {
        opacity: 0;
        -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95) 0s;
        transition: .3s cubic-bezier(.3,.86,.36,.95) 0s
    }

    .projects-projects__project:hover .card-button-container {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .2s;
        transition: .5s cubic-bezier(.3,.86,.36,.95) .2s
    }

    .projects-projects__project:hover .card-button-container:after {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .3s;
        transition: .5s cubic-bezier(.3,.86,.36,.95) .3s
    }

    .projects-projects__project:hover .card-background {
        -webkit-transform: scaleY(1);
        transform: scaleY(1)
    }
}

.projects-projects__project .card-image {
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: 0;
    width: 100%
}

.projects-projects__project .card-number {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .875rem;
    font-weight: 300;
    height: 40px;
    -webkit-justify-content: center;
    justify-content: center;
    left: 20px;
    position: absolute;
    top: 20px;
    width: 40px;
    z-index: 2
}

@media only screen and (min-width: 64rem) {
    .projects-projects__project .card-number {
        left:30px;
        top: 30px
    }
}

.projects-projects__project .card-infos {
    display: none
}

@media only screen and (min-width: 64rem) {
    .projects-projects__project .card-infos {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        color: #fff;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        font-size: .875rem;
        font-weight: 400;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        left: 30px;
        line-height: 1.4;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        top: 110px;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95);
        width: calc(100% - 60px);
        z-index: 2
    }

    .projects-projects__project .card-infos strong {
        font-weight: 600
    }
}

.projects-projects__project .card-title {
    grid-gap: 15px;
    border-top: 1px solid #f7f8f7;
    bottom: 20px;
    color: #fff;
    display: grid;
    font-size: .9375rem;
    font-weight: 500;
    grid-template-columns: 1fr auto;
    left: 20px;
    padding-top: 15px;
    position: absolute;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .2s;
    transition: .5s cubic-bezier(.3,.86,.36,.95) .2s;
    width: calc(100% - 40px);
    z-index: 2
}

@media only screen and (min-width: 37.5rem) {
    .projects-projects__project .card-title {
        font-size:1.1875rem
    }
}

@media only screen and (min-width: 64rem) {
    .projects-projects__project .card-title {
        bottom:30px;
        font-size: 1.375rem;
        left: 30px;
        width: calc(100% - 60px)
    }
}

.projects-projects__project .card-button-container {
    display: none
}

@media only screen and (min-width: 64rem) {
    .projects-projects__project .card-button-container {
        bottom:20px;
        left: 30px;
        opacity: 0;
        padding-top: 12px;
        -webkit-transform: translateY(10px);
        transform: translateY(10px);
        width: calc(100% - 60px);
        z-index: 2
    }

    .projects-projects__project .card-button-container,.projects-projects__project .card-button-container:after {
        display: block;
        position: absolute;
        -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95) 0s;
        transition: .3s cubic-bezier(.3,.86,.36,.95) 0s
    }

    .projects-projects__project .card-button-container:after {
        background-color: #f7f8f7;
        content: "";
        height: 1px;
        left: 0;
        top: 0;
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: left;
        transform-origin: left;
        width: 100%
    }
}

.projects-projects__project .card-button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #141414;
    background-color: #fff;
    border-radius: 7px;
    color: #fff;
    color: #141414;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 10px 25px
}

@media only screen and (min-width: 37.5rem) {
    .projects-projects__project .card-button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .projects-projects__project .card-button:hover {
        background-color: #141414;
        color: #fff;
        padding: 10px 35px
    }
}

.projects-projects__project .card-background {
    display: none
}

@media only screen and (min-width: 64rem) {
    .projects-projects__project .card-background {
        background-color:#000;
        display: block;
        height: 100%;
        left: 0;
        pointer-events: none;
        position: absolute;
        top: 0;
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: top;
        transform-origin: top;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95);
        width: 100%;
        z-index: 1
    }
}

.projects-projects__project:before {
    background: -webkit-gradient(linear,left bottom,left top,from(#141414),to(transparent));
    background: linear-gradient(0deg,#141414,transparent);
    bottom: 0;
    content: "";
    display: block;
    height: 150px;
    left: 0;
    opacity: .6;
    position: absolute;
    width: 100%;
    z-index: 1
}

@media only screen and (min-width: 64rem) {
    .projects-projects__project:hover .projects-projects__project-title {
        opacity:1
    }

    .projects-projects__project:hover .projects-projects__project-image {
        -webkit-transform: scale(1.05);
        transform: scale(1.05)
    }
}

.projects-projects__project-category,.projects-projects__project-location {
    opacity: 0;
    pointer-events: none;
    position: absolute
}

@media only screen and (min-width: 64rem) {
    .projects-projects__project-image {
        -webkit-transition:.75s cubic-bezier(.3,.86,.36,.95);
        transition: .75s cubic-bezier(.3,.86,.36,.95)
    }
}

.projects-projects__empty {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    background-color: #e5e8e5;
    border-radius: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    padding: 25px 20px;
    -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
    transition: .3s cubic-bezier(.3,.86,.36,.95);
    width: 100%
}

.projects-projects__empty--hide {
    opacity: 0;
    pointer-events: none
}

@media only screen and (min-width: 37.5rem) {
    .projects-projects__empty {
        padding:40px 30px
    }
}

@media only screen and (min-width: 64rem) {
    .projects-projects__empty {
        padding:40px
    }
}

.projects-projects__nav {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-top: 40px;
    -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
    transition: .3s cubic-bezier(.3,.86,.36,.95);
    width: 100%
}

.projects-projects__nav--hide {
    opacity: 0;
    pointer-events: none
}

.projects-projects__next,.projects-projects__previous {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #141414;
    background-color: #fff;
    border-radius: 7px;
    color: #fff;
    color: #141414;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 15px
}

@media only screen and (min-width: 37.5rem) {
    .projects-projects__next,.projects-projects__previous {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .projects-projects__next:hover,.projects-projects__previous:hover {
        background-color: #141414;
        color: #fff;
        padding: 10px 35px
    }

    .projects-projects__next svg,.projects-projects__previous svg {
        display: none
    }
}

.projects-projects__next span,.projects-projects__previous span {
    display: none
}

@media only screen and (min-width: 37.5rem) {
    .projects-projects__next span,.projects-projects__previous span {
        display:inline-block
    }
}

.projects-projects__next.hide,.projects-projects__previous.hide {
    opacity: .1;
    pointer-events: none
}

@media only screen and (min-width: 37.5rem) {
    .projects-projects__next,.projects-projects__previous {
        padding:10px 25px
    }
}

.projects-projects__next:hover,.projects-projects__previous:hover {
    background-color: #2c2c2c;
    padding: 10px 25px
}

.projects-projects__pagination {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    grid-gap: 7px;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    margin-bottom: 0;
    width: auto
}

.projects-projects__pagination li {
    padding: 0
}

.projects-projects__pagination li:before {
    display: none
}

.projects-projects__pagination li a {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border-radius: 50%;
    color: #676767;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: 1.0625rem;
    font-weight: 500;
    height: 35px;
    -webkit-justify-content: center;
    justify-content: center;
    text-align: center;
    width: 35px
}

@media only screen and (min-width: 64rem) {
    .projects-projects__pagination li a {
        font-size:1.375rem;
        height: 40px;
        width: 40px
    }
}

.projects-projects__pagination li.active a {
    background-color: #fff;
    color: #141414
}

.projects-map {
    background-color: #141414;
    position: relative
}

.projects-map__line {
    background-color: #676767;
    content: "";
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    width: 100vw
}

.projects-map__container {
    margin-left: auto;
    margin-right: auto;
    padding: 70px 25px
}

@media only screen and (min-width: 600px) {
    .projects-map__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .projects-map__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .projects-map__container {
        padding-bottom:100px;
        padding-top: 100px
    }
}

@media only screen and (min-width: 64rem) {
    .projects-map__container {
        padding-bottom:75px;
        padding-top: 75px
    }
}

.projects-map__header {
    margin-bottom: 60px
}

@media only screen and (min-width: 37.5rem) {
    .projects-map__header {
        margin-bottom:50px
    }
}

@media only screen and (min-width: 64rem) {
    .projects-map__header {
        grid-gap:16px;
        display: grid;
        grid-template-columns: 8fr 4fr;
        margin-bottom: 70px
    }
}

.projects-map__title {
    color: #fff;
    margin-bottom: 20px;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .projects-map__title {
        width:83.33333%
    }
}

@media only screen and (min-width: 64rem) {
    .projects-map__title {
        margin-bottom:0;
        max-width: 650px;
        width: 75%
    }
}

.projects-map__text {
    color: #fff;
    font-size: 1rem
}

@media only screen and (min-width: 37.5rem) {
    .projects-map__text {
        font-size:1.0625rem;
        width: 83.33333%
    }
}

@media only screen and (min-width: 64rem) {
    .projects-map__text {
        width:100%
    }
}

.projects-map__image {
    border-radius: 10px;
    width: 100%
}

.projects-links {
    background-color: #141414;
    border-top: 1px solid #676767
}

.projects-links__container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 25px;
    padding-right: 25px
}

@media only screen and (min-width: 600px) {
    .projects-links__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .projects-links__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 64rem) {
    .projects-links__container {
        display:grid;
        grid-template-columns: repeat(2,1fr)
    }
}

.projects-links__link {
    padding-bottom: 40px;
    padding-top: 40px;
    position: relative
}

@media only screen and (min-width: 37.5rem) {
    .projects-links__link {
        padding:45px 30px
    }
}

@media only screen and (min-width: 64rem) {
    .projects-links__link {
        -webkit-box-orient:horizontal;
        -webkit-box-direction: normal;
        -webkit-box-align: start;
        -ms-flex-align: start;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: flex-start;
        justify-content: flex-start
    }
}

.projects-links__link:after {
    background-color: #676767;
    bottom: 0;
    content: "";
    display: block;
    height: 1px;
    left: -25px;
    position: absolute;
    width: 100vw
}

@media only screen and (min-width: 37.5rem) {
    .projects-links__link:after {
        left:-50px
    }
}

@media only screen and (min-width: 64rem) {
    .projects-links__link:after {
        left:-30px
    }
}

@media only screen and (min-width: 1600px) {
    .projects-links__link:after {
        left:calc(-50vw - -770px)
    }
}

@media only screen and (min-width: 64rem) {
    .projects-links__link:last-child:after {
        height:100%;
        left: 0;
        width: 1px
    }
}

.projects-links__number {
    color: #fff;
    font-size: .75rem;
    font-weight: 500;
    position: absolute;
    right: 0;
    top: 40px
}

@media only screen and (min-width: 64rem) {
    .projects-links__number {
        right:30px;
        top: 45px
    }
}

.projects-links__title {
    color: #fff;
    font-size: 1.125rem;
    font-weight: 400;
    margin-bottom: 60px;
    width: 75%
}

@media only screen and (min-width: 37.5rem) {
    .projects-links__title {
        width:50%
    }
}

@media only screen and (min-width: 64rem) {
    .projects-links__title {
        font-size:1.375rem;
        margin-bottom: 90px
    }
}

.projects-links__text {
    color: #fff;
    margin-bottom: 40px
}

@media only screen and (min-width: 37.5rem) {
    .projects-links__text {
        margin-bottom:0;
        width: 50%
    }
}

@media only screen and (min-width: 64rem) {
    .projects-links__text {
        -ms-flex-item-align:end;
        -webkit-align-self: flex-end;
        align-self: flex-end;
        margin-right: 50%
    }
}

.projects-links__button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #141414;
    border-radius: 7px;
    color: #fff;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 0
}

@media only screen and (min-width: 37.5rem) {
    .projects-links__button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .projects-links__button:hover {
        background-color: #141414;
        color: #fff;
        padding: 10px 35px
    }
}

.projects-links__button:hover {
    padding: 0
}

@media only screen and (min-width: 37.5rem) {
    .projects-links__button {
        bottom:40px;
        position: absolute;
        right: 0
    }
}

@media only screen and (min-width: 64rem) {
    .projects-links__button {
        bottom:45px;
        right: 30px;
        -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .projects-links__button:hover {
        opacity: .4
    }
}

.project-hero {
    background-color: #141414;
    position: relative
}

.project-hero__container {
    margin-left: auto;
    margin-right: auto;
    padding: 300px 25px 25px;
    z-index: 1
}

@media only screen and (min-width: 600px) {
    .project-hero__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .project-hero__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .project-hero__container {
        padding-bottom:25px;
        padding-top: 500px
    }
}

@media only screen and (min-width: 64rem) {
    .project-hero__container {
        padding-bottom:30px;
        padding-top: 400px
    }
}

.project-hero__title {
    color: #141414;
    color: #fff;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.15;
    margin-bottom: 20px;
    position: relative;
    width: 100%;
    z-index: 1
}

@media only screen and (min-width: 600px) {
    .project-hero__title {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .project-hero__title {
        font-size:3.75rem
    }
}

@media only screen and (min-width: 37.5rem) {
    .project-hero__title {
        margin-bottom:40px
    }
}

@media only screen and (min-width: 64rem) {
    .project-hero__title {
        margin-bottom:30px;
        width: 41.66666%
    }
}

.project-hero__line {
    background-color: #e5e8e5;
    content: "";
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    width: 100vw;
    z-index: 1
}

.project-hero__products {
    padding-left: 0;
    padding-top: 20px;
    position: relative;
    width: 100%;
    z-index: 1
}

@media only screen and (min-width: 37.5rem) {
    .project-hero__products {
        padding-left:0;
        padding-top: 40px
    }
}

@media only screen and (min-width: 64rem) {
    .project-hero__products {
        padding-left:var(--desktopWidth);
        padding-top: 30px
    }
}

.project-hero__products-header {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    background-color: #141414;
    border-radius: 20px;
    bottom: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: calc(100% - 20px);
    -webkit-justify-content: space-between;
    justify-content: space-between;
    left: 0;
    padding: 20px 75px 20px 15px;
    position: absolute;
    width: 100px;
    -webkit-writing-mode: vertical-lr;
    -ms-writing-mode: tb-lr;
    writing-mode: vertical-lr
}

@media only screen and (min-width: 37.5rem) {
    .project-hero__products-header {
        height:calc(100% - 40px)
    }
}

@media only screen and (min-width: 64rem) {
    .project-hero__products-header {
        height:calc(100% - 30px);
        left: var(--desktopWidth)
    }
}

.project-hero__products-title {
    color: #fff;
    font-size: .875rem;
    font-weight: 500;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

@media only screen and (min-width: 37.5rem) {
    .project-hero__products-title {
        font-size:.9375rem
    }
}

.project-hero__arrows {
    grid-gap: 7px;
    display: grid;
    grid-template-columns: auto auto
}

.project-hero__products-next,.project-hero__products-previous {
    cursor: pointer;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

@media only screen and (min-width: 64rem) {
    .project-hero__products-next:hover,.project-hero__products-previous:hover {
        opacity:.6
    }
}

.project-hero__products-list {
    pointer-events: none;
    position: relative
}

.project-hero__product {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border-radius: 20px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    left: 50px;
    overflow: hidden;
    pointer-events: all;
    position: absolute;
    top: 0;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

.project-hero__product--0 .project-hero__product-number,.project-hero__product--0 .project-hero__product-title {
    opacity: 1;
    z-index: 1
}

.project-hero__product--0 {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    width: var(--mobileWidth);
    z-index: 0
}

.project-hero__product--1 {
    -webkit-transform: translateX(15px);
    transform: translateX(15px);
    width: var(--mobileWidth);
    z-index: -1
}

.project-hero__product--2 {
    -webkit-transform: translateX(30px);
    transform: translateX(30px);
    width: var(--mobileWidth);
    z-index: -2
}

.project-hero__product--3 {
    -webkit-transform: translateX(45px);
    transform: translateX(45px);
    width: var(--mobileWidth);
    z-index: -3
}

.project-hero__product--4 {
    -webkit-transform: translateX(60px);
    transform: translateX(60px);
    width: var(--mobileWidth);
    z-index: -4
}

.project-hero__product--5 {
    -webkit-transform: translateX(75px);
    transform: translateX(75px);
    width: var(--mobileWidth);
    z-index: -5
}

.project-hero__product--6 {
    -webkit-transform: translateX(90px);
    transform: translateX(90px);
    width: var(--mobileWidth);
    z-index: -6
}

.project-hero__product--7 {
    -webkit-transform: translateX(105px);
    transform: translateX(105px);
    width: var(--mobileWidth);
    z-index: -7
}

.project-hero__product--8 {
    -webkit-transform: translateX(120px);
    transform: translateX(120px);
    width: var(--mobileWidth);
    z-index: -8
}

.project-hero__product--9 {
    -webkit-transform: translateX(135px);
    transform: translateX(135px);
    width: var(--mobileWidth);
    z-index: -9
}

.project-hero__product--10 {
    -webkit-transform: translateX(150px);
    transform: translateX(150px);
    width: var(--mobileWidth);
    z-index: -10
}

.project-hero__product--11 {
    -webkit-transform: translateX(165px);
    transform: translateX(165px);
    width: var(--mobileWidth);
    z-index: -11
}

.project-hero__product--12 {
    -webkit-transform: translateX(180px);
    transform: translateX(180px);
    width: var(--mobileWidth);
    z-index: -12
}

.project-hero__product--13 {
    -webkit-transform: translateX(195px);
    transform: translateX(195px);
    width: var(--mobileWidth);
    z-index: -13
}

.project-hero__product--14 {
    -webkit-transform: translateX(210px);
    transform: translateX(210px);
    width: var(--mobileWidth);
    z-index: -14
}

.project-hero__product--15 {
    -webkit-transform: translateX(225px);
    transform: translateX(225px);
    width: var(--mobileWidth);
    z-index: -15
}

.project-hero__product--16 {
    -webkit-transform: translateX(240px);
    transform: translateX(240px);
    width: var(--mobileWidth);
    z-index: -16
}

.project-hero__product--17 {
    -webkit-transform: translateX(255px);
    transform: translateX(255px);
    width: var(--mobileWidth);
    z-index: -17
}

.project-hero__product--18 {
    -webkit-transform: translateX(270px);
    transform: translateX(270px);
    width: var(--mobileWidth);
    z-index: -18
}

.project-hero__product--19 {
    -webkit-transform: translateX(285px);
    transform: translateX(285px);
    width: var(--mobileWidth);
    z-index: -19
}

.project-hero__product--20 {
    -webkit-transform: translateX(300px);
    transform: translateX(300px);
    width: var(--mobileWidth);
    z-index: -20
}

.project-hero__product--21 {
    -webkit-transform: translateX(315px);
    transform: translateX(315px);
    width: var(--mobileWidth);
    z-index: -21
}

.project-hero__product--22 {
    -webkit-transform: translateX(330px);
    transform: translateX(330px);
    width: var(--mobileWidth);
    z-index: -22
}

.project-hero__product--23 {
    -webkit-transform: translateX(345px);
    transform: translateX(345px);
    width: var(--mobileWidth);
    z-index: -23
}

.project-hero__product--24 {
    -webkit-transform: translateX(360px);
    transform: translateX(360px);
    width: var(--mobileWidth);
    z-index: -24
}

.project-hero__product--25 {
    -webkit-transform: translateX(375px);
    transform: translateX(375px);
    width: var(--mobileWidth);
    z-index: -25
}

@media only screen and (min-width: 37.5rem) {
    .project-hero__product--0 {
        -webkit-transform:translateX(0);
        transform: translateX(0);
        width: var(--tabletWidth);
        z-index: 0
    }

    .project-hero__product--1 {
        -webkit-transform: translateX(40px);
        transform: translateX(40px);
        width: var(--tabletWidth);
        z-index: -1
    }

    .project-hero__product--2 {
        -webkit-transform: translateX(80px);
        transform: translateX(80px);
        width: var(--tabletWidth);
        z-index: -2
    }

    .project-hero__product--3 {
        -webkit-transform: translateX(120px);
        transform: translateX(120px);
        width: var(--tabletWidth);
        z-index: -3
    }

    .project-hero__product--4 {
        -webkit-transform: translateX(160px);
        transform: translateX(160px);
        width: var(--tabletWidth);
        z-index: -4
    }

    .project-hero__product--5 {
        -webkit-transform: translateX(200px);
        transform: translateX(200px);
        width: var(--tabletWidth);
        z-index: -5
    }

    .project-hero__product--6 {
        -webkit-transform: translateX(240px);
        transform: translateX(240px);
        width: var(--tabletWidth);
        z-index: -6
    }

    .project-hero__product--7 {
        -webkit-transform: translateX(280px);
        transform: translateX(280px);
        width: var(--tabletWidth);
        z-index: -7
    }

    .project-hero__product--8 {
        -webkit-transform: translateX(320px);
        transform: translateX(320px);
        width: var(--tabletWidth);
        z-index: -8
    }

    .project-hero__product--9 {
        -webkit-transform: translateX(360px);
        transform: translateX(360px);
        width: var(--tabletWidth);
        z-index: -9
    }

    .project-hero__product--10 {
        -webkit-transform: translateX(400px);
        transform: translateX(400px);
        width: var(--tabletWidth);
        z-index: -10
    }

    .project-hero__product--11 {
        -webkit-transform: translateX(440px);
        transform: translateX(440px);
        width: var(--tabletWidth);
        z-index: -11
    }

    .project-hero__product--12 {
        -webkit-transform: translateX(480px);
        transform: translateX(480px);
        width: var(--tabletWidth);
        z-index: -12
    }

    .project-hero__product--13 {
        -webkit-transform: translateX(520px);
        transform: translateX(520px);
        width: var(--tabletWidth);
        z-index: -13
    }

    .project-hero__product--14 {
        -webkit-transform: translateX(560px);
        transform: translateX(560px);
        width: var(--tabletWidth);
        z-index: -14
    }

    .project-hero__product--15 {
        -webkit-transform: translateX(600px);
        transform: translateX(600px);
        width: var(--tabletWidth);
        z-index: -15
    }

    .project-hero__product--16 {
        -webkit-transform: translateX(640px);
        transform: translateX(640px);
        width: var(--tabletWidth);
        z-index: -16
    }

    .project-hero__product--17 {
        -webkit-transform: translateX(680px);
        transform: translateX(680px);
        width: var(--tabletWidth);
        z-index: -17
    }

    .project-hero__product--18 {
        -webkit-transform: translateX(720px);
        transform: translateX(720px);
        width: var(--tabletWidth);
        z-index: -18
    }

    .project-hero__product--19 {
        -webkit-transform: translateX(760px);
        transform: translateX(760px);
        width: var(--tabletWidth);
        z-index: -19
    }

    .project-hero__product--20 {
        -webkit-transform: translateX(800px);
        transform: translateX(800px);
        width: var(--tabletWidth);
        z-index: -20
    }

    .project-hero__product--21 {
        -webkit-transform: translateX(840px);
        transform: translateX(840px);
        width: var(--tabletWidth);
        z-index: -21
    }

    .project-hero__product--22 {
        -webkit-transform: translateX(880px);
        transform: translateX(880px);
        width: var(--tabletWidth);
        z-index: -22
    }

    .project-hero__product--23 {
        -webkit-transform: translateX(920px);
        transform: translateX(920px);
        width: var(--tabletWidth);
        z-index: -23
    }

    .project-hero__product--24 {
        -webkit-transform: translateX(960px);
        transform: translateX(960px);
        width: var(--tabletWidth);
        z-index: -24
    }

    .project-hero__product--25 {
        -webkit-transform: translateX(1000px);
        transform: translateX(1000px);
        width: var(--tabletWidth);
        z-index: -25
    }
}

.project-hero__product:after {
    content: "";
    display: block;
    padding-bottom: 100%
}

@media only screen and (min-width: 37.5rem) {
    .project-hero__product:after {
        padding-bottom:75%
    }
}

@media only screen and (min-width: 64rem) {
    .project-hero__product:after {
        padding-bottom:275px
    }
}

.project-hero__product:first-of-type {
    position: relative
}

@media only screen and (min-width: 64rem) {
    .project-hero__product {
        width:500px!important
    }

    .project-hero__product:hover .project-hero__product-image {
        -webkit-transform: scale(1.05);
        transform: scale(1.05)
    }
}

.project-hero__product-image {
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: 0;
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .project-hero__product-image {
        -webkit-transition:.75s cubic-bezier(.3,.86,.36,.95);
        transition: .75s cubic-bezier(.3,.86,.36,.95)
    }
}

.project-hero__product-number {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .875rem;
    font-weight: 300;
    height: 40px;
    -webkit-justify-content: center;
    justify-content: center;
    left: 15px;
    opacity: 0;
    position: absolute;
    top: 15px;
    width: 40px;
    z-index: 1
}

@media only screen and (min-width: 37.5rem) {
    .project-hero__product-number {
        left:20px;
        top: 20px
    }
}

.project-hero__product-title {
    grid-gap: 15px;
    border-top: 1px solid #f7f8f7;
    bottom: 15px;
    color: #fff;
    display: grid;
    font-size: .875rem;
    font-weight: 500;
    grid-template-columns: 1fr auto;
    left: 15px;
    opacity: 0;
    padding-top: 12px;
    position: absolute;
    width: calc(100% - 30px);
    z-index: 1
}

@media only screen and (min-width: 37.5rem) {
    .project-hero__product-title {
        bottom:20px;
        font-size: 1.1875rem;
        left: 20px;
        width: calc(100% - 40px)
    }
}

.project-hero__image-container {
    border-top-right-radius: 50px;
    height: 100%;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100%
}

.project-hero__image-container:before {
    background-color: #141414;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    opacity: .3;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1
}

.project-hero__image {
    height: 110%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: 0;
    width: 100%
}

.project-about {
    background-color: #141414;
    border-bottom: 1px solid #676767
}

.project-about__container {
    margin-left: auto;
    margin-right: auto;
    padding: 70px 25px
}

@media only screen and (min-width: 600px) {
    .project-about__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .project-about__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .project-about__container {
        padding-bottom:100px;
        padding-top: 150px
    }
}

@media only screen and (min-width: 64rem) {
    .project-about__container {
        grid-gap:16px;
        display: grid;
        grid-template-columns: 1fr 3fr 1fr 5fr 1fr;
        padding-bottom: 90px;
        padding-top: 180px
    }
}

.project-about__infos {
    margin-bottom: 40px
}

@media only screen and (min-width: 64rem) {
    .project-about__infos {
        grid-column:2/3;
        margin-bottom: 0
    }
}

.project-about__categories {
    grid-gap: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 15px
}

.project-about__categories,.project-about__category {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start
}

.project-about__category {
    background-color: #e5e8e5;
    background-color: #fff;
    border-radius: 3px;
    color: #141414;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: .9375rem;
    font-weight: 500;
    padding: 4px 8px
}

.project-about__location,.project-about__products {
    color: #fff;
    font-size: .875rem;
    font-weight: 400
}

.project-about__location span,.project-about__products span {
    font-weight: 600
}

.project-about__title {
    color: #141414;
    color: #fff;
    font: 400 1.5rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.2;
    line-height: 1.1
}

@media only screen and (min-width: 600px) {
    .project-about__title {
        font-size:2.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .project-about__title {
        font-size:2.75rem
    }
}

@media only screen and (min-width: 64rem) {
    .project-about__title {
        grid-column:4/5
    }
}

.project-content {
    background-color: #141414;
    border-bottom: 1px solid #676767;
    border-top: 1px solid #676767
}

.project-content__container {
    margin-left: auto;
    margin-right: auto;
    padding: 70px 25px
}

@media only screen and (min-width: 600px) {
    .project-content__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .project-content__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .project-content__container {
        padding-bottom:100px;
        padding-top: 100px
    }
}

.project-content__image-container {
    border-radius: 10px;
    margin-bottom: 30px;
    overflow: hidden;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .project-content__image-container {
        margin-bottom:50px
    }
}

@media only screen and (min-width: 64rem) {
    .project-content__image-container {
        margin-bottom:70px
    }
}

.project-content__image-container--left {
    margin-right: 25%;
    width: 75%
}

@media only screen and (min-width: 37.5rem) {
    .project-content__image-container--left {
        margin-right:33.33333%;
        width: 66.66666%
    }
}

@media only screen and (min-width: 64rem) {
    .project-content__image-container--left {
        margin-right:25%;
        width: 75%
    }
}

.project-content__image-container--right {
    margin-left: 25%;
    width: 75%
}

@media only screen and (min-width: 37.5rem) {
    .project-content__image-container--right {
        margin-left:33.33333%;
        width: 66.66666%
    }
}

@media only screen and (min-width: 64rem) {
    .project-content__image-container--right {
        margin-left:25%;
        width: 75%
    }
}

.project-content__image {
    width: 100%
}

.project-content__text-container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    margin-bottom: 30px;
    padding-bottom: 70px;
    padding-top: 70px;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .project-content__text-container {
        margin-bottom:50px;
        padding-bottom: 100px;
        padding-top: 100px
    }
}

@media only screen and (min-width: 64rem) {
    .project-content__text-container {
        margin-bottom:70px;
        padding-bottom: 110px;
        padding-top: 110px
    }
}

.project-content__text {
    color: #141414;
    color: #fff;
    font: 400 1.5rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.2;
    line-height: 1.1;
    text-align: center;
    width: 100%
}

@media only screen and (min-width: 600px) {
    .project-content__text {
        font-size:2.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .project-content__text {
        font-size:2.75rem
    }
}

.project-content__text .word {
    height: 1.2em;
    margin: -.2em 0
}

@media only screen and (min-width: 37.5rem) {
    .project-content__text {
        margin:0 16.33333%;
        width: 66.66666%
    }
}

.project-content__gallery-container {
    display: grid;
    margin-bottom: 30px
}

@media only screen and (min-width: 64rem) {
    .project-content__gallery-container {
        margin-bottom:70px
    }
}

.project-content__gallery-container--2-columns {
    grid-gap: 20px;
    grid-template-columns: repeat(1,1fr)
}

@media only screen and (min-width: 37.5rem) {
    .project-content__gallery-container--2-columns {
        grid-gap:16px;
        grid-template-columns: repeat(2,1fr)
    }
}

@media only screen and (min-width: 64rem) {
    .project-content__gallery-container--2-columns {
        grid-gap:70px
    }
}

.project-content__gallery-container--3-columns {
    grid-gap: 16px;
    grid-template-columns: repeat(2,1fr)
}

.project-content__gallery-container--3-columns .project-content__gallery-image-container {
    cursor: pointer
}

@media only screen and (min-width: 37.5rem) {
    .project-content__gallery-container--3-columns {
        grid-template-columns:repeat(3,1fr)
    }
}

@media only screen and (min-width: 64rem) {
    .project-content__gallery-container--3-columns {
        grid-gap:70px
    }
}

.project-content__gallery-image-container {
    border-radius: 10px;
    overflow: hidden;
    width: 100%
}

.project-content__gallery-image {
    height: 125%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    width: 100%
}

.project-lightbox {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 100vh;
    -webkit-justify-content: center;
    justify-content: center;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    top: 0;
    -webkit-transition: .75s cubic-bezier(.3,.86,.36,.95) .15s;
    transition: .75s cubic-bezier(.3,.86,.36,.95) .15s;
    width: 100%;
    z-index: 1111
}

.project-lightbox,.project-lightbox--open {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}

.project-lightbox--open {
    opacity: 1;
    pointer-events: all;
    -webkit-transition: .75s cubic-bezier(.3,.86,.36,.95) 0s;
    transition: .75s cubic-bezier(.3,.86,.36,.95) 0s
}

.project-lightbox--open .project-lightbox__carousel-container {
    opacity: 1;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) .15s;
    transition: .5s cubic-bezier(.3,.86,.36,.95) .15s
}

@media only screen and (min-width: 64rem) {
    .project-lightbox--open .project-lightbox__arrows,.project-lightbox--open .project-lightbox__image {
        pointer-events:all
    }
}

.project-lightbox__close {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #141414;
    background-color: #fff;
    border-radius: 7px;
    color: #fff;
    color: #141414;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 10px 25px;
    position: absolute;
    right: 20px;
    top: 20px;
    z-index: 1
}

@media only screen and (min-width: 37.5rem) {
    .project-lightbox__close {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .project-lightbox__close:hover {
        background-color: #141414;
        color: #fff;
        padding: 10px 35px
    }
}

.project-lightbox__container {
    margin-left: auto;
    margin-right: auto;
    padding: 70px 25px;
    position: relative;
    z-index: 1
}

@media only screen and (min-width: 600px) {
    .project-lightbox__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .project-lightbox__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .project-lightbox__container {
        padding-bottom:100px;
        padding-top: 100px
    }
}

@media only screen and (min-width: 64rem) {
    .project-lightbox__container {
        pointer-events:none
    }
}

.project-lightbox__carousel-container {
    opacity: 0;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95) 0s;
    transition: .5s cubic-bezier(.3,.86,.36,.95) 0s
}

.project-lightbox__image-container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    max-height: 50vh;
    position: relative;
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .project-lightbox__image-container {
        max-height:70vh
    }
}

.project-lightbox__image {
    border-radius: 10px;
    height: auto;
    max-height: 100%;
    max-width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    width: auto
}

.project-lightbox__arrows {
    grid-gap: 20px;
    margin-top: 40px
}

.project-lightbox__arrow-container,.project-lightbox__arrows {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center
}

.project-lightbox__arrow-container {
    background-color: #fff;
    border-radius: 7px;
    cursor: pointer;
    height: 35px;
    width: 35px
}

.project-lightbox__arrow--previous {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.project-lightbox__background {
    background-color: #141414ee;
    cursor: pointer;
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .contact-hero {
        -ms-flex-line-pack:end;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-align-content: flex-end;
        align-content: flex-end;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        height: 100vh;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        min-height: 850px
    }
}

@media only screen and (min-width: 64rem) {
    .contact-hero {
        min-height:800px
    }
}

.contact-hero__container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 200px
}

@media only screen and (min-width: 600px) {
    .contact-hero__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .contact-hero__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .contact-hero__container {
        -webkit-box-align:start;
        -ms-flex-align: start;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-align-items: flex-start;
        align-items: flex-start;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: flex-end;
        justify-content: flex-end;
        padding-top: 150px
    }
}

.contact-hero__content {
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .contact-hero__content {
        grid-gap:16px;
        display: grid;
        grid-column: 1/3;
        grid-template-columns: repeat(2,1fr)
    }
}

.contact-hero__headquarter {
    margin-bottom: 60px
}

@media only screen and (min-width: 37.5rem) {
    .contact-hero__headquarter {
        margin-bottom:0;
        margin-left: 50%;
        width: 50%
    }
}

@media only screen and (min-width: 64rem) {
    .contact-hero__headquarter {
        grid-column:1/3;
        margin-left: 75%;
        width: 16.666666%
    }
}

.contact-hero__headquarter:after {
    content: "";
    display: block;
    max-height: 0
}

@media only screen and (min-width: 37.5rem) {
    .contact-hero__headquarter:after {
        height:15vh;
        max-height: 150px
    }
}

@media only screen and (min-width: 64rem) {
    .contact-hero__headquarter:after {
        height:6vh
    }
}

.contact-hero__headquarter-title {
    border-bottom: 1px solid #141414;
    font-size: .875rem;
    font-weight: 500;
    margin-bottom: 25px;
    padding-bottom: 7px;
    width: 100%
}

.contact-hero__headquarter-address {
    color: #141414;
    display: block;
    font-size: .875rem;
    font-weight: 400;
    margin-bottom: 20px;
    width: 75%
}

@media only screen and (min-width: 64rem) {
    .contact-hero__headquarter-address {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .contact-hero__headquarter-address:hover {
        opacity: .4
    }
}

.contact-hero__hours {
    width: 75%
}

.contact-hero__hours-title {
    font-size: .875rem;
    font-weight: 500;
    width: 100%
}

.contact-hero__hours-text {
    font-size: .875rem;
    font-weight: 400;
    width: 100%
}

.contact-hero__header {
    grid-column: 1/3;
    margin-bottom: 40px;
    padding-bottom: 40px
}

@media only screen and (min-width: 64rem) {
    .contact-hero__header {
        margin-bottom:95px;
        padding-bottom: 25px
    }
}

.contact-hero__title {
    color: #141414;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.15
}

@media only screen and (min-width: 600px) {
    .contact-hero__title {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .contact-hero__title {
        font-size:3.75rem
    }
}

.contact-hero__line {
    background-color: #676767;
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    width: 100vw;
    z-index: 1
}

.contact-hero__questions {
    background-color: #141414;
    border-radius: 10px;
    margin-bottom: 40px;
    padding: 30px;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .contact-hero__questions {
        width:66.66666%
    }
}

@media only screen and (min-width: 64rem) {
    .contact-hero__questions {
        grid-column:2/3;
        margin-bottom: 55px;
        margin-left: 16.66666%
    }
}

.contact-hero__questions-title {
    color: #fff;
    font-size: 1.125rem;
    font-weight: 500
}

@media only screen and (min-width: 37.5rem) {
    .contact-hero__questions-title {
        font-size:1.375rem
    }
}

.contact-hero__questions-title a {
    color: #fff;
    display: inline-block;
    position: relative
}

.contact-hero__questions-title a:after {
    background-color: #fff;
    bottom: -2px;
    content: "";
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    -webkit-transform-origin: left;
    transform-origin: left;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95);
    width: 100%
}

@media only screen and (min-width: 64rem) {
    .contact-hero__questions-title a:hover:after {
        -webkit-transform:scaleX(0);
        transform: scaleX(0)
    }
}

.contact-hero__text-container {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: 1fr;
    margin-bottom: 40px
}

@media only screen and (min-width: 37.5rem) {
    .contact-hero__text-container {
        margin-bottom:50px
    }
}

@media only screen and (min-width: 64rem) {
    .contact-hero__text-container {
        align-self:flex-end;
        grid-column: 1/2;
        grid-row: 2/3;
        margin-bottom: 55px
    }
}

.contact-hero__text {
    font-size: .9375rem;
    font-weight: 400
}

@media only screen and (min-width: 37.5rem) {
    .contact-hero__text {
        font-size:1.0625rem;
        width: 83.33333%
    }
}

.contact-form__container {
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 70px;
    padding-left: 25px;
    padding-right: 25px
}

@media only screen and (min-width: 600px) {
    .contact-form__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .contact-form__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__container {
        padding-bottom:100px
    }
}

@media only screen and (min-width: 64rem) {
    .contact-form__container {
        padding-bottom:110px
    }
}

.contact-form__title {
    color: #141414;
    font: 400 1.5rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.2;
    margin-bottom: 30px;
    width: 100%
}

@media only screen and (min-width: 600px) {
    .contact-form__title {
        font-size:2.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .contact-form__title {
        font-size:2.75rem
    }
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__title {
        margin-bottom:50px;
        text-align: center
    }
}

@media only screen and (min-width: 64rem) {
    .contact-form__title {
        margin-bottom:60px;
        margin-left: 16.66666%;
        margin-right: 16.66666%;
        width: 66.66666%
    }
}

.contact-form__form {
    background-color: #e5e8e5;
    border-radius: 10px;
    padding: 30px 20px
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__form {
        padding:50px
    }
}

@media only screen and (min-width: 64rem) {
    .contact-form__form {
        padding:100px 0
    }
}

.contact-form__form .gform_anchor {
    position: absolute;
    top: 0
}

.contact-form__form .gform_required_legend {
    display: none
}

.contact-form__form :focus {
    outline: none
}

.contact-form__form .gform_fields,.contact-form__form .gform_footer {
    grid-gap: 16px;
    display: grid;
    grid-template-columns: 1fr;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__form .gform_fields,.contact-form__form .gform_footer {
        grid-template-columns:repeat(2,1fr)
    }
}

@media only screen and (min-width: 64rem) {
    .contact-form__form .gform_fields,.contact-form__form .gform_footer {
        margin:0 16.66666%;
        width: 66.66666%
    }
}

.contact-form__form .gform_validation_errors {
    margin-bottom: 20px;
    width: 100%
}

.contact-form__form .gform_validation_errors h1,.contact-form__form .gform_validation_errors h2,.contact-form__form .gform_validation_errors h3,.contact-form__form .gform_validation_errors h4,.contact-form__form .gform_validation_errors h5,.contact-form__form .gform_validation_errors h6,.contact-form__form .gform_validation_errors p {
    color: #141414;
    font: 400 .875rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.1
}

@media only screen and (min-width: 600px) {
    .contact-form__form .gform_validation_errors h1,.contact-form__form .gform_validation_errors h2,.contact-form__form .gform_validation_errors h3,.contact-form__form .gform_validation_errors h4,.contact-form__form .gform_validation_errors h5,.contact-form__form .gform_validation_errors h6,.contact-form__form .gform_validation_errors p {
        font-size:1.0625rem
    }
}

@media only screen and (min-width: 1024px) {
    .contact-form__form .gform_validation_errors h1,.contact-form__form .gform_validation_errors h2,.contact-form__form .gform_validation_errors h3,.contact-form__form .gform_validation_errors h4,.contact-form__form .gform_validation_errors h5,.contact-form__form .gform_validation_errors h6,.contact-form__form .gform_validation_errors p {
        font-size:1.0625rem
    }
}

@media only screen and (min-width: 64rem) {
    .contact-form__form .gform_validation_errors {
        margin:0 16.66666% 20px;
        width: 66.66666%
    }
}

.contact-form__form .gform_confirmation_message {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    background-color: #f7f8f7;
    border-radius: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    padding: 25px 20px;
    text-align: center;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__form .gform_confirmation_message {
        padding:40px 30px
    }
}

@media only screen and (min-width: 64rem) {
    .contact-form__form .gform_confirmation_message {
        margin-left:16.66666%;
        margin-right: 16.66666%;
        padding: 40px 15%;
        width: 66.66666%
    }
}

.contact-form__form form:not(#gform_2):not(#gform_3) {
    grid-gap: 16px;
    display: grid;
    grid-template-columns: 1fr;
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__form form:not(#gform_2):not(#gform_3) {
        grid-template-columns:repeat(2,1fr)
    }
}

@media only screen and (min-width: 64rem) {
    .contact-form__form form:not(#gform_2):not(#gform_3) {
        margin:0 16.66666%;
        width: 66.66666%
    }
}

.contact-form__form .input-container {
    position: relative;
    width: 100%
}

.contact-form__form .input-container .ginput_container,.contact-form__form .input-container:not(.gfield) {
    background-color: #fff;
    border-radius: 3px
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__form .input-container--textarea {
        grid-column:1/3
    }
}

.contact-form__form .input-container--dropdown {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start
}

.contact-form__form .input-container--dropdown .ginput_container,.contact-form__form .input-container--dropdown .ginput_container select {
    width: 100%
}

.contact-form__form .input-container--dropdown:after {
    background-image: url(../svg/technoprofil-dropdown.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    pointer-events: none;
    position: absolute;
    right: 20px;
    width: 10px
}

.contact-form__form .input-container label {
    color: #676767;
    font-size: .875rem;
    font-weight: 400;
    left: 20px;
    pointer-events: none;
    position: absolute;
    top: 21px;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95)
}

.contact-form__form .input-container.gfield:has(.ginput_container input:not(:-moz-placeholder-shown)) label:not(.gfield--type-fileupload label),.contact-form__form .input-container.gfield:has(.ginput_container select:not(:-moz-placeholder-shown)) label:not(.gfield--type-fileupload label),.contact-form__form .input-container.gfield:has(.ginput_container textarea:not(:-moz-placeholder-shown)) label:not(.gfield--type-fileupload label) {
    top: 14px;
    transform: scale(.8)
}

.contact-form__form .input-container.gfield:has(.ginput_container input:not(:-ms-input-placeholder)) label:not(.gfield--type-fileupload label),.contact-form__form .input-container.gfield:has(.ginput_container select:not(:-ms-input-placeholder)) label:not(.gfield--type-fileupload label),.contact-form__form .input-container.gfield:has(.ginput_container textarea:not(:-ms-input-placeholder)) label:not(.gfield--type-fileupload label) {
    top: 14px;
    transform: scale(.8)
}

.contact-form__form .input-container.gfield:has(.ginput_container input:focus) label:not(.gfield--type-fileupload label),.contact-form__form .input-container.gfield:has(.ginput_container input:not(:placeholder-shown)) label:not(.gfield--type-fileupload label),.contact-form__form .input-container.gfield:has(.ginput_container select:focus) label:not(.gfield--type-fileupload label),.contact-form__form .input-container.gfield:has(.ginput_container select:not(:placeholder-shown)) label:not(.gfield--type-fileupload label),.contact-form__form .input-container.gfield:has(.ginput_container textarea:focus) label:not(.gfield--type-fileupload label),.contact-form__form .input-container.gfield:has(.ginput_container textarea:not(:placeholder-shown)) label:not(.gfield--type-fileupload label) {
    top: 14px;
    -webkit-transform: scale(.8);
    transform: scale(.8)
}

.contact-form__form .input-container input,.contact-form__form .input-container select,.contact-form__form .input-container textarea {
    color: #141414;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.2;
    padding: 20px;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95);
    width: calc(100% - 40px)
}

.contact-form__form .input-container input:not(:-moz-placeholder-shown),.contact-form__form .input-container select:not(:-moz-placeholder-shown),.contact-form__form .input-container textarea:not(:-moz-placeholder-shown) {
    padding: 30px 20px 10px
}

.contact-form__form .input-container input:not(:-ms-input-placeholder),.contact-form__form .input-container select:not(:-ms-input-placeholder),.contact-form__form .input-container textarea:not(:-ms-input-placeholder) {
    padding: 30px 20px 10px
}

.contact-form__form .input-container input:focus,.contact-form__form .input-container input:not(:placeholder-shown),.contact-form__form .input-container select:focus,.contact-form__form .input-container select:not(:placeholder-shown),.contact-form__form .input-container textarea:focus,.contact-form__form .input-container textarea:not(:placeholder-shown) {
    padding: 30px 20px 10px
}

.contact-form__form .input-container input:not(:-moz-placeholder-shown)~label,.contact-form__form .input-container select:not(:-moz-placeholder-shown)~label,.contact-form__form .input-container textarea:not(:-moz-placeholder-shown)~label {
    top: 14px;
    transform: scale(.8)
}

.contact-form__form .input-container input:not(:-ms-input-placeholder)~label,.contact-form__form .input-container select:not(:-ms-input-placeholder)~label,.contact-form__form .input-container textarea:not(:-ms-input-placeholder)~label {
    top: 14px;
    transform: scale(.8)
}

.contact-form__form .input-container input:focus~label,.contact-form__form .input-container input:not(:placeholder-shown)~label,.contact-form__form .input-container select:focus~label,.contact-form__form .input-container select:not(:placeholder-shown)~label,.contact-form__form .input-container textarea:focus~label,.contact-form__form .input-container textarea:not(:placeholder-shown)~label {
    top: 14px;
    -webkit-transform: scale(.8);
    transform: scale(.8)
}

.contact-form__form .input-container textarea {
    min-height: 160px
}

.contact-form__form .input-container.gfield--type-fileupload label {
    background-color: #e5e8e5;
    border-radius: 7px;
    height: calc(100% - 14px);
    left: 7px;
    padding: 9px 15px;
    top: 7px
}

.contact-form__form .input-container.gfield--type-fileupload label,.contact-form__form .input-container .ginput_container_fileupload {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center
}

.contact-form__form .input-container .ginput_container_fileupload input {
    opacity: 0
}

.contact-form__form .input-container .gform_fileupload_rules {
    color: #676767;
    font-size: .875rem;
    font-weight: 500;
    left: 155px;
    padding-right: 25px;
    pointer-events: none;
    position: absolute;
    top: auto
}

.contact-form__form .input-container .ginput_preview_list,.contact-form__form .input-container .instruction {
    display: none
}

.contact-form__form .input-container .gfield_validation_message {
    color: #141414;
    font-size: .75rem;
    font-weight: 400;
    margin-bottom: 10px;
    margin-top: 10px
}

.contact-form__form .checkbox-container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    grid-gap: 15px;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    margin-bottom: 30px
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__form .checkbox-container {
        grid-column:1/3
    }
}

.contact-form__form .checkbox-container p {
    font-size: .9375rem;
    font-weight: 400;
    margin-bottom: 10px;
    width: 100%
}

.contact-form__form .checkbox-container input {
    cursor: pointer;
    height: 0;
    opacity: 0;
    position: absolute;
    width: 0
}

.contact-form__form .checkbox-container input:checked~.checkmark:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.contact-form__form .checkbox-container .checkmark {
    background-color: #fff;
    border-radius: 4px;
    height: 14px;
    left: 0;
    position: absolute;
    top: 0;
    width: 14px
}

.contact-form__form .checkbox-container .checkmark:after {
    background-color: #141414;
    border-radius: 3px;
    content: "";
    display: block;
    height: 10px;
    left: 2px;
    opacity: 0;
    position: absolute;
    top: 2px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
    transition: .3s cubic-bezier(.3,.86,.36,.95);
    width: 10px
}

.contact-form__form .checkbox-container label {
    color: #676767;
    cursor: pointer;
    font-size: .875rem;
    font-weight: 400;
    padding-left: 22px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.contact-form__form .consent-container {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    grid-gap: 12px;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    margin-bottom: 10px;
    margin-top: 10px
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__form .consent-container {
        grid-column:1/3
    }
}

.contact-form__form .consent-container p {
    font-size: .9375rem;
    font-weight: 400;
    margin-bottom: 10px;
    width: 100%
}

.contact-form__form .consent-container input {
    cursor: pointer;
    height: 0;
    opacity: 0;
    position: absolute;
    width: 0
}

.contact-form__form .consent-container input:checked~.checkmark:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.contact-form__form .consent-container .checkmark {
    background-color: #fff;
    border-radius: 4px;
    height: 14px;
    left: 0;
    position: absolute;
    top: 0;
    width: 14px
}

.contact-form__form .consent-container .checkmark:after {
    background-color: #141414;
    border-radius: 3px;
    content: "";
    display: block;
    height: 10px;
    left: 2px;
    opacity: 0;
    position: absolute;
    top: 2px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition: .3s cubic-bezier(.3,.86,.36,.95);
    transition: .3s cubic-bezier(.3,.86,.36,.95);
    width: 10px
}

.contact-form__form .consent-container label {
    color: #676767;
    cursor: pointer;
    font-size: .875rem;
    font-weight: 400;
    padding-left: 22px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.contact-form__form .g-recaptcha {
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__form .g-recaptcha {
        grid-column:1/3
    }
}

.contact-form__form .button-container {
    width: 100%
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__form .button-container {
        grid-column:1/3
    }
}

.contact-form__form .gform_footer {
    margin-top: 30px
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__form .gform_footer {
        margin-top:40px
    }
}

.contact-form__form .button-container,.contact-form__form .gform_footer {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    position: relative
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__form .button-container:hover input,.contact-form__form .gform_footer:hover input {
        background-color:#fff;
        color: #141414;
        padding: 16px 30px
    }

    .contact-form__form .button-container:hover:after,.contact-form__form .gform_footer:hover:after {
        -webkit-transform: translateX(-10px);
        transform: translateX(-10px)
    }
}

.contact-form__form .button-container:after,.contact-form__form .gform_footer:after {
    background-image: url(../svg/technoprofil-arrow.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    margin-left: 50px;
    pointer-events: none;
    position: absolute;
    right: 20px;
    top: 19px;
    width: 10px
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__form .button-container:after,.contact-form__form .gform_footer:after {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }
}

.contact-form__form .button-container input,.contact-form__form .gform_footer input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #141414;
    border-radius: 7px;
    color: #fff;
    font-size: .9375rem;
    font-weight: 500;
    outline: none;
    padding: 16px 20px;
    text-align: left;
    -webkit-transition: .5s cubic-bezier(.3,.86,.36,.95);
    transition: .5s cubic-bezier(.3,.86,.36,.95);
    width: 100%
}

.contact-form__form .button-container .gform_ajax_spinner,.contact-form__form .gform_footer .gform_ajax_spinner {
    display: none!important
}

.contact-form__form .form-section {
    font-size: 1.0625rem;
    font-weight: 400;
    margin-bottom: 30px;
    margin-top: 20px
}

@media only screen and (min-width: 37.5rem) {
    .contact-form__form .form-section {
        grid-column:1/3
    }
}

.policy__container {
    margin-left: auto;
    margin-right: auto;
    padding: 150px 25px 100px
}

@media only screen and (min-width: 600px) {
    .policy__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .policy__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 37.5rem) {
    .policy__container {
        padding-bottom:150px;
        padding-top: 200px
    }
}

@media only screen and (min-width: 64rem) {
    .policy__container {
        padding-top:250px
    }

    .policy__content {
        margin-left: 8.33333%;
        margin-right: 8.33333%;
        width: 83.33333%
    }
}

.policy__content h1 {
    color: #141414;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.15;
    line-height: 1;
    margin-bottom: 1em
}

@media only screen and (min-width: 600px) {
    .policy__content h1 {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .policy__content h1 {
        font-size:3.75rem
    }
}

.policy__content h2 {
    font: 400 1.125rem aeonik,Helvetica,Arial,sans-serif;
    font-weight: 500;
    line-height: 1.1;
    line-height: 1;
    margin-bottom: 1em;
    margin-top: 1.2em
}

@media only screen and (min-width: 600px) {
    .policy__content h2 {
        font-size:1.5rem
    }
}

@media only screen and (min-width: 1024px) {
    .policy__content h2 {
        font-size:2rem
    }
}

.policy__content h3 {
    font: 400 1.125rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1;
    margin-bottom: 1em;
    margin-top: 1.2em
}

@media only screen and (min-width: 600px) {
    .policy__content h3 {
        font-size:1.375rem
    }
}

@media only screen and (min-width: 1024px) {
    .policy__content h3 {
        font-size:1.5rem
    }
}

.policy__content h4,.policy__content h5,.policy__content h6 {
    font: 400 1rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1;
    margin-bottom: 1em;
    margin-top: 1.2em
}

@media only screen and (min-width: 600px) {
    .policy__content h4,.policy__content h5,.policy__content h6 {
        font-size:1.125rem
    }
}

@media only screen and (min-width: 1024px) {
    .policy__content h4,.policy__content h5,.policy__content h6 {
        font-size:1.25rem
    }
}

.policy__content p {
    color: #141414;
    font: 400 .875rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.1;
    line-height: 1.2;
    margin-bottom: 1em
}

@media only screen and (min-width: 600px) {
    .policy__content p {
        font-size:1.0625rem
    }
}

@media only screen and (min-width: 1024px) {
    .policy__content p {
        font-size:1.0625rem
    }
}

.policy__content b,.policy__content strong {
    font-weight: 600
}

.policy__content blockquote {
    background-color: #e5e8e5;
    border-left: 2px solid #141414;
    margin: .3em 0 2em;
    padding: 1em 2em .1em
}

.policy__content a {
    color: #4285b0;
    font-weight: 500
}

@media only screen and (min-width: 64rem) {
    .policy__content a {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .policy__content a:hover {
        opacity: .4
    }
}

.policy__content img {
    border-radius: 10px;
    margin: .3em 0 2em;
    max-width: 100%;
    overflow: hidden;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

#tinymce h1 {
    color: #141414;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.15;
    line-height: 1;
    margin-bottom: 1em
}

@media only screen and (min-width: 600px) {
    #tinymce h1 {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    #tinymce h1 {
        font-size:3.75rem
    }
}

#tinymce h2 {
    font: 400 1.125rem aeonik,Helvetica,Arial,sans-serif;
    font-weight: 500;
    line-height: 1.1;
    line-height: 1;
    margin-bottom: 1em;
    margin-top: 1.2em
}

@media only screen and (min-width: 600px) {
    #tinymce h2 {
        font-size:1.5rem
    }
}

@media only screen and (min-width: 1024px) {
    #tinymce h2 {
        font-size:2rem
    }
}

#tinymce h3 {
    font: 400 1.125rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1;
    margin-bottom: 1em;
    margin-top: 1.2em
}

@media only screen and (min-width: 600px) {
    #tinymce h3 {
        font-size:1.375rem
    }
}

@media only screen and (min-width: 1024px) {
    #tinymce h3 {
        font-size:1.5rem
    }
}

#tinymce h4,#tinymce h5,#tinymce h6 {
    font: 400 1rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1;
    margin-bottom: 1em;
    margin-top: 1.2em
}

@media only screen and (min-width: 600px) {
    #tinymce h4,#tinymce h5,#tinymce h6 {
        font-size:1.125rem
    }
}

@media only screen and (min-width: 1024px) {
    #tinymce h4,#tinymce h5,#tinymce h6 {
        font-size:1.25rem
    }
}

#tinymce p {
    color: #141414;
    font: 400 .875rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.1;
    line-height: 1.2;
    margin-bottom: 1em
}

@media only screen and (min-width: 600px) {
    #tinymce p {
        font-size:1.0625rem
    }
}

@media only screen and (min-width: 1024px) {
    #tinymce p {
        font-size:1.0625rem
    }
}

#tinymce a {
    color: #4285b0;
    font-weight: 500
}

#tinymce blockquote {
    background-color: #e5e8e5;
    border-left: 2px solid #141414;
    margin: .3em 0 2em;
    padding: 1em 2em .1em
}

.error__container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    padding: 200px 25px 150px
}

@media only screen and (min-width: 600px) {
    .error__container {
        padding-left:50px;
        padding-right: 50px
    }
}

@media only screen and (min-width: 1024px) {
    .error__container {
        margin-left:auto;
        margin-right: auto;
        max-width: 1600px;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media only screen and (min-width: 64rem) {
    .error__container {
        padding-bottom:285px;
        padding-top: 375px
    }
}

.error__title {
    color: #141414;
    font: 400 2rem aeonik,Helvetica,Arial,sans-serif;
    line-height: 1.15;
    margin-bottom: 20px;
    text-align: center;
    width: 100%
}

@media only screen and (min-width: 600px) {
    .error__title {
        font-size:3.25rem
    }
}

@media only screen and (min-width: 1024px) {
    .error__title {
        font-size:3.75rem
    }
}

@media only screen and (min-width: 37.5rem) {
    .error__title {
        margin-bottom:40px
    }
}

@media only screen and (min-width: 64rem) {
    .error__title {
        margin-left:16.66666%;
        margin-right: 16.66666%;
        width: 66.66666%
    }
}

.error__button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-align-items: center;
    align-items: center;
    background-color: #2c2c2c;
    border-radius: 7px;
    color: #fff;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: .9375rem;
    font-weight: 500;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 17px 20px
}

@media only screen and (min-width: 37.5rem) {
    .error__button {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }

    .error__button:hover {
        background-color: #fff;
        color: #141414;
        padding: 17px 40px
    }

    .error__button:hover:after {
        -webkit-transform: translateX(10px);
        transform: translateX(10px)
    }
}

.error__button:after {
    background-image: url(../svg/technoprofil-arrow.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    height: 10px;
    margin-left: 50px;
    width: 10px
}

@media only screen and (min-width: 37.5rem) {
    .error__button:after {
        -webkit-transition:.5s cubic-bezier(.3,.86,.36,.95);
        transition: .5s cubic-bezier(.3,.86,.36,.95)
    }
}

@media print {
    @page {
        size: portrait
    }

    *,:after,:before {
        color: #000!important
    }

    body {
        max-width: 670px
    }

    html {
        font-size: 10px!important
    }
}

@-webkit-keyframes splide-loading {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes splide-loading {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

.splide__track--draggable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.splide__track--fade>.splide__list>.splide__slide {
    margin: 0!important;
    opacity: 0;
    z-index: 0
}

.splide__track--fade>.splide__list>.splide__slide.is-active {
    opacity: 1;
    z-index: 1
}

.splide--rtl {
    direction: rtl
}

.splide__track--ttb>.splide__list {
    display: block
}

.splide__container {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative
}

.splide__list {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    height: 100%;
    margin: 0!important;
    padding: 0!important
}

.splide.is-initialized:not(.is-active) .splide__list {
    display: block
}

.splide__pagination {
    display: none
}

.splide__progress__bar {
    width: 0
}

.splide {
    visibility: hidden
}

.splide.is-initialized,.splide.is-rendered {
    visibility: visible
}

.splide__slide {
    -ms-flex-negative: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
    list-style-type: none!important;
    margin: 0;
    position: relative
}

.splide__slide img {
    vertical-align: bottom
}

.splide__spinner {
    -webkit-animation: splide-loading 1s linear infinite;
    animation: splide-loading 1s linear infinite;
    border: 2px solid #999;
    border-left-color: transparent;
    border-radius: 50%;
    bottom: 0;
    contain: strict;
    display: inline-block;
    height: 20px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 20px
}

.splide__sr {
    clip: rect(0 0 0 0);
    border: 0;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.splide__toggle.is-active .splide__toggle__play,.splide__toggle__pause {
    display: none
}

.splide__toggle.is-active .splide__toggle__pause {
    display: inline
}

.splide__track {
    overflow: hidden;
    position: relative;
    z-index: 0
}