.q-avatar
  position: relative
  vertical-align: middle
  display: inline-block

  border-radius: 50%

  font-size: $avatar-font-size
  height: 1em
  width: 1em

  &__content
    font-size: $avatar-content-font-size
    line-height: $avatar-content-line-height

  &__content, img:not(.q-icon):not(.q-img__image)
    border-radius: inherit
    height: inherit
    width: inherit

  &--square
    border-radius: 0