body {
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  overflow: hidden;
}
.ui {
  color: white;
  font-family: 'Tahoma';
  font-size: small;
  cursor: default;
  z-index: 0;
  /* Some helper classes */
  /* Generic UI panel */
  /* Dialog */
  /* Button element */
  /* Tabs Element */
  /* Item/Skill Slot Element */
  /* Textbox Widget */
  /* List Element */
  /* Progressbar Element */
  /* Some default colours for progress bar */
  /* Checkbox Element */
  /* dlgStatus */
  /* Login Dialog */
  /* dlgServerSelect */
  /* dlgCharacterSelect */
  /* dlgCharacterCreate */
  /* dlgMenu */
  /* dlgCharacterStatus */
  /* dlgCharacter */
  /* dlgQuestList */
  /* dlgGamemaster */
  /* dlgQuantityDialog */
  /* dlgNpcChat */
  /* dlgMessageBox */
  /* dlgQuickBar */
  /* dlgBuffBar */
  /* dlgParty */
  /* dlgOptions */
  /* dlgTrade */
  /* dlgChatBox */
  /* dlgKnowledgeBase */
}
.ui .tooltip {
  background-color: rgba(40, 40, 40, 0.4);
  border: 1px solid #777;
  box-shadow: inset 0px 0px 3px #000;
  border-radius: 5px;
  padding: 5px 5px 5px 5px;
  box-sizing: border-box;
  background-color: rgba(30, 30, 30, 0.8);
  width: 250px;
  z-index: 999;
  position: absolute;
  left: 0;
  top: 0;
  display: none;
  pointer-events: none;
}
.ui .tooltip .name {
  font-weight: bold;
}
.ui .tooltip .stat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2px 8px;
  margin: 4px 0;
}
.ui .tooltip .stat-single {
  margin: 2px 0;
}
.ui .tooltip .stat-bracket {
  font-weight: bold;
  color: #ffd870;
  margin: 4px 0;
}
.ui .tooltip .stat-special {
  color: #d0d0d0;
  margin: 4px 0;
}
.ui .tooltip .socket-empty {
  color: #999999;
  margin: 4px 0;
}
.ui .tooltip .gem {
  margin: 4px 0;
}
.ui .tooltip .gem .gem-name {
  color: #7fd0ff;
}
.ui .tooltip .requirement {
  margin: 4px 0;
}
.ui .tooltip .requirement.met {
  color: #3fdb5c;
}
.ui .tooltip .requirement.unmet {
  color: #ff4c4c;
}
.ui .tooltip .value {
  color: #ffd870;
  margin: 4px 0;
}
.ui .tooltip .footer {
  color: #999;
  font-size: 0.85em;
  margin-top: 6px;
}
.ui .flex-horizontal {
  display: flex;
  flex-direction: row;
}
.ui .flex-vertical {
  display: flex;
  flex-direction: column;
}
.ui .flex-stretch {
  align-items: stretch;
}
.ui .flex-center {
  align-items: center;
}
.ui .flex-fill {
  flex: 1;
}
.ui .flex-fill-1 {
  flex: 2;
}
.ui .flex-fill-2 {
  flex: 2;
}
.ui .seperator {
  clear: both;
  margin-bottom: 5px;
}
.ui .seperator10 {
  clear: both;
  height: 10px;
}
.ui .seperator15 {
  clear: both;
  height: 15px;
}
.ui .vertical-scroll {
  overflow-y: auto;
}
.ui .titleText {
  width: 100%;
  font-weight: bold;
  letter-spacing: 1px;
  text-shadow: -1px -1px 0 #000000, 1px -1px 0 #000000, -1px 1px 0 #000000, 1px 1px 0 #000000;
}
.ui .panel {
  background-color: rgba(40, 40, 40, 0.4);
  border: 1px solid #777;
  box-shadow: inset 0px 0px 3px #000;
  border-radius: 5px;
  padding: 5px 5px 5px 5px;
  box-sizing: border-box;
}
.ui .dialog {
  background-color: rgba(40, 40, 40, 0.4);
  border: 1px solid #777;
  box-shadow: inset 0px 0px 3px #000;
  border-radius: 5px;
  padding: 5px 5px 5px 5px;
  box-sizing: border-box;
  display: flex;
  flex-flow: column;
  position: absolute;
  background-color: rgba(50, 50, 50, 0.7);
  border: 1px solid #000;
  box-shadow: inset 0px 0px 3px #ffffff, 0px 0px 8px #000;
}
.ui .dialog .titlebar {
  font-weight: bold;
  letter-spacing: 1px;
  text-shadow: -1px -1px 0 #000000, 1px -1px 0 #000000, -1px 1px 0 #000000, 1px 1px 0 #000000;
  width: 100%;
  height: 20px;
  border-bottom: 1px solid #aaa;
  margin-top: -5px;
  margin-left: -5px;
  margin-bottom: 5px;
  padding-top: 7px;
  padding-left: 8px;
  padding-right: 2px;
}
.ui .dialog .button.close {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 20px;
  height: 20px;
}
.ui .dialog.inventory .tab.pat .pat-equipment {
  display: flex;
  align-items: center;
  white-space: nowrap;
}
.ui .dialog.inventory .tab.pat .pat-equipment .pat-slot-3 {
  margin-left: 18px;
}
.ui .dialog.inventory .tab.pat .pat-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 12px;
  margin: 10px 2px;
}
.ui .dialog.inventory .tab.pat .pat-stats .pat-stat {
  display: flex;
  justify-content: space-between;
  gap: 4px;
  white-space: nowrap;
}
.ui .dialog.inventory .tab.pat .pat-stats .pat-stat strong {
  font-weight: normal;
  text-align: right;
}
.ui .dialog.inventory .tab.pat .pat-stats .pat-type {
  grid-column: -1;
}
.ui .button {
  background: linear-gradient(to bottom, #8c5845 0%, #8c5845 49%, #692814 51%, #692814 100%);
  border-radius: 5px;
  border: 1px solid #252525;
  box-shadow: inset 0px 0px 3px #c0a59b;
  box-sizing: border-box;
  height: 22px;
  text-align: center;
  vertical-align: middle;
  line-height: 19px;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.ui .button .text {
  flex: 1;
  margin-top: -1px;
}
.ui .button:hover {
  background: linear-gradient(to bottom, #915045 0%, #915006 49%, #87280a 51%, #87280a 100%);
  box-shadow: inset 0px 0px 5px #d78269, 0px 0px 3px #962d14;
  border: 1px solid #be6964;
}
.ui .button:active,
.ui .button.active {
  background: linear-gradient(to bottom, #78463c 0%, #824b3c 49%, #661901 51%, #8c280a 100%);
  box-shadow: inset 0px 0px 10px #b4230a, 0px 0px 5px #962d28;
  border: 1px solid #d27869;
}
.ui .button.grey {
  background: linear-gradient(to bottom, #969696 0%, #8c8c8c 49%, #828282 51%, #6e6e6e 100%);
}
.ui .button.grey:hover {
  background: linear-gradient(to bottom, #a0a0a0 0%, #969696 49%, #8c8c8c 51%, #787878 100%);
  box-shadow: inset 0px 0px 5px #d2d2d2, 0px 0px 3px #bebebe;
  border: 1px solid #bebebe;
}
.ui .button.grey:active,
.ui .button.grey.active {
  background: linear-gradient(to bottom, #787878 0%, #828282 49%, #666666 51%, #8c8c8c 100%);
  box-shadow: inset 0px 0px 5px #bebebe, 0px 0px 3px #aaaaaa;
  border: 1px solid #bebebe;
}
.ui .button.black {
  background: linear-gradient(to bottom, #3c3c3c 0%, #232323 49%, #191919 51%, #0f0f0f 100%);
  box-shadow: inset 0px 0px 3px #808080;
}
.ui .button.black:hover {
  background: linear-gradient(to bottom, #6e6e6e 0%, #555555 49%, #4b4b4b 51%, #414141 100%);
  box-shadow: inset 0px 0px 5px #828282, 0px 0px 3px #6e6e6e;
  border: 1px solid #464646;
}
.ui .button.black:active,
.ui .button.black.active {
  background: linear-gradient(to bottom, #1e1e1e 0%, #191919 49%, #0f0f0f 51%, #0f0f0f 100%);
  box-shadow: inset 0px 0px 9px #8c8c8c, 0px 0px 3px #787878;
  border: 1px solid #505050;
}
.ui .tabpanel.horizontal {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.ui .tabpanel.horizontal > .header {
  display: flex;
  flex-direction: row;
  z-index: 1;
}
.ui .tabpanel.horizontal > .header .button {
  flex: 1;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  border-bottom: 0px;
  padding-left: 10px;
  padding-right: 10px;
}
.ui .tabpanel.horizontal > .tab {
  flex: 1;
  background-color: rgba(40, 40, 40, 0.4);
  border: 1px solid #777;
  box-shadow: inset 0px 0px 3px #000;
  border-radius: 5px;
  padding: 5px 5px 5px 5px;
  box-sizing: border-box;
  border-top-right-radius: 0px;
  border-top-left-radius: 0px;
  margin-top: -1px;
}
.ui .tabpanel.vertical {
  display: flex;
  flex-direction: row;
  align-items: stretch;
}
.ui .tabpanel.vertical > .header {
  display: flex;
  flex-direction: column;
  z-index: 1;
}
.ui .tabpanel.vertical > .header .button {
  border-bottom-right-radius: 0px;
  border-top-right-radius: 0px;
  border-right: 0px;
  padding-left: 10px;
  padding-right: 10px;
}
.ui .tabpanel.vertical > .tab {
  flex: 1;
  background-color: rgba(40, 40, 40, 0.4);
  border: 1px solid #777;
  box-shadow: inset 0px 0px 3px #000;
  border-radius: 5px;
  padding: 5px 5px 5px 5px;
  box-sizing: border-box;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  margin-left: -1px;
}
.ui .slot {
  background-color: rgba(40, 40, 40, 0.4);
  border: 1px solid #777;
  box-shadow: inset 0px 0px 3px #000;
  border-radius: 5px;
  padding: 5px 5px 5px 5px;
  box-sizing: border-box;
  display: inline-block;
  position: relative;
  width: 40px;
  height: 40px;
  padding: 0 0 0 0;
  margin: 2px 2px 2px 2px;
}
.ui .slot.cooling-down .icon {
  filter: grayscale(1) brightness(0.6);
}
.ui .slot .cooldown-overlay {
  --cd-pct: 0%;
  position: absolute;
  top: 0;
  left: 0;
  width: 40px;
  height: 40px;
  pointer-events: none;
  background: conic-gradient(transparent var(--cd-pct), rgba(0, 0, 0, 0.65) 0);
}
.ui .icon {
  position: absolute;
  margin-top: -1px;
  margin-left: -1px;
  width: 40px;
  height: 40px;
}
.ui .icon .socket {
  position: absolute;
  left: 0;
  top: 0;
  width: 20px;
  height: 20px;
  background: url('/data/3DDATA/CONTROL/RES/SOKET.png') no-repeat 0 0;
  pointer-events: none;
}
.ui .icon .socket .socket-gem {
  width: 20px;
  height: 20px;
  background: url('/data/3DDATA/CONTROL/RES/SOKETJAM.png') no-repeat;
}
.ui .icon .quantity {
  display: inline;
  position: absolute;
  text-align: center;
  background-color: rgba(20, 20, 20, 0.7);
  color: white;
  left: 2px;
  top: 2px;
  min-width: 15px;
  padding-left: 2px;
  padding-right: 2px;
}
.ui .icon .skill-rank {
  position: absolute;
  right: 1px;
  bottom: 1px;
  padding: 1px 2px;
  background: rgba(20, 20, 20, 0.85);
  color: white;
  font-size: 10px;
  font-weight: bold;
  line-height: 12px;
  pointer-events: none;
}
.ui .textbox {
  background-color: rgba(40, 40, 40, 0.4);
  border: 1px solid #777;
  box-shadow: inset 0px 0px 3px #000;
  border-radius: 5px;
  padding: 5px 5px 5px 5px;
  box-sizing: border-box;
  color: white;
}
.ui .list {
  background-color: rgba(40, 40, 40, 0.4);
  border: 1px solid #777;
  box-shadow: inset 0px 0px 3px #000;
  border-radius: 5px;
  padding: 5px 5px 5px 5px;
  box-sizing: border-box;
  overflow-y: auto;
}
.ui .list .selected {
  color: yellow;
  background: rgba(40, 40, 40, 0.65);
}
.ui .list .listitem {
  padding: 3px 3px 3px 3px;
  margin-bottom: 3px;
}
.ui .list .listitem *:last-child {
  margin-bottom: 0px;
}
.ui .list .listitem:hover {
  color: yellow;
  background: rgba(40, 40, 40, 0.65);
}
.ui .progressbar {
  height: 1.5em;
  line-height: 1.5em;
  border-radius: 2px;
  border: 1px solid #252525;
  box-shadow: inset 0px 0px 4px rgba(255, 255, 255, 0.6);
  background: linear-gradient(to bottom, rgba(120, 120, 120, 0.7) 0%, rgba(100, 100, 100, 0.7) 49%, rgba(80, 80, 80, 0.7) 51%, rgba(60, 60, 60, 0.7) 100%);
}
.ui .progressbar .bar {
  top: 0;
  left: 0;
  height: 100%;
  margin-right: -100%;
  display: inline;
  float: left;
  border-radius: 2px;
  box-shadow: inset 0px 0px 4px rgba(255, 255, 255, 0.6);
}
.ui .progressbar .text {
  display: flex;
  width: 100%;
  float: left;
}
.ui .progressbar .text .label.absolute {
  flex: 1;
  text-align: right;
  padding-right: 5px;
}
.ui .progressbar .text .spacer {
  padding-right: 5px;
}
.ui .progressbar .text .label.percent {
  padding-right: 5px;
}
.ui .progressbar.health > .bar {
  background: rgba(255, 0, 0, 0.5);
}
.ui .progressbar.mana > .bar {
  background: rgba(0, 0, 255, 0.5);
}
.ui .progressbar.exp > .bar {
  background: rgba(200, 200, 0, 0.45);
}
.ui .checkbox:before {
  content: '';
  display: inline-block;
  background: linear-gradient(to bottom, rgba(120, 120, 120, 0.7) 0%, rgba(100, 100, 100, 0.7) 49%, rgba(80, 80, 80, 0.7) 51%, rgba(60, 60, 60, 0.7) 100%);
  border-radius: 5px;
  border: 1px solid #252525;
  box-shadow: inset 0px 0px 3px #c0a59b;
  box-sizing: border-box;
  width: 20px;
  height: 20px;
  text-align: center;
  vertical-align: middle;
  line-height: 18px;
  margin-right: 5px;
}
.ui .checkbox:hover:before {
  background: linear-gradient(to bottom, rgba(160, 160, 160, 0.7) 0%, rgba(140, 140, 140, 0.7) 49%, rgba(120, 120, 120, 0.7) 51%, rgba(100, 100, 100, 0.7) 100%);
}
.ui .checkbox:active:before {
  background: linear-gradient(to bottom, rgba(100, 100, 100, 0.7) 0%, rgba(80, 80, 80, 0.7) 49%, rgba(60, 60, 60, 0.7) 51%, rgba(40, 40, 40, 0.7) 100%);
}
.ui .checkbox.checked:before {
  content: 'X';
  text-shadow: -1px -1px 0 #000000, 1px -1px 0 #000000, -1px 1px 0 #000000, 1px 1px 0 #000000;
  color: white;
}
.ui .dialog.status {
  left: 50%;
  bottom: 10%;
  margin-left: -200px;
  width: 400px;
  text-align: center;
}
.ui .dialog.vending {
  width: 500px;
}
.ui .dialog.npcstore {
  width: 320px;
}
.ui .dialog.npcstore .slots.buy {
  max-height: 280px;
  overflow-y: auto;
}
.ui .dialog.login {
  width: 280px;
}
.ui .dialog.login .textbox {
  width: 100%;
}
.ui .dialog.login .checkbox.remember {
  margin: 0 auto;
  width: 120px;
}
.ui .dialog.server-select {
  width: 250px;
  height: 300px;
}
.ui .dialog.character-select {
  top: 10%;
  right: 10%;
  height: 80%;
  width: 250px;
  align-items: center;
}
.ui .dialog.character-select .list.characters {
  width: 100%;
}
.ui .dialog.character-select .button {
  width: 70%;
}
.ui .dialog.character-create {
  width: 250px;
  right: 7.5%;
  top: calc(50% - 200px);
}
.ui .dialog.character-create .input.name {
  width: 100%;
}
.ui .dialog.character-create .button.prev,
.ui .dialog.character-create .button.next {
  width: 30px;
}
.ui .dialog.character-create .label.category {
  margin-bottom: 2px;
  margin-top: 5px;
  text-align: center;
  font-weight: bold;
}
.ui .dialog.character-create .label.gender,
.ui .dialog.character-create .label.face,
.ui .dialog.character-create .label.hair-style,
.ui .dialog.character-create .label.hair-color {
  background-color: rgba(40, 40, 40, 0.4);
  border: 1px solid #777;
  box-shadow: inset 0px 0px 3px #000;
  border-radius: 5px;
  padding: 5px 5px 5px 5px;
  box-sizing: border-box;
  padding-top: 2px;
  text-align: center;
  height: 22px;
}
.ui .dialog.menu {
  right: 10px;
  bottom: 10px;
  width: 150px;
}
.ui .dialog.menu .button {
  margin-bottom: 5px;
}
.ui .dialog.map .map-marker {
  position: absolute;
  border-radius: 50%;
  pointer-events: auto;
  cursor: pointer;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
}
.ui .dialog.map .player-marker {
  width: 10px;
  height: 10px;
  z-index: 20;
  background-color: #00ff00;
  border: 2px solid white;
}
.ui .dialog.map .npc-marker {
  width: 8px;
  height: 8px;
  z-index: 10;
  background-color: #ff6600;
  border: 1px solid white;
}
.ui .dialog.minimap #minimap-markers {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 5;
}
.ui .dialog.minimap .minimap-npc-marker {
  position: absolute;
  width: 6px;
  height: 6px;
  border: 1px solid white;
  border-radius: 50%;
  background-color: #ff6600;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.8);
}
.ui .dialog.character-status {
  top: 10px;
  left: 10px;
}
.ui .dialog.character-status .fuel-display {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 3px;
}
.ui .dialog.character-status .fuel-display .progressbar.fuel {
  width: 170px;
  background: rgba(90, 90, 90, 0.85);
}
.ui .dialog.character-status .fuel-display .progressbar.fuel .bar {
  background: rgba(32, 180, 65, 0.9);
}
.ui .dialog.character-status .fuel-display .progressbar.fuel .text {
  color: white;
}
.ui .dialog.character-status .character-details {
  display: flex;
  width: 200px;
  color: white;
  font-size: 12px;
  margin-top: 3px;
}
.ui .dialog.character-status .character-details .level {
  color: #ffdf43;
  margin-right: 4px;
}
.ui .dialog.character-status .character-details .weight {
  margin-left: auto;
  text-align: right;
}
.ui .dialog.character-status .label.name {
  width: 100%;
  font-weight: bold;
  letter-spacing: 1px;
  text-shadow: -1px -1px 0 #000000, 1px -1px 0 #000000, -1px 1px 0 #000000, 1px 1px 0 #000000;
  padding-bottom: 3px;
}
.ui .dialog.character-status .progressbar.health {
  width: 200px;
}
.ui .dialog.character-status .progressbar.mana {
  width: 200px;
}
.ui .dialog.character-status .progressbar.exp {
  width: 200px;
  height: 1.1em;
  line-height: 1.1em;
  border-radius: 2px;
  background-size: 10% 100%;
  background-position: 1px 0px;
  background-image: linear-gradient(to right, rgba(150, 150, 100, 0.4) 90%, rgba(0, 0, 0, 0.5) 10%);
}
.ui .dialog.character-status .progressbar.exp .text {
  align-items: center;
  justify-content: center;
}
.ui .dialog.character-status .progressbar.exp .text .label.percent {
  flex: none;
  padding-right: 0;
  color: white;
  font-size: 11px;
  text-shadow: 0 1px 2px black;
}
.ui .dialog.character {
  top: 100px;
  left: 500px;
}
.ui .dialog.character .available-stat-points {
  margin: 4px 0 6px;
  color: #f4d77d;
}
.ui .dialog.character .stat-row {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.ui .dialog.character .stat-column {
  margin-right: 5px;
}
.ui .dialog.character .stat-column:last-child {
  margin-right: 0px;
}
.ui .dialog.character .stat {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 2px;
}
.ui .dialog.character .stat .value {
  flex: 1;
  background-color: rgba(40, 40, 40, 0.5);
  border-radius: 4px;
  text-align: center;
  height: 1.3em;
}
.ui .dialog.character .stat .label.cost {
  min-width: 20px;
  margin-right: 5px;
  text-align: right;
}
.ui .dialog.character .stat .button.levelup {
  min-width: 20px;
  height: 20px;
  margin-right: 5px;
}
.ui .dialog.character .stat .progressbar {
  flex: 1;
  height: 1.5em !important;
}
.ui .dialog.character .stat-row.long-stats {
  align-items: baseline;
}
.ui .dialog.character .stat-row.long-stats .stat-column {
  min-width: 160px;
}
.ui .dialog.character .stat-row.long-stats .stat-column:first-child {
  min-width: 140px;
}
.ui .dialog.character .stat-row.long-stats .stat-column .stat .type {
  min-width: 100px;
}
.ui .dialog.character .stat.level .type,
.ui .dialog.character .stat.job .type,
.ui .dialog.character .stat.clan .type,
.ui .dialog.character .stat.health .type,
.ui .dialog.character .stat.mana .type,
.ui .dialog.character .stat.exp .type {
  min-width: 35px !important;
}
.ui .dialog.character .stat.strength .type,
.ui .dialog.character .stat.dexterity .type,
.ui .dialog.character .stat.intelligence .type,
.ui .dialog.character .stat.concentration .type,
.ui .dialog.character .stat.charm .type,
.ui .dialog.character .stat.sense .type {
  min-width: 35px !important;
}
.ui .dialog.quest-list {
  width: 300px;
}
.ui .dialog.quest-list .list.quests {
  height: 100px;
}
.ui .dialog.quest-list .items {
  margin-right: 5px;
}
.ui .dialog.quest-list .label.description {
  background-color: rgba(40, 40, 40, 0.4);
  border: 1px solid #777;
  box-shadow: inset 0px 0px 3px #000;
  border-radius: 5px;
  padding: 5px 5px 5px 5px;
  box-sizing: border-box;
  overflow-y: auto;
}
.ui .dialog.quest-list .footer {
  margin-top: 6px;
}
.ui .dialog.quest-list .button.abandon {
  width: 100px;
}
.ui .dialog.quest-list .label.timer {
  text-align: center;
}
.ui .dialog.gamemaster {
  width: 500px;
}
.ui .dialog.gamemaster .textbox.search {
  width: 100%;
  box-sizing: border-box;
  margin-bottom: 5px;
}
.ui .dialog.gamemaster .tabpanel.category > .header,
.ui .dialog.gamemaster .tabpanel.skillcategory > .header {
  flex-wrap: wrap;
}
.ui .dialog.gamemaster .tabpanel.category > .header .button,
.ui .dialog.gamemaster .tabpanel.skillcategory > .header .button {
  flex: 0 0 25%;
  box-sizing: border-box;
}
.ui .dialog.gamemaster .tabpanel.category .list,
.ui .dialog.gamemaster .tabpanel.skillcategory .list {
  height: 350px;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
}
.ui .dialog.gamemaster .tabpanel.category .list .listitem,
.ui .dialog.gamemaster .tabpanel.skillcategory .list .listitem {
  width: 42px;
  height: 42px;
  padding: 0;
  margin: 0 3px 3px 0;
}
.ui .dialog.quantity-dialog {
  width: 250px;
}
.ui .dialog.quantity-dialog .item-preview {
  display: flex;
  align-items: center;
}
.ui .dialog.quantity-dialog .item-preview .item-icon {
  position: relative;
  width: 40px;
  height: 40px;
  margin-right: 5px;
}
.ui .dialog.quantity-dialog .price-row {
  display: flex;
  align-items: center;
  gap: 5px;
}
.ui .dialog.npcchat {
  width: 450px;
  top: 30%;
  left: calc(50% - 225px);
}
.ui .dialog.npcchat .label.message {
  background-color: rgba(40, 40, 40, 0.4);
  border: 1px solid #777;
  box-shadow: inset 0px 0px 3px #000;
  border-radius: 5px;
  padding: 5px 5px 5px 5px;
  box-sizing: border-box;
  min-height: 80px;
}
.ui .dialog.npcchat .list.options > div {
  cursor: pointer;
}
.ui .dialog.message-box {
  width: 300px;
  min-height: 150px;
}
.ui .dialog.message-box.error .label.message {
  color: #ff0000;
}
.ui .dialog.message-box .button-area {
  font-size: 0;
}
.ui .dialog.message-box .button-area .button {
  flex: 1;
  margin-right: 5px;
  font-size: small;
}
.ui .dialog.message-box .button-area .button:last-child {
  margin-right: 0px;
}
.ui .dialog.quickbar {
  display: flex;
  flex-direction: row;
  bottom: 10px;
}
.ui .dialog.buff-bar {
  flex-flow: row wrap;
  gap: 3px;
  max-width: 210px;
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;
}
.ui .dialog.buff-bar .buff-icon {
  width: 26px;
  height: 26px;
  background: url('/data/3DDATA/CONTROL/RES/STATEICON.png') no-repeat;
  background-size: 332.8px 332.8px;
  border: 1px solid #000;
  box-shadow: 0 0 4px #000;
}
.ui .dialog.party .label.level {
  min-width: 80px;
}
.ui .dialog.party .partymember {
  display: flex;
  flex-direction: row;
}
.ui .dialog.party .partymember .label.name {
  min-width: 90px;
}
.ui .dialog.party .partymember .progressbar.health {
  min-width: 150px;
  color: white !important;
}
.ui .dialog.options {
  width: 320px;
  min-height: 180px;
}
.ui .dialog.options .option-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin: 5px 0;
}
.ui .dialog.options .option-row .label {
  min-width: 80px;
  margin-right: 5px;
}
.ui .dialog.options .radiogroup.movement-mode {
  display: flex;
  flex-direction: row;
  flex: 1;
  font-size: 0;
}
.ui .dialog.options .radiogroup.movement-mode .button {
  flex: 1;
  margin-right: 5px;
  font-size: small;
}
.ui .dialog.options .radiogroup.movement-mode .button:last-child {
  margin-right: 0px;
}
.ui .dialog.skills .slot {
  margin: 5px 5px 5px 5px;
}
.ui .dialog.skills .skill-panel {
  width: 352px;
}
.ui .dialog.trade {
  width: 600px;
}
.ui .dialog.trade .slots {
  width: 264px;
  min-height: 176px;
}
.ui .dialog.chatbox {
  width: 450px;
  left: 10px;
  bottom: 10px;
}
.ui .dialog.chatbox .system.messages {
  height: 80px;
}
.ui .dialog.chatbox .game.messages {
  height: 170px;
}
.ui .dialog.chatbox .label.messages {
  background-color: rgba(40, 40, 40, 0.4);
  border: 1px solid #777;
  box-shadow: inset 0px 0px 3px #000;
  border-radius: 5px;
  padding: 5px 5px 5px 5px;
  box-sizing: border-box;
  overflow-y: auto;
}
.ui .dialog.chatbox .label.messages .say {
  color: #ffffff;
}
.ui .dialog.chatbox .label.messages .shout {
  color: #bdfaff;
}
.ui .dialog.chatbox .label.messages .whisper {
  color: #c9ff90;
}
.ui .dialog.chatbox .label.messages .trade {
  color: #ffffff;
}
.ui .dialog.chatbox .label.messages .clan {
  color: #ffe47a;
}
.ui .dialog.chatbox .label.messages .ally {
  color: #ffe47a;
}
.ui .dialog.chatbox .label.messages .party {
  color: #ffed8c;
}
.ui .dialog.chatbox .label.messages .system {
  color: #ffe0e5;
}
.ui .dialog.chatbox .label.messages .notice {
  color: #ffbcac;
}
.ui .dialog.chatbox .label.messages .error {
  color: #ff0000;
}
.ui .dialog.chatbox .label.messages .quest {
  color: #97ddf1;
}
.ui .dialog.chatbox .label.messages .quest-reward {
  color: #e0a2d1;
}
.ui .dialog.chatbox .radiogroup.chat-type {
  display: flex;
  flex-direction: row;
  font-size: 0;
}
.ui .dialog.chatbox .radiogroup.chat-type .button {
  flex: 1;
  margin-right: 5px;
  font-size: small;
}
.ui .dialog.chatbox .radiogroup.chat-type .button:last-child {
  margin-right: 0px;
}
.ui .dialog.chatbox .button.send {
  width: 50px;
  height: inherit;
  margin-left: 5px;
}
.ui .dialog.debug {
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  top: -2px;
  right: 10px;
  min-width: 200px;
}
.ui .dialog.debug .panel.controls {
  box-shadow: inset 0px 0px 3px #ffffff;
  background-color: rgba(50, 50, 50, 0.7);
  border: 1px solid #000;
  border-radius: 0;
}
.ui .dialog.debug .panel.controls .button {
  border-radius: 0;
  margin-top: -1px;
  height: 24px;
  text-align: left;
  padding-left: 5px;
}
.ui .dialog.debug .panel.controls *:first-child {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  margin-top: 0px;
}
.ui .dialog.debug .panel.controls *:last-child {
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
.ui .dialog.debug .button.toggle-controls {
  margin-top: -1px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.ui .dialog.knowledge-base {
  width: min(1100px, 92vw);
  height: min(720px, 86vh);
  background-color: rgba(28, 26, 23, 0.96);
  color: #ece4d4;
  font-size: 13px;
}
.ui .dialog.knowledge-base a {
  cursor: pointer;
  text-decoration: none;
}
.ui .dialog.knowledge-base a:hover {
  text-decoration: underline;
}
.ui .dialog.knowledge-base h1,
.ui .dialog.knowledge-base h2 {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: normal;
  margin: 0;
}
.ui .dialog.knowledge-base h1 {
  font-size: 26px;
  color: #f3ead8;
}
.ui .dialog.knowledge-base h1 small {
  font-size: 16px;
  color: #a89f8e;
}
.ui .dialog.knowledge-base h2 {
  font-size: 14px;
  letter-spacing: 0.06em;
  color: #e2b862;
  margin-bottom: 8px;
}
.ui .dialog.knowledge-base section {
  margin-bottom: 18px;
}
.ui .dialog.knowledge-base .kb-mob {
  color: #f09a72;
}
.ui .dialog.knowledge-base .kb-item {
  color: #8dbbe8;
}
.ui .dialog.knowledge-base .kb-zone {
  color: #9ccf95;
}
.ui .dialog.knowledge-base .kb-npc {
  color: #cfa9ea;
}
.ui .dialog.knowledge-base .kb-muted {
  color: #a89f8e;
  font-size: 12px;
}
.ui .dialog.knowledge-base .kb-k {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #a89f8e;
  margin: 8px 0 4px;
}
.ui .dialog.knowledge-base .kb-empty,
.ui .dialog.knowledge-base .kb-status {
  color: #a89f8e;
  font-style: italic;
  padding: 8px 0;
}
.ui .dialog.knowledge-base .kb-error {
  color: #ff8a80;
}
.ui .dialog.knowledge-base .kb-toolbar {
  display: flex;
  gap: 6px;
  align-items: center;
  padding: 6px 0 8px;
  border-bottom: 1px solid #3a352d;
}
.ui .dialog.knowledge-base .kb-btn {
  width: 28px;
  height: 26px;
  border: 1px solid #3a352d;
  border-radius: 4px;
  background: #221f1b;
  color: #ece4d4;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}
.ui .dialog.knowledge-base .kb-btn:disabled {
  color: #5f584d;
  cursor: default;
}
.ui .dialog.knowledge-base .kb-search {
  flex: 1;
  max-width: 460px;
  height: 26px;
  padding: 0 10px;
  border: 1px solid #4a4336;
  border-radius: 4px;
  background: #0f0e0c;
  color: #ece4d4;
  font: inherit;
  outline: none;
  user-select: text;
}
.ui .dialog.knowledge-base .kb-search:focus {
  border-color: #e2b862;
}
.ui .dialog.knowledge-base .kb-body {
  display: flex;
  flex: 1;
  min-height: 0;
}
.ui .dialog.knowledge-base .kb-nav {
  width: 170px;
  flex-shrink: 0;
  padding: 8px 8px 8px 0;
  border-right: 1px solid #3a352d;
  overflow-y: auto;
}
.ui .dialog.knowledge-base .kb-nav a {
  display: block;
  padding: 6px 10px;
  border-radius: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ui .dialog.knowledge-base .kb-nav a:hover {
  background: #2a2620;
  text-decoration: none;
}
.ui .dialog.knowledge-base .kb-nav .kb-nav-link {
  color: #cfc6b4;
  font-size: 14px;
}
.ui .dialog.knowledge-base .kb-nav .kb-nav-link.kb-zone {
  color: #9ccf95;
}
.ui .dialog.knowledge-base .kb-nav .kb-nav-link.kb-mob {
  color: #f09a72;
}
.ui .dialog.knowledge-base .kb-nav .kb-nav-link.kb-npc {
  color: #cfa9ea;
}
.ui .dialog.knowledge-base .kb-nav .kb-nav-link.kb-item {
  color: #8dbbe8;
}
.ui .dialog.knowledge-base .kb-nav .kb-nav-link.active {
  background: #2e2a22;
  box-shadow: inset 2px 0 0 #e2b862;
}
.ui .dialog.knowledge-base .kb-nav .kb-nav-label {
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #8d8575;
  padding: 12px 10px 4px;
}
.ui .dialog.knowledge-base .kb-main {
  flex: 1;
  min-width: 0;
  overflow-y: auto;
  padding: 10px 16px 16px;
  user-select: text;
}
.ui .dialog.knowledge-base .kb-crumbs {
  font-size: 12px;
  color: #a89f8e;
  margin-bottom: 10px;
}
.ui .dialog.knowledge-base .kb-crumbs a {
  color: #e2b862;
}
.ui .dialog.knowledge-base .kb-crumbs .kb-sep {
  margin: 0 6px;
}
.ui .dialog.knowledge-base .kb-tagline {
  display: flex;
  gap: 8px;
  align-items: center;
  color: #8d8575;
  font-size: 12px;
  margin-bottom: 4px;
}
.ui .dialog.knowledge-base .kb-tag {
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border: 1px solid currentColor;
  border-radius: 999px;
  padding: 1px 8px;
}
.ui .dialog.knowledge-base .kb-hero {
  display: flex;
  gap: 18px;
  align-items: flex-start;
}
.ui .dialog.knowledge-base .kb-hero figure {
  margin: 0;
  width: 360px;
  flex-shrink: 0;
}
.ui .dialog.knowledge-base .kb-hero-text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ui .dialog.knowledge-base .kb-hero-item {
  align-items: center;
}
.ui .dialog.knowledge-base .kb-desc {
  margin: 0;
  color: #cfc6b4;
  line-height: 1.45;
  max-width: 560px;
}
.ui .dialog.knowledge-base .kb-facts {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 8px 16px;
  padding: 10px 12px;
  border: 1px solid #3a352d;
  border-radius: 6px;
  background: #221f1b;
}
.ui .dialog.knowledge-base .kb-facts .kb-k {
  margin: 0;
}
.ui .dialog.knowledge-base .kb-facts .kb-v {
  font-size: 15px;
}
.ui .dialog.knowledge-base .kb-map {
  position: relative;
  border: 1px solid #4a4336;
  border-radius: 6px;
  overflow: hidden;
  background: #0f0e0c;
}
.ui .dialog.knowledge-base .kb-map img {
  display: block;
  width: 100%;
}
.ui .dialog.knowledge-base .kb-map-empty {
  height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #a89f8e;
}
.ui .dialog.knowledge-base .kb-map-thumb {
  width: 260px;
  flex-shrink: 0;
}
.ui .dialog.knowledge-base .kb-markers {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.ui .dialog.knowledge-base .kb-marker {
  position: absolute;
  width: 8px;
  height: 8px;
  margin: -5px 0 0 -5px;
  border: 1px solid #0d0c0b;
  border-radius: 50%;
}
.ui .dialog.knowledge-base .kb-marker[data-nav] {
  cursor: pointer;
}
.ui .dialog.knowledge-base .kb-marker:hover {
  transform: scale(1.6);
  z-index: 1;
}
.ui .dialog.knowledge-base .kb-marker-mob {
  background: #f09a72;
}
.ui .dialog.knowledge-base .kb-marker-npc {
  background: #cfa9ea;
  border-radius: 2px;
}
.ui .dialog.knowledge-base .kb-marker-warp {
  background: #9ccf95;
  border-radius: 2px;
}
.ui .dialog.knowledge-base .kb-marker-you {
  background: #e2b862;
  width: 10px;
  height: 10px;
  box-shadow: 0 0 0 3px rgba(226, 184, 98, 0.35);
}
.ui .dialog.knowledge-base .kb-legend {
  display: flex;
  gap: 12px;
  margin-top: 6px;
  font-size: 12px;
  color: #a89f8e;
}
.ui .dialog.knowledge-base .kb-legend i {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 5px;
  border-radius: 50%;
}
.ui .dialog.knowledge-base .kb-legend .kb-marker-npc,
.ui .dialog.knowledge-base .kb-legend .kb-marker-warp {
  border-radius: 2px;
}
.ui .dialog.knowledge-base .kb-legend .kb-marker-you {
  box-shadow: none;
}
.ui .dialog.knowledge-base .kb-here {
  display: flex;
  gap: 16px;
  padding: 12px;
  border: 1px solid #3a352d;
  border-radius: 8px;
  background: #221f1b;
}
.ui .dialog.knowledge-base .kb-here-text {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ui .dialog.knowledge-base .kb-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ui .dialog.knowledge-base .kb-chip {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  padding: 4px 10px;
  border: 1px solid #3a352d;
  border-radius: 999px;
  background: #1a1815;
}
.ui .dialog.knowledge-base .kb-chip span {
  color: #a89f8e;
  font-size: 11px;
}
.ui .dialog.knowledge-base .kb-chip.active {
  border-color: currentColor;
}
.ui .dialog.knowledge-base .kb-tiles {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.ui .dialog.knowledge-base .kb-tile {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px;
  border: 1px solid #3a352d;
  border-radius: 8px;
  background: #221f1b;
}
.ui .dialog.knowledge-base .kb-tile span:last-child {
  color: #a89f8e;
  font-size: 12px;
}
.ui .dialog.knowledge-base .kb-tile:hover {
  border-color: currentColor;
  text-decoration: none;
}
.ui .dialog.knowledge-base .kb-tile-title {
  font-family: Georgia, serif;
  font-size: 17px;
}
.ui .dialog.knowledge-base .kb-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.ui .dialog.knowledge-base .kb-card {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid #3a352d;
  border-radius: 6px;
  background: #221f1b;
}
.ui .dialog.knowledge-base .kb-card:hover {
  border-color: #9ccf95;
  text-decoration: none;
}
.ui .dialog.knowledge-base .kb-tabs {
  display: flex;
  gap: 2px;
  border-bottom: 1px solid #3a352d;
  margin-bottom: 6px;
}
.ui .dialog.knowledge-base .kb-tab {
  padding: 6px 14px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: none;
  color: #a89f8e;
  font: inherit;
  cursor: pointer;
}
.ui .dialog.knowledge-base .kb-tab:hover {
  color: #ece4d4;
}
.ui .dialog.knowledge-base .kb-tab.active {
  color: #ece4d4;
  border-bottom-color: #e2b862;
}
.ui .dialog.knowledge-base .kb-table {
  width: 100%;
  border-collapse: collapse;
  color: #ece4d4;
  font-size: 13px;
}
.ui .dialog.knowledge-base .kb-table th {
  text-align: left;
  font-weight: normal;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #a89f8e;
  padding: 6px 8px;
  border-bottom: 1px solid #3a352d;
}
.ui .dialog.knowledge-base .kb-table td {
  padding: 5px 8px;
  border-bottom: 1px solid #2c2821;
  vertical-align: middle;
}
.ui .dialog.knowledge-base .kb-table tr:hover td {
  background: #28251f;
}
.ui .dialog.knowledge-base .kb-source {
  font-size: 11px;
  padding: 1px 7px;
  border: 1px solid #3a352d;
  border-radius: 999px;
  background: #151311;
  white-space: nowrap;
}
.ui .dialog.knowledge-base .kb-chance {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  white-space: nowrap;
}
.ui .dialog.knowledge-base .kb-bar {
  display: inline-block;
  width: 60px;
  height: 5px;
  border-radius: 3px;
  background: #2c2821;
  overflow: hidden;
}
.ui .dialog.knowledge-base .kb-bar span {
  display: block;
  height: 100%;
  background: #8dbbe8;
}
.ui .dialog.knowledge-base .kb-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 16px;
}
.ui .dialog.knowledge-base .kb-columns-wide {
  grid-template-columns: 1fr 240px;
}
.ui .dialog.knowledge-base .kb-row {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 5px 0;
  border-bottom: 1px solid #2c2821;
}
.ui .dialog.knowledge-base .kb-results {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 4px 12px;
}
.ui .dialog.knowledge-base .kb-result {
  display: flex;
  gap: 8px;
  align-items: center;
  min-height: 22px;
}
.ui .dialog.knowledge-base .kb-count {
  color: #a89f8e;
  font-size: 12px;
}
.ui .dialog.knowledge-base .kb-icon {
  position: relative;
  display: inline-block;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border: 1px solid #5a5040;
  border-radius: 3px;
  background: #0f0e0c;
  overflow: hidden;
}
.ui .dialog.knowledge-base .kb-icon .icon {
  margin: 0;
}
.ui .dialog.knowledge-base .kb-result .kb-icon {
  transform: scale(0.6);
  margin: -8px;
}
.ui .dialog.knowledge-base .kb-icon-big {
  transform: scale(1.6);
  margin: 16px 22px 16px 16px;
}
.ui .dialog.knowledge-base .kb-inline {
  display: inline-flex;
  gap: 8px;
  align-items: center;
}
.ui .dialog.knowledge-base .kb-slots {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.ui .dialog.knowledge-base .kb-drop {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 4px 0;
}
.ui .dialog.knowledge-base .kb-drop-name {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.ui .dialog.knowledge-base .kb-item-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 2px 14px;
  margin-top: 10px;
}
.item-iconsheet-1 {
  background: url('/data/3DDATA/CONTROL/RES/ICON01.PNG');
}
.item-iconsheet-2 {
  background: url('/data/3DDATA/CONTROL/RES/ICON02.PNG');
}
.item-iconsheet-3 {
  background: url('/data/3DDATA/CONTROL/RES/ICON03.PNG');
}
.item-iconsheet-4 {
  background: url('/data/3DDATA/CONTROL/RES/ICON04.PNG');
}
.item-iconsheet-5 {
  background: url('/data/3DDATA/CONTROL/RES/ICON05.PNG');
}
.item-iconsheet-6 {
  background: url('/data/3DDATA/CONTROL/RES/ICON06.PNG');
}
.item-iconsheet-7 {
  background: url('/data/3DDATA/CONTROL/RES/ICON07.PNG');
}
.item-iconsheet-8 {
  background: url('/data/3DDATA/CONTROL/RES/ICON08.PNG');
}
.item-iconsheet-9 {
  background: url('/data/3DDATA/CONTROL/RES/ICON09.PNG');
}
.item-iconsheet-10 {
  background: url('/data/3DDATA/CONTROL/RES/ICON10.PNG');
}
.item-iconsheet-11 {
  background: url('/data/3DDATA/CONTROL/RES/ICON11.PNG');
}
.item-iconsheet-12 {
  background: url('/data/3DDATA/CONTROL/RES/ICON12.PNG');
}
.item-iconsheet-13 {
  background: url('/data/3DDATA/CONTROL/RES/ICON13.PNG');
}
.item-iconsheet-14 {
  background: url('/data/3DDATA/CONTROL/RES/ICON14.PNG');
}
.item-iconsheet-15 {
  background: url('/data/3DDATA/CONTROL/RES/ICON15.PNG');
}
.item-iconsheet-16 {
  background: url('/data/3DDATA/CONTROL/RES/ICON16.PNG');
}
.item-iconsheet-17 {
  background: url('/data/3DDATA/CONTROL/RES/ICON17.PNG');
}
.item-iconsheet-18 {
  background: url('/data/3DDATA/CONTROL/RES/ICON18.PNG');
}
.item-iconsheet-19 {
  background: url('/data/3DDATA/CONTROL/RES/ICON19.PNG');
}
.item-iconsheet-20 {
  background: url('/data/3DDATA/CONTROL/RES/ICON20.PNG');
}
.item-iconsheet-21 {
  background: url('/data/3DDATA/CONTROL/RES/ICON21.PNG');
}
.item-iconsheet-22 {
  background: url('/data/3DDATA/CONTROL/RES/ICON22.PNG');
}
.item-iconsheet-23 {
  background: url('/data/3DDATA/CONTROL/RES/ICON23.PNG');
}
.item-iconsheet-24 {
  background: url('/data/3DDATA/CONTROL/RES/ICON24.PNG');
}
.item-iconsheet-25 {
  background: url('/data/3DDATA/CONTROL/RES/ICON25.PNG');
}
.item-iconsheet-26 {
  background: url('/data/3DDATA/CONTROL/RES/ICON26.PNG');
}
.item-iconsheet-27 {
  background: url('/data/3DDATA/CONTROL/RES/ICON27.PNG');
}
.item-iconsheet-28 {
  background: url('/data/3DDATA/CONTROL/RES/ICON28.PNG');
}
.item-iconsheet-29 {
  background: url('/data/3DDATA/CONTROL/RES/ICON29.PNG');
}
.item-iconsheet-30 {
  background: url('/data/3DDATA/CONTROL/RES/ICON30.PNG');
}
.item-iconsheet-31 {
  background: url('/data/3DDATA/CONTROL/RES/ICON31.PNG');
}
.item-iconsheet-32 {
  background: url('/data/3DDATA/CONTROL/RES/ICON32.PNG');
}
.item-iconsheet-33 {
  background: url('/data/3DDATA/CONTROL/RES/ICON33.PNG');
}
.item-iconsheet-34 {
  background: url('/data/3DDATA/CONTROL/RES/ICON34.PNG');
}
.item-iconsheet-35 {
  background: url('/data/3DDATA/CONTROL/RES/ICON35.PNG');
}
.item-iconsheet-36 {
  background: url('/data/3DDATA/CONTROL/RES/ICON36.PNG');
}
.item-iconsheet-37 {
  background: url('/data/3DDATA/CONTROL/RES/ICON37.PNG');
}
.item-iconsheet-38 {
  background: url('/data/3DDATA/CONTROL/RES/ICON38.PNG');
}
.item-iconsheet-39 {
  background: url('/data/3DDATA/CONTROL/RES/ICON39.PNG');
}
.item-iconsheet-40 {
  background: url('/data/3DDATA/CONTROL/RES/ICON40.PNG');
}
.item-iconsheet-41 {
  background: url('/data/3DDATA/CONTROL/RES/ICON41.PNG');
}
.item-iconsheet-42 {
  background: url('/data/3DDATA/CONTROL/RES/ICON42.PNG');
}
.item-iconsheet-43 {
  background: url('/data/3DDATA/CONTROL/RES/ICON43.PNG');
}
.item-iconsheet-44 {
  background: url('/data/3DDATA/CONTROL/RES/ICON44.PNG');
}
.item-iconsheet-45 {
  background: url('/data/3DDATA/CONTROL/RES/ICON45.PNG');
}
.item-iconsheet-46 {
  background: url('/data/3DDATA/CONTROL/RES/ICON46.PNG');
}
.item-iconsheet-47 {
  background: url('/data/3DDATA/CONTROL/RES/ICON47.PNG');
}
.item-iconsheet-48 {
  background: url('/data/3DDATA/CONTROL/RES/ICON48.PNG');
}
.item-iconsheet-49 {
  background: url('/data/3DDATA/CONTROL/RES/ICON49.PNG');
}
.skill-iconsheet-1 {
  background: url('/data/3DDATA/CONTROL/RES//SKILL01.PNG');
}
.skill-iconsheet-2 {
  background: url('/data/3DDATA/CONTROL/RES//SKILL02.PNG');
}
.skill-iconsheet-3 {
  background: url('/data/3DDATA/CONTROL/RES//SKILL03.PNG');
}
.skill-iconsheet-4 {
  background: url('/data/3DDATA/CONTROL/RES//SKILL04.PNG');
}
.skill-iconsheet-5 {
  background: url('/data/3DDATA/CONTROL/RES//SKILL05.PNG');
}
.skill-iconsheet-6 {
  background: url('/data/3DDATA/CONTROL/RES//SKILL06.PNG');
}
.skill-iconsheet-7 {
  background: url('/data/3DDATA/CONTROL/RES//SKILL07.PNG');
}
.skill-iconsheet-8 {
  background: url('/data/3DDATA/CONTROL/RES//SKILL08.PNG');
}
.skill-iconsheet-9 {
  background: url('/data/3DDATA/CONTROL/RES//SKILL09.PNG');
}