/***************************************************************************
* Topbar
****************************************************************************/
.topbar {
    background-color: transparent;
    box-shadow: none;
    --typo-topbar-mode-bg: #FFFFFF;
    --typo-topbar-mode-hover-bg: #000000;
    --typo-topbar-mode-color: #000000;
    --typo-topbar-mode-hover-color: #FFFFFF;
}
.topbar.light_mode {
    --typo-topbar-mode-bg: #000000;
    /*--typo-topbar-mode-hover-bg: #F5CA40;*/
    --typo-topbar-mode-hover-bg: #d8a460;
    --typo-topbar-mode-color: #FFFFFF;
    --typo-topbar-mode-hover-color: #000000;
}

@media screen and (min-width:64em){
    .topbar > .row {position: relative; height: 0;}
    .topbar > .row > .columns {position: static;}
}


/***************************************************************************
* Logo
****************************************************************************/
.logo_wrapper {
    display: block;
    position: relative;
    padding: 0.5em;
    background-color: var(--typo-topbar-mode-bg);
    box-shadow: 0 0 0.0625em rgba(0,0,0,0.3);
    border-radius: var(--typo-border-radius);
    overflow: hidden;
    transition: all .5s ease;
}
.topbar .logo_wrapper {
    width: 10em; height: 2.5em;
}
.logo_wrapper .svg_wrapper {
    width: 9em;
}
/*
.logo_wrapper:after {
    position: absolute; content: '';
    top: 50%; left: 50%; width: 0; height: 0;
    transform: translate(-50%,-50%);
    background-color: var(--typo-topbar-mode-hover-bg);
    transition: all .25s ease;
}
.logo_wrapper:hover:after,
.logo_wrapper:focus:after {
    height: 100%;
    width: 100%;
}
*/
.logo_wrapper:after {
    content: ''; position: absolute;
    top: 50%; left: 0; 
    width: 0; height: 105%; z-index: -1;
    transform: translate(0,-50%);
    background-color: var(--typo-topbar-mode-hover-bg);
    transition: all .25s ease;
}
.logo_wrapper:hover:after,
.logo_wrapper:focus:after {
    width: 105%;
}

.logo_wrapper > * {
    position: relative;
    z-index: 10;
}

.logo_wrapper path {
    transition: all .25s ease;
    fill: var(--typo-topbar-mode-color);
}
.logo_wrapper:hover path {
    fill: var(--typo-topbar-mode-hover-color);
}

.logo_wrapper > .logo .svg_wrapper.data_ratio svg {
    height: auto;
}

@media screen and (min-width:64em){
    .topbar .logo_wrapper {
        position: absolute;
        top: 2em; left: 1em;
        width: 12em; height: 3em;
    }
    .logo_wrapper .svg_wrapper {
        width: 11em;
    }
}





/***************************************************************************
* Toggle
****************************************************************************/
.navigation_toggle_wrapper .navigation_toggle {
    background-color: var(--typo-topbar-mode-bg);
    color: var(--typo-topbar-mode-color);
    box-shadow: 0 0 0.0625em rgba(0,0,0,0.3);
    border-radius: var(--typo-border-radius);
    width: 2.5em;height: 2.25em;
    transition: all .25s ease;
}
.navigation_toggle_wrapper .navigation_toggle::before, 
.navigation_toggle_wrapper .navigation_toggle::after {
    width: 1.75em;
    height: .25rem;
    border-radius: 0;
}
.navigation_toggle_wrapper .navigation_toggle::before {top: .5em; box-shadow: 0 .5rem 0 0 currentColor;}
.navigation_toggle_wrapper .navigation_toggle::after {bottom: .5em;}

.navigation_toggle_wrapper .navigation_toggle:hover {
    background-color: var(--typo-topbar-mode-hover-bg);
    color: var(--typo-topbar-mode-hover-color);
}


/***************************************************************************
* Navigation_wrapper
****************************************************************************/
.wrapper:has(.topbar.nav_opened) > *:not(.topbar){
    filter: blur(5rem);
    pointer-events: none;
    transition: all .25s ease;
}
.topbar .navigation_wrapper {
    top: 0; left: 0;
    background-color: transparent;
    opacity: 0; pointer-events: none;
    visibility: hidden;
    transition: all 0s ease;
}
.topbar.nav_opened .navigation_wrapper {
    opacity: 1; pointer-events: all;
    visibility: visible;
    transition: all .5s ease;
}

@media screen and (min-width:64em){
    .topbar > .row > .navigation_wrapper {
        opacity: 1; pointer-events: all;
        visibility: visible;
        transition: all .5s ease;
        position: absolute; top: 2em;
        left: 14em;
    }
}



/***************************************************************************
* menu
****************************************************************************/
.navigation_wrapper .menu {
    align-items: start;
}
.navigation_wrapper .menu li {
    position: relative;
    background-color: var(--typo-topbar-mode-bg);
    box-shadow: 0 0 0.0625em rgba(0,0,0,0.5);
    border-radius: var(--typo-border-radius);
    overflow: hidden;
    width: auto;
    margin: 0 0.25em 0.25em 0;
    transition: all .5s ease;
}
/*
.navigation_wrapper .menu li:after {
    position: absolute; content: '';
    top: 50%; left: 50%; width: 0; height: 0;
    transform: translate(-50%,-50%);
    background-color: var(--typo-topbar-mode-hover-bg);
    transition: all .25s ease;
    pointer-events: none;
}
.navigation_wrapper .menu li:has(a:hover):after,
.navigation_wrapper .menu li:has(a:focus):after {
    height: 100%;
    width: 100%;
}
*/
.navigation_wrapper .menu li:after {
    content: ''; position: absolute;
    top: 50%; left: 0; 
    width: 0; height: 105%;
    transform: translate(0,-50%);
    background-color: var(--typo-topbar-mode-hover-bg);
    transition: all .25s ease;
    pointer-events: none;
}
.navigation_wrapper .menu li:has(a:hover):after,
.navigation_wrapper .menu li:has(a:focus):after {
    width: 105%;
}

.navigation_wrapper .menu li a {
    padding: 0.5em;
    line-height: 1;
    display: block;
    position: relative;
    z-index: 10;
    transition: all .25s ease;
    font-size: 1.5rem;
    color: var(--typo-topbar-mode-color);
}
.navigation_wrapper .menu li a:hover,
.navigation_wrapper .menu li a:focus {
    color: var(--typo-topbar-mode-hover-color);
}

@media screen and (max-width:63.9375em){
    .navigation_wrapper .menu li {
        transform: translate(0,10rem);
        opacity: 0;
        transition: all .5s ease;
    }
    .topbar.nav_opened .navigation_wrapper .menu li {
        transform: translate(0,0);
        opacity: 1;
    }
    .topbar.nav_opened .navigation_wrapper .menu li:nth-child(1) {transition-delay: .1s;}
    .topbar.nav_opened .navigation_wrapper .menu li:nth-child(2) {transition-delay: .2s;}
    .topbar.nav_opened .navigation_wrapper .menu li:nth-child(3) {transition-delay: .3s;}
    .topbar.nav_opened .navigation_wrapper .menu li:nth-child(4) {transition-delay: .4s;}
    .topbar.nav_opened .navigation_wrapper .menu li:nth-child(5) {transition-delay: .5s;}
    .topbar.nav_opened .navigation_wrapper .menu li:nth-child(6) {transition-delay: .6s;}
    .topbar.nav_opened .navigation_wrapper .menu li:nth-child(7) {transition-delay: .7s;}
    .topbar.nav_opened .navigation_wrapper .menu li:nth-child(8) {transition-delay: .8s;}
}

@media screen and (min-width:64em){
    .large_no_hamburger .navigation_wrapper .menu {
            display: inline-flex;
    }
    .navigation_wrapper .menu li a {
        font-size: 0.875em;
        height: calc(var(--typo-calc-size) * 1.75rem);
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        justify-content: center;
    }
}



/***************************************************************************
* Language Switch
****************************************************************************/
@media screen and (max-width:39.9375em){
    .language_switch_slidebar{
        display: none;
    }
}
/*@media screen and (max-width:63.9375em){*/
    .wrapper .typo_language_switch_wrapper .typo_language_switch_nav li a {
        background-color: var(--typo-topbar-mode-bg);
        box-shadow: 0 0 0.0625em rgba(0,0,0,0.5);
        border-radius: var(--typo-border-radius);
        padding: 0.5em; text-decoration: none;
        margin: 0 0.25rem 0.25rem 0;
    }
    .wrapper .typo_language_switch_wrapper .typo_language_switch_nav li.current a {
        background-color: var(--typo-color-yellow);
    }
    .typo_language_switch_wrapper .typo_language_switch_nav li.current a::after {
        content: none;
    }
/*}*/


@media screen and (max-width:63.9375em){
   	.topbar .typo_language_switch_wrapper {
        transform: translate(0,10rem);
        opacity: 0;
        transition: all .5s ease;
    }
    .topbar.nav_opened .typo_language_switch_wrapper {
        transform: translate(0,0);
        opacity: 1;
		transition-delay: .7s;
    }
}

@media screen and (min-width:64em){
    .topbar .typo_language_switch_wrapper {
        display: none;
    }
}
@media screen and (min-width:40em){
    .language_switch_slidebar .typo_language_switch_wrapper {
        pointer-events: all;
        padding: 0;
    }
    .language_switch_slidebar .typo_language_switch_wrapper > .current {
        display: inline-block;
        padding: 0.4125em 0.75em;
        background-color: var(--typo-color-black);
        color: var(--typo-color-white);
        border-radius: var(--typo-border-radius);
        text-transform: uppercase;
        font-size: 0.875em;
        line-height: 1;
    }
    .language_switch_slidebar .typo_language_switch_nav {
        position: absolute;
        right: 0;top: var(--typo-half-gap);
        width: 30em;
        transform: translate(100%,-100%);
        display: flex; 
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-end;
        transition: all .25s ease;
        padding: var(--typo-half-gap) var(--typo-half-gap) 1em 2em;
    }
    .language_switch_slidebar .current:hover + .typo_language_switch_nav,
    .language_switch_slidebar:hover .current + .typo_language_switch_nav,
    .language_switch_slidebar .current + .typo_language_switch_nav:hover {
        transform: translate(0,-100%);
    }
    .language_switch_slidebar .typo_language_switch_wrapper .typo_language_switch_nav li a {
        margin: 0 0 0.25rem 0.25rem;
        padding: 0.4125em 0.75em;
        background-color: #FFFFFF;
        font-size: 0.875em;
        line-height: 1;
        border-radius: var(--typo-border-radius);
        display: inline-block;
    }
}
/*
@media screen and (min-width:64em){
    .typo_language_switch_wrapper {
        display: inline-block;
        position: relative;
        padding-top: 0;
        vertical-align: top;
    }

    .typo_language_switch_wrapper > .current {
        display: block;
        padding: 0;
        height: calc(var(--typo-calc-size) * 1.75rem);
        width: calc(var(--typo-calc-size) * 1.75rem);
        background-color: var(--typo-topbar-mode-bg);
        box-shadow: 0 0 0.0625em rgba(0,0,0,0.5);
        border-radius: var(--typo-border-radius);
        color: transparent;
        position: relative;
        text-transform: uppercase;
        cursor: pointer;
        transition: all .25s ease;
    }
    .typo_language_switch_wrapper > .current:after {
        content: ''; position: absolute;
        top: 50%; left: 50%;
        width: 1.5em; height: 1.5em;
        transform: translate(-50%,-50%);
        background-color: var(--typo-topbar-mode-color);
        mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Pro 7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2026 Fonticons, Inc.--><path d="M395.9 491.2C373.2 537.2 345.2 560 320 560C294.8 560 266.8 537.2 244.1 491.2C223 448.3 209.2 389.9 208.1 328L432 328C430.9 389.9 417.1 448.3 395.9 491.2zM431.9 312L208 312C209.2 250.1 223 191.7 244.1 148.8C266.8 102.8 294.8 80 320 80C345.2 80 373.2 102.8 395.9 148.8C417 191.7 430.9 250 432 312zM447.9 328L559.8 328C556.1 440 475.7 532.6 369.4 554.9C414.1 515.4 446.2 425.5 447.9 328zM559.8 312L447.9 312C446.3 214.5 414.1 124.6 369.4 85.1C475.7 107.4 556.2 200 559.9 312zM192 312L80.1 312C83.8 200 164.2 107.4 270.5 85.1C225.8 124.6 193.7 214.5 192 312zM80.1 328L192 328C193.7 425.5 225.9 515.4 270.6 554.9C164.3 532.6 83.8 440 80.1 328zM320 576C461.4 576 576 461.4 576 320C576 178.6 461.4 64 320 64C178.6 64 64 178.6 64 320C64 461.4 178.6 576 320 576z"/></svg>');
        mask-repeat: no-repeat;
        mask-position: 50% 50%;
        mask-size: contain;
        transition: all .25s ease;
    }

    .typo_language_switch_wrapper .typo_language_switch_nav {
        position: absolute;
        top: 100%; left: 50%;
        transform: translate(-50%,0);
        background-color: #FFFFFF;
        box-shadow: 0 0 0.0625em rgba(0,0,0,0.3);
        border-radius: var(--typo-border-radius);
        padding: 0.125em 0.25em;
        opacity: 0; pointer-events: none;
        visibility: hidden;
        transition: all .25s ease;
    }
    .typo_language_switch_wrapper:hover .typo_language_switch_nav,
    .typo_language_switch_wrapper .typo_language_switch_nav:hover {
        opacity: 1; pointer-events: all;
        visibility: visible;
    }
    .typo_language_switch_wrapper .typo_language_switch_nav li {
        display: block;
    }
    .typo_language_switch_wrapper .typo_language_switch_nav a {
        padding: 0.75em 1em;
        margin: 0.125em 0;
        text-align: center;
        display: block;
        transition: all .25s ease;
    }

    .typo_language_switch_wrapper .typo_language_switch_nav li.current a,
    .typo_language_switch_wrapper .typo_language_switch_nav li a:hover {
        background-color: #000000;
        color: #FFFFFF
    }
    .typo_language_switch_wrapper .typo_language_switch_nav li.current a:after {
        content: none;
    }
}
*/


/***************************************************************************
* Minimal Topbar
****************************************************************************/
.minimal_topbar.topbar {
    position: absolute;
    top: 0; background-color: #FFFFFF;
    height: 7.5em;
}
.minimal_topbar.topbar > .row {
    height: 7.5em;
}

.wrapper:has(.minimal_topbar.topbar + .content > .bookingbar:first-child) {
    margin-top: 0;
    padding-top:0;
}

.topbar.minimal_topbar .logo_column {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
    padding: 0;
}

.topbar .logo_item {
    width: 12em;
    height: 5em;
    position: relative;
    font-size: 1em;
}
.topbar .logo_item .logo_wrapper {
    position: absolute; top: 50%;
    left: 50%; transform: translate(-50%,-50%);
}
.topbar .logo_item .slogan {
    position: absolute;
    bottom: 5%; left: 50%; 
    transform: translate(-50%,0);
    z-index: 2000;
    pointer-events: none;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.0625em;
    display: block;
    width: 11em;
    text-align: center;
    font-size: 0.75em;
}
.topbar.minimal_topbar .logo_item .logo_wrapper {
    background-color: transparent;
    border: none;
    box-shadow: none;
    width: 12em;
    height: 6em;
    padding: 0;
}

.topbar.minimal_topbar .logo_wrapper picture.data_ratio {
    width: 12em;
    height: 6em;
}

.topbar.minimal_topbar .logo_item .logo_wrapper:after {
    content: none;
}
.topbar.minimal_topbar .logo_item .logo_wrapper path {
    fill: inherit;
}

