.ids__navbar {    
    display: block;
    position: fixed;
    top: 4em;
    left: 0.5em;
    z-index: 1;
    border-radius: 0.5em;
    background-color:rgba(var(--ids__background-card-RGB), 1);
    padding: 0.5em 0.5em 0 0.5em;


    @media (width < 767px) { 
        position: static;
        margin: 1em 0;

    }
}

.ids__navbar ul li {
    font-size: 0.8em;
    border: solid 1px transparent;
    
    padding: 0;
    margin-bottom: 0;
    
    &::before {
        content: '';
    }

    @media (width < 767px) { 
        font-size: 1em;
    }
    
    a {
        padding: 0.2em 0.5em 0.2em 0.3em;
        border-radius: 0.2em;
        display: block;
        text-decoration: none;
        color: rgba(var(--ids__text-RGB), 1);

        @media (width < 767px) { 
            padding: 0.2em 0;
        }
        &:hover {
            color: rgba(var(--ids__mark-RGB), 1);
        }
    }
}

.ids__navbar .current {

    a {
        background-color: rgba(var(--ids__mark-RGB), 0.2);

        @media (width < 767px) { 
            background-color: transparent;
        }

        &:hover {
            background-color:rgba(var(--ids__mark-RGB), 0.3);
            @media (width < 767px) { 
            background-color: transparent;
        }
        }
    }

    
    
}
.ids__nav-item {
}