::-webkit-scrollbar-thumb {
  border: 4px solid transparent;
  background-clip: content-box;
  background-color: #cbcbcb;
}

::-webkit-scrollbar {
  width: 14px;
}

::placeholder {
  color: #626565;
  opacity: 1;
}

::selection {
  color: #FFF;
  background-color: #27be7a;
}

.Enterbut {
  background: linear-gradient(#5cb85c, #005d00);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.Enterbut:hover {
  background: linear-gradient(#5cb85c, #5cb85c);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;

}

.select-checkbox {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 54px;
  height: 54px;
  background-color: #65656542;
  border-radius: 4px;
  position: relative;
  cursor: pointer;
  position: absolute;
  z-index: 9999;
}

.photo-box {
  position: relative;
  width: 295px;
  height: 295px;
  margin: 10px;
  overflow: hidden;
  display: inline-block;
  image-rendering: auto;
  cursor: pointer;
}

.photo-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.photo-info {
  position: absolute;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7);
  color: white;
  width: 100%;
  text-align: center;
  padding: 10px;
  display: none;
  padding: 15px;
}

.photo-icons {
  position: absolute;
  top: 0;
  background: rgba(0, 0, 0, 0.7);
  color: white;
  width: 100%;
  text-align: center;
  padding: 10px;
  display: none;
}

.photo-icons img {
  width: 24px;
  height: 24px;
  margin: 0 5px;
  cursor: pointer;
}

.photo-box:hover .photo-info,
.photo-box:hover .photo-icons {
  display: block;
}

.gram-modal {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.5);
}

.gram-modal-content {
  background-color: #fff;
  width: auto;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 20px;
  box-sizing: border-box;
  border-radius: 5px;
  max-width: 360px;
}

.gram-modal-image-container {
  width: 320px;
  height: 320px;
  overflow: hidden;
  position: relative;
}

.gram-modal-image-container img {
  width: 100%;
  height: auto;
}

.gram-modal-comments {
  max-height: 200px;
  overflow-y: auto;
  padding: 10px;
  background: #b9b9b9;
  border-radius: 8px;
  border: 1px solid #959595;
  margin-top: 10px;
}

.comment-box {
  display: flex;
  align-items: flex-start;
  margin-bottom: 10px;
}

.comment-avatar {
  width: 55px;
  height: 55px;
  border-radius: 50%;
  margin-right: 10px;
  background-color: #313131;
}

.avatar-image {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background-color: #313131;
  bottom: 2px;
  left: 5px;
  position: absolute;
}

.comment-content {
  max-width: 80%;
  padding: 10px;
  background: #d6d6d6;
  border-radius: 10px;
  position: relative;
  top: 7px;
  color: #000;
}

.comment-box:last-child {
  margin-bottom: 0;
}

.comments-container {
  max-height: 132px;
  overflow-y: auto;
}

.comment-input {
  display: flex;
  margin-top: 10px;
}

.comment-input input {
  flex: 1;
  padding: 5px;
  border: 1px solid #ccc;
}

.comment-input button {
  padding: 5px 10px;
  border: none;
  background-color: #007bff;
  color: white;
  cursor: pointer;
}

.close-btn {
  position: absolute;
  top: -5px;
  right: 5px;
  font-size: 24px;
  cursor: pointer;
}

.nav-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 24px;
  cursor: pointer;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.7);
  border: none;
  padding: 10px;
}

.nav-arrow.left {
  left: 0;
}

.nav-arrow.right {
  right: 0;
}

.photo-icons span {
  margin-right: 8px;
}

.arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  background-color: rgba(0, 0, 0, 0.7);
  color: white;
  text-align: center;
  line-height: 30px;
  font-size: 24px;
  cursor: pointer;
}

.arrow.left {
  left: 10px;
}

.arrow.right {
  right: 10px;
}

.arrow.disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.fa-heart {
  color: #FF0000;
}

.fa-heart:hover {
  cursor: pointer;
}

.fa-heart-o:hover {
  cursor: pointer;
}

.select-checkbox::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  background-color: rgb(0 0 0 / 26%);
  border-radius: 4px;

}

.select-checkbox::after {
  content: '\2714';
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 25px;
  color: rgb(0 0 0 / 76%);
  transform: translate(-50%, -50%) scale(0);
  transition: transform 0.1s ease-in-out;
  font-weight: 900;
  clip-path: polygon(0 50%, 60% 100%, 100% 15%);
}

.select-checkbox:checked::after {
  transform: translate(-50%, -50%) scale(1);
}

.select-checkbox:checked::before {
  background-color: rgba(106, 140, 43, 0.3);
}

.loader {
  width: 60px;
  display: flex;
  align-items: flex-start;
  aspect-ratio: 1;
}
.loader:before,
.loader:after {
  content: "";
  flex: 1;
  aspect-ratio: 1;
  --g: conic-gradient(from -90deg at 10px 10px,#000 90deg,#FFFF 0);
  background: var(--g), var(--g), var(--g);
  filter: drop-shadow(30px 30px 0 #000);
  animation: l20 1s infinite;
}
.loader:after {
  transform: scaleX(-1);
}
@keyframes l20 {
   0%   {background-position:0     0, 10px 10px, 20px 20px}
   33%  {background-position:10px  10px}
   66%  {background-position:0    20px,10px 10px,20px 0   }
   100% {background-position:0     0, 10px 10px, 20px 20px}
}


.Enterbut:active {
  background: linear-gradient(#006100, #005d00);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.values {
  background-position: center -25px;
  position: absolute;
  left: 5px;
  width: 65px;
  height: 77px;
  background-repeat: no-repeat;
  margin-top: -7px;
}

.stxt {
  margin-bottom: -10%;
  border-radius: 2px;
  padding: 2px 3px 2px 3px;
  background-color: rgba(0, 0, 0, 0.425);
  display: inline-block;
  color: #fff;
  box-shadow: inset 0 0 0 1px rgb(0 0 0 / 19%);
}

.bg-image {
  height: 77px;
  margin: -16px -1px 10px -3px;
  border: solid 1px black;
  border-radius: 2px;
  background: url(/image/Staffbg/image.png) 0px no-repeat !important;
  background-size: cover !important;
  box-shadow: inset 0 0 0 1000px rgb(82 82 82 / 60%), -2px 2px 2px 0px #00000057;
}

.staff-page-background-front {
  background: url(https://i.imgur.com/mit5g5T.png);
  height: 500px;
  border-radius: 0.72rem;
  position: absolute;
  width: 100%;
  pointer-events: none;
  background-position: right;
}

.staff-page-background {
  background: url(https://i.imgur.com/b2Gxbaz.png);
  height: 500px;
  border-radius: 0.72rem;
  background-position: right;
}

.staff-page-background :nth-child(1) {
  position: absolute;
  right: 185px;
  top: 75px;
  cursor: grab;
}

.staff-page-background :nth-child(2) {
  position: absolute;
  right: 339px;
  top: -62px;
  cursor: grab;
}

.staff-page-background :nth-child(3) {
  position: absolute;
  right: 35px;
  top: -35px;
  cursor: grab;
}

.staff-page-background :nth-child(4) {
  position: absolute;
  right: 29px;
  top: 135px;
  cursor: grab;
}

.staff-page-background :nth-child(5) {
  position: absolute;
  right: -35px;
  top: -5px;
  cursor: grab;
}

.staff-page-background :nth-child(6) {
  position: absolute;
  right: 105px;
  top: 170px;
  cursor: grab;
}

.staff-page-background :nth-child(7) {
  position: absolute;
  right: 115px;
  top: 90px;
  cursor: grab;
}

.staff-page-background :nth-child(8) {
  position: absolute;
  right: 180px;
  top: 210px;
  cursor: grab;
}

.staff-page-background :nth-child(9) {
  position: absolute;
  right: 20px;
  top: 230px;
  cursor: grab;
}

.staff-user:hover .staff-info-box {
  visibility: visible;
}

.staff-info-box {
  position: absolute;
  padding: 12px 20px;
  top: 160px !important;
  width: 200px;
  color: #fff;
  background: #212529;
  right: 110px !important;
  border-radius: 0.72rem;
  z-index: 9;
  visibility: hidden;
}

.staff-info-box span {
  font-size: 12px;
  right: 0px !important;
  color: #f3f6f9;
  position: relative !important;
  top: 0px !important;
}

.Logoutbut {
  background: linear-gradient(#9d2626, #a51818);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.Logoutbut:hover {
  background: linear-gradient(#9d2626, #a51818);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.Logoutbut:not(:disabled):not(.disabled).active,
.Logoutbut:not(:disabled):not(.disabled):active {
  background: linear-gradient(#9d2626, #a51818);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.EoHbut {
  background: linear-gradient(#002ca9, #002ca9);
  box-shadow: inset 0 2px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.EoHbut:hover {
  background: linear-gradient(#0042ff, #0042ff);
  box-shadow: inset 0 2px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.EoHbut:not(:disabled):not(.disabled).active,
.EoHbut:not(:disabled):not(.disabled):active {
  background: linear-gradient(#001a65, #001a65);
  box-shadow: inset 0 2px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.username-stats {
  position: relative;
  margin: -50px 0px -2px 65px;
}

.stats {
  position: relative;
  margin: 5px 0px 0 60px;
}

.currency-stats {
  float: right;
  margin-top: -65px;
  margin-right: 10px;
}

/*.instafbox {
  height: 170px;
  width: 382px;
  border: 1px solid #000;
  border-radius: 3px;
  box-shadow: inset 0 0 0 1000px rgb(82 82 82 / 55%), -2px 2px 2px 0px #00000057;
  margin: -20px -16px;
}*/

.instafbox {
  height: 205px;
  width: 382px;
  border: 1px solid #000;
  border-radius: 3px;
  box-shadow: inset 0 0 0 1000px rgb(82 82 82 / 55%), -2px 2px 2px 0px #00000057;
  margin: -20px -16px;
}

.avnewscom {
  width: 70px;
  height: 60px;
  -webkit-filter: drop-shadow(1px 0 1px #fff) drop-shadow(-1px 0 1px #fff) drop-shadow(0 -1px 1px #fff) drop-shadow(0 1px 1px #fff);
  filter: drop-shadow(1px 0 1px #fff) drop-shadow(-1px 0 1px #fff) drop-shadow(0 -1px 1px #fff) drop-shadow(0 1px 1px #fff);
  background-color: #000;
  margin-left: 10px;
  margin-top: 7px;
}

:-ms-input-placeholder {
  color: #626565
}

::-ms-input-placeholder {
  color: #626565
}

html {
  scroll-behavior: smooth
}

.meBox {
  margin-bottom: 10px;
  border-radius: 3px;
  box-shadow: 2px 2px 0px rgb(0 0 0 / 10%), -2px -2px 0px rgb(0 0 0 / 10%), -2px 2px 0px rgb(0 0 0 / 5%), 2px -2px 0px rgb(0 0 0 / 5%);
  height: 200px;
  -webkit-animation: clouds 100s linear infinite;
  animation: clouds 100s linear infinite;
  background: repeat-x, bottom / 300px url(/image/bg_pattern_clouds.gif), linear-gradient(0deg, rgba(43, 215, 253, 1) 1%, rgba(1, 134, 255, 1) 100%);
}

.meBox #userimg {
  position: absolute;
  margin-left: 16px;
  height: 180px;
  width: 68px;
  margin-top: 10px;
  border-radius: 0.25rem !important;
  overflow: hidden;
  background-color: #343a40;
  border: 1px solid rgba(0, 0, 0, 0.3) !important;
  box-shadow: 2px 2px rgba(0, 0, 0, 0.3019607843), inset 0 -3px rgba(0, 0, 0, 0.2509803922) !important;
}

.meBox #userimg img {
  margin-top: 30px;
  margin-left: -2px;
  -webkit-filter: drop-shadow(0 1px 0 #FFF) drop-shadow(0 -1px 0 #FFF) drop-shadow(1px 0 0 #FFF) drop-shadow(-1px 0 0 #FFF) drop-shadow(0 0 10px transparent);
  filter: drop-shadow(0 1px 0 #FFF) drop-shadow(0 -1px 0 #FFF) drop-shadow(1px 0 0 #FFF) drop-shadow(-1px 0 0 #FFF) drop-shadow(0 0 10px transparent);
}

.meBox .transparant {
  display: inline-block;
  width: 100%;
  height: 100%;
  background: url(/application/theme/ify/assets/images/GIF/bg.gif) -18px -221px;
  border-radius: 3px;
  background-repeat: no-repeat;
}

.bg-layer {
  background: rgb(0 0 0 / 48%);
  display: inline-block;
  height: 100%;
  width: 100%;
  border-radius: 3px;
}

.meBox .transparant li {
  list-style: none;
  margin-top: 45px;
  width: 70%;
  margin-left: 95px;
}

@media (min-width: 992px) and (max-width: 1199px) {
  .join_discord_button {
    margin-top: 30px !important;
  }

  .discord .discord_padding {
    padding: 0px !important;
  }
}

.join_discord_button-index {
  margin-top: -6px;
  background-color: rgb(0 0 0 / 14%);
  border-top: 1px solid rgb(0 0 0 / 14%);
  padding: 21px;
  text-align: center;
  color: #fff;
  text-shadow: 1px 1px rgb(0 0 0 / 50%);
}

.discord .discord_padding-index {
  padding: 21px;
}

@media (min-width: 992px) and (max-width: 1199px) {
  .join_discord_button-index {
    margin-top: 35px !important;
  }

  .discord .discord_padding-index {
    padding: 50px !important;
  }
}

.meBox .transparant li h1 {
  margin: 0px;
  padding: 0px;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  text-shadow: 0px 1px #ffffff7d;
}

.meBox .transparant li h2 {
  margin: 0px 0px 20px 0px;
  padding: 0px;
  color: #fff;
  text-align: center;
  font-size: 12px;
  font-weight: normal;
}

.allnews {
  margin-bottom: 1px;
  padding: 9px;
  border-bottom: 1px solid #343434c2;
  box-shadow: inset 0 0 0 1000px rgb(0 0 0 / 40%);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: right;
  color: #fff;
  transition: all ease-in-out 0.2s;
  border-radius: 5px;
  margin-bottom: 5px;
  text-shadow: none;
}

.allnews.active {
  box-shadow: inset 0 0 0 1000px rgb(0 0 0 / 86%);
  color: #fff;
}

.allnews:hover {
  box-shadow: inset 0 0 0 1000px rgb(0 0 0 / 86%);
  color: #fff;
}

.avnewsimg {
  background: url(/image/newsimages/news19.png);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: right;
}

.avnews {
  width: 100px;
  height: 96px;
  position: absolute;
  margin-top: -3px;
  -webkit-filter: drop-shadow(1px 0 1px #fff) drop-shadow(-1px 0 1px #fff) drop-shadow(0 -1px 1px #fff) drop-shadow(0 1px 1px #fff);
  filter: drop-shadow(1px 0 1px #fff) drop-shadow(-1px 0 1px #fff) drop-shadow(0 -1px 1px #fff) drop-shadow(0 1px 1px #fff);
  right: 0;
}

.avnewsimg {
  padding: 23px 12px;
  border-radius: 7px;
  background-color: #e4e4e4;
  font-size: 13px;
  /* text-align: center; */
  background: url(/image/newsimages/promo_chatting.png);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: right;
  box-shadow: inset 0 0 0 1000px rgb(0 0 0 / 47%), -2px 2px 2px #c7c7c7;
  color: #fff;
  text-shadow: none;
}

.me-stats-box.credits {
  /* background: #cc9900; */
  background: #f3ce1c;
}

.me-stats-box img {
  margin: -4px 0px 0px 0px;
}

.me-stats-box.diamonds {
  /* background: #3bafe2; */
  background: #7dcdef;
}

.me-stats-box.duckets {
  /* background: #784ea4; */
  background: #832275;
}



.me-stats-box {
  height: 40px;
  text-align: center;
  line-height: 40px;
  font-weight: 500;
  border-radius: 5px;
  margin: 5px;
  box-shadow: inset 0px -20px rgb(0 0 0 / 8%), 0px 2px rgb(0 0 0 / 10%), inset 0px -1px 0 0px rgb(0 0 0 / 6%);
  border: 1px solid rgb(0 0 0 / 20%);
  /* color: white; */
}

body {
  font-family: 'Roboto Condensed';
  background-color: #f0f0f0;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background: url(https://habland.pw/image/background.png);
}

.langswitch {
  padding-right: 0.7rem !important;
  padding-left: 0.7rem !important;
  padding-top: 0.1rem;
  padding-bottom: 0.1rem;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.snowflake {
  -webkit-animation-duration: 10s, 3s;
  animation-duration: 10s, 3s;
  -webkit-animation-iteration-count: infinite, infinite;
  animation-iteration-count: infinite, infinite;
  -webkit-animation-name: snowflakes-fall, snowflakes-shake;
  animation-name: snowflakes-fall, snowflakes-shake;
  -webkit-animation-play-state: running, running;
  animation-play-state: running, running;
  -webkit-animation-timing-function: linear, ease-in-out;
  animation-timing-function: linear, ease-in-out;
  color: #fff;
  cursor: default;
  font-family: Arial, sans-serif;
  font-size: 1em;
  position: fixed;
  /*text-shadow: 0 0 5px #000;*/
  top: -10%;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  z-index: 9999
}

.snowflake:nth-of-type(0) {
  animation-delay: 0s, 0s;
  left: 1%
}

.snowflake:first-of-type {
  animation-delay: 1s, 1s;
  left: 10%
}

.snowflake:nth-of-type(2) {
  animation-delay: 6s, .5s;
  left: 20%
}

.snowflake:nth-of-type(3) {
  animation-delay: 4s, 2s;
  left: 30%
}

.snowflake:nth-of-type(4) {
  animation-delay: 2s, 2s;
  left: 40%
}

.snowflake:nth-of-type(5) {
  animation-delay: 8s, 3s;
  left: 50%
}

.snowflake:nth-of-type(6) {
  animation-delay: 6s, 2s;
  left: 60%
}

.snowflake:nth-of-type(7) {
  animation-delay: 2.5s, 1s;
  left: 70%
}

.snowflake:nth-of-type(8) {
  animation-delay: 1s, 0s;
  left: 80%
}

.snowflake:nth-of-type(9) {
  animation-delay: 3s, 1.5s;
  left: 90%
}

.snowflake:nth-of-type(10) {
  animation-delay: 2s, 0s;
  left: 25%
}

.snowflake:nth-of-type(11) {
  animation-delay: 4s, 2.5s;
  left: 65%
}

@keyframes snowflakes-fall {
  0% {
    top: -10%
  }

  to {
    top: 100%
  }
}

@keyframes snowflakes-shake {

  0%,
  to {
    transform: translateX(0)
  }

  50% {
    transform: translateX(80px)
  }
}

.langswitch:hover {
  background-color: #f0f0f0;
}

header {
  display: flex;
  width: 100%;
  height: 300px;
  border-bottom: 3px solid #ffffff;
  /*-webkit-animation: clouds 70s linear infinite;
  animation: clouds 70s linear infinite;
  background: no-repeat, url(/image/bg_pattern_clouds.gif), linear-gradient(175deg, rgba(0, 198, 255, 1) 0%, rgba(0, 77, 111, 1) 100%);
  background: no-repeat, url(/image/BannerWeb1.png?3), linear-gradient(175deg, rgba(0, 198, 255, 1) 0%, rgba(0, 77, 111, 1) 100%);*/
  background: no-repeat, url(/image/Zen2025_CMSBanner_byLFM.PNG?3);
}

/*
header {
  display: flex;
  width: 100%;
  height: 300px;
  border-bottom: 3px solid #ffffff;
  background: url(https://habland.pw/image/halloweentoplight.png?1) -100px -500px, linear-gradient(145deg, rgb(0 30 91) 0%, rgb(0 0 0) 100%);
}
*/
.header-custom-mt {
  margin-top: 85px;
}

header .enter {
  color: #fff;
  text-decoration: none !important;
}

header .enter div {
  background-color: #5cb85c;
  border-radius: 5px;
  width: 100%;
  text-align: center;
  padding: 5px;
  margin-bottom: 5px;
  box-shadow: 0 2px 10px rgba(50, 50, 50, .5);
  text-decoration: none;
}

header .enter div:focus,
header .enter div:hover {
  color: #fff;
  background-color: #89cdf0;
}

header .enter div i {
  margin-right: 5px;
}

header .online {
  background-color: rgba(11, 11, 10, .7);
  border: 2px solid #4d4b46;
  border-radius: 5px;
  width: 100%;
  color: #fff;
  text-align: center;
  padding: 5px;
}

header .online i {
  margin-right: 5px;
}

.onlinebeta {
  background-color: rgba(11, 11, 10, .7);
  border: 2px solid #4d4b46;
  border-radius: 5px;
  width: 20%;
  color: #fff;
  text-align: center;
  padding: 5px;
}

.navigation-icon {
  width: 25px;
  height: 25px;
  background-repeat: no-repeat;
  background-position: center;
  display: inline-flex;
  margin-right: 0.35rem;
}

.navigation-icon.active {
  opacity: 1;
}

.navigation-icon.home {
  background-image: url(../assets/home_icon.gif);
}

.navigation-icon.community {
  background-image: url(../assets/community_icon.gif);
}

.ify-nav-nologin {
  box-shadow: 0px 1px #c3c3c3, inset 0px -1px rgb(0 0 0 / 20%), inset 0 1px rgb(0 0 0 / 20%);
  margin-bottom: 0px;
  border-bottom: 3px solid #fff;
  border-top: 3px solid #fff;
}

.ify-nav {
  box-shadow: inset 0 1px rgb(0 0 0 / 20%), 0px 1px rgb(0 0 0 / 8%);
  margin-bottom: 0px;
  border-top: 3px solid #fff;
}

.navbar-nav .nav-link {
  display: flex;
  align-items: center;
  text-transform: uppercase;
  font-weight: 600;
}

.nav-item {
  padding-right: .8rem;
  padding-left: .8rem;
}

@media (max-width: 991px) {
  .nav-item {
    padding-top: .8rem;
  }
}

.contentarea {
  border-radius: 4px;
  background-color: #fff;
  position: relative;
  z-index: 2;
  padding: 3px;
  border: 1px solid #d5d5d5;
  box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .09) !important;
  margin-bottom: 10px;
}

.contentarea_inner {
  border-radius: 3px;
  background-color: #f8f9fa;
  border: 1px solid #e3e3e3;
  font-size: 14px;
  color: #909090;
}

.contentarea_header {
  background-image: url(https://habland.pw/image/cardhead.png);
  background-size: contain;
  height: 44px;
  width: 100%;
  font-size: 15px;
  color: #fff;
  font-weight: 900;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
  margin-bottom: 5px;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1), inset 0 0 0 2px rgba(255, 255, 255, 0.27), 0 2px 0 rgba(0, 0, 0, 0.14);
}

/*
.contentarea_header {
  height: 44px;
  box-shadow: inset 0px -22px rgb(0 0 0 / 8%), 0px 2px rgb(0 0 0 / 14%), inset 0px -1px 0 0px rgb(0 0 0 / 6%);
  border: 1px solid rgb(0 0 0 / 18%);
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  color: #fff;
  font-weight: 700;
  text-shadow: 1px 1px rgb(0 0 0 / 30%);
  font-size: 16px;
  box-shadow: rgb(0 0 0 / 17%) 0px -23px 25px 0px inset, rgb(0 0 0 / 15%) 0px -36px 30px 0px inset, rgb(0 0 0 / 10%) 0px -79px 40px 0px inset, rgb(0 0 0 / 6%) 0px 2px 1px, rgb(0 0 0 / 9%) 0px 4px 2px, rgb(0 0 0 / 9%) 0px 8px 4px, rgb(0 0 0 / 9%) 0px 16px 8px, rgb(0 0 0 / 9%) 0px 32px 16px;
}*/

.contentarea_header_icon_padding {
  padding: 10px 10px 10px 48px;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.contentarea_header_noicon_padding {
  padding: 10px;
}

.contentarea_header_icon {
  position: absolute;
  background-color: rgb(0 0 0 / 10%);
  height: 43px;
  width: 35px;
  padding: 8px 8px 8px 10px;
  border-right: 1px solid rgb(0 0 0 / 15%);
  box-shadow: 1px 0px rgb(255 255 255 / 12%);
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
}

.contentarea_header.green {
  background-color: #3f9f5f;
}

.contentarea_header.blue {
  background-color: #62bde5;
}

.contentarea_header.orange {
  background-color: #dba332;
}

.contentarea_header.purple {
  background-color: #e99bdc;
}

.contentarea_padding {
  padding: 8px;
  text-shadow: 1px 1px #ffffff7d;
  color: #909090;
}

/*.staffbox {
  margin-top: -164px;
  margin-left: -6px;
  border: 1px solid #000;
  width: 67px;
  height: 60px;
  border-radius: 3px;
  box-shadow: -2px 2px 2px 0px #00000057;
}*/
.staffbox {
  margin-top: -193px;
  margin-left: -10px;
  border: 1px solid #000;
  width: 68px;
  height: 180px;
  border-radius: 0.25rem !important;
  border: 1px solid rgba(0, 0, 0, 0.3) !important;
  box-shadow: 2px 2px rgba(0, 0, 0, 0.3019607843), inset 0 -3px rgba(0, 0, 0, 0.2509803922) !important;
}

.grbox-staff {
  border-radius: 4px;
  background-color: #fff9;
  position: relative;
  z-index: 2;
  padding: 3px;
  border: 1px solid #d5d5d5;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, .09) !important;
  margin-bottom: 10px;
  overflow: hidden;
  line-height: 22px;
}

.contentarea_header-staff {
  height: 50px;
  box-shadow: inset 0px -22px rgb(0 0 0 / 8%), 0px 2px rgb(0 0 0 / 14%), inset 0px -1px 0 0px rgb(0 0 0 / 6%);
  border: 1px solid rgb(0 0 0 / 18%);
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  color: #fff;
  font-weight: 700;
  text-shadow: 1px 1px rgb(0 0 0 / 30%);
  font-size: 16px;
}

.contentarea_header_icon-staff {
  position: absolute;
  background-color: rgb(0 0 0 / 10%);
  padding: 8px 8px 8px 10px;
  border-right: 1px solid rgb(0 0 0 / 15%);
  box-shadow: 1px 0px rgb(255 255 255 / 12%);
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
  width: 50px;
  height: 49px;
}

.contentarea_header_icon_padding-staff {
  padding: 15px 10px 12px 55px;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}


.stff-infobx {
  width: 295px;
  height: 180px;
  padding: 5px;
  position: relative;
  margin: -180px 0px 0 63px;
  border-radius: 0.25rem !important;
  border: 1px solid rgba(0, 0, 0, 0.3) !important;
  box-shadow: 2px 2px rgba(0, 0, 0, 0.3019607843), inset 0 -3px rgba(0, 0, 0, 0.2509803922) !important;
  background: rgba(0, 0, 0, 0.3);
}

/*.custom-staff-box {
  font-size: 0.92rem;
  float: left;
  margin: 0 0 11px 5px;
  width: 409px;
  border-radius: 6px;
  height: 200px;
  overflow: hidden;
  padding: 30px;
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 0px rgb(0 0 0 / 20%);
  color: #fff;
}*/

.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed position */
  z-index: 1000; /* Higher than other content */
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.5); /* Semi-transparent black background */
}

.modal-content {
  position: fixed; /* Fixed position to overlay */
  top: 50%; /* Center vertically */
  left: 50%; /* Center horizontally */
  transform: translate(-50%, -50%); /* Translate to center */
  display: block;
  width: 50%; /* Adjust width as needed */
  max-width: 500px; /* Maximum width */
  pointer-events: auto;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgb(0 0 0 / 20%);
  border-radius: .3rem;
  outline: 0;
  padding: 35px;
  z-index: 1001; /* Ensure modal is above other content */
  color: #000;
}

.badges-badge-image {
  height: 55px;
  width: 55px;
  display: inline-block;
  border: 1px solid #909090;
  border-radius: 5px;
  box-shadow: 2px 2px rgb(0 0 0 / 30%), inset 0 -1px rgba(0, 0, 0, 0.25) !important;
  position: relative;
  overflow: hidden;
  background-color: rgb(197 197 197 / 80%) !important;
  cursor: pointer;
}

.badges-badge-wrapper .badge-code-name {
  position: absolute;
  top: -43px;
  left: 47%;
  transform: translateX(-50%);
  padding: 5px;
  background-color: rgb(31 31 31);
  border: 1px solid rgb(37 37 37);
  border-radius: 5px;
  box-shadow: 0 2px 4px rgb(0 0 0 / 15%);
  z-index: 1;
  white-space: nowrap;
  font-size: 15px;
  text-align: center;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  color: #FFF;
  font-weight: 900;
}



.badges-badge-wrapper .badge-code-name::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: solid transparent;
  border-width: 8px;
  border-top-color: rgb(31 31 31);
}

.stf-badge-image {
  height: 50px;
  width: 50px;
  display: inline-block;
  border: 1px solid #000;
  border-radius: 5px;
  background-position: center center;
  box-shadow: 2px 2px rgba(0, 0, 0, 0.3019607843), inset 0 -3px rgba(0, 0, 0, 0.2509803922) !important;
  margin-right: 5px;
}

.custom-staff-box {
  font-size: 0.92rem;
  float: left;
  margin: 0 0 11px 5px;
  width: 409px;
  border-radius: 6px;
  height: 230px;
  overflow: hidden;
  padding: 30px;
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 0px rgb(0 0 0 / 20%);
  color: #fff;
}

.custom-staff-box-position {
  position: relative;
  margin: 4px 0 0 0px;
}

/*.custom-staff-username-position {
  position: relative;
  margin: -62px 0px 0 65px;
}*/

.custom-staff-username-position {
  position: relative;
  margin: -184px 0px 0 67px;
}

.custom-staff-status-position {
  position: relative;
  margin: 0px 0px 0 67px;
}

.custom-staff-status {
  border: 1px solid #fff;
  padding: 0px 7px;
  margin-right: -5px;
  border-radius: 3px;
  box-shadow: inset 0 3px rgb(255 255 255 / 20%), inset 0 -3px rgb(0 0 0 / 1%), inset 0 0 0 2px rgb(0 0 0 / 20%);
  float: right;
}

.custom-staff-tickets-position {
  position: relative;
  margin: 0px 0px 0 67px;
}

.custom-staff-flag-position {
  position: relative;
  margin: 0px 0px 0 67px;
}

.custom-staff-motto-position {
  position: relative;
  margin: 0px 0px 0 67px;
}

.custom-staff-role {
  position: relative;
  border: 1px solid #fff;
  padding: 3px 5px;
  margin-left: -6px;
  border-radius: 3px;
  width: 360px;
  box-shadow: inset 0 3px rgb(255 255 255 / 20%), inset 0 -3px rgb(0 0 0 / 1%), inset 0 0 0 2px rgb(0 0 0 / 20%);
}

@media (max-width: 768px) {
  .instafbox {
    width: 440px;
  }

  .stff-infobx {
    width: 350px;
  }

  .custom-staff-box {
    margin: 0 0 11px 0;
    width: 468px;
  }

  .custom-staff-role {
    width: 418px;
  }
}

@media (min-width: 769px) and (max-width: 991px) {
  .instafbox {
    width: 280px;
    margin: -20px -17px;
  }

  .stff-infobx {
    width: 190px;
  }

  .custom-staff-role {
    width: 257px;
  }

  .custom-staff-box {
    margin: 0 0 11px 10px;
    width: calc(50% - 15px);
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .instafbox {
    width: 400px;
    margin: -20px -17px;
  }

  .stff-infobx {
    width: 310px;
  }

  .custom-staff-role {
    width: 380px;
  }

  .custom-staff-box {
    margin: 0 0 11px 10px;
    width: calc(50% - 15px);
  }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .instafbox {
    width: 490px;
    margin: -20px -17px;
  }

  .stff-infobx {
    width: 400px;
  }

  .custom-staff-role {
    width: 468px;
  }

  .custom-staff-box {
    margin: 0 0 11px 10px;
    width: calc(50% - 15px);
  }
}

@media (min-width: 195px) and (max-width: 372px) {
  .instafbox {
    width: 250px;
    margin: -20px -17px;
  }

  .stff-infobx {
    width: 160px;
  }

  .custom-staff-role {
    width: 230px;
  }

  .custom-staff-box {
    margin: 0 0 11px 10px;
    width: 280px;
  }
}

@media (min-width: 373px) and (max-width: 413px) {
  .instafbox {
    width: 250px;
    margin: -20px -17px;
  }

  .stff-infobx {
    width: 160px;
  }

  .custom-staff-role {
    width: 230px;
  }

  .custom-staff-box {
    margin: 0 0 11px 10px;
    width: 280px;
  }
}

@media (min-width: 400px) and (max-width: 439px) {
  .instafbox {
    width: 302px;
    margin: -20px -17px;
  }

  .stff-infobx {
    width: 213px;
  }

  .custom-staff-role {
    width: 280px;
  }

  .custom-staff-box {
    margin: 0 0 11px 10px;
    width: 330px;
  }
}

@media (min-width: 440px) and (max-width: 517px) {
  .instafbox {
    width: 337px;
    margin: -20px -17px;
  }


  .stff-infobx {
    width: 248px;
  }

  .custom-staff-role {
    width: 315px;
  }

  .custom-staff-box {
    margin: 0 0 11px 10px;
    width: 365px;
  }
}


.hxmtenttext {
  padding: 8px;
}

.hxmtenttext h3 {
  margin-top: 0;
  font-size: 18px;
}

.hxmtenttext.style1 {
  border: 1px solid #e5e5e5;
  padding: 10px 10px;
  margin: 15px;
  border-radius: 3px;
  box-shadow: 4px 4px 5px #b9b9b9;
}

.headercontnews {
  height: 160px;
  border-radius: 3px;
  z-index: 4;
  position: relative;
  margin-bottom: 22px;
  box-shadow: 5px 5px 5px #b9b9b9;
  border: 1px solid #6e6e6e;
}

.headercontnewsmaintext {
  position: absolute;
  color: #fff;
  font-size: 26px;
  font-weight: bold;
  margin: 35px 0 0 60px;
  text-shadow: 0px 2px #00000052;
}

.headercontnewsothertext {
  position: absolute;
  color: #fff;
  font-size: 14px;
  margin: 75px 0 0 60px;
  text-shadow: 0px 1px #00000052;
  max-width: 500px;
}

.headercont {
  height: 160px;
  border-radius: 3px;
  z-index: 4;
  position: relative;
  margin-bottom: 22px;
  box-shadow: inset 0 6px rgb(255 255 255 / 25%), inset 0 -5px rgb(255 255 255 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%);
}

.headercontmaintext {
  position: absolute;
  color: #fff;
  font-size: 26px;
  font-weight: bold;
  margin: 50px 0 0 420px;
  text-shadow: 0px 2px #00000052;
}

.headercontothertext {
  position: absolute;
  color: #fff;
  font-size: 14px;
  margin: 90px 0 0 420px;
  text-shadow: 0px 1px #00000052;
}

.whichpage {
  display: flex;
  background: url(../assets/skyline.png) left bottom -28px, linear-gradient(#55d2e1, #4087a7);
  background-size: 24%;
  background-color: #1fa1d9;
  height: 160px;
  border-radius: 3px;
  box-shadow: inset 0px -1px rgb(0 0 0 / 8%);
  border: 1px solid #00000024;
  align-items: center;
  color: #fff;
  font-size: 24px;
  text-shadow: 2px 2px rgb(0 0 0 / 30%);
  font-weight: 700;
}

.whichpagesmall {
  font-size: 19px;
}

.whichpagesmall a {
  text-decoration: none;
  font-weight: 700;
  color: #fff;
}

.whichpage_hotel_left {
  height: 160px;
  background-position: center;
  position: absolute;
  background: repeat-x, bottom / 301px url(/image/bg_pattern_clouds.gif);
  width: 99.5%;
  animation: clouds 40s linear infinite;
}

.container-index {
  width: 50%;
}

.custom {
  margin-top: -90px;
}

.category_outer {
  height: 60px;
  overflow: hidden;
  text-shadow: 1px 1px #ffffff7d;
  color: #909090;
  padding: 8px;
  background-color: #0000000f;
  border-bottom: 1px solid #00000017;
  margin-top: 1px;
}

.category_outer .habbo {
  margin: -10px 0 0 0;
  width: 54px;
  height: 50px;
}

.category_outer .username {
  margin: -38px 0 0 58px;
  font-weight: bold;
}

.category_outer .currency {
  margin: 0px 0 0 58px;
}

.category_outer .right_side {
  float: right;
  margin: -60px 10px 0 0;
  font-weight: bold;
  border-radius: 100%;
  background-color: #b8c4d4;
  padding: 6px;
}

.activity-box.user {
  width: 100%;
  height: 77px;
  background: #00000059;
  border-radius: 0.72rem !important;
  ;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -ms-transition: 1s;
  -webkit-transition: 1s;
  margin-bottom: 5px;
}

.activity-box.user #avatar {
  width: 36px;
  height: 74px;
  position: absolute;
  margin-left: 10px;
  margin-top: 3px;
  -webkit-filter: drop-shadow(0 1px 0 #FFF) drop-shadow(0 -1px 0 #FFF) drop-shadow(1px 0 0 #FFF) drop-shadow(-1px 0 0 #FFF) drop-shadow(0 0 10px transparent);
  filter: drop-shadow(0 1px 0 #FFF) drop-shadow(0 -1px 0 #FFF) drop-shadow(1px 0 0 #FFF) drop-shadow(-1px 0 0 #FFF) drop-shadow(0 0 10px transparent);
}

.activity-box.user #name {
  padding-bottom: 8px;
  background: #fff;
  border-radius: 0.72rem !important;
  width: calc(100% - 78px);
  height: 67px;
  padding-left: 10px;
  padding-top: 8px;
  position: absolute;
  margin-left: 56px;
  margin-top: 5px;
  font-family: Segoe UI;
  font-size: 11px;
  color: #000;
}

.headercontnewsmaintext {
  position: absolute;
  color: #fff;
  font-size: 26px;
  font-weight: bold;
  margin: 35px 0 0 60px;
  text-shadow: 0px 2px #00000052;
}

.headercontnewsothertext {
  position: absolute;
  color: #fff;
  font-size: 14px;
  margin: 75px 0 0 60px;
  text-shadow: 0px 1px #00000052;
  max-width: 500px;
}

.headercontnews {
  height: 160px;
  border-radius: 5px;
  z-index: 4;
  position: relative;
  margin-bottom: 22px;
  box-shadow: 5px 5px 5px #b9b9b9;
  border: 1px solid #6e6e6e;
}

.activity-box.user #name:before {
  content: '';
  background: #fff;
  width: 9px;
  height: 9px;
  position: absolute;
  transform: rotate(45deg);
  margin-top: 10px;
  margin-left: -15px;
}

.activitys {
  width: 100%;
  position: relative;
  max-height: 270px;
  float: left;
  padding-right: 20px;
  margin-top: -30px;
  display: block;
  background: #fff;
  overflow-x: hidden;
  border-radius: 0.72rem !important;
}

.activitys::-webkit-scrollbar {
  width: 3px;
}

.activitys::-webkit-scrollbar-track {
  background: #0000000d;
  /*border-radius: 0.72rem!important;*/
}

.activitys::-webkit-scrollbar-thumb {
  /*border-radius: 0.72rem!important;*/
  background: #212529;
  max-height: 30px;
}

.table {
  color: #000;
}

.submitBtn {
  position: relative;
  bottom: 0;
  left: 0;
  border-radius: 3px;
  border: 0;
  cursor: pointer;
  text-align: center;
  height: 35px;
  color: #fff;
  width: 100%;
  border: none;
  outline: none;
  /* background: #3ba800;
  box-shadow: 0 1px 0 #2aa12c;
  border-bottom: 2px solid #218123;*/
  background: #52b567;
  box-shadow: 0 1px 0 #52b567;
  border-bottom: 2px solid #46a548;
  transition: all cubic-bezier(0.18, 0.89, 0.32, 1.28) 0.2s;
}

.submitBtn:hover {
  background: #2bb72e;
}

.submitBtn:active {
  box-shadow: 0 1px 0 #2e9f30;
  border-bottom: 2px solid #46bb49;
}

.navbar {
  /*background: linear-gradient(130deg, #00a6b7 0%, #007c89 80%, #005d67 90%, #002f35 100%);
  background: linear-gradient(130deg, #981d25 0%, #4a1e1b 80%, #41251b 90%, #391c16 100%);*/
  background: linear-gradient(130deg, #1cc274 0%, #1cb86f 80%, #0c7745 90%, #0e894e 100%);
  color: #ffffff !important;
  margin-bottom: 10px;
  border: 3px solid white;
  border-radius: 6px;
  box-shadow: inset 0px -28px rgb(0 0 0 / 8%), 0px 0px rgb(0 0 0 / 19%), inset 0px -1px 0 0px rgb(0 0 0 / 6%), rgb(0 0 0 / 2%) 0px 1px 3px 0px, rgb(27 31 35 / 15%) 0px 0px 0px 1px;
  padding: 0.5rem;
  animation: gradient 1s linear infinite;
  animation-direction: alternate;
  background-size: 200% 100%;
}

@keyframes gradient {
  0% {
    background-position: 0%
  }

  100% {
    background-position: 100%
  }
}

.black .dropdown-item.active,
.black .dropdown-item:active {
  text-decoration: none;
  background: rgb(70 70 70);
  color: #fff;
  box-shadow: inset 0px -16px rgb(0 0 0 / 5%), 0px 2px rgb(0 0 0 / 10%), inset 0px -1px 0 0px rgb(0 0 0 / 6%);
}

.dropdown-item:focus,
.dropdown-item:hover {
  text-decoration: none;
  background: rgb(9 95 166) !important;
  color: #fff !important;
  box-shadow: inset 0px -16px rgb(0 0 0 / 5%), 0px 2px rgb(0 0 0 / 10%), inset 0px -1px 0 0px rgb(0 0 0 / 6%);
}

.dropdown-menu:before {
  top: -7px;
  right: 50%;
  transform: translateX(50%);
  border-right: 7px solid transparent;
  border-bottom: 7px solid #ccc;
  border-left: 7px solid transparent;
  border-bottom-color: rgb(255 255 255);
}

.dropdown-menu:after,
.dropdown-menu:before {
  position: absolute;
  display: inline-block;
  content: "";
}

.nav-link:hover,
.nav-link:focus {
  color: #000;
  background: #ffffff78;
  border-radius: 5px;
  padding: 8px;
  color: #fff;
  background: #ffffff59;
  border-radius: 5px;
  padding: 8px !important;
  box-shadow: rgb(8 0 16 / 17%) 0px 0px 0px 2px, rgb(0 0 0 / 29%) 0px 4px 6px -1px, rgb(255 255 255 / 8%) 0px 1px 0px inset;
}


.nav-link.active {
  color: #fff;
  background: #ffffff59;
  border-radius: 5px;
  padding: 8px !important;
  box-shadow: rgb(8 0 16 / 17%) 0px 0px 0px 2px, rgb(0 0 0 / 29%) 0px 4px 6px -1px, rgb(255 255 255 / 8%) 0px 1px 0px inset;
}

.nav-link {
  color: #fff;
  padding: 8px !important;
}

.user-stats {
  width: 54px;
  height: 53px;
  margin-left: 6px;
}

.username-stats {
  position: relative;
  margin: -50px 0px -2px 65px;
}

.stats {
  position: relative;
  margin: 5px 0px 0 60px;
}

@-webkit-keyframes clouds {
  0% {
    background-position: center bottom, 0 center;
  }

  100% {
    background-position: center bottom, 1440px center;
  }
}

@keyframes clouds {
  0% {
    background-position: center bottom, 0 center;
  }

  100% {
    background-position: center bottom, 1440px center;
  }
}

.category_outer .right_side.gold {
  background-color: #f9d83e;
}

.category_outer .right_side.silver {
  background-color: #b8c4d4;
}

.category_outer .right_side.bronze {
  background-color: #f1851b;
}

.input-group-text-ify {
  display: flex;
  align-items: center;
  padding: 0 0 0 12px;
  text-align: center;
  background-color: #e9eaeb;
  border-top: 1px solid rgb(0 0 0 / 14%);
  border-left: 1px solid rgb(0 0 0 / 14%);
  border-bottom: 1px solid rgb(0 0 0 / 14%);
  border-radius: 3px !important;
  box-shadow: inset -2px 0px 0px rgb(255 255 255 / 50%), 0 2px 0rem 0px rgb(0 0 0 / 4%);
  width: 40px;
}

.ify-submit {
  padding: 4px;
  font-size: 15px;
  width: 100%;
}

.ify-form {
  background-color: #e9eaeb;
  border: 1px solid rgb(0 0 0 / 14%);
  border-radius: 3px;
  text-shadow: 1px 1px #ffffff7d;
  box-shadow: 0 2px 0rem 0px rgb(0 0 0 / 4%);
  color: #909090;
  font-size: 15px;
}

.ify-form:focus {
  background-color: #e9eaeb;
  border: 1px solid rgb(0 0 0 / 14%);
  border-radius: 3px;
  text-shadow: 1px 1px #ffffff7d;
  box-shadow: 0 0px 0rem 3px rgb(0 0 0 / 3%);
  color: #909090;
  z-index: 1 !important;
}

.preview-user {
  width: 64px;
  height: 75px;
  margin-right: 4px;
  margin-top: -39px;
  position: absolute;
  right: 0;
  z-index: 2;
}

.user-navbar {
  background-position: center -25px;
  position: absolute;
  left: 0;
  width: 68px;
  height: 56px;
  background-repeat: no-repeat;
  bottom: 0;
}

.discord {
  height: 212px;
  background: #941d24;
  border: 1px solid #941d24;
}

.discord .discord_padding {
  padding: 18px;
}


.discord_font {
  font-size: 30px;
  color: #fff;
  text-shadow: 1px 1px #00000061;
}

.join_discord_button {
  margin-top: -6px;
  background-color: rgb(0 0 0 / 14%);
  border-top: 1px solid rgb(0 0 0 / 14%);
  padding: 7px;
  text-align: center;
  color: #fff;
  text-shadow: 1px 1px rgb(0 0 0 / 50%);
}

.footer_before {
  margin-top: 28px;
}

footer {
  background-color: #dddddd;
  z-index: 3;
  display: flex;
  align-items: center;
  width: 100%;
  text-shadow: 1px 1px #ffffff7d;
  color: #909090;
  height: 60px;
  box-shadow: 0 -0.2rem 1rem rgb(0 0 0 / 15%), 0px -1px #c3c3c3, 0 -0.125rem 0.25rem rgb(0 0 0 / 9%), inset 0px 1px rgb(0 0 0 / 15%);
  border-top: 3px solid #ffffff;
  margin-top: auto;
  text-align: center;
}

.post_message {
  background-color: #fff;
  /*padding: 10px;*/
  height: 44px;
  box-shadow: inset 0px -22px rgb(0 0 0 / 4%), 0px 2px rgb(0 0 0 / 14%), inset 0px -1px 0 0px rgb(0 0 0 / 6%);
  border: 1px solid rgb(0 0 0 / 18%);
  color: #fff;
  text-shadow: 1px 1px rgb(0 0 0 / 30%);
  font-size: 16px;
}

.post_message_icon_padding {
  padding: 10px 10px 10px 48px;
}

.post_message_icon {
  position: absolute;
  background-color: rgb(0 0 0 / 10%);
  border-radius: 100%;
  height: 30px;
  width: 30px;
  padding: 2.8px 7.5px 2.8px 7.5px;
  margin-top: 5px;
  border: 1px solid rgb(0 0 0 / 15%);
  box-shadow: 0px 1px 0 1px rgb(255 255 255 / 12%);
}

.post_message.success {
  background-color: #3f9f5f;
}

.post_message.error {
  background-color: #9f3f3f;
}

.me_part {
  background-color: #5dcdfd;
  background-image: url(../assets/mepart.png);
  background-position: bottom -22px left -20px;
  background-repeat: no-repeat;
  padding: 10px;
  height: 160px;
  border-radius: 2px;
}

.me_part .details {
  background-color: rgb(0 0 0 / 55%);
  color: #fff;
  text-shadow: 1px 1px rgb(0 0 0 / 30%);
  padding: 10px 0px;
  border-radius: 3px;
}

.me_part .avatar {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  position: relative;
  margin: 18px -14px 0px 36px;
}

.currency_bar {
  height: 40px;
  background-color: #f3f3f3;
  display: flex;
  align-items: center;
  box-shadow: 0px 1px #c3c3c3, inset 0px -1px rgb(0 0 0 / 20%);
  margin-bottom: 0px;
  border-bottom: 3px solid #fff;
  color: rgba(0, 0, 0, 0.55);
  text-shadow: 1px 1px rgb(255 255 255 / 50%);
}

.currency_bar .inline {
  font-weight: 700;
  display: inline;
}

.currency_bar .inline img {
  margin-right: 2px;
}


.staff {
  height: 108px;
  overflow: hidden;
  text-shadow: 1px 1px #ffffff7d;
  color: #909090;
  padding: 8px;
  background-color: #0000000f;
  border-bottom: 1px solid #00000017;
  margin-top: 1px;
}

.avcomt_top {
  padding: 15px;
  background-color: #f9f9f9;
  border-top: 1px solid #c9c9c9;
  border-top-left-radius: 5px;
  border-right: 1px solid #c9c9c9;
  border-left: 1px solid #c9c9c9;
  border-top-right-radius: 5px;
}

.avcomt_btm {
  height: 70px;
  background-color: #eaeaea;
  margin-bottom: 1px;
  padding: 12px;
  border-right: 1px solid #c9c9c9;
  border-left: 1px solid #c9c9c9;
  border-bottom: 1px solid #c9c9c9;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

.staff .habbo {
  margin: -18px 0 0 0;
  width: 54px;
  height: 50px;
}

.friendson {
  border-radius: 3px;
  text-align: left;

  padding: 5px;
}

.friendson span {
  border-radius: 3px;
  display: block;
  text-align: left;
  margin-left: 3px;
  width: 100%;
  background-color: #fff;
  padding: 4px;
  font-size: 12px;
}

.go_room {
  background: linear-gradient(#1c165c, #141260);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.go_room:hover {
  background: linear-gradient(#362d9d, #26238d);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.inner {
  background: #00000087;
  padding: 4px;
  border-radius: 3px;
  width: 100%;
  display: inline-flex;
  margin-bottom: 5px;
}

.staff .username {
  margin: -10px 0 0 74px;
  font-weight: bold;
  font-size: 16px;
}

.staff .motto {
  margin: 0px 0 0 74px;
  height: 23px;
}

.toast-header {
  background-color: #ffffffbf;
  color: #000;
}

.toast-error {
  background-color: rgb(139 38 38);
  color: #FFF;
  box-shadow: inset 0px -23px rgb(0 0 0 / 10%), 0px 0px rgb(0 0 0 / 18%), inset 0px -1px 0 0px rgb(0 0 0 / 6%), rgb(0 0 0 / 2%) 0px 1px 3px 0px, rgb(27 31 35 / 15%) 0px 0px 0px 1px;
}

.toast-success {
  background-color: rgb(38, 139, 51);
  color: #FFF;
  box-shadow: inset 0px -23px rgb(0 0 0 / 10%), 0px 0px rgb(0 0 0 / 18%), inset 0px -1px 0 0px rgb(0 0 0 / 6%), rgb(0 0 0 / 2%) 0px 1px 3px 0px, rgb(27 31 35 / 15%) 0px 0px 0px 1px;
}


.staff .badges {
  margin: 0 0 0 0;
}

.staff .right_side {
  float: right;
  margin: -40px 10px 0 0;
  font-weight: bold;
  border-radius: 3px;
  background-color: hwb(0deg 0% 100% / 5%);
  padding: 6px;
}

.leaderboard .leader-heading {
  height: 127px;
  position: relative;
}

.leaderboard .leader-heading:before,
.leaderboard .leader-heading:after {
  content: "";
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
  background-position: bottom left;
}

.leaderboard .leader-heading:before {
  opacity: 0.28;
}

.leaderboard .leader-heading .podium {
  z-index: 9;
  width: 124px;
  background-image: url("../assets/podium.png");
  background-position: center bottom -18px;
  background-repeat: no-repeat;
  height: 100%;
  margin: auto;
  position: relative;
}

.leaderboard .leader-heading .podium img {
  position: absolute;
}

.leaderboard .leader-heading .podium img:nth-child(1) {
  left: 28px;
  bottom: 48px;
}

.leaderboard .leader-heading .podium img:nth-child(2) {
  left: -5px;
  bottom: 14px;
}

.leaderboard .leader-heading .podium img:nth-child(3) {
  right: -5px;
  transform: scaleX(-1);
  bottom: 8px;
}

.leaderboard .leaderboard-credits .leader-heading {
  background-color: #F2A30A;
}

.leaderboard .leaderboard-credits .leader-heading:before {
  background-image: url("../assets/toplist_credits.png");
}

.leaderboard .leaderboard-duckets .leader-heading {
  background-color: #cd7bbf;
}

.leaderboard .leaderboard-duckets .leader-heading:before {
  background-image: url("../assets/toplist_duckets2.png");
}

.leaderboard .leaderboard-diamonds .leader-heading {
  background-color: #40C1E2;
}

.leaderboard .leaderboard-diamonds .leader-heading:before {
  background-image: url("../assets/toplist_diamonds.png");
}

.leaderboard .leaderboard-time .leader-heading {
  background-color: #CC5444;
}

.leaderboard .leaderboard-time .leader-heading:before {
  background-image: url("/templates/laup/images/tex_clocks.png");
}

.leaderboard .leaderboard-score .leader-heading {
  background-color: #4BA34C;
}

.leaderboard .leaderboard-score .leader-heading:before {
  background-image: url("../assets/toplist_eventpoints.png");
}

.leaderboard .leaderboard-respect .leader-heading {
  background-color: #5BB69B;
}

.leaderboard .leaderboard-respect .leader-heading:before {
  background-image: url("/templates/laup/images/tex_likes.png");
}

.leaderboard .leaderboard-hearts .leader-heading {
  background-color: #F474C2;
}

.leaderboard .leaderboard-hearts .leader-heading:before {
  background-image: url("/templates/laup/images/tex_hearts.png");
}

.leaderboard .leaderboard-rooms .leader-heading {
  background-color: #5166D6;
}

.leaderboard .leaderboard-rooms .leader-heading:before {
  background-image: url("../assets/toplist_rooms.png");
}

.leaderboard_category_heading {
  height: 30px;
  overflow: hidden;
  text-shadow: 1px 1px #ffffff7d;
  color: #909090;
  padding: 5px 10px 5px;
  background-color: rgb(0 0 0 / 10%);
  border-bottom: 1px solid #00000017;
  margin-top: 1px;
  font-weight: 700;
  font-size: 14px;
}

.leaderboard_category_outer {
  height: 30px;
  overflow: hidden;
  text-shadow: 1px 1px #ffffff7d;
  color: #909090;
  padding: 8px;
  background-color: #0000000f;
  border-bottom: 1px solid #00000017;
  margin-top: 1px;
}

.leaderboard_category_outer .habbo {
  margin: -10px 0 0 0;
  width: 54px;
  height: 50px;
}

.leaderboard_category_outer .username {
  margin: -43px 0 0 30px;
  font-weight: bold;
}

.leaderboard_category_outer .currency {
  margin: -21px 0 0 0;
  float: right;
}

.toast-success {
  background-color: rgb(38, 139, 51);
  color: #FFF;
  box-shadow: inset 0px -23px rgb(0 0 0 / 10%), 0px 0px rgb(0 0 0 / 18%), inset 0px -1px 0 0px rgb(0 0 0 / 6%), rgb(0 0 0 / 2%) 0px 1px 3px 0px, rgb(27 31 35 / 15%) 0px 0px 0px 1px;
}

.bluebtn {
  background: linear-gradient(#266c9d, #1877a5);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.bluebtn:hover {
  background: linear-gradient(#1e5378, #155f83);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.Heye {
  background: linear-gradient(#ffab0f, #eb6d04);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.Heye:hover {
  background: linear-gradient(#7a0000, #460000);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.Heye:not(:disabled):not(.disabled).active,
.Heye:not(:disabled):not(.disabled):active {
  background: linear-gradient(#870000, #570000);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.regis {
  background: linear-gradient(#45c370, #20af6c);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.regis:hover {
  background: linear-gradient(#198754, #2e7846);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.regis:not(:disabled):not(.disabled).active,
.regis:not(:disabled):not(.disabled):active {
  background: linear-gradient(#177449, #1f5430);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.buckz-select {
  /* Reset */
  appearance: none;
  border: 0;
  outline: 0;
  font: inherit;
  /* Personalize */
  width: 20em;
  height: 3em;
  padding: 0 4em 0 1em;
  background: url(https://upload.wikimedia.org/wikipedia/commons/9/9d/Caret_down_font_awesome_whitevariation.svg) no-repeat right 0.8em center / 1.4em,
    linear-gradient(to left, rgb(175 82 3) 3em, rgb(147 56 0) 3em);
  color: white;
  border-radius: 0.25em;
  box-shadow: 0 0 1em 0 rgba(0, 0, 0, 0.2);
  cursor: pointer;
}

/* <option> colors */
.buckz-select option {
  color: inherit;
  background-color: #933800;
}

.buckz-select option:checked {
  display: none;
}

/* Remove focus outline */
.buckz-select option:focus {
  outline: none;
}

/* Remove IE arrow */
.buckz-select option::-ms-expand {
  display: none;
}

.credits-select {
  /* Reset */
  appearance: none;
  border: 0;
  outline: 0;
  font: inherit;
  /* Personalize */
  width: 20em;
  height: 3em;
  padding: 0 4em 0 1em;
  background: url(https://upload.wikimedia.org/wikipedia/commons/9/9d/Caret_down_font_awesome_whitevariation.svg) no-repeat right 0.8em center / 1.4em, linear-gradient(to left, rgb(177 110 25) 3em, rgb(233 177 38) 3em);
  color: white;
  border-radius: 0.25em;
  box-shadow: 0 0 1em 0 rgba(0, 0, 0, 0.2);
  cursor: pointer;
}

/* <option> colors */
.credits-select option {
  color: inherit;
  background-color: rgb(177 110 25);
}

.credits-select option:checked {
  display: none;
}

/* Remove focus outline */
.credits-select option:focus {
  outline: none;
}

/* Remove IE arrow */
.credits-select option::-ms-expand {
  display: none;
}

.diamonds-select {
  /* Reset */
  appearance: none;
  border: 0;
  outline: 0;
  font: inherit;
  /* Personalize */
  width: 20em;
  height: 3em;
  padding: 0 4em 0 1em;
  background: url(https://upload.wikimedia.org/wikipedia/commons/9/9d/Caret_down_font_awesome_whitevariation.svg) no-repeat right 0.8em center / 1.4em, linear-gradient(to left, rgb(25, 167, 177) 3em, rgb(38, 188, 233) 3em);
  color: white;
  border-radius: 0.25em;
  box-shadow: 0 0 1em 0 rgba(0, 0, 0, 0.2);
  cursor: pointer;
}

/* <option> colors */
.diamonds-select option {
  color: inherit;
  background-color: rgb(25, 167, 177);
}

.diamonds-select option:checked {
  display: none;
}

/* Remove focus outline */
.diamonds-select option:focus {
  outline: none;
}

/* Remove IE arrow */
.diamonds-select option::-ms-expand {
  display: none;
}


.Diabuy {
  background: linear-gradient(#1fbfcb, #19a7b1);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.Diabuy:hover {
  background: linear-gradient(#19a7b0, #31b2d9);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.Diabuy:not(:disabled):not(.disabled).active,
.Diabuy:not(:disabled):not(.disabled):active {
  background: linear-gradient(#870000, #570000);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}



.CreBuy {
  background: linear-gradient(#e9b126, #b16e19);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.CreBuy:hover {
  background: linear-gradient(#b06e18, #e9b126);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.CreBuy:not(:disabled):not(.disabled).active,
.CreBuy:not(:disabled):not(.disabled):active {
  background: linear-gradient(#870000, #570000);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}




.BvipBuy {
  background: linear-gradient(#9f6500, #6a2800);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.BvipBuy:hover {
  background: linear-gradient(#6a2800, #8e3800);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.BvipBuy:not(:disabled):not(.disabled).active,
.BvipBuy:not(:disabled):not(.disabled):active {
  background: linear-gradient(#870000, #570000);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}



.SvipBuy {
  background: linear-gradient(#858585, #4f4f4f);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.SvipBuy:hover {
  background: linear-gradient(#4f4f4f, #6e6e6e);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.SvipBuy:not(:disabled):not(.disabled).active,
.SvipBuy:not(:disabled):not(.disabled):active {
  background: linear-gradient(#870000, #570000);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}



.GvipBuy {
  background: linear-gradient(#b08900, #b06200);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.GvipBuy:hover {
  background: linear-gradient(#621b00, #893d1b);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.GvipBuy:not(:disabled):not(.disabled).active,
.GvipBuy:not(:disabled):not(.disabled):active {
  background: linear-gradient(#870000, #570000);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.rares-select {
  /* Reset */
  appearance: none;
  border: 0;
  outline: 0;
  font: inherit;
  /* Personalize */
  width: 20em;
  height: 3em;
  padding: 0 4em 0 1em;
  background: url(https://upload.wikimedia.org/wikipedia/commons/9/9d/Caret_down_font_awesome_whitevariation.svg) no-repeat right 0.8em center / 1.4em, linear-gradient(to left, rgb(15 68 147) 3em, rgb(23 94 201) 3em);
  color: white;
  border-radius: 0.25em;
  box-shadow: 0 0 1em 0 rgba(0, 0, 0, 0.2);
  cursor: pointer;
}

/* <option> colors */
.rares-select option {
  color: inherit;
  background-color: rgb(15 68 147);
}

.rares-select option:checked {
  display: none;
}

/* Remove focus outline */
.rares-select option:focus {
  outline: none;
}

/* Remove IE arrow */
.rares-select option::-ms-expand {
  display: none;
}


.RareBuy {
  background: linear-gradient(#175ec9, #0f4493);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.RareBuy:hover {
  background: linear-gradient(#0f4493, #175ec9);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.RareBuy:not(:disabled):not(.disabled).active,
.RareBuy:not(:disabled):not(.disabled):active {
  background: linear-gradient(#870000, #570000);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.Light_Switch {

  background: linear-gradient(#00469b, #002e56);
  box-shadow: inset 0 5px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 10%), inset 0 0 0 1px rgb(0 0 0 / 20%), 0 4px rgb(0 0 0 / 0%);
  color: #FFF;
}

.Light_Switch:hover {
  background: linear-gradient(#001935, #00133c);
  box-shadow: inset 0 0px rgb(255 255 255 / 20%), inset 0 -5px rgb(0 0 0 / 0%), inset 0 0 0 1px rgb(0 0 0 / 0%), 0 1px rgb(0 0 0 / 0%);
  color: #FFF;
}

.cut_id {
  height: 198px;
  width: 308px;
  overflow: hidden;
}

.cut_avatar {
  height: 68px;
  width: 64px;
  overflow: hidden;
}

.my_info {
  background-color: #27be7a;
}

.official_activities {
  background-color: #27be7a;
}

.popular_rooms {
  background-color: #27be7a;
}

.uotw {
  background-color: #27be7a;
}

.discord-head {
  background-color: #27be7a;
}

.discord {
  height: 212px;
  background: #27be7a;
  border: 1px solid #015e36;
}