@import url('https://fonts.googleapis.com/css?family=Montserrat:700');

body {
	background-color: #111;
	background-image: radial-gradient(#333, #111);
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
	color: #fff;
	text-align: center;
	width: 100vw;
	font-weight: 700;
	overflow: hidden;
	font-family: 'Montserrat', sans-serif;
}

#fly-in {
	font-size: 6em;
	margin: 40vh auto;
	height: 20vh;
	text-transform: uppercase;
}

	#fly-in span {
		display: block;
		font-size: .6em;
		opacity: .8;
	}

	#fly-in div {
		position: absolute;
		margin: 2vh 0;
		opacity: 0;
		left: 10vw;
		width: 80vw;
		animation: switch 50s linear infinite;
	}

		#fly-in div:nth-child(2) {
			animation-delay: 5s
		}

		#fly-in div:nth-child(3) {
			animation-delay: 10s
		}

		#fly-in div:nth-child(4) {
			animation-delay: 15s
		}

		#fly-in div:nth-child(5) {
			animation-delay: 20s
		}

        #fly-in div:nth-child(6) {
            animation-delay: 25s
        }

        #fly-in div:nth-child(7) {
            animation-delay: 30s
        }

        #fly-in div:nth-child(8) {
            animation-delay: 35s
        }

        #fly-in div:nth-child(9) {
            animation-delay: 40s
        }

        #fly-in div:nth-child(10) {
            animation-delay: 45s
        }

@keyframes switch {
	0% {
		opacity: 0;
		filter: blur(20px);
		transform: scale(12)
	}

	3% {
		opacity: 1;
		filter: blur(0);
		transform: scale(1)
	}

	10% {
		opacity: 1;
		filter: blur(0);
		transform: scale(.9)
	}

	13% {
		opacity: 0;
		filter: blur(10px);
		transform: scale(.1)
	}

	80% {
		opacity: 0
	}

	100% {
		opacity: 0
	}
}

.btm_text {
	position: absolute;
	bottom: 50px;
	font-size: 2em;
}

	.btm_text a {
		color: #ffee88;
	}

		.btm_text a:hover {
			color: #ffee88;
		}
