.navbar {
    z-index: 1;
    border-bottom: 1px solid #59595A;
    background-color: rgba(0, 0, 0, .8) !important;
    height: 72px;

    .logo {
        flex: 1;
    }

    .navbar-nav {
        list-style: none !important;
    }

    .navbar-brand:hover {
        img {
            animation: rotate .5s linear 1;
        }
    }

    .nav-item {
        font-family: var(--roboto-medium);
        font-size: 16px;
        line-height: 20px;
        text-align: center;
        white-space: nowrap;

        &:hover,
        &.active {
            background: var(--color-red);
        }

        .nav-link {
            color: #fff !important;
            text-transform: uppercase;
            padding: 26px 20px !important;
        }
    }
}

.mob-nav {
    .nav-item {
        padding: 8px 12px;
        list-style: none !important;

        &.active {
            background: var(--color-red);
        }
    }

    .nav-link {
        font-family: var(--roboto-regular);

        &.active {
            font-weight: 700;
        }
    }

}

.language-dropdown {
    position: absolute;
    width: 90%;
    bottom: 5%;
}

@media (max-width:1250px) {
    .navbar:lang(ru) {
        .nav-item {
            font-size: 12px;
        }
    }
}

@media (max-width:1200px) {
    .navbar {
        .nav-item {
            .nav-link {
                padding: 26px 16px !important;
            }
        }
    }
}

@media (max-width:992px) {
    .navbar {
        .nav-item {
            font-size: 12px;
        }
    }

    .navbar:lang(ru) {
        .nav-item {
            font-size: 8px;
        }
    }
}

@media (max-width:840px) {
    .navbar:lang(uk) {
        & .nav-item {
            .nav-link {
                padding-inline: 6px !important;
            }
        }
    }
}

@media (max-width: 768px) {
    .navbar-collapse {
        display: none;
    }
}

@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}