:root {
  				--x-offset: 155px;
  				--y-offset: 50px;
  				--animation-duration: 3s;
  				--fade-in-delay: 1.5s;
  				white-space: pre-line;
  				
			}

			@font-face {
                font-family: 'main';
                src: url('/fonts/dg.woff');
            }

            @font-face {
                font-family: 'serif';
                src: url('/fonts/libeserif.ttf');
            }

            @font-face {
                font-family: 'pixel';
                src: url('/fonts/pixel.woff');
            }
			
			@keyframes background {
				0% {background-position: 0 bottom}
				50% {background-position: 125% bottom}
				100% {background-position: 0 bottom}
			}

			@keyframes rotate {
				from {transform: rotate(0deg);}
				to {transform: rotate(360deg);}
			}
			
			@keyframes vertical {
			  from { transform: translateY(calc(-0.1 * var(--y-offset))); }
			  to   { transform: translateY(var(--y-offset)); }
			}
			
			@keyframes horizontal {
			  from { transform: translateX(calc(-1.3 * var(--x-offset))); }
			  to   { transform: translateX(var(--x-offset)); }
			}
            
            body {
                margin: 0;
                font-family: 'main';
				background: black url('/img/bg.png') repeat-x fixed;
				animation: background 10s infinite ease-in-out forwards;
				color: #FADC30;
                padding-top: 3%;
                text-align: center;
                text-shadow: black 1px 1px;
            }

            script {
            	padding-left: 42%;
            }
            
            #x {
              --name: horizontal;
              --duration: var(--animation-duration);
              --delay: calc(-0.225 * var(--animation-duration));
            }
            
            #y {
              --name: vertical;
              --duration: calc(0.5 * var(--animation-duration));
              --delay: 0.25s;
            }
            
            #x, #y {
              animation: var(--duration) ease-in-out var(--delay) alternate infinite var(--name);
            }

			#logo {
				position: relative;
            }

			.video-container {
			    position: relative;
			    width: 100%;
			    height: 100vh;
			    overflow: hidden;
			}
			
			.video-container video {
			    object-fit: cover;
			    width: 100vw;
			    height: 100vh;
			    position: fixed;
			    top: 0;
			    left: 0;
			}
			
            .container {
            	position: relative;
                left: 50%;
                transform: translate(-50%, 0%);
                width: 700px;
                height: 100%;
                background: black url('/img/blue.png') repeat fixed;
				border: 2px solid white;
                border-radius: 4px;
                box-shadow: inset 0 0 0 2px black;
            }
            
           .screen {
                position: relative;
                left: 50%;
                transform: translate(-50%, 0%);
                width: 640px;
                height: 480px;
				overflow: hidden;
				border-top: 2px solid black; border-right: 2px solid black; border-bottom: 2px solid black; border-left: 2px solid black;
				box-shadow: 0 0 0 2px #e0e0e0;
                border-radius: 4px;
			}
           
           .textbox1 {
           		position: absolute;
                font-size: 30px;
                margin: 48% 5% 5% 5%;
                padding: 7px;
                font-family: pixel;
                text-align: justify;
                text-justify: inter-ideograph;
                background-image: url('/img/textbox.png');
                border: 2px solid white;
                border-radius: 0px;
                box-shadow: 3px 5px 8px 4px black;
            }
          
            .textbox2 {
                font-size: 16px;
                position: relative;
                left: 50%;
                margin-bottom: 5%;
                transform: translate(-50%, 0%);
                width: 601px;
                padding-left: 20px;
                padding-right: 20px;
                text-align: justify;
                text-justify: inter-ideograph;
                white-space: pre-line;
                background: black;
                border: 2px solid black;
                border-radius: 4px;
                box-shadow: inset 0 0 0 2px #cacaca;
            }

          	a {
          		color: #FF80CA;
          	}