body {
 background-color: black;
 text-align: center;
 -webkit-user-select: none;
 -ms-user-select: none;
 user-select: none;
}
form {
 display: inline-block;
 text-align: left;
 background-color: #efebdc;
 min-width: 500px;
 width: 50%;
 padding: 10px;
}
.overlayLinks {
 position: absolute;
 top: 0px;
 left: 50%;
 right: 10%;
 font-size: 1.2em;
 text-align: center;
 z-index: 10;
}
.overlayLinks a {
 font-weight: bold;
 text-decoration: none;
 margin-right: 10px;
 margin-left: 10px;
 -webkit-filter: drop-shadow(0px 0px 3px white) drop-shadow(0px 0px 3px white);
 filter: drop-shadow(0px 0px 3px white) drop-shadow(0px 0px 3px white);
}
.link {
 position: absolute;
 cursor: pointer;
 background-image: url('arrows/forward.svg');
 background-size: 50px auto;
 background-repeat: no-repeat;
 background-position: center;
 z-index : 10;
 transition: 0.3s;
 -webkit-filter: drop-shadow(0px 0px 8px transparent) drop-shadow(0px 0px 8px transparent);
 filter: drop-shadow(0px 0px 8px transparent) drop-shadow(0px 0px 8px transparent);
}
.link:hover {
 -webkit-filter: drop-shadow(0px 0px 8px #bedc0a) drop-shadow(0px 0px 8px #bedc0a);
 filter: drop-shadow(0px 0px 8px #bedc0a) drop-shadow(0px 0px 8px #bedc0a);
}
.link:active {
 background-size: 43px auto;
}
.link.up {
 position: fixed;
 top: 0px;
 left: 0px;
 right: 0px;
 height: 10%;
 background-image: url('arrows/up.svg');
}
.link.down {
 position: fixed;
 bottom: 0px;
 left: 0px;
 right: 0px;
 height: 10%;
 background-image: url('arrows/down.svg');
}
.link.left {
 position: fixed;
 top: 0px;
 left: 0px;
 bottom: 0px;
 width: 10%;
 background-image: url('arrows/left.svg');
}
.link.right {
 position:fixed;
 top: 0px;
 right: 0px;
 bottom: 0px;
 width: 10%;
 background-image: url('arrows/right.svg');
}
.link.scrollLeft {
 position: fixed;
 top: 0px;
 left: 0px;
 bottom: 0px;
 width: 10%;
 background-image: url('arrows/triangleLeft.svg');
 pointer-events: none;
}
.link.scrollRight {
 position: fixed;
 top: 0px;
 right: 0px;
 bottom: 0px;
 width: 10%;
 background-image: url('arrows/triangleRight.svg');
 pointer-events: none;
}
.link.scrollUp {
 position: fixed;
 top: 0px;
 left: 0px;
 right: 0px;
 height: 10%;
 background-image: url('arrows/triangleUp.svg');
 pointer-events: none;
}
.link.scrollDown {
 position: fixed;
 bottom: 0px;
 left: 0px;
 right: 0px;
 height: 10%;
 background-image: url('arrows/triangleDown.svg');
 pointer-events: none;
}
.link.upward {
 background-image: url('arrows/up.svg');
}
.link.downward {
 background-image: url('arrows/down.svg');
}
.link.leftward {
 background-image: url('arrows/left.svg');
}
.link.rightward {
 background-image: url('arrows/right.svg');
}
.link.forward {
 background-image: url('arrows/forward.svg');
}
.link.backward {
 background-image: url('arrows/backward.svg');
}
.link.turn {
 background-image: url('arrows/turn.svg');
}
.link.return {
 -webkit-filter: grayscale(40%) drop-shadow(0px 0px 8px transparent) drop-shadow(0px 0px 8px transparent);
 filter: grayscale(40%) drop-shadow(0px 0px 8px transparent) drop-shadow(0px 0px 8px transparent);
}
.link.return:hover {
 -webkit-filter: grayscale(40%) drop-shadow(0px 0px 8px black) drop-shadow(0px 0px 8px black);
 filter: grayscale(40%) drop-shadow(0px 0px 8px black) drop-shadow(0px 0px 8px black);
}
.easteregg {
 position: absolute;
 width: 5vw;
 height: 5vw;
 margin-left: -2.5vw;
 margin-top: -2.5vw;
 border: 2px solid #00aff0;
 background-size: 100% 100%;
 border-radius: 100%;
 cursor: pointer;
 pointer-events: all;
 z-index: 20;
}
.easteregg span {
 display: none;
}
.easteregg:hover {
 position: absolute;
 width: 15vw;
 height: 15vw;
 margin-left: -7.5vw;
 margin-top: -7.5vw;
 border: 2px solid #bedc0a;
}
.easteregg:hover span {
 display: inline-block;
 position: absolute;
 top: 15.3vw;
 left: -2vw;
 right: -2vw;
 font-size: 1.5vw;
 font-weight: bold;
 color: black;
 line-height: 1.5vw;
 filter: drop-shadow(0px 0px 5px white) drop-shadow(0px 0px 5px white) drop-shadow(0px 0px 5px white);
}
.videobackground {
 background-color: rgba(0, 0, 0, 0.8);
 position: fixed;
 top: 0px;
 left: 0px;
 right: 0px;
 bottom: 0px;
 backdrop-filter: blur(6px);
 z-index: 40;
}
.videobackground video {
 position: absolute;
}
.videobackground iframe {
 position: absolute;
 top: 3%;
 left: 3%;
 width: 94%;
 height: 94%;
}
.videobackground .close {
 position: absolute;
 top: 0px;
 right: 0px;
 font-size: 3vw;
 color: #00aff0;
 z-index: 40;
 text-decoration: none;
 font-weight: bold;
 padding: 3px;
 cursor: pointer;
 width: 3vw;
}
.progressBG {
 position: absolute;
 left: 30px;
 right: 30px;
 bottom: 20px;
 border: 2px solid #00aff0;
 background-color: rgba(0, 0, 0, 0.5);
 height: 20px;
 border-radius: 10px;
 overflow: hidden;
 opacity: 0;
}
.progressBar {
 position: absolute;
 top: 0px;
 left: 0px;
 bottom: 0px;
 width: 0%;
 background-color: #bedc0a;
}
