
* {
	margin: 0;
	padding: 0;
	text-decoration: none;
}

body{

}


#error-view{
	background-image: linear-gradient(black, black), url('https://i.giphy.com/media/BlcWQ9L2VfOFO/giphy.webp');
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-blend-mode: saturation;
}

#error-view-container {
	align-items: center;
	display: flex;
	flex-direction: column;
	height: 100vh;
	justify-content: ;
	margin: 0 auto;
	width: 100%;
}

#menu-box {
	background: #000;
	cursor: default;
	padding: 16px 0;
	position: relative;
	top: 66%;
	width: 100%;
}

#menu-box a {
	color: #fff;
	cursor: pointer;
	font-family: 'Bebas Neue';
	font-size: 32px;
	opacity: 1;
	padding: 16px 32px;
	transition: color .2s;
}

#menu-box a:hover {
	color: red;
}


/* ------- SAFETY ------- */


#safety-view {
	background: #000;
}

#safety-view-container {
	align-items: center;
	display: flex;
	height: 100vh;
	justify-content: center;
	margin: 0 auto;
	width: 95%;
}

#safety-view-box {
	filter: blur(3px);
	transition: transform .3s ease-in-out;
}

#safety-view-box:hover {
	filter: blur(0px);
	transform: scale(1.2);
}

#safety-message, #safety-message-japanese {
	color: red;
	text-align: center;
}

#safety-message {
	font-size: 24px;
	animation: flash 1s infinite alternate;
}

#safety-message-japanese {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 16px;
	position: relative;
	top: -26px;
	animation: flash 1s infinite alternate-reverse;
}

@keyframes flash {
    to {
        opacity: 0;
    }
}





/* ------- STAIRS ------- */


#stairs-view-container {
	align-items: center;
	background-image: url('images/kool_down.gif');
	background-repeat: no-repeat;
	background-size: 100% 100%;
	display: flex;
	filter: grayscale(100%)  invert(100%) contrast(120%);
	height: 100vh;
	justify-content: center;
	position: fixed;
	transform: scale(1.5);
	width: 100vw;
} 

#stair-message {
	background: #fff;
	filter: invert(0%) blur(1px);
	opacity: 1;
	padding: 110px 75px;
	position: relative;
	right: 80px;
	visibility: hidden;
	animation: redact;
	animation-duration: 3.5s;
	animation-iteration-count: infinite;
}

@keyframes redact {
	30% {
		visibility: hidden;
	}
	50% {
		visibility: visible;
	}
	68%{
		visibility: hidden;
	}
}





/* ------- BLUE SCREEN ------- */

@font-face {
  font-family: bluefont;
  src: url(fonts/ms-blue-screen.ttf);
}

#blue-view {
	background: #0b24fb;
	font-family: bluefont;
}

#blue-view-container {
	align-items: center;
	display: flex;
	height: 100vh;
	justify-content: center;
	text-align: center;
	width: 100%;
}

#blue-box {
	font-size: 24px;
	width:80%;
}

#blue-title {
	background: #ccc;
	color: #0b24fb;
	padding: 0px 8px;
	text-align: center;
}

#blue-message {
	color: #fff;
	margin-top: 24px;
	text-align: left;
}

#any-key {
	display: block;
	text-align: center;
}

#underscore {
	animation: tab-flash 1s step-start infinite;
}

@keyframes tab-flash {
	50% {
		opacity: 0;
	}
}







/* ------- Emergency ------- */

.strike {
	text-decoration: line-through;
}






/* ------- Mundo ------- */

#mundo-view {
	background: #000;
}

.image-container {
	display: inline-flex;
	justify-content: center;
	width: 100vw;
	vertical-align: top;
}

.image-item img {
	display: block;
	height: 100vh;
	vertical-align: top;
	width: 100%;
}






/* ------- Finance ------- */

#finance-view {
	background: #fff;
}

#finance-view-container {
	align-items: center;
	display: flex;
	height: 100vh;
	justify-content: center;
	width: 100vw;
}

#finance-image-item {
	height: 100vh;
	position: fixed;
	animation: fat-mode 60s infinite  ease-in-out;
}

@keyframes fat-mode {
	0% {width: 100%;}
  	50% {width: 200%;}
  	100% {width: 100%;}
}

#finance-image-item img {
	height: 100%;
	width: 100%;
	vertical-align: top;
	filter: invert(1)
}

#finance-image-item button {
	color: #fff;
	z-index: 1000;
}







/* ------- Game ------- */

#game-view {
	background: #000;
}

#game-view-container {
	align-items: center;
	display: flex;
	height: 100vh;
	flex-direction: column;
	justify-content: center;
	width: 100vw;
}

#game-menu {
	height: 50px;
	text-align: center;
	width: 100%;
}

#game-menu button{
	position: relative;
	top: 10px;
	padding: 4px 8px;
}

#game-image-item{
	background-image: url('images/chase-hq.gif');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	height: 100vh;
	width: 100vw;
}





/* ------- Prize ------- */

#prize-view {
	background: #eee;
	font-family: arial;
}

#prize-view-container {
	align-items: center;
	display: flex;
	height: ;
	justify-content: center;
	width: 100vw;
	flex-wrap:wrap;
}

.prize-pop-up {
	background: #e5e2d0;
	padding: 32px;
	text-align: center;
	border: 4px solid #0e55fb;
	/*animation: attention .2s infinite;*/
}

@keyframes attention {
	from {border: 4px solid #0e55fb;}
  	to {border: 4px solid #0eccfb;}
}

.prize-pop-up h2 {
	margin-bottom: 16px;
}

.prize-pop-up button{
	margin-top: 16px;
	padding: 8px;
	border-radius: 0;
}

.prize-pop-up button:hover {
	opacity: 0.8;
}







/* ------- Windos ------- */

#windos-view {
}

#windos-view-container {
	align-items: center;
	display: ;
	height: 100vh;
	justify-content: center;
	width: 100vw;
}

#windos-view-container img {
	height: 100%;
	width: 100%;
}

#windos-view-container a {
	background: transparent;
	height: 14%;
	left: 2%;
	position: absolute;
	width: 5.5%;
}
