body {
  -webkit-user-select: none;
  -moz-user-select: -moz-none;
  -ms-user-select: none;
  user-select: none;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: #232a35;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.content-side,
.content-header {
  padding-left: max(env(safe-area-inset-left, 1.25rem), 1.25rem) !important;
  padding-right: max(env(safe-area-inset-right, 1.25rem), 1.25rem) !important;
}

.content-side {
  height: 100%;
}

.content-header-home {
  padding-left: max(env(safe-area-inset-left, 0.25rem), 0.25rem) !important;
  padding-right: max(env(safe-area-inset-right, 0.25rem), 0.25rem) !important;
}

.content {
  padding-bottom: 10rem !important;
}

#m-page-loader-test {
  padding-bottom: max(env(safe-area-inset-bottom, 0), 0) !important;
}

/* Hide scrollbar for Chrome, Safari and Opera */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.no-scrollbar {
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}

.toastify {
  box-shadow: none !important;
  padding: 0px 4px !important;
  transition: all 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) !important;
  pointer-events: none !important;
  cursor: auto !important;
}

.toastify-center {
  max-width: -moz-fit-content !important;
}

.block.block-rounded-double {
  border-radius: 0.5rem;
}

.block.block-rounded-extra {
  border-radius: 1rem;
}

.btn.btn-sm.btn-rounded-double {
  border-radius: 0.5rem;
}

.bg-light-gray {
  background-color: #edf0f3;
}

.bg-combat-dark {
  background-color: #fff !important;
}

.text-combat-smoke {
  color: #575757;
}

a.combat-action,
h5.combat-action,
body.darkMode h5.combat-action {
  color: #4299e1 !important;
}

.link-color {
  color: #4299e1 !important;
}

.border.border-combat-outline {
  border-color: #b1b1b1 !important;
}

.bg-combat-inner-dark {
  background-color: #ececec;
}

.progress.active .progress-bar {
  -webkit-transition: none !important;
  transition: none !important;
}

.bg-caseoffortune {
  background-color: #46443e !important;
}

.border-caseoffortune {
  border-color: #46443e !important;
}

.bg-black-30 {
  background-color: #0000004d;
}

.bg-magic {
  background-color: #8d7bca !important;
}

.bg-magic-50 {
  background-color: #8d7bca3d !important;
}

body.darkMode.superDark .bg-magic,
body.darkMode.superDark .bg-settings,
body.darkMode.superDark .bg-bank,
body.darkMode.superDark .bg-shop,
body.darkMode.superDark .bg-woodcutting,
body.darkMode.superDark .bg-combat,
body.darkMode.superDark .bg-farming,
body.darkMode.superDark .bg-township,
body.darkMode.superDark .bg-fishing,
body.darkMode.superDark .bg-firemaking,
body.darkMode.superDark .bg-cooking,
body.darkMode.superDark .bg-mining,
body.darkMode.superDark .bg-harvesting,
body.darkMode.superDark .bg-smithing,
body.darkMode.superDark .bg-thieving,
body.darkMode.superDark .bg-fletching,
body.darkMode.superDark .bg-crafting,
body.darkMode.superDark .bg-runecrafting,
body.darkMode.superDark .bg-herblore,
body.darkMode.superDark .bg-agility,
body.darkMode.superDark .bg-summoning,
body.darkMode.superDark .bg-astrology,
body.darkMode.superDark .bg-cartography,
body.darkMode.superDark .bg-archaeology,
body.darkMode.superDark .bg-golbinraid,
body.darkMode.superDark .bg-completionLog,
body.darkMode.superDark .bg-lore,
body.darkMode.superDark .bg-statistics {
  background-color: #000000 !important;
}

.border-magic {
  border-color: #8d7bca !important;
}

.bg-easter {
  background-color: #d38bcf !important;
}

.border-easter {
  border-color: #d38bcf !important;
}

.bg-christmas2021 {
  background-color: #ad9523 !important;
}

.border-christmas2021 {
  border-color: #ad9523 !important;
}

.bg-hmm2022 {
  background-color: #ad9523 !important;
}

.border-hmm2022 {
  border-color: #ad9523 !important;
}

.bg-golbinraid {
  background-color: #f3b760 !important;
}

.border-golbinraid {
  border-color: #f3b760 !important;
}

.border-agility {
  border-color: #2c87fa !important;
}

.bg-agility {
  background-color: #2c87fa !important;
}

.bg-agility-50 {
  background-color: #2c87fa3d !important;
}

.border-summoning {
  border-color: #81878a;
}

body.darkMode.superDark .progress-bar.bg-summoning,
.bg-summoning {
  background-color: #81878a !important;
}

.bg-summoning-50 {
  background-color: #81878a3d;
}

.bg-archaeology {
  background-color: #e0a550 !important;
}

.border-archaeology {
  border-color: #e0a550 !important;
}

body.darkMode.superDark .progress-bar.bg-woodcutting,
.bg-woodcutting {
  background-color: #358f12 !important;
}

.bg-woodcutting-50 {
  background-color: #358f123d !important;
}

.border-woodcutting {
  border-color: #358f12 !important;
}

.bg-shop {
  background-color: #febb33 !important;
}

.border-shop {
  border-color: #febb33 !important;
}

.bg-bank {
  background-color: #b57e3b !important;
}

.border-bank {
  border-color: #b57e3b !important;
}

.bg-settings {
  background-color: #bcc0c0 !important;
}

.border-settings {
  border-color: #bcc0c0 !important;
}

.bg-changelog {
  background-color: #f98989 !important;
}

.border-changelog {
  border-color: #f98989 !important;
}

.bg-mastery {
  background-color: #d7952e !important;
}

.border-mastery {
  border-color: #d7952e !important;
}

.bg-milestones {
  background-color: #f7a85a !important;
}

.border-milestones {
  border-color: #f7a85a !important;
}

.bg-statistics {
  background-color: #54776a !important;
}

.border-statistics {
  border-color: #54776a !important;
}

.bg-fishing {
  background-color: #92d0f1 !important;
}

.bg-fishing-50 {
  background-color: #92d0f13d !important;
}

.border-fishing {
  border-color: #92d0f1 !important;
}

.bg-firemaking {
  background-color: #b46624 !important;
}

.bg-firemaking-50 {
  background-color: #b466243d !important;
}

.border-firemaking {
  border-color: #b46624 !important;
}

.bg-cooking {
  background-color: #c2b6b8 !important;
}

.bg-cooking-50 {
  background-color: #c2b6b83d !important;
}

.border-cooking {
  border-color: #c2b6b8 !important;
}

.bg-mining {
  background-color: #95857a !important;
}

.bg-mining-50,
body.darkMode.superDark .progress-bar.bg-mining {
  background-color: #95857a3d !important;
}

.border-mining {
  border-color: #95857a !important;
}

.bg-harvesting {
  background-color: #d93355 !important;
}

.bg-harvesting-50,
body.darkMode.superDark .progress-bar.bg-harvesting {
  background-color: #d933553d !important;
}

.border-harvesting {
  border-color: #d93355 !important;
}

.bg-smithing {
  background-color: #69686f !important;
}

.bg-smithing-50 {
  background-color: #69686f3d !important;
}

.border-smithing {
  border-color: #69686f !important;
}

.bg-thieving {
  background-color: #837f73 !important;
}

.bg-thieving-50 {
  background-color: #837f733d !important;
}

.border-thieving {
  border-color: #837f73 !important;
}

body.darkMode.superDark .progress-bar.bg-farming,
.bg-farming {
  background-color: #ab921a !important;
}

.bg-farming-50 {
  background-color: #ab921a3d !important;
}

.border-farming {
  border-color: #ab921a !important;
}

.bg-combat {
  background-color: #a4a4a9 !important;
}

.bg-combat-50 {
  background-color: #a4a4a93d !important;
}

.border-combat {
  border-color: #a4a4a9 !important;
}

.bg-fletching {
  background-color: #e87575 !important;
}

.bg-fletching-50 {
  background-color: #e875753d !important;
}

.border-fletching {
  border-color: #e87575 !important;
}

.bg-crafting {
  background-color: #947650 !important;
}

.bg-crafting-50 {
  background-color: #9476503d !important;
}

.border-crafting {
  border-color: #947650 !important;
}

.bg-runecrafting {
  background-color: #d2b2a6 !important;
}

.bg-runecrafting-50 {
  background-color: #d2b2a63d !important;
}

.border-runecrafting {
  border-color: #d2b2a6 !important;
}

.bg-herblore {
  background-color: #45c094 !important;
}

.bg-herblore-50 {
  background-color: #45c0943d !important;
}

.border-herblore {
  border-color: #45c094 !important;
}

.bg-astrology {
  background-color: #75bae6 !important;
}

.bg-astrology-50 {
  background-color: #75bbe63d !important;
}

.border-astrology {
  border-color: #75bae6 !important;
}

.border-township {
  border-color: #6c838a !important;
}

.bg-lore {
  background-color: #eca526 !important;
}

.border-lore {
  border-color: #eca526 !important;
}

.bg-profile {
  background-color: #e7eced !important;
}

.border-profile {
  border-color: #e7eced !important;
}

.tooltip-inner {
  max-width: 350px;
  /* the minimum width */
}

.border-rounded-equip {
  border-radius: 0.5rem !important;
}

.border-rounded-equip.selected {
  background-color: #f9fafb !important;
}

.nav-img {
  width: 24px;
  height: 24px;
  margin-right: 0.66em;
}

.combat-equip-img {
  width: 48px;
  height: 48px;
  margin: 0.33em;
  background-color: #fff;
}

.combat-menu-img {
  width: 40px;
  height: 40px;
  margin: 0.33em;
  background-color: #fff;
}

.bank-img {
  width: 64px;
  height: 64px;
  pointer-events: none;
}

.convert-img {
  width: 64px;
  height: 64px;
  pointer-events: none;
}

.astro-img {
  width: 96px;
  height: 96px;
}

.text-bank-desc {
  color: #4c9e6f !important;
}

body.darkMode .text-bank-desc {
  color: #46c37b !important;
}

.bank-img-detail {
  width: 100%;
  pointer-events: none;
}

@media (max-width: 1750px) {
  .bank-img-detail {
    width: 100%;
    pointer-events: none;
  }
}

body::before {
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  content: '';
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  will-change: transform;
  z-index: -1;
}

body.bg0::before {
  background-image: url('https://cdn2-main.melvor.net/assets/media/main/bg_0.jpg');
}

body.bg1::before {
  background-image: url('https://cdn2-main.melvor.net/assets/media/main/bg_1.jpg');
}

body.bg2::before {
  background-image: url('https://cdn2-main.melvor.net/assets/media/main/bg_2.jpg');
}

body.bg3::before {
  background-image: url('https://cdn2-main.melvor.net/assets/media/main/bg_3.jpg');
}

body.bg4::before {
  background-image: url('https://cdn2-main.melvor.net/assets/media/main/bg_4.jpg');
}

body.bg5::before {
  background-image: url('https://cdn2-main.melvor.net/assets/media/main/bg_5.jpg');
}

body.bg6::before {
  background-image: url('https://cdn2-main.melvor.net/assets/media/main/bg_6.jpg');
}

body.bg7::before {
  background-image: url('https://cdn2-main.melvor.net/assets/media/main/bg_7.jpg');
}

body.bg8::before {
  background-image: url('https://cdn2-main.melvor.net/assets/media/main/bg_8.jpg');
}

body.bg9::before {
  background-image: url('assets/media/main/bg_9.jpg');
}

.bank-item-detail {
  position: relative;
  height: 128px;
  width: 128px;
  background-image: url('https://cdn2-main.melvor.net/assets/media/main/bank_border.png?2');
  background-size: contain;
  background-color: transparent;
}

.bank-item {
  position: relative;
  height: 64px;
  width: 64px;
  background-image: url('https://cdn2-main.melvor.net/assets/media/main/bank_border.png?2');
  background-size: contain;
  background-color: transparent;
  border-radius: 5px;
}

.convert-item {
  position: relative;
  height: 64px;
  width: 64px;
  border-radius: 5px;
}

@media (max-width: 860px) {
  .bank-item {
    width: 60px;
    height: 60px;
  }

  .bank-img {
    width: 60px;
    height: 60px;
  }

  .convert-item {
    width: 60px;
    height: 60px;
  }

  .convert-img {
    width: 60px;
    height: 60px;
  }
}

.monster-item {
  position: relative;
  height: 88px;
  width: 88px;
  border-radius: 5px;
}

.monster-item-boss {
  position: relative;
  height: 180px;
  width: 180px;
  border-radius: 5px;
}

body.darkMode .btn-locked {
  background-color: #693a3a !important;
}

.btn-locked {
  background-color: #f1acac !important;
}

.bank-item.no-bg,
.bank-locked.no-bg {
  background-image: none !important;
}

.convert-item.no-bg {
  background-image: none !important;
}

.bank-img-old {
  max-width: 38px;
  height: 38px;
  margin: 6px;
}

.bank-item.bank-locked {
  background-image: url('https://cdn2-main.melvor.net/assets/media/main/bank_border_locked.png?2');
}

.border.bank-locked {
  border-color: red !important;
}

.border.border-locked,
body.darkMode .border.border-locked {
  border: 1px solid #d26a5c !important;
}

.bg-item-md {
  height: 96px !important;
  width: 96px !important;
  background-image: url('https://cdn2-main.melvor.net/assets/media/main/bank_border.png?2');
  background-size: contain;
  background-color: transparent;
}

.bank-item div {
  position: absolute;
  bottom: -10px;
  width: 100px;
  left: -25px;
}

.bank-item div.loot-span {
  position: absolute;
  bottom: -10px;
  width: 100px;
  left: -17px;
}

.bank-item.resize-32 div {
  position: absolute;
  bottom: -10px;
  width: 100px;
  left: -32px;
}

.bank-item div.in-bank {
  left: -19px;
}

.convert-item div {
  position: absolute;
  bottom: -4px;
  width: 100%;
}

.btn-combat-minibar-food div {
  position: absolute;
  bottom: 32px;
  left: 50%;
  transform: translate(-50%, 0%);
}

.btn-combat-minibar-hp {
  position: relative;
}

.combat-minibar-hp-text {
  position: absolute;
  width: 184px;
  bottom: 100%;
  transform: translateY(40%);
}

.fishing-img {
  width: 38px;
  height: 38px;
}

.milestone-icon {
  width: 24px;
  height: 24px;
  margin-right: 0.66em;
}

.combat-enemy-img {
  max-height: 230px;
  width: auto;
  max-width: 100%;
  margin: 16px;
}

.combat-enemy-img-sm {
  max-height: 80px;
  width: auto;
  max-width: 100%;
  margin: 4px;
}

.combat-enemy-img-sm-boss {
  max-height: 172px;
  width: auto;
  max-width: 100%;
  margin: 8px;
}

.combat-enemy-img-spinner-mobile,
.combat-enemy-img-spinner {
  height: 230px;
  width: 230px;
  margin: 16px;
}

@media (max-width: 991px) {
  .combat-enemy-img-spinner-mobile {
    height: 200px;
    width: 200px;
    margin: 0px;
  }
}

@media (min-width: 992px) {
  .combat-enemy-img.dungeon-boss {
    max-height: 330px;
    height: 330px;
    width: auto;
    max-width: 100%;
    margin: 0px !important;
    bottom: 0;
  }
}

.mastery-icon-xs {
  height: 16px;
  width: 16px;
  margin: 2px;
}

.mastery-icon-sm {
  height: 20px;
  width: 20px;
  margin: 2px;
}

.skill-icon-xxs {
  height: 0.875rem;
  width: 0.875rem;
  margin: 2px;
}

.skill-icon-xs {
  height: 24px;
  width: 24px;
  margin: 4px;
}

.skill-icon-sm {
  height: 32px;
  width: 32px;
  margin: 6px;
}

.shop-img {
  width: 64px;
  margin: 6px;
}

.skill-icon-xs.spaced {
  margin-right: 4px !important;
  margin: 8px;
}

.skill-icon-md {
  height: 64px;
  width: 64px;
  margin: 8px;
}

.skill-icon-md-alt {
  height: 64px;
  max-width: 64px;
}

.milestone-icon-lg {
  height: 64px;
  width: 64px;
  margin: 8px;
}

.font-size-2sm {
  font-size: 0.7rem !important;
}

.font-size-xs {
  font-size: 0.66rem !important;
}

.mining-ore-img {
  height: 64px;
  width: 64px;
  margin: 8px;
}

.combat-food {
  height: 32px;
  width: 32px;
  margin-right: 4px;
  margin-left: 4px;
}

.item-view-img {
  height: 128px;
  width: 128px;
  margin: 16px;
}

.notification-img {
  height: 32px;
  width: 32px;
  margin-right: 4px;
}

.logo-sidebar {
  height: 60px;
  width: auto;
}

#farming-glower,
#farming-glower-1,
#farming-glower-2,
.farming-glower {
  border: 1px solid transparent;
  -webkit-transition: border 0.1s linear, box-shadow 0.1s linear;
  -moz-transition: border 0.1s linear, box-shadow 0.1s linear;
  transition: border 0.1s linear, box-shadow 0.1s linear;
}

#farming-glower.active,
#farming-glower-1.active,
#farming-glower-2.active,
.farming-glower.active {
  border-color: green;
  -webkit-box-shadow: 0 0 5px green;
  -moz-box-shadow: 0 0 5px green;
  box-shadow: 0 0 5px green;
}

.green-glow {
  border: 1px solid transparent;
  -webkit-transition: border 0.1s linear, box-shadow 0.1s linear;
  -moz-transition: border 0.1s linear, box-shadow 0.1s linear;
  transition: border 0.1s linear, box-shadow 0.1s linear;
}

.green-glow.active {
  border-color: #00ff22;
  -webkit-box-shadow: 0 0 10px #00ff22;
  -moz-box-shadow: 0 0 10px #00ff22;
  box-shadow: 0 0 10px #00ff22;
}

.alert-mastery {
  color: #246540;
  background-color: rgba(255, 255, 255, 1);
  border: 1px solid #cbeeda;
  box-shadow: 0 0.125rem #c7edd7;
}

.m-header-icon {
  background-color: #fefefe;
  padding-top: 4px;
  padding-left: 4px;
  height: 40px;
  width: 40px;
  margin: 0.66em;
  border-radius: 8px;
}

body.darkMode.superDark .m-header-icon {
  background-color: #2e2e2e;
}

@media print {
  #page-container,
  #main-container {
    padding: 0 !important;
  }

  #page-overlay,
  #m-page-loader,
  #m-page-offline-mode,
  #m-page-loader-test,
  #page-header,
  #page-footer,
  #sidebar,
  #side-overlay,
  .block-options {
    display: none !important;
  }
}

.swal-infront {
  z-index: 999998 !important;
}

.modal-infront {
  z-index: 999999 !important;
}

body.darkMode .block.block-transparent {
  background-color: transparent !important;
  box-shadow: none !important;
}

.form-control.form-control-alt.game-load {
  border: none;
  background-color: #2c3444 !important;
  color: #fff !important;
  transition: none;
}

#m-page-loader {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #232a35;
  z-index: 999997;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}

#m-page-offline-mode {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #232a35;
  z-index: 999997;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}

#m-page-loader.show {
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

#m-page-loader::after {
  position: absolute;
  top: 50%;
  left: 50%;
  /* Base-64 encoded assets/media/main/logo_no_text.svg */
  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NjUuMzkgNTEzLjE1Ij48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2JkMTgxODt9LmNscy0ye2ZpbGw6I2U1MjMyMDt9LmNscy0ze2ZpbGw6I2RjOWYxMjt9LmNscy00e2ZpbGw6I2Y0ZGY2MTt9PC9zdHlsZT48L2RlZnM+PGcgaWQ9IkxheWVyXzIiIGRhdGEtbmFtZT0iTGF5ZXIgMiI+PGcgaWQ9IkxheWVyXzEtMiIgZGF0YS1uYW1lPSJMYXllciAxIj48cG9seWdvbiBjbGFzcz0iY2xzLTEiIHBvaW50cz0iMjAuMjEgMTE1Ljk1IDMyLjAyIDEyNC4xOSAzMi4wMiAxMzUuMiAyMC4yMSAxMzkuMjUgMjAuMjEgMTE1Ljk1Ii8+PHBvbHlnb24gY2xhc3M9ImNscy0yIiBwb2ludHM9IjM0OS40NyA0NzMuNSAzMTkuMzcgNDUxLjk2IDMxOS4zNyAxMjAuMjEgMzQ5LjQ3IDEwNi40MSAzNDkuNDcgNDczLjUiLz48cG9seWdvbiBjbGFzcz0iY2xzLTEiIHBvaW50cz0iNjQuODggMTAxLjA0IDc2LjY5IDEwOS40NyA3Ni42OSAxMTkuODcgNjQuODggMTIzLjkyIDY0Ljg4IDEwMS4wNCIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIzNDkuNDcgODQuMzMgMzE5LjM3IDEwNS41NiAzMTkuMzcgMTIwLjIxIDM0OS40NyAxMjAuMDUgMzQ5LjQ3IDg0LjMzIi8+PHBvbHlnb24gY2xhc3M9ImNscy0yIiBwb2ludHM9IjQ0NS4xOCAxMTUuOTUgNDMzLjM4IDEyMy45MiA0MzMuMzggMTM1LjIgNDQ1LjE4IDEzOS4yNSA0NDUuMTggMTE1Ljk1Ii8+PHBvbHlnb24gY2xhc3M9ImNscy0yIiBwb2ludHM9IjQwMC41MSAxMDEuMDQgMzg4LjcgMTA5LjE5IDM4OC43IDExOS44NyA0MDAuNTEgMTIzLjkyIDQwMC41MSAxMDEuMDQiLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iMzQ5LjQ3IDE0OC45NyAzMTkuNDQgMTQ4Ljk3IDIzMi43MyAyMDkuMjMgMjMyLjczIDIzMy4yNyAzNDkuNDcgMTQ4Ljk3Ii8+PHBvbHlnb24gY2xhc3M9ImNscy0xIiBwb2ludHM9IjE0Ni4wMiAxNDguOTcgMTQ1Ljg3IDE0OC45OCAxNDUuODcgMTIwLjIxIDE0NS44NyAxMDYuMTcgMTE1LjkxIDg0LjMzIDExNS45MSAxMDYuNDEgMTE1LjkxIDEyMC4wNSAxMTUuOTEgNDczLjUgMTQ1Ljg3IDQ1Mi4wMyAxNDUuODcgMTcxLjI3IDIzMi43MyAyMzMuMjcgMjMyLjczIDIwOS4yMyAxNDYuMDIgMTQ4Ljk3Ii8+PHBvbHlnb24gY2xhc3M9ImNscy0yIiBwb2ludHM9IjIzMi43MyAyMzMuMjcgMTE1LjkyIDE0OS44OSAxMTUuOTIgMTIwLjA1IDExNS45MiAxMjAuMDUgMTE1LjkyIDg0LjMzIDg1LjgyIDkzLjY0IDg1LjgyIDExNi43NCA2NC44OCAxMjMuOTIgNjQuODggMTAxLjA0IDQxLjM3IDEwOC45IDQxLjM3IDEzMS45OSAyMC4yMSAxMzkuMjUgMjAuMjEgMTE1Ljk1IDAgMTIyLjY2IDAgMTQ2LjE5IDAgMTQ2LjE5IDAgMjA1LjE4IDI2LjU0IDIyNC4xOSAyNi41NCA0NTguNjkgMTE1LjkyIDQ3My41IDExNS45MiAzMTAuOTUgMjMyLjczIDM5OS40MSAyMzIuNzMgMjMzLjI3Ii8+PHBvbHlnb24gY2xhc3M9ImNscy0xIiBwb2ludHM9IjQ0NS4xOCAxMTUuOTUgNDQ1LjE4IDEzOS4yNSA0MjQuMDIgMTMxLjk5IDQyNC4wMiAxMDguODkgNDAwLjUxIDEwMS4wNCA0MDAuNTEgMTIzLjkyIDM3OS41NyAxMTYuNzQgMzc5LjU3IDkzLjY0IDM0OS40NyA4NC4zMyAzNDkuNDcgMTA2LjQxIDM0OS40NyAxMjAuMDUgMzQ5LjQ3IDE0OC45NyAyMzIuNzMgMjMzLjI3IDIzMi43MyAzOTkuNDEgMzQ5LjQ3IDMwOS41NCAzNDkuNDcgNDczLjUgNDM4LjE3IDQ2Mi44MiA0MzguMTcgMjI0LjE5IDQ2NS4zOSAyMDUuMTYgNDY1LjM5IDE0OC45NyA0NjUuMzkgMTQ2LjE5IDQ2NS4zOSAxMjIuNjYgNDQ1LjE4IDExNS45NSIvPjxwYXRoIGNsYXNzPSJjbHMtMyIgZD0iTTIzMi43LDQxNi4yN2gwdjk2Ljg5bC44LTEuMSwzMS4xMi00NC4zN2MtNC41LTguMDktNi44NC00MC44OS04LjA2LTcwLjcyWiIvPjxwYXRoIGNsYXNzPSJjbHMtMyIgZD0iTTI0MS4xOCwyMy44M2w1LjI2LDYwLDQwLjgyLDAsMTQuMDYsMTQuNjQtMTYuNDQsMTUuOTMtMTAuNjktMTEuMDZoLTguNzFjLTQuMTQsNC4zNC03LjMsOS44LTcuNTMsMTYuNDZ2NTQuMTFMMjMyLjcsMTkzLjg0aDBWMGExMi43MywxMi43MywwLDAsMSwxMS42NSwxMi42NloiLz48cGF0aCBjbGFzcz0iY2xzLTQiIGQ9Ik0yMzIuNjgsNDE2LjI3aDB2OTYuODlsLS44MS0xLjEtMzEuMTEtNDQuMzdjNC40OS04LjA5LDYuODQtNDAuODksOC03MC43MloiLz48cGF0aCBjbGFzcz0iY2xzLTQiIGQ9Ik0yMjQsMjMuODNsLTUuMDcsNjAtNDAuODIsMEwxNjQuMDcsOTguNDhsMTYuNDQsMTUuOTMsMTAuNjktMTEuMDZoOC43MWM0LjE0LDQuMzQsNy4zLDkuOCw3LjUzLDE2LjQ2djU0LjExbDI1LjI1LDE5LjkyaDBWMGExMi43MywxMi43MywwLDAsMC0xMS42NCwxMi42NloiLz48L2c+PC9nPjwvc3ZnPg==');
  background-repeat: no-repeat;
  background-size: 64px 64px;
  display: block;
  margin-top: -32px;
  margin-left: -32px;
  width: 64px;
  height: 64px;
  content: '';
  z-index: 999999;
}

#m-page-offline-mode.show {
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

#m-page-offline-mode::after {
  position: absolute;
  top: 50%;
  left: 50%;
  background-image: url(../media/main/logo_no_text.svg);
  background-repeat: no-repeat;
  background-size: 64px 64px;
  display: block;
  margin-top: -32px;
  margin-left: -32px;
  width: 64px;
  height: 64px;
  content: '';
  z-index: 999999;
}

#m-page-loader-test {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #232a35;
  z-index: 99998;
}

.m-page-loader-spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -55px;
  margin-left: -55px;
  width: 110px !important;
  height: 110px !important;
  z-index: 9999999;
}

.m-page-loader-status-text {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: 70px;
  margin-left: -110px;
  width: 220px !important;
  height: auto !important;
  z-index: 9999999;
}

.block.bg-roadmap-released,
body.darkMode .block.bg-roadmap-released {
  background-color: #22633d !important;
}

.bg-character-select,
body.darkMode .block.bg-character-select {
  background: rgba(44, 52, 63, 0.75) !important;
}

.text-character-select {
  color: whitesmoke !important;
}

@-webkit-keyframes m-page-loader {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0;
  }
}

@keyframes m-page-loader {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0;
  }
}

@-webkit-keyframes m-page-offline-mode {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0;
  }
}

@keyframes m-page-offline-mode {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0;
  }
}

.nav-compact {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.text-complete {
  color: #ff9f14;
}

body.darkMode.superDark .progress-bar.bg-primary,
.bg-primary-darker {
  background-color: #3a5899 !important;
}

#map {
  height: 800px;
  background-color: #000000;
}

.tooltip-inner {
  border-radius: 8px !important;
  background-color: rgba(0, 0, 0, 1) !important;
}

.notify-event {
  pointer-events: none;
}

.pointer-enabled {
  cursor: pointer;
}

.swal-height {
  max-height: 80vh;
}

.swal2-content {
  box-sizing: border-box;
  max-height: 100% !important;
  overflow-y: auto !important;
}

#google {
  position: absolute;
  right: 0px;
  width: 160px;
  height: 160px;
  top: 120px;
  border-left: 1px solid black;
}

.combat-minibar button.fixed-size {
  width: 42px;
  height: 42px;
}

.combat-minibar {
  position: fixed;
  right: 57px;
  right: max(calc(env(safe-area-inset-right, 0px) + 57px), 57px) !important;
  bottom: 5px;
  z-index: 999;
  margin-bottom: max(env(safe-area-inset-bottom, 0px), 0px);
}

@media (min-width: 370px) {
  .combat-minibar-player {
    margin: 0 0.2rem;
  }
}

.sidemenu-quick-equip {
  padding: 8px;
  position: fixed;
  right: 47px;
  right: max(calc(env(safe-area-inset-right, 0px) + 47px), 5px) !important;
  bottom: 120px;
  z-index: 999;
  max-width: 180px;
  margin-bottom: max(env(safe-area-inset-bottom, 0px), 0px);
}

.sidemenu {
  position: fixed;
  right: max(calc(env(safe-area-inset-right, 0px) + 5px), 5px) !important;
  bottom: 5px;
  z-index: 999;
  max-width: 42px;
  margin-bottom: max(env(safe-area-inset-bottom, 0px), 0px);
}

.modal {
  overflow-y: auto;
}

#bank-item-box {
  width: 30%;
  height: 100vh;
}

.chosen {
  pointer-events: inherit;
}

audio {
  display: none;
}

#page-overlay {
  opacity: 1 !important;
}

.block-title {
  font-size: 0.775rem !important;
  text-transform: none !important;
}

#modal-privacy,
#modal-a-6,
#modal-expanded-edition,
#modal-expanded-edition-international,
#modal-plushie-octavius,
#modal-expansions,
#modal-mod-contest-2024 {
  z-index: 9999999 !important;
}

#modal-toth,
#modal-aod,
#modal-ita {
  z-index: 10000000 !important;
}

#modal-game-error {
  z-index: 99999999 !important;
}

.progress {
  background-color: #d6dbe0 !important;
}

.irs--round .irs-bar,
.irs--round .irs-line {
  height: 8px !important;
}

body.darkMode .btn-light {
  background-color: #e9ecef !important;
}

.btn-light {
  background-color: #d6dbe0 !important;
}

body.darkMode .text-complete {
  color: #f3b760 !important;
}

body.darkMode .block,
body.darkMode .block-header,
body.darkMode .block-header-default,
body.darkMode .modal-content,
body.darkMode .bg-white,
body.darkMode .bg-light,
body.darkMode .dropdown-menu,
body.darkMode .simplebar-content-wrapper,
body.darkMode .list-group-item {
  background: #232a35 !important;
}

body.darkMode .list-group-item.active {
  background-color: #2d3542 !important;
}

body.darkMode.superDark .block,
body.darkMode.superDark .block-header,
body.darkMode.superDark .block-header-default,
body.darkMode.superDark .modal-content,
body.darkMode.superDark .bg-white,
body.darkMode.superDark .bg-light,
body.darkMode.superDark .bg-dark,
body.darkMode.superDark .bg-primary,
body.darkMode.superDark .dropdown-menu,
body.darkMode.superDark .simplebar-content-wrapper {
  background: black !important;
}

body.darkMode .block {
  box-shadow: 0 1px 2px rgb(33 34 35 / 50%), 0 1px 2px rgb(26 26 27 / 50%) !important;
}

body.darkMode a.block:active,
body.darkMode a.block:hover {
  box-shadow: 0 0.375rem 0.55rem #373e49 !important;
}

body.darkMode .ribbon-box,
body.darkMode .progress,
body.darkMode .btn-light,
body.darkMode .form-control,
body.darkMode .nav-main-link:hover,
body.darkMode .nav-link:hover,
body.darkMode .nav-link:focus,
body.darkMode .dropdown-item:hover,
body.darkMode .dropdown-item:focus,
body.darkMode .btn-dual,
body.darkMode .bg-light-gray {
  background: #2d3542 !important;
}

body.darkMode.superDark .ribbon-box,
body.darkMode.superDark .progress,
body.darkMode.superDark .btn-light,
body.darkMode.superDark .form-control,
body.darkMode.superDark .nav-main-link:hover,
body.darkMode.superDark .nav-link:hover,
body.darkMode.superDark .nav-link:focus,
body.darkMode.superDark .dropdown-item:hover,
body.darkMode.superDark .dropdown-item:focus,
body.darkMode.superDark .btn-dual,
body.darkMode.superDark .bg-light-gray {
  background: #1e1e1e !important;
}

body.darkMode .nav-tabs-block .nav-link.active,
body.darkMode .nav-tabs-block .nav-item.show .nav-link {
  background-color: #2d3542 !important;
}

body.darkMode.superDark .nav-tabs-block .nav-link.active,
body.darkMode.superDark .nav-tabs-block .nav-item.show .nav-link {
  background-color: #1e1e1e !important;
}

body.darkMode .nav-tabs-block .nav-link,
body.darkMode .nav-tabs-block {
  background-color: #373e49 !important;
}

body.darkMode.superDark .nav-tabs-block .nav-link,
body.darkMode.superDark .nav-tabs-block {
  background-color: #1b1b1b !important;
}

body.darkMode .nav-items a.potion:hover,
body.darkMode .nav-items a.potion:focus {
  background: #373e49 !important;
}

body.darkMode.superDark .nav-items a.potion:hover,
body.darkMode.superDark .nav-items a.potion:focus {
  background: black !important;
}

body.darkMode .nav-items:hover,
body.darkMode .nav-items:focus {
  background: #2c343f !important;
}

body.darkMode.superDark .nav-items:hover,
body.darkMode.superDark .nav-items:focus {
  background: black !important;
}

body.darkMode .progress.bg-danger {
  background: #d26a5c !important;
}

body.darkMode .border {
  border: 1px solid #24282f !important;
}

body.darkMode .border-success {
  border-color: #46c37b !important;
}

body.darkMode .border-equip {
  border-color: #ebebeb !important;
}

body.darkMode .ribbon-light.ribbon-bookmark.ribbon-left .ribbon-box::before {
  border-color: #373e49;
  border-right-color: transparent;
}

body.darkMode .ribbon-box,
body.darkMode .block-title,
body.darkMode .block,
body.darkMode .text-dark,
body.darkMode .text-muted,
body.darkMode .table,
body.darkMode .modal,
body.darkMode .form-group,
body.darkMode .nav-main-link,
body.darkMode .nav-link,
body.darkMode .swal2-title,
body.darkMode .swal2-content,
body.darkMode .swal2-html-container,
body.darkMode h2,
body.darkMode h4,
body.darkMode h5,
body.darkMode .h5,
body.darkMode .form-control,
body.darkMode .dropdown-item,
body.darkMode .text-combat-smoke {
  color: whitesmoke !important;
}

body.darkMode .bg-primary-darker {
  background-color: #2c343f !important;
}

body.darkMode.superDark .bg-primary-darker {
  background-color: black !important;
}

body.darkMode .swal2-popup {
  background: #2c343f !important;
}

body.darkMode.superDark .swal2-popup {
  background: black !important;
}

body.darkMode .bg-shop.rounded,
body.darkMode .bg-warning.rounded {
  color: black !important;
}

body.darkMode .border-rounded-equip.selected {
  background-color: #575757 !important;
}

body.darkMode.superDark .border-rounded-equip.selected {
  background-color: black !important;
}

body.darkMode .bg-combat-dark {
  background-color: #232a35 !important;
}

body.darkMode.superDark .bg-combat-dark {
  background-color: black !important;
}

body.darkMode .border-combat-outline {
  border-color: #7e8999 !important;
  border-width: 2px !important;
  border-style: solid !important;
}

body.darkMode .progress.combat {
  background: #3e4652 !important;
}

body.darkMode .combat-equip-img,
body.darkMode .combat-menu-img {
  background-color: #3e4856 !important;
}

body.darkMode.superDark .combat-equip-img {
  background-color: #242424 !important;
}

body.darkMode.superDark .content-header {
  background-color: black !important;
}

body.darkMode .bg-combat-inner-dark {
  background-color: #343c4a !important;
}

body.darkMode.superDark .bg-combat-inner-dark {
  background-color: black !important;
  border: 1px solid #5b5b5b !important;
}

body.darkMode .bg-combat-menu-selected,
body.darkMode .nav-link.bg-combat-menu-selected {
  background-color: #277548 !important;
}

.bg-agility-search-result,
body.darkMode .bg-agility-search-result,
body.darkMode.superDark .bg-agility-search-result {
  background-color: #493a1f !important;
}

body.darkMode .tippy-box {
  background-color: #222;
}

body.darkMode .tippy-arrow {
  color: #222;
}

body.darkMode h5.text-danger {
  color: #d26a5c !important;
}

body.darkMode .border.border-warning {
  border-color: #f3b760 !important;
}

body.darkMode .border.border-info {
  border-color: #5cace5 !important;
}

body.darkMode .border.border-4x {
  border-width: 4px !important;
  padding: 12px !important;
}

body.darkMode h2.text-success {
  color: #30c78d !important;
}

body.darkMode h2.text-danger {
  color: #e56767 !important;
}

body.darkMode h5.text-warning {
  color: #e5ae67 !important;
}

body.darkMode h5.text-success {
  color: #30c78d !important;
}

.nav-link.bg-bank-tab-search,
body.darkMode .nav-link.bg-bank-tab-search,
body.darkMode.superDark .nav-link.bg-bank-tab-search {
  background-color: #a97934 !important;
}

.bg-combat-menu-selected,
.nav-link.bg-combat-menu-selected {
  background-color: #46c37b !important;
}

.bg-active-agility-obstacle {
  background-color: #b7ffd5 !important;
}
body.darkMode .bg-active-agility-obstacle {
  background-color: #277548 !important;
}

body.darkMode.superDark .modal.show .modal-dialog .modal-content {
  border: solid 1px #5b5b5b !important;
}

body.darkMode.superDark .swal2-popup {
  border: solid 1px whitesmoke !important;
}

body.darkMode.superDark .hero-static {
  border-right: solid 1px #5b5b5b !important;
}

body.darkMode.superDark,
body.darkMode.superDark .bg-image {
  background: rgb(0, 0, 0) !important;
  background-image: none !important;
}

body.darkMode.superDark .btn.btn-alt-dark {
  color: whitesmoke !important;
  background-color: #000000 !important;
  border-color: #ced3d8 !important;
}

body.darkMode.superDark .btn.btn-alt-dark:hover {
  color: whitesmoke !important;
  background-color: #404040 !important;
  border-color: #b9c0c6 !important;
}

body.darkMode.superDark .btn.btn-alt-primary {
  color: #769cf2;
  background-color: #000000;
  border-color: #d9e2f6;
}

body.darkMode.superDark .btn.btn-alt-primary:hover {
  color: #769cf2;
  background-color: #404040;
  border-color: #d9e2f6;
}

body.darkMode.superDark .btn.btn-alt-info {
  color: #47a2e2;
  background-color: #000000;
  border-color: #d9e2f6;
}

body.darkMode.superDark .btn.btn-alt-info:hover {
  color: #47a2e2;
  background-color: #404040;
  border-color: #d9e2f6;
}

body.darkMode.superDark .btn.btn-gamemode-standard {
  color: #fff;
  background-color: #000000;
  border-color: #737373;
}

body.darkMode.superDark .btn-gamemode-hardcore {
  color: #fff;
  background-color: #292015;
  border-color: #584125;
}

body.darkMode.superDark .btn-gamemode-adventure {
  color: #fff;
  background-color: #240e0e;
  border-color: #3e1717;
}

body.darkMode.superDark .content-header {
  border-bottom: solid 1px #5b5b5b !important;
  border-right: solid 1px #5b5b5b !important;
}

@keyframes progressBar {
  0% {
    width: 0%;
  }

  100% {
    width: 100%;
  }
}

@-webkit-keyframes progressBar {
  0% {
    width: 0%;
  }

  100% {
    width: 100%;
  }
}

@-moz-keyframes progressBar {
  0% {
    width: 0%;
  }

  100% {
    width: 100%;
  }
}

.progress-fast {
  transform-origin: top left;
}

.d-none-alt {
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
}

.justify-vertical-center {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.justify-content-space-evenly {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  flex-direction: column;
}

.justify-vertical-left {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
}

.justify-vertical-right {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  flex-direction: column;
}

.justify-vertical-stretch {
  display: flex;
  align-items: stretch;
  justify-content: center;
  flex-direction: column;
}

.justify-horizontal-center {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
}

.justify-horizontal-left {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}

.justify-horizontal-right {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
}

.justify-horizontal-evenly {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: center;
}

.cm_container.display {
  z-index: 99999 !important;
}

body.darkMode.text-success {
  color: #30c78d !important;
}

body.darkMode.text-warning {
  color: #e5ae67 !important;
}

.text-toxin,
body.darkMode .text-toxin {
  color: #bc5ca5 !important;
}

.text-voidburst,
body.darkMode .text-voidburst {
  color: #0083b7 !important;
}

.text-blight,
body.darkMode .text-blight {
  color: #9760a7 !important;
}

.text-ablaze,
body.darkMode .text-ablaze {
  color: #f0c419 !important;
}

body.darkMode.btn.btn-alt-success,
h5.text-alt-success,
body.darkMode h5.text-alt-success {
  color: #176044 !important;
}

body.darkMode.btn.btn-alt-primary {
  color: #25499c !important;
}

body.darkMode.btn.btn-alt-dark,
h5.text-alt-dark,
body.darkMode h5.text-alt-dark {
  color: #343a40 !important;
}

body.darkMode h5.text-info {
  color: #5cace5 !important;
}

body.darkMode input.form-control-alt {
  background-color: #edf0f2 !important;
  color: #343a40 !important;

  z-index: 999997 !important;
}

input.form-control:disabled,
body.darkMode input.form-control:disabled {
  background-color: #ababab !important;
}

.hero-static {
  height: 100%;
  overflow-y: auto;
}

.hero-alt {
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}

body.darkMode button.btn.btn-light.dropdown-toggle {
  color: whitesmoke !important;
}

.btn-gamemode-standard {
  color: #fff;
  background-color: #343a40;
  border-color: #343a40;
}

.btn-gamemode-hardcore {
  color: #fff;
  background-color: #584125;
  border-color: #584125;
}

.btn-gamemode-adventure {
  color: #fff;
  background-color: #3e1717;
  border-color: #3e1717;
}

.btn-gamemode-relic {
  color: #fff;
  background-color: #173e1f;
  border-color: #173e1f;
}

.btn-gamemode-chaos {
  color: #fff;
  background-color: #333210;
  border-color: #333210;
}

.btn-gamemode-clicker {
  color: #fff;
  background-color: #745331;
  border-color: #745331;
}

.bg-purple {
  background-color: #84359e !important;
}

.text-purple {
  color: #84359e !important;
}

.opacity-100 {
  opacity: 1 !important;
}

.opacity-40 {
  opacity: 0.4 !important;
}

.bg-gamemode {
  z-index: 10;
  width: 270px;
  height: 100%;
  position: absolute;
  top: 0;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: 0.15;
  pointer-events: none;
}

.bg-gamemode.align-left {
  left: 0;
}

.bg-gamemode.align-right {
  right: 0;
}

body.colourAdjustment.text-success,
body.darkMode.colourAdjustment.text-success {
  color: aqua !important;
  font-weight: normal;
}

body.colourAdjustment.text-danger:last,
body.darkMode.colourAdjustment.text-danger:last {
  color: orange !important;
  font-weight: bold !important;
}

.spinner-no-border {
  display: inline-block;
  vertical-align: text-bottom;
  -webkit-animation: spinner-border 10s linear infinite;
  animation: spinner-border 10s linear infinite;
}

.faded-image {
  filter: opacity(50%);
}

@keyframes damageSplash {
  0% {
    transform: translateY(0%);
    opacity: 1;
  }

  80% {
    transform: translateY(-160%);
    opacity: 0.5;
  }

  100% {
    transform: translateY(-200%);
    opacity: 0;
  }
}

@-webkit-keyframes damageSplash {
  0% {
    transform: translateY(0%);
    opacity: 1;
  }

  80% {
    transform: translateY(-160%);
    opacity: 0.7;
  }

  100% {
    transform: translateY(-200%);
    opacity: 0;
  }
}

@-moz-keyframes damageSplash {
  0% {
    transform: translateY(0%);
    opacity: 1;
  }

  80% {
    transform: translateY(-160%);
    opacity: 0.7;
  }

  100% {
    transform: translateY(-200%);
    opacity: 0;
  }
}

#modal-view-monster-info {
  z-index: 1050;
}

#modal-view-monster-list {
  z-index: 1048;
}

.splash-animation {
  animation: 1.2s linear 0s 1 normal damageSplash;
  position: absolute;
}

.splash-shadow {
  text-shadow: 0px 0px 2px black;
}

.text-poison {
  color: darkorchid !important;
}

.text-burn {
  color: darkorange !important;
}

.text-bleed {
  color: darkred !important;
}

.text-crit {
  color: #e56767 !important;
  font-weight: bold;
}

.text-deadlypoison {
  color: rgb(203, 122, 243) !important;
  font-weight: bold;
}

.text-voidburst {
  color: rgb(33, 0, 68) !important;
  font-weight: bold;
}

.resize-256 {
  height: 256px !important;
  width: 256px !important;
}

.resize-128 {
  height: 128px !important;
  width: 128px !important;
}

.resize-64 {
  height: 64px !important;
  width: 64px !important;
}

.resize-48 {
  height: 48px !important;
  width: 48px !important;
}

.resize-40 {
  height: 40px !important;
  width: 40px !important;
}

.resize-32 {
  height: 32px !important;
  width: 32px !important;
}

.resize-24 {
  height: 24px !important;
  width: 24px !important;
}

.height-64 {
  height: 64px !important;
}

.height-48 {
  height: 48px !important;
}

.height-32 {
  height: 32px !important;
}

.height-6 {
  height: 6px !important;
}

.border-item-invalid {
  border: 1px solid #d26a5c;
}

.text-splash-attack {
  font-weight: 700 !important;
  color: #b31d1d !important;
}

body.darkMode .text-danger {
  color: #e56767 !important;
}

.bg-slowed {
  background-color: #88d6e2 !important;
}

body.darkMode .table-hover tbody tr:hover {
  color: whitesmoke !important;
  background-color: #2b323b !important;
}

body.darkMode .table-active {
  background-color: #2b323b !important;
}

.is-in-shop,
.info-icon-overlay {
  position: absolute;
  top: -6px;
  left: -6px;
}

.has-upgrade,
.has-downgrade,
.has-damage-type {
  position: absolute;
  top: 1px;
  left: 1px;
}

.familiar-skill {
  position: absolute;
  top: -12px;
  left: -12px;
}

.minibar-equipped {
  position: absolute;
  top: 0px;
  left: 0px;
}

body.darkMode .text-warning {
  color: #e5ae67 !important;
}

.nav-main-item {
  cursor: pointer !important;
}

body.darkMode .border-primary {
  border-color: #5179d6 !important;
}

.bg-tutorial-claimed {
  background-color: #277548 !important;
}

.bg-tutorialIsland {
  background-color: #f0ab1f !important;
}

.border-tutorialIsland {
  border-color: #f0ab1f !important;
}

.border-completionLog {
  border-color: #fcbd24;
}

.bg-completionLog {
  background-color: #fcbd24;
}

@media (min-width: 1250px) {
  .col-xl-20-perc {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
}

:root {
  --synergy-border0: forestgreen;
  --synergy-border1: darkturquoise;
  --synergy-border2: #0099cc;
  --synergy-border3: darkorchid;
  --synergy-border-bg: #fff;
}

:root body.darkMode {
  --synergy-border0: lawngreen;
  --synergy-border1: turquoise;
  --synergy-border2: deepskyblue;
  --synergy-border3: mediumorchid;
  --synergy-border-bg: #3e4856;
}

.border.border-combat-outline.border-synergy-0 {
  border-color: var(--synergy-border0) !important;
}

.border.border-combat-outline.border-synergy-1 {
  border-color: var(--synergy-border1) !important;
}

.border.border-combat-outline.border-synergy-2 {
  border-color: var(--synergy-border2) !important;
}

.border.border-combat-outline.border-synergy-3 {
  border-color: var(--synergy-border3) !important;
}

.border.border-combat-outline.border-synergy-0.border-synergy-1 {
  border: solid 2px transparent !important;
  background-image: linear-gradient(var(--synergy-border-bg), var(--synergy-border-bg)),
    radial-gradient(circle at top left, var(--synergy-border0), var(--synergy-border1));
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

.border.border-combat-outline.border-synergy-0.border-synergy-2 {
  border: solid 2px transparent !important;
  background-image: linear-gradient(var(--synergy-border-bg), var(--synergy-border-bg)),
    radial-gradient(circle at top left, var(--synergy-border0), var(--synergy-border2));
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

.border.border-combat-outline.border-synergy-0.border-synergy-3 {
  border: solid 2px transparent !important;
  background-image: linear-gradient(var(--synergy-border-bg), var(--synergy-border-bg)),
    radial-gradient(circle at top left, var(--synergy-border0), var(--synergy-border3));
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

.border.border-combat-outline.border-synergy-1.border-synergy-2 {
  border: solid 2px transparent !important;
  background-image: linear-gradient(var(--synergy-border-bg), var(--synergy-border-bg)),
    radial-gradient(circle at top left, var(--synergy-border1), var(--synergy-border2));
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

.border.border-combat-outline.border-synergy-1.border-synergy-3 {
  border: solid 2px transparent !important;
  background-image: linear-gradient(var(--synergy-border-bg), var(--synergy-border-bg)),
    radial-gradient(circle at top left, var(--synergy-border1), var(--synergy-border3));
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

.border.border-combat-outline.border-synergy-2.border-synergy-3 {
  border: solid 2px transparent !important;
  background-image: linear-gradient(var(--synergy-border-bg), var(--synergy-border-bg)),
    radial-gradient(circle at top left, var(--synergy-border2), var(--synergy-border3));
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

table.stat-table tbody tr th {
  white-space: nowrap;
}

@media (max-width: 600px) {
  table.stat-table tbody tr th {
    white-space: normal;
  }

  table.stat-table colgroup col:nth-child(1) {
    width: unset;
  }
}

.glow-success {
  filter: drop-shadow(0 0 5px #00ff22);
}

.dropdown-menu.show {
  border: solid 1px #fff !important;
}

@keyframes lb-explode {
  0% {
    transform: scale(0.2, 0.2);
  }

  100% {
    transform: scale(1, 1);
  }
}

@keyframes lb-pulse {
  0% {
    transform: scale(0.95, 0.95);
  }

  50% {
    transform: scale(1, 1);
  }

  100% {
    transform: scale(0.95, 0.95);
  }
}

@keyframes lb-changeColour {
  0% {
    background: #ffe359;
  }

  50% {
    background: #ffd91e;
  }

  100% {
    background: #ffe359;
  }
}

@keyframes lb-changeColour2 {
  0% {
    background: #ffc914;
  }

  50% {
    background: #ffce30;
  }

  100% {
    background: #ffc914;
  }
}

.lootBoxAnimationCont {
  width: 13em;
  height: 13em;
  position: relative;
}

.lootboxOpenCont {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  animation: 2s ease-in 3s lb-explode forwards;
  transform: scale(0, 0);
}

.lootboxOpenCont div:first-of-type {
  width: 100%;
  height: 100%;
  filter: drop-shadow(0px 0px 3px gold);
}

.lootboxRay0 {
  width: 100%;
  height: 100%;
  position: absolute;
  border-radius: 50%;
  animation: 6s linear 0s infinite lb-pulse, 6s linear 0s infinite lb-changeColour;
  mask: repeating-conic-gradient(transparent 0% 2.5%, #000 2.5% 5%);
  -webkit-mask: repeating-conic-gradient(transparent 0% 2.5%, #000 2.5% 5%);
}

.lootboxRay1 {
  width: 100%;
  height: 100%;
  position: absolute;
  border-radius: 50%;
  mask: repeating-conic-gradient(#000 -0.1% 2.6%, transparent 2.6% 4.9%);
  -webkit-mask: repeating-conic-gradient(#000 -0.1% 2.6%, transparent 2.6% 4.9%);
  animation: 6s linear -3s infinite lb-pulse, 6s linear 0s infinite lb-changeColour2;
}

.lootboxImg {
  width: 50%;
  height: 50%;
  top: 25%;
  left: 25%;
  position: absolute;
  filter: drop-shadow(0px 0px 3px black);
}

.lootboxOpenCont span {
  position: absolute;
  filter: drop-shadow(0px 0px 1px black);
  left: 0;
  width: 100%;
}

.lootboxTextTop {
  top: 12%;
}

.lootboxTextBot {
  bottom: 12%;
}

.lootboxCommon {
  color: #b7e1cd;
}

.lootboxUncommon {
  color: #b6d7a8;
}

.lootboxRare {
  color: #9fc5e8;
}

.lootboxUltraRare {
  color: #dd7e6b;
}

.lootboxBuggedRare {
  color: #ffe599;
}

.crateContainer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  animation: crate-swing 3s linear 0s forwards;
  transform-origin: 50% 150%;
}

.crateCorner {
  left: 25%;
  top: 25%;
  width: 50%;
  height: 50%;
  position: absolute;
  mask-size: 100%;
  -webkit-mask-size: 100%;
}

.crateCorner0 {
  mask-image: url('crate_corner_1.png');
  -webkit-mask-image: url('crate_corner_1.png');
  animation: crate-corner-top-left 2s ease-in 3s forwards;
}

.crateCorner1 {
  mask-image: url('crate_corner_2.png');
  -webkit-mask-image: url('crate_corner_2.png');
  animation: crate-corner-top-right 2s ease-in 3s forwards;
}

.crateCorner2 {
  mask-image: url('crate_corner_3.png');
  -webkit-mask-image: url('crate_corner_3.png');
  animation: crate-corner-bot-right 2s ease-in 3s forwards;
}

.crateCorner3 {
  mask-image: url('crate_corner_4.png');
  -webkit-mask-image: url('crate_corner_4.png');
  animation: crate-corner-bot-left 2s ease-in 3s forwards;
}

@keyframes crate-swing {
  0% {
    transform: rotateZ(0deg);
    filter: drop-shadow(0px 0px 0px gold);
  }

  16.7% {
    transform: rotateZ(-15deg);
    filter: drop-shadow(0px 0px 0px gold);
  }

  17.7% {
    transform: rotateZ(-14.1deg);
    filter: drop-shadow(2px 2px 2px gold);
  }

  50% {
    transform: rotateZ(15deg);
    filter: drop-shadow(2px 2px 2px gold);
  }

  50.1% {
    transform: rotateZ(15deg);
    filter: drop-shadow(2px 2px 3px gold);
  }

  83.3% {
    transform: rotateZ(-15deg);
    filter: drop-shadow(2px 2px 3px gold);
  }

  83.4% {
    transform: rotateZ(-15deg);
    filter: drop-shadow(2px 2px 4px gold);
  }

  100% {
    transform: rotateZ(0deg);
    filter: drop-shadow(2px 2px 4px gold);
  }
}

@keyframes crate-corner-top-left {
  0% {
    transform: translate(0, 0);
    filter: opacity(100%);
  }

  100% {
    transform: translate(-120%, -120%);
    filter: opacity(0%);
  }
}

@keyframes crate-corner-top-right {
  0% {
    transform: translate(0, 0);
    filter: opacity(100%);
  }

  100% {
    transform: translate(120%, -120%);
    filter: opacity(0%);
  }
}

@keyframes crate-corner-bot-right {
  0% {
    transform: translate(0, 0);
    filter: opacity(100%);
  }

  100% {
    transform: translate(120%, 120%);
    filter: opacity(0%);
  }
}

@keyframes crate-corner-bot-left {
  0% {
    transform: translate(0, 0);
    filter: opacity(100%);
  }

  100% {
    transform: translate(-120%, 120%);
    filter: opacity(0%);
  }
}

.w-80 {
  width: 80% !important;
}

.slayer-task-img-container {
  position: relative;
  width: 96px;
  height: 96px;
}

.slayer-task {
  width: 96px;
  height: auto;
  max-height: 96px;
}

.bg-dark-bank-info {
  background-color: #e9e9e9 !important;
}

body.darkMode .bg-dark-bank-info {
  background-color: #343a40 !important;
}

body.darkMode.superDark .bg-dark-bank-info,
body.darkMode.superDark .list-group-item {
  background-color: #000000 !important;
}

.bg-dark-bank-block-header {
  background-color: #d5d5d5 !important;
}

body.darkMode .bg-dark-bank-block-header {
  background-color: #434d5b !important;
}

/* #region Mod Manager (mm) */
.mm__tab-block {
  background-color: transparent !important;
}

.mm__tab-block .nav-tabs {
  background-color: transparent !important;
}

body.darkMode .mm__tab-block .nav-main-item:hover .nav-main-link:not(.disabled),
body.darkMode .mm__tab-block .nav-main-item.active .nav-main-link:not(.disabled) {
  background-color: #232a35 !important;
}

.mm__mobile-tabs {
  margin-left: -1rem;
  margin-right: -1rem;
}

.mm__mobile-tabs .nav-main-link {
  font-size: 1.2rem;
}

.mm__circular-progress {
  z-index: 9999;
}

.mm__circular-progress .spinner-border {
  height: 4rem;
  width: 4rem;
}

.mnh-100 {
  min-height: 100% !important;
}

.mnw-100 {
  min-width: 100% !important;
}

.mm__cover {
  bottom: 0;
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
}

.mm__report-icon {
  padding: 0.5rem;
  position: absolute;
  right: -0.5rem;
  top: -1rem;
}

.mm__scrollable-dropdown {
  max-height: 65vh;
  overflow-y: scroll;
}

.mm__popup {
  align-content: start;
  grid-template-rows: auto 1fr;
  padding-bottom: 0;
  overflow: hidden;
  width: 1200px;
  height: 768px;
}

.mm__16-by-9-img {
  overflow: hidden;
  padding-bottom: 56.25%;
  position: relative;
}

.mm__16-by-9-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}

.mm__border-black {
  border-color: black !important;
}

@media (max-width: 1249.98px) {
  .mm__popup {
    align-self: stretch !important;
    grid-column: 1/4 !important;
    grid-row: 1/4 !important;
    width: 100% !important;
    height: 100% !important;
  }
}

.mm__container {
  overflow: visible;
}

.mm__container > h3.block-title {
  margin-top: -10px;
}

.mm__my-mods-list-view {
  list-style: none;
  padding: 0;
}

body.darkMode input.form-control-alt.mm__search-box {
  background-color: #232a35 !important;
  border-color: #6e6f79;
  color: whitesmoke !important;
  transition: background-color ease-in 100ms;
  z-index: 999 !important;
}

body.darkMode input.form-control-alt.mm__search-box:focus {
  background-color: #edf0f2 !important;
  border-color: transparent;
  color: #343a40 !important;
}

.mm__list-view {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.mm__preview-img--180px {
  max-height: 180px;
  object-fit: cover;
  background-color: rgba(0, 0, 0, 0.3);
}

.mm__preview-img--80px {
  max-height: 80px;
  object-fit: cover;
  background-color: rgba(0, 0, 0, 0.3);
}

.mm__back-btn {
  left: -0.5rem;
  margin-top: -0.4rem;
}

.mm__check-for-updates-status {
  opacity: 0;
  transition: opacity 200ms;
}

.mm__check-for-updates-status.mm__active {
  opacity: 1 !important;
  transition: opacity 0ms;
}

.mm__mod-description {
  overflow-x: hidden;
}

.mm__mod-description h3,
.mm__mod-description h6 {
  color: #f5f5f5 !important;
}

.mm__mod-description img {
  width: 100%;
  height: auto;
  border-radius: 0.25rem;
}

.mm__mod-description pre {
  background-color: rgba(0, 0, 0, 0.25);
  border-radius: 0.25rem;
  color: #fff;
  padding: 0.25rem;
}

/* #region Browse */
.mm__grid-view.mm__loading .mm__grid-item,
.mm__list-view.mm__loading .mm__list-item {
  opacity: 0.5;
}

.mm__grid-item .block-title {
  max-width: 100%;
  text-transform: none;
}

.mm__browse-grid-view-item .block-title {
  text-transform: none;
}

.mm__version-ribbon {
  box-shadow: -1px 2px 1px rgba(0, 0, 0, 0.1);
  position: absolute;
  right: -0.25rem;
  top: 0.5rem;
}

.mm__version-ribbon::after {
  border: 2px solid #30936d;
  border-bottom-color: transparent !important;
  border-right-color: transparent !important;
  bottom: -4px;
  content: '';
  height: 0.25rem;
  position: absolute;
  right: 0;
  width: 0.25rem;
}

.mm__version-ribbon.bg-warning::after {
  border-color: #bd8a49;
}

.mm__quick-sub--check {
  display: none;
}

.mm__grid-item:hover .mm__quick-sub--check {
  display: none !important;
}

.mm__quick-sub--sub,
.mm__quick-sub--unsub,
.mm__quick-sub--progress {
  display: none;
  opacity: 0.5;
}

.mm__quick-sub--sub:hover,
.mm__quick-sub--unsub:hover {
  opacity: 1;
}

.mm__quick-sub.mm__quick-sub--subscribed .mm__quick-sub--check,
.mm__grid-item:hover .mm__quick-sub:not(.mm__quick-sub--subscribed) .mm__quick-sub--sub,
.mm__grid-item:hover .mm__quick-sub.mm__quick-sub--subscribed .mm__quick-sub--unsub {
  display: inline-block;
}

.mm__quick-sub.mm__quick-sub--in-progress .mm__quick-sub--check,
.mm__quick-sub.mm__quick-sub--in-progress .mm__quick-sub--sub,
.mm__quick-sub.mm__quick-sub--in-progress .mm__quick-sub--unsub {
  display: none !important;
}

.mm__quick-sub.mm__quick-sub--in-progress .mm__quick-sub--progress {
  display: inline-block;
}

/* #endregion */

/* #region My Mods List View Item */
body.darkMode .mm__queued-list a.block {
  background-color: #232a3573 !important;
}

body.darkMode .mm__disabled {
  background-color: #232a3573 !important;
}

.mm__disabled img.mod-icon {
  opacity: 0.5;
}

.mm__disabled .mm__list-item--title {
  text-decoration: line-through !important;
  opacity: 0.5;
}

body.darkMode .mm__block--dim {
  background-color: #232a3573 !important;
}

.mm__line-through {
  text-decoration: line-through !important;
}

.mm__grayscale {
  filter: grayscale(1);
}

.mm__icon {
  height: 38px;
  width: 38px;
  line-height: 38px;
  font-size: 33px;
}

@media (max-width: 767.98px) {
  .mm__icon {
    height: 32px;
    width: 32px;
    line-height: 32px;
  }
}

/* #endregion */

/* #region Utilities */
.mm__minh-100 {
  min-height: 100% !important;
}

.mm__minw-100 {
  min-width: 100% !important;
}

.mm__dim {
  opacity: 0.5 !important;
}

.mm__no-transition {
  transition: none !important;
}

.progress.mm__progress--thin {
  height: 0.5rem;
}

.mm__flex-expand {
  flex: 1 0 0;
  overflow-y: auto;
}

.mm__overflow-x-hidden {
  overflow-x: hidden;
}

@media (max-width: 1249.98px) {
  .mm__flex-expand--no-xl {
    flex: 1 0 0;
    overflow-y: auto;
  }
}

/* #endregion */

/* #endregion */

/* #region Mod Settings (ms) */
.ms__validation-message {
  display: none;
  flex: 1 0 100%;
  margin-top: 0.5rem;
  width: 100%;
}

.ms__force-wrap {
  flex-basis: 100%;
  width: 0;
}

/* #endregion */

.nav-tabs.nav-link {
  outline: none !important;
}

.row.row-deck > astrology-modifier-display,
.row.row-deck > astrology-exploration-panel,
.row.row-deck > astrology-information-panel,
.row.row-deck > constellation-menu,
.row.row-deck > agility-passive-pillar,
.row.row-deck > built-agility-obstacle,
.row.row-deck > township-worship-select,
.row.row-deck > combat-area-menu,
.row.row-deck > woodcutting-tree,
.row.row-deck > farming-plot,
.row.row-deck > locked-farming-plot,
.row.row-deck > firemaking-bonfire-menu,
.row.row-deck > firemaking-oil-menu,
.row.row-deck > firemaking-log-menu,
.row.row-deck > cooking-menu,
.row.row-deck > locked-constellation-menu {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: stretch;
  align-items: stretch;
}

.row.row-deck > astrology-modifier-display > .block,
.row.row-deck > astrology-exploration-panel > .block,
.row.row-deck > astrology-information-panel > .block,
.row.row-deck > constellation-menu > .block,
.row.row-deck > agility-passive-pillar > .block,
.row.row-deck > built-agility-obstacle > .block,
.row.row-deck > locked-cooking-recipe > .block,
.row.row-deck > cooking-recipe-selection > .block,
.row.row-deck > fishing-area-menu > .block,
.row.row-deck > combat-area-menu > .block,
.row.row-deck > woodcutting-tree > .block,
.row.row-deck > farming-plot > .block,
.row.row-deck > locked-farming-plot > .block,
.row.row-deck > firemaking-bonfire-menu > .block,
.row.row-deck > firemaking-oil-menu > .block,
.row.row-deck > firemaking-log-menu > .block,
.row.row-deck > cooking-menu > .block,
.row.row-deck > locked-constellation-menu > .block {
  min-width: 100%;
}

.nav-item > bank-item-icon {
  display: none;
}

.content-justified .content-item {
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -ms-flex-positive: 1;
  flex-grow: 1;
  text-align: center;
}

.nav-main-horizontal-override {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

body.darkMode a.block.block-link-pop:hover {
  background-color: #2d5223 !important;
}

body.darkMode a.block.block-link-pop:active {
  background-color: #2d5223 !important;
}

.astro-mod {
  width: 20px;
  height: 5px;
}

li.astro-mod.locked {
  background-color: red;
}

li.astro-mod.active {
  background-color: green;
}

li.astro-mod.inactive {
  background-color: gray;
}

.skill-info {
  margin-top: -1.875rem;
  margin-left: -1.875rem;
  margin-right: -1.875rem;
  margin-bottom: 1rem;
}

@media (max-width: 991px) {
  .skill-info {
    margin-top: -0.6rem;
    margin-left: -1rem;
    margin-right: -1rem;
    margin-bottom: 1rem;
  }
}

@media (min-width: 768px) {
  .skill-info {
    margin-bottom: 1.875rem;
  }
}

/* #region Sidebar */
.sidebar__hidden-item {
  display: none !important;
}

#sidebar .nav-img i {
  font-size: 24px;
  line-height: 24px;
  margin-right: 0.66em;
}

#sidebar .nav-img img {
  width: 24px;
  height: 24px;
  margin-right: 0.66em;
}

/* #endregion */
#side-overlay {
  background-color: #232a35;
  height: 100vh;
}

mastery-display.mastery-8 .progress {
  height: 8px;
}

mastery-display.mastery-6 .progress {
  height: 6px;
}

mastery-display.mastery-4 .progress {
  height: 4px;
}

@keyframes glowing-green {
  0% {
    border: 1px solid transparent;
    -webkit-box-shadow: 0 0 0px green;
    -moz-box-shadow: 0 0 0px green;
    box-shadow: 0 0 0px green;
  }

  45% {
    border: 1px solid transparent;
    -webkit-box-shadow: 0 0 0px green;
    -moz-box-shadow: 0 0 0px green;
    box-shadow: 0 0 0px green;
  }

  50% {
    border: 1px solid green;
    -webkit-box-shadow: 0 0 5px green;
    -moz-box-shadow: 0 0 5px green;
    box-shadow: 0 0 5px green;
  }

  95% {
    border: 1px solid green;
    -webkit-box-shadow: 0 0 5px green;
    -moz-box-shadow: 0 0 5px green;
    box-shadow: 0 0 5px green;
  }

  100% {
    border: 1px solid transparent;
    -webkit-box-shadow: 0 0 0px green;
    -moz-box-shadow: 0 0 0px green;
    box-shadow: 0 0 0px green;
  }
}

.glow-animation {
  animation: 2s linear 0s infinite normal glowing-green;
}

@keyframes pulsing-white {
  0% {
    box-shadow: 0 0 0 0px rgba(255, 255, 255, 0.4);
  }

  100% {
    box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
  }
}

.pulse-animation {
  animation: 2s infinite pulsing-white;
}

@keyframes pulseNotification {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.15);
  }

  100% {
    transform: scale(1);
  }
}

.pulseNotification {
  animation-name: pulseNotification;
  animation-duration: 0.3s;
  animation-timing-function: ease-out;
  transform-origin: center;
}

.signin-button {
  width: 210px;
  height: 40px;
  margin-left: auto !important;
  margin-right: auto !important;
}

.nav-main-horizontal.nav-main-horizontal-center.township {
  -ms-flex-pack: center !important;
  justify-content: center !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-wrap: wrap !important;
  flex-wrap: wrap !important;
}

.width-64 {
  width: 64px !important;
}

.height-64 {
  height: 64px !important;
}

.max-height-64 {
  max-height: 64px !important;
}

.max-width-64 {
  max-width: 64px !important;
}

.width-512 {
  width: 512px !important;
}

.height-512 {
  height: 512px !important;
}

.max-height-512 {
  max-height: 512px !important;
}

.max-width-512 {
  max-width: 512px !important;
}

mastery-skill-options {
  display: block;
}

.nav-main-link.township-tab-selected {
  background-color: #37995f;
}

body.darkMode .nav-main-link.township-tab-selected {
  background-color: #1e5936;
}

.nav-main-link.township-tab-selected:hover {
  background-color: #2d7f4f !important;
}

body.darkMode .nav-main-link.township-tab-selected:hover {
  background-color: #267043 !important;
}

body.darkMode .bg-easy-task,
.bg-easy-task {
  background-color: #30575c !important;
}

body.darkMode .bg-normal-task,
.bg-normal-task {
  background-color: #505c30 !important;
}

body.darkMode .bg-hard-task,
.bg-hard-task {
  background-color: #5c3d30 !important;
}

body.darkMode .bg-very-hard-task,
.bg-very-hard-task {
  background-color: #702100 !important;
}

body.darkMode .bg-elite-task,
.bg-elite-task {
  background-color: #000000 !important;
}

body.darkMode .bg-toth-task,
.bg-toth-task {
  background-color: #6366ee !important;
}

body.darkMode .bg-aod-task,
.bg-aod-task {
  background-color: #a26008 !important;
}

body.darkMode .bg-ita-task,
.bg-ita-task {
  background-color: #702100 !important;
}

body.darkMode .text-toth,
.text-toth {
  color: #6366ee !important;
}

body.darkMode .text-aod,
.text-aod {
  color: #a26008 !important;
}

body.darkMode .text-ita,
.text-ita {
  color: #b51b1b !important;
}

body.darkMode .bg-township,
.bg-township {
  background-color: #6c838a !important;
}

body.darkMode .bg-cartography,
.bg-cartography {
  background-color: #cb8934 !important;
}

body.darkMode .bg-daily,
.bg-daily {
  background-color: #5e395e !important;
}

div .btn-group.ts-delete {
  position: absolute;
  right: 4px;
  top: 0;
}

.ts-resource-warning {
  border: 1px solid transparent;
  -webkit-transition: border 0.1s linear, box-shadow 0.1s linear;
  -moz-transition: border 0.1s linear, box-shadow 0.1s linear;
  transition: border 0.1s linear, box-shadow 0.1s linear;
}

.ts-resource-warning.active {
  border-color: #e13d3d;
  -webkit-box-shadow: 0 0 5px #e13d3d;
  -moz-box-shadow: 0 0 5px #e13d3d;
  box-shadow: 0 0 5px #e13d3d;
}

body.darkMode .ts-biome-select-border,
.ts-biome-select-border {
  border: 1px solid #727272;
}

body.darkMode .ts-building-in-town-border,
.ts-building-in-town-border {
  border: 1px solid #59a75d !important;
}

body.darkMode .ts-biome-highlight,
.ts-biome-highlight {
  border: 1px solid #9bc5e3 !important;
}

body.darkMode .ts-biome-build-filter-highlight,
.ts-biome-build-filter-highlight {
  background-color: #7c5d8778 !important;
}

.text-dropdown {
  color: #adb5bd !important;
}

.no-wrap {
  white-space: nowrap !important;
}

.spell-selected {
  background-color: #dbffd0;
}

body.darkMode .spell-selected,
body.darkMode.superDark .spell-selected {
  background-color: #294e36 !important;
}

body.darkMode .bg-trader-locked,
.bg-trader-locked {
  background-color: #b72b2b66 !important;
}

body.darkMode .ribbon-info .ribbon-box {
  background-color: #5cace5 !important;
}

survey-overview {
  width: 100%;
}

hex-overview {
  padding-bottom: 0.75rem;
  width: 100%;
}

.cartography-map-container {
  box-sizing: content-box;
  position: relative;
}

.cartography-bot-left-overlay {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: absolute;
  bottom: 0;
  left: 0;
  max-width: 100%;
  min-width: 40%;
}

@media (min-width: 768px) {
  .cartography-bot-left-overlay {
    max-width: 50%;
    min-width: 20%;
  }
}

@media (min-width: 1250px) {
  .cartography-bot-left-overlay {
    max-width: 25%;
    min-width: 10%;
  }
}

.cartography-accessible-overlay {
  position: absolute;
  bottom: 0;
  left: 50%;
  max-width: 40%;
  min-width: 20%;
}

.cartography-top-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.pointer-events-none {
  pointer-events: none;
}

.pointer-events-auto {
  pointer-events: auto;
}

body.darkMode image-search-result li:hover {
  background-color: #343c4a !important;
}

.table-fixed {
  table-layout: fixed;
}

.animated.slow {
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}

.elder-scrolls {
  overflow: hidden;
  width: 100%;
  aspect-ratio: 16/9;
  pointer-events: none;
}

.elder-scrolls iframe {
  width: 300%;
  height: 100%;
  margin-left: -100%;
}

.z-index-5 {
  z-index: 5 !important;
}

.flat-border-right {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.flat-border-left {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.line-through {
  text-decoration: line-through;
}

body.darkMode .bg-trader-consumable,
.bg-trader-consumable {
  background-color: #10374e !important;
}

body.darkMode .bg-trader-special,
.bg-trader-special {
  background-color: #3d2d66 !important;
}

.township-glower {
  -webkit-transition: box-shadow 1s linear;
  -moz-transition: box-shadow 1s linear;
  transition: box-shadow 1s linear;
}

body.darkMode .block .township-glower.active,
.block .township-glower.active {
  -webkit-box-shadow: 0 0 10px #1eda4f;
  -moz-box-shadow: 0 0 10px #1eda4f;
  box-shadow: 0 0 10px #1eda4f !important;
}

.text-disabled,
body.darkMode .text-disabled {
  color: #adb5bd !important;
  text-decoration: line-through;
}

body.darkMode .ribbon-info .ribbon-box {
  background-color: #5cace5 !important;
}

.sticky-div-mobile,
.sticky-div {
  position: -webkit-sticky;
  /* For Safari browser */
  position: sticky;
  top: 0;
  z-index: 100;
}

.sticky-div.modal-body {
  top: 48px;
}

@media (max-width: 991px) {
  .sticky-div-mobile {
    position: -webkit-sticky;
    /* For Safari browser */
    position: sticky;
    top: 80px;
    z-index: 100;
  }
}

.newNotification {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgb(27, 32, 40);
  padding: 10px;
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 10px;
  margin-bottom: max(env(safe-area-inset-bottom, 0px), 0px);
}

.newNotification.compact {
  padding: 1px;
}

.newNotification div.flex-notify {
  display: flex;
  margin-right: 2px;
}

.newNotification-img {
  height: 24px;
  margin-right: 5px;
}

.newNotification-img.compact {
  height: 16px;
  margin-right: 5px;
  margin: 0.25rem;
}

.badge-danger-dark {
  color: #fff;
  background-color: #963838;
}

.badge-mythical {
  color: #fff;
  background-color: #111550;
}

.badge-rip,
.badge-resolve {
  color: #fff;
  background-color: #000;
}

.badge-woe {
  color: #fff;
  background-color: #919191;
}

.badge-decay {
  color: #fff;
  background-color: #7a7a7a;
}

.badge-fear {
  color: #fff;
  background-color: #666;
}

.badge-ruin {
  color: #fff;
  background-color: #545454;
}

.badge-isolation {
  color: #fff;
  background-color: #3e3e3e;
}

.badge-dissolve {
  color: #fff;
  background-color: #212121;
}

body.darkMode.btn-alt-green,
.btn-alt-green {
  background-color: #176044 !important;
}

.block.block-rounded-double > .block-header {
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
}

.block.block-rounded-double > .block-header:last-child {
  border-bottom-right-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}

.nav.mobile-scroll {
  flex-wrap: nowrap !important;
}

.nav-tabs-block.mobile-scroll {
  display: flex !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  white-space: nowrap !important;
}

.nav-tabs-block .mobile-scroll > .nav-item {
  flex: 0 0 auto !important;
}

.flex-spacer {
  flex: 1 1 0 !important;
}

.drop-shadow-black {
  filter: drop-shadow(1px 1px 2px black);
}

@media (max-width: 768px) {
  .btn-sm-md {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
    border-radius: 0.2rem;
  }

  .btn.btn-sm-md .fa {
    top: 0;
  }

  .btn-sm-md + .dropdown-toggle-split {
    padding-right: 0.375rem;
    padding-left: 0.375rem;
  }
}

img.combat-area-title-aod {
  position: absolute;
  top: -3px;
  left: 50%;
  margin-left: -50px;
  width: 100px;
}

img.combat-area-title-toth {
  position: absolute;
  top: -6px;
  left: 50%;
  margin-left: -64px;
  width: 128px;
}

.bg-combat-toth {
  background-color: #e0ddff !important;
}

.bg-combat-toth-comp {
  background-color: #6467ef !important;
}

body.darkMode .bg-combat-toth {
  background-color: #393554 !important;
}

.bg-combat-aod {
  background-color: #ffe6ca !important;
}

.bg-combat-aod-comp {
  background-color: #f0a747 !important;
}

body.darkMode .bg-combat-aod {
  background-color: #36312b !important;
}

.bg-combat-ita {
  background-color: #ffcaca !important;
}

.bg-combat-ita-comp {
  background-color: #d50c00 !important;
}

body.darkMode .bg-combat-ita {
  background-color: #3e1e1e !important;
}

.bg-combat-corruption,
body.darkMode .bg-combat-corruption {
  background-color: #b24f00 !important;
}

.bg-combat-enemy-spec-block-header,
body.darkMode .bg-combat-enemy-spec-block-header {
  background-color: #702828 !important;
}

.bg-combat-enemy-passive-block-header,
body.darkMode .bg-combat-enemy-passive-block-header {
  background-color: #705a28 !important;
}

.bg-combat-enemy-name-block-header,
body.darkMode .bg-combat-enemy-name-block-header {
  background-color: #202225 !important;
}

.max-vh-60 {
  max-height: 60vh;
}

.modal-full-width {
  max-width: 1140px;
}

@media (max-width: 1200px) {
  .modal-full-width {
    max-width: 95vw;
  }
}

body.darkMode .border.border-secondary,
.border.border-secondary {
  border-color: #6c757d !important;
}

body.darkMode .border.border-danger,
.border.border-danger {
  border-color: #e56767 !important;
}

.cartography__image {
  max-height: 22vh;
}

.cartography__poi_popup {
  align-content: start;
  align-self: stretch !important;
  grid-row: 1/4 !important;
  grid-template-rows: auto auto 1fr auto;
}

.cartography__event_popup {
  align-content: start;
  align-self: stretch !important;
  grid-row: 2 !important;
  grid-template-rows: auto 1fr auto;
}

@media (max-width: 1249.98px) {
  .cartography__image {
    max-height: 20vh;
  }

  .cartography__event_popup {
    grid-row: 1/4 !important;
  }
}

@media (min-height: 1200px) {
  .cartography__poi_popup {
    grid-row: 2 !important;
  }

  .cartography__poi_container {
    grid-template-rows: auto minmax(min-content, 75%) auto;
  }
}

.lh-1-2 {
  line-height: 1.2;
}

skill-tree-node-icon {
  display: block;
  position: absolute;
  cursor: pointer;
}

skill-tree-node-icon > img:nth-of-type(1) {
  width: 100%;
  height: 100%;
  border-style: solid;
  border-width: 3px;
  border-radius: 0.5rem;
}

skill-tree-node-icon > img:nth-of-type(2) {
  position: absolute;
  width: auto;
  height: 25%;
  left: 42%;
  top: -11%;
}

skill-tree-node-icon > div {
  position: absolute;
  left: 5%;
  top: 5%;
  width: 90%;
  height: 90%;
}

skill-tree-node-icon > span {
  position: absolute;
  right: 5%;
  bottom: 5%;
  width: 20%;
  height: 20%;
  padding: 0;
  border-radius: 50%;
}

.stroke-width-3x {
  stroke-width: 3px;
}

.stroke-danger {
  stroke: #e56767;
}

.stroke-warning {
  stroke: #e5ae67;
}

.stroke-success {
  stroke: #30c78d;
}

body.darkMode .stroke-success {
  stroke: #46c37b;
}

body.darkMode .stroke-warning {
  stroke: #f3b760;
}

.desaturate-50 {
  filter: saturate(50%);
}

equipment-grid {
  display: block;
}

equipment-grid > div {
  display: grid;
  place-items: center;
}

settings-switch {
  display: block;
}

.col-xxl-1,
.col-xxl-2,
.col-xxl-3,
.col-xxl-4,
.col-xxl-5,
.col-xxl-6,
.col-xxl-7,
.col-xxl-8,
.col-xxl-9,
.col-xxl-10,
.col-xxl-11,
.col-xxl-12,
.col-xxl,
.col-xxl-auto {
  position: relative;
  width: 100%;
  padding-right: 14px;
  padding-left: 14px;
}

@media (min-width: 1725px) {
  .col-xxl {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }

  .col-xxl-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }

  .col-xxl-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }

  .col-xxl-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }

  .col-xxl-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }

  .col-xxl-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }

  .col-xxl-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }

  .col-xxl-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }

  .col-xxl-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }

  .col-xxl-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }

  .col-xxl-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }

  .col-xxl-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }

  .col-xxl-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }

  .col-xxl-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .offset-xxl-3 {
    margin-left: 25%;
  }
}

body.darkMode .nav-main-link.bg-combat-menu-selected:hover {
  background-color: #2d5223 !important;
}

.nav-main-link.bg-combat-menu-selected:hover {
  background-color: #338e59 !important;
}

.info-icon > div:nth-child(2) {
  position: absolute;
  bottom: -0.5rem;
  left: 50%;
  transform: translate(-50%, 0%);
  line-height: 1.15;
  white-space: nowrap;
}

.info-icon {
  position: relative;
  border-radius: 5px;
}

/* Styling for info-icons. Intended usage is to apply the style to the icon's containing element. */

.icon-size-64 .info-icon > img:first-child,
.icon-size-64 .info-icon {
  height: 64px;
  width: 64px;
}

.icon-size-48 .info-icon > img:first-child,
.icon-size-48 .info-icon {
  height: 48px;
  width: 48px;
}

.icon-size-40 .info-icon > img:first-child,
.icon-size-40 .info-icon {
  height: 40px;
  width: 40px;
}

.icon-size-32 .info-icon > img:first-child,
.icon-size-32 .info-icon {
  height: 32px;
  width: 32px;
}

.icon-size-24 .info-icon > img:first-child,
.icon-size-24 .info-icon {
  height: 24px;
  width: 24px;
}

quantity-icons,
current-quantity-icons {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  flex-wrap: wrap;
}

grants-box {
  display: block;
}

progress-bar {
  display: block;
}

progress-bar.progress-height-20 > .progress {
  height: 20px;
}

progress-bar.progress-height-15 > .progress {
  height: 15px;
}

progress-bar.progress-height-10 > .progress {
  height: 10px;
}

progress-bar.progress-height-6 > .progress {
  height: 6px;
}

progress-bar.progress-height-5 > .progress {
  height: 5px;
}

progress-bar.progress-height-3 > .progress {
  height: 3px;
}

requires-box > h5,
haves-box > h5,
produces-box > h5,
grants-box > h5,
cooking-bonus-box > h5 {
  font-size: 0.875rem;
}

requires-box.icon-box-small > h5,
haves-box.icon-box-small > h5,
produces-box.icon-box-small > h5,
grants-box.icon-box-small > h5,
cooking-bonus-box.icon-box-small > h5 {
  font-size: 0.7rem;
}

/* This styling is required for submenus that are utilizing a custom element that wraps a <li> element */
.nav-main-item.open > .nav-main-submenu > category-menu-option > .nav-main-item,
.nav-main-item.open > .nav-main-submenu > .simplebar-wrapper .nav-main-item {
  opacity: 1;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

@media (min-width: 992px) {
  .nav-main-horizontal .nav-main-item.open > .nav-main-submenu > category-menu-option > .nav-main-item,
  .nav-main-horizontal .nav-main-item.open > .nav-main-submenu > .simplebar-wrapper .nav-main-item {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  .nav-main-horizontal > realm-select-option > .nav-main-item {
    position: relative;
    display: inline-block;
  }

  .nav-main-horizontal > realm-select-option > .nav-main-item:not(:last-child) {
    margin-right: 0.25rem;
  }

  .nav-main-horizontal.nav-main-hover .nav-main-item:hover > .nav-main-submenu > category-menu-option > .nav-main-item,
  .nav-main-horizontal.nav-main-hover .nav-main-item:hover > .nav-main-submenu > .simplebar-wrapper .nav-main-item {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  body.darkMode .nav-main-horizontal .nav-main-submenu {
    background-color: #2d3542;
  }

  body.darkMode .nav-main-submenu .nav-main-link:hover {
    background-color: #232a35 !important;
  }
}

body.darkMode .nav-main-submenu .simplebar-content-wrapper {
  background-color: transparent !important;
}

body.darkMode .nav-main-submenu .simplebar-scrollbar::before {
  background: #fff;
}

[data-simplebar].nav-main-submenu {
  overflow-y: visible;
}

combat-triangle-set-table-row,
view-monster-list-table-row {
  display: table-row;
  vertical-align: inherit;
  border-color: inherit;
}

/* Temp disabled due to lack of Steam Deck compatibility */
/* Hide scrollbar for Chrome, Safari and Opera */
/**.modal::-webkit-scrollbar {
  display: none;
}**/

/* Hide scrollbar for IE, Edge and Firefox */
/**.modal {
  -ms-overflow-style: none;
  scrollbar-width: none;
}**/

.damage-type-normal {
  color: #202020;
}

body.darkMode .damage-type-normal {
  color: #f5f5f5;
}

.damage-type-abyssal {
  color: #ff624d;
}

body.darkMode .damage-type-abyssal {
  color: #ff624d;
}

.damage-type-pure {
  color: #5cace5;
}

body.darkMode .damage-type-pure {
  color: #5cace5;
}

.combat-stats-table {
  display: flex;
  align-items: stretch;
  justify-content: center;
  flex-direction: column;
}

resistance-span,
.combat-stats-table > div {
  display: flex;
}

resistance-span > :first-child,
.combat-stats-table > div > :first-child {
  text-align: left;
  font-weight: 400;
  flex-grow: 1;
  margin: 0.1rem;
}

resistance-span > :nth-child(2),
.combat-stats-table > div > :nth-child(2) {
  text-align: right;
  font-weight: 600;
  margin: 0.1rem;
}

combat-skill-progress-table {
  display: block;
}

.skill-header-badge {
  padding: 0.15rem 0.25rem;
  border-radius: 0.25rem;
}

.skill-header-container {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.25rem;
  padding: 0.25rem 1rem;
}

.township-task-container {
  display: flex;
  float: row;
  justify-content: start;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.375rem 0.5rem;
  padding-bottom: 0.375rem;
}

@media (min-width: 992px) {
  .modal-xxl {
    max-width: 800px;
  }
}

@media (min-width: 1200px) {
  .modal-xxl {
    max-width: 1140px;
  }
}

@media (min-width: 1600px) {
  .modal-xxl {
    max-width: 1540px;
  }
}

.interaction-blocker {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000000;
  width: 100%;
  height: 100%;
  overflow: hidden;
  outline: 0;
  background-color: transparent;
}

.township-header-info {
  min-width: 150px;
}

.content-header.game-page-header {
  height: auto;
  min-height: 4rem;
  flex-wrap: wrap;
}

.header-cloud-save {
  flex-grow: 1;
}

.township-repair-container {
  display: flex;
  align-items: flex-start;
  flex-direction: row;
}
.dropdown-bank-filter {
  min-width: 270px;
  z-index: 9999;
}

/* Styling for mobile layout. width <= 991px */
@media (max-width: 991px) {
  .dropdown-bank-filter {
    max-height: 400px;
  }
  .township-header-info {
    min-width: 48%;
  }

  #page-container.page-header-fixed-mobile #page-header {
    position: sticky;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
    min-width: 320px;
    max-width: 100%;
    width: auto;
    box-shadow: 0 0.125rem 0.375rem rgba(0, 0, 0, 0.02);
  }

  #page-container.page-header-fixed-mobile.page-header-dark #page-header {
    box-shadow: none;
  }

  .m-0-mobile {
    margin: 0 !important;
  }

  .mt-0-mobile,
  .my-0-mobile {
    margin-top: 0 !important;
  }

  .mr-0-mobile,
  .mx-0-mobile {
    margin-right: 0 !important;
  }

  .mb-0-mobile,
  .my-0-mobile {
    margin-bottom: 0 !important;
  }

  .ml-0-mobile,
  .mx-0-mobile {
    margin-left: 0 !important;
  }

  .m-1-mobile {
    margin: 0.25rem !important;
  }

  .mt-1-mobile,
  .my-1-mobile {
    margin-top: 0.25rem !important;
  }

  .mr-1-mobile,
  .mx-1-mobile {
    margin-right: 0.25rem !important;
  }

  .mb-1-mobile,
  .my-1-mobile {
    margin-bottom: 0.25rem !important;
  }

  .ml-1-mobile,
  .mx-1-mobile {
    margin-left: 0.25rem !important;
  }

  .m-2-mobile {
    margin: 0.5rem !important;
  }

  .mt-2-mobile,
  .my-2-mobile {
    margin-top: 0.5rem !important;
  }

  .mr-2-mobile,
  .mx-2-mobile {
    margin-right: 0.5rem !important;
  }

  .mb-2-mobile,
  .my-2-mobile {
    margin-bottom: 0.5rem !important;
  }

  .ml-2-mobile,
  .mx-2-mobile {
    margin-left: 0.5rem !important;
  }

  .m-3-mobile {
    margin: 1rem !important;
  }

  .mt-3-mobile,
  .my-3-mobile {
    margin-top: 1rem !important;
  }

  .mr-3-mobile,
  .mx-3-mobile {
    margin-right: 1rem !important;
  }

  .mb-3-mobile,
  .my-3-mobile {
    margin-bottom: 1rem !important;
  }

  .ml-3-mobile,
  .mx-3-mobile {
    margin-left: 1rem !important;
  }

  .m-4-mobile {
    margin: 1.5rem !important;
  }

  .mt-4-mobile,
  .my-4-mobile {
    margin-top: 1.5rem !important;
  }

  .mr-4-mobile,
  .mx-4-mobile {
    margin-right: 1.5rem !important;
  }

  .mb-4-mobile,
  .my-4-mobile {
    margin-bottom: 1.5rem !important;
  }

  .ml-4-mobile,
  .mx-4-mobile {
    margin-left: 1.5rem !important;
  }

  .m-5-mobile {
    margin: 3rem !important;
  }

  .mt-5-mobile,
  .my-5-mobile {
    margin-top: 3rem !important;
  }

  .mr-5-mobile,
  .mx-5-mobile {
    margin-right: 3rem !important;
  }

  .mb-5-mobile,
  .my-5-mobile {
    margin-bottom: 3rem !important;
  }

  .ml-5-mobile,
  .mx-5-mobile {
    margin-left: 3rem !important;
  }

  .m-6-mobile {
    margin: 4.5rem !important;
  }

  .mt-6-mobile,
  .my-6-mobile {
    margin-top: 4.5rem !important;
  }

  .mr-6-mobile,
  .mx-6-mobile {
    margin-right: 4.5rem !important;
  }

  .mb-6-mobile,
  .my-6-mobile {
    margin-bottom: 4.5rem !important;
  }

  .ml-6-mobile,
  .mx-6-mobile {
    margin-left: 4.5rem !important;
  }

  .m-7-mobile {
    margin: 6rem !important;
  }

  .mt-7-mobile,
  .my-7-mobile {
    margin-top: 6rem !important;
  }

  .mr-7-mobile,
  .mx-7-mobile {
    margin-right: 6rem !important;
  }

  .mb-7-mobile,
  .my-7-mobile {
    margin-bottom: 6rem !important;
  }

  .ml-7-mobile,
  .mx-7-mobile {
    margin-left: 6rem !important;
  }

  .m-8-mobile {
    margin: 9rem !important;
  }

  .mt-8-mobile,
  .my-8-mobile {
    margin-top: 9rem !important;
  }

  .mr-8-mobile,
  .mx-8-mobile {
    margin-right: 9rem !important;
  }

  .mb-8-mobile,
  .my-8-mobile {
    margin-bottom: 9rem !important;
  }

  .ml-8-mobile,
  .mx-8-mobile {
    margin-left: 9rem !important;
  }

  .m-9-mobile {
    margin: 12rem !important;
  }

  .mt-9-mobile,
  .my-9-mobile {
    margin-top: 12rem !important;
  }

  .mr-9-mobile,
  .mx-9-mobile {
    margin-right: 12rem !important;
  }

  .mb-9-mobile,
  .my-9-mobile {
    margin-bottom: 12rem !important;
  }

  .ml-9-mobile,
  .mx-9-mobile {
    margin-left: 12rem !important;
  }

  .m-10-mobile {
    margin: 18rem !important;
  }

  .mt-10-mobile,
  .my-10-mobile {
    margin-top: 18rem !important;
  }

  .mr-10-mobile,
  .mx-10-mobile {
    margin-right: 18rem !important;
  }

  .mb-10-mobile,
  .my-10-mobile {
    margin-bottom: 18rem !important;
  }

  .ml-10-mobile,
  .mx-10-mobile {
    margin-left: 18rem !important;
  }

  .p-0-mobile {
    padding: 0 !important;
  }

  .pt-0-mobile,
  .py-0-mobile {
    padding-top: 0 !important;
  }

  .pr-0-mobile,
  .px-0-mobile {
    padding-right: 0 !important;
  }

  .pb-0-mobile,
  .py-0-mobile {
    padding-bottom: 0 !important;
  }

  .pl-0-mobile,
  .px-0-mobile {
    padding-left: 0 !important;
  }

  .p-1-mobile {
    padding: 0.25rem !important;
  }

  .pt-1-mobile,
  .py-1-mobile {
    padding-top: 0.25rem !important;
  }

  .pr-1-mobile,
  .px-1-mobile {
    padding-right: 0.25rem !important;
  }

  .pb-1-mobile,
  .py-1-mobile {
    padding-bottom: 0.25rem !important;
  }

  .pl-1-mobile,
  .px-1-mobile {
    padding-left: 0.25rem !important;
  }

  .p-2-mobile {
    padding: 0.5rem !important;
  }

  .pt-2-mobile,
  .py-2-mobile {
    padding-top: 0.5rem !important;
  }

  .pr-2-mobile,
  .px-2-mobile {
    padding-right: 0.5rem !important;
  }

  .pb-2-mobile,
  .py-2-mobile {
    padding-bottom: 0.5rem !important;
  }

  .pl-2-mobile,
  .px-2-mobile {
    padding-left: 0.5rem !important;
  }

  .p-3-mobile {
    padding: 1rem !important;
  }

  .pt-3-mobile,
  .py-3-mobile {
    padding-top: 1rem !important;
  }

  .pr-3-mobile,
  .px-3-mobile {
    padding-right: 1rem !important;
  }

  .pb-3-mobile,
  .py-3-mobile {
    padding-bottom: 1rem !important;
  }

  .pl-3-mobile,
  .px-3-mobile {
    padding-left: 1rem !important;
  }

  .p-4-mobile {
    padding: 1.5rem !important;
  }

  .pt-4-mobile,
  .py-4-mobile {
    padding-top: 1.5rem !important;
  }

  .pr-4-mobile,
  .px-4-mobile {
    padding-right: 1.5rem !important;
  }

  .pb-4-mobile,
  .py-4-mobile {
    padding-bottom: 1.5rem !important;
  }

  .pl-4-mobile,
  .px-4-mobile {
    padding-left: 1.5rem !important;
  }

  .p-5-mobile {
    padding: 3rem !important;
  }

  .pt-5-mobile,
  .py-5-mobile {
    padding-top: 3rem !important;
  }

  .pr-5-mobile,
  .px-5-mobile {
    padding-right: 3rem !important;
  }

  .pb-5-mobile,
  .py-5-mobile {
    padding-bottom: 3rem !important;
  }

  .pl-5-mobile,
  .px-5-mobile {
    padding-left: 3rem !important;
  }

  .p-6-mobile {
    padding: 4.5rem !important;
  }

  .pt-6-mobile,
  .py-6-mobile {
    padding-top: 4.5rem !important;
  }

  .pr-6-mobile,
  .px-6-mobile {
    padding-right: 4.5rem !important;
  }

  .pb-6-mobile,
  .py-6-mobile {
    padding-bottom: 4.5rem !important;
  }

  .pl-6-mobile,
  .px-6-mobile {
    padding-left: 4.5rem !important;
  }

  .p-7-mobile {
    padding: 6rem !important;
  }

  .pt-7-mobile,
  .py-7-mobile {
    padding-top: 6rem !important;
  }

  .pr-7-mobile,
  .px-7-mobile {
    padding-right: 6rem !important;
  }

  .pb-7-mobile,
  .py-7-mobile {
    padding-bottom: 6rem !important;
  }

  .pl-7-mobile,
  .px-7-mobile {
    padding-left: 6rem !important;
  }

  .p-8-mobile {
    padding: 9rem !important;
  }

  .pt-8-mobile,
  .py-8-mobile {
    padding-top: 9rem !important;
  }

  .pr-8-mobile,
  .px-8-mobile {
    padding-right: 9rem !important;
  }

  .pb-8-mobile,
  .py-8-mobile {
    padding-bottom: 9rem !important;
  }

  .pl-8-mobile,
  .px-8-mobile {
    padding-left: 9rem !important;
  }

  .p-9-mobile {
    padding: 12rem !important;
  }

  .pt-9-mobile,
  .py-9-mobile {
    padding-top: 12rem !important;
  }

  .pr-9-mobile,
  .px-9-mobile {
    padding-right: 12rem !important;
  }

  .pb-9-mobile,
  .py-9-mobile {
    padding-bottom: 12rem !important;
  }

  .pl-9-mobile,
  .px-9-mobile {
    padding-left: 12rem !important;
  }

  .p-10-mobile {
    padding: 18rem !important;
  }

  .pt-10-mobile,
  .py-10-mobile {
    padding-top: 18rem !important;
  }

  .pr-10-mobile,
  .px-10-mobile {
    padding-right: 18rem !important;
  }

  .pb-10-mobile,
  .py-10-mobile {
    padding-bottom: 18rem !important;
  }

  .pl-10-mobile,
  .px-10-mobile {
    padding-left: 18rem !important;
  }

  .archaeology-dig-site-container-unlock {
    min-height: 620px;
  }

  .sticky-category-menu-mobile {
    position: sticky;
    top: 85px;
    z-index: 90;
  }

  .btn-sm-mobile {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
    border-radius: 0.2rem;
  }

  .btn-sm-mobile + .dropdown-toggle-split {
    padding-right: 0.375rem;
    padding-left: 0.375rem;
  }

  .btn.btn-sm-mobile .fa {
    top: 0;
  }

  .btn.btn-sm-mobile.btn-rounded-double {
    border-radius: 0.5rem;
  }

  .font-size-sm-mobile {
    font-size: 0.875rem !important;
  }

  .font-size-xs-mobile {
    font-size: 0.66rem !important;
  }

  .d-mobile-none {
    display: none !important;
  }

  .w-100-mobile {
    width: 100% !important;
  }

  .header-cloud-save {
    order: 1;
    width: 100%;
  }

  .township-repair-container {
    flex-direction: column;
  }

  .resize-64-mobile {
    height: 64px !important;
    width: 64px !important;
  }

  .skill-icon-xs-mobile {
    height: 24px;
    width: 24px;
    margin: 4px;
  }
}

@media (hover: none) {
  .d-no-hover-none {
    display: none !important;
  }
}

.nav-main.abyssal-veins,
body.darkMode .nav-main.abyssal-veins {
  background-image: url('../media/main/theme_abyssal.png');
  background-repeat: repeat;
}
body.darkMode.superDark .nav-main.abyssal-veins {
  background-image: none;
  background-repeat: no-repeat;
}
.nav-main.eternal,
body.darkMode .nav-main.eternal {
  background-image: url('../media/main/theme_eternal.png');
  background-repeat: repeat;
}
body.darkMode.superDark .nav-main.eternal {
  background-image: none;
  background-repeat: no-repeat;
}