body {
  background-color: black;
  font-family: TouchPadPro, sans-serif;
  margin: 0;
  padding: 0; }

*:focus {
  outline: none; }

select:active,
select:hover {
  outline: none; }

a:link,
a:visited,
a:hover,
a:active {
  color: black; }

p {
  margin: 0;
  font-size: 30px;
  text-align: center; }

@font-face {
  font-family: TouchPadPro;
  src: url("/resources/fonts/touchpadpro.ttf"); }
@font-face {
  font-family: TouchPadPro;
  src: url("/resources/fonts/touchpadpro.ttf");
  font-weight: bold; }
@keyframes spaceboots {
  0% {
    transform: translate(2px, 1px) rotate(0deg); }
  10% {
    transform: translate(-1px, -2px) rotate(-1deg); }
  20% {
    transform: translate(-3px, 0px) rotate(1deg); }
  30% {
    transform: translate(0px, 2px) rotate(0deg); }
  40% {
    transform: translate(1px, -1px) rotate(1deg); }
  50% {
    transform: translate(-1px, 2px) rotate(-1deg); }
  60% {
    transform: translate(-3px, 1px) rotate(0deg); }
  70% {
    transform: translate(2px, 1px) rotate(-1deg); }
  80% {
    transform: translate(-1px, -1px) rotate(1deg); }
  90% {
    transform: translate(2px, 2px) rotate(0deg); }
  100% {
    transform: translate(2px, 1px) rotate(0deg); } }
.shake {
  animation-name: spaceboots;
  animation-duration: 1s;
  transform-origin: 50% 50%;
  animation-iteration-count: infinite;
  animation-timing-function: linear; }

.view.landing {
  width: 100%;
  height: 100%;
  background-color: black;
  margin: 0;
  padding: 0;
  font-size: 18pt;
  color: white;
  line-height: 1.5;
  letter-spacing: 1px; }
  @media not all and (min-width: 667px) {
    .view.landing {
      font-size: 15pt; } }
  .view.landing a {
    color: white;
    text-decoration: none; }
  .view.landing a:link, .view.landing a:visited {
    border-bottom: 2px solid lightgrey; }
  .view.landing a:focus, .view.landing a:hover, .view.landing a:active {
    color: lightgrey;
    border-bottom: 2px solid lightgrey; }
  .view.landing a.nodecorationlink {
    border-bottom: none; }
  .view.landing section.language {
    z-index: 9999;
    position: absolute;
    right: 12px;
    top: 6px;
    font-size: 13pt; }
    .view.landing section.language .language-select {
      padding: 10px;
      background: black;
      text-align: right;
      position: absolute;
      z-index: 999;
      top: 0;
      right: 0;
      border-radius: 10px; }
      .view.landing section.language .language-select div {
        white-space: nowrap;
        line-height: 1.4; }
  .view.landing .container {
    position: relative;
    margin: 0;
    padding: 40px 0 40px 0;
    overflow: hidden; }
    .view.landing .container > section {
      max-width: 960px;
      margin: 0 auto;
      clear: both;
      padding-left: 40px;
      padding-right: 40px;
      padding-top: 40px;
      padding-bottom: 40px; }
      @media not all and (min-width: 667px) {
        .view.landing .container > section {
          padding-left: 20px;
          padding-right: 20px;
          padding-top: 20px;
          padding-bottom: 20px; } }
    .view.landing .container .title {
      text-align: center; }
      .view.landing .container .title img {
        width: 200px;
        height: auto; }
        @media not all and (min-width: 667px) {
          .view.landing .container .title img {
            width: 33%;
            height: auto; } }
    .view.landing .container .embed-container {
      position: relative;
      padding-bottom: 56.25%;
      overflow: hidden;
      max-width: 100%;
      height: auto;
      border: 2px solid #333333;
      border-radius: 20px;
      background-color: black;
      z-index: 0; }
    .view.landing .container .embed-container iframe, .view.landing .container .embed-container object, .view.landing .container .embed-container embed {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: black;
      z-index: -1; }
    .view.landing .container .app-buttons {
      text-align: center; }
      .view.landing .container .app-buttons a {
        display: inline-block;
        padding-right: 5px;
        padding-left: 5px; }
    .view.landing .container #description img {
      display: block;
      float: left;
      padding-right: 40px; }
      @media not all and (min-width: 667px) {
        .view.landing .container #description img {
          float: none;
          margin: 0 auto;
          padding-right: 0px;
          padding-bottom: 40px; } }
    .view.landing .container #description .descriptiontext {
      margin-left: 200px; }
      @media not all and (min-width: 667px) {
        .view.landing .container #description .descriptiontext {
          margin-left: 0px; } }
    @media not all and (min-width: 667px) {
      .view.landing .container #description {
        margin-bottom: 20px; } }
    .view.landing .container section.phone .phone {
      margin-left: auto;
      margin-right: auto;
      position: relative;
      width: 100%;
      max-width: 700px; }
      .view.landing .container section.phone .phone .background {
        position: absolute; }
        .view.landing .container section.phone .phone .background, .view.landing .container section.phone .phone .background img {
          width: 100%;
          height: auto; }
      .view.landing .container section.phone .phone .screenshot {
        width: 100%;
        height: 100%;
        position: relative;
        text-align: center; }
        .view.landing .container section.phone .phone .screenshot img {
          position: relative;
          margin-top: 3%;
          width: 76%;
          height: auto; }
    .view.landing .container section.quotes figure {
      text-align: center;
      margin-bottom: 40px;
      margin-top: 40px; }
      @media not all and (min-width: 667px) {
        .view.landing .container section.quotes figure {
          font-size: 15pt; } }
    .view.landing .container section.quotes blockquote {
      font-size: 30pt;
      margin: 0; }
      @media not all and (min-width: 667px) {
        .view.landing .container section.quotes blockquote {
          font-size: 20pt; } }
    .view.landing .container section.laurels {
      clear: both;
      display: block;
      margin: 0 auto;
      text-align: center; }
      .view.landing .container section.laurels div {
        padding: 20px;
        display: inline-block;
        vertical-align: middle; }
        @media only screen and (max-width: 400px) {
          .view.landing .container section.laurels div {
            padding: 0px; } }
        @media not all and (min-width: 667px) {
          .view.landing .container section.laurels div {
            padding: 10px; } }
      .view.landing .container section.laurels img {
        width: 128px; }
    .view.landing .container .swiper-container {
      width: 90%;
      height: 100%;
      overflow: visible;
      max-width: 700px; }
      .view.landing .container .swiper-container .swiper-slide {
        text-align: center;
        width: 100%; }
        .view.landing .container .swiper-container .swiper-slide img {
          width: 100%;
          border: 2px solid #333333;
          border-radius: 20px; }
      .view.landing .container .swiper-container .swiper-button-next, .view.landing .container .swiper-container .swiper-button-prev {
        position: absolute;
        top: 0;
        bottom: 0;
        margin: 0;
        width: 100%;
        height: 100%; }
      .view.landing .container .swiper-container .swiper-button-next {
        left: 100%;
        right: 200%; }
      .view.landing .container .swiper-container .swiper-button-prev {
        left: -100%;
        right: 0%; }
    .view.landing .container section.links {
      text-align: center; }
      .view.landing .container section.links a {
        margin-right: 20px;
        margin-left: 20px; }
        @media not all and (min-width: 667px) {
          .view.landing .container section.links a {
            margin-right: 5px;
            margin-left: 5px; } }
    .view.landing .container section.footer-logos {
      text-align: center; }
      .view.landing .container section.footer-logos img {
        padding-right: 20px;
        padding-left: 20px;
        height: 100px; }

.view.webgl-instance {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 72px;
  top: 0; }
  .view.webgl-instance .webgl-container {
    width: 100%;
    height: 100%;
    line-height: 0; }
    .view.webgl-instance .webgl-container iframe {
      width: 100%;
      height: 100%;
      border: 0; }
  .view.webgl-instance footer {
    background: black;
    color: white;
    height: 72px;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    box-sizing: border-box;
    font-size: 18pt;
    padding-left: 32px;
    padding-right: 32px;
    display: flex;
    justify-content: space-between; }
    .view.webgl-instance footer .footer-title {
      /* position: absolute;
       top: 0;
       bottom: 0;
       left: 48px;*/
      padding: 16px 0; }
      .view.webgl-instance footer .footer-title h1 {
        padding: 0;
        margin: 0;
        font-size: 40px;
        /*line-height:0px;*/
        height: 100%; }
        .view.webgl-instance footer .footer-title h1 a, .view.webgl-instance footer .footer-title h1 a:active, .view.webgl-instance footer .footer-title h1 a:hover, .view.webgl-instance footer .footer-title h1 a:visited {
          color: white;
          text-decoration: none; }
    .view.webgl-instance footer .footer-nowavailableon {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100%; }
      .view.webgl-instance footer .footer-nowavailableon .storebuttons {
        margin-left: 8px;
        display: flex;
        justify-content: center;
        align-items: center; }
        .view.webgl-instance footer .footer-nowavailableon .storebuttons a, .view.webgl-instance footer .footer-nowavailableon .storebuttons a:active, .view.webgl-instance footer .footer-nowavailableon .storebuttons a:hover, .view.webgl-instance footer .footer-nowavailableon .storebuttons a:visited {
          text-decoration: none; }
        .view.webgl-instance footer .footer-nowavailableon .storebuttons .storebutton {
          background: white;
          color: black;
          margin: 0 8px;
          padding: 4px 15px;
          border-radius: 8px; }
    .view.webgl-instance footer .footer-logos {
      padding: 16px 0;
      right: 48px;
      top: 0;
      bottom: 0;
      display: flex;
      justify-content: center; }
      .view.webgl-instance footer .footer-logos img {
        width: auto;
        margin-left: 32px; }
    @media only screen and (max-width: 480px) {
      .view.webgl-instance footer .footer-logos .notplayables {
        display: none; } }
    @media only screen and (max-width: 960px) {
      .view.webgl-instance footer .footer-nowavailableon {
        display: none; } }
    @media only screen and (max-width: 1280px) {
      .view.webgl-instance footer .footer-nowavailableon-text {
        display: none; } }

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