/* CSS Document */

#title2{
	/*animation: animation1 3s ease-out 1s both;*/
	position: relative;
}

#title2 img.bottom{
	position: absolute;
}

#title2 img.top{
}

#title2 .logo_bg{
	position: absolute;
	background-image:url(../img/logo_top_bg.gif);
	width:940px;
	height:600px;
}

@keyframes animation1 {
	from {
		opacity:1;
		transform: rotateY(0deg) scale(0.1,0.1);
	}
	60% {
		opacity:1;
		transform: rotateY(700deg) scale(1,1);
	}
	90% {
		opacity:0;
		transform: rotateY(700deg) scale(1,1);
	}
	to {
		opacity:0;
		transform: rotateY(700deg) scale(1,1);
	}
}

@keyframes animation2 {
	from {
		opacity:1;
	}
	60% {
		opacity:1;
	}
	90%{
		opacity:0;
	}
	to {
		opacity:0;
	}
}

@-webkit-keyframes animation1 {
	from {
		opacity:1;
		-webkit-transform: rotateY(0deg) scale(0.1,0.1);
	}
	60% {
		opacity:1;
		-webkit-transform: rotateY(700deg) scale(1,1);
	}
	90% {
		opacity:0;
		-webkit-transform: rotateY(700deg) scale(1,1);
	}
	to {
		opacity:0;
		-webkit-transform: rotateY(700deg) scale(1,1);
	}
}

@-webkit-keyframes animation2 {
	from {
		opacity:1;
	}
	60% {
		opacity:1;
	}
	90%{
		opacity:0;
	}
	to {
		opacity:0;
	}
}

@-moz-keyframes animation1 {
	from {
		opacity:1;
		-moz-transform: rotateY(0deg) scale(0.1,0.1);
	}
	60% {
		opacity:1;
		-moz-transform: rotateY(700deg) scale(1,1);
	}
	90% {
		opacity:0;
		-moz-transform: rotateY(700deg) scale(1,1);
	}
	to {
		opacity:0;
		-moz-transform: rotateY(700deg) scale(1,1);
	}
}

@-moz-keyframes animation2 {
	from {
		opacity:1;
	}
	60% {
		opacity:1;
	}
	90%{
		opacity:0;
	}
	to {
		opacity:0;
	}
}

@-o-keyframes animation1 {
	from {
		opacity:1;
		-o-transform: rotateY(0deg) scale(0.1,0.1);
	}
	60% {
		opacity:1;
		-o-transform: rotateY(700deg) scale(1,1);
	}
	90% {
		opacity:0;
		-o-transform: rotateY(700deg) scale(1,1);
	}
	to {
		opacity:0;
		-o-transform: rotateY(700deg) scale(1,1);
	}
}

@-o-keyframes animation2 {
	from {
		opacity:1;
	}
	60% {
		opacity:1;
	}
	90%{
		opacity:0;
	}
	to {
		opacity:0;
	}
}


#title2 img.top{
	-webkit-animation-name: animation1;
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-duration: 5s;
	-webkit-animation-delay: 1s;
	-webkit-animation-fill-mode: both;
	
	-moz-animation-name: animation1;
	-moz-animation-timing-function: ease-out;
	-moz-animation-duration: 5s;
	-moz-animation-delay: 1s;
	-moz-animation-fill-mode: both;
	
	-o-animation-name: animation1;
	-o-animation-timing-function: ease-out;
	-o-animation-duration: 5s;
	-o-animation-delay: 1s;
	-o-animation-fill-mode: both;
	
	animation-name: animation1;
	animation-timing-function: ease-out;
	animation-duration: 5s;
	animation-delay: 0s;
	animation-fill-mode: both;
}

#title2 .logo_bg{
	-webkit-animation-name: animation2;
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-duration: 5s;
	-webkit-animation-delay: 1s;
	-webkit-animation-fill-mode: both;
	
	-moz-animation-name: animation2;
	-moz-animation-timing-function: ease-out;
	-moz-animation-duration: 5s;
	-moz-animation-delay: 1s;
	-moz-animation-fill-mode: both;
	
	-o-animation-name: animation2;
	-o-animation-timing-function: ease-out;
	-o-animation-duration: 5s;
	-o-animation-delay: 1s;
	-o-animation-fill-mode: both;
	
	animation-name: animation2;
	animation-timing-function: ease-out;
	animation-duration: 5s;
	animation-delay: 0s;
	animation-fill-mode: both;
}