.language-banner-component {
    animation: language-banner-show-banner 1s ease-in both;
    background-color: #dbd9d7;
    display: flex;
    overflow: hidden;
    position: relative;
    will-change: opacity;
    /*z-index: 1035;*/
    top: 48px;
}

.language-banner-component.language-banner-leave-active {
    animation: language-banner-hide-banner .8s ease-in both
}

.language-banner-container {
    display: flex;
    flex-wrap: wrap;
    font-weight: 600;
    justify-content: center;
    margin: 0 auto;
    max-width: 104.5rem;
    padding: 1rem 3rem 1rem 1.5rem;
    position: relative;
    width: 100%
}

.language-banner-main-sentence {
    align-items: center;
    display: flex;
    flex-direction: column
}

.language-banner-main-sentence a {
    color: var(--color-blue-400);
    text-decoration: none;
}

.language-banner-main-sentence a:hover {
    opacity: .8
}

.language-banner-main-sentence span+span {
    margin-left: .3rem
}


.language-banner-main-sentence .language-banner-container-flag {
    display: inline-block;
    margin-bottom: 3px;
    margin-left: 3px;
}

.language-banner-close {
    background: none;
    border: 0;
    opacity: .5;
    padding: 0;
    position: absolute;
    right: .3rem;
    top: 50%;
    transform: translateY(-50%)
}

.language-banner-close:hover {
    opacity: .65
}

.language-banner-close-icon {
    color: #262421;
    font-size: 2.4rem
}

.language-banner-select {
    background: none;
    border: 0;
    color: var(--color-blue-400);
    font-size: 1.4rem;
    font-weight: 600;
    margin-top: 1rem;
    min-width: 15rem;
    padding: 0 1.5rem
}

.language-banner-select:hover {
    opacity: .8
}

@media (min-width:48em) {
    .language-banner-container {
        flex-wrap: nowrap
    }

    .language-banner-main-sentence {
        flex-direction: row
    }

    .language-banner-flag {
        margin-right: 1.5rem
    }

    .language-banner-select {
        margin: 0 0 0 auto
    }
}

@keyframes language-banner-show-banner {
    0% {
        max-height: 0;
        opacity: 0
    }

    to {
        max-height: 20rem;
        opacity: 1
    }
}

@keyframes language-banner-hide-banner {
    0% {
        max-height: 20rem;
        opacity: 1
    }

    to {
        max-height: 0;
        opacity: 0
    }
}