@charset "utf-8";
/* CSS Document */

body
{
	background-color:#020047;
}
.bigdiv
{
	position:relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, 50%);
	height: 320px;
	width:320px;
	
}
.layer1
{
	position: absolute;
	top:0;
	left:0;
	height: 320px;
	width:320px;
	z-index:1;
}
.layer2
{
	position: absolute;
	top:0;
	left:0;
	height: 320px;
	width:320px;
	z-index:2;
}
.layer3
{
	position: absolute;
	top:0;
	left:0;
	height: 320px;
	width: 320px;
	z-index:3;
}

.layer1animate1
{
	animation: rotate1 5s infinite;
	animation-timing-function: linear;
}

@keyframes rotate1
{
	0%
	{
		transform:rotate(0deg);
	}
	100%
	{
		transform:rotate(360deg);
	}
}

.layer1animate2
{
	animation: rotate2 5s infinite;
	animation-timing-function: linear;
}

@keyframes rotate2
{
	0%
	{
		transform:rotate(360deg);
	}
	100%
	{
		transform:rotate(0deg);
	}
}
.layer1animate3
{
	animation: rotate3 5s infinite;
	animation-timing-function: linear;
}

@keyframes rotate3
{
	0%
	{
		transform:rotate(0deg);
	}
	100%
	{
		transform:rotate(360deg);
	}
}
.layer4
{
	position: absolute;
	top:0;
	left:0;
	height: 320px;
	width: 320px;
	z-index:4;	
}
@font-face {
    font-family: test;
    src: url("Kenney Rocket.ttf");
}
.font
{
	font-family:test;
}
#matx{
	position:absolute;
	left:0%;
	top:0px;
color:#FFFFFF;
width:100%;
height: 100%;
overflow: hidden;
text-shadow: rgba(255, 255, 255, .8) 0px 0px 4px;

}
@-webkit-keyframes fadeing{
0%   { opacity: 0.2; }
100% { opacity: 0; }
}
@-webkit-keyframes falling{
from {top: -250px;}
to  {top: 388px;}
}
#matx div{
position: absolute; 
top: 0;
text-transform: lowercase;
font-family:test;
-webkit-transform:rotate(90deg);
-webkit-animation-name: falling, fadeing;
-webkit-animation-timing-function: ease-out;   
-webkit-animation-iteration-count: infinite; 
-webkit-animation-direction: normal;
z-index:-3; 
}
.t1{
-webkit-animation-duration: 4s;
}
.t2{
-webkit-animation-duration: 6s;
}
.t3{
-webkit-animation-duration: 8s;
}
.t4{
-webkit-animation-duration: 10s;
}
.t5{ 
-webkit-animation-duration: 13s;
}
}#tagline {
	position: relative;
	top: 80%;
	left: 50%;
	
}