/* ==================== LANGUAGE SELECTOR ==================== */
:root {
    --headermenu-hover-bg: rgba(0, 180, 220, .3);
    --header-color-hover: rgb(58 61 61);
    --bs-dark-rgb: rgba(0,0,0,.7);
}
.language {
    position: relative;
    /*display: inline-block;
    padding: 0;
    width: 100%;*/
}

    .language .currentlanguage {
        display: block;
        padding: .375em .5em;
        cursor: pointer;
        margin: 0 .5em;
        border-radius: .5em;
        transition: background-color 0.2s ease;
        color: var(--bs-dark-rgb);
    }

    .language.show .currentlanguage {
        background: var(--headermenu-hover-bg);
        color: var(--header-color-hover);
    }

    .language .selectlanguage {
        position: absolute;
        top: 100%;
        left: 0;
        z-index: 1000;
        display: none;
        min-width: 7.5em;
        padding: .5em 0;
        margin: 0 .5em;
        opacity: 0;
        visibility: hidden;
    }

        .language .selectlanguage ul {
            background: rgba(255,255,255,.2);
            backdrop-filter: blur(.25em);
            border-radius: .5em;
            box-shadow: 0 0.125em 0.625em rgba(0,0,0,.2);
            transition: opacity 0.3s ease, visibility 0.3s ease;
            padding: .5em;
        }

        .language .selectlanguage span {
            position: absolute;
            height: .5em;
        }

        .language .selectlanguage.top span {
            top: 0;
        }

        .language .selectlanguage.bottom span {
            bottom: 0;
        }

        .language .selectlanguage.top span:before {
            content: "";
            width: 0;
            border-left: .5em solid transparent;
            border-right: .5em solid transparent;
            border-bottom: .5em solid #adbdce;
            display: block;
            margin: auto;
        }

        .language .selectlanguage.bottom span:before {
            content: "";
            width: 0;
            border-left: .5em solid transparent;
            border-right: .5em solid transparent;
            border-top: .5em solid #adbdce;
            border-bottom: 0px;
            display: block;
        }

        .language .selectlanguage.right {
            left: auto;
            right: 0;
        }

        .language .selectlanguage.left span {
            left: 20%;
        }

        .language .selectlanguage.right span {
            right: 20%;
        }

        .language .selectlanguage.top {
            bottom: auto;
        }

        .language .selectlanguage.bottom {
            top: auto;
        }

        .language .selectlanguage.visible {
            opacity: 0;
            visibility: hidden;
        }

        .language .selectlanguage.show {
            opacity: 1;
            visibility: visible;
            display: block;
        }

        .language .selectlanguage ul li {
            display: block;
            padding: .5em .9375em;
            margin-bottom: .25em;
            white-space: nowrap;
            line-height: normal;
            list-style: none;
            cursor: pointer;
            transition: background-color 0.2s ease, color 0.2s ease;
            border-radius: .5em;
        }

            .language .selectlanguage ul li:hover {
                background: var(--headermenu-hover-bg);
                color: rgba(0, 0, 0, 0.7);
            }