@font-face {
  font-family: "Montserrat";
  src: url("../Fonts/Montserrat-VariableFont_wght.ttf"); }
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

html {
  scroll-behavior: smooth; }

ul {
  list-style: none; }

a {
  text-decoration: none; }

main {
  min-height: 100vh;
  overflow-x: hidden; }

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

.card {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  height: 70px;
  padding: 25px;
  border-radius: 5px;
  background: #ffffff; }

@keyframes title-apear {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
@keyframes top-bottom {
  from {
    transform: translate(0, -20px); }
  to {
    transform: translate(0, 0); } }
.container {
  width: 100%;
  margin: 0 auto;
  padding: 20px; }

.row {
  display: flex;
  flex-flow: row wrap; }

@media only screen and (min-width: 0) {
  .col-xs-1 {
    flex-grow: 0;
    width: 8.3333333333%; }

  .col-xs-offset-1 {
    margin-left: 8.3333333333%; }

  .grid-col-1-xs {
    grid-column: span 1; }

  .col-xs-2 {
    flex-grow: 0;
    width: 16.6666666667%; }

  .col-xs-offset-2 {
    margin-left: 16.6666666667%; }

  .grid-col-2-xs {
    grid-column: span 2; }

  .col-xs-3 {
    flex-grow: 0;
    width: 25%; }

  .col-xs-offset-3 {
    margin-left: 25%; }

  .grid-col-3-xs {
    grid-column: span 3; }

  .col-xs-4 {
    flex-grow: 0;
    width: 33.3333333333%; }

  .col-xs-offset-4 {
    margin-left: 33.3333333333%; }

  .grid-col-4-xs {
    grid-column: span 4; }

  .col-xs-5 {
    flex-grow: 0;
    width: 41.6666666667%; }

  .col-xs-offset-5 {
    margin-left: 41.6666666667%; }

  .grid-col-5-xs {
    grid-column: span 5; }

  .col-xs-6 {
    flex-grow: 0;
    width: 50%; }

  .col-xs-offset-6 {
    margin-left: 50%; }

  .grid-col-6-xs {
    grid-column: span 6; }

  .col-xs-7 {
    flex-grow: 0;
    width: 58.3333333333%; }

  .col-xs-offset-7 {
    margin-left: 58.3333333333%; }

  .grid-col-7-xs {
    grid-column: span 7; }

  .col-xs-8 {
    flex-grow: 0;
    width: 66.6666666667%; }

  .col-xs-offset-8 {
    margin-left: 66.6666666667%; }

  .grid-col-8-xs {
    grid-column: span 8; }

  .col-xs-9 {
    flex-grow: 0;
    width: 75%; }

  .col-xs-offset-9 {
    margin-left: 75%; }

  .grid-col-9-xs {
    grid-column: span 9; }

  .col-xs-10 {
    flex-grow: 0;
    width: 83.3333333333%; }

  .col-xs-offset-10 {
    margin-left: 83.3333333333%; }

  .grid-col-10-xs {
    grid-column: span 10; }

  .col-xs-11 {
    flex-grow: 0;
    width: 91.6666666667%; }

  .col-xs-offset-11 {
    margin-left: 91.6666666667%; }

  .grid-col-11-xs {
    grid-column: span 11; }

  .col-xs-12 {
    flex-grow: 0;
    width: 100%; }

  .col-xs-offset-12 {
    margin-left: 100%; }

  .grid-col-12-xs {
    grid-column: span 12; } }
@media only screen and (min-width: 480px) {
  .col-sm-1 {
    flex-grow: 0;
    width: 8.3333333333%; }

  .col-sm-offset-1 {
    margin-left: 8.3333333333%; }

  .grid-col-1-sm {
    grid-template-columns: repeat(1, 1fr); }

  .col-sm-2 {
    flex-grow: 0;
    width: 16.6666666667%; }

  .col-sm-offset-2 {
    margin-left: 16.6666666667%; }

  .grid-col-2-sm {
    grid-template-columns: repeat(2, 1fr); }

  .col-sm-3 {
    flex-grow: 0;
    width: 25%; }

  .col-sm-offset-3 {
    margin-left: 25%; }

  .grid-col-3-sm {
    grid-template-columns: repeat(3, 1fr); }

  .col-sm-4 {
    flex-grow: 0;
    width: 33.3333333333%; }

  .col-sm-offset-4 {
    margin-left: 33.3333333333%; }

  .grid-col-4-sm {
    grid-template-columns: repeat(4, 1fr); }

  .col-sm-5 {
    flex-grow: 0;
    width: 41.6666666667%; }

  .col-sm-offset-5 {
    margin-left: 41.6666666667%; }

  .grid-col-5-sm {
    grid-template-columns: repeat(5, 1fr); }

  .col-sm-6 {
    flex-grow: 0;
    width: 50%; }

  .col-sm-offset-6 {
    margin-left: 50%; }

  .grid-col-6-sm {
    grid-template-columns: repeat(6, 1fr); }

  .col-sm-7 {
    flex-grow: 0;
    width: 58.3333333333%; }

  .col-sm-offset-7 {
    margin-left: 58.3333333333%; }

  .grid-col-7-sm {
    grid-template-columns: repeat(7, 1fr); }

  .col-sm-8 {
    flex-grow: 0;
    width: 66.6666666667%; }

  .col-sm-offset-8 {
    margin-left: 66.6666666667%; }

  .grid-col-8-sm {
    grid-template-columns: repeat(8, 1fr); }

  .col-sm-9 {
    flex-grow: 0;
    width: 75%; }

  .col-sm-offset-9 {
    margin-left: 75%; }

  .grid-col-9-sm {
    grid-template-columns: repeat(9, 1fr); }

  .col-sm-10 {
    flex-grow: 0;
    width: 83.3333333333%; }

  .col-sm-offset-10 {
    margin-left: 83.3333333333%; }

  .grid-col-10-sm {
    grid-template-columns: repeat(10, 1fr); }

  .col-sm-11 {
    flex-grow: 0;
    width: 91.6666666667%; }

  .col-sm-offset-11 {
    margin-left: 91.6666666667%; }

  .grid-col-11-sm {
    grid-template-columns: repeat(11, 1fr); }

  .col-sm-12 {
    flex-grow: 0;
    width: 100%; }

  .col-sm-offset-12 {
    margin-left: 100%; }

  .grid-col-12-sm {
    grid-template-columns: repeat(12, 1fr); } }
@media only screen and (min-width: 720px) {
  .col-md-1 {
    flex-grow: 0;
    width: 8.3333333333%; }

  .col-md-offset-1 {
    margin-left: 8.3333333333%; }

  .grid-col-1-md {
    grid-template-columns: repeat(1, 1fr); }

  .col-md-2 {
    flex-grow: 0;
    width: 16.6666666667%; }

  .col-md-offset-2 {
    margin-left: 16.6666666667%; }

  .grid-col-2-md {
    grid-template-columns: repeat(2, 1fr); }

  .col-md-3 {
    flex-grow: 0;
    width: 25%; }

  .col-md-offset-3 {
    margin-left: 25%; }

  .grid-col-3-md {
    grid-template-columns: repeat(3, 1fr); }

  .col-md-4 {
    flex-grow: 0;
    width: 33.3333333333%; }

  .col-md-offset-4 {
    margin-left: 33.3333333333%; }

  .grid-col-4-md {
    grid-template-columns: repeat(4, 1fr); }

  .col-md-5 {
    flex-grow: 0;
    width: 41.6666666667%; }

  .col-md-offset-5 {
    margin-left: 41.6666666667%; }

  .grid-col-5-md {
    grid-template-columns: repeat(5, 1fr); }

  .col-md-6 {
    flex-grow: 0;
    width: 50%; }

  .col-md-offset-6 {
    margin-left: 50%; }

  .grid-col-6-md {
    grid-template-columns: repeat(6, 1fr); }

  .col-md-7 {
    flex-grow: 0;
    width: 58.3333333333%; }

  .col-md-offset-7 {
    margin-left: 58.3333333333%; }

  .grid-col-7-md {
    grid-template-columns: repeat(7, 1fr); }

  .col-md-8 {
    flex-grow: 0;
    width: 66.6666666667%; }

  .col-md-offset-8 {
    margin-left: 66.6666666667%; }

  .grid-col-8-md {
    grid-template-columns: repeat(8, 1fr); }

  .col-md-9 {
    flex-grow: 0;
    width: 75%; }

  .col-md-offset-9 {
    margin-left: 75%; }

  .grid-col-9-md {
    grid-template-columns: repeat(9, 1fr); }

  .col-md-10 {
    flex-grow: 0;
    width: 83.3333333333%; }

  .col-md-offset-10 {
    margin-left: 83.3333333333%; }

  .grid-col-10-md {
    grid-template-columns: repeat(10, 1fr); }

  .col-md-11 {
    flex-grow: 0;
    width: 91.6666666667%; }

  .col-md-offset-11 {
    margin-left: 91.6666666667%; }

  .grid-col-11-md {
    grid-template-columns: repeat(11, 1fr); }

  .col-md-12 {
    flex-grow: 0;
    width: 100%; }

  .col-md-offset-12 {
    margin-left: 100%; }

  .grid-col-12-md {
    grid-template-columns: repeat(12, 1fr); } }
@media only screen and (min-width: 960px) {
  .col-lg-1 {
    flex-grow: 0;
    width: 8.3333333333%; }

  .col-lg-offset-1 {
    margin-left: 8.3333333333%; }

  .grid-col-1-lg {
    grid-template-columns: repeat(1, 1fr); }

  .col-lg-2 {
    flex-grow: 0;
    width: 16.6666666667%; }

  .col-lg-offset-2 {
    margin-left: 16.6666666667%; }

  .grid-col-2-lg {
    grid-template-columns: repeat(2, 1fr); }

  .col-lg-3 {
    flex-grow: 0;
    width: 25%; }

  .col-lg-offset-3 {
    margin-left: 25%; }

  .grid-col-3-lg {
    grid-template-columns: repeat(3, 1fr); }

  .col-lg-4 {
    flex-grow: 0;
    width: 33.3333333333%; }

  .col-lg-offset-4 {
    margin-left: 33.3333333333%; }

  .grid-col-4-lg {
    grid-template-columns: repeat(4, 1fr); }

  .col-lg-5 {
    flex-grow: 0;
    width: 41.6666666667%; }

  .col-lg-offset-5 {
    margin-left: 41.6666666667%; }

  .grid-col-5-lg {
    grid-template-columns: repeat(5, 1fr); }

  .col-lg-6 {
    flex-grow: 0;
    width: 50%; }

  .col-lg-offset-6 {
    margin-left: 50%; }

  .grid-col-6-lg {
    grid-template-columns: repeat(6, 1fr); }

  .col-lg-7 {
    flex-grow: 0;
    width: 58.3333333333%; }

  .col-lg-offset-7 {
    margin-left: 58.3333333333%; }

  .grid-col-7-lg {
    grid-template-columns: repeat(7, 1fr); }

  .col-lg-8 {
    flex-grow: 0;
    width: 66.6666666667%; }

  .col-lg-offset-8 {
    margin-left: 66.6666666667%; }

  .grid-col-8-lg {
    grid-template-columns: repeat(8, 1fr); }

  .col-lg-9 {
    flex-grow: 0;
    width: 75%; }

  .col-lg-offset-9 {
    margin-left: 75%; }

  .grid-col-9-lg {
    grid-template-columns: repeat(9, 1fr); }

  .col-lg-10 {
    flex-grow: 0;
    width: 83.3333333333%; }

  .col-lg-offset-10 {
    margin-left: 83.3333333333%; }

  .grid-col-10-lg {
    grid-template-columns: repeat(10, 1fr); }

  .col-lg-11 {
    flex-grow: 0;
    width: 91.6666666667%; }

  .col-lg-offset-11 {
    margin-left: 91.6666666667%; }

  .grid-col-11-lg {
    grid-template-columns: repeat(11, 1fr); }

  .col-lg-12 {
    flex-grow: 0;
    width: 100%; }

  .col-lg-offset-12 {
    margin-left: 100%; }

  .grid-col-12-lg {
    grid-template-columns: repeat(12, 1fr); } }
@media only screen and (min-width: 1200px) {
  .col-xl-1 {
    flex-grow: 0;
    width: 8.3333333333%; }

  .col-xl-offset-1 {
    margin-left: 8.3333333333%; }

  .grid-col-1-xl {
    grid-template-columns: repeat(1, 1fr); }

  .col-xl-2 {
    flex-grow: 0;
    width: 16.6666666667%; }

  .col-xl-offset-2 {
    margin-left: 16.6666666667%; }

  .grid-col-2-xl {
    grid-template-columns: repeat(2, 1fr); }

  .col-xl-3 {
    flex-grow: 0;
    width: 25%; }

  .col-xl-offset-3 {
    margin-left: 25%; }

  .grid-col-3-xl {
    grid-template-columns: repeat(3, 1fr); }

  .col-xl-4 {
    flex-grow: 0;
    width: 33.3333333333%; }

  .col-xl-offset-4 {
    margin-left: 33.3333333333%; }

  .grid-col-4-xl {
    grid-template-columns: repeat(4, 1fr); }

  .col-xl-5 {
    flex-grow: 0;
    width: 41.6666666667%; }

  .col-xl-offset-5 {
    margin-left: 41.6666666667%; }

  .grid-col-5-xl {
    grid-template-columns: repeat(5, 1fr); }

  .col-xl-6 {
    flex-grow: 0;
    width: 50%; }

  .col-xl-offset-6 {
    margin-left: 50%; }

  .grid-col-6-xl {
    grid-template-columns: repeat(6, 1fr); }

  .col-xl-7 {
    flex-grow: 0;
    width: 58.3333333333%; }

  .col-xl-offset-7 {
    margin-left: 58.3333333333%; }

  .grid-col-7-xl {
    grid-template-columns: repeat(7, 1fr); }

  .col-xl-8 {
    flex-grow: 0;
    width: 66.6666666667%; }

  .col-xl-offset-8 {
    margin-left: 66.6666666667%; }

  .grid-col-8-xl {
    grid-template-columns: repeat(8, 1fr); }

  .col-xl-9 {
    flex-grow: 0;
    width: 75%; }

  .col-xl-offset-9 {
    margin-left: 75%; }

  .grid-col-9-xl {
    grid-template-columns: repeat(9, 1fr); }

  .col-xl-10 {
    flex-grow: 0;
    width: 83.3333333333%; }

  .col-xl-offset-10 {
    margin-left: 83.3333333333%; }

  .grid-col-10-xl {
    grid-template-columns: repeat(10, 1fr); }

  .col-xl-11 {
    flex-grow: 0;
    width: 91.6666666667%; }

  .col-xl-offset-11 {
    margin-left: 91.6666666667%; }

  .grid-col-11-xl {
    grid-template-columns: repeat(11, 1fr); }

  .col-xl-12 {
    flex-grow: 0;
    width: 100%; }

  .col-xl-offset-12 {
    margin-left: 100%; }

  .grid-col-12-xl {
    grid-template-columns: repeat(12, 1fr); } }
main > header {
  font-size: 16px; }
  main > header > nav {
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.6);
    border: 1px solid rgba(0, 0, 0, 0);
    width: 100%;
    height: auto;
    padding: 0.5rem 1rem;
    z-index: 90; }
    main > header > nav > article {
      width: 100%;
      padding: 0 15px;
      margin: 0 auto;
      display: flex;
      justify-content: space-between;
      align-items: center; }
      main > header > nav > article > a {
        color: #fff;
        font-family: Montserrat, sans-serif;
        font-size: 1.6rem;
        font-weight: bold;
        letter-spacing: 5px;
        margin: 0 20px;
        text-decoration: none;
        transition-duration: 0.5s;
        cursor: pointer; }
        main > header > nav > article > a > span {
          color: #b4eb4a; }
      main > header > nav > article > button {
        display: none; }
      main > header > nav > article > div {
        display: flex;
        align-items: center; }
        main > header > nav > article > div > ul {
          display: flex;
          flex-direction: row; }
          main > header > nav > article > div > ul > li > a {
            color: #FFF;
            padding: 0.5rem 0.5rem; }
            main > header > nav > article > div > ul > li > a:hover {
              color: #b4eb4a; }
          main > header > nav > article > div > ul > li#maps,
          main > header > nav > article > div > ul > li#extras {
            position: relative;
            padding: 0 10px;
            cursor: pointer; }
            main > header > nav > article > div > ul > li#maps > a::after,
            main > header > nav > article > div > ul > li#extras > a::after {
              content: "";
              position: absolute;
              right: 4px;
              top: 8px;
              border-top: 0.3em solid;
              border-right: 0.3em solid transparent;
              border-bottom: 0;
              border-left: 0.3em solid transparent; }
            main > header > nav > article > div > ul > li#maps > ul,
            main > header > nav > article > div > ul > li#extras > ul {
              display: none;
              background-color: rgba(0, 0, 0, 0.6);
              position: absolute;
              margin: 18px 0 0 -70px;
              border: none;
              border-radius: 10px; }
              main > header > nav > article > div > ul > li#maps > ul > li,
              main > header > nav > article > div > ul > li#extras > ul > li {
                margin: 10px 0; }
                main > header > nav > article > div > ul > li#maps > ul > li:not(:last-child)::after,
                main > header > nav > article > div > ul > li#extras > ul > li:not(:last-child)::after {
                  content: '';
                  position: absolute;
                  width: 100%;
                  height: 1px;
                  margin: 0.25rem auto 0.25rem auto;
                  border: none;
                  background-color: #b5bcc4;
                  opacity: 0.2; }
                main > header > nav > article > div > ul > li#maps > ul > li > a,
                main > header > nav > article > div > ul > li#extras > ul > li > a {
                  display: flex;
                  justify-content: center;
                  color: #fff;
                  width: 100%;
                  padding: 0.25rem 1.5rem; }
                  main > header > nav > article > div > ul > li#maps > ul > li > a:hover,
                  main > header > nav > article > div > ul > li#extras > ul > li > a:hover {
                    color: #b4eb4a; }
              main > header > nav > article > div > ul > li#maps > ul > div,
              main > header > nav > article > div > ul > li#extras > ul > div {
                width: 100%;
                height: 1px;
                margin: 0.25rem auto 0.25rem auto;
                border: none;
                background-color: #b5bcc4;
                opacity: 0.2; }
          main > header > nav > article > div > ul > li#extras > ul {
            min-width: 12rem;
            margin-left: -90px; }
main > section#landing > div {
  position: relative;
  display: flex; }
  main > section#landing > div > video {
    position: absolute;
    transform: rotate(90deg);
    transform-origin: bottom left;
    width: 100vh;
    height: 100vw;
    margin-top: -100vw;
    object-fit: cover;
    z-index: 4;
    visibility: visible; }
  main > section#landing > div > div#overlay {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3); }
  main > section#landing > div > div#content {
    position: absolute;
    top: 70%;
    left: 30%;
    right: 30%;
    z-index: 5;
    display: flex;
    justify-content: space-around;
    align-items: center; }
    main > section#landing > div > div#content > a {
      cursor: pointer; }
    main > section#landing > div > div#content > a:first-child > img {
      height: 30vh; }
    main > section#landing > div > div#content > a:last-child > img {
      height: 10vh; }
main > section#about,
main > section#treausre-hunt,
main > section#coin-drop,
main > section#claw-machine,
main > section#slot-machine,
main > section#wheel-fortune,
main > section#lucky-scratch {
  position: relative;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  height: 100vh;
  padding: 25vh 0;
  display: flex;
  align-items: center; }
  main > section#about > article,
  main > section#treausre-hunt > article,
  main > section#coin-drop > article,
  main > section#claw-machine > article,
  main > section#slot-machine > article,
  main > section#wheel-fortune > article,
  main > section#lucky-scratch > article {
    width: 100%;
    padding: 0 1rem;
    margin: 0 auto;
    color: #FFF; }
    main > section#about > article > img,
    main > section#treausre-hunt > article > img,
    main > section#coin-drop > article > img,
    main > section#claw-machine > article > img,
    main > section#slot-machine > article > img,
    main > section#wheel-fortune > article > img,
    main > section#lucky-scratch > article > img {
      position: absolute;
      top: 15%;
      right: 50%;
      height: 20vh; }
    main > section#about > article > h1,
    main > section#treausre-hunt > article > h1,
    main > section#coin-drop > article > h1,
    main > section#claw-machine > article > h1,
    main > section#slot-machine > article > h1,
    main > section#wheel-fortune > article > h1,
    main > section#lucky-scratch > article > h1 {
      padding: 0 15px;
      margin: 0 20px;
      font-size: 2.5rem;
      font-weight: 600; }
      main > section#about > article > h1::after,
      main > section#treausre-hunt > article > h1::after,
      main > section#coin-drop > article > h1::after,
      main > section#claw-machine > article > h1::after,
      main > section#slot-machine > article > h1::after,
      main > section#wheel-fortune > article > h1::after,
      main > section#lucky-scratch > article > h1::after {
        border-top: 2px solid;
        border-color: #b4eb4a;
        content: "";
        display: block;
        height: 1px;
        width: 10%;
        margin: 13px 0 10px 0; }
    main > section#about > article > p,
    main > section#treausre-hunt > article > p,
    main > section#coin-drop > article > p,
    main > section#claw-machine > article > p,
    main > section#slot-machine > article > p,
    main > section#wheel-fortune > article > p,
    main > section#lucky-scratch > article > p {
      margin: 0 20px;
      font-family: Montserrat, sans-serif;
      font-size: 0.9375rem;
      font-weight: bold;
      padding: 5px 15px; }
  main > section#about > img,
  main > section#treausre-hunt > img,
  main > section#coin-drop > img,
  main > section#claw-machine > img,
  main > section#slot-machine > img,
  main > section#wheel-fortune > img,
  main > section#lucky-scratch > img {
    max-width: 20%;
    height: auto;
    padding-left: 30px; }
main > section#about {
  background-image: linear-gradient(rgba(0, 0, 0, 0.1), black), url(../Img/Carrom/bg1-about.png);
  background-attachment: scroll;
  padding: 50vh 0 10vh 0;
  height: 100vh; }
  main > section#about > div#content {
    position: absolute;
    top: 35%;
    left: 30%;
    right: 30%;
    z-index: 5;
    display: flex;
    justify-content: space-around;
    align-items: center; }
    main > section#about > div#content > a {
      cursor: pointer; }
    main > section#about > div#content > a:first-child > img {
      height: 30vh; }
    main > section#about > div#content > a:last-child > img {
      height: 10vh; }
main > section#lucky-scratch {
  background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(../Img/Carrom/background/Carrom.png); }