.member {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  padding: 12px 0;
  border-bottom: #E0E0E0 solid 1px;
  overflow: hidden;
  .left {
    flex-shrink: 0;
    .avatar {
      width: 40px;
      height: 40px;
      border-radius: 100px;
      border: #86898E solid 1px;
      background-color: #ffffff;
      overflow: hidden;
      .initials {
        line-height: 40px;
        text-align: center;
        color: #86898E;
      }
      img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }
  }
  .mid {
    padding: 0 16px;
    flex-grow: 1;
    .name {
    }
    .sub {
      color: #86898E;
    }
  }
  .right {
    flex-shrink: 0;
    button {
      margin-left: 20px;
      &.edit {background-image: url('~projects/app-root/src/assets/images/icons/edit_24dp.svg');}
      &.delete {background-image: url('~projects/app-root/src/assets/images/icons/close_24dp.svg');}
    }
  }
}


@media screen and (max-width: 1360px) {
  .member {
    .left {
      .avatar {
        display: none;
      }
    }
  }
}