.avatar, .gravatar
  border-radius: $user_avatar_border_radius
  width: $user_avatar_width

.avatar-mini
  border-radius: $user_avatar_mini_border_radius
  width: $user_avatar_mini_width

h1, h2, h3, h4, tr
  .avatar, .avatar-mini
    vertical-align: middle
    margin-right: 7px


.user-avatar--container
  +display(flex)
  +align-items(flex-start)
  width: 100%

.user-avatar--avatar
  @extend .avatar-mini
  margin-right: 0.5em

.user-avatar--user-with-role
  +flex(1)

.user-avatar--user
  display:        block
  word-wrap:      break-word
  overflow-wrap:  break-word

.user-avatar--role
  display:      block
  font-size:    11px
  font-style:   italic
  color:        #777777