.gifbg{
  position:absolute;
  width:100%;
  top:0;
  bottom:0;
  left:0;
  right:0;
  z-index:1;
  height:100%;
  object-fit: cover;
}
.overlay{
  background-image: radial-gradient(circle farthest-corner at 50% 50%, transparent, rgba(0, 0, 0, 0.35));
  position:absolute;
  width:100%;
  top:0;
  bottom:0;
  left:0;
  right:0;
  z-index:2;
  height:100%;
}
.w-layout-grid {
  display: -ms-grid;
  display: grid;
  grid-auto-columns: 1fr;
  -ms-grid-columns: 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  grid-row-gap: 16px;
  grid-column-gap: 16px;
}

.other-games {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 16px;
  margin-top: 0;
  margin-bottom: 0;
  width: 100%;
}

.header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  height: 10vh;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.mainbody {
  height: auto;
  padding-bottom: 0;
  margin-bottom: 0;
}

.maingrid {
  margin-bottom: 0;
}

.grid {
  width: 100%;
  height: 100vh;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-areas: "game1 game1 game1 game1 game2 game2 game2" "game1 game1 game1 game1 game2 game2 game2" "game3 game3 game3 game3 game3 game4 game4" "game3 game3 game3 game3 game3 game4 game4" "game5 game5 game5 game5 links links links" "game5 game5 game5 game5 links links links";
  -ms-grid-columns: 1fr 0px 1fr 0px 1fr 0px 1fr 0px 1fr 0px 1fr 0px 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  -ms-grid-rows: auto 0px auto 0px auto 0px auto 0px auto 0px auto;
  grid-template-rows: auto auto auto auto auto auto;
}

.game1 {
  background-color: #9917df;
}

.game2 {
  background-color: #bf15e1;
}

.game3 {
  background-color: #1f28d0;
}

.game4 {
  background-color: #d71d20;
}

.game5 {
  background-color: #cd3018;
}

.body {
  overflow: visible;
  height: auto;
  background-color: #1e1d1d;
}

.links {
  background-color: #d81b99;
}

.maingrid {
  height: auto;
  grid-auto-columns: 1fr;
  grid-auto-rows: 430px;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-areas: "main-game second-game" "main-game third-game";
  -ms-grid-columns: 1fr 0px 1fr;
  grid-template-columns: 1fr 1fr;
  -ms-grid-rows: 430px 0px 430px;
  grid-template-rows: 430px 430px;
}

.other-games {
  grid-auto-rows: 430px;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  -ms-grid-rows: 430px 430px;
  grid-template-rows: 430px 430px;
}

.image {
  width: 300px;
  max-width: none;
}

.main-game {
  position: relative;
  background-image: radial-gradient(circle farthest-corner at 50% 50%, transparent, rgba(0, 0, 0, 0.35));
}

.second-game {
  position: relative;
  background-image: radial-gradient(circle farthest-corner at 50% 50%, transparent, rgba(0, 0, 0, 0.35)), url('../images/game-bg1.png');
  background-position: 0px 0px, 50% 50%;
  background-size: auto, cover;
}

.third-game {
  position: relative;
  background-image: radial-gradient(circle farthest-corner at 50% 50%, transparent, rgba(0, 0, 0, 0.35)), url('../images/game-bg2.png');
  background-position: 0px 0px, 50% 50%;
  background-size: auto, cover;
}

.game-block {
  position: relative;
  background-image: radial-gradient(circle farthest-corner at 50% 50%, transparent, rgba(0, 0, 0, 0.35)), url('../images/game-bg7.png');
  background-position: 0px 0px, 50% 50%;
  background-size: auto, cover;
  min-height: 450px;
  flex: 1;
}

.second-game {
  position: relative;
  background-color: #3b82f6;
  background-image: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%);
  background-position: 0px 0px;
  background-size: auto;
}

.game-block.game1 {
  position: relative;
  background-color: transparent;
  background-image: radial-gradient(circle farthest-corner at 50% 50%, transparent, rgba(0, 0, 0, 0.35)), url('../images/game-bg3.png');
  background-position: 0px 0px, 50% 50%;
  background-size: auto, cover;
}

.game-block.game3 {
  background-color: transparent;
  background-image: radial-gradient(circle farthest-corner at 50% 50%, transparent, rgba(0, 0, 0, 0.35)), url('../images/game-bg4.png');
  background-position: 0px 0px, 50% 50%;
  background-size: auto, cover;
}

.third-game {
  background-color: #1e293b;
  background-image: linear-gradient(135deg, #1e293b 0%, #1e293b 100%);
  background-position: 0px 0px;
  background-size: auto;
}

.third-game .game-subtitle {
  color: #ffd700;
}

.third-game .game-title {
  background: linear-gradient(90deg, #ffffff 0%, #ffffff 50%, #ffd700 50%, #ffd700 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.third-game .game-block-bg:first-of-type {
  top: 15%;
  right: 8%;
  width: 180px;
  z-index: 1;
}

.third-game .game-block-bg:last-of-type {
  left: 50%;
  top: 60%;
  transform: translate(-50%, -50%);
  width: 45%;
  height: 50%;
  object-fit: contain;
  object-position: center;
  z-index: 0;
  opacity: 1;
  pointer-events: none;
}

.game-block.game5 {
  background-color: #1a1f2e;
  background-image: linear-gradient(135deg, #1a1f2e 0%, #1a1f2e 100%);
  background-position: 0px 0px;
  background-size: auto;
}

.game-block.game5 .game-subtitle {
  color: #57d054;
}

.game-block.game5 .game-block-bg:first-of-type {
  top: 15%;
  right: 8%;
  width: 180px;
  z-index: 1;
}

.game-block.game5 .game-block-bg:last-of-type {
  left: 50%;
  top: 65%;
  transform: translate(-50%, -50%);
  width: 60%;
  height: 65%;
  object-fit: contain;
  object-position: center;
  z-index: 0;
  opacity: 1;
  pointer-events: none;
}

.game-block.game6 {
  position: relative;
  background-color: transparent;
  background-image: radial-gradient(circle farthest-corner at 50% 50%, transparent, rgba(0, 0, 0, 0.35)), url('../images/game-bg5.png');
  background-position: 0px 0px, 50% 50%;
  background-size: auto, cover;
}

.footer {
  padding-top: 20px;
  padding-bottom: 40px;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  text-align: center;
  margin-top: 0;
}

.footer-flex-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 20px;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  color: #fff;
  text-align: left;
}

.footer-logo-link {
  max-height: 60px;
  min-width: 60px;
  -webkit-box-flex: 0;
  -webkit-flex: 0 auto;
  -ms-flex: 0 auto;
  flex: 0 auto;
}

.footer-image {
  width: 200px;
  height: auto;
  max-width: none;
  -o-object-fit: contain;
  object-fit: contain;
  -o-object-position: 0% 50%;
  object-position: 0% 50%;
}

.footer-heading {
  margin-top: 0px;
  margin-bottom: 20px;
  font-size: 14px;
  line-height: 1.5;
}

.footer-link {
  display: block;
  margin-bottom: 10px;
  color: #00c3ff;
  text-decoration: none;
}

.footer-link:hover {
  text-decoration: underline;
}

.text-block {
  color: hsla(0, 0%, 100%, 0.35);
}

.privacy-content {
  max-width: 800px;
  margin: 0 auto;
  padding: 40px 20px;
  color: #fff;
}

.privacy-title {
  font-size: 48px;
  font-weight: bold;
  color: #fff;
  margin-bottom: 30px;
  text-align: center;
}

.privacy-text {
  line-height: 1.6;
  font-size: 16px;
}

.privacy-text h2 {
  color: #fff;
  font-size: 24px;
  margin-top: 30px;
  margin-bottom: 15px;
}

.privacy-text p {
  margin-bottom: 15px;
  color: #ccc;
}

.privacy-text a {
  color: #00c3ff;
  text-decoration: none;
}

.privacy-text a:hover {
  text-decoration: underline;
}

.game-block-content {
  padding: 45px;
}

.game-title {
  margin-top: 0px;
  margin-bottom: 10px;
  background-color: transparent;
  color: #fff;
  text-transform: uppercase;
}

.game-subtitle {
  margin-top: 0px;
  margin-bottom: 10px;
  color: rgba(30, 29, 29, 0.8);
  font-size: 18px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.button {
  display: block;
  width: 190px;
  margin-bottom: 10px;
  padding: 9px;
  border-radius: 8px;
  background-color: #1e1d1d;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.5);
  color: #fff;
  font-weight: 400;
  text-decoration: none;
}

.button.btn-website {
  padding: 11px;
  background-color: #fff;
  color: #000;
}

.game-block-bg {
  position: absolute;
  left: auto;
  top: auto;
  right: 5%;
  bottom: 5%;
  width: 200px;
  height: auto;
  max-width: none;
}

.text-block-2 {
  font-size: 12px;
  text-align: left;
  white-space: nowrap;
}

.columns {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.text-block-3 {
  font-size: 19px;
  text-align: left;
}

.image-2 {
  width: 100%;
  height: auto;
  max-width: none;
}

.text-block-4 {
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  text-transform: capitalize;
}

@media screen and (min-width: 1440px) {
  .other-games {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
}

@media screen and (min-width: 1920px) {
  .body {
    overflow: visible;
  }
  .other-games {
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
  }
  .main-game {
    background-image: radial-gradient(circle farthest-corner at 50% 50%, transparent, rgba(0, 0, 0, 0.35));
    background-position: 0px 0px, 0px 0px;
    background-size: auto, cover;
  }
}

@media screen and (max-width: 991px) {
  .grid {
    grid-template-areas: "game1 game2" "game1 game2" "game3 game4" "game3 game4" "game5 links" "game5 links";
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .other-games {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .footer {
    padding-right: 20px;
    padding-left: 20px;
  }
  .game-block-content {
    position: relative;
    z-index: 1;
  }
  .column {
    padding-right: 10px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
  }
}

@media screen and (max-width: 767px) {
  .grid {
    grid-template-areas: "game1 game2" "game1 game2" "game3 game4" "game3 game4" "game5 links" "game5 links";
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .maingrid {
    grid-template-areas: "main-game" "main-game" "second-game" "third-game";
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: 430px 430px 430px 430px;
    grid-template-rows: 430px 430px 430px 430px;
  }
  .other-games {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .footer {
    padding: 40px 20px;
  }
  .footer-image {
    -o-object-fit: contain;
    object-fit: contain;
  }
  .image-2 {
    width: 25px;
  }
  .column {
    padding-right: 10px;
    padding-left: 10px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
  .column-2 {
    padding-right: 10px;
    padding-left: 10px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
  }
  .column-3 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
  .column-4 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
  .column-5 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
  .column-6 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
  .column-7 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
  .column-8 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
  .column-9 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
  .column-10 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
  .column-11 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
  .column-12 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
  .column-13 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
}

@media screen and (max-width: 479px) {
  .grid {
    grid-template-areas: "game1 game2" "game1 game2" "game3 game4" "game3 game4" "game5 links" "game5 links";
  }
  .maingrid {
    grid-template-areas: "main-game" "main-game" "second-game" "third-game";
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: 430px 430px 430px 430px;
    grid-template-rows: 430px 430px 430px 430px;
  }
  .footer {
    padding-right: 20px;
    padding-left: 20px;
    text-align: left;
  }
  .footer-flex-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .footer-logo-link {
    height: 60px;
  }
  .footer-heading {
    margin-top: 20px;
  }
  .game-block-content {
    position: relative;
    z-index: 1;
  }
  .button {
    width: 210px;
  }
  .game-block-bg {
    z-index: 0;
  }
  .text-block-3 {
    font-size: 18px;
  }
  .image-2 {
    width: 25px;
  }
  .column-3 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
  .column-14 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
  }
}

#w-node-a561f23ec888-dd78ad2e {
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  -ms-grid-column: 1;
  grid-area: main-game;
}

#w-node-5f3893b4f572-dd78ad2e {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
  grid-area: second-game;
}

#w-node-757a9cd4a277-dd78ad2e {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
  grid-area: third-game;
}

@media screen and (max-width: 767px) {
  #w-node-a561f23ec888-dd78ad2e {
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
    -ms-grid-column: 1;
  }
  #w-node-5f3893b4f572-dd78ad2e {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  #w-node-757a9cd4a277-dd78ad2e {
    -ms-grid-row: 4;
    -ms-grid-column: 1;
  }
}

@media screen and (max-width: 479px) {
  #w-node-a561f23ec888-dd78ad2e {
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
    -ms-grid-column: 1;
  }
  #w-node-5f3893b4f572-dd78ad2e {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  #w-node-757a9cd4a277-dd78ad2e {
    -ms-grid-row: 4;
    -ms-grid-column: 1;
  }
}
