@charset "UTF-8";

@-webkit-keyframes bar01 {
	0% {
		-webkit-transform: translateY(5px) rotate(15deg);
	}
	50% {
		-webkit-transform: translateY(5px) rotate(0);
	}
	100% {
		-webkit-transform: translateY(0) rotate(0);
	}
}
@keyframes bar01 {
	0% {
		transform: translateY(5px) rotate(15deg);
	}
	50% {
		transform: translateY(5px) rotate(0);
	}
	100% {
		transform: translateY(0) rotate(0);
	}
}

@-webkit-keyframes active-bar01 {
	0% {
		-webkit-transform: translateY(0) rotate(0);
	}
	50% {
		-webkit-transform: translateY(5px) rotate(0);
	}
	100% {
		-webkit-transform: translateY(5px) rotate(15deg);
	}
}
@keyframes active-bar01 {
	0% {
		transform: translateY(0) rotate(0);
	}
	50% {
		transform: translateY(5px) rotate(0);
	}
	100% {
		transform: translateY(5px) rotate(15deg);
	}
}

@-webkit-keyframes bar02 {
	0% {
		-webkit-transform: translateY(-5px) rotate(-15deg);
  }
	50% {
		-webkit-transform: translateY(-5px) rotate(0);
	}
	100% {
		-webkit-transform: translateY(0) rotate(0);
	}
}
@keyframes bar02 {
	0% {
		transform: translateY(-5px) rotate(-15deg);
	}
	50% {
		transform: translateY(-5px) rotate(0);
	}
	100% {
		transform: translateY(0) rotate(0);
	}
}

@-webkit-keyframes active-bar02 {
	0% {
		-webkit-transform: translateY(0) rotate(0);
	}
	50% {
		-webkit-transform: translateY(-5px) rotate(0);
	}
	100% {
		-webkit-transform: translateY(-5px) rotate(-15deg);
	}
}
@keyframes active-bar02 {
	0% {
		transform: translateY(0) rotate(0);
	}
	50% {
		transform: translateY(-5px) rotate(0);
	}
	100% {
		transform: translateY(-5px) rotate(-15deg);
	}
}

@-webkit-keyframes logo-top {
	0% {
		opacity: 0;
		-webkit-transform: translateY(50px);
		transform: translateY(50px);
	}
	40% {
		opacity: 0;
		-webkit-transform: translateY(40px);
		transform: translateY(40px);
	}
	80% {
		opacity: 0;
		-webkit-transform: translateY(30px);
		transform: translateY(30px);
	}
	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@keyframes logo-top {
	0% {
		opacity: 0;
		-webkit-transform: translateY(50px);
		transform: translateY(50px);
	}
	40% {
		opacity: 0;
		-webkit-transform: translateY(40px);
		transform: translateY(40px);
	}
	80% {
		opacity: 0;
		-webkit-transform: translateY(30px);
		transform: translateY(30px);
	}
	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@-webkit-keyframes fadeinup {
  	0% {
    	opacity: 0;
    	-webkit-transform: translateY(30px);
    	-moz-transform: translateY(30px);
    	-ms-transform: translateY(30px);
    	-o-transform: translateY(30px);
    	transform: translateY(30px);
  	}
  	100% {
    	opacity: 1;
    	-webkit-transform: translateY(0);
    	-moz-transform: translateY(0);
    	-ms-transform: translateY(0);
    	-o-transform: translateY(0);
    	transform: translateY(0);
	}
}
@keyframes fadeinup {
  	0% {
    	opacity: 0;
    	-webkit-transform: translateY(30px);
    	-moz-transform: translateY(30px);
    	-ms-transform: translateY(30px);
    	-o-transform: translateY(30px);
    	transform: translateY(30px);
  	}
  	100% {
    	opacity: 1;
    	-webkit-transform: translateY(0);
    	-moz-transform: translateY(0);
    	-ms-transform: translateY(0);
    	-o-transform: translateY(0);
    	transform: translateY(0);
  	}
}
.fadeinup{
	-webkit-animation: fadeinup 0.5s ease-in-out;
	-moz-animation: fadeinup 0.5s ease-in-out;
	-ms-animation: fadeinup 0.5s ease-in-out;
	-o-animation: fadeinup 0.5s ease-in-out;
    animation: fadeinup 0.5s ease-in-out;
}

@keyframes reflection {
    0% { transform: scale(0) rotate(45deg); opacity: 0; }
    80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { transform: scale(4) rotate(45deg); opacity: 1; }
    100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes reflection {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-moz-keyframes reflection {
    0% { -moz-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -moz-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -moz-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -moz-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-ms-keyframes reflection {
    0% { -ms-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -ms-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -ms-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -ms-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-o-keyframes reflection {
    0% { -o-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -o-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -o-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -o-transform: scale(50) rotate(45deg); opacity: 0; }
}
.reflection {
    height:100%;
    width:30px;
    position:absolute;
    top:-180px;
    left:0;
    background-color:#FFF;
    opacity:0;
    transform:rotate(45deg);
    animation:reflection 4s ease-in-out infinite;
    -webkit-transform:rotate(45deg);
    -webkit-animation:reflection 4s ease-in-out infinite;
    -moz-transform:rotate(45deg);
    -moz-animation:reflection 4s ease-in-out infinite;
    -ms-transform:rotate(45deg);
    -ms-animation:reflection 4s ease-in-out infinite;
    -o-transform:rotate(45deg);
    -o-animation:reflection 4s ease-in-out infinite;
}