:root {
  --1: min(1px, 0.06944vw);
}
@media only screen and (max-width: 991.98px) {
  :root {
    --1: 0.24vw;
  }
}
* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  text-wrap: pretty;
}
a {
  cursor: pointer;
}
li {
  list-style: none;
}
body.sizeChanged * {
  transition: none !important;
}
:root {
  --primary-dark: #051153;
  --black: #000000;
  --dark: #030d43;
  --success: #4ed50b;
  --error: #df4375;
  --info: #74e0d5;
  --bg-1: #030d43;
  --bg-2: linear-gradient(
    319deg,
    #152891 -1.9%,
    #030d43 17.34%,
    #152891 87.36%
  );
  --bg-3: linear-gradient(
    139deg,
    #030d43 -1.9%,
    #152891 17.34%,
    #040f4e 87.36%
  );
  --bg-4: linear-gradient(
    319deg,
    #1830ff50 -1.9%,
    rgba(42, 180, 255, 0) 17.34%,
    #1830ff50 87.36%
  );
  --bg-opa: #030d4300;
  --bg-opa-2: #030d4390;
  --border-1: rgba(0, 148, 255, 0.16);
  --border-2: rgba(255, 255, 255, 0.16);
  --white: #ffffff;
  --light: #c1cade;
  --warning: #c8b100;
  --black: #000;
  --primary: #4ab3ff;
  --secondary: #ee6429;
  --text-1: #fff;
  --text-2: #fff;
  --text-3: #c1cade;
  --red: #ea1313;
  --cool: #30374f;
  --pink: #df4375;
  --cyan: #74e0d5;
  --error: #ea1313;
  --info: #1d44ff;
  --success: #25ff6f;
  --confirming: #25f0ff;
  --linear-blue: linear-gradient(222.72deg, #25ff6f -91.33%, #001dff 98.02%);
  --linear-red: linear-gradient(223deg, #fbff25 -91.33%, red 98.02%);
  --main-bg: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
    linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
    linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
    linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), #121212;
}
.dark-mode-visible {
  opacity: 1;
  display: flex;
}
.light-mode-visible {
  opacity: 0;
  display: none;
}
body,
html {
  max-width: 100vw;
  overflow-x: hidden;
  min-height: 100svh;
  background-color: #030d43;
}
body {
  overflow: hidden;
}
.text-success {
  color: var(--success);
}
.text-error {
  color: var(--error);
}
.text-warning {
  color: var(--warning);
}
::-webkit-scrollbar {
  width: 0;
  height: 0;
}
.relative {
  position: relative;
}
@keyframes themeReveal {
  0% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.themeToggle {
  background-color: rgba(0, 0, 0, 0);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid var(--border-1);
}
.themeToggle img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: 0.6s ease-in;
}
.themeToggle img,
.themeToggle svg {
  width: calc(var(--1) * 24);
  height: calc(var(--1) * 24);
}
.themeToggle img.activeLogo,
.themeToggle svg.activeLogo {
  opacity: 1;
}
.themeToggle.themeToggleTop {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(var(--1) * 36);
  height: calc(var(--1) * 36);
  background: linear-gradient(180deg, var(--bg-2) 0, var(--bg-1) 100%);
  border-radius: calc(var(--1) * 8);
  position: relative;
  cursor: pointer;
}
.themeToggle.themeToggleFixed {
  position: fixed;
  right: 20px;
  top: 20px;
}
body {
  background-color: var(--bg-1);
}
body * {
  font-family: inherit;
}
main {
  background-color: var(--bg-1);
  color: var(--white);
  position: relative;
  isolation: isolate;
}
a {
  color: inherit;
  text-decoration: none;
}
@keyframes loadingOverlayImg {
  50% {
    opacity: 0.1;
  }
}
.loadingOverlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--bg-2);
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: calc(var(--1) * 100);
  z-index: 99;
}
.loadingOverlay img {
  animation: loadingOverlayImg 0.8s ease infinite;
}
p {
  color: var(--text-2);
  font-size: calc(var(--1) * 18);
  font-style: normal;
  font-weight: 400;
  line-height: 160%;
  letter-spacing: calc(var(--1) * -0.36);
}
@media (min-width: 991.98px) {
  p {
    font-size: calc(var(--1) * 18);
  }
}
@media (max-width: 991.98px) {
  p {
    font-size: calc(var(--1) * 16);
  }
}
.toast-container {
  position: fixed;
  top: 10px;
  right: 10px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  z-index: 999999;
}
.btn-area {
  display: flex !important;
  flex-direction: row !important;
  gap: calc(var(--1) * 16) !important;
  row-gap: calc(var(--1) * 8) !important;
}
.btn-area,
.btn-area > * {
  justify-content: center;
}
.btn-area > * {
  flex-grow: 1;
  padding-inline: 0 !important;
}
body:has(.headerActive),
html:has(.headerActive) {
  overflow: hidden;
}
body:has(.modalActive),
html:has(.modalActive) {
  overflow: hidden;
}
body:has(.modalhere),
html:has(.modalhere) {
  overflow: hidden;
}
.PhoneInput {
  width: 100%;
}
.phoneInput {
  position: relative;
}
.phoneInput:after {
  content: "(optional)";
  position: absolute;
  right: calc(var(--1) * 20);
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}
.phoneInput .country-name,
.phoneInput:after {
  color: #a6b1c5 !important;
}
.disconnectButton {
  display: flex;
  transform: translateY(calc(var(--1) * 15));
}
@media (max-width: 991.98px) {
  .disconnectButton {
    transform: translateY(calc(var(--1) * 10));
  }
  .disconnectButton button {
    height: calc(var(--1) * 40) !important;
    font-size: calc(var(--1) * 14) !important;
    line-height: 1.2 !important;
    border: none !important;
  }
}
.disconnectButton button {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  flex: 0 0 49%;
  max-width: 49%;
  height: 50px;
  font-weight: 700;
  font-size: calc(var(--1) * 18);
  border: none;
  cursor: pointer;
  letter-spacing: 2px;
  text-transform: uppercase;
  transition: all 0.3s linear;
  border: none !important;
}
input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
  -webkit-appearance: none;
}
input[type="number"] {
  -moz-appearance: textfield;
}
.errorBNB {
  font-size: calc(var(--1) * 12);
  color: var(--warning);
  text-align: left;
  width: 100%;
}
.errorBNB.successBNB {
  color: var(--success);
}
.errorBNB.errorMin {
  cursor: pointer;
}
#modal-root {
  display: block !important;
}
.d-none {
  display: none !important;
}
.PhoneInput .PhoneInputInput {
  color: var(--white);
}
.PhoneInputCountrySelectArrow {
  border-color: #fff !important;
}
@keyframes loadingAnimation {
  0% {
    background-position: -200% 0;
  }
  to {
    background-position: 200% 0;
  }
}
.loadingAnimation {
  background: linear-gradient(
    90deg,
    var(--primary-dark) 25%,
    var(--bg-1) 50%,
    var(--primary-dark) 75%
  );
  background-size: 200% 100%;
  animation: loadingAnimation 1.2s ease-in-out infinite;
  color: rgba(0, 0, 0, 0) !important;
  border-radius: calc(var(--1) * 5);
}
.dtpcnt {
  opacity: 0;
}
#devSwiper {
  overflow: hidden;
}
.devSwiper-swiper-button-prev {
  width: calc(var(--1) * 40);
  height: calc(var(--1) * 40);
  border-radius: calc(var(--1) * 6);
  background: var(--bg-2);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  position: absolute;
}
.devSwiper-swiper-button-prev.swiper-button-disabled {
  opacity: 0.3;
}
.devSwiper-swiper-button-prev:after {
  content: "";
  display: flex;
  width: 100%;
  height: 100%;
  background-image: url(/images/left-chevron.png);
  background-size: calc(var(--1) * 24) calc(var(--1) * 24);
  background-repeat: no-repeat;
  background-position: 50%;
}
@media (min-width: 991.98px) {
  .devSwiper-swiper-button-prev {
    top: unset;
    left: unset;
    bottom: calc(var(--1) * -56);
    right: calc(var(--1) * 120);
  }
}
@media (max-width: 991.98px) {
  .devSwiper-swiper-button-prev {
    top: unset;
    bottom: 0;
  }
}
.devSwiper-swiper-button-next {
  position: absolute;
  width: calc(var(--1) * 40);
  height: calc(var(--1) * 40);
  background: var(--bg-2);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: calc(var(--1) * 6);
  z-index: 10;
}
.devSwiper-swiper-button-next.swiper-button-disabled {
  opacity: 0.3;
}
.devSwiper-swiper-button-next:after {
  content: "";
  display: flex;
  width: 100%;
  height: 100%;
  background-image: url(/images/right-chevron.png);
  background-size: calc(var(--1) * 24) calc(var(--1) * 24);
  background-repeat: no-repeat;
  background-position: 50%;
}
.devSwiper-swiper-button-next {
  right: 0;
  cursor: pointer;
}
@media (min-width: 991.98px) {
  .devSwiper-swiper-button-next {
    top: unset;
    bottom: calc(var(--1) * -56);
  }
}
@media (max-width: 991.98px) {
  .devSwiper-swiper-button-next {
    top: unset;
    bottom: 0;
  }
}
@media (min-width: 991.98px) {
  .d-sm {
    display: none !important;
  }
}
@media (max-width: 991.98px) {
  .d-md {
    display: none !important;
  }
}
.line-clamp-3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
:root {
  --gap-xl: 32;
  --gap-lg: 24;
  --gap-md: 16;
  --gap-sm: 8;
}
@media only screen and (max-width: 991.98px) {
  :root {
    --gap-xl: 24;
    --gap-lg: 20;
    --gap-md: 12;
    --gap-sm: 6;
  }
}
#newsSwiper .swiper-button-next,
#newsSwiper .swiper-button-next:after {
  width: calc(var(--1) * 32) !important;
  height: calc(var(--1) * 32) !important;
}
#newsSwiper .swiper-button-next:after {
  content: "";
  background-image: url(/icons/slide-arrow.svg);
  background-size: contain;
  transform: translateY(calc(var(--1) * -25));
}
#newsSwiper .swiper-button-prev,
#newsSwiper .swiper-button-prev:after {
  width: calc(var(--1) * 32) !important;
  height: calc(var(--1) * 32) !important;
}
#newsSwiper .swiper-button-prev:after {
  content: "";
  background-image: url(/icons/slide-arrow.svg);
  background-size: contain;
  transform: translateY(calc(var(--1) * -25)) rotate(180deg);
}
#newsSwiper .swiper-pagination-bullet {
  width: calc(var(--1) * 8);
  height: calc(var(--1) * 8);
  background-color: var(--primary);
  cursor: pointer;
}
.walletModal {
  z-index: 98 !important;
}
.cursor-pointer {
  cursor: pointer;
}
.new-layout {
  display: flex;
  flex-direction: column;
  gap: calc(var(--1) * 40);
  max-width: min(var(--1) * 1360, 100% - var(--1) * 40);
  margin-inline: auto;
  margin-top: calc(var(--1) * 120);
  padding-bottom: calc(var(--1) * 40);
  position: relative;
  z-index: 10;
}
.new-layout,
.new-layout * {
  scroll-margin-top: calc(var(--1) * 120);
}
@media (min-width: 991.98px) {
  .new-layout {
    margin-top: calc(var(--1) * 160);
  }
}
