.image-of-page{
    position: relative;

}
.opacity-div{
    position: absolute;
    top: 0;
    background-color: rgba(95, 87, 124,0.81);
    width: 100%;
    height: 100%;
}
.navbar-style{
    position: sticky;
    top: 0;
    width: 100%;
    background-color: var(--purple-color);
    z-index: 999;
}
.logout-btn ,.logout-btn:hover{
    font-size: 17px;
    color: var(--white-color);
    border-radius: 33px;
    background-color: var(--light-orange-color);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 120px;
    height: 38px;
    outline: none;
    border: none;
}
.navbar-collapse{
    flex-grow: unset;
}
.menu-nav-link,.menu-nav-link:hover{
    font-size: 18px;
    color: var(--white-color);
}
.menu-nav-link.active{
    color: var(--light-orange-color);
}
.menu-nav-link.active:after{
    position: relative;
    top: 28px;
    content: '';
    border-bottom: 2px solid var(--light-orange-color);
    width: 100%;
    display: block;
}
.logout-btn-link,.logout-btn-link:hover{
    font-size: 17px;
    color: var(--white-color);
    border-radius: 33px;
    background-color: var(--light-orange-color);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 120px;
    height: 38px;
}
.img-photo{
    border-radius: 50%;
}
.part-nav-div{
   width: 30%;
}
.profile-div{
    display: flex;
    justify-content: flex-end;
}
.image-rounded{
    display: inline-block;
    border-radius: 50%;
    border: 1px solid var(--purple-color);
}
.user-img{
    width: 23px;
}
.user-name{
    font-size: 18px;
    color: var(--white-color);
}
.user-name.active{
    color: var(--light-orange-color);
}
.between-border{
    display: inline-block;
    background-color: rgba(255,255,255,0.5);
    width: 1px;
    height: 25px;
    position: relative;
    top: 3px;
    right: 7px;
}

.lang-link,.lang-link:hover{
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 18px;
    color: var(--white-color);
}

@media (max-width: 900px){
    .navbar-style{
        position: relative;
        top: unset;
    }
    .part-nav-div{
        width: 100%;
    }
    .bars-btn,.bars-btn:focus{
        color: var(--light-orange-color);
    }
    .menu-nav-link.active:after{
        top: 10px;
    }
    .profile-div{
        justify-content: center;
    }
    .between-border{
        display: none;
    }

}