@font-face {
  font-family: "Didact Gothic";
  src: url("/assets/fonts/didactgothic.woff2") format("woff");
  font-weight: normal;
  font-style: normal;
}
.page header {
  height: 99rem;
  display: flex;
}
.page header .wrapper {
  height: inherit;
  background: black;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  right: 0;
}
.page header .wrapper .background {
  height: inherit;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  overflow: hidden;
}
.page header .wrapper .background div {
  position: relative;
  height: 100vh;
  width: 100%;
  background-color: #1f1f1f;
  background-image: linear-gradient(315deg, #0cbaba 0%, #380036 74%);
}
.page header .wrapper .background div:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, #673ab78a, #3c3c3c94);
}
.page header .menu {
  padding: 25rem;
  display: flex;
  gap: 15rem;
  z-index: 11;
}
.page header .menu a {
  color: white;
  text-decoration: none;
  font-size: 14rem;
  padding: 15rem;
}

.home-page {
  /***
  	Batman logo by Stephen Greig:
  	http://tangledindesign.com/famous-logos-in-css3-the-dark-knight/
  ***/
  /*** END Batman logo by Stephen Greig ***/
  /*** BATMAN ***/
  /*
  body:active .batman {
  	transform: scale(0.75);
  	transition: 1s ease 0.25s;
  }
  */
}
.home-page header {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  right: 0;
}
.home-page header .menu {
  padding: 25rem;
  display: flex;
  gap: 15rem;
}
.home-page header .menu a {
  color: white;
  text-decoration: none;
  font-size: 14rem;
  padding: 15rem;
}
.home-page footer {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  right: 0;
}
.home-page footer .menu {
  display: flex;
  gap: 15rem;
}
.home-page footer .menu a {
  color: white;
  text-decoration: none;
  font-size: 12rem;
  padding: 11rem;
}
.home-page main {
  position: absolute;
  top: 99rem;
  left: 0;
  z-index: 10;
  height: calc(100% - 99rem);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  color: white;
  line-height: 2;
}
.home-page main .wrapper {
  margin-top: -80rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.home-page main .logo {
  width: 120rem;
  height: auto;
  border-radius: 30rem;
}
.home-page main .title {
  font-size: 60rem;
  margin-bottom: 0;
  color: #FFEFA0;
  line-height: 1.7;
  margin-top: 0rem;
}
.home-page main .subtitle {
  max-width: 500rem;
  text-align: center;
  font-size: 16rem;
}
.home-page main .install {
  margin-top: 20rem;
  color: white;
  background: #470B8D;
  transition: 0.2s ease;
  padding: 18rem 40rem;
  border-radius: 60rem;
  font-size: 16rem;
}
.home-page main .install:hover {
  background: #4e0c9b;
}
.home-page {
  --bg: #fff4d1;
  --w1: conic-gradient(from 90deg at 50% 50%, #fff491 0% 25%, #fff0 0% 100%)
  no-repeat;
  --w2: conic-gradient(from 90deg at 50% 50%, #ffdf81 0% 25%, #fff0 0% 100%)
  no-repeat;
  --w3: conic-gradient(from 90deg at 50% 50%, #ffb84f 0% 25%, #fff0 0% 100%)
  no-repeat;
  --w4: conic-gradient(from 90deg at 50% 50%, #ff926f 0% 25%, #fff0 0% 100%)
  no-repeat;
  --w5: conic-gradient(from 90deg at 50% 50%, #acb0b1 0% 25%, #fff0 0% 100%)
  no-repeat;
  --w6: conic-gradient(from 90deg at 50% 50%, #9dc8dc 0% 25%, #fff0 0% 100%)
  no-repeat;
  --w7: conic-gradient(from 90deg at 50% 50%, #577c9a 0% 25%, #fff0 0% 100%)
  no-repeat;
  --w8: conic-gradient(from 90deg at 50% 50%, #2b4e5f 0% 25%, #fff0 0% 100%)
  no-repeat;
}
.home-page * {
  transform-style: preserve-3d;
}
.home-page {
  margin: 0;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  background-color: #1f1f1f;
  background-image: linear-gradient(315deg, #0cbaba 0%, #380036 74%);
  cursor: pointer;
}
.home-page .sky {
  background: linear-gradient(0deg, #673ab78a, #3c3c3c94);
  height: 100vh;
}
.home-page .sky:after {
  content: "";
  position: absolute;
  width: 100vw;
  height: 100vh;
  top: 0vh;
  background-image: radial-gradient(2rem 2rem at 20rem 30rem, #484341, transparent), radial-gradient(2rem 2rem at 43rem 75rem, #735454, transparent), radial-gradient(2rem 1rem at 54rem 184rem, #828282, transparent), radial-gradient(2rem 2rem at 93rem 47rem, #654b49, transparent), radial-gradient(1rem 1rem at 148rem 87rem, #3a1919, transparent), radial-gradient(2rem 2rem at 193rem 137rem, #a26662, transparent), radial-gradient(1rem 2rem at 210rem 154rem, #805241, transparent), radial-gradient(2rem 2rem at 243rem 102rem, #866356, transparent), radial-gradient(2rem 1rem at 264rem 184rem, #794937, transparent), radial-gradient(2rem 2rem at 293rem 44rem, #735454, transparent), radial-gradient(1rem 1rem at 223rem 62rem, #ad968e, transparent), radial-gradient(2rem 2rem at 249rem 162rem, #884228, transparent), radial-gradient(2rem 2rem at 73rem 99rem, #442e26, transparent), radial-gradient(1rem 1rem at 163rem 42rem, #403433, transparent), linear-gradient(180deg, #fff0 10%, #000 25%, #111 50%, #222 75%, #111 100%);
  background-repeat: no-repeat, repeat;
  background-size: 333rem 263rem, 333rem 163rem, 333rem 163rem, 333rem 163rem, 333rem 163rem, 333rem 163rem, 333rem 163rem, 333rem 163rem, 333rem 163rem, 333rem 163rem, 333rem 163rem, 333rem 163rem, 333rem 163rem, 333rem 163rem, 100% 100%;
  opacity: 0.5;
  mix-blend-mode: color-burn;
}
.home-page .moon {
  position: absolute;
  z-index: 2;
  width: 20vmin;
  height: 20vmin;
  left: 20vmin;
  top: 15vmin;
  opacity: 1;
  border-radius: 100%;
  animation: start-moon 3s ease 0s 1;
  background: radial-gradient(circle at 50% 50%, #fdfdfd 0% 7vmin, #ffffff00 7.25vmin 100%), #fff;
  box-shadow: #6493a9 0px 0px 128rem 64rem, rgba(255, 102, 0, 0) 0px 0px 128rem -256rem inset, #fdfdfd 0px 0px 20rem 5rem;
  mix-blend-mode: exclusion;
}
.home-page .moon:before {
  content: "";
  background: radial-gradient(circle at 100% 60%, #ffffff00 0% 60%, #dddddd 75% 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0%;
  left: 0%;
  border-radius: 100%;
}
.home-page .moon:after {
  content: "";
  background: radial-gradient(circle at 0% 40%, #efefef 0% 60%, #ededed 75% 100%);
  width: 4.5vmin;
  height: 4.5vmin;
  position: absolute;
  top: 20%;
  left: 20%;
  border-radius: 100%;
  filter: blur(2rem);
}
.home-page .light {
  mix-blend-mode: soft-light;
  /* background: #fff4d2;*/
  width: 22vmin;
  height: 22vmin;
  border-radius: 100%;
  position: absolute;
  top: 14vmin;
  left: 19vmin;
  transform: rotate(-45deg);
  opacity: 0;
  animation: start 5s ease 0s 1, blink-off 0.2s ease 0s 2;
}
.home-page .light:before {
  content: "";
  position: absolute;
  border: 8vmin solid transparent;
  border-top: 150vmin solid #fff4d2;
  top: 14vmin;
  left: 0.5vmin;
  border-radius: 0.5vmin;
  opacity: 0.65;
  filter: blur(3rem);
  width: 5vmin;
}
.home-page .light:after {
  content: "";
  mix-blend-mode: soft-light;
  background: #fff4d2;
  width: 22vmin;
  height: 22vmin;
  border-radius: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transform: rotate(-45deg);
  filter: blur(2rem);
}
.home-page:hover .light {
  animation-iteration-count: 0;
}
.home-page:active .light {
  opacity: 1;
  animation: start 1s ease 0s 1, blink-on 0.15s ease 0s 2;
  cursor: none;
}
@keyframes blink-off {
  40% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  60% {
    opacity: 1;
  }
}
@keyframes blink-on {
  40% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  60% {
    opacity: 1;
  }
}
@keyframes start {
  20%, 80% {
    opacity: 1;
  }
}
.home-page #batman-logo {
  filter: contrast(1.5) blur(0.5rem);
  height: 4.35vmin;
  overflow: hidden;
  position: absolute;
  width: 16vmin;
  background: #000;
  left: 1.85vmin;
  top: 9.75vmin;
  background-image: -webkit-gradient(linear, left bottom, right top, color-stop(0, #48545c), color-stop(0.63, #191a1a), color-stop(0.86, #1a1a1a));
  background-image: -moz-linear-gradient(left bottom, #48545c 0%, #191a1a 63%, #1a1a1a 86%);
  background-image: -o-linear-gradient(left bottom, #48545c 0%, #191a1a 63%, #1a1a1a 86%);
  transform: rotateZ(48deg) rotateY(15deg) rotateX(0deg) scaleY(1.75) scaleX(1.25);
  box-shadow: 0 0 10vmin 2vmin #fff;
  border-radius: 5% 5% 100% 100%;
}
.home-page #batman-logo div {
  position: absolute;
}
.home-page #left-white {
  background: var(--bg);
  border-radius: 3.2vmin 5.12vmin 0.96vmin 1.16vmin/2.56vmin 3.2vmin 1.16vmin 1.16vmin;
  width: 7.36vmin;
  height: 2.56vmin;
  top: -0.032vmin;
  left: -5.056vmin;
}
.home-page #left-white:after {
  content: "";
  position: absolute;
  background: var(--bg);
  width: 10.656vmin;
  height: 7.04vmin;
  border-radius: 0 12.8vmin 12.8vmin 12.8vmin/0 9.6vmin 9.6vmin 9.6vmin;
  top: 2.336vmin;
  left: 2.816vmin;
}
.home-page #right-white {
  background: var(--bg);
  border-radius: 5.12vmin 3.2vmin 1.16vmin 0.96vmin/3.2vmin 2.56vmin 1.16vmin 1.16vmin;
  width: 7.36vmin;
  height: 2.56vmin;
  top: -0.032vmin;
  right: -5.056vmin;
}
.home-page #right-white:after {
  content: "";
  position: absolute;
  background: var(--bg);
  width: 12.256vmin;
  height: 7.04vmin;
  border-radius: 12.8vmin 0 12.8vmin 12.8vmin/9.6vmin 0 9.6vmin 9.6vmin;
  top: 2.336vmin;
  right: 1.216vmin;
}
.home-page #top-white {
  width: 0.384vmin;
  top: 0;
  left: 7.664vmin;
  border-left: 0.384vmin solid #fff0;
  border-right: 0.384vmin solid #fff0;
  border-top: 0.64vmin solid #fff;
}
.home-page #top-white:before {
  content: "";
  position: absolute;
  width: 2.08vmin;
  height: 2.464vmin;
  background: var(--bg);
  border-radius: 0.96vmin 0.32vmin 0.32vmin 0.96vmin/2.56vmin 1.16vmin 1.16vmin 1.16vmin;
  top: -2.08vmin;
  right: 0.576vmin;
  -moz-transform: rotate(5deg);
  -webkit-transform: rotate(5deg);
  -o-transform: rotate(5deg);
}
.home-page #top-white:after {
  content: "";
  position: absolute;
  width: 2.08vmin;
  height: 2.464vmin;
  background: var(--bg);
  border-radius: 0.32vmin 0.96vmin 0.96vmin 0.32vmin/1.16vmin 2.56vmin 1.16vmin 1.16vmin;
  top: -2.08vmin;
  left: 0.576vmin;
  -moz-transform: rotate(-5deg);
  -webkit-transform: rotate(-5deg);
  -o-transform: rotate(-5deg);
}
.home-page #lighting {
  width: 3.2vmin;
  height: 3.2vmin;
  background: var(--bg);
  border-radius: 2.4vmin;
  left: 3.2vmin;
  top: -0.32vmin;
  opacity: 0.02;
  box-shadow: #fff 0 0 2.24vmin;
  -webkit-box-shadow: #fff 0 0 2.24vmin;
  -moz-box-shadow: #fff 0 0 2.24vmin;
}
.home-page .skyline {
  height: 65vh;
  position: absolute;
  background: linear-gradient(75deg, #09080c, #0f0323), #0f0323;
  bottom: -10rem;
  width: 100vw;
  background: var(--w5) 0.5% 54%, var(--w6) 2.5% 56.25%, var(--w7) 0.25% 64.85%, var(--w8) 0.75% 84.25%, var(--w6) 19.685% 44.2%, var(--w5) 22.35% 44.25%, var(--w7) 15.75% 55.25%, var(--w6) 16.6% 58.25%, var(--w8) 21.475% 54%, var(--w8) 23.35% 65.5%, var(--w5) 13.85% 62.25%, var(--w6) 19.35% 65.25%, var(--w6) 22.45% 54%, var(--w7) 22.35% 68.15%, var(--w8) 35.35% 55.25%, var(--w8) 34.1% 61.25%, var(--w7) 33.1% 84%, var(--w5) 32.35% 73.25%, var(--w6) 47.35% 71.25%, var(--w5) 51.5% 82.25%, var(--w8) 41.55% 50%, var(--w6) 42.5% 50%, var(--w7) 38.95% 65%, var(--w8) 44.5% 68%, var(--w6) 40.55% 50%, var(--w5) 44.85% 59%, var(--w7) 53.25% 66%, var(--w8) 49.55% 60%, var(--w6) 50.55% 70%, var(--w5) 53.75% 74%, var(--w5) 51.55% 70%, var(--w6) 51.55% 76%, var(--w7) 62.4% 67%, var(--w7) 54.75% 57%, var(--w8) 63% 55.5%, var(--w5) 70.5% 66%, var(--w6) 68.5% 69%, var(--w7) 70% 51%, var(--w8) 71% 51%, var(--w7) 68.5% 54%, var(--w6) 77% 74%, var(--w7) 72% 61%, var(--w5) 78% 55%, var(--w6) 78% 57%, var(--w6) 88% 66%, var(--w5) 93.35% 27.5%, var(--w5) 91% 32%, var(--w8) 89% 66%, var(--w8) 91% 34.5%, var(--w7) 91% 37%, var(--w7) 91% 41%, var(--w6) 99% 86%, var(--w6) 92% 39%, var(--w5) 92% 43%, var(--w7) 93.5% 55%, var(--w5) 93% 46%, linear-gradient(75deg, #150e21, #0f0323), #0f0323;
  background-size: 1vw 1vh, 1vw 1.5vh, 1vw 1vh, 1vw 1vh, 1vw 2vh, 1vw 2vh, 1.15vw 1.25vh, 0.5vw 0.75vh, 1vw 2vh, 0.51vw 1vh, 1vw 1vh, 1vw 2vh, 1vw 1vh, 1vw 2vh, 1vw 1vh, 1vw 1vh, 1vw 1vh, 0.5vw 1vh, 1vw 2vh, 1vw 1vh, 1vw 1.5vh, 1vw 2vh, 0.5vw 0.5vh, 1vw 1vh, 1vw 1vh, 0.75vw 1vh, 1vw 1vh, 0.75vw 1.2vh, 1vw 1vh, 1vw 1vh, 0.75vw 2vh, 1vw 1.25vh, 0.75vw 1vh, 0.5vw 1vh, 1vw 1vh, 1vw 0.5vh, 1vw 1vh, 1vw 2vh, 1vw 1.25vh, 1.2vw 1.2vh, 0.75vw 1vh, 1vw 2vh, 1vw 2vh, 1vw 1vh, 1vw 1vh, 1vw 2vh, 1vw 2vh, 1vw 1.5vh, 1vw 1vh, 1vw 2vh, 1vw 1vh, 0.5vw 1.25vh, 1vw 1.25vh, 1vw 2vh, 1vw 1vh, 1vw 1.2vh, 100% 100%;
  clip-path: polygon(0% 100%, 0% 100%, 100% 100%, 100% 100%, 100% 65%, 100% 65%, 97% 65%, 97% 65%, 97% 63%, 97% 63%, 95% 64%, 95% 64%, 94% 32%, 94% 32%, 94% 31%, 94% 31%, 94% 28%, 94% 28%, 93% 23%, 93% 23%, 92% 9%, 92% 9%, 92% 23%, 92% 23%, 91% 28%, 91% 28%, 91% 31%, 91% 31%, 90% 32%, 90% 32%, 90% 64%, 90% 64%, 87% 64%, 87% 64%, 87% 67%, 87% 67%, 86% 67%, 86% 67%, 85% 65%, 85% 67%, 84% 65%, 84% 65%, 84% 66%, 84% 66%, 82% 64%, 85% 70%, 83% 57%, 83% 57%, 81% 58%, 81% 58%, 80% 54%, 81% 54%, 81% 54%, 80% 54%, 80% 51%, 80% 52%, 79% 51%, 79% 51%, 79% 49%, 79% 49%, 79% 48%, 79% 48%, 79% 50%, 79% 50%, 78% 50%, 78% 50%, 78% 53%, 78% 53%, 77% 54%, 77% 54%, 77% 65%, 77% 65%, 75% 65%, 75% 65%, 74% 63%, 74% 63%, 73% 63%, 73% 63%, 73% 54%, 73% 54%, 72% 53%, 72% 53%, 72% 50%, 72% 50%, 69% 50%, 69% 50%, 69% 53%, 69% 53%, 66% 53%, 66% 53%, 66% 55%, 66% 55%, 66% 55%, 66% 55%, 66% 58%, 66% 58%, 65% 58%, 65% 58%, 64% 62%, 64% 61%, 64% 62%, 64% 62%, 64% 54%, 64% 54%, 59% 54%, 60% 54%, 59% 53%, 59% 53%, 58% 53%, 58% 53%, 58% 52%, 58% 52%, 56% 52%, 56% 52%, 56% 53%, 56% 53%, 55% 53%, 55% 53%, 54% 56%, 55% 56%, 53% 56%, 53% 56%, 53% 58%, 53% 58%, 52% 58%, 52% 58%, 51% 54%, 51% 54%, 50% 54%, 50% 54%, 49% 50%, 49% 50%, 47% 50%, 47% 50%, 47% 52%, 47% 52%, 47% 55%, 47% 55%, 47% 63%, 47% 63%, 46% 64%, 46% 64%, 46% 57%, 46% 57%, 45% 57%, 45% 57%, 45% 49%, 45% 49%, 44% 48%, 44% 49%, 44% 46%, 45% 46%, 40% 46%, 41% 46%, 40% 49%, 40% 49%, 39% 49%, 39% 49%, 39% 56%, 39% 56%, 39% 56%, 39% 56%, 38% 53%, 38% 53%, 37% 54%, 35% 54%, 35% 60%, 35% 60%, 34% 60%, 34% 60%, 33% 48%, 33% 48%, 30% 48%, 30% 48%, 30% 45%, 30% 42%, 29% 43%, 29% 45%, 29% 47%, 29% 47%, 29% 47%, 29% 47%, 29% 59%, 28% 59%, 28% 59%, 28% 59%, 28% 52%, 28% 52%, 25% 52%, 25.25% 52%, 25% 38%, 25% 38%, 23% 40%, 24% 40%, 20% 40%, 20% 40%, 18% 38%, 18% 38%, 17.75% 53%, 18% 53%, 17% 53%, 17% 53%, 17% 54%, 17% 54%, 16% 53%, 16% 53%, 16% 44%, 16% 44%, 12% 44%, 12% 44%, 12% 53%, 12% 53%, 11% 53%, 12% 53%, 11% 47%, 11% 47%, 10% 47%, 10% 47%, 10% 45%, 10% 45%, 9% 45%, 9% 45%, 9% 48%, 9% 48%, 8% 48%, 8% 48%, 8% 51%, 8% 51%, 6% 53%, 6% 53%, 6% 63%, 5% 63%, 4% 61%, 4% 62%, 4% 53%, 4% 53%, 0% 50%, 0% 50%, 0% 95%, 0% 100%);
}
.home-page .skyline:before {
  content: "CLICK & HOLD TO CALL BATMAN";
  position: absolute;
  width: 100%;
  bottom: 2.25vmin;
  text-align: center;
  color: #292545;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.75em;
  animation: call 3s ease 0s 1;
  transition: all 0.5s ease 0s;
  text-align: left;
  box-sizing: border-box;
  padding-left: 50rem;
}
.home-page:active .skyline:before {
  opacity: 0;
  animation: call 3s ease 0s 1;
  transition: all 0.5s ease 0s;
}
.home-page .light + .skyline {
  height: 60vh;
  background: var(--w1) 10.5% 72%, var(--w2) 2.05% 69.25%, var(--w3) 3.25% 64.85%, var(--w4) 12.5% 61.25%, var(--w1) 10.55% 47%, var(--w2) 9.35% 50.25%, var(--w3) 6% 77.25%, var(--w4) 13.6% 85.25%, var(--w1) 12.475% 39%, var(--w2) 8.35% 65.25%, var(--w3) 9.35% 55.25%, var(--w4) 10.5% 55.25%, var(--w1) 11.55% 26%, var(--w2) 12.5% 35.15%, var(--w3) 7.35% 40.25%, var(--w4) 8.5% 32.25%, var(--w1) 20% 72%, var(--w2) 17.35% 74.25%, var(--w3) 17.35% 77.25%, var(--w4) 21.5% 82.25%, var(--w1) 29.55% 49%, var(--w1) 28% 54%, var(--w4) 27.95% 73%, var(--w3) 24.5% 78%, var(--w4) 30.55% 49%, var(--w3) 30.55% 63%, var(--w1) 29.25% 66%, var(--w2) 26.55% 60%, var(--w2) 34.55% 70%, var(--w4) 35.75% 73%, var(--w3) 34.55% 73%, var(--w1) 34.55% 76%, var(--w1) 47.85% 79%, var(--w2) 46.75% 79%, var(--w3) 41.75% 72.5%, var(--w4) 40.5% 76%, var(--w2) 60.5% 69%, var(--w3) 58% 54%, var(--w4) 59% 58%, var(--w1) 60.5% 49%, var(--w3) 73% 74%, var(--w4) 63.85% 62%, var(--w1) 65% 65%, var(--w2) 69% 75%, var(--w4) 92% 68%, var(--w1) 95.5% 58%, var(--w2) 94% 58%, var(--w3) 88% 75%, var(--w4) 81% 68.5%, var(--w2) 79.5% 55%, var(--w2) 83% 51%, var(--w1) 83% 72%, var(--w3) 60.15% 36%, var(--w1) 59% 40%, var(--w2) 57.75% 36%, var(--w1) 57% 46%, linear-gradient(20deg, #030510, #000);
  background-size: 1vw 1.2vh, 0.7vw 1vh, 0.7vw 1vh, 1vw 1.2vh, 1vw 1.2vh, 1vw 1.2vh, 1vw 1vh, 1vw 1vh, 1vw 1vh, 1vw 1.2vh, 1vw 1.2vh, 1vw 1.2vh, 1vw 1vh, 1vw 1vh, 1vw 1vh, 1vw 1vh, 1vw 1vh, 0.5vw 1vh, 0.5vw 1vh, 0.751vw 1vh, 0.75vw 1.5vh, 0.75vw 1.5vh, 0.75vw 1.5vh, 0.75vw 1.5vh, 0.75vw 1.5vh, 0.75vw 1.5vh, 0.75vw 1.5vh, 0.75vw 1.5vh, 1vw 1vh, 1vw 1vh, 1vw 1vh, 1vw 1vh, 1vw 1.2vh, 1vw 1.2vh, 1vw 2vh, 1vw 1vh, 1vw 1vh, 1vw 1vh, 1vw 1vh, 1vw 1vh, 1vw 2vh, 0.7vw 1vh, 0.7vw 1vh, 0.8vw 1.2vh, 1vw 1.2vh, 0.8vw 1vh, 0.81vw 1vh, 1vw 1vh, 1vw 1.3vh, 1vw 1.3vh, 1vw 1.3vh, 1vw 1.3vh, 1vw 1vh, 1vw 1vh, 1vw 1vh, 1vw 1vh, 100% 100%;
  clip-path: polygon(100% 99%, 100% 86%, 98% 87%, 98% 81%, 97% 81%, 97% 52%, 95% 53%, 95% 42%, 94% 42%, 94% 54%, 91% 54%, 92% 66%, 91% 66%, 91% 81%, 90% 81%, 90% 90%, 89% 90%, 89% 73%, 87% 68%, 86% 68%, 85% 70%, 84% 41%, 83% 41%, 79% 53%, 78% 52%, 78% 78%, 76% 77%, 76% 64%, 75% 64%, 75% 67%, 72% 66%, 72% 80%, 71% 80%, 71% 83%, 71% 83%, 70% 76%, 70% 76%, 70% 71%, 66% 72%, 66% 59%, 65% 56%, 65% 53%, 64% 54%, 63% 59%, 63% 73%, 62% 73%, 62% 32%, 55% 32%, 56% 76%, 55% 77%, 55% 80%, 53% 80%, 52% 88%, 51% 88%, 51% 85%, 50% 84%, 50% 75%, 49% 75%, 48% 72%, 47% 72%, 47% 75%, 45% 75%, 45% 85%, 44% 84%, 44% 80%, 43% 79%, 43% 71%, 42% 68%, 39% 68%, 37% 80%, 37% 68%, 34% 68%, 34% 80%, 34% 81%, 34% 84%, 33% 84%, 33% 77%, 32% 77%, 32% 63%, 32% 63%, 32% 48%, 31% 46%, 30% 40%, 29% 36%, 29% 32%, 29% 25%, 28% 32%, 28% 36%, 28% 40%, 27% 46%, 26% 48%, 26% 62%, 26% 63%, 26% 75%, 24% 76%, 24% 82%, 23% 82%, 23% 80%, 22% 80%, 22% 72%, 21% 69%, 20% 69%, 19% 72%, 17% 72%, 17% 82%, 17% 86%, 15% 86%, 15% 75%, 14% 75%, 15% 42%, 14% 42%, 14% 34%, 13% 34%, 13% 25%, 12% 25%, 12% 23%, 11% 23%, 11% 17%, 10% 17%, 10% 0%, 10% 16%, 9% 17%, 9% 24%, 8% 26%, 9% 26%, 8% 26%, 8% 35%, 7% 35%, 7% 42%, 7% 42%, 7% 75%, 6% 75%, 6% 88%, 5% 88%, 5% 85%, 4% 84%, 5% 63%, 2% 63%, 2% 85%, 1% 86%, 1% 80%, 1% 80%, 1% 71%, 0% 69%, 0% 100%);
}
@keyframes call {
  0%, 80% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@media only screen and (orientation: portrait) {
  .home-page .light {
    transform: rotate(-15deg);
  }
  .home-page #batman-logo {
    transform: scale(1.15) rotate(17deg);
    left: 2.5vmin;
  }
  .home-page .light:before {
    border-top: 250vmin solid #fff4d2;
  }
}
.home-page .batman {
  position: absolute;
  background-size: cover;
  width: 45vmin;
  height: 33vmin;
  z-index: 333;
  top: 0vh;
  right: 3vmin;
  transform: scale(0.5);
  transform-origin: right bottom;
}
.home-page .batman * {
  position: absolute;
}
.home-page .head {
  background: #000;
  width: 4.5vmin;
  height: 5vmin;
  top: 2%;
  transform: rotate(-55deg);
  border-radius: 63% 39% 63% 10%;
  transform-origin: center bottom;
  left: 13%;
  transition: 1s ease 0.25s;
}
.home-page:active .batman .head {
  transform: rotate(-15deg);
  transition: 1s ease 0.25s;
}
.home-page .head:before {
  content: "";
  background: #000;
  width: 2vmin;
  height: 2vmin;
  position: absolute;
  left: 41%;
  top: 67%;
  transform: rotate(22deg);
}
.home-page .head:after {
  content: "";
  background: #000;
  width: 2vmin;
  height: 2vmin;
  position: absolute;
  left: 65%;
  top: 6%;
  transform: rotate(17deg);
  border-radius: 10% 50% 0 0;
}
.home-page .ears {
  width: 2vmin;
  height: 2vmin;
  top: -17%;
  left: 71%;
}
.home-page .ears span {
  border: 1vmin solid transparent;
  border-right-color: #000;
  left: -20%;
  top: 6%;
}
.home-page .ears span + span {
  left: -38%;
  border-width: 0.75vmin;
  transform: rotate(-9deg);
}
.home-page .nose {
  border: 1.25vmin solid transparent;
  border-bottom-color: #000;
  transform: rotate(3deg);
  left: -5rem;
  border-radius: 0.25vmin;
}
.home-page .mouth {
  background: #000;
  width: 1vmin;
  height: 0.5vmin;
  border-radius: 100%;
  left: -2%;
  top: 55%;
}
.home-page .body {
  width: 8vmin;
  height: 14vmin;
  left: 11%;
  top: 13%;
}
.home-page .body span:nth-child(1):before {
  content: "";
  width: 2.5vmin;
  height: 3vmin;
  background: #000;
  position: absolute;
  border-radius: 100%;
  transform: rotate(-20deg);
  left: 11%;
  top: -3%;
}
.home-page .body span {
  width: 5vmin;
  height: 7vmin;
  background: #000;
  border-radius: 100%;
  left: 12%;
  top: 4%;
  transform: rotate(32deg);
}
.home-page .body span + span {
  height: 8vmin;
  border-radius: 46%;
  left: 8%;
  top: 25%;
  transform: rotate(-5deg);
}
.home-page .body span + span + span {
  height: 3vmin;
  left: 10%;
  top: 67%;
}
.home-page .leg {
  width: 12vmin;
  height: 17vmin;
  top: 49%;
  left: 6%;
}
.home-page .leg span {
  background: #000;
  width: 3.5vmin;
  height: 7vmin;
  top: 1%;
  left: 22%;
  transform: rotate(8deg);
  border-radius: 20%;
}
.home-page .leg span + span {
  height: 2.75vmin;
  top: 32%;
  left: 18%;
  border-radius: 100%;
  transform: rotate(-28deg);
}
.home-page .leg span + span + span {
  width: 2.75vmin;
  height: 5vmin;
  top: 43%;
  left: 20%;
  border-radius: 5% 5% 35% 30%;
  transform: rotate(1deg);
  background: #000;
}
.home-page .leg span + span + span + span {
  width: 2.25vmin;
  height: 6vmin;
  top: 65%;
  left: 17%;
  border-radius: 0 0 40% 0;
  transform: rotate(10deg);
}
.home-page .leg + .leg {
  left: 9%;
  transform: rotate(-8deg);
  transform-origin: center top;
}
.home-page .leg + .leg span:nth-child(4) {
  transform: rotate(-14deg);
  left: 29%;
}
.home-page .foot {
  background: #000;
  width: 4.5vmin;
  height: 2vmin;
  border-radius: 100% 30% 10% 10%;
  top: 97%;
  left: 5%;
}
.home-page .foot + .foot {
  left: 18%;
  transform: rotate(-8deg);
}
.home-page .cape {
  width: 34.5vmin;
  height: 25vmin;
  top: 14%;
  left: 20%;
  overflow: hidden;
  transform: rotate(-2deg);
  transform-origin: left top;
  animation: up-down 5s ease-in-out 0s infinite alternate;
}
@keyframes up-down {
  30% {
    transform: rotate(2deg);
  }
  65% {
    transform: rotate(17deg);
  }
}
.home-page .cape-shape {
  background: #000;
  width: 36vmin;
  height: 26.5vmin;
  top: -0.75vmin;
  left: -0.5vmin;
  clip-path: polygon(0% 2%, 2% 2%, 4% 4%, 7% 8%, 11% 12%, 19% 18%, 25% 21%, 35% 25%, 45% 27%, 54% 30%, 59% 28%, 65% 27%, 68% 26%, 72% 28%, 75% 29%, 79% 34%, 82% 37%, 87% 39%, 91% 43%, 95% 47%, 97% 50%, 88% 46%, 83% 45%, 79% 46%, 77% 48%, 76% 50%, 76% 52%, 77% 52%, 79% 54%, 82% 56%, 85% 59%, 79% 58%, 75% 58%, 72% 59%, 71% 60%, 71% 61%, 70% 63%, 71% 67%, 72% 70%, 74% 76%, 76% 81%, 79% 86%, 81% 88%, 84% 91%, 87% 95%, 79% 92%, 69% 89%, 63% 84%, 58% 81%, 55% 78%, 54% 78%, 54% 79%, 55% 81%, 61% 96%, 57% 94%, 52% 89%, 48% 86%, 45% 85%, 43% 84%, 42% 85%, 40% 86%, 38% 85%, 36% 83%, 33% 80%, 31% 78%, 29% 78%, 27% 78%, 26% 79%, 26% 82%, 26% 85%, 28% 88%, 30% 94%, 26% 91%, 24% 88%, 22% 87%, 21% 88%, 21% 90%, 21% 95%, 21% 97%, 22% 98%, 18% 97%, 16% 94%, 13% 84%, 10% 72%, 6% 66%, 3% 63%, 0% 58%);
  transform: rotate(0deg);
  transition: 2s ease 0s;
  animation: wind 5s ease 0s infinite, rota 0.43s ease 0s infinite alternate;
}
@keyframes rota {
  50% {
    transform: rotate(0.75deg);
  }
}
@keyframes wind {
  50% {
    clip-path: polygon(0% 1%, 1% 1%, 3% 3%, 7% 5%, 11% 8%, 19% 9%, 25% 11%, 35% 11%, 45% 10%, 54% 9%, 59% 8%, 65% 10%, 68% 14%, 72% 18%, 75% 22%, 79% 28%, 82% 34%, 87% 39%, 91% 43%, 92% 47%, 95% 50%, 88% 46%, 83% 45%, 79% 46%, 77% 48%, 76% 50%, 76% 52%, 77% 52%, 79% 54%, 82% 55%, 85% 57%, 79% 58%, 75% 59%, 72% 62%, 71% 63%, 71% 65%, 70% 66%, 71% 67%, 72% 70%, 74% 76%, 76% 81%, 79% 86%, 81% 87%, 84% 92%, 85% 100%, 79% 95%, 69% 89%, 63% 84%, 58% 81%, 45% 58%, 54% 78%, 54% 79%, 55% 81%, 61% 96%, 52% 88%, 52% 89%, 48% 86%, 45% 85%, 43% 84%, 42% 89%, 40% 86%, 38% 85%, 36% 83%, 33% 80%, 33% 81%, 29% 78%, 27% 78%, 22% 72%, 26% 82%, 26% 85%, 28% 88%, 30% 94%, 26% 91%, 24% 88%, 22% 87%, 21% 88%, 21% 90%, 21% 95%, 21% 98%, 22% 100%, 19% 95%, 17% 91%, 13% 84%, 8% 75%, 6% 66%, 3% 63%, 0% 58%);
  }
}
.home-page .watchtower {
  width: 44vmin;
  height: 25%;
  background: #000;
  bottom: -9vmin;
  transform: rotate(0deg);
  right: -6vmin;
}
.home-page .watchtower:before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  left: -8vmin;
  top: 0vmin;
  border: 4vmin solid #fff0;
  border-color: #000 #000 #fff0 #fff0;
}
.home-page .watchtower:after {
  content: "";
  position: absolute;
  width: 30%;
  height: 200%;
  background: #000;
  top: -2vmin;
  border-radius: 5% 0 0 150%;
  right: 0;
}
.home-page .watchtower span {
  background: black;
  width: 3vmin;
  height: 1vmin;
  top: 31%;
  left: -6vmin;
  box-shadow: 3vmin 3vmin 0 0vmin;
}
.home-page .watchtower span + span {
  background: black;
  left: 13vmin;
  position: absolute;
  top: 14vmin;
  box-shadow: none;
  width: 100%;
  transform: rotate(34deg);
  height: 2vmin;
}
.home-page .watchtower span + span:before {
  content: "";
  background: black;
  width: 2vmin;
  height: 3vmin;
  position: absolute;
  right: 20vmin;
  top: -3vmin;
}

.app-contact .page-content {
  min-height: 600rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.app-contact .page-content .inner-content {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.app-contact .page-content form {
  margin-top: -20rem;
  max-width: 500rem;
  width: 100%;
}
.app-contact .page-content form h1 {
  margin-top: 0;
  position: relative;
}
.app-contact .page-content form h1:after {
  content: "";
  position: absolute;
  bottom: -0.3em;
  left: 0rem;
  height: 0.1em;
  width: 1.5em;
  background: #0cbaba;
}
.app-contact .page-content form p {
  margin-top: 32rem;
  font-size: 16rem;
}
.app-contact .page-content form textarea {
  width: 100%;
  font-family: "Didact Gothic";
  font-size: 14rem;
  background: #FBFBFB;
  border: 1rem solid #000000;
  resize: none;
  border-radius: 0rem;
  padding: 1em;
  box-sizing: border-box;
  outline: none;
}
.app-contact .page-content form textarea:focus::placeholder {
  color: transparent;
}
.app-contact .page-content form input {
  margin-top: 20rem;
  width: 100%;
}
.app-contact .page-content form .primary-btn {
  background: black;
  color: white;
  font-size: 14rem;
  border: none;
  border-radius: 0rem;
  padding: 1em;
  box-sizing: border-box;
  cursor: pointer;
  transition: all 0.2s ease;
  margin-top: 20rem;
  width: 100%;
}

.app-how-it-works .page-content {
  display: flex;
  align-items: center;
  justify-content: center;
}
.app-how-it-works .page-content .text-content {
  margin-top: 50rem;
  margin-bottom: 100rem;
  width: 70%;
  padding-bottom: 20rem;
  font-size: 14rem;
  line-height: 28rem;
}
.app-how-it-works .page-content .text-content h3 {
  font-size: 20rem;
  margin-bottom: 0;
  margin-top: 40rem;
}
.app-how-it-works .page-content .text-content img {
  width: 100%;
  height: auto;
}
.app-how-it-works .page-content .text-content .video-wrap {
  overflow: hidden;
  position: relative;
  display: flex;
  border-radius: 10rem;
}
.app-how-it-works .page-content .text-content .video-wrap::after {
  content: "";
  position: absolute;
  bottom: 0rem;
  left: 0;
  right: 0;
  height: 1rem;
  background: white;
}
.app-how-it-works .page-content .text-content video {
  width: 100%;
  height: auto;
  background-color: transparent !important;
}
.app-how-it-works .page-content .text-content p {
  margin-top: 12rem;
}
.app-how-it-works .page-content .text-content p img {
  width: 14rem;
  height: auto;
  margin: 0 2rem;
  margin-bottom: -1rem;
}
.app-how-it-works .page-content .text-navigation {
  right: 90rem;
  width: 300rem;
  top: 0rem;
  margin-top: 135rem;
  position: fixed;
}
.app-how-it-works .page-content .text-navigation ul li {
  margin-bottom: 10rem;
  font-size: 14rem;
  position: relative;
  list-style: none;
  padding-left: 15rem;
  font-weight: 600;
  line-height: 1.7;
  padding-left: 0;
  margin: 0;
}
.app-how-it-works .page-content .text-navigation ul li a {
  font-size: 14rem;
  padding: 10rem 0 10rem 25rem;
  display: block;
  color: black;
  text-decoration: none;
  border-left: 2rem solid #dce1fa;
}
.app-how-it-works .page-content .text-navigation ul li a.active {
  border-color: #0cbaba;
  color: #0cbaba;
}

@media screen and (max-width: 1340px) {
  .app-how-it-works .page-content .text-content {
    width: 60%;
  }
  .app-how-it-works .page-content .text-navigation {
    right: 20rem;
  }
}
@media screen and (max-width: 1020px) {
  .app-how-it-works .page-content .text-content {
    width: 100%;
  }
  .app-how-it-works .page-content .text-navigation {
    display: none;
  }
}
html {
  font-size: 0.065vw;
}
@media screen and (min-width: 2701px) {
  html {
    font-size: 0.032vw;
  }
}
@media screen and (min-width: 2001px) and (max-width: 2700px) {
  html {
    font-size: 0.038vw;
  }
}
@media screen and (min-width: 1801px) and (max-width: 2000px) {
  html {
    font-size: 0.042vw;
  }
}
@media screen and (min-width: 1601px) and (max-width: 1800px) {
  html {
    font-size: 0.048vw;
  }
}
@media screen and (min-width: 1481px) and (max-width: 1600px) {
  html {
    font-size: 0.052vw;
  }
}
@media screen and (max-width: 1480px) {
  html {
    font-size: 0.067vw;
  }
}
@media screen and (max-width: 950px) {
  html {
    font-size: 0.077vw;
  }
}

body {
  font-family: "Didact Gothic", sans-serif;
  margin: 0;
}

.inner-content ul, .inner-content ol {
  padding-left: 20rem;
}

.page {
  min-height: 100%;
  flex-direction: column;
  display: flex;
}
.page .page-content {
  width: 100%;
  flex-grow: 1;
}

.container {
  max-width: 1260rem;
  min-width: 1000rem;
  margin: 0 auto;
  padding: 0 30rem;
  box-sizing: border-box;
  width: 100%;
}

.inner-content {
  max-width: 1100rem;
  margin: 0 auto;
  margin-top: 60rem;
  margin-bottom: 120rem;
  line-height: 28rem;
  font-size: 14rem;
}
.inner-content p {
  margin-top: 20rem;
  font-size: 14rem;
}

body {
  margin: 0;
}

a {
  text-decoration: none;
}

button,
input {
  outline: none;
  padding: 0rem;
}

.list-style-none {
  list-style: none;
}

/*# sourceMappingURL=style.css.map */
