:root {
  --dark-main-color: #000000;
  --light-main-color: #e9fff9;

  --dark-second-color: #000000;
  --light-second-color: #e9fff9;
  /* #ff1b1c
    #ff7f11
    #084c61
    #e3b505
    #4f6d7a
    #56a3a6
    #0e1c36
    #e9fff9
    #9ed8db
    #791e94
    #41d3bd
    #eeb902
    #97cc04
    #2d7dd2
    #f45d01
    #df2935
    #fc2f00
    #093a3e
    #dcf763
    #003459 
    #71C9CE 
    */
}

@font-face {
  font-family: DanaFaNum-Medium;
  src: url(../assets/font/DanaFaNum-Medium.woff2);
}
@font-face {
  font-family: DanaFaNum-Black;
  src: url(../assets/font/DanaFaNum-Black.woff2);
}
@font-face {
  font-family: DanaFaNum-ExtraBold;
  src: url(../assets/font/DanaFaNum-ExtraBold.woff2);
}

* {
  margin: 0;
  padding: 0;
  border: none;
  font-family: DanaFaNum-Medium;
  outline: none;
  box-sizing: border-box;
  user-select: none;
}

ul {
  list-style: none;
}
a {
  text-decoration: none;
  user-select: none;
  color: var(--dark-main-color);
}
a:hover {
  color: var(--dark-main-color);
}
hr {
  color: #e9fff9;
}

html,
body {
  overflow-x: hidden;
  height: 100%;
}
body {
  min-height: 100vh;
  width: 100vw;
  background-color: #041c32;
  font-size: 15px;
  font-weight: 500, 700, 800;
  scroll-behavior: smooth;
  direction: ltr;
}

body::-webkit-scrollbar {
  width: 8px;
  background: #041c32;
}

body::-webkit-scrollbar-track {
  margin-bottom: 40px;
  background: #041c32;
}

body::-webkit-scrollbar-thumb {
  background: #f66b0e;
  border-radius: 10px;
}
.parent-container {
  position: relative;
  width: 100dvw;
  direction: rtl;
}
.child-container {
  width: 100%;
}

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

.exit-icon {
  cursor: pointer;
  width: 50px;
  transition: 0.4s;
}
.exit-icon:active {
  transform: scale(0.9);
}
/* .swiper-container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
} */

/* .swiper {
  position: relative;
  border-radius: 20px;
}
.swiper img {
  cursor: pointer;
  width: 100%;
  height: auto;
  border-radius: 20px;
}
.swiper-content-text {
  position: absolute;
  top: 1em;
  right: 1em;
  font-size: 1.3em;
  font-weight: bold;
  color: #e9fff9;
  text-shadow: 0 0 5px #000000;
}

.swiper-pagination-bullets .swiper-pagination-bullet {
  background-color: #003459 !important;
}

.swiper-button-prev,
.swiper-button-next {
  color: #003459;
  transform: scale(0.5);
}
.swiper-button-prev {
  right: 0px !important;
}
.swiper-button-next {
  left: 0px !important;
} */

/* 
footer {
  position: relative;
  background-color: #2c2c2c;
}
.footer-content {
  position: absolute;
  bottom: 0;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background-color: #2c2c2c;
  padding-top: 3em;
  padding-bottom: 7em;
  border-top: 2px solid #e9fff9;
}
.footer-content span {
  color: #e9fff9;
  font-size: 1.3em;
} */

.warning {
  animation: warning 1s;
}

@keyframes warning {
  0% {
    transform: scale(1);
  }
  25% {
    transform: scale(1.1);
  }
  50% {
    transform: scale(1);
  }
  75% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}

@keyframes showGameSection {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@media (min-width: 768px) {
  .child-container {
    width: 70%;
  }
}

@media (min-width: 1024px) {
  .child-container {
    width: 60%;
  }
}

@media (min-width: 1280px) {
  .child-container {
    width: 50%;
  }
}

@media (min-width: 1536px) {
  .child-container {
    width: 40%;
  }
}