header-user-bar{
    cursor: pointer;
    .user {

        position: relative;
        display: flex;
        justify-content: center;
        background-color: #fff;
      
        .avatar {
          width: 38px;
          height: 38px;
          flex-shrink: 0;
          color: var(--prime);
          border: 1px solid var(--prime);
          background: #fff;
          border-radius: 100%;
          display: flex;
          justify-content: center;
          align-items: center;
          cursor: pointer;
          overflow: hidden;
          .initials {
          }
          img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
          }
        }
      
        .name{
          margin: 8px 4px 0 12px;
          color: var(--black);
          font-family: PT Sans;
          font-size: 14px;
          font-style: normal;
          font-weight: 400;
          line-height: 20px; /* 142.857% */
      
        }
      
      
        .dropdown{
            right: 4px;
            top: 36px;
        }
      
          drop-down {
            display: flex;
            margin-top: 6px;
            .on{
                svg{
                    color:var(--dark)
                }
            }
          }
      
      
      }
      @media screen and (max-width: 760px) {
        .user {
          .name{
            display: none;
          }
        }
        
    }    
}
