@import url(https://allfont.net/allfont.css?fonts=ringbearer);

@font-face {
  font-family: myFirstFont;
  src: url(../fonts/ringbearer/RINGM___.TTF);
}

@font-face {
  font-family: mySecondFont;
  src: url(../fonts/EB_Garamond/EBGaramond-VariableFont_wght.ttf);
}

.body-type {
  background-image: url(../img/home-bg.jpg);
  background-repeat: no-repeat;
  font-family: "myFirstFont" !important;
  background-size: cover;
  overflow: hidden;
  background-position: center;
  height: 100vh;
  background-color: #000000;
  margin: 0;
  width: 100%;
  padding: 0;
  float: left;
}

a {
  color: white;
  margin: 0 8px;
}

body {
  font-family: "myFirstFont" !important;
  letter-spacing: 0.4px !important;
}

.modal {
  overflow-y: auto !important;
}

header .top-nav {
  display: flex;
  flex-direction: row;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
  float: left !important;
  width: 100% !important;
  justify-content: center;
  padding: 33px 0px !important;
  z-index: 5;
  padding: 20px 0px !important;
}

.navbar-nav .top-nav .nav-item {
  margin-left: 11px;
}

#footer-txt .coming-image {
  max-width: 500px;
  width: 100%;
}

.stay-soon p {
  font-size: 35px;
  margin-bottom: 0;
  color: #b32a2f;
  /* margin-top: 10px; */
  font-weight: bold;
  position: relative;
  top: 52px;
  cursor: pointer;
  text-decoration: underline;
  text-shadow: 0x 2px 2px #ffffff54;
}

#email-popup-form input {
  background-color: transparent;
  border: 1px solid black;
  color: #000 !important;
}

#email-popup-form input::placeholder {
  color: #000;
}

header .top-nav .first-shape {
  background: url(../img/nav-btn1.png) no-repeat;
  border: none;
  float: left;
  width: 234px;
  height: 77px;
  color: white;
  text-align: center;
  font-size: 15pt;
  cursor: pointer;
  font-family: Impact;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 22px;
}

.home-main-sec .container::before {
  content: "";
  position: absolute;
  width: 629px;
  height: 843px;
  background: url(../img/detective.png);
  background-repeat: no-repeat;
  bottom: 0 !important;
  z-index: -5;
  left: 68%;
}

section.header .container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
}

section.home-main-sec4 {
  float: left;
  width: 100%;
  height: 100%;
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
}

.footer .footer-h1 {
  float: left;
  width: 100%;
  display: flex;
  justify-content: center;
  position: absolute;
  top: -90px;
}

.home-main-sec2 {
  float: left;
  width: 100%;
  padding: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  position: fixed;
}

#valueset {
  position: unset !important;
}

.footer-text {
  display: flex;
  justify-content: center;
  padding-bottom: 26px;
}

.flash-btn {
  z-index: 99;
  position: relative;
}

.coin-sec {
  float: left;
  width: 100%;
  display: flex;
  height: 100vh;
  justify-content: center;
  align-items: center;
}

#coin-page-row {
  align-items: center;
}

section.home-main-sec {
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: center;
  position: fixed;
}

section.home-main-sec .container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

header {
  position: fixed;
  top: 0;
  z-index: 50;
}

div#ss-3 {
  width: 100%;
}

.home-main-sec .container::before {
  left: 60%;
}

header .top-nav .two-shape {
  background: url(../img/nav-btn2.png) no-repeat;
  border: none;
  float: left;
  width: 234px;
  height: 77px;
  color: white;
  text-align: center;
  font-size: 15pt;
  cursor: pointer;
  font-family: Impact;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 22px;
  padding: 0;
  margin: 0;
}

.footer .top-nav .three-shape {
  background: url(../img/nav-btn3.png) no-repeat;
  border: none;
  float: left;
  width: 234px;
  height: 77px;
  color: white;
  text-align: center;
  font-size: 15pt;
  cursor: pointer;
  font-family: Impact;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 22px;
}

.footer .top-nav .four-shape {
  background: url(../img/nav-btn4.png) no-repeat;
  border: none;
  float: left;
  width: 234px;
  height: 77px;
  color: white;
  text-align: center;
  font-size: 15pt;
  font-family: Impact;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 22px;
}

.footer .top-nav .five-shape {
  background: url(../img/nav-btn5.png) no-repeat;
  border: none;
  float: left;
  width: 234px;
  height: 77px;
  color: white;
  text-align: center;
  font-size: 15pt;
  cursor: pointer;
  font-family: Impact;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 22px;
}

.home-main-sec {
  float: left;
  width: 100%;
  padding: 30px 0px;
  height: 65vh;
}

.footer ul .shape-one {
  background: url(../img/nav-btn1.png) no-repeat;
  width: 234px;
  height: 77px;
}

.footer ul .shape-two {
  background: url(../img/nav-btn2.png) no-repeat;
  width: 234px;
  height: 77px;
}

.footer ul .shape-three {
  cursor: pointer !important;
  background: url(../img/nav-btn3.png) no-repeat;
  width: 234px;
  height: 77px;
}

.footer ul .shape-four {
  background: url(../img/nav-btn4.png) no-repeat;
  width: 234px;
  height: 77px;
}

.footer ul .shape-five {
  background: url(../img/nav-btn5.png) no-repeat;
  width: 234px;
  height: 77px;
}

.home-main-sec .head-ul {
  float: left;
  width: 100%;
  display: flex;
  justify-content: center;
  flex-direction: row;
  gap: 20px;
}

.home-main-sec .head-ul .main-left {
  list-style: none;
  width: 50%;
  display: flex;
  justify-content: flex-end;
  position: relative;
}

.home-main-sec .head-ul .main-right {
  list-style: none;
  width: 40%;
  position: relative;
  margin-left: 20px;
  margin-top: 20px;
}

.home-main-sec .head-text {
  display: flex;
  justify-content: center;
}

.home-main-sec .container::after {
  content: "";
  position: absolute;
  width: 856px;
  height: 883px;
  background: url(../img/hell-hound.png);
  background-repeat: no-repeat;
  top: unset;
  bottom: 0 !important;
  z-index: -5;
  left: -5%;
}

.left-shape {
  cursor: pointer !important;
  float: left;
  width: 109%;
  position: absolute;
  height: 200px;
  z-index: 1;
  background: url(../img/rotate-text.png) no-repeat;
  left: -30%;
  top: 32%;
}

.footer ul {
  display: flex;
  justify-content: center;
  list-style: none;
  align-items: center;
}

.footer {
  position: fixed;
  top: 2%;
  display: flex;
  justify-content: center;
  left: 0;
  right: 0;
}

.left-shape .left-text {
  transform: rotate(343deg);
  padding-top: 9px;
  padding-left: 20px;
  font-size: 20px;
  margin: 0;
  color: black;
}

.right-shape {
  float: left;
  width: 114%;
  position: absolute;
  height: 200px;
  background: url(../img/rotate-text1.png) no-repeat;
  right: -13%;
  top: 30%;
  z-index: 9;
}

.right-shape .right-text {
  transform: rotate(8deg);
  padding-top: 78px;
  padding-left: 25px;
  font-size: 20px;
  margin: 0;
  color: black;
}

.left-shape .left-text .rotate {
  width: 31%;
  position: absolute;
  top: -74px;
  transform: rotate(19deg);
}

.right-shape .right-text .rotate2 {
  position: absolute;
  top: 13%;
  width: 31%;
  transform: rotate(351deg);
}

header {
  float: left;
  width: 100%;
  padding: 14px 0px;
  z-index: 1;
}

header .header-main {
  display: flex;
  justify-content: center;
  flex-direction: row;
  margin-top: 27px;
}

header .headerr-main .header-box {
  list-style: none;
}

header .header-main .six-shape {
  background: url(../img/nav-btn6.png) no-repeat;
  border: none;
  float: left;
  width: 243px;
  height: 84px;
  color: white;
  text-align: center;
  font-size: 15pt;
  font-family: Impact;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 22px;
}

header .header-main .seven-shape {
  background: url(../img/nav-btn7.png) no-repeat;
  border: none;
  float: left;
  width: 243px;
  height: 84px;
  color: white;
  text-align: center;
  font-size: 15pt;
  font-family: Impact;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 22px;
}

header .header-main .eight-shape {
  background: url(../img/nav-btn8.png) no-repeat;
  border: none;
  float: left;
  width: 243px;
  height: 84px;
  color: white;
  text-align: center;
  font-size: 15pt;
  font-family: Impact;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 22px;
}

header .header-main .nine-shape {
  background: url(../img/Untitled-9.png) no-repeat;
  border: none;
  float: left;
  width: 243px;
  height: 84px;
  color: white;
  text-align: center;
  font-size: 15pt;
  font-family: Impact;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 22px;
}

header .header-h1 {
  text-align: center;
  color: #b1262b;
  font-size: 15pt;
  cursor: pointer;
}

.btn-check:focus+.btn,
.btn:focus {
  outline: 0;
  box-shadow: unset !important;
}

/* ......../dungeon........... start */

.home-main-sec5 {
  float: left;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  position: fixed;
}

.home-main-sec5 .dragun-main {
  float: left;
  width: 100%;
  list-style: none;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  padding: 40px 0px;
  margin-bottom: 0;
  padding-bottom: 40px;
}

.dragun-main::before {
  height: 824px;
  width: 800px;
  background-image: url(../img/assassin.png);
  background-repeat: no-repeat;
  content: "";
  left: -10%;
  bottom: -8%;
  position: absolute;
}

#same-here {
  height: 98%;
}

.home-main-sec5 .dragun-main img {
  margin-right: 57px;
  opacity: 80%;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
}

.home-main-sec5 .dragun-main h1 {
  color: white;
  text-align: center;
  font-size: 29px;
  width: 63%;
  line-height: 43px;
  margin-top: 20px;
}

li.dragun-upper {
  float: left;
  display: flex;
  justify-content: center;
  align-items: center;
}

.home-main-sec5 .dragun-main::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 636px;
  background: url(../img/dragun-cartoon1.png);
  background-repeat: no-repeat;
  top: 17%;
  left: 64%;
  z-index: -1;
}

.coming-txt {
  position: absolute;
  color: #b1262b;
  font-size: 68px;
  text-shadow: 1px 1px 3px #fff !important;
  font-weight: 600 !important;
  top: 31%;
  left: 54.5%;
}

.dragun-text {
  float: left;
  width: 100%;
}

.dragun-text .text-dragun p {
  color: white;
  font-size: 25px;
  width: 96%;
  text-align: center;
}

section.home-main-sec5:after {
  content: "";
  width: 569px;
  height: 830px;
  background: url(../img/minotaur.png);
  background-repeat: no-repeat;
  left: 71%;
  position: absolute;
  z-index: -1;
  bottom: -8%;
}

.flash-btn {
  width: 332px;
  height: 86px;
  background-image: url('../img/HOME-email-blanktext.png');
  background-size: cover;
  border-radius: 10px;
  animation: flash 1.2s infinite alternate;
  cursor: pointer;
}

@keyframes flash {
  0% {
    background-image: url('../img/HOME-email-blanktext.png');
  }

  50% {
    background-image: url('../img/HOME-email-blank.png');
  }

  100% {
    background-image: url('../img/HOME-email-blanktext.png');
  }
}

.col-md-12.text-dragun {
  color: white;
  font-size: 26px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.col-md-12.text-dragun p {
  width: 58%;
  text-align: center;
  position: relative;
  z-index: 9;
}

/* ......................end-dungeon........... */

/* .............start busness................./ */

section.home-main-sec1::after {
  content: "";
  position: absolute;
  background-image: url(../img/bussines-cartoon.png);
  background-repeat: no-repeat;
  background-size: cover;
  width: 34%;
  height: 100%;
  top: 3%;
  left: -12%;
}

.home-main-sec3 {
  float: left;
  width: 100%;
  padding: 30px 0px;
  height: 63vh;
}

.modal-header1 {
  float: left;
  width: 100vh;
  background-size: contain;
  background-repeat: no-repeat;
  display: flex;
  padding: 43px;
  justify-content: center;
  align-items: center;
  border: unset;
  height: 83vh;
  flex-direction: column;
  border-bottom: unset !important;
}

.close-btn1 {
  position: absolute;
  top: 0% !important;
  left: 111%;
  z-index: 1;
}

img.arrowleft {
  position: fixed;
  top: 79%;
  left: 25.4%;
}

img.arrowright {
  position: fixed;
  top: 79%;
  left: 69%;
}

div#slider-nd {
  width: 27%;
  left: 36%;
}

.home-main-sec .head-ul .main-right .simg {
  width: 100%;
  max-width: 226px;
  border-radius: 4px;
  transform: rotate(8deg);
}

.modal-backdrop.show {
  opacity: 0.5;
  z-index: 1;
}

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

::-webkit-scrollbar-track {
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: #fff !important;
}

.sethedigb {
  background: unset !important;
}

.modal-header {
  float: left;
  width: 100%;
  background-image: url(../img/model-bg.png);
  background-size: contain;
  background-repeat: no-repeat;
  display: flex;
  padding: 43px;
  /* justify-content: center; */
  align-items: center;
  flex-direction: column;
  border-bottom: unset !important;
}

.close-btn {
  position: absolute !important;
  right: 0% !important;
  margin-top: -12px !important;
}

.modal {
  overflow: hidden !important;
}


.modal-content {
  width: 1000px !important;
  background-color: unset !important;
  margin-left: -50%;
  margin: 0 auto !important;
}

.close-btn1 {
  position: absolute;
  top: -3% !important;
  left: 90.7%;
  z-index: 1;
}

.modal-header .modal-title {
  margin-bottom: 0;
  line-height: 1.5;
  font-size: 44px;
  color: black;
  text-decoration: underline;
  letter-spacing: 2px;
}

.modal-header .poppu-para {
  font-size: 29px;
  text-align: center;
}

.popup-footer {
  float: left;
  width: 100%;
  padding: 30px;
}

.popup-ul {
  list-style: none;
  display: flex;
  justify-content: center;
  align-items: center;
}

.carousel-inner {
  box-shadow: 5px 10px 100px 10px #fff !important;
}

/* ...........cthulhu................. */
.home-main-sec7 {
  float: left;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.cthulhu-right img {
  width: 85%;
}

.cthulhu-left h1 {
  font-size: 84px;
  color: #b1262b;
  font-weight: 500;
  text-shadow: 1px 1px 3px #fff !important;
  margin-bottom: 1rem;
}

.cthulhu-left h2 {
  color: white;
  font-size: 28px;
}

.home-main-sec7 .cthulhu-ul {
  display: flex;
  justify-content: space-around;
  list-style: none;
  padding: 0;
}

.home-main-sec7 .cthulhu-left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.home-main-sec7 .cthulhu-box {
  margin-inline: 15px;
}

.cthulhu-right .left-shapes {
  float: left;
  width: 20%;
  height: 240px;
  position: absolute;
  background: url(../img/shape-cthulhu.png) no-repeat;
  top: 41%;
  z-index: 5;
  left: 12%;
  color: white;
  font-size: 28px;
}

.cthulhu-right .left-shapes p {
  transform: rotate(337deg);
  position: absolute;
  top: 37%;
  left: 48px;
  color: black;
}

#add-cracter img {
  max-width: 200px;
  width: 100%;

}


/* .stay-soon p {
  animation: fadeBlink 2s infinite;
}


@keyframes fadeBlink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
} */


.stay-soon p {
  overflow: hidden;
  border-right: 2px solid #FF5B00;
  white-space: nowrap;
  width: 0;
  animation: typing 4s steps(40, end) infinite alternate,
    blink 0.75s step-end infinite;
}

@keyframes typing {
  from {
    width: 0
  }

  to {
    width: 100%
  }
}

@keyframes blink {

  from,
  to {
    border-color: transparent
  }

  50% {
    border-color: #FF5B00
  }
}


.cthulhu-ul {
  list-style: none;
  display: flex;
  gap: 15px;
}

.cthulhu-box img {
  width: 220px;
  cursor: pointer;
  border-radius: 8px;
  transition: transform 0.3s;
}

.cthulhu-box img:hover {
  transform: scale(1.05);
}

/* Fullscreen overlay */
.image-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.9);
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.image-overlay img {
  max-width: 90%;
  max-height: 90%;
  border-radius: 10px;
}

.image-overlay:target {
  display: flex;
}

.image-overlay .close-btn {
  position: absolute;
  top: 20px;
  right: 30px;
  font-size: 30px;
  color: #fff;
  cursor: pointer;
}
















.col-md-8.cthulhu-left:after {
  content: "";
  width: 22%;
  height: 84vh;
  position: absolute;
  background: url(../img/cthulhu-after.png);
  background-repeat: no-repeat;
  left: 78%;
  top: 15%;
}

.home-main-sec10 {
  float: left;
  width: 100%;
  padding: 42px 0px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.slider-con {
  display: flex;
  justify-content: center;
  align-items: center;
}

img.arrow2 {
  position: absolute;
  top: 99%;
  left: 2%;
}

#arrow-set {
  position: fixed;
  top: 85% !important;
  left: 22.5% !important;
}

#arrow-right {
  position: fixed;
  top: 85%;
  z-index: 999;
  left: 75.5% !important;
}

#cursor-space {
  transition: unset !important;
}

.inner-carousel {
  box-shadow: 5px 10px 100px 10px #fff !important;
  position: fixed;
  top: 8% !important;
  left: 4.5% !important;
}

.carousel-inner {
  box-shadow: 5px 10px 100px 10px #fff !important;
  position: fixed !important;
  top: 3% !important;
  width: 63% !important;
  left: 18.8% !important;
}

.home-main-sec10::after {
  content: "";
  width: 50%;
  background-image: url(../img/whitepaper-after.png);
  background-repeat: no-repeat;
  height: 100vh;
  position: absolute;
  left: 14%;
  top: 10%;
  z-index: -1;
}

.home-main-sec10 .container {
  max-width: 1100px;
}

.btn-check:focus+.btn,
.btn:focus {
  outline: 0;
  box-shadow: unset !important;
}

.container .outer-slider .inner-slider ul li {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 20px;
  margin: 10px;
}

.owl-item {
  width: 400px !important;
  margin-right: 170px !important;
}

.owl-carousel .owl-stage-outer {
  height: 57vh !important;
}

img.arrow3 {
  position: absolute;
  left: 58%;
  top: 74%;
}

img.arrow4 {
  position: absolute;
  top: 74%;
  left: 42%;
}

.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-nav button.owl-prev {
  background-image: url(../img/arrowright.png) !important;
  background-color: unset !important;
  width: 6%;
  background-repeat: no-repeat !important;
  color: #fc0303 !important;
  height: 46px !important;
  position: absolute;
  left: 59%;
}

.owl-carousel .owl-nav button.owl-next {
  background-image: url(../img/arrowleft.png) !important;
  background-color: unset !important;
  width: 7%;
  background-repeat: no-repeat !important;
  color: #fc0303 !important;
  height: 44px;
  position: absolute;
  left: 37%;
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
  background-image: unset !important;
}

/* ........coin-page................. */

.coin-sec {
  float: left;
  width: 100%;
}

.coin-sec .coin-img {
  float: left;
  position: relative;
  width: 100%;
}

.coin-sec .coin-leftright {
  display: flex;
  align-items: flex-start;
  color: white;
  flex-direction: column;
  text-align: center !important;
  padding-left: 3%;
}

.col-md-4.coin-leftside {
  padding-left: 3%;
}

.coin-sec .coin-leftright .coim-para {
  width: 92%;
  font-size: 30px;
  letter-spacing: 0.4px !important;
}

.footer-h1-text {
  font-size: 45px;
  color: #fff;
  float: left;
  width: 92%;
  text-align: center !important;
  text-decoration: underline;
  cursor: pointer;
  margin-top: 2rem;
}

.modal-backdrop.show {
  opacity: 0.5;
  z-index: -1;
}

li#res-set img {
  max-width: 564px;
  margin: 0;
}

li#res-set {
  width: 50%;
  justify-content: end;
}

li#dungeon-setting {
  width: 50%;
  justify-content: start;
}

.home-main-sec5 .dragun-main {
  gap: 20px;
}

#modal-content1 {
  float: left;
  background-image: url(../img/model-bg.png);
  background-size: contain !important;
  background-repeat: no-repeat;
  position: relative;
  top: 0%;
  margin-top: 150px !important;
  overflow: auto !important;
  padding: 50px !important;
}

.modal-header {
  float: left;
  width: 100%;
  display: flex;
  padding: 43px !important;
  height: 56%;
  padding-top: 20px !important;
  overflow-y: auto !important;
  /* justify-content: center; */
  align-items: center;
  flex-direction: column;
  border-bottom: unset !important;
}

#cls-btn {
  position: absolute !important;
  margin-top: 0px !important;
  top: 13% !important;
  right: -57px !important;
  margin-left: 99px;

}

#modal-head {
  width: 100% !important;
  padding-top: 43px;
}

#modal-dialogs {
  max-width: 640px !important;
}

.close-btn {
  position: absolute !important;
  right: 0% !important;
  margin-top: -12px !important;
}

.modal-dialog {
  position: relative;
  height: 100vh !important;
  max-width: 1000px !important;
  margin: 1.75rem auto !important;
  pointer-events: none;
}

.content-modal {
  background-color: unset !important;
  margin-left: -50%;
}

.modal-header .modal-title {
  margin-bottom: 0;
  line-height: 1.5;
  font-size: 44px;
  letter-spacing: 0.4px !important;
  color: black;
  text-decoration: underline;
}

.modal-header .poppu-para {
  font-size: 29px;
  text-align: center;
  letter-spacing: 0.4px !important;
}

.popup-footer {
  float: left;
  width: 100%;
  padding: 30px;
}

#cls-btnn {
  position: absolute;
  right: -7%;
  top: 0;
}

.popup-ul {
  list-style: none;
  display: flex;
  justify-content: center;
  align-items: center;
}

.text-footer {
  font-size: 32px;
  text-align: center;
}

.modal-header1 {
  float: left;
  width: 100vh;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  padding: 43px;
  /* justify-content: center; */
  align-items: center;
  border: unset;
  height: 83vh;
  flex-direction: column;
  border-bottom: unset !important;
}

#modal-header1 {
  padding: 78px !important;
  background-size: cover;
  overflow-y: scroll;
}

#modal-content1 {
  background-color: unset !important;
  /* margin-left: -47% !important; */
  height: 100vh !important;
}

.popup-para-h {
  text-align: left;
  font-size: 20px;
}

#exampleModalLabel2 {
  font-size: 30px !important;
  text-decoration: none !important;
}

.modal-header h1 {
  font-size: 24px;
  letter-spacing: 2px;
}

img.arrowright2 {
  position: fixed;
  top: 81%;
  left: 58%;
}

.close-btn2 {
  position: absolute;
  top: 12%;
  left: 93.5%;
  z-index: 1;
}

img.arrowleft1 {
  position: fixed;
  left: 37%;
  top: 81%;
}

div#ss-2 {
  margin-left: 6%;
  width: 100%;
}

/* ............./............value........................... */

.modal-content {
  border: unset !important;
}

#body-value {
  /* background-image: url(../img/value-bg-after-.jpg); */
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 100%;
  min-height: 100vh;
}

.home-main-sec2 {
  float: left;
  width: 100%;
  padding: 30px;
}

.home-main-sec2 .value-right {
  float: left;
  margin-left: 50px !important;
}

.navbar.fixed {
  background: #2856bf;
  position: fixed;

  /* Vault Page Styles */
  .vault-main-sec {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
  }

  .vault-container {
    position: relative;
    width: 100%;
    height: 100vh;
  }

  .vault-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
  }

  .vault-bg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .vault-header {
    position: absolute;
    top: 50px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    z-index: 10;
  }

  .vault-title {
    font-size: 3rem;
    font-weight: bold;
    color: #ffffff;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
    margin: 0;
    letter-spacing: 3px;
  }

  .vault-subtitle {
    font-size: 1.2rem;
    color: #cccccc;
    margin: 10px 0 0 0;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
  }

  .vault-content {
    position: absolute;
    top: 150px;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    z-index: 5;
    padding: 0 50px;
  }

  /* Sidebar Filters */
  .vault-sidebar {
    width: 300px;
    background: rgba(40, 40, 40, 0.9);
    border: 2px solid #666;
    border-radius: 10px;
    padding: 20px;
    height: fit-content;
    backdrop-filter: blur(5px);
    /* Added absolute positioning to prevent overlap */
    position: absolute;
    left: 50px;
    top: 0;
    z-index: 15;
  }

  .filter-header {
    background: #666;
    color: white;
    padding: 15px;
    text-align: center;
    font-weight: bold;
    font-size: 1.5rem;
    border-radius: 8px;
    margin-bottom: 10px;
  }

  .filter-divider {
    background: #555;
    color: white;
    padding: 10px;
    text-align: center;
    font-weight: bold;
    border-radius: 5px;
    margin-bottom: 20px;
  }

  .filter-categories {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  .filter-row {
    display: flex;
    gap: 8px;
  }

  .filter-btn {
    flex: 1;
    background: #777;
    color: white;
    border: none;
    padding: 12px 8px;
    border-radius: 5px;
    font-size: 0.9rem;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.3s ease;
    text-transform: uppercase;
  }

  .filter-btn.filter-all {
    background: #4a9eff;
    font-weight: bold;
  }

  /* .filter-btn.filter-all:hover {
    background: #5ba8ff;
  } */

  /* .filter-btn.active {
    background: #66bb6a;
    box-shadow: 0 0 10px rgba(102, 187, 106, 0.5);
  } */

  .filter-btn:hover {
    /* background: #888; */
    transform: translateY(-2px);
  }

  .filter-btn:active {
    background: #999;
    transform: translateY(0);
  }

  /* Cards Display Area */
  .vault-cards-area {
    flex: 1;
    /* Adjusted margin to account for absolute sidebar */
    margin-left: 380px;
    display: flex;
    flex-direction: column;
    gap: 30px;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 10;
  }

  /* Added carousel styles */
  .cards-carousel {
    position: relative;
    width: 100%;
    max-width: 1200px;
  }

  .cards-container {
    position: relative;
    overflow: hidden;
    border-radius: 15px;
  }

  .cards-slide {
    display: none;
    flex-direction: column;
    gap: 30px;
    padding: 20px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 15px;
    backdrop-filter: blur(10px);
  }

  .cards-slide.active {
    display: flex;
  }

  .carousel-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.2);
    border: 2px solid rgba(255, 255, 255, 0.3);
    color: white;
    font-size: 2rem;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.3s ease;
    z-index: 20;
    backdrop-filter: blur(5px);
  }

  .carousel-nav:hover {
    /* background: rgba(255, 255, 255, 0.3); */
    transform: translateY(-50%) scale(1.1);
  }

  .carousel-nav.prev {
    left: -25px;
  }

  .carousel-nav.next {
    right: -25px;
  }

  .cards-row {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
  }

  .card-item {
    position: relative;
    transition: all 0.3s ease;
  }

  .vault-card {
    width: 200px;
    height: auto;
    border-radius: 15px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.6);
    transition: all 0.3s ease;
    cursor: pointer;
  }

  .card-item:hover .vault-card {
    transform: scale(1.05) translateY(-10px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.8);
  }

  .card-item:hover {
    z-index: 10;
  }

  /* Responsive Design */
  @media (max-width: 1200px) {
    .vault-content {
      padding: 0 20px;
    }

    .vault-sidebar {
      left: 20px;
    }

    .vault-cards-area {
      margin-left: 350px;
    }

    .vault-card {
      width: 180px;
    }
  }

  @media (max-width: 768px) {
    .vault-content {
      flex-direction: column;
      padding: 0 15px;
    }

    .vault-sidebar {
      position: relative;
      left: 0;
      width: 100%;
      margin-bottom: 20px;
    }

    .home-main-sec .head-ul .main-right .simg {
      width: 100%;
      max-width: 103px;
      height: auto;
    }

    .vault-cards-area {
      margin-left: 0;
    }

    .vault-title {
      font-size: 2rem;
    }

    .vault-card {
      width: 150px;
    }

    .cards-row {
      gap: 15px;
    }
  }

  @media (max-width: 480px) {
    .vault-header {
      top: 20px;
    }

    .vault-content {
      top: 120px;
    }

    .vault-title {
      font-size: 1.5rem;
    }

    .vault-card {
      width: 120px;
    }

    .filter-btn {
      font-size: 0.8rem;
      padding: 10px 6px;
    }
  }

  /* Animation Effects */
  @keyframes cardFloat {

    0%,
    100% {
      transform: translateY(0px);
    }

    50% {
      transform: translateY(-5px);
    }
  }

  .vault-card {
    animation: cardFloat 3s ease-in-out infinite;
  }

  .card-item:nth-child(2n) .vault-card {
    animation-delay: 1s;
  }

  .card-item:nth-child(3n) .vault-card {
    animation-delay: 2s;
  }

  width: 100%;
  padding-top: 0;
  padding-bottom: 0;
  transition: .5s;
}

.home-main-sec2 .value-left {
  float: left;
}

.home-main-sec2 .box-head {
  display: flex;
  justify-content: space-evenly;
  list-style: none;
}

.text-editor {
  text-align: right !important;
  padding-right: 80px;
}

.text-center1 {
  text-align: right !important;
  padding-right: 180px;
}

.left-main .left1 {
  background: url(../img/value-leftside.png);
  background-repeat: no-repeat;
  height: 72px;
  margin-bottom: 30px;
  width: 100%;
}

ul.left-main {
  list-style: none;
}

.sec-head {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 15px 1px;
  font-size: 19px;
}

.sec-head img {
  padding-inline: 4px;
}

.comingsoon .text-soon {
  position: absolute;
  top: 30%;
  font-size: 139px;
  transform: rotate(343deg);
  color: #b1262b;
  text-shadow: 8px 0px 17px #ffffff;
  width: 76%;
  left: 14%;

}

.text-headimg {
  float: left;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.home-main-sec2 .text-head {
  float: left;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 30px;
}

.home-main-sec2 .text-headimg h1 {
  padding: 7px 64px;
  text-align: center;
  text-transform: capitalize;
}

/* .......................arkhampoker....start....................... */

.home-main-sec4 {
  float: left;
  width: 100%;
  padding: 77px 0px;
  padding-top: 63px;
}

.home-main-sec4 .poker-left {
  float: left;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.col-md-6.poker-left::before {
  height: 824px;
  width: 771px;
  background-image: url(../img/gambler.png);
  background-repeat: no-repeat;
  content: "";
  left: -17%;
  bottom: -0;
  position: absolute;
}

.home-main-sec4 .poker-left h1 {
  font-size: 94px;
  color: #b1262b;
  font-weight: 500 !important;
  text-shadow: 1px 1px 3px #fff !important;
  position: relative;
  z-index: 9;
}

.home-main-sec4 .poker-left h2 {
  color: white;
  text-align: center;
  line-height: 43px;
  margin-top: 20px;
  font-size: 31px;
  position: relative;
  z-index: 9;
}

.home-main-sec4 .poker-right {
  float: left;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}

.home-main-sec4 .poker-right .mid-main {
  display: flex;
  justify-content: flex-start;
  align-items: baseline;
  padding: 0;
  list-style: none;
}

/* .....................fantasy.......start................. */

.home-main-sec6 {
  float: left;
  width: 100%;
  padding: 37px 0px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
}

.fantasy-right {
  float: left;
  text-align: center;
  color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.col-md-8.fantasy-right h2 {
  font-size: 30px;
  line-height: 1.5;
}

.fantasy-right h1 {
  font-size: 94px;
  color: #b1262b;
  text-shadow: 1px 1px 3px #fff !important;
  font-weight: 500 !important;
}

.fantasy-left img {
  width: 93%;
  float: left;
  margin-left: 50px;
}

.col-md-4.fantasy-left {
  display: flex;
  align-items: center;
  justify-content: center;
}

.col-md-8.fantasy-right::after {
  content: "";
  position: absolute;
  width: 56%;
  height: 100%;
  background: url(../img/fantasy-after.png);
  background-repeat: no-repeat;
  top: 12%;
  left: -431px;
  z-index: -1;
}

.modal.show .modal-dialog {
  transform: none;
}

.text-head::before {
  float: left;
  width: 700px;
  height: 490px;
  background-image: url(../img/only.png);
  background-repeat: no-repeat;
  content: "";
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 30%;
  left: 28%;
  transform: skewX(0deg);
  transform: rotate(1deg);
}

.cls-btn {
  position: absolute !important;
  left: 92% !important;
  margin-top: -90px !important;
}

.cthulhu-left h2 {
  color: #fff;
  font-size: 26px;
  line-height: 1.5;
}

/* /////////////////end design//////////////// */
#arkham-img {
  width: 60% !important;
  margin-right: -150px;
}

#arkham-container {
  display: flex !important;
}

.cthulhu-right {
  margin-left: -100px;
  margin-right: 30px;
}

#footer-txt {
  float: left !important;
  width: 100% !important;
  padding: 0px !important;
  padding-top: 95px !important;
  height: 0px !important;
  align-items: center !important;
}

.discord-text {
  color: #212529 !important;
}

li#res-set {
  margin-left: 60px;
}

@media only screen and (orientation: landscape) {
  #turn {
    display: block;
  }

  #container {
    display: none;
  }
}

@media only screen and (orientation: portrait) {
  #turn {
    display: none;
  }

  #container {
    display: block;
  }
}

/* ///////////////RESPONSIVE FILE//////////////// */

@media (max-width: 1944px) {
  #arkham-img {
    width: 100% !important;
    margin-right: -150px;
  }

  .cthulhu-right .left-shapes {
    left: 14%;
  }

  .cthulhu-left h2 {
    color: #fff;
    font-size: 28px;
    line-height: 1.5;
  }

  .carousel-inner {
    box-shadow: 5px 10px 100px 10px #fff !important;
    position: fixed !important;
    top: 9% !important;
    width: 57% !important;
    left: 22% !important;
  }

  #arrow-set {
    position: fixed;
    top: 80% !important;
    left: 26.5% !important;
  }

  #arrow-right {
    position: fixed;
    top: 80%;
    z-index: 999;
    left: 70.5% !important;
  }

  .close-btn1 {
    position: absolute;
    top: -2% !important;
    left: 103.5%;
    z-index: 1;
  }

  .coin-sec .coin-leftright .coim-para {
    width: 92%;
    font-size: 31px;
    letter-spacing: 0.4px !important;
  }
}

@media (max-width: 1900px) {
  .dragun-main::before {
    left: -12%;
    height: 670px;
  }

  .col-md-6.poker-left::before {
    left: -22%;
    height: 670px;
  }

  section.home-main-sec5:after {
    left: 63%;
    height: 670px;
  }

  .text-head::before {
    top: 38%;
  }

  .home-main-sec .container::after {
    width: 71% !important;
    height: 765px;
    left: -11%;
  }

  .home-main-sec .container::before {
    height: 670px;
  }

  #footer-txt {
    float: left !important;
    width: 100% !important;
    padding: 0px !important;
    padding-top: 24px !important;
    height: 0px !important;
    align-items: center !important;
    margin-bottom: 20px;
  }

  .coin-sec .coin-leftright .coim-para {
    width: 92%;
    font-size: 32px;
    letter-spacing: 0.4px !important;
  }

  .modal-header {
    height: 47%;
  }

  #modal-content1 {
    margin-top: 114px !important;
  }

  .cthulhu-right .left-shapes {
    left: 10%;
  }

  .home-main-sec4 .poker-left h1 {
    font-size: 64px;
    color: #b1262b;
  }

  .col-md-8.fantasy-right::after {
    top: 20%;
    /* left: 0%; */
    z-index: -1;
    /* width: 38%;
     */
  }

  .cthulhu-left h2 {
    color: #fff;
    font-size: 26px;
    line-height: 1.3;
  }

  .cthulhu-right .left-shapes {
    left: 14%;
  }

  .fantasy-right h1 {
    font-size: 64px;
  }

  .close-btn1 {
    left: 79.5% !important;
    z-index: 1;
    top: 0%;
  }

  .close-btn1 {
    position: absolute;
    top: 7% !important;
    left: 111%;
    z-index: 1;
  }

  .carousel-inner {
    box-shadow: 5px 10px 100px 10px #fff !important;
    position: fixed !important;
    top: 9% !important;
    width: 63% !important;
    left: 18.8% !important;
  }

  #arrow-set {
    position: fixed;
    top: 80% !important;
    left: 22.5% !important;
  }

  #arrow-right {
    position: fixed;
    top: 80%;
    z-index: 999;
    left: 75% !important;
  }

  #arkham-img {
    width: 74% !important;
    margin-right: -150px;
  }

  .home-main-sec4 .poker-left h2 {
    font-size: 35px;
  }

  .home-main-sec4 .poker-left h1 {
    font-size: 70px;
    color: #b1262b;
  }

  .coming-txt {
    top: 31% !important;
  }
}

@media (max-width: 1566px) {
  .dragun-main::before {
    left: -18%;
    height: 670px;
  }

  .stay-soon p {

    top: 32px;
    cursor: pointer;
    text-decoration: underline;
  }

  .home-main-sec .head-ul .main-right .simg {
    width: 100%;
    max-width: 202px;
    height: auto;
  }

  .col-md-6.poker-left::before {
    left: -28%;
    height: 670px;
  }

  li#res-set {
    margin-left: 50px;
  }

  .cthulhu-right .left-shapes {
    left: 12%;
  }

  .home-main-sec4 .poker-left {
    padding-left: 80px;
  }

  #modal-content1 {
    margin-top: 115px !important;
  }

  #cls-btn {
    position: absolute !important;
    right: -57px !important;
    margin-left: 40px;
    margin-top: 0px !important;
    top: 16% !important;
  }

  .home-main-sec2 .value-right {
    float: left;
    margin-left: 55px !important;
  }

  .home-main-sec2 .text-head {
    margin-top: 8px !important;
  }

  .text-head::before {
    left: 25%;
    top: 25%;
  }

  #body-value {
    width: 100%;
  }

  #footer-txt {
    float: left !important;
    width: 100% !important;
    padding: 0px !important;
    padding-top: 0px !important;
    height: 100px !important;
    align-items: center !important;
  }

  .modal-dialog {
    max-width: 1000px !important;
    margin: 0.5rem auto !important;
  }

  .close-btn {
    position: absolute !important;
    right: 0% !important;
    margin-top: -12px !important;

  }

  .modal-header {
    height: 64%;
  }

  #modal-head {
    width: 100% !important;
    padding-top: 43px;
    margin-top: 0px !important;
  }

  .home-main-sec .head-text img {
    height: 79px;
  }

  .main-left .bimg {
    height: 299px;
    margin-right: 0px;
    width: 400px;
    margin-top: 18px;
  }

  .main-right .simg {
    height: 256px;
    margin-left: 20px;
  }

  .footer .footer-h1 img {
    padding-top: 14px;
    height: 41px;
  }

  .col-md-12.text-dragun p {
    width: 62%;
    font-size: 22px;
  }

  .carousel-inner {
    box-shadow: 5px 10px 100px 10px #fff !important;
    position: fixed !important;
    top: 0% !important;
    width: 55% !important;
    left: 23.5% !important;
  }

  img.arrowleft {
    position: fixed;
    top: 74%;
    left: 31.7%;
  }

  div#slider-nd {
    width: 19%;
    left: 42%;
  }

  .footer {
    float: left;
    width: 100%;
    padding: 14px 0px;
    z-index: 1;
    margin-top: -10px;
  }

  .modal-header1 {
    float: left;
    width: 100vh;
  }

  .left-main .left1 {
    width: 191px;
    height: 57px;
    margin-bottom: 5%;
  }

  .sec-head {
    padding: 6px 5px;
    font-size: 19px;
  }

  .comingsoon .text-soon {
    top: 44%;
    font-size: 89px;
    transform: rotate(343deg);
    width: 45%;
    left: 18%;
  }

  section#footer2 {
    margin-top: -48px;
  }

  .text-editor {
    text-align: right !important;
    padding-right: 84px;
    font-size: 20px;
  }

  .col-md-8.value-right img {
    width: 53%;
  }

  .home-main-sec4 .poker-right img {
    width: 79% !important;
    position: relative;
    left: -2%;
  }

  .text-center1 {
    text-align: right !important;
    font-size: 20px;
    padding-right: 136px;
  }

  .home-main-sec {
    padding: 9px 0px;
  }

  .left-shape .left-text .rotate {
    left: 38px;
    top: -43px;
  }

  .right-shape .right-text .rotate2 {
    top: 10%;
    left: 39px;
  }

  .home-main-sec .head-ul .main-left::after {
    left: -32%;
    width: 100%;
    top: -46%;
  }

  .home-main-sec5 .dragun-main h1 {
    color: white;
    text-align: center;
    font-size: 22px;
    line-height: 34px;
    margin-top: 20px;
  }

  .home-main-sec .head-ul .main-right::after {
    right: 11%;
    top: -47%;
  }

  .home-main-sec .head-ul .main-right::after {
    right: -22%;
    top: -47%;
  }

  .left-shape {
    left: -38%;
    top: 20%;
    width: 352px;
  }

  .right-shape {
    right: -10%;
    top: 20%;
    width: 307px;
  }

  .coin-sec .coin-img {
    width: 100%;
  }

  .coin-sec .coin-leftright .coim-para {
    font-size: 24px;
    padding-left: 0px;
  }

  .coin-sec .coin-leftright {
    padding-right: 4%;
    padding-left: unset;
    padding-top: 0px;
  }

  img.arrowright {
    position: fixed;
    top: 74%;
    left: 63%;
  }

  .carousel {
    position: relative;
    left: -4%;
  }

  .close-btn1 {
    position: fixed;
    top: 14% !important;
    left: 81%;
    z-index: 1;
  }

  .modal-header .poppu-para {
    font-size: 20px;
    text-align: center;
  }

  .modal-header .modal-title {
    font-size: 33px;
  }

  .text-footer {
    font-size: 27px;
    text-align: center;
  }

  .home-main-sec2 .text-head h1 {
    font-size: 20px;
  }

  .owl-carousel .owl-item img {
    width: 63%;
  }

  img.arrow4 {
    position: absolute;
    top: 73%;
    left: 40%;
    z-index: 1;
  }

  img.arrow3 {
    position: absolute;
    top: 73%;
    left: 58%;
    z-index: 1;
  }

  .owl-carousel .owl-stage-outer {
    height: 55vh !important;
  }

  .home-main-sec4 .poker-left h2 {
    line-height: 39px;
    margin-top: 0px;
    font-size: 27px;
  }

  .home-main-sec4 {
    padding: 0px;
  }

  .navbar-nav .top-nav .nav-item {
    margin-left: 0;
  }

  .footer .footer-main {
    gap: 0px;
  }

  .modal-content {
    margin-left: -30%;
    top: 8%;
  }

  .home-main-sec5 .dragun-main::after {
    width: 31%;
    top: 17%;
    left: 56%;
  }

  .soon-text h1 {
    top: 29%;
    left: 27%;
  }

  .home-main-sec6 {
    padding: 24px 0px;
  }

  .col-md-8.fantasy-right::after {
    top: 12%;
    /* left: -13%; */
    z-index: -1;
    /* width: 38%; */
  }

  .home-main-sec7 {
    padding-top: 0px;
  }

  .home-main-sec5 .dragun-main img {
    width: 63%;
  }

  .fantasy-right h1 {
    font-size: 64px;
  }

  .col-md-8.fantasy-right h2 {
    font-size: 22px;
    width: 100%;
  }

  .fantasy-left img {
    width: 63%;
  }

  .cthulhu-left h1 {
    font-size: 63px;
    font-weight: 500 !important;
  }

  .cthulhu-left h2 {
    color: white;
    font-size: 22px;
  }

  .cthulhu-right img {
    width: 74%;
    margin-left: 100px;
  }

  section#footerid {
    margin-top: -63px;
  }

  section#footerid .footer-h1 {
    font-size: 29px;
    text-align: right;
    padding-right: 15%;
  }

  header .top-nav {
    padding: 8px 0px !important;
  }

  .soon-text h1 {
    top: 30%;
    left: 57%;
    font-size: 47px;
    font-weight: bolder;
  }

  .close-btn2 {
    top: 18.7%;
    left: 74%;
    width: 8%;
    z-index: 1;
  }

  .home-main-sec5 .dragun-main img {
    margin-right: 0px;
  }

  .dragun-text .text-dragun p {
    font-size: 21px;
  }

  .cthulhu-right .left-shapes {
    float: left;
    width: 31%;
    height: 204px;
    left: 6%;
  }

  .home-main-sec7 .cthulhu-box img {
    width: 77%;
  }

  .cthulhu-right .left-shapes p {
    top: 43%;
    left: 42px;
    font-size: 30px;
  }

  .col-md-8.cthulhu-left:after {
    content: "";
    width: 21%;
    left: 79%;
    top: 16%;
  }

  img.arrowleft1 {
    position: fixed;
    left: 42%;
    top: 76%;
    width: 4%;
  }

  img.arrowright2 {
    position: fixed;
    top: 76%;
    left: 57%;
    width: 4%;
  }

  .footer .footer-h1 {
    top: -46px;
  }

  #arrow-right {
    position: fixed;
    top: 74% !important;
    left: 71% !important;
  }

  #arrow-set {
    position: fixed;
    top: 74% !important;
    left: 28% !important;
  }

  .close-btn1 {
    left: 78.5%;
    z-index: 1;
    top: 0% !important;
  }

  .cthulhu-left h2 {
    color: white;
    font-size: 17px;
  }
}

#modal-content1 {
  overflow: unset !important;

}

@media screen and (max-width: 1566px),
screen and (max-height: 768px) {
  #modal-content1 {
    overflow: unset !important;
    margin-top: 75px !important;
  }

  #cls-btn {
    position: absolute !important;
    right: -57px !important;
    margin-left: 40px;
    margin-top: 0px !important;
    top: 13% !important;
  }
}

@media (max-width: 1536px) {
  .soon-text h1 {
    top: 29.5%;
    font-weight: bolder !important;
    left: 57%;
    font-size: 47px;
  }

  .fantasy-left img {
    margin-left: unset;
  }

  .home-main-sec .head-ul .main-right {
    list-style: none;
    width: 50%;
    position: relative;
  }

  #body-value {
    width: 100% !important;
  }

  .home-main-sec .head-ul .main-right::after {
    right: 3%;
    top: -47%;
    z-index: -1;
  }

  .home-main-sec .head-ul .main-left::after {
    left: 16%;
    width: 100%;
    z-index: -1;
    top: -44%;
  }

  .home-main-sec2 .box-head {
    margin: 0;
    padding: 0;
  }

  .footer .footer-h1 img {
    padding-top: 14px;
    height: 42px;
  }

  .coin-sec .coin-leftright .coim-para {
    font-size: 24px;
  }

  #footer-txt .coming-image {
    max-width: 400px;
  }

  img.arrowleft {
    position: fixed;
    top: 79%;
    left: 31.4%;
  }

  img.arrowright {
    position: fixed;
    top: 79%;
    left: 65%;
  }

  .carousel-inner {
    width: 60% !important;
    left: 21% !important;
  }

  #arrow-set {
    position: fixed;
    top: 77% !important;
    left: 29% !important;
  }

  #arrow-right {
    position: fixed;
    top: 77%;
    left: 69% !important;
  }

  .coin-sec .coin-img {
    width: 95%;
  }

  .carousel {
    position: relative;
    left: 9%;
  }

  .close-btn1 {
    left: 81% !important;
    z-index: 1;
    top: 0% !important;
  }

  .cthulhu-left h2 {
    color: white;
    font-size: 17px;
  }

  .owl-carousel .owl-stage-outer {
    height: 51vh !important;
  }

  .owl-carousel .owl-item img {
    display: block;
    width: 75%;
  }

  .comingsoon .text-soon {
    top: 39%;
    font-size: 112px;
    transform: rotate(343deg);
    width: 76%;
    left: 9%;
  }

  .home-main-sec2 {
    padding: 0px;
  }

  .home-main-sec2 .box-head {
    margin: 0;
  }

  .flash-btn {
    width: 238px;
    height: 60px;
  }

  .home-main-sec2 .value-right {
    float: left;
    padding: 0;
    margin: 0;
  }

  .text-editor {
    text-align: right !important;
    padding-right: 170px;
  }

  .home-main-sec2 .container {
    max-width: 1258px;
  }

  .text-center1 {
    text-align: right !important;
    padding-right: 215px;
  }

  .home-main-sec4 {
    padding: 42px 0px;
  }

  .home-main-sec4 .poker-left h1 {
    font-size: 60px;
  }

  .home-main-sec4 .poker-left h2 {
    line-height: 33px;
    margin-top: 10px;
    font-size: 24px;
  }

  .home-main-sec5 .dragun-main::after {
    width: 31%;
    top: 17%;
    left: 58%;
  }

  .home-main-sec5 .dragun-main h1 {
    color: white;
    text-align: center;
    font-size: 27px;
    line-height: 37px;
    margin-top: 20px;
  }

  .home-main-sec5 .dragun-main {
    padding-top: 20px;
    padding-bottom: 15px;
  }

  .soon-text h1 {
    top: 30%;
    /* left: 48%; */
  }

  .col-md-8.fantasy-right h2 {
    font-size: 24px;
    width: 100%;
  }

  .fantasy-right h1 {
    font-size: 60px;
    color: #b1262b;
    text-shadow: 1px 1px 3px #fff !important;
  }

  /* .fantasy-left img {
    width: 100%;
  } */

  .home-main-sec7 .container {
    max-width: 1000px;
  }

  .cthulhu-left h1 {
    font-size: 70px;
  }

  .cthulhu-right {
    margin-left: 0px;
    margin-right: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .cthulhu-left h2 {
    color: white;
    font-size: 25px;
  }

  .cthulhu-right img {
    width: 80%;
    margin-left: -50px;
  }

  .cthulhu-right .left-shapes {
    float: left;
    width: 25%;
    height: 206px;
    font-size: 36px;
    left: 13.5%;
  }

  .cthulhu-left h2 {
    color: white;
    font-size: 18px;
  }

  .home-main-sec7 {
    padding-top: 0px !important;
  }

  #body-value {
    overflow: scroll;
  }
}

@media screen and (max-width: 1536px),
screen and (max-height: 768px) {
  #modal-content1 {
    margin-top: 75px !important;
  }

  #cls-btn {
    position: absolute !important;
    right: -57px !important;
    margin-left: 40px;
    margin-top: 0px !important;
    top: 13% !important;
  }
}

@media screen and (max-width: 1440px),
screen and (max-height: 900px) {
  #modal-content1 {
    margin-top: 120px !important;
  }

  #cls-btn {
    position: absolute !important;
    right: -57px !important;
    margin-left: 40px;
    margin-top: 0px !important;
    top: 16% !important;
  }

  .modal-header {
    height: 60%;
  }
}

@media (max-width: 1366px) {
  #footer-txt {
    padding-top: 80px !important;
  }

  .coin-sec .coin-img {
    width: 85%;
  }

  .text-headimg {
    float: left;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100px;
    margin-bottom: 20px;
  }

  .close-btn1 {
    left: 86% !important;
    z-index: 1;
    top: 4% !important;
  }

  #arrow-right {
    position: fixed;
    top: 80% !important;
    left: 75% !important;
  }

  #arrow-set {
    position: fixed;
    top: 80% !important;
    left: 23% !important;
  }

  .carousel-inner {
    top: 4% !important;
    width: 70% !important;
    left: 16% !important;
  }

  .text-head::before {
    left: 25%;
    top: 30%;
  }

  .coin-sec .coin-leftright {
    padding-right: 0%;
  }

  .home-main-sec2 .text-head h1 {
    font-size: 2.5rem;
  }
}

@media (max-width: 1280px) {
  .col-md-6.poker-left::before {
    /* left: -25%; */
    height: 670px;
  }

  .home-main-sec7 .cthulhu-left {
    margin-left: 50px;
  }

  .dragun-main::before {
    left: -26%;
    height: 670px;
  }

  .text-headimg {
    float: left;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 0px;
  }

  .cthulhu-right {
    margin-left: -123px;
    margin-right: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #arkham-img {
    width: 74% !important;
    margin-right: -85px;
  }

  .text-head::before {
    left: 21%;
    top: 27%;
  }

  .home-main-sec4 .poker-left h1 {
    font-size: 64px;
  }

  .home-main-sec .container::after {
    width: 53% !important;
    left: -8%;
  }

  #footer-txt {
    float: left !important;
    width: 100% !important;
    padding: 0px !important;
    padding-top: 100px !important;
    height: 100px !important;
    align-items: center !important;
  }

  .col-md-12.text-dragun p {
    width: 75%;
  }

  .coming-image {
    float: left;
    width: 50% !important;
  }

  #modal-dialogs {
    max-width: 728px !important;
  }

  .close-btn {
    position: absolute !important;
    right: 0% !important;
    margin-top: -12px !important;

  }

  #modal-head {
    width: 100% !important;

  }

  .modal-dialog {
    margin: 0px auto !important;
  }

  .modal.show .modal-header {
    margin-top: 0px !important;
  }

  .carousel-inner {
    box-shadow: 5px 10px 100px 10px #fff !important;
    position: fixed !important;
    top: 6% !important;
    width: 58% !important;
    left: 22% !important;
  }

  .close-btn1 {
    position: fixed;
    top: 6% !important;
    left: 80% !important;
    z-index: 1;
  }

  .home-main-sec .head-ul .main-right::after {
    right: -15%;
    top: -47%;
    width: 87%;
  }

  .home-main-sec .head-ul .main-left::after {
    left: -28%;
    width: 100%;
    top: -44%;
  }

  section#footerid {
    margin-top: -37px;
  }

  .cthulhu-right img {
    width: 100%;
    margin-left: 0px;
  }

  div#slider-nd {
    width: 22%;
    left: 41%;
    top: 18%;
  }

  .home-main-sec10::after {
    left: 11%;
    top: 10%;
    z-index: -1;
  }

  .home-main-sec .head-ul .main-left::after {
    width: 609px;
  }

  .left-shape .left-text .rotate {
    left: 38px;
  }

  .right-shape .right-text .rotate2 {
    left: 41px;
  }

  .col-md-8.fantasy-right::after {
    top: 12%;
    /* left: -13%; */
    z-index: -1;
    /* width: 38%; */
  }

  .carousel {
    position: relative;
    left: -5%;
  }

  .close-btn2 {
    position: fixed;
    top: 17.7%;
    left: 63%;
    width: 3%;
    z-index: 1;
  }

  img.arrowright2 {
    left: 58%;
  }

  div#ss-2 {
    margin-left: -13%;
  }

  .home-main-sec4 .poker-left h2 {
    line-height: 1.5;
    margin-top: 8px;
    font-size: 28px;
  }

  .owl-carousel .owl-item img {
    width: 58%;
  }

  .col-md-8.value-right img {
    width: 67%;
  }

  .left-main .left1 {
    margin-bottom: 21%;
  }

  .left-main .left1 {
    width: 209px;
  }

  .comingsoon .text-soon {
    top: 40%;
    font-size: 77px;
    transform: rotate(343deg);
    width: 60%;
    left: 21%;
  }

  .owl-carousel .owl-nav button.owl-next {
    top: 89%;
  }

  .owl-carousel .owl-nav button.owl-next,
  .owl-carousel .owl-nav button.owl-prev {
    top: 90%;
  }

  .text-editor {
    font-size: 24px;
  }

  .home-main-sec2 .text-head h1 {
    font-size: 24px;
  }

  .text-center1 {
    text-align: right !important;
    padding-right: 125px;
    font-size: 24px;
  }

  .text-editor {
    text-align: right !important;
    padding-right: 150px;
    font-size: 24px;
  }

  .text-center1 {
    text-align: right !important;
    padding-right: 215px;
    font-size: 24px;
  }

  .home-main-sec5 .dragun-main::after {
    width: 31%;
    top: 17%;
    left: 59%;
  }

  .soon-text h1 {
    top: 27% !important;
    font-size: 55px;
    left: 48.5%;
  }

  .dragun-text .text-dragun p {
    font-size: 18px;
  }

  .home-main-sec5 .dragun-main img {
    width: 90%;
    margin-left: -40%;
  }

  .home-main-sec5 .dragun-main h1 {
    font-size: 21px;
    line-height: 31px;
  }

  .col-md-8.fantasy-right h2 {
    font-size: 23px;
    width: 85%;
  }

  .home-main-sec6 {
    padding: unset;
  }

  .cthulhu-left h1 {
    font-size: 58px;
  }

  .cthulhu-left h2 {
    color: white;
    font-size: 19px;
    line-height: 1.5;
  }

  .home-main-sec7 .container {
    max-width: 855px;
  }

  .cthulhu-right .left-shapes {
    top: 38%;
    left: 7%;
  }

  .fantasy-left img {
    /* width: 100%; */
    padding-bottom: 10px;
  }

  .main-left img {
    margin-top: 0px;
  }

  .main-right img {
    margin-top: 0px;
  }

  .right-shape .right-text .rotate2 {
    top: 75%;
  }

  .left-shape .left-text .rotate {
    top: 9px;
  }

  .left-shape {
    left: -43%;
    top: 38%;
  }

  .footer .footer-main {
    display: flex;
    justify-content: center;
    flex-direction: row;
    margin-top: 0px;
  }

  .coin-sec .coin-leftright .coim-para {
    font-size: 24px;
    line-height: unset !important;
  }

  .footer-h1-text {
    font-size: 32px;
  }

  .home-main-sec4 .poker-right img {
    width: 80%;
  }

  .home-main-sec5 .dragun-main h1 {
    font-size: 17px;
    line-height: 31px;
  }

  .col-md-8.fantasy-right h2 {
    font-size: 23px;
    width: 85%;
  }

  .coin-sec .coin-img {
    width: 100%;
  }

  .col-md-8.cthulhu-left:after {
    content: "";
    width: 21%;
    left: 79%;
    top: 16%;
    /* z-index: 1; */
  }

  #dungeon-setting {
    justify-content: flex-end;
  }

  .home-main-sec2 .box-head {
    margin: 0;
    margin-bottom: 0.5rem !important;
  }

  .valt-img {
    width: 20% !important;
    margin-top: 0px;
  }

  .right-shape {
    right: 0%;
    top: 14%;
    width: 307px;
  }

  .left-shape {
    left: -43%;
    top: 15%;
  }
}

@media screen and (max-width: 1280px),
screen and (max-height: 1024px) {
  #modal-content1 {
    margin-top: 100px !important;
  }

  .modal-header {
    height: 55%;
  }
}

@media screen and (max-width: 1280px),
screen and (max-height: 800px) {
  #modal-content1 {
    margin-top: 90px !important;
  }

  #cls-btn {
    position: absolute !important;
    /* right: 0 !important; */
    margin-left: 40px;
    margin-top: 0px !important;
    top: 15% !important;
  }

  .modal-header {
    height: 68%;
  }
}

@media screen and (max-width: 1280px) {
  .home-main-sec4 .poker-left {
    padding-left: 100px !important;
  }
}

@media (max-width: 1200px) {
  .coin-sec .coin-leftright .coim-para {
    font-size: 22px;
    line-height: unset !important;
  }

  .home-main-sec2 .value-right {
    float: left;
    margin-left: 30px !important;
  }

  #arkham-img {
    width: 60% !important;
    margin-right: -150px;
  }

  .home-main-sec4 .poker-left {
    padding-left: 30px !important;
  }

  .fantasy-left img {
    /* width: 100%; */
    padding-bottom: 10px;
  }

  .valt-img {
    width: 20% !important;
    margin-top: 20px;
  }

  .cthulhu-right {
    margin-left: 0px;
  }

  .cthulhu-right .left-shapes {
    top: 30%;
    left: 4.5%;
  }

  .cthulhu-right .left-shapes {
    float: left;
    width: 25%;
    height: 206px;
    font-size: 36px;
    left: 10.5% !important;
  }

  .col-md-12.text-dragun p {
    width: 69%;
    font-size: 17px;
  }

  .home-main-sec5 .dragun-main img {
    width: 95%;
    margin-left: -2%;
  }

  .text-footer {
    font-size: 32px;
    text-align: center;
    padding-left: 0px;
  }

  #footer-txt {
    float: left !important;
    width: 100% !important;
    padding: 0px !important;
    padding-top: 95px !important;
    height: 100px !important;
    align-items: center !important;
  }

  .soon-text h1 {
    top: 30% !important;
    left: 45.5%;
    font-size: 57px;
  }

  #exampleModalLabel2 {
    font-size: 30px !important;
    text-decoration: none !important;
  }

  .footer ul {
    padding: 0px;
  }

  .header .header-main {
    padding: 0px;
  }

  .close-btn1 {
    left: 78.5% !important;
    z-index: 1;
    top: 0% !important;
  }

  .home-main-sec4 .poker-left {
    margin-left: 85px;
    width: 50%;
  }

  .home-main-sec4 .poker-right img {
    width: 100%;
    left: 0;
  }

  .home-main-sec4 .poker-right {
    width: 30%;
    margin-left: 50px;
    margin-top: 20px;
  }

  .text-head::before {
    top: 24%;
    left: 10%;
  }

  .footer-h1-text {
    width: 100%;
    font-size: 30px;
  }

  #arrow-set {
    position: fixed;
    top: 80% !important;
    left: 22.5% !important;
  }

  .carousel-inner {
    box-shadow: 5px 10px 100px 10px #fff !important;
    position: fixed !important;
    top: 9.5% !important;
    width: 60% !important;
    left: 20.5% !important;
  }

  .close-btn1 {
    position: fixed;
    top: 9.5% !important;
    left: 80.5% !important;
    z-index: 1;
  }

  #arrow-right {
    position: fixed;
    top: 80% !important;
    left: 73.6% !important;
  }
}

@media screen and (max-width: 1280px),
screen and (max-height: 800px) {
  #modal-content1 {
    margin-top: 65px !important;
  }

  #cls-btn {
    position: absolute !important;
    /* right: 0 !important; */
    margin-left: 40px;
    margin-top: 0px !important;
    top: 12% !important;
    z-index: 9999;
    width: 7%;
  }

  .modal-header {
    height: 68%;
  }

  /* 
  #modal-content1 {
    margin-left: -50% !important;
  } */
}

@media (max-width: 1350px) {
  .close-btn1 {
    position: absolute;
    top: -7% !important;
    left: 90.7% !important;
    z-index: 1;
  }

  .carousel-inner {
    box-shadow: 5px 10px 100px 10px #fff !important;
    position: fixed !important;
    top: 11.5% !important;
    width: 63% !important;
    left: 18.8% !important;
  }

  #arrow-set {
    position: fixed;
    top: 80% !important;
    left: 22.5% !important;
  }

  #arrow-right {
    position: fixed;
    top: 80%;
    z-index: 999;
    left: 73% !important;
  }

  #modal-content1 {
    margin-top: 75px !important;
    padding: 10px !important;
  }

  #cls-btn {
    position: absolute !important;
    /* right: 0 !important; */
    margin-left: 40px;
    margin-top: 0px !important;
    top: 13% !important;
    z-index: 9999;
    width: 7%;
  }

  .modal-header {
    height: 68%;
  }
}

@media (max-width: 1199px) {
  .col-md-6.poker-left::before {
    /* left: -30%; */
    height: 670px;
  }

  .home-main-sec7 .cthulhu-left {
    margin-left: 0px;
  }

  .home-main-sec .head-ul .main-right::after {
    right: -28%;
  }

  .carousel-inner {
    box-shadow: 5px 10px 100px 10px #fff !important;
    position: fixed !important;
    top: 6% !important;
    width: 62% !important;
    left: 20.5% !important;
  }

  .close-btn1 {
    top: -12% !important;
    left: 95.5% !important;
    z-index: 1;
  }

  #arrow-set {
    position: fixed;
    top: 73% !important;
    left: 25.5% !important;
  }

  #arrow-right {
    position: fixed;
    top: 74% !important;
    left: 72.5% !important;
  }

  img.arrowright {
    position: fixed;
    top: 72% !important;
    left: 72% !important;
  }

  .footer ul .shape-one {
    background: url(../img/shape-1.png) no-repeat;
    width: 192px;
  }

  .footer ul .shape-two {
    background: url(../img/shape-2.png) no-repeat;
    width: 192px;
  }

  .footer ul .shape-three {
    background: url(../img/shape-3.png) no-repeat;
    width: 192px;
  }

  .footer ul .shape-four {
    background: url(../img/shape-4.png) no-repeat;
    width: 192px;
  }

  .footer ul .shape-five {
    background: url(../img/shape-5.png) no-repeat;
    width: 192px;
  }

  .header .header-main .six-shape {
    background: url(../img/shape-6.png) no-repeat;
    width: 192px;
  }

  .header .header-main .seven-shape {
    background: url(../img/shape-7.png) no-repeat;
    width: 192px;
  }

  .header .header-main .eight-shape {
    background: url(../img/shape-8.png) no-repeat;
    width: 192px;
  }

  .header .header-main .nine-shape {
    background: url(../img/shape-9.png) no-repeat;
    width: 192px;
  }

  .home-main-sec .head-ul .main-left::after {
    left: -37%;
  }

  .left-shape {
    left: -42%;
    top: 23%;
  }

  .footer-h1-text {
    font-size: 28px;
  }
}

@media (max-width: 1024px) {
  #cls-btn {
    position: absolute !important;
    /* right: 0 !important; */
    margin-left: 40px;
    margin-top: 0px !important;
    top: 8% !important;
    z-index: 9999;
    width: 7%;
  }

  .modal-content {
    width: 910px !important;
    background-color: unset !important;
    z-index: 9999;
  }

  #modal-content1 {
    /* margin-left: -42% !important; */
    top: 0%;
    z-index: 9999;
  }

  #modal-content1 {
    margin-top: 25px !important;
    z-index: 9999;
  }

  #footer-txt {
    height: 50px !important;
  }

  .cthulhu-right img {
    width: 100%;
    margin-left: 0px;
  }

  .modal-content {
    margin-left: -29%;
    top: 8%;
  }

  #arkham-img {
    width: 60% !important;
    margin-right: -0px;
  }

  .col-md-12.text-dragun p {
    width: 78%;
    font-size: 16px;
  }

  li.dragun-upper {
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
  }

  .home-main-sec4 .poker-left {
    margin-left: 100px;
    width: 50%;
  }

  .home-main-sec4 .poker-right {
    width: 30%;
    margin-left: 40px;
    margin-top: 15px;
  }

  .text-head::before {
    top: 23%;
  }

  /* .close-btn {
    position: absolute !important;
    left: 90% !important;
    width: 5%;
    margin-top: -70px !important;
  } */

  #modal-head {
    width: 100% !important;
    /* padding-top: 43px !important; */
    background-size: contain;
  }

  #modal-dialogs {
    max-width: 635px !important;
    margin-top: 20px !important;
  }

  .coin-sec .coin-leftright .coim-para {
    width: 100%;
    font-size: 20px;
    padding-left: 57px;
  }

  .footer-text .footer-h1 img {
    height: 35px;
  }

  .dragun-main::before {
    left: -54% !important;
    height: 346px !important;
  }

  .footer .footer-h1 img {
    padding-top: 20px;
  }

  .home-main-sec .container::after {
    left: -17%;
  }

  .home-main-sec .head-ul .main-right::after {
    right: -41%;
  }

  .home-main-sec .head-ul .main-right::after {
    right: -10%;
    top: -33%;
    width: 75%;
  }

  .footer .footer-h1 img {
    height: 50px;
  }

  .modal-content {
    max-width: 507px !important;
  }

  .col-md-2.value-left {
    width: 62%;
  }

  .left-shape {
    left: -33%;
    top: 28%;
  }

  .soon-text h1 {
    top: 32%;
    left: 39%;
  }

  .right-shape {
    right: -4%;
    width: 100%;
  }

  .main-left .bimg {
    height: 300px;
    margin-right: -10px;
  }

  section.home-main-sec5:after {
    left: 31%;
    height: 368px;
    z-index: -1;
  }

  .main-right .simg {
    height: 300px;
    margin-left: 0px;
  }

  .footer-h1-text {
    font-size: 30px;
  }

  .col-md-8.cthulhu-left:after {
    content: "";
    width: 38%;
    left: 62%;
    top: 16%;
    /* z-index: 1; */
  }

  /* .col-md-8.cthulhu-left:after {
    display: none;
  } */

  .cthulhu-right .left-shapes {
    top: 32%;
    left: 1%;
  }

  .col-md-8.cthulhu-left:after {
    height: 100vh;
  }



  .cthulhu-left h2 {
    color: white;
    font-size: 17px;
    width: 100%;
    position: relative;
    z-index: 9;
    padding-right: 24px;
  }

  .coin-sec .coin-img {
    width: 90%;
    position: relative;
    left: 27px;
  }

  .cards-slide {
    gap: 11px !important;
  }

  .home-main-sec10::after {
    left: 1%;
    top: 10%;
    z-index: -1;
  }

  .close-btn1 {
    top: 2% !important;
    left: 92% !important;
    z-index: 1;
  }

  .home-main-sec5 .dragun-main img {
    width: 91%;
    margin-left: -6%;
  }

  .home-main-sec4 .poker-left h1 {
    font-size: 69px;
  }

  .footer {
    padding: 0;
    margin: 0;
  }

  .coin-sec {
    float: left;
    width: 100%;
    padding: 30px 0px;
  }

  .coin-sec .coin-leftright .coim-para {
    width: 100%;
    font-size: 21px;
    padding-left: 0px;
  }

  .coin-sec .coin-leftright .coim-para {
    width: 100%;
    font-size: 21px;
    padding-left: 0px;
  }

  section#footerid .footer-h1 {
    color: white;
    text-decoration: underline;
    font-size: 29px;
    text-align: right;
    padding-right: 14%;
  }

  #modal-content1 {
    height: 633px !important;
  }

  .close-btn {
    margin-top: 8px !important;
    margin-right: 60px;
    width: 33px;
  }

  .modal-header {
    height: 100% !important;
  }

  .text-footer {
    font-size: 25px;
    text-align: center;
  }

  .owl-carousel .owl-nav button.owl-next,
  .owl-carousel .owl-nav button.owl-prev {
    width: 11%;
  }

  section#footerid {
    margin-top: -10px;
  }

  #modal-content1 {
    margin-top: 42px !important;
  }

  .comingsoon .text-soon {
    top: 47%;
    font-size: 84px;
    transform: rotate(343deg);
    width: 60%;
    left: 7%;
  }

  .home-main-sec4 .poker-left h2 {
    line-height: 1.5;
    margin-top: 10px;
    font-size: 18px;
  }

  .home-main-sec4 .poker-left h1 {
    font-size: 60px;
  }

  .home-main-sec5 .dragun-main h1 {
    font-size: 21px;
    line-height: 29px;
  }

  .home-main-sec5 .dragun-main h1 {
    font-size: 18px;
    line-height: 29px;
    width: 85%;
  }

  .soon-text h1 {
    top: 33%;
    left: 43%;
    font-size: 63px;
  }

  .home-main-sec5 .dragun-main::after {
    width: 42%;
    top: 17%;
    left: 55%;
  }

  .col-md-8.fantasy-right::after {
    top: 13%;
    left: -80%;
    width: 115%;
  }

  .cthulhu-right .left-shapes {
    top: 30%;
    left: 8% !important;
  }

  .cthulhu-right .left-shapes {
    width: 37%;
  }

  .carousel-inner {
    box-shadow: 5px 10px 100px 10px #fff !important;
    position: fixed !important;
    top: 2% !important;
    width: 85% !important;
    left: 7% !important;
  }

  #arrow-set {
    position: fixed;
    top: 85% !important;
    left: 10% !important;
  }

  #arrow-right {
    position: fixed;
    top: 85% !important;
    left: 82.5% !important;
  }

  img.arrowright {
    position: fixed;
    top: 72%;
    left: 70%;
  }

  img.arrowleft {
    position: fixed;
    top: 72%;
    left: 28.5%;
  }

  div#slider-nd {
    width: 33%;
    left: 36%;
    top: 16%;
  }

  .close-btn2 {
    position: fixed;
    top: 15.7%;
    left: 69%;
    z-index: 1;
  }

  img.arrowright2 {
    position: fixed;
    top: 67%;
    left: 61%;
  }

  #arkham-img {
    width: 60% !important;
  }
}

@media (max-width: 992px) {
  .col-md-6.poker-left::before {
    /* left: -43%; */
    height: 670px;
  }

  .cthulhu-right .left-shapes {
    top: 30%;
    left: 7% !important;
  }

  .home-main-sec2 .value-right {
    float: left;
    margin-left: 20px !important;
  }

  .valt-img {
    width: 30% !important;
  }

  .carousel-inner {
    box-shadow: 5px 10px 100px 10px #fff !important;
    position: fixed !important;
    top: 0.3% !important;
    width: 85% !important;
    left: 7% !important;
  }

  .close-btn1 {
    top: 0.3% !important;
    left: 92% !important;
    width: 5%;
    z-index: 1;
  }

  #dungeon-setting {
    justify-content: center;
  }

  section.home-main-sec5:after {
    left: 37%;
    height: 368px;
  }

  #footer-txt {
    float: left !important;
    width: 100% !important;
    padding: 0px !important;
    padding-top: 50px !important;
    height: 100px !important;
    align-items: center !important;
  }

  .coming-image {
    float: left;
    width: 60% !important;
  }

  .modal.show .modal-dialog {
    margin-top: 52px !important;
    min-height: 0vh;
    display: flex;
  }

  .home-main-sec .head-ul .main-left::after {
    left: -78%;
  }

  .home-main-sec .head-text img {
    height: 64px;
  }

  .fantasy-right h1 {
    font-size: 55px;
  }

  .soon-text h1 {
    top: 34%;
    left: 42.5%;
    font-size: 50px;
  }

  .dragun-text .text-dragun p {
    font-size: 15px;
  }

  .main-left .bimg {
    height: 264px;
  }

  .home-main-sec5 .dragun-main img {
    width: 76%;
    margin-left: -6%;
  }

  .main-right .simg {
    height: 264px;
  }

  .coin-sec {
    padding: 6px 0px;
  }

  div#ss-2 {
    width: 87%;
    margin-left: -5%;
  }

  .home-main-sec .head-ul .main-right::after {
    right: -45%;
    width: 98%;
  }

  .left-shape {
    left: -26%;
  }

  .main-left .bimg {
    height: 283px;
  }

  .col-md-8.fantasy-right::after {
    top: 13%;
    left: -57%;
    width: 115%;
  }

  .home-main-sec7 .cthulhu-box img {
    width: 80%;
  }

  .col-md-8.fantasy-right h2 {
    font-size: 16px;
    width: 91%;
    line-height: 22px;
  }

  .fantasy-left img {
    width: 56%;
    padding-bottom: 9px;
  }

  .main-right .simg {
    height: 283px;
  }

  .footer .footer-h1 img {
    height: 38px;
    padding-top: 6px;
  }

  .coin-sec .coin-leftright .coim-para {
    font-size: 24px;
  }

  .footer-h1-text {
    font-size: 38px;
  }

  .carousel {
    position: relative;
    left: 10%;
  }

  .navbar-nav .top-nav .nav-item {
    margin-left: 0;
    margin-top: 6px;
  }

  .left-shape .left-text .rotate {
    top: 5px;
    width: 37%;
    left: 26px;
  }

  .right-shape .right-text .rotate2 {
    top: 73%;
    width: 34%;
  }

  .navbar-light .navbar-toggler {
    border-color: rgb(255 255 255 / 10%);
    margin-left: auto;
  }

  .navbar-light .navbar-toggler-icon {
    background-image: url(../img/t-line1.png);
  }

  .footer .container,
  .container-md,
  .container-sm {
    max-width: 872px;
  }

  .comingsoon .text-soon {
    top: 34%;
  }

  .home-main-sec4 .poker-left h1 {
    font-size: 45px;
    font-weight: 500;
  }

  .home-main-sec4 .poker-left h2 {
    line-height: 27px;
    margin-top: 10px;
    font-size: 21px;
  }

  .home-main-sec4 .poker-right img {
    width: 100%;
  }

  .left-main .left1 {
    margin-bottom: 27%;
  }

  .text-center1 {
    text-align: right !important;
    padding-right: 125px;
    font-size: 24px;
  }

  .home-main-sec4 .poker-right .mid-main {
    margin-left: 0px;
  }

  #body-2 {
    overflow: unset;
  }

  #body-3 {
    overflow: unset;
  }

  #body-4 {
    overflow: unset;
  }

  .footer ul .shape-one {
    background: url(../img/btn-480.png) no-repeat;
    width: 110px;
    height: 33px;
  }

  .footer ul .shape-two {
    background: url(../img/btn-481.png) no-repeat;
    width: 110px;
    height: 33px;
  }

  .footer ul .shape-three {
    background: url(../img/btn-482.png) no-repeat;
    width: 110px;
    height: 33px;
  }

  .footer ul .shape-four {
    background: url(../img/btn-483.png) no-repeat;
    width: 110px;
    height: 33px;
  }

  .footer ul .shape-five {
    background: url(../img/btn-484.png) no-repeat;
    width: 110px;
    height: 33px;
  }

  .header .header-main .six-shape {
    background: url(../img/btn-485.png) no-repeat;
    width: 110px;
    height: 33px;
  }

  .header .header-main .seven-shape {
    background: url(../img/btn-486.png) no-repeat;
    width: 110px;
    height: 33px;
  }

  .header .header-main .eight-shape {
    background: url(../img/btn-487.png) no-repeat;
    width: 110px;
    height: 33px;
  }

  .header .header-main .nine-shape {
    background: url(../img/btn-488.png) no-repeat;
    width: 110px;
    height: 33px;
  }
}

@media (max-width: 991px) {


  .carousel-inner {
    top: 9.3% !important;
  }

  .col-md-8.fantasy-right h2 {
    font-size: 16px;
    width: 100%;
    line-height: 22px;
  }

  .close-btn1 {
    top: 9.3% !important;
    left: 92% !important;
    width: 5%;
    z-index: 1;
  }

  #arrow-right {
    position: fixed;
    width: 7%;
    top: 79% !important;
    left: 78.5% !important;
  }

  #arrow-set {
    position: fixed;
    top: 79% !important;
    width: 7%;
    left: 13% !important;
  }

  .fantasy-left img {
    /* width: 100%; */
    padding-bottom: 9px;
  }

  .coin-sec .coin-leftright {
    padding-right: 4%;
    padding-left: 3%;
    padding-top: 0px;
    width: 100%;
  }

  /* .coin-sec .coin-img {
    display: none;
  } */

  .modal-content {
    width: 940px !important;
  }

  .modal-content {
    margin-left: -23%;
  }

  #modal-dialogs {
    max-width: 635px !important;
    margin-top: 40px !important;
  }

  /* .dragun-main::before {
    display: none !important;
  } */

  .home-main-sec4 .poker-left {
    margin-left: 100px;
    width: 100%;
  }

  .home-main-sec4 .poker-right {
    width: 75%;
    margin-left: 100px;
    margin-bottom: 15px;
    margin-top: 15px;
  }

  .home-main-sec4 .poker-left {
    width: 100%;
    margin-left: 0px;
  }

  #arkham-container {
    display: flex !important;
    flex-direction: column-reverse;
  }

  .home-main-sec4 .poker-left h2 {
    line-height: 27px;
    margin-top: 0px;
    font-size: 23px;
  }

  #arkham-img {
    width: 50% !important;
    margin-left: 0px;
  }
}

@media (max-width: 912px) {
  .modal-header {
    height: 29%;
    padding: 0px 0 !important;
    text-align: center;
  }



  .modal-content {
    width: 550px !important;
  }

  .modal-header {
    height: 56%;
    padding: 0px 0 !important;
    text-align: center;
  }


  .cthulhu-right .left-shapes {
    top: 40%;
    left: 3% !important;
  }

  #cls-btn {
    /* right: 0 !important; */
    margin-left: 40px;
    margin-top: 0px !important;
    top: 3% !important;
    width: 7%;
  }

  .close-btn1 {
    top: 25.3% !important;
    left: 92% !important;
    width: 5%;
    z-index: 1;
  }

  #arrow-set {
    position: fixed;
    top: 61% !important;
    width: 7%;
    left: 13% !important;
  }

  #arrow-right {
    position: fixed;
    width: 7%;
    top: 61% !important;
    left: 79.5% !important;
  }

  .carousel-inner {
    top: 25.3% !important;
  }
}

@media (max-width: 890px) {
  .col-md-6.poker-left::before {
    left: -66%;
    height: 366px;
  }

  .home-main-sec2 .value-right {
    float: left;
    margin-left: 00px !important;
  }

  .cthulhu-right .left-shapes {
    top: 30%;
    left: 0% !important;
  }

  /* #modal-content1 {
    margin-left: -22% !important;
  } */

  .modal-content {
    width: 715px !important;
  }

  /* .dragun-main::before {
    display: none;
  } */


  .modal-header {
    height: 100%;
  }

  .modal-content {
    margin-left: 0%;
  }

  #modal-dialogs {
    max-width: 900px !important;
    margin-top: 0px !important;
  }

  #modal-head {
    background-size: cover;
  }

  .soon-text h1 {
    top: 34%;
    left: 43%;
    font-size: 50px;
  }

  /* section.home-main-sec5:after {
    display: none;
  } */
}

@media (max-width: 830px) {
  .home-main-sec4 .poker-left {
    width: 80%;
    margin-left: 150px;
  }

  #arkham-img {
    width: 50% !important;
    margin-left: 130px;
  }
}

@media (max-width: 1024px) {
  #arkham-container {
    display: flex !important;
    flex-direction: row;
  }

  #arkham-img {
    margin-left: unset !important;
  }

  .coming-image {
    width: 35% !important;
  }

  .text-head:before {
    top: 27%;
    left: 1%;
    background-size: contain;
    height: 50%;
  }

  /* 
  section.home-main-sec5:after {
    display: none;
  } */

  .header .header-main .nine-shape {
    width: 100px;
  }

  /* .close-btn {
    margin-top: -60px !important;
    left: 93% !important;
    width: 4%;
  } */

  .left-shape .left-text .rotate {
    top: 26px;
    left: 38px;
    width: 43%;
  }

  .footer-text .footer-h1 img {
    height: 25px;
  }

  .footer ul .shape-one {
    width: 95px;
  }

  .footer ul .shape-two {
    width: 95px;
  }

  .footer ul .shape-three {
    width: 95px;
  }

  section.soon-text h1.coming-txt {

    display: none !important;

  }

  .footer ul .shape-four {
    width: 95px;
  }

  .footer ul .shape-five {
    width: 95px;
  }

  .footer ul {
    display: flex;
    justify-content: center;
    list-style: none;
    align-items: center;
    padding: 0;
    margin: 0;
  }

  .close-btn2 {
    position: fixed;
    top: 16.7%;
    left: 76%;
    z-index: 1;
  }

  .home-main-sec .head-text img {
    height: 64px;
    margin-top: 10px;
    position: absolute;
  }

  .container,
  .container-sm {
    max-width: 768px;
  }

  section#footerid .modal-content {
    margin-left: -85px;
  }

  .owl-carousel .owl-item img {
    width: 99%;
  }

  .col-md-6.poker-left::before {
    left: -56%;
    height: 321px;

  }

  .right-shape .right-text .rotate2 {
    top: 67%;
    width: 40%;
  }

  .home-main-sec .head-ul .main-right::after {
    right: -4%;
    top: -29%;
  }

  .flash-btn {
    width: 100px;
    height: 25px;
    border-radius: 0px;
  }

  .home-main-sec .head-ul .main-left::after {
    left: -33%;
    width: 100%;
    top: -51%;
  }

  .main-right img {
    width: 46%;
  }

  .footer .footer-h1 img {
    height: 38px;
  }

  .main-left img {
    width: 70%;
  }

  .left-shape {
    left: -17%;
    top: 23%;
    width: 114%;
  }

  div#slider-nd {
    width: 51%;
    left: 25%;
    top: 16%;
  }

  img.arrowright2 {
    position: fixed;
    top: 79%;
  }

  img.arrowleft1 {
    position: fixed;
    left: 29%;
    top: 74%;
    width: 8%;
  }

  .footer .footer-main {
    flex-wrap: wrap;
  }

  .main-right .simg {
    width: 71%;
    margin-top: 65px;
  }

  .left-main .left1 {
    width: 139px;
  }

  .col-md-8.value-right img {
    width: 85%;
  }

  .text-center1 {
    display: block;
  }

  ul#box-head3 {
    display: flex;
  }

  .right-shape .right-text .rotate2 {
    top: -23%;
    width: 48%;
  }

  .main-left img {
    width: 100%;
  }

  ul.left-main {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .left-shape .left-text .rotate {
    top: 20px;
    left: 16px;
    width: 53%;
  }

  .right-shape .right-text .rotate2 {
    top: -22%;
    width: 48%;
    left: 31px;
  }

  .footer {
    margin-top: -33px;
  }

  .modal-header1 {
    float: left;
    width: 80vh;
  }

  .home-main-sec .head-ul .main-left::after {
    left: -45%;
    width: 608px;
    top: -67%;
  }

  /* .col-md-4.coin-leftside {
    display: none;
  } */

  .coin-sec .coin-leftright {
    width: 70%;
    padding-left: unset;
    padding: 0px;
  }

  .col-md-4.coin-leftside {

    width: 30%;
  }

  .home-main-sec .head-ul .main-left {
    margin-top: 65px;
  }

  .coin-sec .modal-header {
    margin-top: 64px;
    float: left;
    width: 64%;
    padding-left: 151px;
  }

  .modal-header .poppu-para {
    font-size: 17px;
    text-align: center;
  }

  .close-btn1 {
    position: fixed;
    top: 12% !important;
    left: 76% !important;
    z-index: 1;
  }

  .coin-sec .modal-header {
    padding-left: 30px;
  }

  .col-md-8.cthulhu-left:after {
    background: url(../img/cthulhu-after-1.png) !important;
    background-repeat: no-repeat !important;
    /* display: none; */
  }

  .col-md-8.cthulhu-left:after {
    width: 18%;
    left: 80%;
    top: 81px;
  }

  .home-main-sec4 .poker-left h2 {
    line-height: 15px;
    margin-top: 5px;
    font-size: 11px;
  }

  img.arrowleft {
    position: fixed;
    width: 6%;
  }

  img.arrowright {
    position: fixed;
    left: 73% !important;
    top: 65% !important;
    width: 8% !important;
  }

  #arrow-right {
    position: fixed;
    top: 73% !important;
    left: 75% !important;
    width: 6% !important;
  }

  .soon-text h1 {
    top: 33%;
    left: 21%;
    font-size: 63px;
  }

  .footer-h1-text {
    font-size: 15px;
    padding-right: unset !important;
    text-align: center;
  }

  li.coin-popup img {
    padding-inline: 13px;
  }

  .home-main-sec4 {
    padding: 0px;
    height: 67vh;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .comingsoon .text-soon {
    width: 76%;
    top: 35%;
    left: 7%;
  }

  .home-main-sec2 .value-left {
    float: left;
    display: flex;
    justify-content: center;
    margin-top: 35px;
    display: none;
  }

  .comingsoon .text-soon {
    width: 76%;
    top: 35%;
    left: 13%;
  }

  .comingsoon .text-soon {
    width: 76%;
    top: 35%;
    left: 18%;
    font-size: 70px;
  }

  .text-editor {
    text-align: center;
    padding-right: unset !important;
    font-size: 24px;
    padding-left: 50%;
  }

  .home-main-sec2 .value-right {
    float: left;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .comingsoon .text-soon {
    width: 82%;
    top: 35%;
    left: 17%;
    font-size: 81px;
  }

  .text-center1 {
    padding: unset;
    padding-left: 50%;
  }

  .home-main-sec5 .dragun-main::after {
    width: 42%;
    top: 17%;
    left: 59%;
  }

  .home-main-sec5 .dragun-main img {
    width: 70%;
    margin-left: 0%;
  }

  .soon-text h1 {
    top: 35%;
    left: 40%;
    font-size: 50px;
    font-weight: bolder;
  }

  .col-md-12.text-dragun p {
    width: 78%;
    font-size: 9px;
    margin-left: 0;
  }

  .home-main-sec5 .dragun-main h1 {
    font-size: 22px;
    line-height: 37px;
    width: 85%;
  }

  div#setingwidth #modal-content1 {
    margin-top: 0px !important;
    margin: auto !important;
  }

  .navbar-nav .top-nav .nav-item {
    margin-left: 23px !important;
  }

  .footer .footer-main {
    gap: 31px !important;
  }

  .fantasy-right h1 {
    font-size: 30px !important;
  }

  .home-main-sec4 .poker-left {
    width: 50% !important;
    margin-top: 20px;
    margin-left: -10px;
  }

  .home-main-sec4 .poker-right {
    width: 50%;
    margin-left: 0px;
    margin-top: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: unset !important;
  }

  .home-main-sec4 .poker-right img {
    width: 30%;
    margin-left: 60px;
  }

  #arkham-img {
    width: 30% !important;
  }

  .left-main .left1 {
    margin-bottom: 0px !important;
  }

  .left-main .left1 {
    height: 36px;
  }

  .fantasy-right {
    width: 55% !important;
    margin-left: 64px;
  }

  .col-md-4.fantasy-left {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 44px;
    width: 30%;
  }

  .col-md-8.fantasy-right h2 {
    font-size: 9px;
    width: 100%;
    line-height: 12px;
  }

  .col-md-4.fantasy-left {
    display: flex;
    justify-content: left;
    align-items: center;
    margin-top: 0px;
  }

  /* .col-md-8.fantasy-right::after {
    display: none;
  } */

  .footer {
    margin-top: 2px;
  }

  .cthulhu-right img {
    width: unset;
    margin-left: 0px;
  }

  .home-main-sec7 .cthulhu-ul {
    display: flex;
    justify-content: center;
  }

  .home-main-sec7 .cthulhu-box img {
    width: 100%;
  }

  .col-md-4.cthulhu-right {
    display: flex;
    width: 30%;
    justify-content: center;
    align-items: center;

  }

  .cthulhu-right .left-shapes {
    top: 149px;
    left: 14% !important;
    width: 36%;
  }

  .cthulhu-right .left-shapes p {
    top: 16%;
    left: 10px;
    font-size: 12px;
  }

  #exampleModalLabel2 {
    font-size: 21px !important;
    text-decoration: none !important;
    padding-top: 10px;
  }

  .home-main-sec7 .cthulhu-left {
    width: 47%;
  }

  .cthulhu-right img {
    width: 56%;
    margin-left: 0px;
  }

  #arkham-img {
    width: 60% !important;
  }

  /* .col-md-6.poker-left::before {
    display: none;
  } */

  .cthulhu-left h2 {
    color: white;
    font-size: 16px;
    line-height: 1.5;
  }

  .right-shape {
    right: -1%;
    top: 42%;
  }

  #modal-header1 {
    padding: 66px 26px !important;
    padding-left: 70px !important;
    width: 65% !important;
  }

  .carousel {
    left: 19%;
  }

  .cthulhu-left h1 {
    font-size: 42px;
    font-weight: 500;
  }

  .home-main-sec7 {
    padding-top: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  img.arrowright2 {
    width: 8% !important;
    left: 63% !important;
    top: 72% !important;
  }

  img.close-btn2 {
    width: 4%;
  }

  img.close-btn1 {
    width: 4%;
    left: 87% !important;
    top: 15% !important;
  }

  .home-main-sec4 .poker-left h1 {
    font-size: 28px;
    font-weight: 500;
  }

  .carousel-inner {
    box-shadow: 5px 10px 100px 10px #fff !important;
    position: fixed !important;
    top: 15% !important;
    width: 77% !important;
    left: 10% !important;
  }

  #arrow-set {
    position: fixed !important;
    top: 73% !important;
    left: 16.4% !important;
    width: 6%;
  }

  .cthulhu-left h1 {
    font-size: 42px;
  }
}

@media (max-width: 1024px) {
  .home-main-sec2 .text-head {
    margin-top: 8px !important;
  }

  .cards-slide {
    gap: 12px;
  }

  .cards-container {
    border-radius: 0px !important;
  }

  #fantasy-container {
    max-width: 700px;
  }

  #center-txt1 {
    display: none;
  }

  ul#box-head3 {
    display: none;
  }

  .text-editor {
    text-align: center;
    padding-right: unset !important;
    font-size: 24px;
    padding-left: 0%;
  }

  ul.left-main {
    flex-direction: row !important;
  }

  .sec-head img {
    padding-inline: 4px;
    width: 29%;
  }

  .text-head:before {
    top: 30%;
    left: 20%;
    background-size: contain;
    height: 50%;
  }

  .header .header-main .nine-shape {
    width: 110px;
    height: 33px;
  }




  .left-shape .left-text .rotate {
    top: 35px;
    left: 16px;
    width: 65%;
  }

  .image-popup img {
    max-height: 65vh !important;
  }

  .home-main-sec7 .cthulhu-left {
    width: 65%;
  }

  /* 
  .home-main-sec7 .cthulhu-left {

    margin-top: 60px;
  } */

  img.close-btn1 {
    width: 3%;
  }

  .cthulhu-left h2 {
    color: white;
    font-size: 16px;
    line-height: 25px;
  }

  .home-main-sec7 {
    padding-top: 0px;
    /* height: 100%; */
  }

  img.close-btn2 {
    width: 6%;
    top: 18%;
    left: 105%;
  }

  .home-main-sec .head-text img {
    height: 40px;
  }

  .body-type {
    height: 100% !important;
  }

  body {
    background-image: url(../img/home-bg.jpg) !important;
    /* background-repeat: no-repeat; */
    font-family: "myFirstFont" !important;
    background-size: cover;
    overflow: hidden;
    background-position: center;
    position: relative;
    background-color: #000000 !important;

  }

  .right-shape {
    right: -32%;
    top: 48%;
    width: 128%;
  }

  .home-main-sec .container::before {
    left: 36%;
    height: 322px;
  }

  .home-main-sec .head-ul .main-left {
    margin-top: 33px;
  }

  .main-right .simg {
    margin-top: 41px;
  }

  #footer-txt {
    float: left !important;
    width: 100% !important;
    padding: 0px !important;
    padding-top: 0px !important;
    height: 45px !important;
    align-items: center !important;
  }

  .cthulhu-right img {
    width: 56%;
    /* display: none; */
    margin-left: 0px;
  }

  .text-head::before {
    top: -58px;
    left: 38% !important;
    height: 158px;
  }

  .left-shape {
    background: url(../img/rotate-text2.png) no-repeat;
  }

  .right-shape {
    background: url(../img/rotate-text3.png) no-repeat;
  }

  .main-left .bimg {
    height: 221px;
  }

  .main-right .simg {
    height: 221px;
  }

  .footer .footer-h1 img {
    margin-bottom: 0px;
  }

  .home-main-sec .head-ul .main-left::after {
    left: -66%;
    width: 608px;
    top: -100%;
  }

  .home-main-sec .head-ul .main-right::after {
    right: -4%;
    top: -43%;
  }

  /* .cthulhu-right .left-shapes {
    display: none;
  } */


  p.popup-para {
    font-size: 12px;
  }

  .home-main-sec7 .cthulhu-box {
    margin-inline: 3px;
    list-style: none;
  }

  .footer .footer-main {
    flex-wrap: nowrap;
    gap: 15px;
  }

  .cthulhu-left h1 {
    font-size: 25px;
    margin-bottom: 7px;
  }

  .cthulhu-left h2 {
    color: white;
    font-size: 15px;
    line-height: 1.5;
  }

  .navbar-nav .top-nav .nav-item {
    margin-left: 0px;
  }

  .right-shape .right-text .rotate2 {
    top: -30%;
    width: 64%;
    left: 32px;
  }

  .left-shape {
    left: -3%;
    top: 39%;
  }

  h1.head-text {
    margin-top: 10px;
  }

  /* .close-btn {
    left: 51% !important;
  } */

  .text-footer {
    font-size: 22px;
    text-align: center;
  }

  .text-footer {
    font-size: 22px;
    text-align: center;
  }

  .cthulhu-right .left-shapes {

    background: url(../img/shape-cthulhu-1.png) no-repeat !important;
  }

  li.coin-popup img {
    padding-inline: 13px;
    width: 71%;
  }

  form#email-popup-form input#popup-email {
    font-size: 14px !important;
    padding: 7px !important;
  }

  form#email-popup-form button {
    font-size: 14px !important;
    padding: 8px 12px !important;
  }

  .text-headimg {

    display: none;
  }

  .vault-sidebar {
    display: none;
  }

  section#footerid .modal-content {
    margin-left: 0px;
  }

  .coin-sec .coin-leftright .coim-para {
    width: 77%;
    font-size: 10px;
    margin: auto;
  }

  .footer-h1-text {
    font-size: 15px;
  }

  /* .close-btn {
    left: 59% !important;
    margin-top: -103px !important;
  } */

  section#footerid .modal-content {
    float: left;
    text-align: center;
    width: 1000px;
  }

  .modal-header1 {
    float: left;
    width: 75vh;
  }

  div#ss-2 {
    width: 70%;
    margin-left: 3%;
  }

  .close-btn2 {
    position: absolute;
    top: 13.7%;
    left: 103%;
    z-index: 1;
  }

  ul.left-main {
    flex-direction: row !important;
  }

  header .top-nav {
    height: 62px;
  }

  .sec-head {
    padding: 6px 5px;
    font-size: 15px;
  }

  .left-main .left1 {
    width: 127px;
  }

  ul.left-main {
    padding: 0;
  }

  .home-main-sec10::after {
    left: -16%;
    top: 10%;
    width: 98%;
    z-index: -1;
  }

  .owl-carousel .owl-item img {
    width: 61%;
  }

  .owl-carousel .owl-nav button.owl-next,
  .owl-carousel .owl-nav button.owl-prev {
    width: 18%;
  }

  .owl-theme .owl-dots {
    display: none;
  }

  .owl-carousel .owl-nav button.owl-next,
  .owl-carousel .owl-nav button.owl-prev {
    top: 96%;
  }

  .comingsoon .text-soon {
    width: 84%;
    top: 37%;
    left: 11%;
    font-size: 66px;
  }

  .home-main-sec4 .container {
    width: 100%;
  }

  .home-main-sec4 .poker-left h2 {
    line-height: 15px;
    margin-top: 5px;
    font-size: 12px;
  }

  .home-main-sec4 .poker-left h1 {
    font-size: 28px;
  }

  .soon-text h1 {
    top: 40%;
    left: 37%;
    font-size: 42px;
  }

  .home-main-sec5 .dragun-main h1 {
    font-size: 17px;
    line-height: 25px;
  }

  .home-main-sec5 .dragun-main img {
    width: 75%;
    margin-left: 0%;
  }

  li.dragun-upper {
    margin-top: 0px;
  }

  .soon-text h1 {
    top: 37% !important;
    left: 55%;
    font-size: 29px;
  }

  .col-md-12.text-dragun p {
    width: 78%;
    font-size: 9px;
    margin-left: 0;
  }

  .home-main-sec5 .dragun-main {
    padding-top: 0;
  }

  .modal-header .modal-title {
    font-size: 22px;
  }

  .home-main-sec5 {
    padding-top: 47px;
  }

  .home-main-sec5 .dragun-main::after {
    display: none;
  }

  .home-main-sec4 .poker-right {
    margin-left: 100px !important;
  }

  .col-md-8.fantasy-right h2 {
    font-size: 19px;
    width: 98%;
    line-height: 26px;
  }

  .modal-header {
    height: 205px !important;
  }

  .popup-footer {
    padding: 0px 10px;
  }

  .home-main-sec .head-ul .main-right::before {
    content: "";
    width: 400%;
    height: 99vh;
    background: url(../img/hell-hound-mobile.png);
    background-repeat: no-repeat;
    position: absolute;
    top: -46%;
    left: -533% !important;
    z-index: -1;
  }

  .home-main-sec .container::after {
    left: -58%;
    height: 408px;
    width: 98% !important;
  }

  .home-main-sec .container::after {
    display: none;
  }

  .home-main-sec4 .poker-right {
    width: 50% !important;
    margin-left: 0px !important;
  }

  .col-md-8.fantasy-right h2 {
    font-size: 9px;
    width: 100%;
    line-height: 14px;
  }

  .fantasy-left img {
    width: 66%;
  }

  .fantasy-left img {
    /* width: 100%; */
    padding-bottom: 9%;
  }

  .cthulhu-left h2 {
    font-size: 9px;
    line-height: 1.3;
  }

  .fantasy-right h1 {
    font-size: 32px;
  }

  #cls-btn {
    position: absolute !important;
    right: 98px !important;
    margin-left: 38px;
    margin-top: 0px !important;
    top: 13% !important;
    z-index: 9999;
    width: 3%;
    z-index: 999999;
  }

  div#coin-modal #modal-content1 {
    margin-top: 0 !important;
  }

  .vault-card {

    border-radius: 0px !important;
  }

  .home-main-sec7 .cthulhu-box {

    width: 14%;
  }

  .main-left .bimg {
    height: 123px;
    width: 153px;
  }

  .vault-content {

    margin-bottom: 20px !important;
  }

  .home-main-sec .head-ul .main-right .simg {
    width: 100%;
    max-width: 84px;
    height: auto;
  }
}

/* .home-main-sec .container::after {
    left: -28%;
  } */
.home-main-sec .head-ul .main-right {

  margin-left: 0px;
}



#modal-header1 {
  padding-left: 122px !important;
}

.btn {
  padding: unset;
}

@media (max-width: 800px) {
  .col-md-8.fantasy-right::after {
    left: -69%;
  }
}

@media (max-width: 740px) {
  .col-md-8.fantasy-right::after {
    top: 13%;
    left: -67%;
    width: 115%;
  }

  #cls-btn {
    right: 24px !important;
  }

}

@media (max-width: 670px) {
  li#res-set {
    margin-left: 0px;
  }

  #arrow-right {
    position: fixed;
    top: 63% !important;
    left: 75% !important;
    width: 6% !important;
  }

  .modal-content {
    width: 570px !important;
    margin-left: 0% !important;
    padding: 10px !important;
  }

  #cls-btn {
    right: 40px !important;
    top: 12% !important;
    z-index: 9999;
    width: 3%;


  }

  .col-md-2.value-left {
    width: 78%;
  }

  /* #modal-content1 {
    margin-left: -15% !important;
  } */
  .dragun-main::before {
    left: -59% !important;
  }

  .modal-header {
    height: 40%;
    padding: 20px 0 !important;
    text-align: center;
  }

  #arrow-set {
    position: fixed !important;
    top: 63% !important;
    left: 16.4% !important;
    width: 6%;
  }

  .text-footer {
    font-size: 21px;
    text-align: center;
  }

  .col-md-8.fantasy-right::after {
    left: -83%;

  }

  .home-main-sec7 .cthulhu-left {
    margin-top: 0px;
  }

  .col-md-8.cthulhu-left:after {
    width: 23%;
    left: 75%;
    top: 85px;
  }

  .coin-sec .modal-header {
    padding-left: 25px;
  }

  .close-btn {
    /* margin-top: -75px !important;
    left: 94% !important; */
    width: 30px;
    right: 0% !important;
    margin-top: 13px !important;
    margin-right: 76px;
  }

  /* .soon-text h1 {
    top: 33%;
    left: 39%;
    font-size: 45px;
  } */

  .cthulhu-right .left-shapes {

    left: 9% !important;

  }

  .text-head::before {
    top: -58px;
    left: 35% !important;
    height: 158px;
  }

  .col-md-6.poker-left::before {
    left: -64%;
    height: 367px;
  }
}

@media (max-width: 576px) {
  .modal-content {
    max-width: 507px !important;
    /* margin-left: -10% !important; */
    padding: 10px !important;
    width: 100%;
  }



  li.coin-popup img {
    padding-inline: 13px;
    width: 71%;
  }

  .col-md-4.cthulhu-right {
    position: relative;
    top: 56px;
  }

  .modal-dialog {
    max-width: 450px !important;
    margin: 0.5rem auto !important;
  }

  #cls-btn {
    position: absolute !important;

    margin-top: 0px !important;
    top: 16% !important;
    width: 7%;
  }

  #modal-content1 {
    /* margin-left: -5% !important; */
    padding: 30px !important;
  }

  #exampleModalLabel2 {
    font-size: 24px !important;
    text-decoration: none !important;
  }

  .modal-header {
    height: 32%;
    padding: 0px 0 !important;
    text-align: center;
  }

  #footer-txt {
    float: left !important;
    width: 100% !important;
    padding: 0px !important;
    padding-top: 0px !important;
    height: 29px !important;
    align-items: center !important;
    margin-bottom: 25px;
  }

  #arkham-img {
    width: 60% !important;
  }

  .coming-image {
    width: 70% !important;
  }

  .text-editor {
    text-align: center;
    padding-right: unset !important;
    font-size: 24px;
    padding-left: 0%;
  }

  .text-center1 {
    padding: unset;
    padding-left: 0%;
  }

  .cthulhu-left h1 {
    font-size: 42px;
  }

  ul#box-head3 {
    display: none;
  }

  #center-txt1 {
    display: none;
  }

  #cht-left {
    margin-top: 160px;
  }

  .header .header-main .nine-shape {
    width: 110px;
    height: 33px;
  }

  .home-main-sec4 .poker-right img {
    width: 100%;
    margin-left: 100px;
  }

  .text-head:before {
    top: 30%;
    left: 10%;
    background-size: contain;
    height: 50%;
  }

  .footer-h1-text {
    font-size: 24px;
    padding-right: unset !important;
    text-align: center;
  }

  .coin-sec .close-btn {
    margin-top: -115px !important;
    left: 94% !important;
    width: 4%;
  }

  #arrow-set {
    position: fixed !important;
    top: 59% !important;
    left: 16.4% !important;
  }

  #arrow-right {
    position: fixed;
    top: 59% !important;
    left: 75% !important;
    width: 6% !important;
  }

  .left-shape .left-text .rotate {
    top: 35px;
    left: 16px;
    width: 65%;
  }

  .coin-sec .coin-leftright .coim-para {
    font-size: 17px;
  }

  .home-main-sec4 .poker-right {
    width: 44%;
  }



  img.close-btn1 {
    width: 3%;
  }

  .cthulhu-left h2 {
    color: white;
    font-size: 16px;
    line-height: 25px;
  }

  .home-main-sec7 {
    padding-top: 0px;
    height: 100%;
  }

  img.close-btn2 {
    width: 6%;
    top: 18%;
    left: 105%;
  }

  .right-shape {
    right: 14%;
    top: 52%;
    width: 63%;
  }

  .cthulhu-right img {
    margin-left: 0px;
  }

  .left-shape {
    background: url(../img/rotate-text2.png) no-repeat;
  }

  .right-shape {
    background: url(../img/rotate-text3.png) no-repeat;
  }

  .main-left .bimg {
    height: 221px;
  }

  .main-right .simg {
    height: 221px;
  }

  .footer .footer-h1 img {
    margin-bottom: 0px;
  }

  .home-main-sec .head-ul .main-left::after {
    left: -66%;
    width: 608px;
    top: -100%;
  }

  .home-main-sec .head-ul .main-right::after {
    right: -4%;
    top: -43%;
  }

  /* 
  .cthulhu-right .left-shapes {
    display: none;
  } */

  .cthulhu-right .left-shapes {
    top: 30%;
    left: 0%;
    width: 54%;
  }

  .home-main-sec7 .cthulhu-box {
    margin-inline: 3px;
    list-style: none;
    width: 14%;
  }

  div#imageOverlay .close-btn {
    right: 16% !important;
    top: 67px;
  }

  .image-overlay img {
    max-width: 55%;
    max-height: 65%;
  }

  .home-main-sec7 .cthulhu-ul {
    justify-content: center;
  }

  .footer .footer-main {
    flex-wrap: nowrap;
    gap: 15px;
  }

  .cthulhu-left h1 {
    font-size: 36px;
  }

  .cthulhu-left h2 {
    color: white;
    font-size: 15px;
    line-height: 1.5;
  }

  .navbar-nav .top-nav .nav-item {
    margin-left: 0px;
  }

  .right-shape .right-text .rotate2 {
    top: -30%;
    width: 64%;
    left: 32px;
  }

  .left-shape {
    left: -3%;
    top: 39%;
  }

  .image-popup img {
    max-width: 27%;
    /* max-height: 68vh !important; */
  }

  h1.head-text {
    margin-top: 10px;
  }

  div#imagePopup .popup-next {
    right: 127px;
  }

  /* .close-btn {
    left: 51% !important;
  } */

  .text-footer {
    font-size: 22px;
    text-align: center;
  }

  .text-footer {
    font-size: 22px;
    text-align: center;
  }

  li.coin-popup img {
    padding-inline: 13px;
    /* width: 175%; */
  }

  section#footerid .modal-content {
    margin-left: 0px;
  }

  /* .close-btn {
    left: 59% !important;
    margin-top: -103px !important;
  } */

  section#footerid .modal-content {
    float: left;
    text-align: center;
    width: 1000px;
  }

  .modal-header1 {
    float: left;
    width: 75vh;
  }

  div#ss-2 {
    width: 70%;
    margin-left: 3%;
  }

  .close-btn2 {
    position: absolute;
    top: 13.7%;
    left: 103%;
    z-index: 1;
  }

  ul.left-main {
    flex-direction: row !important;
  }

  header .top-nav {
    height: 62px;
  }

  .sec-head {
    padding: 6px 5px;
    font-size: 15px;
  }

  .left-main .left1 {
    width: 127px;
  }

  ul.left-main {
    padding: 0;
  }

  .home-main-sec10::after {
    left: -16%;
    top: 10%;
    width: 98%;
    z-index: -1;
  }

  .owl-carousel .owl-item img {
    width: 61%;
  }

  .owl-carousel .owl-nav button.owl-next,
  .owl-carousel .owl-nav button.owl-prev {
    width: 18%;
  }

  .owl-theme .owl-dots {
    display: none;
  }

  .owl-carousel .owl-nav button.owl-next,
  .owl-carousel .owl-nav button.owl-prev {
    top: 96%;
  }

  .comingsoon .text-soon {
    width: 84%;
    top: 37%;
    left: 11%;
    font-size: 66px;
  }

  .home-main-sec4 .container {
    width: 100%;
  }

  .home-main-sec4 .poker-left h2 {
    line-height: 25px;
    margin-top: 5px;
    font-size: 15px;
  }

  .home-main-sec4 .poker-left h1 {
    font-size: 40px;
  }

  .soon-text h1 {
    top: 40%;
    left: 37%;
    font-size: 42px;
  }

  .home-main-sec5 .dragun-main h1 {
    font-size: 17px;
    line-height: 25px;
  }

  .home-main-sec5 .dragun-main img {
    width: 95%;
    margin-left: 0%;
  }

  .col-md-12.text-dragun p {
    width: 100%;
    font-size: 13px;
    margin-left: 0;
  }

  .home-main-sec5 {
    padding-top: 47px;
  }

  .home-main-sec5 .dragun-main::after {
    display: none;
  }

  .home-main-sec4 .poker-right {
    margin-left: 100px !important;
  }

  .col-md-8.fantasy-right h2 {
    font-size: 19px;
    width: 98%;
    line-height: 26px;
  }

  .home-main-sec4 .poker-right {
    width: 100% !important;
    margin-left: 0px !important;
  }

  .col-md-8.fantasy-right h2 {
    font-size: 16px;
    width: 100%;
    line-height: 18px;
  }

  .fantasy-left img {
    /* width: 100%; */
    padding-bottom: 9%;
  }

  .fantasy-right h1 {
    font-size: 32px;
  }

  .home-main-sec .container::after {
    left: -28%;
  }

  .home-main-sec .container::before {
    left: 51%;
  }

  #modal-header1 {
    padding-left: 122px !important;
  }

  .btn {
    padding: unset;
  }
}

@media (max-width: 513px) {
  .modal-content {
    width: 500px !important;
    margin-left: -10% !important;
    padding: 10px !important;
  }

  #cls-btn {
    position: absolute !important;

    margin-top: 0px !important;
    top: 18% !important;
    width: 7%;
  }

  #modal-content1 {
    margin-left: -0% !important;
    padding: 30px !important;
  }

  .text-head:before {
    top: 30%;
    left: 3%;
    background-size: contain;
    height: 50%;
  }

  img.close-btn1 {
    width: 4%;
    left: 92% !important;
    top: 15% !important;
  }

  .carousel-inner {
    box-shadow: 5px 10px 100px 10px #fff !important;
    position: fixed !important;
    top: 15% !important;
    width: 85% !important;
    left: 7% !important;
  }

  .coin-sec .coin-leftright .coim-para {
    font-size: 15px;
  }

  .soon-text h1 {
    top: 38%;
    left: 36%;
    font-size: 40px;
  }

  .text-footer {
    font-size: 18px;
    text-align: center;
  }

  .stay-soon p {

    font-size: 14px;
    position: relative;
    top: 0px;
    cursor: pointer;
  }
}

@media (max-width: 480px) {
  .modal-header {
    height: 42%;
    padding: 0px 0 !important;
    text-align: center;
  }

  .coin-sec .coin-img {
    width: 83%;
    position: relative;
    left: -30px;
  }

  .col-md-4.cthulhu-right {
    left: -22px;
  }

  .modal {
    height: 60vh !important;
    background-size: auto;
  }

  #modal-content1 {
    /* margin-left: -1% !important; */
    padding: 30px !important;
  }

  #cls-btn {
    position: absolute !important;

    margin-top: 0px !important;
    top: 16% !important;
    width: 7%;
  }

  .home-main-sec2 .value-right {
    float: left;
    margin-left: 30px !important;
  }

  .text-head::before {
    top: -43px !important;
    left: 35% !important;
    height: 158px !important;
  }

  #coin-sec {
    height: 60vh;
  }

  .modal-backdrop.show {
    display: none;
  }

  .coin-sec {
    float: left;
    width: 100%;
    display: flex;
    height: 50vh;
  }

  .valt-img {
    width: 30%;
  }

  .image-popup img {
    max-height: 30vh !important;
  }

  .popup-prev {
    left: 87px !important;
  }

  span#popupClose {
    right: 74px;
    top: 42px;
  }

  #cht-left {
    margin-top: 0px;
  }

  .modal-backdrop {
    width: 100%;
  }

  .coin-sec {
    float: left;
    width: 100%;
    display: flex;
    height: 70vh;
  }

  .dragun-main::before {
    left: -44% !important;
  }

  .body-type {
    height: 77vh !important;
  }

  .col-md-4.fantasy-left {
    justify-content: left !important;
  }

  .col-md-6.poker-left::before {
    left: -48%;
  }

  #footer-txt {
    float: left !important;
    width: 100% !important;
    padding: 0px !important;
    padding-top: 0px !important;
    height: 50px !important;
    align-items: center !important;
  }

  #arkham-img {
    width: 100% !important;
  }

  .coming-image {
    width: 35% !important;
  }

  #arkham-container {
    flex-direction: unset !important;
  }

  .home-main-sec7 {
    height: 100% !important;
  }

  .home-main-sec7 .cthulhu-left {
    justify-content: unset !important;
  }

  .home-main-sec2 {
    height: 95%;
  }

  .coin-sec .modal-header {
    margin-top: 15px !important;
    padding-left: 0px;
  }

  #dialog-head {
    margin-top: 0px !important;
  }

  #body-value {
    height: 100vw !important;
    position: absolute !important;
  }

  .home-main-sec4 .poker-left {
    width: 50% !important;
  }

  .home-main-sec4 .poker-right {
    margin-left: 0px !important;
  }

  .cthulhu-right .left-shapes {
    top: 25%;
    left: 22%;
    width: 72%;
  }

  #coin-page-row {
    flex-direction: row-reverse;
  }

  /* 
  .home-main-sec .container::before {
    display: none;
  }

  .home-main-sec .container::after {
    display: none;
  } */

  header .top-nav .four-shape {
    width: 90px;
  }

  .cthulhu-right .left-shapes {
    left: 8% !important;
  }

  header .top-nav .first-shape {
    width: 90px;
  }

  header .top-nav .two-shape {
    width: 90px;
  }

  header .top-nav .three-shape {
    width: 90px;
  }

  header .top-nav .five-shape {
    width: 90px;
  }

  .header .header-main .six-shape {
    height: 33px;
  }

  .header .footer-main .seven-shape {
    height: 33px;
  }

  .footer .header-main .eight-shape {
    height: 33px;
  }

  .header .header-main .nine-shape {
    height: 33px;
  }

  .main-left .bimg {
    height: 80%;
    margin-top: 24px;
  }

  .header .header-main {
    flex-wrap: nowrap;
    gap: 0px;
    margin-bottom: 10px;
    padding: 0;
  }

  .main-right .simg {
    height: 80%;
    margin-top: 24px;
  }

  .home-main-sec .head-ul .main-left {
    list-style: none;
    width: 40%;
    display: flex;

  }
}

/* Responsive Landscape Mode for Mobile Devices */
@media only screen and (max-width: 768px) and (orientation: landscape) {

  body,
  .body-type {
    background-size: cover !important;
    background-position: center center !important;
    overflow: auto !important;
    /* height: auto !important; */
    width: 100%;
  }

  body {
    background-image: url(../img/home-bg.jpg);
    background-repeat: no-repeat;
    font-family: "myFirstFont" !important;
    background-size: cover;
    overflow: hidden;
    background-position: center;
    height: 100vh;
    background-color: #000000;

  }

  /* 
  body,
  .body-type {
    background-size: cover !important;
    background-position: center center !important;
    overflow: auto !important;
    height: auto !important;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-size: 90% !important;
  }

  p,
  a,
  li,
  span,
  div {
    font-size: 85% !important;
    line-height: 1.4em !important;
  }

  .container,
  .wrapper,
  .content {
    width: 100% !important;
    padding: 10px !important;
    margin: 0 auto !important;
    box-sizing: border-box;
  }

  .logo,
  .navbar-brand,
  .nav-logo {
    width: 120px !important;
    height: auto;
  }

  nav ul,
  .navbar-nav {
    flex-direction: row !important;
    justify-content: space-around !important;
    gap: 10px;
    padding: 0;
  }

  img,
  video,
  canvas {
    max-width: 100% !important;
    height: auto !important;
  } */

  /* .btn,
  button {
    font-size: 90% !important;
    padding: 8px 12px !important;
  } */

  /* Optional: Make sections stack vertically */
  /* .section,
  .row {
    display: block !important;
    width: 100% !important;
  } */

  /* Adjust spacing */
  /* .mt-5,
  .mb-5 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
  }

  .text-center {
    text-align: center !important;
  }

  footer {
    padding: 10px !important;
    text-align: center;
  } */
}

@media (max-width: 480px) {
  body {
    background-image: url(../img/home-bg.jpg) !important;
    /* background-repeat: no-repeat; */
    font-family: "myFirstFont" !important;
    background-size: cover;
    overflow: hidden;
    background-position: center;
    position: relative;
    background-color: #000000 !important;

  }

  /* 
   body::after{
    contain: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
        background-image: url(../img/home-bg.jpg) !important;
    background-repeat: no-repeat;
    font-family: "myFirstFont" !important;
    background-size: cover;
   } */
  .flash-btn {

    position: relative;
    bottom: 10px;
  }

  .modal-header {
    height: 42%;
    padding: 0px 0 !important;
    text-align: center;
  }

  .modal {
    height: 60vh !important;
    /* overflow-y: scroll !important; */
    background-size: auto;
  }

  #modal-content1 {
    margin-left: -1% !important;
    padding: 30px !important;
  }

  #cls-btn {
    position: absolute !important;
    left: 81.5% !important;
    margin-top: 0px !important;
    top: 7% !important;
    width: 7%;
    z-index: 99999;
  }

  .home-main-sec2 .value-right {
    float: left;
    margin-left: 30px !important;
  }

  #coin-sec {
    height: 60vh;
    /* position: fixed; */
  }

  .modal-backdrop.show {
    display: none;
  }

  .coin-sec {
    float: left;
    width: 100%;
    display: flex;
    height: 50vh;
  }

  .valt-img {
    width: 30%;
  }

  #cht-left {
    margin-top: 0px;
  }

  .modal-backdrop {
    width: 100%;
  }

  .coin-sec {
    float: left;
    width: 100%;
    display: flex;
    height: 70vh;
  }

  .body-type {
    height: 100% !important;
  }

  #footer-txt {
    float: left !important;
    width: 100% !important;
    padding: 0px !important;
    padding-top: 0px !important;
    height: 50px !important;
    align-items: center !important;
  }

  #arkham-img {
    width: 100% !important;
  }

  .coming-image {
    width: 40% !important;
  }

  #arkham-container {
    flex-direction: unset !important;
  }

  /* .home-main-sec7 {
    height: 62vh !important;
  } */

  .home-main-sec7 .cthulhu-left {
    justify-content: unset !important;
  }

  .home-main-sec2 {
    height: 95%;
  }


  .coin-sec .modal-header {
    margin-top: 15px !important;
    padding-left: 0px;
  }

  #dialog-head {
    margin-top: 0px !important;
  }


  #body-value {
    height: 100vw !important;
    position: absolute !important;
  }

  .home-main-sec4 .poker-left {
    width: 50% !important;
  }

  .home-main-sec4 .poker-right {
    margin-left: 0px !important;
  }

  .cthulhu-right .left-shapes {
    top: 25%;
    left: 22%;
    width: 72%;
  }


  .home-main-sec .container::before {
    display: none;
  }

  .home-main-sec .container::after {
    display: none;
  }

  header .top-nav .four-shape {
    width: 90px;
  }

  header .top-nav .first-shape {
    width: 90px;
  }

  header .top-nav .two-shape {
    width: 90px;
  }

  header .top-nav .three-shape {
    width: 90px;
  }

  header .top-nav .five-shape {

    width: 90px;
  }

  .header .header-main .six-shape {
    height: 33px;
  }

  .header .footer-main .seven-shape {
    height: 33px;
  }

  .footer .header-main .eight-shape {
    height: 33px;
  }

  .header .header-main .nine-shape {
    height: 33px;
  }

  .main-left .bimg {
    height: 80%;
    margin-top: 24px;
  }

  .header .header-main {
    flex-wrap: nowrap;
    gap: 0px;
    margin-bottom: 10px;
    padding: 0;
  }

  .main-right .simg {
    height: 80%;
    margin-top: 24px;
  }

  .home-main-sec .head-ul .main-left {
    list-style: none;
    width: 40%;
    display: flex;
    justify-content: flex-end;
    position: relative;
  }

  div#ss-3 {
    width: 84%;
  }

  .modal-content {
    margin-left: 0%;
  }

  .home-main-sec2 .box-head {
    margin-bottom: 17px;
  }

  .close-btn2 {
    position: absolute;
    top: 9.7%;
    left: 81%;
    z-index: 1;
  }

  section.header .container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    position: fixed;
    /* top: -10px; */
    left: 0;
    bottom: 0;
    right: 0;
  }

  .home-main-sec4 .poker-left h2 {
    line-height: 15px;
    margin-top: 10px;
    font-size: 12px;
  }

  .footer-h1-text {
    font-size: 25px;

  }

  div#ss-2 {
    width: 70%;
    margin-left: 12%;
  }

  img.arrowleft1 {
    position: fixed;
    left: 36%;
    top: 76%;
  }

  img.arrowright2 {
    position: fixed;
    top: 76%;
    left: 71%;
    width: 6%;
  }

  .right-shape {
    height: 81px;
  }

  .left-shape {
    height: 102px;
  }

  .modal-header1 {
    float: left;
    width: 100vh;
  }

  .comingsoon .text-soon {
    width: 69%;
    top: 45%;
    left: 11%;
    font-size: 46px;
    -webkit-text-stroke-width: 1px;
  }

  .col-md-8.fantasy-right::after {
    left: -57% !important;
  }

  .text-editor {
    text-align: center;
    padding-right: unset !important;
    font-size: 16px;
  }

  /* .sec-head img {
    display: none;
  } */

  .left-main .left1 {
    width: 104px;
  }

  .sec-head {
    padding: 5px 5px;
    font-size: 15px;
  }

  .text-center1 {
    display: none;
  }

  ul#box-head3 {
    display: none;
  }

  .home-main-sec4 .poker-left h1 {
    font-size: 32px;
    -webkit-text-stroke-width: 0.4px;
  }

  .home-main-sec4 .poker-right {
    width: 20% !important;
    margin-left: 50px !important;
  }

  .footer .footer-h1 img {
    margin-bottom: 0px;
    height: 28px;
    margin-top: 0px;
  }


  .soon-text h1 {
    top: 32%;
    /* left: 45%; */
    font-size: 27px;
    -webkit-text-stroke-width: 1px;
  }

  .soon-text h1 {
    top: 32%;
    /* left: 49%; */
    font-size: 32px;
    -webkit-text-stroke-width: 1px;
    font-weight: bolder;
  }

  .dragun-text .text-dragun p {
    font-size: 11px;
  }

  .footer .footer-main .eight-shape {

    height: 33px;
  }

  .footer .footer-main .nine-shape {

    height: 33px;
  }

  .footer .footer-main .seven-shape {

    height: 33px;
  }

  .footer .footer-main .six-shape {

    height: 33px;
  }


  .home-main-sec5 {

    padding-top: 0px;
  }

  .home-main-sec5 .dragun-main img {
    width: 69%;
    margin-left: 0%;
  }

  .fantasy-right h1 {
    font-size: 37px;
    /* -webkit-text-stroke-width: 1px; */
  }



  .cthulhu-left h2 {
    color: white;
    font-size: 10px;
    line-height: 1.3;

  }

  .cthulhu-left h2 {

    font-size: 9px;
    padding-right: 18px;
    width: 100%;
  }

  .home-main-sec7 .cthulhu-box img {
    width: 100%;
  }

  .col-md-8.cthulhu-left:after {
    content: "";
    width: 44%;
    left: 64%;
  }

  .cthulhu-left h1 {
    font-size: 49px;
    -webkit-text-stroke-width: 1px;
  }

  /* .cthulhu-right .left-shapes {

    display: none;
  } */

  .cthulhu-left h1 {
    font-size: 28px;
    -webkit-text-stroke-width: 1px !important;
  }

  .col-md-8.value-right img {
    width: 42%;
  }

  .home-main-sec2 .text-head h1 {
    font-size: 16px;
  }

  .text-center1 {

    font-size: 16px;
  }

  .home-main-sec2 .value-left {
    float: left;
    display: flex;
    justify-content: center;
    margin-top: 35px;
    display: none;
  }

  .fantasy-left img {
    /* width: 100% !important; */
    padding-bottom: 0%;
    /* display: none; */
  }

  .fantasy-right {
    width: 100%;
  }

  .col-md-8.fantasy-right {
    width: 55% !important;
  }

  .col-md-4.fantasy-left {
    width: 30%;
  }

  .col-md-8.fantasy-right h2 {
    font-size: 11px;
    width: 98%;
    line-height: 16px;
  }

  .main-right img {
    margin-top: 0px;
  }

  .home-main-sec .head-text img {
    height: 47px;
    margin-top: -19px;
  }

  .right-shape {
    right: 8%;
    top: 31%;
    width: 91%;
  }

  .left-shape {
    left: 25%;
    top: 31%;
  }

  .footer-text {

    padding-bottom: 0;
  }

  .home-main-sec .head-ul .main-left {
    margin-top: 0px;
  }

  header .top-nav .three-shape {

    height: 35px;
  }

  header .top-nav .one-shape {

    height: 35px;
  }

  header .top-nav .two-shape {

    height: 35px;
  }

  header .top-nav .four-shape {

    height: 35px;
  }

  header .top-nav .five-shape {

    height: 35px;
  }

  .home-main-sec .head-ul .main-left::after {
    display: none;
  }

  .home-main-sec .head-ul .main-left:before {
    content: "";
    width: 260%;
    height: 48vh !important;
    position: absolute;
    background: url(../img/detective.png);
    background-repeat: no-repeat;
    left: 41% !important;
    top: -14% !important;
    z-index: -1 !important;
  }

  .main-left .bimg {
    margin-right: -18px;
  }

  .home-main-sec .head-ul .main-right::after {
    display: none;
  }

  .home-main-sec .head-ul .main-right::before {
    content: "";
    width: 289%;
    height: 99vh;
    background: url(../img/hell-hound-mobile.png);
    background-repeat: no-repeat;
    position: absolute;
    top: -81%;
    left: -230% !important;
    z-index: -1;
  }

  .coin-sec .coin-leftright .coim-para {
    font-size: 11px;
  }

  .coin-sec .coin-leftright {
    padding-left: unset;
    padding: 10px;
    margin-top: 55px;
  }

  .footer-h1-text {
    font-size: 18px;
  }

  img.close-btn2 {
    width: 6%;
    top: 16%;
    left: 69%;
    position: fixed;
  }

  img.arrowleft1 {
    position: fixed;
    left: 27%;
    width: 6%;
    top: 75%;
  }

  .col-md-12.text-dragun p {
    width: 70%;
    font-size: 9px;
  }

  .carousel-inner {
    box-shadow: 5px 10px 100px 10px #fff !important;
    position: fixed !important;
    top: 9% !important;
    width: 78% !important;
    left: 11% !important;
  }

  .footer-text .footer-h1 img {
    height: 26px;
  }

  img.arrowleft {
    position: fixed;
    top: 69%;
    left: 23.4%;
    width: 7%;
  }

  img.arrowright {
    position: fixed;
    left: 73%;
    top: 69%;
    width: 8%;
  }


  .coin-sec .modal-header {
    margin-top: 64px;
    float: left;
    width: 54%;
    padding-left: 30px;
    text-align: center;
  }

  .modal-header .modal-title {
    font-size: 30px;
  }

  li.coin-popup img {
    padding-inline: 13px;
    /* width: 120%; */
  }

  /* .coin-sec .close-btn {
    margin-top: -65px !important;
    left: 94% !important;
  } */

  #modal-header1 {
    margin-left: 3% !important;
    /* width: 52% !important; */
  }

  img.arrowright {
    position: fixed;
    left: 73%;
    top: 69%;
    width: 7%;
  }

  div#slider-nd {
    width: 34%;
    left: 35%;
    top: 17%;
  }

  h1.head-text {
    margin-top: 30px;
  }

  html {
    transform: rotate(-90deg);
    transform-origin: left top;
    width: 100vh;
    height: 100vw;
    overflow-x: hidden;
    position: absolute;
    top: 100%;
    left: 0;
  }


  #arrow-right {
    position: fixed;
    top: 77% !important;
    left: 80% !important;
    width: 5% !important;
  }

  #arrow-set {
    position: fixed !important;
    top: 77% !important;
    left: 15.5% !important;
    width: 5%;
  }

  img.close-btn1 {
    width: 4%;
    top: 9% !important;
    left: 89% !important;
  }

  .text-head::before {
    top: 42%;
    left: 25%;
    background-size: contain;
    height: 53%;
  }

  #body-value {
    height: 100vw !important;
    position: absolute !important;
    width: 100% !important;
  }

  li.dragun-upper {
    margin-top: 15px;
  }

  .home-main-sec5 .dragun-main {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  section.home-main-sec5:after {
    left: 25%;
  }

  .col-md-4.cthulhu-right {
    justify-content: flex-start;
  }

}




@media (max-width: 450px) {


  .home-main-sec2 .value-right {
    float: left;
    margin-left: 10px !important;
  }

  .home-main-sec .head-ul .main-right .simg {
    max-width: 93px;
    height: auto;
    margin-left: 10px;
  }

  .right-shape {
    right: 8%;
  }

  /* .home-main-sec .head-ul .main-left:before{top:-18% !important;} */
  /* .home-main-sec {
      height: 62vh !important;
  } */
  .coin-sec .coin-leftright {
    padding-left: unset;
    padding: 10px;
    margin-top: 0px;
  }

  .home-main-sec .head-ul .main-right {
    list-style: none;
    width: 45% !important;
    position: relative;
  }

  #footer-txt {
    float: left !important;
    width: 100% !important;
    padding: 0px !important;
    padding-top: 0px !important;
    height: 50px !important;
    align-items: center !important;
  }

  .home-main-sec2 .box-head {
    margin-bottom: 17px;
    margin-left: 50px;
  }

  .home-main-sec2 .box-head {
    margin-bottom: 17px;
    margin-left: 50px;
  }


  .home-main-sec7 {
    padding-top: 0px;
    /* height: 53vh !important; */
    float: left;
    margin: 0;
    width: 100%;
  }


  /* #modal-dialogs {
      max-width: 574px !important;
      margin-top: -24px !important;
      overflow-y: scroll !important;
      height: 100vh;
  } */

  .modal-backdrop.show {
    /* opacity: 0.5; */
    display: none;
  }

  section.home-main-sec {
    overflow: hidden !important;
  }

  .home-main-sec .head-ul .main-left:before {
    /* height: 50vh; */
    left: 41% !important;
    top: -14% !important;
    width: 260%;
  }

  /* section.home-main-sec5:after {
    display: none;
  } */

  img.arrowright {
    position: fixed;
    left: 69%;
    top: 79%;
    width: 5%;
  }

  #arrow-set {
    position: fixed !important;
    top: 83% !important;
    left: 16% !important;
    width: 5% !important;
  }

  /* #modal-header1 {
      width: 49% !important;
      margin-left: 65px !important;
      padding-left: 45px !important;
      /* background-size: unset !important; */
  /* } */

  /* .coin-sec .close-btn {
      margin-top: -110px !important;
      left: 64% !important;
      width: 3%;
  } */

  /* .home-main-sec .head-ul .main-right::before {

    top: 38%;
  } */

  .body-type {
    height: 100% !important;
  }

  #coin-sec {
    height: 57vh;
    /* position: fixed; */
  }


  #arrow-right {
    position: fixed;
    top: 82% !important;
    left: 80% !important;
    width: 5% !important;
  }

  .home-main-sec7 {

    padding-bottom: 120px;
  }



  /* .carousel-inner {
      box-shadow: 5px 10px 100px 10px #fff !important;
      position: fixed !important;
      top: 4.5% !important;
      width: 82% !important;
      left: 7.8% !important;
  } */


  /* #modal-head {
      width: 56% !important;
      padding-top: 43px;
      background-size: cover;
      /* padding-left: 0px !important; */
  /* height: auto;
  } */
  .coin-sec .modal-content {
    margin-left: -0%;
    overflow-y: scroll !important;
  }

  .close-btn {
    margin-right: 49px;
  }

  #coin-sec {
    height: 64vh;
    /* position: fixed; */
  }

  .col-md-8.cthulhu-left:after {
    width: 99%;
    left: -4%;
  }

  #modal-head {
    background-size: contain !important;
    overflow: auto;
  }

  .modal-header .poppu-para {
    font-size: 13px;
    text-align: cen768ter;
  }

  .popup-footer {
    padding-top: 0px !important;
  }

  .modal-header .modal-title {
    font-size: 22px;
    margin-bottom: 0.5rem;
  }

  /* .coin-sec .close-btn {
    margin-top: -50px !important;
    left: 90% !important;
  } */

  li.coin-popup img {
    padding-inline: 13px;
    width: 90%;
  }

  .modal-content {
    margin-left: 0%;
    margin-top: 10px;
  }

  .col-md-4.coin-leftside {
    position: relative;
    right: 61px;
  }

  /* ...////real chthulu modal///// */

  #modal-header1 {
    width: 67% !important;
    padding-left: 20px !important;
    height: 100vh;
  }

  .modal.show .modal-dialog {
    margin-top: 15px !important;
    min-height: 0vh;
  }

  section.home-main-sec5:after {
    left: 41%;
    width: 619px;
  }
}



@media (max-width: 414px) {
  .main-right .simg {
    height: 85%;
    margin-top: 24px;
    width: 55% !important;
  }

  .modal-header {
    height: 29%;
    padding: 0px 0 !important;
    text-align: center;
  }

  .home-main-sec .head-ul .main-left {
    margin-top: 0px;
    margin-left: 40px;
  }

  .main-left .bimg {
    margin-right: -18px;
    width: 80%;
    height: 90%;
  }

  .right-shape {
    right: 8%;
    top: 31%;
    width: 91%;
  }

  #footer-txt {
    float: left !important;
    width: 100% !important;
    padding: 0px !important;
    padding-top: 0px !important;
    height: 30px !important;
    align-items: center !important;
  }

  #modal-content1 {
    margin-top: 38px !important;
  }

  section.home-main-sec5:after {
    left: 41%;
    width: 689px;
  }

  #cls-btn {
    position: absolute !important;
    left: 90.5% !important;
    margin-top: 0px !important;
    top: 5% !important;
    width: 7%;
  }

  .home-main-sec2 .text-head {
    margin-top: 0px !important;
  }

  #cht-left {
    margin-top: 85px;
  }

  #res-set {
    justify-content: flex-end !important;
  }

  section.home-main-sec4 {
    overflow: hidden !important;
  }

  .home-main-sec4 .poker-right img {
    width: 150%;
    margin-left: 100px;
    margin-top: 15px;
  }

  #arkham-img {
    width: 150% !important;
  }



  .home-main-sec4 .poker-left h2 {
    line-height: 17px;
    margin-top: 10px;
    font-size: 12px;
  }


  .text-head::before {
    top: 38%;
    left: 25%;
    background-size: contain;
    height: 58%;
  }

  #arrow-right {
    position: fixed;
    top: 78% !important;
    left: 73% !important;
    width: 5% !important;
  }



  #coin-sec {
    height: 58vh;
    /* position: fixed; */
  }

  #arrow-set {
    position: fixed !important;
    top: 78% !important;
    left: 17% !important;
    width: 5% !important;
  }

  .carousel-inner {
    top: 11% !important;
    left: 13% !important;
    width: 70% !important;
  }

  img.close-btn1 {
    width: 4%;
    top: 11% !important;
    left: 83% !important;
  }

  .home-main-sec7 {
    padding-top: 0px;
    /* height: 53vh !important; */
  }

  .home-main-sec2 .text-head h1 {
    font-size: 18px;
    margin-top: 25px !important;
  }

  .body-type {
    height: 100% !important;
  }

  /* .home-main-sec .head-ul .main-right::before {
    top: 33%;
    left: 66% !important;
  } */

  .home-main-sec .head-ul .main-left:before {
    height: 50vh;
    left: 42% !important;
    top: -14% !important;
    width: 260%;
  }

  .body-type {
    height: 100% !important;
  }

  .carousel-inner {
    top: 8% !important;
    left: 20% !important;
    width: 60% !important;
  }

}

@media (max-width: 400px) {
  .soon-text h1 {
    top: 30%;
    left: 54%;
    font-size: 28px;
    -webkit-text-stroke-width: 1px;
    font-weight: bold;
  }

  #arrow-set {
    position: fixed !important;
    top: 78% !important;
    left: 25% !important;
    width: 5% !important;
  }

  .col-md-8.cthulhu-left:after {
    content: "";
    width: 99%;
    left: -8% !important;
  }

  #arrow-right {
    position: fixed;
    top: 78% !important;
    left: 71% !important;
    width: 5% !important;
  }

  img.close-btn1 {
    width: 4%;
    top: 13% !important;
    left: 80% !important;
  }

  section.home-main-sec5:after {
    left: 28%;
  }

  .carousel-inner {
    top: 13% !important;
    left: 20% !important;
    width: 60% !important;
  }

  .col-md-6.poker-left::before {
    left: -53%;
    height: 330px;
  }

  #cls-btn {
    position: absolute !important;
    left: 82.5% !important;
    margin-top: 0px !important;
    top: 7% !important;
    width: 7%;
  }

  #modal-content1 {
    margin-top: 28px !important;
  }

  .modal-header {
    height: 29%;
    padding: 0px 0 !important;
    text-align: center;
  }

  .body-type {
    height: 100% !important;
  }

  /* .home-main-sec .head-ul .main-right::before {
    top: 14%;
    left: 53% !important;
  } */

  .coming-image {
    width: 40% !important;
    margin-top: -20px;
  }

  #coin-sec {
    height: 54vh;
    /* position: fixed; */
  }

  .coin-sec .coin-leftright {
    padding-left: unset;
    padding: 10px;
    margin-top: 0px;
  }

  .popup-footer {
    padding-top: 0px !important;
    padding-left: 0;
  }

  li.coin-popup img {
    padding-inline: 13px;
    width: 100%;
  }

  .text-headimg {
    float: left;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 70px;
    margin-bottom: 0px;
  }

  .valt-img {
    width: 30% !important;
    margin-top: 10px;
  }

  .text-head::before {
    top: 43%;
    left: 25%;
    background-size: contain;
    height: 58%;
  }

  .col-md-8.fantasy-right::after {
    left: -75% !important;
  }

  .left-shape {
    left: 25%;
    top: 35%;
  }

  .stay-soon p {
    top: -6px;
    cursor: pointer;
  }

  .dragun-main::before {
    left: -50% !important;
  }

  .col-md-8.cthulhu-left:after {
    content: "";
    width: 99%;
    left: -30%;
  }

  .coin-sec .coin-img {
    width: 70%;
    position: relative;
    left: -5px;
  }
}

@media (max-width: 375px) {
  .coming-image {
    width: 40% !important;
    margin-top: 0px;
  }

  .dragun-main::before {
    left: -59% !important;
  }

  /* .body-type {
    height: 70vh !important;
  } */

  .popup-footer {
    padding-top: 0px !important;
    padding-left: 0;
  }

  .modal-header .modal-title {
    font-size: 22px;
    margin-bottom: 0.5rem !important;
  }

  .popup-ul {
    padding-left: 0px !important;
  }

  li.coin-popup img {
    padding-inline: 13px;
    width: 100%;
  }

  #cls-btn {
    position: absolute !important;
    left: 82.5% !important;
    margin-top: 0px !important;
    top: 10% !important;
    width: 5%;
  }

  #modal-content1 {
    margin-top: 30px !important;
    margin-left: 2% !important;
  }

  .col-md-8.cthulhu-left:after {
    content: "";
    width: 99%;
    left: -11% !important;
  }

  .modal-header {
    height: 29%;
    padding: 0px 0 !important;
    /* text-align: center; */
  }


  .modal-content {
    width: 475px !important;
    margin-left: -10% !important;
    padding: 10px !important;
  }

  .coin-sec .coin-leftright {
    padding-left: unset;
    padding: 10px;
    margin-top: 55px;
  }


  .fantasy-left img {
    /* width: 100% !important; */
    padding-bottom: 0%;
    /* display: none; */
  }

  #res-set {
    justify-content: flex-end !important;
  }

  .home-main-sec7 {
    padding-top: 0px;
    /* height: 52vh !important; */
  }

  .home-main-sec2 .text-head h1 {
    font-size: 16px;
    margin-top: 10px !important;
  }

  .valt-img {
    margin-top: 0px;
  }

  .text-headimg {
    height: 70px !important;
  }


  .home-main-sec5 .dragun-main {
    padding-top: 10px;
    padding-bottom: 2 0px;
  }

  .cthulhu-left h2 {
    color: white;
    font-size: 10px;
    margin-bottom: 10px !important;
    line-height: 1.3;

  }

  #cht-left {
    margin-top: -22px;
  }

  /* .home-main-sec4 .poker-right img {
          width: 100%;
          margin-left: 50px;
      } */
  .home-main-sec2 .text-head {
    margin-top: 0px;
  }



  .home-main-sec4 .poker-right img {
    width: 160%;
    margin-left: 100px;
    margin-top: 15px;
  }

  .home-main-sec2 .box-head {
    margin-bottom: 17px;
    margin-left: 50px;
  }

  .text-head:before {
    top: 37%;
    left: 20%;
    background-size: contain;
    height: 65%;
  }



  #arrow-right {
    top: 85% !important;

  }

  #arrow-set {
    top: 85% !important;

  }



  .home-main-sec4 .poker-right {
    width: 20% !important;
    margin-left: 50px !important;
  }


  /* ...../////I phone res////////.......... */

  .main-left .bimg {
    height: 90%;
    margin-top: 24px;
    width: 100%;
  }

  .right-shape {
    right: 10%;
    top: 31%;
    width: 91%;
  }


  .home-main-sec .head-ul .main-left {
    list-style: none;
    width: 30%;
    display: flex;
    justify-content: flex-end;
    margin-left: 50px;
    position: relative;
  }

  .main-right .simg {
    height: 80%;
    margin-top: 24px;
    width: 50%;
  }

  .coming-image {
    width: 30% !important;
    margin-top: 50px;
  }


  /* .home-main-sec .head-ul .main-right::before {
    top: 11%;
    left: 50% !important;
    height: 50vh;
  } */


  .left-shape {
    left: 20%;
    top: 39%;
  }

  .home-main-sec .head-ul .main-right {
    list-style: none;
    width: 30%;
    position: relative;
  }

  .right-shape {
    /* background: url(/rotate-text3.png) no-repeat; */
    background-size: contain;
  }

  .right-shape {
    right: -8%;
    top: 31%;
    width: 91%;
  }

  #cht-left {
    margin-top: 65px;
  }


  .carousel-inner {
    top: 10% !important;
    left: 12% !important;
    width: 75% !important;
  }


  img.close-btn1 {
    width: 4%;
    top: 10% !important;
    left: 87% !important;
  }

  #arrow-set {
    top: 77% !important;
    left: 18% !important;
  }

  #arrow-right {
    top: 77% !important;
    left: 77% !important;
  }

  .soon-text h1 {
    top: 32%;
    left: 54%;
    font-size: 25px;
    -webkit-text-stroke-width: 0.5px;
    font-weight: bold;
  }

  .home-main-sec4 .poker-left {
    width: 50% !important;
    margin-left: 20px;
  }

  #arkham-img {
    width: 170% !important;
    margin-top: 0px;
    margin-left: 20px !important;
  }

  .home-main-sec4 .poker-left h2 {
    line-height: 17px;
    margin-top: 10px;
    font-size: 12px;
    margin-bottom: 0;
  }

  .fantasy-left img {
    /* width: 100% !important; */
    padding-bottom: 0%;
    /* display: none; */
  }

  .col-md-8.fantasy-right h2 {
    font-size: 11px;
    width: 98%;
    line-height: 16px;
  }

  #footer-txt {
    float: left !important;
    width: 100% !important;
    padding: 0px !important;
    padding-top: 0px !important;
    height: 30px !important;
    align-items: center !important;
  }

  .footer-h1-text {
    font-size: 18px;
    margin-top: 5px;
  }

  h1.head-text {
    margin-top: 10px;
  }
}

@media (max-width: 370px) {
  #cht-left {
    margin-top: 74px;
  }

  .main-right .simg {
    height: 80%;
    margin-top: 24px;
    width: 50%;
  }

  .coming-image {
    width: 40% !important;
    margin-top: 0px;
  }

  h1.head-text {
    margin-top: 15px;
  }

  #cls-btn {
    position: absolute !important;
    left: 82.5% !important;
    margin-top: 0px !important;
    top: 6% !important;
    width: 5%;
  }

  #modal-content1 {
    margin-top: 20px !important;
    margin-left: 2% !important;
  }

  .modal-header {
    height: 33%;
    padding: 0px 0 !important;
    /* text-align: center; */
  }

  .modal-header .modal-title {
    font-size: 21px;
    margin-bottom: 0.5rem !important;
  }

  .home-main-sec .head-ul .main-left {
    list-style: none;
    width: 30%;
    display: flex;
    justify-content: flex-end;
    position: relative;
    margin-left: 50px;
  }

  .carousel-inner {
    top: 12% !important;
    left: 22% !important;
    width: 56% !important;
  }

  img.close-btn1 {
    width: 4%;
    top: 12% !important;
    left: 78% !important;
  }

  .home-main-sec4 .poker-left {
    width: 50% !important;
    margin-left: 20px;
    margin-top: 0px !important;
    font-size: 13px !important;
  }

  #arrow-set {
    top: 80% !important;
    left: 25% !important;
  }

  .modal {
    height: 47vh !important;
    background-size: auto;
  }

  #arrow-right {
    top: 80% !important;
    left: 70% !important;
  }


  .soon-text h1 {
    top: 30%;
    /* left: 50%; */
    font-size: 30px;
    -webkit-text-stroke-width: 1px;
    font-weight: bold;
  }


  #footer-txt {
    padding-top: 0px !important;
    margin-top: 0px;
  }

  #cht-left {
    margin-top: 50px;
  }

  .valt-img {
    margin-top: 5px;
  }

  .home-main-sec2 .value-right {
    float: left;
    margin-left: 0px !important;
  }

  .text-headimg {
    height: 75px !important;
  }

  .home-main-sec7 {
    padding-top: 0px;
    /* height: 45vh !important; */
  }


  .coin-sec .coin-leftright {
    padding-left: unset;
    padding: 10px;
    margin-top: 0px;
  }

  .coin-sec .coin-leftright .coim-para {
    font-size: 11px;
    margin-top: 0px !important;
  }

  .cthulhu-right .left-shapes {
    top: 16%;
    left: 18%;
    width: 72%;
  }

  .cthulhu-left h1 {
    font-size: 25px;
    margin-top: 20px;
  }

  .modal-backdrop.show {
    opacity: unset !important;
    height: 0vh;
    overflow: hidden !important;
  }

  #coin-sec {
    height: 47vh;
  }

  .footer-h1-text {
    margin-top: 1rem;
  }

  .body-type {
    /* height: 58.5vh !important; */
    /* height: 55vh !important; */
    width: 100%;
  }

  .home-main-sec .head-ul .main-right:before {
    left: 62% !important;
    top: 1% !important;
  }

  .coin-sec .coin-leftright {
    padding: 10px;
    margin-top: 80px;
  }

  .coin-sec .coin-leftright {
    padding-left: unset;
    padding: 10px;
    margin-top: 65px !important;
  }

}

@media (max-width: 350px) {
  #footer-txt {
    padding-top: 0px !important;
    margin-top: -31px;
  }

  .carousel-inner {
    top: 12% !important;
    left: 20% !important;
    width: 59% !important;
  }

  img.close-btn1 {
    top: 12%;
    left: 79% !important;
  }
}

body.modal-open {
  padding: 0 !important;
}

button.btn-close.close-btn1 {
  --bs-btn-close-bg: unset;
}

a {
  color: white !important;
}