.fa-icon {
  line-height: 0 !important;
}

.icon {
  display: inline-block;
  outline: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;

  &.icon-nitro-light {
    background-image: url("@/assets/images/nitro/nitro-n-light.svg");
  }

  &.icon-nitro-dark {
    background-image: url("@/assets/images/nitro/nitro-n-dark.svg");
  }

  &.icon-nitro-light,
  &.icon-nitro-dark {
    width: 100%;
    height: 40px;
  }

  &.icon-catalog {
    background-image: url("@/assets/images/toolbar/icons/catalog.png");
    width: 37px;
    height: 36px;
  }

  &.icon-game {
    background-image: url("@/assets/images/toolbar/icons/game.png");
    width: 44px;
    height: 25px;
  }

  &.icon-rooms {
    background-image: url("@/assets/images/toolbar/icons/rooms.png");
    width: 44px;
    height: 30px;
  }

  &.icon-house {
    background-image: url("@/assets/images/toolbar/icons/house.png");
    height: 30px;
    width: 32px;
  }

  &.gray {
    opacity: 0.5;
  }

  &.icon-inventory {
    background-image: url("@/assets/images/toolbar/icons/inventory.png");
    height: 41px;
    width: 44px;
  }

  &.icon-modtools {
    background-image: url("@/assets/images/toolbar/icons/modtools.png");
    height: 34px;
    width: 29px;
  }

  &.icon-friendall {
    background-image: url("@/assets/images/toolbar/icons/friend_all.png");
    height: 33px;
    width: 32px;
  }

  &.icon-friendsearch {
    background-image: url("@/assets/images/toolbar/icons/friend_search.png");
    height: 33px;
    width: 29px;
  }

  &.icon-sendmessage {
    background-image: url("@/assets/images/toolbar/icons/sendmessage.png");
    width: 20px;
    height: 21px;
  }

  &.icon-me-talents {
    background-image: url("@/assets/images/toolbar/icons/me-menu/talents.png");
    width: 32px;
    height: 30px;
  }

  &.icon-me-helper-tool {
    background-image: url("@/assets/images/toolbar/icons/me-menu/helper-tool.png");
    width: 32px;
    height: 30px;
  }

  &.icon-me-profile {
    background-image: url("@/assets/images/toolbar/icons/me-menu/profile.png");
    width: 32px;
    height: 30px;
  }

  &.icon-me-forums {
    background-image: url("@/assets/images/toolbar/icons/me-menu/forums.png");
    width: 32px;
    height: 30px;
  }

  &.icon-me-rooms {
    background-image: url("@/assets/images/toolbar/icons/me-menu/my-rooms.png");
    width: 30px;
    height: 30px;
  }

  &.icon-me-achievements {
    background-image: url("@/assets/images/toolbar/icons/me-menu/achievements.png");
    width: 31px;
    height: 30px;
  }

  &.icon-me-clothing {
    background-image: url("@/assets/images/toolbar/icons/me-menu/clothing.png");
    width: 27px;
    height: 30px;
  }

  &.icon-me-settings {
    background-image: url("@/assets/images/toolbar/icons/me-menu/cog.png");
    width: 28px;
    height: 34px;
  }

  &.icon-cog {
    background: url("@/assets/images/icons/icon_cog.png");
    width: 14px;
    height: 15px;
  }

  &.icon-help {
    background: url("@/assets/images/icons/help.png");
    width: 13px;
    height: 23px;
  }

  &.icon-joinroom {
    background-image: url("@/assets/images/toolbar/icons/joinroom.png");
    width: 21px;
    height: 21px;
  }

  &.icon-habbo {
    background-image: url("@/assets/images/toolbar/icons/habbo.png");
    width: 28px;
    height: 28px;
  }

  &.icon-camera {
    background-image: url("@/assets/images/toolbar/icons/camera.png");
    width: 38px;
    height: 45px;
  }

  &.icon-message {
    background-image: url("@/assets/images/toolbar/icons/message.png");
    width: 36px;
    height: 32px;

    &.is-unseen {
      background-image: url("@/assets/images/toolbar/icons/message_unsee.gif");
    }
  }

  &.icon-wired-trigger {
    background-image: url("@/assets/images/wired/icon_trigger.png");
    width: 13px;
    height: 14px;
  }

  &.icon-wired-condition {
    background-image: url("@/assets/images/wired/icon_condition.png");
    width: 13px;
    height: 14px;
  }

  &.icon-wired-action {
    background-image: url("@/assets/images/wired/icon_action.png");
    width: 13px;
    height: 14px;
  }

  &.chatstyles-icon {
    background-image: url("@/assets/images/chat/styles-icon.png");
    width: 17px;
    height: 19px;
  }

  &.pencil-icon {
    background-image: url("@/assets/images/infostand/pencil-icon.png");
    width: 17px;
    height: 18px;
  }

  &.disk-icon {
    background-image: url("@/assets/images/infostand/disk-icon.png");
    width: 14px;
    height: 14px;
  }

  &.disk-creator {
    background-image: url("@/assets/images/infostand/disk-creator.png");
    width: 14px;
    height: 14px;
  }

  &.trade-locked-icon {
    background-image: url("@/assets/images/inventory/trading/locked-icon.png");
    width: 29px;
    height: 43px;
  }

  &.trade-unlocked-icon {
    background-image: url("@/assets/images/inventory/trading/unlocked-icon.png");
    width: 29px;
    height: 43px;
  }

  &.modtool-room-icon {
    background-image: url("@/assets/images/modtool/room.png");
    width: 20px;
    height: 15px;
  }

  &.modtool-chatlog-icon {
    background-image: url("@/assets/images/modtool/chatlog.gif");
    width: 20px;
    height: 15px;
  }

  &.modtool-user-icon {
    background-image: url("@/assets/images/modtool/user.gif");
    width: 20px;
    height: 15px;
  }

  &.modtool-reports-icon {
    background-image: url("@/assets/images/modtool/reports.png");
    width: 20px;
    height: 15px;
  }

  &.modtool-wrench-icon {
    background-image: url("@/assets/images/modtool/wrench.gif");
    width: 20px;
    height: 15px;
  }

  &.modtool-key-icon {
    background-image: url("@/assets/images/modtool/key.gif");
    width: 20px;
    height: 15px;
  }

  &.icon-catalogue-hc_small {
    background-image: url("@/assets/images/catalog/hc_small.png");
    height: 17px;
    width: 31px;
  }

  &.icon-catalogue-hc_big {
    background: url("@/assets/images/catalog/hc_big.png");
    width: 68px;
    height: 40px;
  }

  &.icon-sign-exclamation {
    background: url("@/assets/images/icons/sign-exclamation.png");
    width: 7px;
    height: 17px;
  }

  &.icon-sign-heart {
    background: url("@/assets/images/icons/sign-heart.png");
    width: 15px;
    height: 13px;
  }

  &.icon-sign-red {
    background: url("@/assets/images/icons/sign-red.png");
    width: 11px;
    height: 19px;
  }

  &.icon-sign-yellow {
    background: url("@/assets/images/icons/sign-yellow.png");
    width: 11px;
    height: 19px;
  }

  &.icon-sign-skull {
    background: url("@/assets/images/icons/sign-skull.png");
    width: 12px;
    height: 12px;
  }

  &.icon-sign-smile {
    background: url("@/assets/images/icons/sign-smile.png");
    width: 7px;
    height: 14px;
  }

  &.icon-sign-soccer {
    background: url("@/assets/images/icons/sign-soccer.png");
    width: 20px;
    height: 20px;
  }

  &.icon-house-small {
    background: url("@/assets/images/icons/house-small.png");
    width: 19px;
    height: 14px;
  }

  &.icon-camera-small {
    background: url("@/assets/images/icons/camera-small.png");
    width: 17px;
    height: 15px;
  }

  &.icon-small-room {
    background: url("@/assets/images/icons/small-room.png");
    width: 17px;
    height: 16px;
  }

  &.icon-cog {
    background: url("@/assets/images/icons/cog.png");
    width: 21px;
    height: 21px;
  }

  &.icon-chat-history {
    background: url("@/assets/images/icons/chat-history.png");
    width: 17px;
    height: 21px;
  }

  &.icon-room-link {
    background: url("@/assets/images/icons/room-link.png");
    width: 17px;
    height: 15px;
  }

  &.icon-zoom-more {
    background: url("@/assets/images/icons/zoom-more.png");
    width: 12px;
    height: 22px;
  }

  &.icon-zoom-less {
    background: url("@/assets/images/icons/zoom-less.png");
    width: 12px;
    height: 22px;
  }

  &.icon-like-room {
    background: url("@/assets/images/icons/like-room.png");
    width: 20px;
    height: 22px;
  }

  &.icon-arrows {
    background: url("@/assets/images/icons/arrows.png");
    width: 17px;
    height: 15px;
  }

  &.icon-camera-colormatrix {
    background: url("@/assets/images/icons/camera-colormatrix.png");
    width: 32px;
    height: 21px;
  }

  &.icon-camera-composite {
    background: url("@/assets/images/icons/camera-composite.png");
    width: 32px;
    height: 21px;
  }

  &.icon-pf-online {
    background: url("@/assets/images/profile/icons/online.gif");
    width: 40px;
    height: 16px;
  }

  &.icon-pf-offline {
    background: url("@/assets/images/profile/icons/offline.png");
    width: 39px;
    height: 16px;
  }

  &.icon-pf-tick {
    background: url("@/assets/images/profile/icons/tick.png");
    width: 11px;
    height: 10px;
  }

  &.icon-group-type-0 {
    background: url("@/assets/images/groups/icons/grouptype_icon_0.png");
    width: 16px;
    height: 16px;
  }

  &.icon-group-type-1 {
    background: url("@/assets/images/groups/icons/grouptype_icon_1.png");
    width: 16px;
    height: 16px;
  }

  &.icon-group-type-2 {
    background: url("@/assets/images/groups/icons/grouptype_icon_2.png");
    width: 16px;
    height: 16px;
  }

  &.icon-group-decorate {
    background: url("@/assets/images/groups/icons/group_decorate_icon.png");
    width: 15px;
    height: 15px;
  }

  &.icon-group-member {
    background: url("@/assets/images/groups/icons/group_icon_big_member.png");
    width: 20px;
    height: 20px;
  }

  &.icon-group-admin {
    background: url("@/assets/images/groups/icons/group_icon_big_admin.png");
    width: 20px;
    height: 20px;
  }

  &.icon-group-owner {
    background: url("@/assets/images/groups/icons/group_icon_big_owner.png");
    width: 20px;
    height: 20px;
  }

  &.icon-group-favorite {
    background: url("@/assets/images/groups/icons/group_favorite.png");
    width: 14px;
    height: 14px;
  }

  &.icon-group-not-favorite {
    background: url("@/assets/images/groups/icons/group_notfavorite.png");
    width: 14px;
    height: 14px;
  }

  &.icon-group-small-admin {
    background: url("@/assets/images/groups/icons/group_icon_admin.png");
    width: 11px;
    height: 13px;
  }

  &.icon-group-small-not-admin {
    background: url("@/assets/images/groups/icons/group_icon_not_admin.png");
    width: 11px;
    height: 13px;
  }

  &.icon-group-small-owner {
    background: url("@/assets/images/groups/icons/group_icon_small_owner.png");
    width: 13px;
    height: 13px;
  }

  &.icon-navigator-info {
    background: url("@/assets/images/navigator/icons/info.png");
    width: 18px;
    height: 18px;
  }

  &.icon-navigator-room-locked {
    background: url("@/assets/images/navigator/icons/room_locked.png");
    width: 13px;
    height: 16px;
  }

  &.icon-navigator-room-password {
    background: url("@/assets/images/navigator/icons/room_password.png");
    width: 13px;
    height: 16px;
  }

  &.icon-navigator-room-invisible {
    background: url("@/assets/images/navigator/icons/room_invisible.png");
    width: 13px;
    height: 16px;
  }

  &.icon-navigator-room-group {
    background: url("@/assets/images/navigator/icons/room_group.png");
    width: 13px;
    height: 11px;
  }

  &.icon-youtube-next {
    background: url("@/assets/images/room-widgets/youtube-widget/next.png");
    width: 21px;
    height: 16px;
  }

  &.icon-youtube-prev {
    background: url("@/assets/images/room-widgets/youtube-widget/prev.png");
    width: 21px;
    height: 16px;
  }

  &.icon-hc-banner {
    background: url("@/assets/images/catalog/hc_big.png");
    width: 68px;
    height: 40px;
  }

  &.icon-set-tile {
    background-image: url("@/assets/images/floorplaneditor/icon-tile-set.png");
    width: 40px;
    height: 40px;
  }

  &.icon-unset-tile {
    background-image: url("@/assets/images/floorplaneditor/icon-tile-unset.png");
    width: 40px;
    height: 40px;
  }

  &.icon-increase-height {
    background-image: url("@/assets/images/floorplaneditor/icon-tile-up.png");
    width: 40px;
    height: 40px;
  }

  &.icon-decrease-height {
    background-image: url("@/assets/images/floorplaneditor/icon-tile-down.png");
    width: 40px;
    height: 40px;
  }

  &.icon-set-door {
    background-image: url("@/assets/images/floorplaneditor/icon-door.png");
    width: 40px;
    height: 40px;
  }

  &.icon-door-direction-0 {
    background-image: url("@/assets/images/floorplaneditor/door-direction-0.png");
    width: 80px;
    height: 45px;
  }

  &.icon-door-direction-1 {
    background-image: url("@/assets/images/floorplaneditor/door-direction-1.png");
    width: 80px;
    height: 45px;
  }

  &.icon-door-direction-2 {
    background-image: url("@/assets/images/floorplaneditor/door-direction-2.png");
    width: 80px;
    height: 45px;
  }

  &.icon-door-direction-3 {
    background-image: url("@/assets/images/floorplaneditor/door-direction-3.png");
    width: 80px;
    height: 45px;
  }

  &.icon-door-direction-4 {
    background-image: url("@/assets/images/floorplaneditor/door-direction-4.png");
    width: 80px;
    height: 45px;
  }

  &.icon-door-direction-5 {
    background-image: url("@/assets/images/floorplaneditor/door-direction-5.png");
    width: 80px;
    height: 45px;
  }

  &.icon-door-direction-6 {
    background-image: url("@/assets/images/floorplaneditor/door-direction-6.png");
    width: 80px;
    height: 45px;
  }

  &.icon-door-direction-7 {
    background-image: url("@/assets/images/floorplaneditor/door-direction-7.png");
    width: 80px;
    height: 45px;
  }

  &.icon-tickets {
    background-image: url("@/assets/images/icons/tickets.png");
    width: 17px;
    height: 17px;
  }

  &.icon-user {
    background-image: url("@/assets/images/icons/user.png");
    width: 18px;
    height: 19px;
  }

  &.icon-room-history-back-enabled {
    background-image: url("@/assets/images/icons/room-history-back-enabled.png");
    width: 34px;
    height: 36px;
  }

  &.icon-room-history-back-disabled {
    background-image: url("@/assets/images/icons/room-history-back-disabled.png");
    width: 34px;
    height: 36px;
  }

  &.icon-room-history-enabled {
    background-image: url("@/assets/images/icons/room-history-enabled.png");
    width: 33px;
    height: 35px;
  }

  &.icon-room-history-disabled {
    background-image: url("@/assets/images/icons/room-history-disabled.png");
    width: 33px;
    height: 35px;
  }

  &.icon-room-history-next-enabled {
    background-image: url("@/assets/images/icons/room-history-next-enabled.png");
    width: 34px;
    height: 38px;
  }

  &.icon-room-history-next-disabled {
    background-image: url("@/assets/images/icons/room-history-next-disabled.png");
    width: 34px;
    height: 38px;
  }

  &.icon-hc_mini {
    background-image: url("@/assets/images/catalog/hc_mini.png");
    width: 18px;
    height: 18px;
  }

  &.spin {
    animation: rotating 1s linear infinite;
  }

  @keyframes rotating {
    from {
      transform: rotate(0);
    }

    to {
      transform: rotate(360deg);
    }
  }
}
