@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700;900&family=Cinzel:wght@400..900&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');

body {
  font-weight: 500;
  scroll-behavior: smooth;
  overflow-x: hidden;
  background-color: #f7f6f3;
  font-family: "Cinzel", serif;

}

.lato {
  font-family: "Lato", sans-serif;
}

/* @font-face {
  font-family: "Chomsky";
  src: url("../fonts/Chomsky.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}

.chomskyFont {
  font-family: "Chomsky", serif;
} */

a { 
  text-decoration: none;
  color: inherit;
}

.home_header {
  width: 100%;
  min-height: 100vh;
  background-size: cover;
  background-image: url("../images/Section.webp");
  background-attachment: fixed;
  padding-top: 100px;
}

.enq_btn {
  min-width: 200px;
  height: 60px;
  background-image: url("../images/Button.webp");
  background-size: 100% 100%;
  color: #482E00;
  font-weight: 700;
  background-color: transparent;
  border: none;
  outline: none;
}

/* "Not purchasable yet" state - a game whose "OPEN TO PURCHASE"
   checkbox is off in the admin still shows its own page, just with
   this instead of the real "Acheter maintenant" button: same shape,
   same hover shine/glow animation, just grey instead of gold, and not
   wired to open the buy popup. */
.enq_btn.is-disabled {
  background-image: none;
  background-color: #6b6b6b;
  color: #fff;
  cursor: not-allowed;
  border-radius: 10px;
}

/* The red "discount is limited" box next to the buy button on a
   game's own page - its own stock count, its own expiry countdown,
   or both, whichever the admin has actually set for that game's
   discount. */
.discount_promo_box {
  background-color: #c0392b;
  color: #fff;
  border-radius: 10px;
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.6;
}
.discount_promo_line + .discount_promo_line {
  margin-top: 2px;
}

/* Shiny hover for every themed button on the site: a light sweep
   across the button plus the same amber/gold glow used elsewhere,
   both looping for as long as the button is hovered. */
.enq_btn,
.gift_card_bg button,
.footer_btn,
.header_menu_btn,
.content_box button {
  position: relative;
  overflow: hidden;
}

.discover_card_wrap button,
.discover_card_wrap a.book_now_btn {
  overflow: hidden;
}

.enq_btn::before,
.gift_card_bg button::before,
.footer_btn::before,
.header_menu_btn::before,
.content_box button::before,
.discover_card_wrap button::before,
.discover_card_wrap a.book_now_btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: -60%;
  width: 28%;
  height: 100%;
  background: linear-gradient(120deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .55) 50%, rgba(255, 255, 255, 0) 100%);
  transform: skewX(-20deg);
  pointer-events: none;
}

.enq_btn,
.gift_card_bg button,
.footer_btn,
.header_menu_btn,
.content_box button,
.discover_card_wrap button,
.discover_card_wrap a.book_now_btn {
  transition: box-shadow 0.3s ease;
}

.enq_btn:hover,
.gift_card_bg button:hover,
.footer_btn:hover,
.header_menu_btn:hover,
.content_box button:hover,
.discover_card_wrap button:hover,
.discover_card_wrap a.book_now_btn:hover {
  animation: boxGlowPulse 1.6s ease-in-out infinite;
}

.enq_btn:hover::before,
.gift_card_bg button:hover::before,
.footer_btn:hover::before,
.header_menu_btn:hover::before,
.content_box button:hover::before,
.discover_card_wrap button:hover::before,
.discover_card_wrap a.book_now_btn:hover::before {
  animation: btnShineSweep 1.3s ease-in-out infinite;
}

@keyframes btnShineSweep {
  0% {
    left: -60%;
  }
  100% {
    left: 110%;
  }
}

.header_heading {
  font-weight: 700;
  font-size: 3.8rem;
  font-weight: 700;
  background: linear-gradient(90deg, #FFD166 0%, #EEA62B 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  text-wrap: nowrap;
}


.text_gradient {
  background: linear-gradient(90deg, #FFD166 0%, #EEA62B 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-family: "Cinzel Decorative", serif;
}

.home_second_section,
.home_third_section,
.home_fifth_section,
.home_seven_section,
.home_six_section,
.home_eight_section,
.home_end_section {
  width: 100%;
  min-height: 600px;
  background-image: url("../images/section2.webp");
  background-size: cover;
}

.home_eight_section {
  background-image: url("../images/section8.webp");
}

.home_seven_section {
  background-image: url("../images/section7.webp");
}

.home_third_section {
  background-image: url("../images/section3.webp");
}

.home_fifth_section {
  background-image: url("../images/section5.png");
}

/* home_second_section only - a flat black overlay over its background
   image so the text sitting on top of it is readable. The other
   sections sharing that same background image above are untouched. */
.home_second_section {
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../images/section2.webp");
}

.home_nine_section {
  width: 100%;
  height: 900px;
  background-image: url("../images/section10.webp");
  background-size: 100% 100%;
  padding: 50px;
}

.best_selling_img{
  width:150px;
  position:absolute;
  top:-50px;
  left:20px;
}

.text_brown{
  color:#482E00 !important;
}

.selling_content{
  margin-top:60px;
}

.font_cinzel{
  font-family: "Cinzel Decorative", serif;
}

.home_end_section {
  background-image: url("../images/Section.webp");
}

.most_selling_wrap {
  width:990px;
  min-height: 200px;
  background-image: url("../images/most-selling-bg.webp");
  background-size: cover;
  padding:30px;
  display: block;
  margin: auto;
  border-radius: 5px;
  position: relative;
  margin-top: 100px;
}

.selling_product_box{
  width: 30%;
  height: 200px;
  border-radius: 5px;
  border: 2px solid #A16512;
    position: relative;
  transition: box-shadow 0.3s ease, border-color 0.3s ease;
}

.selling_product_box:hover{
  border-color: #EEA62B;
  animation: boxGlowPulse 1.6s ease-in-out infinite;
}
.selling_product_box img,.selling_product_box_first img{
  width:100%;
  height:100%;
  object-fit: cover;
}

.RARE{
  position: absolute;
  width:max-content;
  padding: 5px;
  color: #fff;
  background-color: #30231D;
  top: 8px;
  left: 8px;
  border-radius: 5px;
  font-size: 10px;
  letter-spacing: 1px;
}

.Legendary{
  position: absolute;
  width:max-content;
  padding: 5px;
  color: #1b1205;
  background-color: #EEA62B;
  top: 8px;
  left: 8px;
  border-radius: 5px;
  font-size: 10px;
  letter-spacing: 1px;
}

.Epic{
  position: absolute;
  width:max-content;
  padding: 5px;
  color: #000;
  background-color: #28BDB1;
  top: 8px;
  left: 8px;
  border-radius: 5px;
  font-size: 10px;
  letter-spacing: 1px;
}

.selling_product_box_first{
  width: 35%;
  height: 250px;
  border-radius: 5px;
  border: 2px solid #A16512;
  margin-top: -50px;
  position: relative;
  transition: box-shadow 0.3s ease, border-color 0.3s ease;
}

.selling_product_box_first:hover{
  border-color: #EEA62B;
  animation: boxGlowPulse 1.6s ease-in-out infinite;
}

/* Same amber/gold glow as the header logo hover, looped while hovered */
@keyframes boxGlowPulse {
  0%, 100% {
    box-shadow: 0 0 5px 0px rgba(238, 166, 43, .4), 0 0 10px 1px rgba(255, 209, 102, .25);
  }
  50% {
    box-shadow: 0 0 12px 2px rgba(238, 166, 43, .85), 0 0 20px 4px rgba(255, 209, 102, .5);
  }
}

.game_information_box{
  width: 100%;
  height: 45px;
  background-color: #1b1205;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 5px;
}

.game_information_box p{
  color: white;
  font-size: 10px;
  text-align: center;
}

.selling_price{
  color: #EEA62B;
  font-size:10px;
}

.selling_available{
  color: #EEA62B;
  font-size:10px;
  display: flex;
  align-items: center;
}
.selling_available span{
 width: 8px;
 height: 8px;
 background-color: #EEA62B;
 border-radius: 50%;
 display: inline-block;
 margin-right: 5px;
}

.splide__slide {
  transition: transform 0.3s ease;
}

.game_list_card_warp {
  width: 100%;
  min-height: 300px;
  background-image: url("../images/game-list-card.webp");
  background-size: 100% 100%;
  padding: 20px;
}

.game_list_card_warp img {
  display: block;
  width: 320px;
  height: 320px;
  object-fit: cover;
  margin: auto;
  /* Same corner-tag shape as the uploaded posters themselves: a
     straight inset at the very top, then a short diagonal taper
     back out to the full edge, same card-frame paper peeking
     through look as the rest of the design. */
  clip-path: polygon(20px 0, 100% 0, 100% 100%, 0 100%, 0 74px, 20px 65px);
}

.card_heading1 {
  font-family: "Cinzel Decorative", serif;
  font-weight: 600;
  font-size: 30px;

  background: linear-gradient(90deg,
      #825E20 0%,
      #4F3914 50%,
      #825E20 100%);

  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}



.news_slider_box {
  width: 100%;
  min-height: 320px;
  border: 2px solid #A16512;
  overflow: hidden;
  border-radius: 5px;
  background-color: #1F1814;
}

.news_slider_box img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}

.news_text {
  color: #6C6C6C;
  line-height: 1.4;
  font-size: 15px;
}

.case_person {
  max-width: 400px;
  position: absolute;
  top: 0;
  right: -100px;
}

.read_more {
  color: #EEA62B;
  font-size: 15px;
  font-family: lato;
  display: flex;
  gap: 8px;
  align-items: center;
  margin-top: 15px;
}

.read_more:hover {
  color: #FFD166;
  cursor: pointer;
}

.read_more i {
  font-size: 12px;
}

.home_eleven_section {
  width: 100%;
  min-height: 200px;
  background-image: url("../images/section11.webp");
  background-size: cover;
  background-position: center center;
  padding: 50px;
}

.reviews_btns {
  font-size: 20px;
  color: #E4DDCD;
  cursor: pointer;
  transition: 0.2s ease-in-out;
}

.reviews_btns:hover {
  color: #EEA62B;
}

.slider_counter {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-weight: 700;
  font-size: 18px;
  color: #3B2308;
  background: radial-gradient(circle at 35% 30%, #FFD970, #C9890F 75%);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
}

.content_block{
    margin-top: 20px;
}

.content_block_image {
  border: 3px solid #E4DDCD;
  border-radius: 5px;
  width: 80%;
  display: block;
  margin: auto;
}

.case_block_cols_image {
  width: 100%;
  height: 300px;
  object-fit: cover;
}

.challenge_image_frame {
  position: relative;
  width: 100%;
  max-width: 500px;
  aspect-ratio: 4 / 5;
  margin: 0 auto;
}

@Media (max-width: 1300px) {
  .challenge_image_frame {
    max-width: 400px;
  }
}
@Media (max-width: 1200px) {
  .challenge_image_frame {
    max-width: 350px;
  }
}


.challenge_polaroid_front,
.challenge_polaroid_back {
  position: absolute;
  display: block;
  width: 78%;
  box-shadow: 0 14px 26px rgba(0, 0, 0, .4);
  border-radius: 3px;
}

.challenge_polaroid_back {
  top: 0;
  left: 0;
  transform: rotate(-10deg);
  z-index: 1;
}

.challenge_polaroid_front {
    top: 0;
    right: -137px;
    transform: rotate(12deg);
    z-index: 2;
}

.challenge_polaroid {
  background: #E4DDCD;
  padding: 6% 5% 16% 5%;
  transition: filter 0.3s ease;
}

/* Same white shine as the other images, loops while hovered */
.challenge_polaroid:hover {
  animation: worksImageLine 1.4s ease-in-out infinite;
}

.challenge_polaroid img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  background: #2b1a08;
}


@Media (max-width: 992px) {
  .challenge_polaroid_front {
    top: 0;
    right: 0;
    transform: rotate(12deg);
    z-index: 2;
}


.challenge_polaroid_front,
.challenge_polaroid_back {
  position: absolute;
  display: block;
  width: 60%;
  box-shadow: 0 14px 26px rgba(0, 0, 0, .4);
  border-radius: 3px;
}

.challenge_polaroid_front {
    top: 0;
    right: 0px;
    transform: rotate(12deg);
    z-index: 2;
}
}

.faq_nav_btn {
  color: #000;
}

.faq_nav_btn:hover {
  color: #EEA62B;
}

.reviews_wide_container {
  max-width: 1320px;
}

.reviews_box {
  width: 100%;
  height: 260px;
  background-image: url("../images/aboutus_card.webp");
  background-size: 100% 100%;
  padding-top: 65px;
  padding-left: 10%;
  padding-right: 10%;
  text-align: center;
  color: #6D4B2C;
}

.reviews_box img {
  width: 50px;
  height: 50px;
  object-fit: cover;
  border: 4px solid #6D4B2C;
  border-radius: 3px;
  display: block;
  margin: auto;
}


.striped-text {
  font-weight: 600;
  text-transform: uppercase;
  color: #4F3914;
  max-height: 50px;
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

/* Mouse wheel still scrolls this - only the scrollbar itself is hidden */
.striped-text::-webkit-scrollbar {
  display: none;
}


.challanges_section_wrap {
  width: 65%;
  height: 500px;
  display: block;
  margin: auto;
  margin-top: 90px;
  padding: 20px 0;
  text-align: center;
}

.challange_card_wrap img {
  width: 120px;
  display: block;
  margin: auto;
  object-fit: contain;
}

.challange_card_wrap h5 {
  font-weight: 600;
}

.challange_card_wrap p {
  font-size: 13px;
}

.challanges_section_wrap h3 {
  color: #482E00;
}

.challanges_text {
  max-width: 500px;
  margin: auto;
  color: #482E00;
}

.challange_card_wrap,
.what_we_do_card {
  width: 100%;
  max-width: 320px;
  height: 350px;
  background-image: url("../images/challangeCard.webp");
  background-size: 100% 100%;
  padding: 30px 28px;
  display: block;
  margin: auto;
}

.what_we_do_card {
  height: 400px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.what_we_do_card  img{
max-width: 120px;
}

.what_we_do_card p {
  color: #482E00;
  text-align: center;
  font-weight: 600;
  font-size: 20px;
  margin-top: 15px;
}

.book_wrapper {
  width: 90%;
  min-height: 600px;
  background-image: url("../images/faq_book.webp");
  background-size: 100% 100%;
  display: flex;
  margin: auto;
  padding: 50px;
  align-items: center;
}

.book_left_part {
  width: 50%;
  min-height: 300px;
  height: 100%;
  /* border: 1px solid black; */
}

.book_left_part img {
  display: block;
  margin: auto;
}

.book_right_part {
  width: 50%;
  min-height: 300px;
  height: 100%;
  /* border: 1px solid black; */
  padding: 3%;
  color: #704D11;
}



.text_brown {
  color: #704D11;
}

.faq_box {
  width: 98%;
  min-height: 60px;
  background-image: url("../images/inactive_faq.webp");
  background-size: 100% 100%;
  color: white;
  padding: 20px;
  position: relative;
  cursor: pointer;
  margin-bottom: 20px;
}

.qustion {
  font-weight: 600;
}

.active_faq_box {
  background-image: url("../images/active_faq.webp");
  background-size: 100% 100%;
}

.active_faq_box i {
  rotate: -180deg;
}

.answer {
  overflow: hidden;
  font-family: lato;
  height: 0;
  transition: height 0.3s ease;
}

.fa-caret-down {
  position: absolute;
  top: 20px;
  right: 20px;
  color: #EEA62B;
}

.casesmainwarp {
  position: relative;
  z-index: 100;
}

.person {
  position: absolute;
  top: 0;
  right: 0;
  width: 550px;
}

.cases_warp {
  width: 100%;
  height: 450px;
  position: relative;
  display: flex;
  justify-content: end;
  align-items: center;
}

/* The box's "image" is this background layer, kept as its own pseudo
   element so the white hover line hugs just this background art, not
   the photo, pin icon, or text that sit on top of it. */
.cases_warp::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url("../images/caseBoxBg.webp");
  background-size: 100% 100%;
  transition: filter 0.3s ease;
  pointer-events: none;
  z-index: 0;
}

.cases_warp:hover::before {
  animation: worksImageLine 1.4s ease-in-out infinite;
}

.case_image {
  position: absolute;
  left: 6%;
  top: 35px;
  width: 35%;
  height: 280px;
  object-fit: cover;
}

.pin {
  position: absolute;
  top: -15px;
  left: 10px;
  z-index: 100;
}

.case_content {
  max-width: 40%;
  margin-right: 12%;
  transform: translateY(-20px);
  color: #634711;
}

.main_form_wrap .content_box {
  width: 80%;
  padding-top: 20px;
  position: static !important;
  left: 50%;
  top: 120px;
  transform: translateX(0%) !important;
  margin: auto;
}

.main_form_wrap .content_box input,
.main_form_wrap .content_box textarea {
  color: #fff;
}

.main_form_wrap .content_box input::placeholder,
.main_form_wrap .content_box textarea::placeholder {
  color: #fff;
}

.whyEnqHeading {
  font-size: 50px;
  color: #4F3914;
  font-weight: 600;
  text-align: start;
}

.home_six_section {
  min-height: 200px;
  padding: 80px 0;
  background-image: url("../images/section6.webp");
  display: flex;
  justify-content: center;
  align-items: center;
}

.home_fourth_section {
  width: 100%;
  min-height: 200px;
  padding: 80px 0;
  background-image: url("../images/section4.webp");
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 100px;
}

.worksImage {
  max-width: 300px;
  transition: filter 0.3s ease;
}

/* Bright white line hugging the actual png shape (drop-shadow follows
   the image's own transparency, not its rectangular box), loops while
   hovered. */
.worksImage:hover {
  animation: worksImageLine 1.4s ease-in-out infinite;
}

@keyframes worksImageLine {
  0%, 100% {
    filter: drop-shadow(0 0 2px rgba(255, 255, 255, .6)) drop-shadow(0 0 4px rgba(255, 255, 255, .35));
  }
  50% {
    filter: drop-shadow(0 0 4px rgba(255, 255, 255, 1)) drop-shadow(0 0 9px rgba(255, 255, 255, .75));
  }
}

.arrow_1 {
  width: 300px;
  position: absolute;
  right: -300px;
  top: 80px;
  transition: filter 0.3s ease;
}

/* Same white line as worksImage, hugging the actual png shape, loops
   while hovered. Covers both arrow1d.png and arrow1m.png since they
   share this class. */
.arrow_1:hover {
  animation: worksImageLine 1.4s ease-in-out infinite;
}

.arrow_2 {
  width: 350px;
  position: absolute;
  left: -300px;
  top: 80px;
  transition: filter 0.3s ease;
}

/* Same white line as worksImage/arrow_1, hugging the actual png shape,
   loops while hovered. Covers both arrow2d.png and arrow2m.png since
   they share this class. */
.arrow_2:hover {
  animation: worksImageLine 1.4s ease-in-out infinite;
}

.lastWorksItem {
  margin-top: -100px;
}

.gift_card_bg {
  width: 100%;
  min-height: 300px;
  background-image: url("../images/giftcardbg.png");
  background-size: 100% 100%;
  padding: 20px;
  padding-top: 40px;
  position: relative;
}

.gift_card_bg h4 {
  color: #482E00;
  font-weight: 600;
}

.gift_card_bg .price {
  color: #482E00;
  font-weight: 600;
  font-size: 23px;
}

.gift_card_bg button {
  width: 220px;
  height: 40px;
  border: none;
  outline: none;
  background-image: url("../images/Button.webp");
  background-size: 100% 100%;
  font-weight: 600;
  font-size: 16px;
}

.gifts {
  width: 130px;
  position: absolute;
  top: -70px;
  right: 40px;
  transition: filter 0.3s ease;
}

/* Same white shine as worksImage/arrows, only on the gift.png image,
   triggered by hovering the whole card. */
.gift_card_bg:hover .gifts {
  animation: worksImageLine 1.4s ease-in-out infinite;
}

.innerImage {
  width: 100%;
  height: 270px;
  object-fit: contain;
  display: block;
  margin: auto;
}

/* The promo card's 2 game-cover images, each wrapped in
   PromoImageFrame.webp and angled so they look like a little stack of
   cards. The inset percentages on .promo_framed_image img were measured
   directly from the frame image's own transparent window, so the photo
   sits exactly inside the frame's gold border, not guessed. */
.promo_image_stack {
  position: relative;
  width: 100%;
  max-width: 230px;
  height: 270px;
  margin: 20px auto;
}

.promo_framed_image {
  position: absolute;
  width: 85%;
  aspect-ratio: 360 / 379;
  background-image: url("../images/PromoImageFrame.webp");
  background-size: 100% 100%;
  filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.35));
}

.promo_framed_image img {
  position: absolute;
  left: 17.5%;
  top: 21.5%;
  width: 64.5%;
  height: 61%;
  object-fit: cover;
  border-radius: 6px;
}

.promo_framed_image_back {
  top: -15px;
  left: 20px;
  transform: rotate(-7deg);
  z-index: 1;
}

.promo_framed_image_front {
  top: 40%;
  left: 20%;
  transform: rotate(7deg);
  z-index: 2;
}

.iconsBOxImage {
  width: 100px;
  height: 100px;
  object-fit: contain;
  margin-bottom: 20px;
}

.third_section_paper {
  width: 70%;
  min-height: 400px;
  max-width: 1600px;
  background-image: url("../images/paper.webp");
  background-size: 100% 100%;
  display: block;
  margin: auto;
  padding: 60px 130px;
  text-align: center;
}

.third_section_paper h1 {
  font-weight: 600;
  color: #82522C;
  margin: 50px 0;
  margin-bottom: 30px;
}

.third_section_paper img {
  max-width: 170px;
  max-height: 170px;
}


.video_frame {
  width: 70%;
  height: 450px;
  background-image: url("../images/videoBox.webp");
  background-size: 100% 100%;
  display: block;
  margin: auto;
  margin-top: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 100px;
}

.video_frame .youtube_video_wrap {
  width: 88%;
  height: 360px;
  margin: auto;
}

.youtube_video_wrap {
  position: relative;
  display: block;
}

.youtube_video_wrap .youtube_video_frame {
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  z-index: 1;
}

.youtube_play_btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  line-height: 0;
}

.youtube_play_btn img {
  width: 90px;
  height: 90px;
}

.discover_card_wrap {
  /* Fills whatever width Splide gives its slide, exactly, at every
     screen size - that's what makes the gap between cards always
     equal to the slider's own "gap" option instead of varying. The
     height follows the same 300:400 ratio the card was designed at
     (via aspect-ratio), so it keeps its original proportions instead
     of being stretched. */
  width: 100%;
  aspect-ratio: 3 / 4;
  background-image: url("../images/discoverCardBg.webp");
  background-size: 100% 100%;
  position: relative;
  display: block;
  margin: auto;
}

.discover_card_wrap img {
  width: 65%;
  height: 220px;
  position: absolute;
  left: 50%;
  top: 80px;
  object-fit: cover;
  transform: translateX(-52%);
}

.discover_card_wrap .price {
  font-size: 30px;
  position: absolute;
  top: 25px;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(90deg, #FFD166 0%, #EEA62B 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 700;
}

/* "SPÉCIALE PROMO" ribbon - only on a game card that actually has a
   discount, centered at the very top of the card, overlapping its
   frame artwork slightly so it reads as a badge, not part of the
   frame. */
.discover_card_wrap .promo_badge {
  position: absolute;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(90deg, #FFD166 0%, #EEA62B 100%);
  color: #1a1206;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 1px;
  text-transform: uppercase;
  white-space: nowrap;
  padding: 6px 10px;
  border-radius: 20px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .35);
  z-index: 2;
}

.discover_card_wrap button,
.discover_card_wrap a.book_now_btn {
  position: absolute;
  width: 220px;
  height: 40px;
  border: none;
  outline: none;
  bottom: -0px;
  /* ✅ as requested */
  left: 50%;
  /* center reference */
  transform: translate(-50%, 0);
  /* move left by 50% */
  background-image: url("../images/Button.webp");
  background-size: 100% 100%;
  font-weight: 600;
  font-size: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #482E00;
  text-decoration: none;
}

@media (max-width:1199px) {
  .discover_card_wrap img {
    width: 65%;
    height: 185px;
    position: absolute;
    left: 50%;
    top: 65px;
    object-fit: cover;
    transform: translateX(-52%);
}
}
@media (max-width:992px) {
    .discover_card_wrap img {
        width: 65%;
        height: 290px;
        position: absolute;
        left: 50%;
        top: 100px;
        object-fit: cover;
        transform: translateX(-52%);
    }

    .discover_card_wrap {
    width: 350px;
    aspect-ratio: 3 / 4;
    background-image: url(../images/discoverCardBg.webp);
    background-size: 100% 100%;
    position: relative;
    display: block;
    margin: auto;
}
}
@media (max-width:768px) {
 .discover_card_wrap {
    width: 350px;
    aspect-ratio: 3 / 4;
    background-image: url(../images/discoverCardBg.webp);
    background-size: 100% 100%;
    position: relative;
    display: block;
    margin: auto;
}

.main_form_wrap .content_box {
  width: 100%;
  padding-top: 20px;
  position: static !important;
  left: 50%;
  top: 120px;
  transform: translateX(0%) !important;
  margin: auto;
}
}
@media (min-width:1399px) {
.discover_card_wrap img {
    width: 65%;
    height: 260px;
    position: absolute;
    left: 50%;
    top: 90px;
    object-fit: cover;
    transform: translateX(-52%);
}
}

.game_list_wrap {
  width: 100%;
  min-height: 400px;
  padding: 150px 0 60px;
  background-image: url("../images/game-list-bg.webp");
  background-size: cover;
}


.games_filter {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  background: rgba(0, 0, 0, 0.6);
  border: 1px solid #7a5a2b;
  width: fit-content;
  max-width: 100%;
  overflow-x: auto;
  /* ✅ mobile scroll */
  scrollbar-width: none;
  /* Firefox */
}

.games_filter::-webkit-scrollbar {
  display: none;
  /* Chrome */
}

.games_filter li {
  padding: 10px 16px;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  cursor: pointer;
  color: #c9b37a;
  border: 1px solid #7a5a2b;
  white-space: nowrap;
  transition: all 0.25s ease;
  flex-shrink: 0;
  /* 🔴 VERY IMPORTANT */
}

/* Active */
.games_filter li.active_game {
  background: linear-gradient(to right, #c9a24d, #e6c87a);
  color: #1b1205;
  border-color: #e6c87a;
}

/* Hover */
.games_filter li:hover {
  color: #f1d88a;
}

.game-list-page-heading {
  font-size: 4rem;
}

/* ===================== */
/* Tablet adjustments */
@media (max-width: 1024px) {

  .games_filter {
    width: 100%;
  }

  .games_filter li {
    padding: 8px 14px;
    font-size: 12px;
  }

  .game-list-page-heading {
    font-size: 2.7rem;
  }
}

/* ===================== */
/* Mobile adjustments */
@media (max-width: 640px) {
  .games_filter {
    border-radius: 4px;
  }

  .games_filter li {
    padding: 8px 12px;
    font-size: 11px;
  }
}





.footer {
  width: 100%;
  padding: 50px 0;
  background-color: #0C0A09;
}

.footer_input {
  width: 100%;
  height: 50px;
  background-color: #53402D;
  outline: none;
  border: 1px solid #825E20;
  border-radius: 10px;
  padding: 5px 10px;
  color: silver;
  font-family: lato;

}

.footer_input::placeholder {
  font-family: lato;
  color: silver;
}

.footer_logo_text {
  color: #9D8C7B;
  letter-spacing: 1px;
  /*text-wrap: nowrap;*/
  text-align: center;
}

.footer_logo {
  width: 110px;
  margin-bottom: 10px;
}

/* Only the first image inside the about page's aboutus_paper wrap
   (which reuses this same logo image) - turned fully black, the
   actual site footer logo above is untouched. */
.aboutus_paper .footer_logo {
  filter: grayscale(1);
}

.social_icon {
  width: 45px;
  height: 45px;
  cursor: pointer;
  transition: transform 0.3s ease;
}

.social_icon:hover {
  transform: scale(1.1);
}

.footer_links a {
  font-family: lato;
  color: white;
}

.footer_btn {
  width: 120px;
  height: 45px;
  background-image: url("../images/Button.webp");
  background-size: 100% 100%;
  border: none;
  outline: none;
  background-color: transparent;
}

.footer_end_line {
  color: #9D8C7B;
  font-size: 14px;
  font-family: lato;
  margin-top: 50px;
}

.circleBox {
  width: 8px;
  height: 8px;
  background-color: #9D8C7B;
  border-radius: 50%;
}

.game_detail_wrap,
.blog_detail_wrap,
.challange_detail_wrap {
  width: 100%;
  min-height: 400px;
  background-image: url("../images/game-detail-section-1.webp");
  background-size: 100% 100%;
  padding: 60px 0;
  padding-top: 150px;
}

.blog_detail_wrap {
  background-image: url("../images/blog-detail-page.webp");
}

.new_blog_details{
  background-image: url("../images/blog-details-bg.webp");
  background-size: 100%;
}

.challange_detail_wrap {
  background-image: url("../images/challange-detail-bg.webp");
}

/* The blog listing page uses its own class (not .aboutus, which other
   pages like About/FAQ/Privacy/Terms still use) so it can have the same
   background image as the blog detail page without changing those
   other pages too. */
.blog_list_wrap {
  width: 100%;
  min-height: 600px;
  padding: 50px 0;
  background-image: url("../images/blog-detail-page.webp");
  background-size: cover;
  padding-top: 199px;
}



.challange-detail-box {
  width: 100%;
  height: 700px;
  background-image: url("../images/challange-detail_image.webp");
  background-size: 100% 100%;
  position: relative;
  padding: 130px;
}

.box {
  width: 90%;
  height: 80%;
}

.challange-detail-box h2 {
  color: #82522C;
  font-size: 4rem;
  font-weight: 600;
  font-family: "Cinzel Decorative", serif;
}

/* i need css for black text color */



.challange-detail-box h1 {
  color: #82522C;
  font-family: "Cinzel Decorative", serif;
}


.blog_detail_top_image_box {
  width: 100%;
  height: 600px;
  background-image: url("../images/blog-top-image-bg.webp");
  background-size: 100% 100%;
  position: relative;
}

.blogs_gal_box {
  width: 100%;
  height: 400px;
  background-image: url("../images/picFrame.webp");
  background-size: 100% 100%;
  position: relative;
}

.challenge-detail-box {
  width: 100%;
  height: 550px;
  background-image: url("../images/challangeCard.webp");
  background-size: 100% 100%;
  position: relative;
  padding-top: 80px;
  text-align: center;
  padding-left: 10%;
  padding-right: 10%;
  color: #634711;
}

.challenge-detail-box h2 {
  color: #82522C;
  font-weight: 600;
  font-size: 30px;
  font-family: "Cinzel Decorative", serif;
}

.challenge-detail-box p {
  font-family: lato;
  font-size: 17px;
  padding: 0 20px;
}

.challenge-detail-box img {
  max-width: 40%;
  display: block;
  margin: auto;
  margin-bottom: 50px;
}

.blogs_gal_box img {
  width: 87%;
  height: 72%;
  position: absolute;
  left: 7%;
  top: 5%;
  object-fit: cover;
}


.blog_detail_top_image_box img {
  width: 78%;
  height: 75%;
  position: absolute;
  left: 8%;
  top: 7%;
  object-fit: cover;
}

.challenge_submit_wrap {
  width: 100%;
  min-height: 1100px;
  background-image: url("../images/challangeFormBg.webp");
  background-size: 100% 100%;
  max-width: 900px;
  margin: auto;
  position: relative;
  padding-top: 150px;
}

.form_top_heading {
  color: #C7AB80;
  position: absolute;
  width: 60%;
  top: 38px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 1.5rem;
  font-weight: 600;
  /* border: 1px solid blue; */
  height: 80px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}


.form_email_challange {
  color: #482E00;
  width: 80%;
  height: 50px;
  /* border: 1px solid white; */
  position: absolute;
  width: 60%;
  bottom: 225px;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1.2rem;
  letter-spacing: 2px;
  transition: 0.3s ease-in-out;
}

.form_email_challange:hover {
  color: #fff
}

.form_contact_box {
  min-height: 80px;
  /* border: 1px solid white; */
  position: absolute;
  width: 75%;
  bottom: 120px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1rem;
}

.main_form_wrap {
  width: 80%;
  margin: auto;
  min-height: 600px;
  /* border: 1px solid red; */
}

.game_detail_image {
  width: 100%;
  height: 630px;
  border: 2px solid #825E20;
  border-radius: 5px;
  object-fit: cover;
}

.brainImages {
  max-width: 70%;
  display: block;
  margin: auto;
  margin-top: 20px;
}

.desktopMenuWrap {
  width: 95%;
  height: 120px;
  max-width: 1700px;
  background-image: url("../images/desktop_menu_bg.webp");
  background-size: 100% 100%;
  background-color: transparent;
  display: block;
  margin: auto;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1000;
}

.mobile_menu_wrap {
  width: 100%;
  height: 100px;
  background-image: url("../images/mobMenuBg.webp");
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 95%;
}

.MobileLogo {
  width: 70px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  transition: filter 0.3s ease;
}

.MobileLogo:hover {
  animation: logoGlowPulse 1.6s ease-in-out infinite;
}

.MenuOpener i {
  transition: transform 0.3s ease;
}

.mobile_menu_wrap.menu_open .MenuOpener i {
  transform: rotate(90deg);
}

.mobile_nav_menu {
  position: absolute;
  top: 100px;
  left: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  background: rgba(10, 7, 2, 0.97);
  border-top: 1px solid rgba(240, 203, 117, 0.2);
  transition: max-height 0.4s ease, opacity 0.3s ease;
  z-index: 999;
}

.mobile_menu_wrap.menu_open .mobile_nav_menu {
  max-height: 500px;
  opacity: 1;
}

.mobile_nav_menu a {
  color: #F0CB75;
  text-transform: uppercase;
  font-size: 13px;
  letter-spacing: 1px;
  padding: 14px 30px;
  border-bottom: 1px solid rgba(240, 203, 117, 0.1);
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.mobile_menu_wrap.menu_open .mobile_nav_menu a {
  opacity: 1;
  transform: translateY(0);
}

.mobile_nav_menu a:nth-child(1) { transition-delay: 0.05s; }
.mobile_nav_menu a:nth-child(2) { transition-delay: 0.1s; }
.mobile_nav_menu a:nth-child(3) { transition-delay: 0.15s; }
.mobile_nav_menu a:nth-child(4) { transition-delay: 0.2s; }
.mobile_nav_menu a:nth-child(5) { transition-delay: 0.25s; }
.mobile_nav_menu a:nth-child(6) { transition-delay: 0.3s; }
.mobile_nav_menu a:nth-child(7) { transition-delay: 0.35s; }

.mobile_nav_menu a.active,
.mobile_nav_menu a:hover {
  color: #ffffff;
  background: rgba(184, 133, 46, 0.25);
}


.game-detail-video {
  width: 100%;
  height: 400px;
  background-image: url("../images/videoBox.webp");
  background-size: 100% 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.game-detail-video .youtube_video_wrap {
  width: 88%;
  height: 80%;
}

.game_images {
  width: 100%;
  height: 130px;
  border: 2px solid #825E20;
  border-radius: 5px;
  object-fit: cover;
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

/* The thumbnail strip under the main game image, now a Splide
   slider so swipe/drag is handled by Splide itself. It always
   shows 3 images and fills the full width of its column. */
.game_thumbs_wrap {
  width: 100%;
}

.game_images:hover {
  opacity: 0.9;
}

.game_images.active_thumb {
  opacity: 1;
  /* transform: scale(1.05); */
  border: 2px dashed #c9b37a;
}

.community_slider_box {
  width: 100%;
  height: 220px;
  overflow: hidden;
  border: 2px solid #A16512;
  border-radius: 5px;
}

@media (max-width: 768px) {
  .community_slider_box {
    height: 220px;
  }
}

.community_slider_box img {
  object-fit: cover;
  height: 100%;
  width: 100%;

}

.game-detail-gallery {
  width: 100%;
  min-height: 600px;
  padding: 50px 0;
  background-image: url("../images/game-detail-section-2.webp");
  background-size: cover;
}

.aboutus,
.faqPage {
  width: 100%;
  min-height: 600px;
  padding: 50px 0;
  background-image: url("../images/section2.webp");
  background-size: cover;
  padding-top: 199px;
}

.desktop_menu_content {
  position: relative;
  width: 100%;
  height: 100%;
}

.desktopLogo {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 85px;
  transition: filter 0.3s ease;
}

.desktopLogo:hover {
  animation: logoGlowPulse 1.6s ease-in-out infinite;
}

/* Logo hover glow, theme colors (gold/amber), loops while hovered */
@keyframes logoGlowPulse {
  0%, 100% {
    filter: drop-shadow(0 0 4px rgba(238, 166, 43, .45)) drop-shadow(0 0 8px rgba(255, 209, 102, .3));
  }
  50% {
    filter: drop-shadow(0 0 10px rgba(238, 166, 43, .85)) drop-shadow(0 0 16px rgba(255, 209, 102, .55));
  }
}

.left_desktop_menu {
  position: absolute;
  top: 30px;
  height: 50px;
  display: flex;
  gap: 5px;
  width: 35%;
  left: 50px;
  /* border: 1px solid red; */
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.right_desktop_menu {
  position: absolute;
  top: 30px;
  height: 50px;
  display: flex;
  gap: 5px;
  width: 35%;
  right: 50px;
  /* border: 1px solid red; */
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.left_desktop_menu a,
.right_desktop_menu a {
  color: #F0CB75;
  font-weight: 400;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 1px;
  transition: 0.3s ease-in-out;
  padding: 5px 10px;
  border: 1px solid transparent;
  text-wrap: nowrap;
}

.left_desktop_menu a.active,
.right_desktop_menu a.active {
  border: 1px solid rgb(240, 203, 117, 0.2);
  background: rgb(184, 133, 46, 0.5);
  border-radius: 50px;
}

.left_desktop_menu a:hover,
.right_desktop_menu a:hover {
  border: 1px solid rgb(240, 203, 117, 0.2);
  background: rgb(184, 133, 46, 0.5);
  border-radius: 50px;
}

.header_menu_btn {
  padding: 5px 10px;
  background-image: url("../images/Button.webp");
  background-size: 100% 100%;
  background-color: transparent;
  border: none;
  outline: none;
  color: #000 !important;
  font-weight: 600 !important;
}

.header_menu_btn:hover {
  color: #482E00 !important;
  background-image: url("../images/Button.webp") !important;
  background-size: 100% 100% !important;
  background-color: transparent !important;
}

@media (max-width: 1199px) {

  .left_desktop_menu a,
  .right_desktop_menu a {
    font-size: 10px;
  }
}

.faqPage {
  background-image: url("../images/faq_page.webp");
}

.faq_contact_wrap {
  width: 100%;
  min-height: 720px;
  background-image: url("../images/faq_contact_bg.webp");
  background-size: 100% 100%;
  position: relative;
}

.topHeading {
  color: #C7AB80;
  position: absolute;
  top: 45px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 13px;
  font-weight: 600;
  text-align: center;
}

.content_box {
  width: 75%;
  height: auto;
  min-height: 200px;
  position: absolute;
  left: 50%;
  top: 120px;
  transform: translateX(-50%);
}

.content_box input {
  width: 100%;
  height: 55px;
  background-image: url("../images/inputbg.png");
  background-size: 100% 100%;
  background-color: transparent;
  border: none;
  outline: none;
  color: #fff;
  font-weight: 600;
  padding: 0 20px;
  margin-bottom: 15px;
}

.content_box input::placeholder {
  color: #fff;
}

.content_box textarea {
  width: 100%;
  height: 120px;
  background-image: url("../images/textareabg.png");
  background-size: 100% 100%;
  background-color: transparent;
  border: none;
  outline: none;
  color: #fff;
  font-weight: 600;
  padding: 20px 20px;
  resize: none;
  margin-bottom: 10px;
}

.content_box textarea::placeholder {
  color: #fff;
}

.content_box button {
  width: 80%;
  height: 50px;
  background-image: url("../images/Button.webp");
  background-size: 100% 100%;
  background-color: transparent;
  border: none;
  outline: none;
  color: #482E00;
  font-weight: 600;
  display: block;
  margin: auto;
}


.aboutus_paper {
  width: 100%;
  min-height: 900px;
  background-image: url("../images/aboutuspaper.png");
  background-size: 100% 100%;
  margin: 60px 0;
  padding: 15% 15%;
}

.case_details_wrap {
  width: 100%;
  min-height: 600px;
  background-image: url("../images/case-detail-description.webp");
  background-size: 100% 100%;
  padding: 150px 70px;
  color: #82522C;
}

.case_details_wrap h2 {
  font-family: "Cinzel Decorative", serif;
  color: #82522C;
  font-weight: 600;
}

.paperheading {
  color: #1b1205;
  font-weight: bold;
  text-align: center;
  font-family: "Cinzel Decorative", serif;
}

.aboutusDesctipion,
.misionHeading {
  font-size: 18px;
  color: #82522C;
  margin-top: 50px;
  font-weight: 600;
}

.confidential {
  display: flex;
  margin-left: auto;
  justify-content: end;
  max-width: 250px;
}

.game-gallery {
  width: 100%;
  height: 500px;
  border: 2px solid #825E20 !important;
  border-radius: 5px;
  overflow: hidden;
}

.game-gallery .splide__track,
.game-gallery .splide__list,
.game-gallery .splide__slide {
  height: 100%;
}

.game-gallery img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.email_text {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 156px;
}

.faq_contact_details {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 80px;
  width: 75%;
}

.social_contact_icons img {
  width: 40px;
  height: 40px;
}


@media (max-width:1199px) {
  .topHeading {
    font-size: 12px;
    top: 6%;
  }
}
@media (max-width:1115px) {
  .topHeading {
    font-size: 12px;
    top: 5%;
  }
}

@media (min-width:992px) {
  .mobile_menu_wrap {
    display: none;
  }
}


@media (max-width:992px) {
  .header_heading {
    font-size: 3rem;
  }

  .most_selling_wrap {
    width: 90%;
    min-height: 200px;
    background-image: url(../images/most-selling-bg.webp);
    background-size: cover;
    padding: 20px;
    display: block;
    margin: auto;
    border-radius: 5px;
    position: relative;
    margin-top: 80px;
    padding-top: 40px;
}

.mobileMarginTop{
  margin-top: 80px;
}

  .header_menu_btn{
    position: absolute;
    top: 29px;
    right: 30px;
  }

  .MenuOpener{
    position: absolute;
    top: 28px;
    left: 30px;
    font-size: 27px;
    color: #C7AB80;
  }

  .desktopMenuWrap {
    display: none;
  }

  .box {
    width: 95%;
    height: 80%;
  }

  .challange-detail-box {
    width: 100%;
    padding: 80px;
  }

  .challange-detail-box h2 {
    font-size: 3rem;
  }


  .challanges_section_wrap {
    width: 90%;
    height: auto;
  }

  .challanges_text_md {
    background: linear-gradient(90deg, #FFD166 0%, #EEA62B 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
  }


  .challange_card_wrap {
    margin-top: 30px;
    height: auto;
    min-height: 300px;
  }

  .home_nine_section {
    width: 100%;
    height: auto;
    background-image: url("../images/section10m.png");
    background-size: cover;
    padding: 50px;
  }

  .personMainDiv {
    min-height: 200px;
  }

  .whyEnqHeading {
    font-size: 30px;
  }

  .book_wrapper {
    background-image: url("../images/faq_book_m.png");
    flex-direction: column;
  }

  .book_left_part,
  .book_right_part {
    width: 95%;
  }

  .arrow_1 {
    width: 200px;
    position: relative;
    margin-top: 20px;
    display: block;
    margin: auto;
    left: 0;
    top: 0;
  }

  .arrow_2 {
    width: 200px;
    position: relative;
    margin-top: 20px;
    display: block;
    margin: auto;
    left: 0;
    top: 0;
  }

  .worksImage {
    display: block;
    margin: auto;
    margin-top: 50px;
  }

  .lastWorksItem {
    margin-top: 0;
  }

  .tabTextCenter {
    text-align: center;
  }

  .gift_card_bg {
    margin-top: 50px;
  }

  .video_frame {
    width: 100%;
    height: 400px;
  }

  .video_frame .youtube_video_wrap {
    width: 88%;
    height: 315px;
  }

  .third_section_paper {
    width: 90%;
    padding: 60px 80px;
  }


}

@media (max-width:768px) {
  .header_heading {
    font-size: 3rem;
  }

  .game_information_box p {
    color: white;
    font-size: 8px;
    text-align: center;
}

.challange_detail_wrap{
        padding-top: 100px;
}

.selling_price {
    color: #EEA62B;
    font-size: 8px;
}

.selling_available {
    color: #EEA62B;
    font-size: 8px;
    display: flex;
    align-items: center;
}

  .form_email_challange {
    font-size: 0.9rem;
  }

  .blog_detail_top_image_box {
    height: 450px;
  }

  .challange-detail-box {
    width: 100%;
    padding: 20% 13%;
  }

  .social_icon {
    width: 30px;
    height: 30px;
    cursor: pointer;
  }

  .form_top_heading {
    font-size: 1rem;
  }


  .box {
    width: 90%;
    height: 80%;
  }

  .challange-detail-box h2 {
    color: #82522C;
    font-size: 2.5rem;
    font-weight: 600;
    font-family: "Cinzel Decorative", serif;
  }

  .challange-detail-box h1 {
    color: #82522C;
    font-family: "Cinzel Decorative", serif;
  }


  .case_details_wrap {
    padding: 150px 40px;
  }

  .mainListWrap {
    margin-top: 200px !important;
  }


  .case_person {
    top: 8%;
  }

  .social_contact_icons img {
    width: 30px;
    height: 30px;
  }

  .topHeading {
    font-size: 3vw;
    top: 6%;
  }

  .game-detail-video {
    height: 300px;
    margin-top: 50px;
  }

  .aboutus_paper {
    padding: 30% 15%;
  }


  .game_list_card_warp img {
    margin-bottom: 20px;
  }

  .book_wrapper {
    width: 95%;
    padding: 50px 20px;
  }

  .reviews_box {
    width: 100%;
    min-height: 400px;
    padding-top: 110px;
  }

  .video_frame {
    width: 100%;
    height: 300px;
  }

  .video_frame .youtube_video_wrap {
    width: 88%;
    height: 235px;
  }

  .third_section_paper h1 {
    font-weight: 600;
    color: #82522C;
    margin: 50px 0;
    margin-bottom: 30px;
  }

  .third_section_paper img {
    max-width: 150px;
    max-height: 150px;
  }

  .third_section_paper {
    width: 95%;
    padding: 60px 40px;
    overflow: hidden;
  }

}


@media (min-width: 992px) and (max-width:1200px) {
    .container, .container-lg, .container-md, .container-sm {
        max-width: 95%;
    }
}