body {
  margin: 0;
  background-color: #041626;
  font-size: 1.3em;
  overscroll-behavior: none;
  cursor: progress;
}

#loading {
  width: fit-content;
  color: #2c5c88;
  font-size: 1.3em;
  top: 20vh;
  margin: auto;
  font-family: sans-serif;
}

#loadingMessage {
  margin-bottom: 0.5em;
}

@keyframes perspective {
  from {
    transform: rotateX(0deg) perspective(0px);
    filter: drop-shadow(0px 00px 0px #0f2437);
  }
  to {
    transform: rotateX(40deg) perspective(150px);
    filter: drop-shadow(0px 10px 0px #0f2437);
  }
}

#labyShadow {
  width: 230px;
  height: 230px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 20vh;
  margin-bottom: 5vh;
  animation: perspective 60s infinite;
}

@keyframes rotation {
  from {
    transform: rotateZ(0deg);
  }
  to {
    transform: rotateZ(360deg);
  }
}

#labyTable {
  border-collapse: collapse;
  animation: rotation 60s infinite;
  border: none;
}

#labyTable td {
  width: 10px;
  height: 10px;
  transition: background-color 1s;
  border: none;
  padding: 0;
}

.wall {
  background-color: transparent;
}

.ground {
  background-color: #214464;
}

#container {
  position: absolute;
  z-index: 0;
  cursor: move;
}

@keyframes escaped{
  0% {
    opacity: 0%;
    top: 90vh; 
  }
  100% {
    opacity: 100%;
    top: 30vh;
  }
}

#message {
  display: none;
  position: absolute;
  left: 0;
  width: 100%;
  background: transparent;
  justify-content: center;
  z-index: 1;
  color: gray;
  font-family: serif;
}

#message a {
  color: inherit;
}

#message.escaped {
  display: block; 
  opacity: 100%;
  font-size: 4vh;
  text-align: center;
  top: 30vh;
  animation: escaped 5s;
}