@font-face {
  font-family: 'OCR';
  src: url("../../assets/font/asm/OCR.woff2") format('woff2'), url("../../assets/font/asm/OCR.woff") format('woff');
  font-weight: normal;
  font-style: normal;
}
/* CUT THE FILE HERE */
html,
body {
  margin: 0;
  padding: 0;
  height: 100dvh;
  background-color: #99d0f3;
}
html.scroll-locked {
  overflow: hidden !important;
  height: 100% !important;
}
body.scroll-locked {
  overflow: hidden !important;
  height: 100% !important;
  position: fixed !important;
  width: 100% !important;
  touch-action: none !important;
}
.App {
  cursor: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyMiAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE1NF8xNDgpIj4KPHBhdGggZD0iTTIgMkg0TDIyIDIwSDEwTDIgMjhWMloiIGZpbGw9IiNGQ0VGM0EiLz4KPHBhdGggZD0iTTQgMkgyVjI2SDRWMjhIMFYwSDRWMlpNNiAyNkg0VjI0SDZWMjZaTTggMjRINlYyMkg4VjI0Wk0yMiAyMkg4VjIwSDIwVjE4SDIyVjIyWk0yMCAxOEgxOFYxNkgyMFYxOFpNMTggMTZIMTZWMTRIMThWMTZaTTE2IDE0SDE0VjEySDE2VjE0Wk0xNCAxMkgxMlYxMEgxNFYxMlpNMTIgMTBIMTBWOEgxMlYxMFpNMTAgOEg4VjZIMTBWOFpNOCA2SDZWNEg4VjZaTTYgNEg0VjJINlY0WiIgZmlsbD0iIzI0MUIxQiIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzE1NF8xNDgiPgo8cmVjdCB3aWR0aD0iMjIiIGhlaWdodD0iMjgiIGZpbGw9IndoaXRlIi8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg=="), auto;
  font-family: 'OCR';
  position: relative;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0;
  margin: 0;
  touch-highlight: none;
  font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: 100%;
  max-width: 100vw;
  background-color: transparent;
}
canvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1000;
}
body.scroll-locked canvas {
  display: none;
}
.Marque {
  position: absolute;
  bottom: 1vw;
  right: 1vw;
  width: 5vw;
  height: 1.5vw;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center right;
  background-image: url("../../assets/ARK.svg");
  opacity: 0.7;
  cursor: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyMiAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE1NF8xNDgpIj4KPHBhdGggZD0iTTIgMkg0TDIyIDIwSDEwTDIgMjhWMloiIGZpbGw9IiNGQ0VGM0EiLz4KPHBhdGggZD0iTTQgMkgyVjI2SDRWMjhIMFYwSDRWMlpNNiAyNkg0VjI0SDZWMjZaTTggMjRINlYyMkg4VjI0Wk0yMiAyMkg4VjIwSDIwVjE4SDIyVjIyWk0yMCAxOEgxOFYxNkgyMFYxOFpNMTggMTZIMTZWMTRIMThWMTZaTTE2IDE0SDE0VjEySDE2VjE0Wk0xNCAxMkgxMlYxMEgxNFYxMlpNMTIgMTBIMTBWOEgxMlYxMFpNMTAgOEg4VjZIMTBWOFpNOCA2SDZWNEg4VjZaTTYgNEg0VjJINlY0WiIgZmlsbD0iIzI0MUIxQiIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzE1NF8xNDgiPgo8cmVjdCB3aWR0aD0iMjIiIGhlaWdodD0iMjgiIGZpbGw9IndoaXRlIi8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg=="), auto;
  scale: 1;
  animation: floatComposite var(--float-duration, 6.5s) ease-in-out var(--float-delay, -0.8s) infinite;
  transition: scale 0.3s ease;
}
.Marque:hover {
  scale: 1.06;
  opacity: 1;
}
@media screen and (max-width: 767px) {
  .Marque {
    bottom: 5px;
    right: 8px;
    width: 65px;
    height: 26px;
  }
}
/* CUT THE FILE HERE */
.Image {
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  z-index: 2;
  scale: 1;
  --parallax-y: 0px;
  transition: scale 0.3s ease, background-image 0.3s ease;
}
@media screen and (min-width: 1024px) {
  .Image:hover {
    scale: 1.075;
    cursor: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyMiAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE1NF8xNDgpIj4KPHBhdGggZD0iTTIgMkg0TDIyIDIwSDEwTDIgMjhWMloiIGZpbGw9IiNGQ0VGM0EiLz4KPHBhdGggZD0iTTQgMkgyVjI2SDRWMjhIMFYwSDRWMlpNNiAyNkg0VjI0SDZWMjZaTTggMjRINlYyMkg4VjI0Wk0yMiAyMkg4VjIwSDIwVjE4SDIyVjIyWk0yMCAxOEgxOFYxNkgyMFYxOFpNMTggMTZIMTZWMTRIMThWMTZaTTE2IDE0SDE0VjEySDE2VjE0Wk0xNCAxMkgxMlYxMEgxNFYxMlpNMTIgMTBIMTBWOEgxMlYxMFpNMTAgOEg4VjZIMTBWOFpNOCA2SDZWNEg4VjZaTTYgNEg0VjJINlY0WiIgZmlsbD0iIzI0MUIxQiIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzE1NF8xNDgiPgo8cmVjdCB3aWR0aD0iMjIiIGhlaWdodD0iMjgiIGZpbGw9IndoaXRlIi8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg=="), auto;
    will-change: transform;
  }
}
.Image {
  animation: floatComposite var(--float-duration, 6s) ease-in-out var(--float-delay, 0s) infinite;
}
/* CUT THE FILE HERE */
.Island {
  position: absolute;
  cursor: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyMiAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE1NF8xNDgpIj4KPHBhdGggZD0iTTIgMkg0TDIyIDIwSDEwTDIgMjhWMloiIGZpbGw9IiNGQ0VGM0EiLz4KPHBhdGggZD0iTTQgMkgyVjI2SDRWMjhIMFYwSDRWMlpNNiAyNkg0VjI0SDZWMjZaTTggMjRINlYyMkg4VjI0Wk0yMiAyMkg4VjIwSDIwVjE4SDIyVjIyWk0yMCAxOEgxOFYxNkgyMFYxOFpNMTggMTZIMTZWMTRIMThWMTZaTTE2IDE0SDE0VjEySDE2VjE0Wk0xNCAxMkgxMlYxMEgxNFYxMlpNMTIgMTBIMTBWOEgxMlYxMFpNMTAgOEg4VjZIMTBWOFpNOCA2SDZWNEg4VjZaTTYgNEg0VjJINlY0WiIgZmlsbD0iIzI0MUIxQiIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzE1NF8xNDgiPgo8cmVjdCB3aWR0aD0iMjIiIGhlaWdodD0iMjgiIGZpbGw9IndoaXRlIi8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg=="), auto;
  text-align: center;
}
.Island__close {
  display: none;
}
@media screen and (max-width: 1023px) {
  .Island {
    position: relative;
    margin-left: 0 !important;
    margin-top: 50px !important;
  }
  .Island .Image {
    width: calc(var(--base-width) * 2.2 * 1vw) !important;
    height: calc(var(--base-height) * 2.2 * 1vw) !important;
    margin: 4vw auto;
  }
  .Island__card {
    position: relative;
    left: 0 !important;
    top: 0 !important;
    right: 0;
    margin: 0 auto;
    width: initial !important;
    padding: 42px !important;
  }
}
.Island ::-moz-selection {
  background: #fcef3a;
  color: #241b1b;
}
.Island ::selection {
  background: #fcef3a;
  color: #241b1b;
}
.Island_active {
  z-index: 2000;
}
.Island_active .Image {
  filter: brightness(0) saturate(100%) invert(90%) sepia(94%) saturate(500%) hue-rotate(360deg);
}
@media screen and (min-width: 1024px) {
  .Island_active .Image {
    scale: 1.2;
  }
  .Island_active .Image:hover {
    scale: 1.2;
  }
}
.Island_Letter .Image {
  filter: none !important;
}
.Island__hint {
  position: relative;
  z-index: 10;
  color: #241b1b;
  background: #fcef3a;
  border: 2px solid rgba(26,190,240,0.49);
  display: inline-block;
  margin: 0 auto;
  letter-spacing: -0.1vw;
  border-radius: 10vw;
  text-transform: uppercase;
  padding: 0.2vw 0.6vw;
  margin-bottom: -1.5vw;
  opacity: 0;
  visibility: hidden;
  translate: 0 0.5vw;
  transition: opacity 0.3s ease, visibility 0.3s ease, translate 0.3s ease;
  --hint-float-y: 0.3vw;
  --hint-float-duration: 3s;
  animation: hintFloat var(--hint-float-duration) ease-in-out infinite;
}
@media screen and (max-width: 767px) {
  .Island__hint {
    display: none;
  }
}
.Island:hover .Island__hint {
  opacity: 1;
  visibility: visible;
  translate: 0 -0.5vw;
}
.Island_active .Island__hint {
  opacity: 0 !important;
  visibility: hidden !important;
}
.Island__num {
  font-size: 5vw;
  line-height: 5vw;
  letter-spacing: -0.5vw;
  margin-left: -0.4vw;
}
@media screen and (max-width: 767px) {
  .Island__num {
    font-size: 60px;
    line-height: 60px;
  }
}
.Island__side {
  text-transform: uppercase;
  font-size: 1.8vw;
  line-height: 2vw;
  letter-spacing: -0.12vw;
  position: absolute;
  right: 0;
  top: 0.7vw;
  text-align: right;
}
@media screen and (max-width: 767px) {
  .Island__side {
    font-size: 22px;
    line-height: 24px;
  }
}
@media screen and (max-width: 767px) {
  .Island__side {
    top: 11px;
  }
}
.Island__subtitle {
  color: #4b4b4b;
}
.Island__colon {
  display: inline;
  animation: colonBlink 1s step-end infinite;
}
.Island__strong {
  background: #fcef3a;
  color: #241b1b;
  text-transform: uppercase;
}
.Island__head {
  position: relative;
  margin-bottom: 0.5vw;
}
.Island__card {
  text-align: left;
  position: absolute;
  top: 0;
  z-index: 2000;
  width: 31.1vw;
  background: #241b1b;
  color: #fcef3a;
  border-radius: 1vw;
  padding: 0.8vw 1.6vw;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(0.95) translateY(-1vw);
  transition: opacity 0.2s ease, visibility 0.3s ease, transform 0.3s ease;
}
.Island_active .Island__card {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: scale(1) translateY(0);
}
@media screen and (max-width: 767px) {
  .Island__card {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: initial !important;
    height: 100vh !important;
    overflow: hidden;
    border-radius: 0;
    padding: 5vw;
    z-index: 99999;
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
    touch-action: none;
  }
  .Island_active {
    z-index: 99999;
  }
  .Island_active .Island__card {
    overflow-y: auto;
    touch-action: auto;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto;
    background: #241b1b;
    transform: translateY(0);
  }
  .Island__close {
    display: block;
    position: sticky;
    top: -35px;
    float: right;
    margin-right: -35px;
    margin-top: -35px;
    width: 32px;
    height: 32px;
    background-size: 60% 60%;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAuNzA1MjUgMTAuNTEzNEw0LjMyOTAxIDYuODg5NjFMMC43MDUyNSAzLjI2NTg0QzAuMjY2MDA2IDIuODI2NiAwLjAzMTQwOTQgMi4zNjI0IDAuMDAxNDYwOSAxLjg3MzI0Qy0wLjAxODUwNDcgMS4zNzQxIDAuMTY2MTc3IDAuOTI5ODYzIDAuNTU1NTA3IDAuNTQwNTMzQzAuOTI0ODcyIDAuMTcxMTY5IDEuMzY0MTIgMC4wMDE0NjA5IDEuODczMjQgMC4wMzE0MDk0QzIuMzkyMzUgMC4wNTEzNzUgMi44NjE1NCAwLjI3MDk5NyAzLjI4MDgyIDAuNjkwMjc1TDYuOTA0NTggNC4zMTQwNEwxMC41MTM0IDAuNzA1MjVDMTAuOTUyNiAwLjI2NjAwNiAxMS40MTY4IDAuMDMxNDA5NCAxMS45MDYgMC4wMDE0NjA5QzEyLjQwNTEgLTAuMDE4NTA0NyAxMi44NDkzIDAuMTY2MTc3IDEzLjIzODcgMC41NTU1MDdDMTMuNjA4IDAuOTI0ODcyIDEzLjc3NzggMS4zNjQxMiAxMy43NDc4IDEuODczMjRDMTMuNzI3OCAyLjM5MjM1IDEzLjUwODIgMi44NjE1NCAxMy4wODg5IDMuMjgwODJMOS40ODAxNSA2Ljg4OTYxTDEzLjEwMzkgMTAuNTEzNEMxMy41MzMyIDEwLjk0MjYgMTMuNzU3OCAxMS40MDY4IDEzLjc3NzggMTEuOTA2QzEzLjgwNzcgMTIuNDE1MSAxMy42MzMgMTIuODU5MyAxMy4yNTM3IDEzLjIzODdDMTIuODc0MyAxMy42MTggMTIuNDMwMSAxMy43OTI3IDExLjkyMDkgMTMuNzYyOEMxMS40MTE4IDEzLjczMjggMTAuOTQ3NiAxMy41MDgyIDEwLjUyODMgMTMuMDg4OUw2LjkwNDU4IDkuNDY1MTdMMy4yODA4MiAxMy4wODg5QzIuODUxNTYgMTMuNTE4MiAyLjM4MjM2IDEzLjc0NzggMS44NzMyNCAxMy43Nzc4QzEuMzc0MSAxMy43OTc3IDAuOTM0ODU1IDEzLjYxOCAwLjU1NTUwNyAxMy4yMzg3QzAuMTc2MTYgMTIuODU5MyAwLjAwMTQ2MDkgMTIuNDE1MSAwLjAzMTQwOTQgMTEuOTA2QzAuMDYxMzU3OCAxMS4zOTY4IDAuMjg1OTcxIDEwLjkzMjYgMC43MDUyNSAxMC41MTM0WiIgZmlsbD0iI0ZDRUYzQSIvPgo8L3N2Zz4K");
    cursor: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyMiAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE1NF8xNDgpIj4KPHBhdGggZD0iTTIgMkg0TDIyIDIwSDEwTDIgMjhWMloiIGZpbGw9IiNGQ0VGM0EiLz4KPHBhdGggZD0iTTQgMkgyVjI2SDRWMjhIMFYwSDRWMlpNNiAyNkg0VjI0SDZWMjZaTTggMjRINlYyMkg4VjI0Wk0yMiAyMkg4VjIwSDIwVjE4SDIyVjIyWk0yMCAxOEgxOFYxNkgyMFYxOFpNMTggMTZIMTZWMTRIMThWMTZaTTE2IDE0SDE0VjEySDE2VjE0Wk0xNCAxMkgxMlYxMEgxNFYxMlpNMTIgMTBIMTBWOEgxMlYxMFpNMTAgOEg4VjZIMTBWOFpNOCA2SDZWNEg4VjZaTTYgNEg0VjJINlY0WiIgZmlsbD0iIzI0MUIxQiIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzE1NF8xNDgiPgo8cmVjdCB3aWR0aD0iMjIiIGhlaWdodD0iMjgiIGZpbGw9IndoaXRlIi8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg=="), auto;
    z-index: 10;
  }
}
.Island__footer {
  height: 0;
  padding-bottom: 15%;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-image: url("../../assets/card-footer.svg");
}
@media screen and (max-width: 767px) {
  .Island__footer {
    padding-bottom: 25%;
    margin-bottom: 20vh;
  }
}
.Island__lines {
  overflow: hidden;
}
.Island__line {
  width: 100%;
  height: 0;
  padding-bottom: 3%;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzk2IiBoZWlnaHQ9IjgiIHZpZXdCb3g9IjAgMCAzOTYgOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAgMC41SDM5NiIgc3Ryb2tlPSIjNEI0QjRCIiBzdHJva2UtZGFzaGFycmF5PSIxIDEiLz4KPHBhdGggZD0iTTAgMi41SDM5NiIgc3Ryb2tlPSIjNEI0QjRCIiBzdHJva2UtZGFzaGFycmF5PSIxIDEiLz4KPHBhdGggZD0iTTAgNC41SDM5NiIgc3Ryb2tlPSIjNEI0QjRCIiBzdHJva2UtZGFzaGFycmF5PSIxIDEiLz4KPHBhdGggZD0iTTAgNi41SDM5NiIgc3Ryb2tlPSIjNEI0QjRCIiBzdHJva2UtZGFzaGFycmF5PSIxIDEiLz4KPC9zdmc+Cg==");
}
.Island__text {
  padding: 1vw 0 2vw 0;
  font-size: 1vw;
  line-height: 1.3vw;
  letter-spacing: -0.08vw;
}
@media screen and (max-width: 767px) {
  .Island__text {
    font-size: 20px;
    line-height: 28px;
    letter-spacing: -2px;
  }
}
.Island__p + .Island__p {
  margin-top: 1vw;
}
@media screen and (max-width: 767px) {
  .Island__p + .Island__p {
    margin-top: 32px;
  }
}
/* CUT THE FILE HERE */
.Map {
  position: relative;
  padding-bottom: 15vw;
  min-height: 140vw;
}
@media screen and (max-width: 767px) {
  .Map {
    padding-bottom: 120px !important;
  }
}
.Map__water {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  --parallax-y: 0px;
  background-position-y: calc(0 + var(--parallax-y));
}
.Map__logo {
  top: 4.8vw;
  width: 28vw;
  height: 6.4vw;
  margin: 0 auto;
  right: 5vw;
  background-size: cover;
  background-repeat: no-repeat;
  position: absolute;
  --parallax-y: 0px;
  animation: floatComposite var(--float-duration, 6.5s) ease-in-out var(--float-delay, -0.8s) infinite;
  transition: scale 0.3s ease;
}
.Map__logo:hover {
  scale: 1.04;
}
@media screen and (max-width: 767px) {
  .Map__logo {
    left: 0;
    right: 0;
    width: 250px;
    height: 55px;
    text-align: center;
    position: relative;
    margin-top: 24px;
  }
}
@keyframes floatComposite {
  0%, 100% {
    translate: 0 var(--parallax-y, 0);
    rotate: 0deg;
  }
  50% {
    translate: var(--float-x-amplitude, 0) calc(var(--parallax-y, 0) + (-1 * var(--float-y-amplitude, 0.6vw)));
    rotate: var(--float-rot-amplitude, 0deg);
  }
}
@keyframes hintFloat {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(calc(-1 * var(--hint-float-y, 0.3vw)));
  }
}
@keyframes colonBlink {
  0%, 49% {
    opacity: 1;
  }
  50%, 100% {
    opacity: 0;
  }
}
