@font-face {
    font-family: 'AauxNextBold';
    src: url('../../files/kamue/layout/fonts/aauxnextbold-webfont.eot');
    src: local('☺'), url('../../files/kamue/layout/fonts/aauxnextbold-webfont.woff') format('woff'), url('../../files/kamue/layout/fonts/aauxnextbold-webfont.ttf') format('truetype'), url('../../files/kamue/layout/fonts/aauxnextbold-webfont.svg#webfontTCTOqXav') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'AauxNext';
    src: url('../../files/kamue/layout/fonts/aaux_next_regular-webfont.eot');
    src: local('☺'), url('../../files/kamue/layout/fonts/aaux_next_regular-webfont.woff') format('woff'), url('../../files/kamue/layout/fonts/aaux_next_regular-webfont.ttf') format('truetype'), url('../../files/kamue/layout/fonts/aaux_next_regular-webfont.svg#webfontYC8bigye') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'PixelMixBold';
    src: url('../../files/kamue/layout/fonts/pixel/pixelmix_bold-webfont.eot');
    src: local('☺'), url('../../files/kamue/layout/fonts/pixel/pixelmix_bold-webfont.woff') format('woff'), url('../../files/kamue/layout/fonts/pixel/pixelmix_bold-webfont.ttf') format('truetype'), url('../../files/kamue/layout/fonts/pixel/pixelmix_bold-webfont.svg#webfont2McD03xU') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'PixelMix';
    src: url('../../files/kamue/layout/fonts/pixel/pixelmix-webfont.eot');
    src: local('☺'), url('../../files/kamue/layout/fonts/pixel/pixelmix-webfont.woff') format('woff'), url('../../files/kamue/layout/fonts/pixel/pixelmix-webfont.ttf') format('truetype'), url('../../files/kamue/layout/fonts/pixel/pixelmix-webfont.svg#webfontFUC9Nk1l') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'PFTempestaFive';
    src: url('../../files/kamue/layout/fonts/pf_tempesta_five/pf_tempesta_five-webfont.eot');
    src: local('☺'), url('../../files/kamue/layout/fonts/pf_tempesta_five/pf_tempesta_five-webfont.woff') format('woff'), url('../../files/kamue/layout/fonts/pf_tempesta_five/pf_tempesta_five-webfont.ttf') format('truetype'), url('../../files/kamue/layout/fonts/pf_tempesta_five/pf_tempesta_five-webfont.svg#webfontx7ujkZ28') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'PFTempestaFiveBold';
    src: url('../../files/kamue/layout/fonts/pf_tempesta_five/pf_tempesta_five_bold-webfont.eot');
    src: local('☺'), url('../../files/kamue/layout/fonts/pf_tempesta_five/pf_tempesta_five_bold-webfont.woff') format('woff'), url('../../files/kamue/layout/fonts/pf_tempesta_five/pf_tempesta_five_bold-webfont.ttf') format('truetype'), url('../../files/kamue/layout/fonts/pf_tempesta_five/pf_tempesta_five_bold-webfont.svg#webfont316OXjUt') format('svg');
    font-weight: normal;
    font-style: normal;
}
* {
    padding:0;
    margin:0;
    box-sizing: border-box;
}

:root {
    --base-font-family: "AauxNext", Arial, Verdana, sans-serif;
    --base-font-size: 15px;

    --font-family-bold: "AauxNextBold", sans-serif;

    --wrapper-width: 100%;

    --color-blue: #72aada;
    --color-blue-rgb: 114, 170, 218;
}

html,
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    max-height: 999999px;

    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;

    scroll-behavior: smooth;
    hyphens: auto;
}

body {
    color: #8c8c8c;
    font-family: var(--base-font-family);
    font-size: var(--base-font-size);
    line-height: 1.4em;

    background: #eee;

    display: flex;
    flex-direction: column;
    place-content: center;
    place-items: center;
}

a {
    color: #8c8c8c;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

.content-text p:not(:last-child) {
    margin-bottom: 1.2em;
}

.invisible {
    position: absolute;

    padding: 0;
    margin: -1px;

    width: 1px; height: 1px;

    border: 0;
    clip: rect(0 0 0 0);

    overflow: hidden;
}

#wrapper {
    width: var(--wrapper-width);
    padding: 0 25px;
}

#container {
    display: flex;
    flex-direction: column;

    width: 100%;

    /*min-height: 456px;*/
    /*max-height: 456px;*/
    /*min-height: 585px;*/
    /*max-height: 585px;*/
}

header {
    text-align: right;
    padding-top: 50px;
    padding-bottom: 50px;
}

#left {
    /*display: none;*/
    order: 1;
    overflow: hidden;
}
/*body.homepage #left {*/
/*    display: none;*/
/*}*/

body:not(.homepage) #left .inside {
    position: relative;
    height: 100%;
}

body:not(.homepage) #left .mod_article {
    height: calc(100% - 14px);
    overflow: auto;

    padding-block: 15px;

    margin-right: -16px;
    padding-right: 16px;
}

/*body:not(.homepage) #left .mod_article > div:last-child,*/
body:not(.homepage) #left .mod_article > div {
    padding-bottom: 20px;
}

body:not(.homepage) #left .mod_article::-webkit-scrollbar {
    display: none;
}

#main {
    order: 2;
    padding-block: 3px 9px;
}

#main .inside,
#main .mod_article,
#main .content-image,
#main .content-image figure {
    height: 100%;
}

body:not(.homepage):not(.projectpage) #main .inside {
    overflow: auto;
}

/*body:not(.homepage):not(.projectpage) #main .mod_article:has(:not(.content-image)) {*/
/*    padding-right: 30px;*/
/*}*/
body:not(.homepage):not(.projectpage) #main .mod_article:has(iframe) {
    padding-right: 0 !important;
}

footer {
    /*padding-block: 50px 20px;*/
    padding-block: 30px 20px;
    /*padding-inline: 190px 0;*/
}

footer,
footer a {
    font-size: 11px;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 2px;
}

footer a:hover {
    text-decoration: underline;
}

footer .inside {
    position: relative;

    display: flex;
    flex-direction: column;
    place-content: end;
    place-items: center;
}

/*footer .backlink {*/
/*    position: absolute;*/
/*    top: -30px; left: 0;*/
/*}*/
footer .backlink {
    padding-bottom: 20px;
}

footer .text-nav ul {
    flex-wrap: wrap;
    place-content: end;
}

footer .text-nav li {
    white-space: nowrap;
}

.backlink a {
    position: relative;
    display: block;

    font-size: 15px;
    text-decoration: none;
    text-transform: uppercase;

    padding-right: 30px;
}
.backlink a:after {
    content: '';

    position: absolute;
    top: 2px; right: 0;

    width: 11px; height: 11px;

    border: 1px solid #ccc;
}

.backlink a:hover {
    text-decoration: none;
}

.backlink a:hover:after {
    background: var(--color-blue);
    border-color: var(--color-blue);
}

body.homepage #wrapper {
    opacity: 0; visibility: hidden;
    transition: opacity 1000ms, visibility 1000ms;
}
body.homepage.loaded #wrapper {
    opacity: 1; visibility: visible;
}

body.homepage #left {
    opacity: 0; visibility: hidden;
    transition: opacity 550ms, visibility 550ms;
}
body.homepage.image-resized #left {
    opacity: 1; visibility: visible;
    transition-delay: 160ms;
}

body.homepage.image-resized.nra #left {
    transition-delay: 0s;
    transition: none;
}

body.homepage #main .inside,
body.homepage #main .mod_article,
body.homepage #main .inside .content-image {
    height: 100%;
}

body.homepage #main .mod_article {
    position: relative;
}

body.homepage #main .inside .content-image {
    position: relative;

    opacity: 1; visibility: visible;
    transition: opacity 550ms, visibility 550ms;

    z-index: 1;
}

body.homepage #main .inside .content-image.project-image {
    position: absolute;
    inset: 0;

    opacity: 0; visibility: hidden;
    transition: opacity 550ms, visibility 550ms;

    z-index: 2;
}
body.homepage.show-project-preview #main .inside .content-image.project-image {
    opacity: 1; visibility: visible;
}
body.homepage.show-project-preview #main .inside .content-image:not(.project-image) {
    opacity: 0; visibility: hidden;
}

body.homepage #main .content-image figure {
    /*position: absolute;*/
    /*top: 0; right: 0;*/

    width: 100%; height: 100%;

    text-align: right;
    overflow: hidden;

    cursor: pointer;

    transition: width 550ms;
}

body.homepage:not(.image-resized) #main .content-image:not(.project-image) figure {
    width: var(--wrapper-width);
}
body.homepage.image-resized.nra #main .content-image:not(.project-image) figure {
    transition: none;
}

body.homepage.image-resized #main .content-image figure {
    cursor: default;
}

body.homepage #main .content-image img {
    /*position: absolute;*/
    /*top: 0; right: 0;*/

    width: 100%; height: 100%;

    object-fit: cover;
    object-position: right center;
}

body.homepage #main .content-image.project-image figure {
    overflow: visible;
}

body.homepage #main .content-image.project-image figcaption {
    position: absolute;
    top: 100%;

    padding-block: 15px 0;
}

body.homepage #main .content-image.project-image figcaption .project-title {
    color: #92979E;
    font-family: var(--font-family-bold);
    font-size: 16px;
    text-transform: uppercase;

    margin-right: 15px;
}

.subpage-header {
    display: flex;
    place-content: space-between;

    padding-bottom: 15px;
    padding-right: 25px;
}


@media (max-width: 575.999px) {
    header img {
        max-width: 100%;
    }
}

@media (min-width: 576px) {
    #wrapper {
        --wrapper-width: 560px;
        padding: 0;
    }

    /*body.homepage #left {*/
    /*    display: block;*/
    /*}*/

}

@media (min-width: 768px) {
    body {
        height: 100dvh;
    }

    header {
        padding-top: 0;
    }

    #wrapper {
        --wrapper-width: 720px;
    }

    #container {
        flex-direction: row;

        /*min-height: 585px;*/
        /*max-height: 585px;*/
        min-height: 660px;
        max-height: 660px;
        /*min-height: 778px;*/
        /*max-height: 778px;*/
    }

    #main {
        width: 50%;
    }

    #left {
        width: 50%;
    }

    body.homepage #main .content-image figure {
        position: absolute;
        top: 0; right: 0;
    }

    body.homepage #main .content-image img {
        position: absolute;
        top: 0; right: 0;
    }

    body:not(.homepage) #left .inside:before,
    body:not(.homepage) #left .inside:after {
        content: '';

        position: absolute;
        left: 0; right: 20px;

        height: 25px;

        background-image: linear-gradient(to bottom, #eee 4%, rgba(238, 238, 238, 0) 100%);

        z-index: 2;
    }

    body:not(.homepage) #left .inside:before {
        top: 30px;
    }

    body:not(.homepage) #left .inside:after {
        bottom: -4px;

        background-image: linear-gradient(to top, #eee 4%, rgba(238, 238, 238, 0) 100%);
    }

    footer .inside {
        place-items: end;
    }

    footer .backlink {
        position: absolute;
        top: -30px; left: 0;

        padding-bottom: 0;
    }
}

@media (min-width: 992px) {
    #wrapper {
        --wrapper-width: 960px;
    }
}

@media (min-width: 1200px) {
    #wrapper {
        --wrapper-width: 1140px;
    }

    #main {
        width: 55%;
    }

    #left {
        width: 45%;
    }

    footer {
        padding-inline: 190px 0;
    }

    footer .backlink {
        position: absolute;
        top: 0; left: -190px;
    }
}

@media (min-width: 1440px) {
    #wrapper {
        --wrapper-width: 1400px;
    }
}
.nav-main ul.level_1,
.nav-main ul.level_1 li {
    list-style: none;
    text-transform: uppercase;
}

.nav-main ul.level_1 a,
.nav-main ul.level_1 strong {
    color: #A7A7A8;
    font-family: var(--base-font-family);
    font-size: 15px;
    text-decoration: none;
    letter-spacing: 4px;
}

.nav-main ul.level_1 > li > a,
.nav-main ul.level_1 > li > strong {
    font-family: var(--font-family-bold);
}

.nav-main ul.level_1 li {
    margin-bottom: 25px;
}
.nav-main ul.level_1 > li:last-child {
    margin-bottom: 0;
}

.nav-main ul.level_1 > li:first-child {
    margin-bottom: 30px;
}

/*body.projectpage #left .level_1 li.first {*/
/*    margin-bottom: 0px;*/
/*}*/

.nav-main ul.level_2 > li {
    margin-bottom: 3px;
}

.nav-main ul.level_2 > li {
    display: flex;
    justify-content: start;
    padding-block: 2px 5px;
}

.nav-main ul.level_2 > li:first-child {
    margin-top: 15px;
}

.nav-main ul.level_2 li,
.nav-main ul.level_2 li a {
    color: #A7A7A8;
    font-size: 15px;
    letter-spacing: normal;
}

.nav-main ul.level_2 li > a {
    width: 190px;
}

.nav-main ul.level_2 li.sibling a {
    /*float: left;*/
    display: block;
}

.nav-main ul.level_3 {
    /*float: right;*/

    /*min-width: 90px;*/
    /*max-width: 90px;*/
    /*padding-right: 20px;*/

    /*display: inline-block;*/
    display: flex;

    /*min-height: 27px;*/
    /*padding-bottom: 4px;*/
}

.nav-sub ul.level_1 {
    display: flex;
}

.nav-main ul.level_1 > li:first-child ul.level_3 {
    padding-bottom: 0;
}

/*#left .level_1 li.first ul.level_2 ul.level_3 {*/
/*    height: 19px;*/
/*    min-height: 19px;*/
/*}*/

.nav-sub ul.level_1 > li,
.nav-main ul.level_3 > li {
    padding: 0 2px;
    /*margin: 0 0 4px;*/
    margin: 0;

    /*width: 15px; height: 15px;*/

    display: block;

    /*cursor: pointer;*/
}

/*#left .level_1 ul.level_2 ul.level_3 li {*/
/*    margin: 0px 0px 4px;*/
/*    padding: 0px;*/
/*    !*	border:1px solid #CCC; *!*/
/*    height: 11px;*/
/*    width: 15px;*/
/*    margin-left:0px;*/
/*    display:block;*/
/*    float:left;*/
/*    cursor:pointer;*/
/*}*/

.nav-sub ul.level_1 > li > a,
.nav-sub ul.level_1 > li > strong,
.nav-main ul.level_3 > li > a {
    display: block;

    width: 15px; height: 15px;

    text-indent: -9999px;
    border: 2px solid #ccc;
    /*background: url(../../files/kamue/layout/images/icon-menu.gif) top left no-repeat;*/
}


.nav-sub ul.level_1 > li > strong,
.nav-sub ul.level_1 > li > a:hover,
.nav-main ul.level_3 >li a:hover {
    background: var(--color-blue);
    border: 2px solid var(--color-blue);
    /*background: url(../../files/kamue/layout/images/icon-menu-blue.gif) top left no-repeat;*/
}


/*#left .level_1 ul.level_2 ul.level_3 li div.over-image {*/
/*    display: none;*/
/*    height: 0px;*/
/*    line-height: 0px;*/
/*    width: 0px;*/
/*    visibility: hidden;*/
/*}*/

@media (min-width: 768px) {
    .nav-main ul.level_3 {
        padding-right: 20px;
    }
}

@media (max-width: 992px) {
    .nav-main ul.level_3 {
        place-content: end;
    }

    .nav-main ul.level_2 > li {
        justify-content: space-between;
    }
}


/**
 * Sub Nav
 ** --------------- **/

.nav-sub {
    display: flex;
}

.nav-sub ul,
.nav-sub ul > li {
    list-style: none;
    margin: 0;
}

.nav-sub ul {
    display: flex;
}

.nav-sub ul > li > a,
.nav-sub ul > li > strong {
    display: block;

    padding: 0 2px;
    margin: 0;
}


/**
 * Meta Nav
 ** --------------- **/

.nav-meta ul,
.nav-meta ul > li {
    list-style: none;
    margin: 0;
}

.nav-meta ul {
    display: flex;
    gap: 4px;

    padding-top: 5px;
}

.nav-meta ul > li:not(:last-child):after {
    content: '|';

    display: inline-block;
    padding-left: 4px;
}


/**
 * Text Nav
 ** --------------- **/

.content-text.text-nav ul,
.content-text.text-nav ul li {
    list-style: none;
    margin: 0;
}

.content-text.text-nav ul {
    display: flex;
    gap: 5px;
}

.content-text.text-nav.nav-seperator-line ul > li:not(:last-child):after {
    content: '|';

    display: inline-block;
    padding-left: 5px;
}

@media (max-width: 575.999px) {
    footer .inside {
        place-content: center;
    }

    footer .content-text.text-nav ul {
        flex-direction: column;
        place-items: center;
    }

    footer .content-text.text-nav.nav-seperator-line ul > li:not(:last-child):after {
        content: none;
        display: none;
    }

    .nav-meta {
        padding-top: 30px;
    }
}
body:not(.homepage) #main .content-image img,
body:not(.homepage) #main .content-image picture {
    width: 100%; height: auto;
    max-height: 100%;
}

#left .page-title {
    text-transform: uppercase;
}

#left .mod_article > div {
    padding-right: 40px;
}

.gallery-slider {
    --swiper-navigation-color: #fff;
    --swiper-pagination-color: #fff
}

.gallery-thumbs button,
.gallery-slider button {
    background: none;
    border: none;
}

.gallery-thumbs img,
.gallery-slider img {
    /*width: 100%; */
    height: auto;

    margin: 0; line-height: 0;
}

.gallery-thumbs li {
    /*height: fit-content;*/
    aspect-ratio: 910/455;
}

/* Center smaller images vertically inside the main slider */
:is(.gallery-slider, .gallery-thumbs) .swiper-slide {
    display: flex;
    align-items: center;
    /*justify-content: center;*/
    width: 100%;
    /*height: auto; !* let the flex wrapper stretch the slide *!*/

    background: #dedede;
}

:is(.gallery-slider, .gallery-thumbs) .swiper-slide figure {
    text-align: center;
    width: 100%;
    line-height: 0;
}

:is(.gallery-slider, .gallery-thumbs) .swiper-slide img {
    /*width: 100%;*/
    max-width: 100%;
    height: auto;
}

.gallery-thumbs .swiper-slide img {
    max-height: 117px;
    width: auto;
}

.gallery-thumbs {
    --swiper-navigation-color: var(--color-blue);
    --swiper-pagination-color: var(--color-blue);

    --swiper-navigation-size: 20px;

    padding-top: 15px;
    padding-bottom: 30px;
}

.gallery-thumbs button {
    top: auto; bottom: 0;
    margin-top: 0;
}


body.projectpage #left .content-text :is(h1, h2, h3, h4, h5, h6) {
    font-size: 1.5em;
    font-weight: bold;
    text-transform: uppercase;

    padding-bottom: 40px;

    margin-block: .83em;
}

.gallery-thumbs li figure {
    position: relative;
    display: block;

    line-height: 0;
    cursor: pointer;
}

.gallery-thumbs li figure img {
    position: relative;
    z-index: 1;
}

.gallery-thumbs li figure:before {
    content: '';

    position: absolute;
    inset: 0;

    background: rgba(var(--color-blue-rgb), 0.75);

    opacity: 0; visibility: hidden;
    transition: opacity 550ms, visibility 550ms;

    z-index: 2;
}

.gallery-thumbs li figure:after {
    content: '+';

    color: #fff;
    font-size: 45px;

    position: absolute;
    top: 50%; left: 50%;

    translate: -50% -50%;

    z-index: 3;

    opacity: 0; visibility: hidden;
    transition: opacity 550ms, visibility 550ms;
}

.gallery-thumbs li figure:hover:before,
.gallery-thumbs li figure:hover:after {
    opacity: 1; visibility: visible;
}

.mod_article.team .content-text p {
    font-size: 17px;
    line-height: 1.75em;

    strong {
        font-size: 20px;
    }
}