body{
	background:black;
	color:white
}
.main-content{
	height:100vh;
	position:relative;
	text-align:center;
	width:100%
}
.main-content h1{
	animation:2s explode_title infinite;
	font-family:"Raleway";
	font-size:40px;
	font-weight:400;
	position:absolute;
	text-transform:uppercase;
	top:150px;
	transform:translate3d(0, 0, 0);
	width:100%
}
.main-content .bounced-word{
	color:#56baff;
	display:block;
	font-family:"Titillium Web";
	font-size:40px;
	font-weight:600;
	position:absolute;
	text-align:center;
	text-transform:uppercase;
	top:230px;
	transform:translate3d(0, -200px, 0);
	width:100%
}
.main-content .anim_1{
	animation:2s bounced-word infinite, 6s hide infinite
}
.main-content .anim_2{
	animation:2s bounced-word infinite, 6s hidetwo infinite
}
.main-content .anim_3{
	animation:2s bounced-word infinite, 6s hidethree infinite
}
.main-content .anim_4{
	animation:2s bounced-word infinite, 8s hidefour infinite
}
@keyframes explode_title{
	10%{
		transform:scaleY(0.2);
		transform-origin:0 bottom 0
	}
	20%{
	transform:scaleY(1.3);
		transform-origin:0 bottom 0
	}
	30%{
	transform:scaleY(0.7);
		transform-origin:0 bottom 0
	}
	40%{
		transform:scaleY(1);
		transform-origin:0 bottom 0
	}
	100%{
		transform:scaleY(1);
		transform-origin:0 bottom 0
	}
}
@keyframes bounced-word{
	8%{
		transform:translate3d(0, -45px, 0) scaleY(0.4);
		transform-origin:left bottom 0
	}
	25%{
		transform:translate3d(0, -110px, 0) scaleY(1.4)
	}
	40%{
		transform:translate3d(0, 0, 0) scaleY(0.6);
		transform-origin:left bottom 0
	}
	50%{
		transform:translate3d(0, 0, 0) scaleY(1.2);
		transform-origin:left bottom 0
	}
	60%{
		transform:translate3d(0, 0, 0) scaleY(1);
		transform-origin:left bottom 0
	}
	80%{
		opacity:1;
		transform:translate3d(0, 0, 0)
	}
	100%{
		opacity:0;
		transform:translate3d(0, 50px, 0)
	}
}
@keyframes hide{
	0%, 32%{
		visibility:visible
	}
	33%, 67%{
		visibility:hidden
	}
	68%, 100%{
		visibility:hidden
	}
/*
	0%, 24%{
		visibility:visible
	}
	25%, 50%{
		visibility:hidden
	}
	50%, 75%{
		visibility:hidden
	}
	75%, 100%{
		visibility:hidden
	}
*/
}
@keyframes hidetwo{
	0%, 31%{
		visibility:hidden
	}
	32%, 65%{
		visibility:visible
	}
	66%, 100%{
		visibility:hidden
	}
/*	0%, 25%{
		visibility:hidden
	}
	26%, 49%{
		visibility:visible
	}
	50%, 75%{
		visibility:hidden
	}
	75%, 100%{
		visibility:hidden
	}
*/
}
@keyframes hidethree{
	0%, 32%{
		visibility:hidden
	}
	33%, 67%{
		visibility:hidden
	}
	68%, 100%{
		visibility:visible
	}
/*	0%, 25%{
		visibility:hidden
	}
	25%, 50%{
		visibility:hidden
	}
	51%, 74%{
		visibility:visible
	}
	75%, 100%{
		visibility:hidden
	}*/
}
@keyframes hidefour{
	0%, 25%{
		visibility:hidden
	}
	25%, 50%{
		visibility:hidden
	}
	50%, 75%{
		visibility:hidden
	}
	76%, 100%{
		visibility:hidden
	}
}
/*# sourceMappingURL=index2.css.map */
