#LanguageFAB[v2] {
    left: unset !important;
    top: unset !important;
    position: fixed !important;
    right: 10px !important;
    bottom: 24px !important;
}

#LangPopup {
    animation: 0.2s ease-in-out LangPopupIN_v2 !important;
}

@keyframes LangPopupIN_v2 {
    0% {
        transform: scaleY(0) translateY(+100%);
        opacity: 0%;
    }
    100% {
        transform: scaleY(1) translateY(0);
        opacity: 100%;
    }
}

#InfoPaneContainer {
    position: fixed;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    width: 100vw;
    height: calc(100vh - var(--header-height));
    top: var(--header-height);

    transition: transform 0.25s ease-in-out;
}

#InfoPane {
    position: fixed;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    background-color: var(--theme-light);
    border-radius: 30px;
    height: 90%;
    width: 90vw;

    gap: 20px;

    box-shadow: 5px 6px 10px 0 var(--shadow-color);
    animation: InfoPaneIN 0.5s ease-in-out;

    text-align: center;
}

.PersonButton {
    display: flex;

    align-items: center;
    justify-content: center;

    background-color: var(--theme-full);
    color: #ffffff;

    font-weight: bold;

    width: 90%;
    height: 70px;
    border-radius: 15px;

    gap: 10px;

    text-decoration: none;

    transition: all 0.1s ease-in-out;
}

.PersonButton:hover {
    background-color: var(--brand-5);
    height: calc(70px * 1.5);
}

div#InfoPane h1 {
    font-size: 5vmax;
}

@keyframes InfoPaneIN {
    0% {
        transform: translateY(100%);
    }
    100% {
        transform: translateY(0);
    }
}

@media only screen and (max-width: 800px) {
    #InfoPane {
        padding-top: 10px;
        padding-bottom: 10px;
        gap: 10px;
        height: fit-content;
    }

    .PersonButton {
        height: 45px;
    }
    
    .PersonButton:hover {
        background-color: var(--brand-5);
        height: calc(45px * 1.5);
    }
}