* {
  box-sizing: border-box;
}

html,
body {
  background-color: rgb(0, 0, 0);
  color: rgb(205, 134, 63);
  font-size: 0.95rem;
}

input,
textarea {
  border-color: rgba(205, 134, 63, 0.5);
  color: rgba(205, 134, 63, 0.8);
  background-color: rgba(34, 19, 7, 0.5);
}

a {
  color: #cd853f;
  text-decoration: none;
}

a:hover {
  color: rgba(205, 134, 63, 0.8);
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
h7 {
  color: rgb(205, 134, 63);
  text-shadow: 2px 2px black;
}

button {
  color: rgb(205, 134, 63);
  background-color: #333333;
  border: 2px outset #666666;
}

select {
  background-color: rgba(205, 134, 63, 1);
  color: #000000;
  border: 2px inset #666666;
  padding: 2px 5px 2px 5px;
}

pre {
  color: silver;
  border: 1px dotted rgb(128, 128, 128);
  background-color: #050505;
  padding: 5px 10px 5px 10px;
}

@font-face {
  font-family: "Insula";
  src: url("fonts/INSULA__.ttf") format("ttf");
}

body::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 3px rgba(48, 27, 8, 0.9);
  border-radius: 10px;
  background-color: #100903;
}

body::-webkit-scrollbar {
  width: 12px;
  background-color: #000000;
}

body::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: #63391b;
  background-image: -webkit-linear-gradient(
    90deg,
    transparent,
    rgba(0, 0, 0, 0.6) 50%,
    transparent,
    transparent
  );
}

/* BASIC TILESET /////////////////////////////////////////////////////////////*/

#dibi-diagnose {
  position: fixed;
  right: 5px;
  bottom: 5px;
  width: 150px;
  height: 65px;
  background-color: rgba(26, 14, 5, 0.9) !important;
  color: rgba(205, 134, 63, 0.9) !important;
  border: 1px solid;
  border-color: rgba(205, 134, 63, 0.8) !important;
  z-index: 100;
  font-size: 0.6rem;
  padding: 5px;
}

@keyframes errorhide {
  from {
    opacity: 1;
    visibility: visible;
  }
  to {
    opacity: 0;
    visibility: hidden;
  }
}

#top-errorbox {
  position: fixed;
  top: 0px;
  left: 40%;
  right: 40%;
  margin: 0 auto;
  width: 450px;
  height: 55px;
  z-index: 101;
  padding: 4px 10px 4px 10px;
  color: #ffffff;
  text-align: center;
  font-weight: bold;
  font-variant: small-caps;
  border: 3px ridge #101010;
  border-top: 0px ridge #333333;
  animation-name: errorhide;
  animation-duration: 2s;
  animation-delay: 4s;
  animation-iteration-count: 1;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
  font-family: "Trebuchet MS", "Lucida Sans Unicode", sans-serif;
}

#errorbox {
  width: 400px;
  height: 50px;
  padding: 5px 10px 5px 10px;
  text-align: center;
  font-weight: bold;
  font-variant: small-caps;
}

.success {
  background-color: #0a460a;
  color: #ffffff;
}

.failure {
  background-color: #780a0a;
  color: #ffffff;
}

.success-border {
  color: #ffffff;
  border: 2px solid #126100;
}

.failure-border {
  color: #ffffff;
  border: 2px solid #940000;
}

.neutral {
  background-color: #0a0a78;
  color: #ffffff;
}

.neutral-border {
  color: #ffffff;
  border: 2px solid #0010ae;
}

#container {
  overflow: hidden;
  margin: -5px auto;
}

#banner {
  margin: 0px 0px 0px 0px;
  background-repeat: no-repeat;
  background-size: contain;
  cursor: pointer;
}

#top-menu {
  overflow: hidden;
  margin: 0px 0px 0px 0px;
  background-size: unset;
  background-repeat: no-repeat;
}

#top-pillars {
  background-position: top center;
  background-size: unset;
  background-repeat: no-repeat;
}

#rest {
  display: inline-grid;
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 1;
  grid-row-end: 1;
  overflow: hidden;
}

#rest-wide {
  overflow: hidden;
}

#right-panel {
  background-size: unset;
  background-position: left top;
  background-repeat: repeat-y;
  overflow: hidden;
  margin: 0px 0px 0px 0px;
  grid-column: 3 / 3;
  grid-row: 1 / 1;
}

#left-menu {
  background-size: unset;
  background-position: right top;
  background-repeat: repeat-y;
  overflow: hidden;
  margin: 0px 0px 0px 0px;
  grid-column: 1 / 3;
  grid-row: 1 / 1;
}

#content {
  background-color: #000000;
  overflow: hidden;
  margin: 0px 0px 0px 0px;
  padding: 20px 25px 20px 25px;
  grid-column: 2 / 3;
  grid-row: 1 / 1;
  min-height: 600px;
}

#footer {
  background-size: unset;
  background-position: center bottom;
  background-repeat: no-repeat;
  overflow: hidden;
  margin: 0px 0px 0px 0px;
}

#top-logo {
  background-size: unset;
  background-position: center bottom;
  position: relative;
  background-repeat: no-repeat;
  z-index: 2;
}

@media screen and (max-width: 1899px) {
  #container {
    width: 1250px;
  }

  #banner {
    width: 1250px;
    height: 165px;
  }

  #right-panel {
    background-image: url("../media/panel-right-wall-1250.png");
    width: 232px;
    height: 100%;
  }

  #rest {
    grid-template-columns: 232px auto 232px;
    width: 1250px;
  }

  #left-menu {
    background-image: url("../media/panel-left-wall-1250.png");
    width: 232px;
    height: 100%;
  }

  #top-menu {
    background-image: url("../media/top-menu-wall-1250.png");
    width: 1250px;
    height: 54px;
  }

  #top-pillars {
    background-image: url("../media/top-pillars-1250.png");
    width: 1250px;
    height: 55px;
  }

  #torch-left {
    background-image: url("../media/torch-left-1250.png");
    position: relative;
    z-index: 50;
    background-repeat: no-repeat;
    left: 77px;
    top: -50px;
    height: 221px;
    width: 218px;
    pointer-events: none;
  }

  #torch-right {
    background-image: url("../media/torch-right-1250.png");
    position: relative;
    z-index: 50;
    background-repeat: no-repeat;
    right: -955px;
    top: -271px;
    height: 221px;
    width: 218px;
    pointer-events: none;
  }

  #content {
    width: 786px;
  }

  #footer {
    background-image: url("../media/footer-wall-1250.png");
    width: 1250px;
    height: 80px;
  }

  #top-logo {
    background-image: url("../media/logo-1250-adarah.png");
    height: 245px;
    width: 370px;
    margin: 0 auto;
  }
}

@media screen and (min-width: 1900px) {
  #container {
    width: 1750px;
  }

  #banner {
    width: 1750px;
    height: 230px;
  }

  #right-panel {
    background-image: url("../media/panel-right-wall-1750.png");
    width: 325px;
    height: 100%;
  }

  #rest {
    grid-template-columns: 325px auto 325px;
    width: 1750px;
  }

  #left-menu {
    background-image: url("../media/panel-left-wall-1750.png");
    width: 325px;
    height: 100%;
  }

  #top-menu {
    background-image: url("../media/top-menu-wall-1750.png");
    width: 1750px;
    height: 75px;
    position: relative;
    padding-top: 17px;
    padding-left: 40px;
    padding-right: 40px;
  }

  #torch-left {
    background-image: url("../media/torch-left-1750.png");
    position: relative;
    z-index: 50;
    background-repeat: no-repeat;
    left: 108px;
    top: -70px;
    height: 308px;
    width: 303px;
    pointer-events: none;
  }

  #torch-right {
    background-image: url("../media/torch-right-1750.png");
    position: relative;
    z-index: 50;
    background-repeat: no-repeat;
    right: -1339px;
    top: -377px;
    height: 308px;
    width: 303px;
    pointer-events: none;
  }

  #top-pillars {
    background-image: url("../media/top-pillars-1750.png");
    width: 1750px;
    height: 77px;
  }

  #content {
    width: 1100px;
  }
  #content-wide {
    width: 1750px;
  }

  #footer {
    background-image: url("../media/footer-wall-1750.png");
    width: 1750px;
    height: 113px;
  }

  #top-logo {
    background-image: url("../media/logo-1750-adarah.png");
    height: 350px;
    width: 450px;
    margin: 0 auto;
    z-index: 100;
  }
}

/* END OF BASIC TILESET //////////////////////////////////////////////////////*/

/* TOP MENU ////////////////////////////////////////////////////////////////// */

@media screen and (max-width: 1899px) {
  #top-menu-left {
    padding-left: 0;
    max-width: 500px;
    float: left;
  }

  #top-menu-right {
    padding-right: 0;
    max-width: 500px;
    float: right;
  }
}

@media screen and (min-width: 1900px) {
  #top-menu-left {
    padding-left: 0;
    max-width: 600px;
    float: left;
  }

  #top-menu-right {
    padding-right: 0;
    max-width: 600px;
    float: right;
  }
}

.top-menu-button {
  background-image: url("../media/menu/top-menu-button-off.png");
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center center;
  z-index: 3;
  transition: 0.2s ease-in-out;
}

.top-menu-button.fa,
.top-menu-button.fas,
.top-menu-button.far,
.top-menu-button.fal,
.top-menu-button.fab {
  font-size: 1.3rem;
  color: rgba(205, 134, 63, 1);
  text-shadow: 2px 2px black;
}

.top-menu-button:hover {
  background-image: url("../media/menu/top-menu-button-on.png");
  background-position: center center;
  color: rgba(255, 255, 255, 0.8);
  transition: 0.1s ease-in-out;
}

button.top-menu-button {
  border: 0px solid transparent;
  width: 60px;
  height: 60px;
  z-index: 3;
}

/* END OF TOP MENU ///////////////////////////////////////////////////////////*/

/* TOP PILLARS ///////////////////////////////////////////////////////////////*/

#top-pillars-title {
  position: absolute;
  left: 52%;
  transform: translate(-50%, -50%);
  color: rgba(255, 255, 255, 0.9);
  text-shadow: 2px 2px #000;
  font-weight: 500;
  font-size: 0.85rem;
}

@media screen and (max-width: 1899px) {
  .top-pillars-title-short {
    bottom: 15px;
  }
  .top-pillars-title-long {
    bottom: 10px;
  }
}

@media screen and (min-width: 1900px) {
  .top-pillars-title-short {
    bottom: 18px;
  }
  .top-pillars-title-long {
    bottom: 15px;
  }
}

/* END OF TOP PILLARS ////////////////////////////////////////////////////////*/

/* FOOTER ////////////////////////////////////////////////////////////////////*/

#footer-page-content {
  display: table;
  float: none;
  margin: 40px auto;
  text-align: center;
}

/* END OF FOOTER /////////////////////////////////////////////////////////////*/

/* RIGHT PANEL ///////////////////////////////////////////////////////////////*/

@media screen and (max-width: 1899px) {
  #character-module,
  #right-panel-event-freeze-box {
    margin: 10px 20px 0px 40px;
    min-height: 120px;
    height: fit-content;
    padding-bottom: 6px;
  }

  #character-module-stats {
    margin: 10px 0px 0px 0px;
  }

  #character-module-stats > #character-module-stats-text:before {
    content: " \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad \00ad";
    margin-top: 20px;
  }
}

@media screen and (min-width: 1900px) {
  #character-module,
  #right-panel-event-freeze-box {
    margin: 25px 10px 0px 55px;
    min-height: 200px;
    height: fit-content;
    padding-bottom: 8px;
  }

  #character-module-stats {
    margin-top: 1.4rem;
  }
}

#character-module,
#right-panel-event-freeze-box {
  background-color: rgba(0, 0, 0, 0.7);
  border: 1px solid rgba(205, 134, 63, 0.7);
}

#right-panel-event-freeze-box {
    min-height: 25px;
    height: fit-content;
    background-color: rgba(0, 0, 0, 0.7);
    color: #80bdff;
    padding-top: 1rem;
    padding-bottom: 1rem;
    line-height: 90%;
}

#character-module-stats {
  text-align: center;
}

#character-module-avatar {
  float: left;
}

#character-module-avatar img {
  border: 1px solid rgba(205, 134, 63, 0.7);
  margin: 0.5rem;
}

#character-module-header {
  color: #cd853f;
  font-size: 1rem;
  font-weight: 500;
  margin: 10px 10px 10px 10px;
}

#character-module-switch-selector {
  position: absolute;
  margin-left: -80px;
  z-index: 99;
  border: 3px double #63391b;
  background-color: #000000;
  width: 300px;
  min-height: 150px;
}

#right-panel-event-selector {
  position: absolute;
  right: 1.5rem;
  z-index: 99;
  border: 3px double #63391b;
  background-color: #000000;
  width: 400px;
  min-height: 150px;
}

.right-panel-selector-content {
  padding: 2px 10px 5px 10px;
}

#module-character-switch-close-button {
  float: right;
}

/* ---------- BODY A PENÍZE v pravém panelu ---------- */

@media screen and (max-width: 1899px) {
  #character-module ul.character-currency {
    margin-top: 15px;
    padding: 0px;
  }

  #character-module ul.character-currency li {
    width: 110px;
    background-color: rgba(34, 19, 7, 0.4);
    float: left;
    list-style: none;
    padding: 10px 5px;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
    font-size: 0.85rem;
    font-weight: 400;
    margin-left: 30px;
    margin-bottom: 5px;
  }

  #character-module ul.character-currency li:first-child {
    margin-left: 30px;
    margin-right: 10px;
    border-right: 1px solid rgba(34, 19, 7, 0.8);
    padding-bottom: 10px;
    padding-top: 10px;
  }

  #character-module ul.character-currency li span.character-currency-caption {
    display: block;
    font-size: 0.75rem;
    color: rgba(205, 134, 63, 0.6) !important;
    font-weight: 100;
  }
}

@media screen and (min-width: 1900px) {
  #character-module ul.character-currency {
    margin-top: 15px;
    padding: 0px;
  }

  #character-module ul.character-currency li {
    width: 110px;
    background-color: rgba(34, 19, 7, 0.4);
    float: left;
    list-style: none;
    padding: 10px 5px;
    text-align: center;
    font-size: 0.85rem;
    font-weight: 400;
  }

  #character-module ul.character-currency li:first-child {
    margin-left: 15px;
    margin-right: 10px;
    border-right: 1px solid rgba(34, 19, 7, 0.8);
  }

  #character-module ul.character-currency li span.character-currency-caption {
    display: block;
    font-size: 0.75rem;
    color: rgba(205, 134, 63, 0.6) !important;
    font-weight: 100;
  }
}

@media screen and (max-width: 1899px) {
  #right-panel-modules-container {
    margin-top: 40px;
    margin-left: 35px;
  }

  .right-panel-modules-module {
    background-color: rgba(255, 255, 255, 0.1);
    width: 180px;
    margin-top: 5px;
    margin-bottom: 10px;
  }

  .right-panel-modules-module a:hover {
    text-decoration: none;
  }

  .right-panel-modules-header {
    background-image: url("../media/buttons-etc/button180-off.png");
    background-position: left top;
    background-repeat: no-repeat;
    width: 180px;
    height: 44px;
    overflow: hidden;
  }

  .right-panel-modules-header h3 {
    padding-top: 7px;
    padding-left: 10px;
    font-size: 1.15rem;
  }

  #right-module-onlinelist {
    margin-left: 20px;
    padding-bottom: 10px;
    font-size: 0.75rem;
  }
}

@media screen and (min-width: 1900px) {
  #right-panel-modules-container {
    margin-top: 40px;
    margin-left: 50px;
  }

  #left-panel-modules-container {
    margin-top: 40px;
    margin-right: 50px;
    margin-left: 8px;
  }

  .right-panel-modules-module,
  .left-panel-modules-module {
    background-color: rgba(255, 255, 255, 0.1);
    width: 265px;
    margin-top: 5px;
    margin-bottom: 10px;
  }

  .right-panel-modules-module a:hover,
  .left-panel-modules-module a:hover {
    text-decoration: none;
  }

  .right-panel-modules-header,
  .left-panel-modules-header {
    background-image: url("../media/buttons-etc/widget-bg.png");
    background-position: left top;
    background-repeat: no-repeat;
    width: 260px;
    height: 44px;
    overflow: hidden;
  }

  .right-panel-modules-header h3,
  .left-panel-modules-header h3 {
    padding-top: 9px;
    padding-left: 15px;
    font-size: 1.3rem;
  }

  #right-module-onlinelist {
    margin-left: 20px;
    padding-bottom: 10px;
  }
}

#right-panel-mail-indication {
  background-color: transparent;
  text-align: center;
  margin: 2.5rem 1.5rem 0 3.6rem;
  cursor: pointer;
}

#right-panel-event-indication {
  background-color: rgba(0, 0, 0, 0.7);
  border: 1px solid rgba(205, 134, 63, 0.7);
  margin: 2.5rem 1.5rem 0 3.6rem;
  text-align: left;
  cursor: pointer;
}

#right-panel-event-indication img {
  height: 9rem;
  float: right;
  margin: -3rem -3rem 0 0;
}

#event-indication-text {
  font-size: 0.7rem;
  padding: 0.5rem;
}

.right-onlinelist-select {
  color: rgba(205, 134, 63, 0.8);
  background-color: rgba(25, 18, 11, 0.5);
  border: 1px solid rgba(205, 134, 63, 0.5);
  border-radius: 0.2rem;
}

.right-onlinelist-select option {
  color: rgba(205, 134, 63, 0.8);
  background-color: rgb(25, 18, 11);
}

#tooltip-right-onlinelist-whole {
  width: 500px;

  padding: 20px 20px 20px 20px;
}

#right-module-changelog {
  margin-left: 10px;
  margin-top: 5px;
  margin-bottom: 5px;
}

/* END OF RIGHT PANEL ////////////////////////////////////////////////////////*/

/* REGISTER FORM /////////////////////////////////////////////////////////////*/

.register-form-left-label {
  float: left;
  width: 250px;
  padding: 3px;
  font-size: large;
}

.register-form-right-input {
  float: left;
}

.register-form-right-input input[type="text"],
.register-form-right-input input[type="password"],
.register-form-right-input input[type="email"] {
  width: 400px;
  height: calc(1.5em + 0.5rem + 2px);
  color: rgba(205, 134, 63, 1);
  background-color: rgb(0, 0, 0);
  background-clip: padding-box;
  border: 1px solid rgba(205, 134, 63, 0.5);
  border-radius: 0.2rem;
  line-height: 1.5;
  padding: 0.25rem 0.5rem;
}

.register-form-right-input input[type="number"],
.register-form-right-input input[type="month"],
.register-form-right-input input[type="datetime-local"] {
  width: 175px;
  height: calc(1.5em + 0.5rem + 2px);
  color: rgba(205, 134, 63, 1);
  background-color: rgb(0, 0, 0);
  background-clip: padding-box;
  border: 1px solid rgba(205, 134, 63, 0.5);
  border-radius: 0.2rem;
  line-height: 1.5;
  padding: 0.25rem 0.5rem;
}

.register-form-right-input input[type="checkbox"]:checked + label,
.register-form-right-input input[type="checkbox"]:not(:checked) + label {
  margin-top: 10px;
}

.register-form-select {
  color: rgba(205, 134, 63, 0.8);
  background-color: rgb(0, 0, 0);
  border: 1px solid rgba(205, 134, 63, 0.5);
  border-radius: 0.2rem;
  min-width: 175px;
}

.register-form-select option {
  color: rgba(205, 134, 63, 0.8);
  background-color: rgb(0, 0, 0);
}

/* END OF REGISTER FORM //////////////////////////////////////////////////////*/

/* RECOVERY SECTION //////////////////////////////////////////////////////////*/

#recovery-form-top-text {
  padding: 10px 0px 15px 0px;
}

#recovery-form-auto {
  padding: 20px 60px 20px 20px;
  border-bottom: 1px solid #63391b;
}

.recovery-form-label {
  float: left;
  width: 250px;
  height: 28px;
  font-size: 0.95rem;
  padding: 10px 0px 0px 15px;
}

.recovery-form-input {
  float: left;
  width: 350px;
}

.recovery-form-input input {
  padding: 0px 15px;
  border: 0px;
  background-color: transparent;
  background-image: url("../../media/buttons-etc/textove_pole-200x38.png");
  background-repeat: no-repeat;
  color: #cd853f;
  width: 195px;
  height: 38px;
}

#recovery-form-security-questions {
  padding: 10px 0px 10px 15px;
}

#recovery-form-security-questions textarea {
  width: 450px;
  height: 40px;
  background-color: #4e311a;
  margin: 10px 0px 5px 0px;
  padding: 5px 5px 5px 5px;
}

#recovery-form-security-questions button,
#recovery-form-manual button {
  padding: 0px 15px;
  border: 0px;
  background-color: transparent;
  background-image: url("../../media/buttons-etc/button_260x43-off.png");
  background-position: left top;
  background-repeat: no-repeat;
  color: #cd853f;
  width: 260px;
  height: 43px;
  margin-top: 15px;
}

#recovery-form-security-questions button {
  margin-left: 196px;
}

#recovery-form-manual button {
  margin-left: 267px;
}

#recovery-form-security-questions button:hover,
#recovery-form-manual button:hover {
  background-image: url("../../media/buttons-etc/button_260x43-on.png");
  color: #ffffff;
}

#rec-form-failed-text {
  color: #990000;
}

#recovery-form-bottom-text {
  padding: 10px 0px 15px 0px;
}

#recovery-form-manual {
  padding: 20px 60px 20px 20px;
}

#recovery-form-manual textarea {
  width: 450px;
  height: 80px;
  background-color: #4e311a;
  margin: 10px 0px 5px 5px;
  padding: 5px 5px 5px 5px;
}

/* END OF RECOVERY FORM //////////////////////////////////////////////////////*/

/* SETTINGS SECTION //////////////////////////////////////////////////////////*/

.settings-form-label {
  float: left;
  width: 250px;
  height: 28px;
  font-size: 0.95rem;
  padding: 10px 0px 0px 15px;
}

.settings-form-input {
  float: left;
  width: 350px;
}

.settings-form-input input {
  padding: 0px 15px;
  border: 0px;
  background-color: transparent;
  background-image: url("../../media/buttons-etc/textove_pole-200x38.png");
  background-repeat: no-repeat;
  color: #cd853f;
  width: 195px;
  height: 38px;
}

#settings-form-password button,
#settings-form-email button,
#settings-form-question button,
#settings-form-new-character button,
#settings-form-character-name-edit button,
#settings-form-character-age-edit button,
#settings-form-character-mind-edit button,
#settings-form-character-rename-request button,
#settings-form-character-delete-request button,
#settings-avatar-selection-button button {
  padding: 0px 15px;
  border: 0px;
  background-color: transparent;
  background-image: url("../../media/buttons-etc/button_260x43-off.png");
  background-position: left top;
  background-repeat: no-repeat;
  color: #cd853f;
  width: 260px;
  height: 43px;
  margin-top: 15px;
}

#settings-form-email button,
#settings-form-question button,
#settings-form-password button,
#settings-form-new-character button,
#settings-form-character-name-edit button,
#settings-form-character-age-edit button,
#settings-form-character-mind-edit button,
#settings-form-character-rename-request button,
#settings-form-character-delete-request button,
#settings-avatar-selection-button button {
  margin-left: 253px;
}

#settings-form-password button:hover,
#settings-form-email button:hover,
#settings-form-question button:hover,
#settings-form-new-character button:hover,
#settings-form-character-name-edit button:hover,
#settings-form-character-age-edit button:hover,
#settings-form-character-mind-edit button:hover,
#settings-form-character-rename-request button:hover,
#settings-form-character-delete-request button:hover,
#settings-avatar-selection-button button:hover {
  background-image: url("../../media/buttons-etc/button_260x43-on.png");
  color: #ffffff;
  cursor: pointer;
}

.settings-form-text {
  padding: 10px 0px 15px 0px;
}

.settings-account-form h3 {
  cursor: pointer;
}

/* END OF SETTINGS SECTION ///////////////////////////////////////////////////*/

/* AVATARS ///////////////////////////////////////////////////////////////////*/

.character-avatar {
}

.avatar-nano img {
  max-height: 40px;
  max-width: 40px;
}

.avatar-micro img {
  max-height: 60px;
  max-width: 60px;
}

.avatar-small img {
  max-height: 75px;
  max-width: 75px;
}

@media screen and (min-width: 1900px) {
  .avatar-normal img {
    max-height: 80px;
    max-width: 80px;
  }
}

@media screen and (max-width: 1899px) {
  .avatar-normal img {
    max-height: 60px;
    max-width: 60px;
  }
}

.avatar-big img {
  max-height: 175px;
  max-width: 175px;
}
.avatar-huge img {
  max-height: 250px;
  max-width: 250px;
}

.avatar-mail img {
  width: 28px;
  height: 28px;
  border: 2px ridge rgba(205, 134, 63, 0.7);
}

.avatar-nano-chat {
  display: contents;
}

.avatar-nano-chat img {
  max-height: 40px;
  max-width: 40px;
  border: 2px ridge rgba(205, 134, 63, 0.7);
}

/* END OF AVATARS ////////////////////////////////////////////////////////////*/

.hidden {
  display: none;
}

@media screen and (max-width: 1899px) {
  .ui-tooltip {
    padding: 0px;
    margin: 0px;
    background: #000 !important;
    border: 2px groove #cd853f !important;
    color: #cd853f !important;
    font-size: 12px !important;
    font-family: Verdana, Geneva, Tahoma, sans-serif !important;
    line-height: 1.3 !important;
    text-align: left !important;
    max-width: 800px !important;
  }

  .ui-tooltip .tooltip-body {
    padding: 10px !important;
  }

  .ui-tooltip .tooltip-body h1 {
    font-size: 18px !important;
    padding: 0px;
    margin: 0px;
    font-variant: small-caps !important;
    font-weight: bold !important;
    text-align: justify !important;
  }

  .ui-tooltip .tooltip-body p {
    margin-top: 20px !important;
    font-style: italic !important;
    text-align: justify !important;
  }

  .ui-tooltip .tooltip-body .info {
    padding-top: 10px;
    text-align: left;
  }

  .ui-tooltip .tooltip-body ul {
    padding-left: 25px;
  }

  .tooltip-body-weather h2 {
    padding-left: 5px;
    text-align: center;
    padding-top: 1rem;
    font-family: "Berkshire Swash", cursive;
    font-size: 1.2rem;
    color: rgba(220, 137, 24, 1);
  }

  .tooltip-body-weather p {
    margin-top: 20px !important;
    font-style: italic !important;
    text-align: justify !important;
    padding: 10px;
    background-color: rgb(105 91 77 / 36%);
    font-size: 0.7rem;
  }

  .tooltip-body-weather {
    width: 300px;
    padding: 10px !important;
  }

  .tooltip-body-weather ul {
    padding-left: 25px;
  }

  .tooltip-body-weather li {
    padding-left: 25px;
    list-style: none;
  }

  .onlinelist-tooltip h3 {
    text-align: center;
    font-family: "Berkshire Swash", cursive;
    font-size: 1rem;
    color: rgba(220, 137, 24, 1);
    margin-top: -25px;
  }

  .onlinelist-tooltip {
    padding: 10px;
    width: 350px;
  }

  .onlinelist-tooltip img {
    float: right;
    margin-top: 10px;
    padding-right: 5px;
    padding-bottom: 5px;
    max-width: 100px;
    max-height: 100px;
  }

  .onlinelist-tooltip p {
    font-size: 0.8rem;
  }
}
@media screen and (min-width: 1900px) {
  .ui-tooltip {
    padding: 0px;
    margin: 0px;
    background: #000 !important;
    border: 2px groove #cd853f !important;
    color: #cd853f !important;
    font-size: 14px !important;
    font-family: Verdana, Geneva, Tahoma, sans-serif !important;
    line-height: 1.3 !important;
    text-align: left !important;
    max-width: 800px !important;
  }

  .ui-tooltip .tooltip-body {
    padding: 10px !important;
  }

  .ui-tooltip .tooltip-body h1 {
    font-size: 18px !important;
    padding: 0px;
    margin: 0px;
    font-variant: small-caps !important;
    font-weight: bold !important;
    text-align: center !important;
  }

  .ui-tooltip .tooltip-body p {
    margin-top: 20px !important;
    font-style: italic !important;
    text-align: justify !important;
  }

  .ui-tooltip .tooltip-body .info {
    padding-top: 10px;
    text-align: left;
  }

  .ui-tooltip .tooltip-body ul {
    padding-left: 25px;
  }

  .tooltip-body-weather h2 {
    padding-left: 5px;
    text-align: center;
    padding-top: 1rem;
    font-family: "Berkshire Swash", cursive;
    font-size: 1.7rem;
    color: rgba(220, 137, 24, 1);
  }

  .tooltip-body-weather p {
    margin-top: 20px !important;
    font-style: italic !important;
    text-align: justify !important;
    padding: 10px;
    background-color: rgb(105 91 77 / 36%);
  }

  .tooltip-body-weather {
    width: 400px;
    padding: 10px !important;
  }

  .tooltip-body-weather ul {
    padding-left: 25px;
  }

  .tooltip-body-weather li {
    padding-left: 25px;
    list-style: none;
  }

  .onlinelist-tooltip h3 {
    text-align: center;
    font-family: "Berkshire Swash", cursive;
    font-size: 1rem;
    color: rgba(220, 137, 24, 1);
    margin-top: -25px;
  }

  .onlinelist-tooltip {
    padding: 10px;
    width: 350px;
  }

  .onlinelist-tooltip img {
    float: right;
    margin-top: 10px;
    padding-right: 5px;
    padding-bottom: 5px;
    max-width: 100px;
    max-height: 100px;
  }

  .onlinelist-tooltip p {
    font-size: 0.8rem;
  }
}

.admin-paging {
  text-align: center;
}

.more-detail-hidden {
  display: none;
}

.more-detail {
  display: block;
}
/*
table.mail-table thead
{
    background-color: #221307;
    font-size: 0.8rem;
}

table.mail-table thead tr th
{
    height: 30px;
    padding-left: 15px;
    padding-right: 15px;
    border-bottom: 1px solid #312317;   
}

table.mail-table tr td
{
    height: 25px;
    border-bottom: 1px solid #312317;
}

table.mail-table tr td:last-child, table.mail-table tr th:last-child
{
    text-align: right;
}

table.mail-table tr:nth-child(even) td
{
    background-color: #180D03;
}

table.mail-table tr.mail-non-read td
{
    background-color: #26180C;
    font-weight: 600;
}

table.mail-table tr.mail-important td
{
    background-color: #180503 !important;
}

table.mail-table tr.mail-non-read.mail-important td
{
    background-color: #2B0E0B !important;
}
*/

.map-detail-head h1 {
  display: contents;
}

.btn.btn-sm.btn-right {
  float: right;
}

/* ////////////////////////////////////////////////////////////////////////// */

#daily-login-window {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-left: -400px;
  margin-top: -175px;
  width: 806px;
  height: 506px;
  background-color: #000000;
  border: 3px double #cd853f;
  z-index: 101;
}

.daily-login-header {
  border: 0px dotted red;
  font-size: x-large;
  font-weight: bold;
  font-variant: small-caps;
  padding: 5px 20px 5px 20px;
}

.daily-login-body {
  border: 0px dotted silver;
  padding-top: 15px;
  background-color: rgba(34, 19, 7, 1);
  display: grid;
  grid-template-columns: auto auto auto auto auto auto auto;
}

.daily-login-day-reward {
  border: 3px solid rgba(205, 134, 63, 0.8);
  height: 75px;
  width: 75px;
  margin-left: 16px;
  margin-bottom: 16px;
  margin-top: 5px;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: contain;
}

.daily-login-day-reward-seventh {
  border: 4px solid rgba(205, 134, 63, 1);
}

.daily-login-day-reward-today {
  border: 5px double gold;
}

.daily-login-day-reward-passed {
  filter: grayscale(80%);
}

.daily-login-day-reward-top-left {
  float: left;
  margin: 1px 0px 0px 3px;
}

.daily-login-day-reward-bottom-right {
  float: right;
  color: white;
  margin: 47px 5px 5px 0px;
}

.daily-login-bottom {
  border: 0px dotted gold;
}

/* **** lookup ************************************************************** */

.lookup-form-input {
  width: 80%;
  height: calc(1.5em + 0.5rem + 2px);
  color: rgba(205, 134, 63, 1);
  background-color: rgb(0, 0, 0);
  background-clip: padding-box;
  border: 1px solid rgba(205, 134, 63, 0.75);
  border-radius: 0.2rem;
  line-height: 1.5;
  padding: 0.25rem 0.5rem;
  float: left;
}

.lookup-form-revealer {
  float: right;
  margin-top: -10px;
}

.lookup-form-revealer button {
  padding-top: 6px;
  padding-bottom: 6px;
}

#lookup-ajax-results {
  margin-top: 25px;
}

#lookup-list-wrapper {
  border: 0px dotted blue;
  margin-top: 10px;
  column-count: 2;
  column-rule-style: dotted;
  column-rule-width: 1px;
}

.lookup-ind-character {
  padding-left: 5px;
  cursor: pointer;
}

#lookup-character-info {
  border: 0px dotted blue;
  margin-top: 10px;
}

#lookup-char-info-name {
  border: 0px dotted green;
  padding: 5px 0px 5px 25px;
  size: portrait 100px;
  font-size: xx-large;
  font-weight: bold;
  /*font-variant: small-caps;*/
  letter-spacing: 1px;
  font-family: Berkshire Swash, cursive;
}

#lookup-char-info-left {
  float: left;
  border: 0px dotted red;
  padding: 20px;
  width: 74%;
}

#lookup-char-info-right {
  float: right;
  border: 0px dotted gold;
  padding: 20px;
  width: 25%;
}

#lookup-char-advinfo-left {
  float: left;
  border: 0px dotted red;
  padding: 20px;
  width: 49%;
}

#lookup-char-advinfo-right {
  float: right;
  border: 0px dotted gold;
  padding: 20px;
  width: 49%;
}

#lookup-char-hist-left {
  float: left;
  border: 0px dotted red;
  padding: 20px;
  width: 49%;
}

#lookup-char-hist-right {
  float: right;
  border: 0px dotted gold;
  padding: 20px;
  width: 49%;
}

/* //////////////////////////////////////////////////////////////////////// */

#statistics-black-gold-list {
  display: grid;
  grid-template-columns: auto auto auto auto auto;
}

.statistics-black-gold-item {
  display: contents;
  border-top: 1px solid rgba(205, 134, 63, 0.8);
}

.statistics-black-gold-cell {
  background-color: #050505;
  padding: 1px 1px 1px 5px;
  margin: 1px 1px 1px 1px;
  max-width: 500px;
  overflow-wrap: break-word;
}

/* ///////////////////////////////////////////////////////////////////////// */

#statistics-whole-table {
  display: grid;
}

.statistics-top-row {
  font-weight: bold;
}

.statistics-top-cell {
}

.statistics-row {
  border: 1px dotted purple;
  padding: 5px;
  display: contents;
  min-height: 400px;
  height: 400px;
}

.statistics-row select {
  color: rgba(205, 134, 63, 0.8);
  background-color: rgb(25, 18, 11);
  border: 1px solid rgba(205, 134, 63, 0.5);
  border-radius: 0.2rem;
  width: 99%;
}

.statistics-row option {
  background-color: rgb(25, 18, 11);
}

.statistics-cell {
  border: 0px dotted gold;
  overflow: hidden;
  padding: 1px 1px 1px 8px;
  margin: 1px 1px 1px 1px;
  text-align: justify;
  background-color: #050505;
}

/* //////// devboard //////////////////////////////////////////////////////// */

#devboard-input-filter {
  float: left;
  width: 80%;
  height: calc(1.5em + 0.5rem + 2px);
  color: rgba(205, 134, 63, 1);
  background-color: rgb(0, 0, 0);
  background-clip: padding-box;
  border: 1px solid rgba(205, 134, 63, 0.75);
  border-radius: 0.2rem;
  line-height: 1;
  padding: 0.25rem 0.5rem;
}

#devboard-select-filter {
  float: left;
  min-width: 50%;
  height: calc(1.5em + 0.5rem + 2px);
  color: rgba(205, 134, 63, 1);
  background-color: rgb(0, 0, 0);
  border: 1px solid rgba(205, 134, 63, 0.75);
  border-radius: 0.2rem;
  line-height: 1.5;
  padding: 0.25rem 0.5rem;
  margin-right: 3px;
}

/* //////// reputace //////////////////////////////////////////////////////// */

.character-reputation-chart {
  border: 0px dotted blue;
}

.character-reputation-item {
  border: 0px dotted red;
  width: 100%;
  margin-top: 2px;
}

.character-reputation-item-left {
  float: left;
  width: 30%;
}

.character-reputation-item-right {
  float: right;
  border: 1px solid silver;
  border-radius: 3px;
  width: 70%;
}