.user-item {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex-direction: row;
}

.user-item img {
  width: $spacing;
  height: $spacing;
  border-radius: 50%;
  margin-right: $spacing-xs;
}

.user-item.sm {
  height: $icon;
}

.user-item.sm img {
  width: $icon;
  height: $icon;
}

a.user-item {
  color: $black;
}

a.user-item:hover,
.user-item.linked:hover {
  color: $link-hover-color;
  img {
    outline: 2px solid $link-hover-color;
  }
  .tester-level-medal {
    outline: none;
  }
}

.user-item .tester-level-medal {
  position: absolute;
  top: -$spacing-xxs;
  left: -$spacing-xxs;
  width: auto;
  height: auto;
}

.user-item.sm .tester-level-medal {
  position: relative;
  margin-right: $spacing-xxs;
  top: auto;
  left: auto;
}

.user-item.lg .tester-level-medal {
  top: -$spacing-xxs;
  left: -$spacing-xxs;
}

.user-item.xxl img {
  border-radius: 0;
}

.user-item.xxl .tester-level-medal {
  top: $spacing-xs;
  left: $spacing-xs;
}

.user-item.square .profile-thumb {
  border-radius: $border-radius;
}

.user-item.square .tester-level-medal {
  top: $spacing-xxs;
  left: $spacing-xxs;
}