@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');

body, 
.site, 
.site-main, 
.site-content, 
.container, 
.content, 
a, 
p, 
span, 
div, 
h1, 
h2, 
h3, 
h4, 
h5, 
h6, 
.button, 
.login-button {
  font-family: 'Poppins', sans-serif !important;
}

body {
  position: relative !important;
  overflow-x: hidden !important;
  background-color: #101216 !important;
}

.overlay {
    margin-top: -120px;
}
.site,
.site-main,
.site-content,
.container,
.content {
  position: relative !important;
  z-index: 2 !important;
}

.navbar,
.site-topbar,
.site-header-top {
  background: #181a20 !important;
  border: 1px solid #242730 !important;
  border-radius: 16px !important;
  padding: 16px 20px !important;
  margin: 16px auto !important;
  max-width: 2200px !important;
}

.navbar-link,
.navigation-vertical a,
.navigation-vertical a.link-active,
.navigation-vertical a.active,
.site-home-categories .category,
.category-link,
.home-category-card,
.button,
.button-primary,
.button-success,
.button-danger,
.btn-primary,
.btn-secondary,
.login-button,
.basket-button,
.feature-category,
.widget-header,
.widget-header-featured,
.store-icon,
.package-tag,
.user-basket-amount,
.basket-button-amount {
  background: linear-gradient(180deg, #ffffff 0%, #ececef 100%) !important;
  color: #2f3036 !important;
  border: 1px solid #d1d1d6 !important;
  border-bottom: 3px solid #b8b8c0 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  transition: transform 0.22s ease, background 0.22s ease, box-shadow 0.22s ease, color 0.22s ease !important;
  vertical-align: middle !important;
}

.navbar-link *,
.navigation-vertical a *,
.navigation-vertical a.link-active *,
.navigation-vertical a.active *,
.site-home-categories .category *,
.category-link *,
.home-category-card *,
.button *,
.button-primary *,
.button-success *,
.button-danger *,
.btn-primary *,
.btn-secondary *,
.login-button *,
.basket-button *,
.feature-category *,
.widget-header *,
.widget-header-featured *,
.store-icon *,
.package-tag *,
.user-basket-amount *,
.basket-button-amount * {
  color: #2f3036 !important;
}

.navbar-link,
.navigation-vertical a,
.site-home-categories .category,
.category-link,
.home-category-card,
.button,
.button-primary,
.button-success,
.button-danger,
.btn-primary,
.btn-secondary,
.feature-category,
.user-basket-amount,
.basket-button-amount {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 14px !important;
  padding: 12px 16px !important;
  text-align: left !important;
  min-height: 54px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
}

.site-home-categories .category > *,
.category-link > *,
.home-category-card > *,
.button > *,
.button-primary > *,
.btn-primary > *,
.btn-secondary > * {
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
  flex-grow: 0 !important;
}

.site-header-inner .info.server {
  flex-direction: row !important;
  align-items: center !important;
}

.site-header-inner .info.server > div:last-child {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

.store-icon {
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  min-height: 56px !important;
  padding: 0 !important;
  border-radius: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.login-button,
.basket-button {
  width: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 32px !important;
  height: 56px !important;
  min-height: 56px !important;
  font-size: 15px !important;
  border-radius: 14px !important;
  text-align: center !important;
  gap: 12px !important;
}

.login-button img,
.basket-button img,
.avatar,
.user-avatar img {
  width: 64 !important;
  height: 64px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  object-fit: cover !important;
  object-position: top center !important;
  border-radius: 6px !important;
  aspect-ratio: 1/1 !important;
  display: block !important;
}

.navbar-img,
.home-category-img,
.site-home-categories .category .icon,
.category-link .icon,
.home-category-card .icon,
.navigation-vertical a .icon,
.navbar-link .icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #181a20 !important;
  border: 1px solid #242730 !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
  margin-right: 4px !important;
}

.navbar-img {
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  min-height: 56px !important;
  border-radius: 14px !important;
}

.home-category-img,
.site-home-categories .category .icon,
.category-link .icon,
.home-category-card .icon,
.navigation-vertical a .icon,
.navbar-link .icon {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  border-radius: 12px !important;
}

.navbar-img img,
.home-category-img img,
.site-home-categories .category .icon img,
.category-link .icon img,
.home-category-card .icon img,
.navigation-vertical a .icon img,
.navbar-link .icon img {
  width: 22px !important;
  height: 22px !important;
  max-width: 22px !important;
  max-height: 22px !important;
  object-fit: contain !important;
  filter: grayscale(1) brightness(0.88) !important;
}

.navbar-link svg,
.navigation-vertical a i,
.navigation-vertical a svg,
.site-home-categories .category i,
.site-home-categories .category svg,
.category-link i,
.category-link svg,
.home-category-card i,
.home-category-card svg,
.button i,
.button svg,
.button-primary i,
.button-primary svg,
.button-success i,
.button-success svg,
.button-danger i,
.button-danger svg,
.btn-primary i,
.btn-primary svg,
.btn-secondary i,
.btn-secondary svg,
.login-button i,
.login-button svg,
.basket-button i,
.basket-button svg,
.feature-category i,
.feature-category svg,
.widget-header i,
.widget-header-featured i,
.widget-header-featured svg,
.store-icon i,
.store-icon svg,
.user-basket-amount i,
.user-basket-amount svg,
.basket-button-amount i,
.basket-button-amount svg,
.site-header-inner .info .image i,
.site-header-inner .info .image svg {
  color: #23242a !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  font-size: 32px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  vertical-align: middle !important;
}
.navbar-link i {
    color: #23242a !important;
    width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  font-size: 128px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  vertical-align: middle !important;
}

.store-icon i,
.store-icon svg {
  font-size: 24px !important;
}

.site-home-categories,
.home-categories,
.category-grid,
.categories-grid,
.navigation-vertical {
  display: flex !important;
  flex-direction: column !important;
  margin: 0 !important;
  padding: 0 !important;
}

.navigation-vertical > *,
.site-home-categories > *,
.nav-item-home {
  margin-top: 0 !important;
  margin-bottom: 32px !important;
}

.navigation-vertical > *:last-child,
.site-home-categories > *:last-child,
.nav-item-home:last-child {
  margin-bottom: 0 !important;
}

.site-home-categories .category,
.category-link,
.home-category-card {
  min-height: 72px !important;
  padding: 14px 16px !important;
}

.navbar-link:hover,
.navigation-vertical a:hover,
.navigation-vertical a.link-active,
.navigation-vertical a.active,
.site-home-categories .category:hover,
.category-link:hover,
.home-category-card:hover,
.button:hover,
.button-primary:hover,
.button-success:hover,
.button-danger:hover,
.btn-primary:hover,
.btn-secondary:hover,
.login-button:hover,
.basket-button:hover,
.feature-category:hover,
.store-icon:hover,
.nav-item-home:hover {
  background: linear-gradient(180deg, #f8f8fa 0%, #e2e2e7 100%) !important;
  color: #1e1f24 !important;
  transform: scale(0.90) !important;
}

.navbar-link:hover *,
.navigation-vertical a:hover *,
.navigation-vertical a.link-active *,
.navigation-vertical a.active *,
.site-home-categories .category:hover *,
.category-link:hover *,
.home-category-card:hover *,
.button:hover *,
.button-primary:hover *,
.button-success:hover *,
.button-danger:hover *,
.btn-primary:hover *,
.btn-secondary:hover *,
.login-button:hover *,
.basket-button:hover *,
.feature-category:hover *,
.store-icon:hover *,
.nav-item-home:hover * {
  color: #1e1f24 !important;
}

.navbar-name,
.navigation-vertical a,
.navigation-vertical a.link-active,
.navigation-vertical a.active {
  font-weight: 700 !important;
}

::view-transition-group(root),
::view-transition-group(site),
::view-transition-group(siteContent),
::view-transition-group(siteHeader),
::view-transition-group(siteNavigation),
::view-transition-group(siteFooter),
::view-transition-group(siteBgImage) {
  animation-duration: 420ms !important;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1) !important;
}

::view-transition-old(siteContent) {
  animation: 420ms cubic-bezier(0.22, 1, 0.36, 1) both pageMoveOut !important;
}

::view-transition-new(siteContent) {
  animation: 420ms cubic-bezier(0.22, 1, 0.36, 1) both pageMoveIn !important;
}

.site-header {
  position: relative !important;
  overflow: visible !important;
  min-height: auto !important;
  padding-bottom: 200px !important;
  background: linear-gradient(
      to bottom,
      rgba(16, 18, 22, 0) 0%,
      rgba(16, 18, 22, 0.1) 52%,
      rgba(16, 18, 22, 0.45) 78%,
      rgba(16, 18, 22, 1) 100%
    ),
    url("https://cdn.tebex.io/store/1077164/templates/291231/assets/6580885a0a52b5f2ff3faa37c6f995c9888201ad.png") center top / cover no-repeat !important;
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  max-width: 100vw !important;
}

.site-toolbar-wrap {
  position: relative !important;
  z-index: 10 !important;
}

.site-toolbar-wrap .toolbar {
  position: relative !important;
  z-index: 11 !important;
}
.toolbar {
      margin-top: -120px;
}

.site-header-inner {
  display: grid !important;
  grid-template-columns: minmax(240px, 300px) minmax(450px, 800px) minmax(240px, 300px) !important;
  grid-template-areas: "server logo discord" !important;
  align-items: center !important;
  justify-content: center !important;
  justify-items: center !important;
  column-gap: 64px !important;
  width: 100% !important;
  max-width: 2200px !important;
  min-height: 400px !important;
  margin: 0 auto !important;
  padding: 74px 28px 42px !important;
  position: relative !important;
  z-index: 3 !important;
}

.site-header-inner > * {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  transform: none !important;
}

.site-title {
  grid-area: logo !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  text-align: center !important;
  z-index: 4 !important;
}

.site-title img {
  display: block !important;
  width: auto !important;
  min-width: 450px !important;
  height: 500px !important;
  min-height: 500px !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 auto !important;
  object-fit: contain !important;
}

.site-header-inner .info.server {
  grid-area: server !important;
  justify-self: end !important;
}

.site-header-inner .info.discord {
  grid-area: discord !important;
  justify-self: start !important;
}

.site-header-inner .info.server,
.site-header-inner .info.discord {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  transform: none !important;
}

.site-header-inner .info {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 64px !important;
  padding: 10px 14px !important;
  text-align: left !important;
  background: #181a20 !important;
  border: 1px solid #242730 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  overflow: hidden !important;
  z-index: 3 !important;
}

.site-header-inner .info .image {
  position: relative !important;
  inset: auto !important;
  display: grid !important;
  place-items: center !important;
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  flex-shrink: 0 !important;
  background: #101216 !important;
  border: 1px solid #242730 !important;
  border-radius: 12px !important;
}

.site-header-inner .info .image i,
.site-header-inner .info .image svg {
  color: #ffffff !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  font-size: 18px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.site-header-inner .info > div:last-child {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-width: 0 !important;
  flex: 1 !important;
}

.site-header-inner .info .title {
  display: block !important;
  margin: 0 0 4px !important;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-align: center !important;
}

.site-header-inner .info.server .action {
  order: 2 !important;
  font-size: 11px !important;
  min-height: 24px !important;
  padding: 0 8px !important;
  margin-top: 4px !important;
  width: fit-content !important;
  align-self: center !important;
}

.site-header-inner .info.server .value {
  order: 1 !important;
  margin-top: 0 !important;
  font-size: 14px !important;
  padding: 0 14px !important;
  text-align: center !important;
}

.site-header-inner .info.discord .action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 28px !important;
  padding: 0 !important;
  margin: 0 !important;
  color: #31313a !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.05 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.site-header-inner .info.discord .value {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: fit-content !important;
  max-width: 100% !important;
  min-height: 28px !important;
  margin-top: 6px !important;
  padding: 0 14px !important;
  color: #ffffff !important;
  background: #242730 !important;
  border: 1px solid #313542 !important;
  border-radius: 11px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.05 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.site-header-inner .info .action a,
.site-header-inner .info .action span,
.site-header-inner .info .action div,
.site-header-inner .info .action p,
.site-header-inner .info .action strong {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 28px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  line-height: 1.05 !important;
  text-align: center !important;
  white-space: nowrap !important;
  color: #ffffff !important;
}

.site-header-inner .info .value * {
  color: #ffffff !important;
  line-height: 1.05 !important;
}

.site-sale-banner {
  display: block !important;
  margin-top: 0 !important;
  margin-bottom: 32px !important;
  padding: 26px 26px 30px !important;
  min-height: 120px !important;
  background: #242730 !important;
  color: #ffffff !important;
  border: 1px solid #313542 !important;
  border-bottom: 3px solid #15171d !important;
  border-radius: 22px !important;
  box-shadow: none !important;
}

.site-sale-banner * {
  color: #ffffff !important;
}

.branding,
.site-footer-credit,
.site-footer-credit * {
  display: none !important;
}

:root {
  --page-transition-duration: 420ms !important;
}

@media (max-width: 1100px) {
  .site-header-inner {
    grid-template-columns: 1fr 300px 1fr !important;
    column-gap: 32px !important;
    min-height: 290px !important;
  }

  .site-title {
    max-width: 300px !important;
  }

  .site-title img {
    min-height: 250px !important;
    height: 250px !important;
    min-width: 250px !important;
  }

  .site-header-inner .info {
    max-width: 250px !important;
  }
}

@media (max-width: 960px) {
  .site-header-inner {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "logo"
      "server"
      "discord" !important;
    row-gap: 18px !important;
    column-gap: 0 !important;
    min-height: auto !important;
    padding-top: 42px !important;
    padding-bottom: 24px !important;
  }

  .site-title,
  .site-header-inner .info.server,
  .site-header-inner .info.discord {
    justify-self: center !important;
    width: 100% !important;
    max-width: 360px !important;
  }

  .site-title img {
    max-width: 100% !important;
    min-height: 250px !important;
    height: 250px !important;
  }

  .site-header-inner .info {
    max-width: 360px !important;
  }
}

@media (max-width: 640px) {
  .navbar-link,
  .navigation-vertical a,
  .site-home-categories .category,
  .category-link,
  .home-category-card {
    min-height: 54px !important;
    padding: 12px 14px !important;
    gap: 12px !important;
  }

  .button,
  .button-primary,
  .button-success,
  .button-danger,
  .btn-primary,
  .btn-secondary,
  .feature-category,
  .user-basket-amount,
  .basket-button-amount {
    min-height: 48px !important;
    padding: 10px 16px !important;
    gap: 10px !important;
  }

  .navbar-img,
  .home-category-img,
  .site-home-categories .category .icon,
  .category-link .icon,
  .home-category-card .icon,
  .navigation-vertical a .icon,
  .navbar-link .icon {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
  }

  .navbar-img img,
  .home-category-img img,
  .site-home-categories .category .icon img,
  .category-link .icon img,
  .home-category-card .icon img,
  .navigation-vertical a .icon img,
  .navbar-link .icon img {
    width: 20px !important;
    height: 20px !important;
    max-width: 20px !important;
    max-height: 20px !important;
  }

  .site-header-inner {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .site-header-inner .info {
    padding: 12px 14px !important;
    min-height: 64px !important;
  }

  .site-header-inner .info .title {
    font-size: 12px !important;
  }

  .site-header-inner .info .action {
    font-size: 12px !important;
    min-height: 24px !important;
  }

  .site-header-inner .info .action a,
  .site-header-inner .info .action span,
  .site-header-inner .info .action div,
  .site-header-inner .info .action p,
  .site-header-inner .info .action strong {
    min-height: 24px !important;
  }

  .site-header-inner .info .value {
    font-size: 11px !important;
    min-height: 24px !important;
  }
}