/* Slideout */
.slideout-menu { position: fixed; top: 0; bottom: 0; overflow-y: scroll; width: 320px; z-index: 0; display: none; transform: translate(0%) !important; -webkit-transform: translate(0%) !important; -moz-transform: translate(0%) !important; -ms-transform: translate(0%) !important; }
.slideout-menu-left { left: 0; }
.slideout-menu-right { right: 0; }
.slideout-panel { position: relative; z-index: 1; background-color: #FFF; min-height: 100vh; }
.slideout-open, .slideout-open body { overflow: hidden; }
.slideout-open .slideout-panel { overflow-y: hidden; }
.slideout-open .slideout-menu {display: block;background-color: #170F09; display: flex; flex-direction: column;}
/* iOS */
html.iOS.slideout-open, html.iOS.slideout-open body, html.iOS.slideout-open .slideout-panel { position: relative; height: 100%; }
/* Social */
.slideout-menu .social-header-wrapper { padding: 0px 30px 0px 30px; display: flex; align-items: center; margin-top: 40px; margin-bottom: 40px; }
.slideout-menu .social-header-wrapper > span {display: block;color: #fff;font-size: 0.6em;margin-right: 10px;font-weight: 200;}
.slideout-menu .social-header-wrapper > div { display: flex; }
.slideout-menu .social-header-wrapper > div > a > i {color: #fff;font-size: 1em;vertical-align: bottom;transition: 0.3s linear;-webkit-transition: 0.3s linear;-moz-transition: 0.3s linear;-ms-transition: 0.3s linear;background-color: transparent;padding: 3px;width: 20px;height: 20px;text-align: center;line-height: 20px;margin: 0 3px;}
html:not(.touch) .slideout-menu .social-header-wrapper > div > a:hover > i {color: #b7b7b7;}
/* Menu */
#slider-menu.open + main::after { content: ''; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 100000; background-color: rgba(0,0,0,0.6); }
.slideout-menu .menu-side ul li a {padding: 20px 30px;display: block;border-bottom: 1px solid rgb(255 255 255 / 12%);color: #fff;font-size: 13px;font-weight: 300;text-transform: uppercase;transition: 0.3s linear;-webkit-transition: 0.3s linear;-moz-transition: 0.3s linear;-ms-transition: 0.3s linear;}
html:not(.touch) .slideout-menu .menu-side ul li a:hover {transition: 0.3s linear;-webkit-transition: 0.3s linear;-moz-transition: 0.3s linear;-ms-transition: 0.3s linear;color: #c5c5c5;}
.slideout-menu .menu-side ul li.dropdown > a:after { content: "\f078"; font-weight: 900; font-family: "Font Awesome 5 Free"; padding-left: 5px; }
.slideout-menu .menu-side ul li.open > a:after { content: "\f077"; }
.slideout-menu .menu-side ul li ul { max-height: 0; overflow: hidden; transition: max-height 0.3s linear; -webkit-transition: max-height 0.3s linear; -moz-transition: max-height 0.3s linear; -ms-transition: max-height 0.3s linear; }
.slideout-menu .menu-side ul li.dropdown.open > ul { max-height: 700px; transition: max-height 0.3s linear; -webkit-transition: max-height 0.3s linear; -moz-transition: max-height 0.3s linear; -ms-transition: max-height 0.3s linear; }
.slideout-menu .menu-side ul li ul li.li-all-families > a:after { content: '\f101'; font-family: "Font Awesome 5 Free"; font-weight: 700; padding-left: 5px; }
.slideout-menu .menu-side ul li ul li a {font-size: 0.6em;padding-left: 50px;line-height: 1.5em;}
.slideout-menu .menu-side ul li ul li li a { padding-left: 70px; }
.slideout-menu .menu-side ul li.small {border-top: 0px solid #E6EAEA;}
.slideout-menu .menu-side ul li.small a, .slideout-menu .menu-side ul li.small ~ li a {font-size: 0.65em;}
.slideout-menu .menu-side.menu-mobile { display: none }
.slideout-menu .nav-header {display: flex;padding: 20px 30px;justify-content: space-between;align-items: center;border-bottom: 1px solid rgb(255 255 255 / 12%); gap:30px;}
.slideout-menu .nav-header img {width: 90px; height: auto;}
.slideout-menu .nav-header svg {width: 100%;fill: #fff; max-width: 150px;}
.slideout-menu .nav-header svg path#let-k {fill: #5da9b8;}
.slideout-menu .nav-header svg .st0 {fill:#fff !important;}

.slideout-menu .nav-header span {font-size: 0.7em;line-height: 1;display: flex;align-items: center;text-transform: uppercase;cursor: pointer;color: #fff;}
.slideout-menu .nav-header span i {padding-right: 8px;font-size: 1.3em;color: #fff;line-height: 1;}

/* language selector */
.language-selector-wrapper { display: flex; flex-direction: column; justify-content: start; height: 35px; flex: 0 0 40px; overflow: visible; transition: .2s linear; background-color: var(--text-color); }
.language-selector-wrapper > * { padding: 10px; padding-right: 25px; z-index: 2; user-select: none; text-transform: uppercase; color: #FFF; font-weight: 500; }
.language-selector-wrapper > span { order: 1 !important; cursor: pointer; position: relative; line-height: 1; }
.language-selector-wrapper > span:after { content: ''; position: absolute; top: calc(50% - 5px ); right: 10px; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid #FFF; transform-origin: 50% 35%; transition: transform .3s linear; }
.language-selector-wrapper > span.open:after { transform: rotate(180deg); }
.language-selector-wrapper > a { order: 2; max-height: 0; margin: 0 0; opacity: 0; pointer-events: none; padding-block: 0; background-color: var(--text-color); color: #FFF; font-size: .9em; font-weight: 300; transition: 0.2s linear; }
.language-selector-wrapper:has(span.open) > a { max-height: 800px; opacity: 1; pointer-events: all; padding-top: 10px; color: #FFF; font-weight: 500; }
.language-selector-wrapper:has(span.open) > a:last-of-type { padding-bottom: 10px; }
.language-selector-wrapper:has(span.open) > a:hover { color: var(--quinary-color); }
/*html:not(.touch).language-selector-wrapper > a:hover { color: #fff; text-decoration: none; }*/
/*body.scrolled.language-selector-wrapper > a { background-color: #EE8005; }*/

/*** MOBILE & TOUCH ***/
html.touch #slider-menu.open + main::after { display: none; }

/*** IE ***/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    #slider-menu.open + main header { right: 320px; left: auto; }
    #slider-menu.open + main::after { right: 320px; }
}

@media (pointer:fine) {
    /*.language-selector-wrapper > a:hover {background:#ed810780;}*/
}

@media (max-width:1200px) {
    /* Header */
    .slideout-menu .menu-side ul li a {font-size: 11px;}

    /* language selector */
    .language-selector-wrapper {padding:20px 25px; max-width: max-content; flex-direction: row; align-items: center; background-color: unset; }
    header .language-selector-wrapper {display: none; transition: 0; opacity: 0; visibility: hidden; transform: translateY(-100%);}
    .language-selector-wrapper > * {padding-inline: 0; min-width: 50px; color: #fff; }
    .language-selector-wrapper > span:after { border-top: 6px solid #fff; }
    .language-selector-wrapper > span.open:after { transform: rotate(-90deg); }
    .language-selector-wrapper > a { margin-inline: 0; padding-inline: 10px; min-width: 15px; padding-block: 10px; max-height: 800px; max-width: 0; background-color: unset; }
    .language-selector-wrapper:has(span.open) > a { max-width: 800px; color: #fff; }
}