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

/*--動態--*/



.animated {
  animation-iteration-count: infinite;
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  animation-delay:0.5s; /*等待0.5秒，然后开始动画：*/
  -webkit-animation-delay:0.5s; /* Safari 和 Chrome */}




.pulse{
	animation-name: pulse;
	-webkit-animation-name: pulse;	

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-iteration-count: infinite;/*重複播放*/
	-webkit-animation-iteration-count: infinite;/*重複播放*/
}

@keyframes pulse {
	0% {
		transform: scale(0.9);
		opacity: 1;		
	}
	50% {
		transform: scale(1);
		opacity: 1;	
	}	
	100% {
		transform: scale(0.9);
		opacity: 1;	
	}	
}

@-webkit-keyframes pulse {
	0% {
		transform: scale(0.9);
		opacity: 1;		
	}
	50% {
		transform: scale(1);
		opacity: 1;	
	}	
	100% {
		transform: scale(0.9);
		opacity: 1;	
	}
}


.floating{
	animation: float 3s infinite ease-in-out alternate;
	animation-name: floating;
	-webkit-animation-name: floating;
}

@-webkit-keyframes floating {
	from,
    to {
        transform: transofrmY(0);
    }
    50% {
        transform: translateY(8px);
    }	
}
@-moz-keyframes floating {
	from,
    to {
        transform: transofrmY(0);
    }
    50% {
        transform: translateY(8px);
    }
}
@-o-keyframes floating {
	from,
    to {
        transform: transofrmY(0);
    }
    50% {
        transform: translateY(8px);
    }	
}
@keyframes floating {
	from,
    to {
        transform: transofrmY(0);
    }
    50% {
        transform: translateY(8px);
    }	
}

.animated2 {
-webkit-animation:fadeInUp 1s .2s ease both;
-moz-animation:fadeInUp 1s .2s ease both;

}
@-webkit-keyframes fadeInUp {
0% {
opacity:0;
-webkit-transform:translateY(20px)
}
100% {
opacity:1;
-webkit-transform:translateY(0)
}
}
@-moz-keyframes fadeInUp {
0% {
opacity:0;
-moz-transform:translateY(20px)
}
100% {
opacity:1;
-moz-transform:translateY(0)
}
}

/*彈起*/
.animation3 {
	-webkit-animation:bounce 3s .2s ease both;
	-moz-animation:bounce 3s .2s ease both;
	animation-iteration-count: infinite;/*重複播放*/
	-webkit-animation-iteration-count: infinite;/*重複播放*/
}
@-webkit-keyframes bounce {
0%, 20%, 50%, 80%, 100% {
-webkit-transform:translateY(0)
}
40% {
-webkit-transform:translateY(-20px)
}
60% {
-webkit-transform:translateY(-10px)
}
}
@-moz-keyframes bounce {
0%, 20%, 50%, 80%, 100% {
-moz-transform:translateY(0)
}
40% {
-moz-transform:translateY(-20px)
}
60% {
-moz-transform:translateY(-10px)
}
}






.floatX{
	animation-delay:1s; /*等待0.5秒，然后开始动画：*/
	animation-name: floatX;
	-webkit-animation-name: floatX;

	animation-duration: 5s;	
	-webkit-animation-duration: 5s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

@keyframes floatX {
	0% {
		transform: translateX(0%);	
	}
	50% {
		transform: translateX(0.8%);	
	}	
	100% {
		transform: translateX(0%);
	}			
}

@-webkit-keyframes floatX {
	0% {
		-webkit-transform: translateX(0%);	
	}
	50% {
		-webkit-transform: translateX(0.8%);	
	}	
	100% {
		-webkit-transform: translateX(0%);
	}			
}