#logo{
	float:left;
}
#logo img{
	width:300px;
	height:126px;
}
.full_container{
	width:100%;
	min-height:100%;
	text-align:center;
}
.quarter_container{
	width:24%;
	display:inline-block;
}
@keyframes game_night{
    from {
		opacity:0;
		margin-top:-30%;
	}
    to {
		opacity:1;
		margin-top:0;
	}
}
#game_night{
	width:120%;
	display:inline-block;
	animation-name: game_night;
    animation-duration: 2s;
	
}
#HS{
	width:100%;
	margin-left:-10%;
	display:inline-block;
	animation-name: game_night;
    animation-duration: 2s;

}
#Chess{
	width:90%;
	margin-left:35%;
	margin-bottom:-10%;
	display:inline-block;
	animation-name: game_night;
    animation-duration: 2s;

}
.event_details{
	margin-top:100px;
}
.event_intro{
	font-size:16px;
	margin:0 auto;
	line-height:25px;
	margin-top:20px;
	font-family:"Microsoft JhengHei";
	width:90%;
}
.event_date{
	height:23px;
	line-height:25px;
	text-align:left;
	border-bottom:solid 4px #262626;
	width:90%;
	margin:0 auto;
	margin-bottom:10px;
	position:relative;
	color:white;
	padding-left:3px;
	padding-top:2px;
	font-size:23px;
	
	font-family:"Arial";
}
.event_date::before{
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	content:"";
	height:25px;
	width:130px;
	position:absolute;
	left:0;
	top:0;
	z-index:-1;
	line-height:25px;
	background:#262626;
}
.event_items{
	float:left;
}
#Christmas{
	width:90%;
	margin-bottom:-10%;
	display:inline-block;
	animation-name: game_night;
    animation-duration: 2s;

}
.gslogo{
	width:500px;
	height:210px;
	padding-top:20px;
	padding-bottom:20px;
}
p{
	line-height:25px;
}
.page_content p::first-letter{
	padding-left:50px;
}
img{
	display:block;
}
header{
	padding-top:20px;
	margin-bottom:50px;
}
header::after{
	display:block;
	content:"";
	clear:both;
}
html{
	font-family:"Arial","";
	font-weight:bold;
	background:rgba(165,165,165);
	
}
.maintainance{
	display:none;
}
.icon_background:hover .maintainance{
	display:block;
	position:absolute;
	top:5px;
	left:5px;
	font-size:11px;
	width:50px;
	height:40px;
	background:rgba(0,0,0,0.9);
	color:white;
	text-align:center;
	padding:10px 5px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;

}

.background{
	background:url("../images/white_dice_background.png");
	background-size: auto 100%;
    background-repeat: repeat-x;
    background-position: left top;
    height:100%;
    width:100%;
    position:fixed;
    top:0;
    left:0;
	z-index:-1;
}
.container{
	width:1024px;
	margin-right:auto;
	margin-left:auto;
	position:relative;
	z-index:0;
}
body{
	padding:0;
	margin:0;
}
nav{
	font-size:15px;
	float:right;
	text-align:center;
	margin-top:30px;
}
nav ul{
	list-style:none;
}
nav ul li{
	display:inline-block;
	margin-left:10px;
 	margin-right:10px;
	color:black;
	-webkit-transition:transform 0.1s linear;
	transition:transform 0.1s linear;


}
nav ul li:hover{
	 transform: scale(1.1); 
}
nav ul li img{
	display:block;
	width:70px;
	margin-left:auto;
	margin-right:auto;
}
nav ul::after{
	content:"";
	display:block;
	clear:both;
}
ul{
	margin:0;
	padding:0;
}
a{
	text-decoration:none;
	color:black;
}
.page_content{
	background:white;
	width:90%;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	padding-left:20px;
	padding-right:20px;
	margin-left:auto;
	margin-right:auto;
	padding-top:20px;
	padding-bottom:50px;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(161,161,161,1);
	-moz-box-shadow: 0px 0px 10px 0px rgba(161,161,161,1);
	box-shadow: 0px 0px 10px 0px rgba(161,161,161,1);
	margin-bottom:50px;
}
.click{
	cursor:pointer;
}
.main_container{
	float:left;
	width:800px;
	margin-bottom:50px;

	}
.side_bar{
	float:left;
	width:200px;
	
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	padding:0px 10px;
	height:100px;
}
.know_more{
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding-top:5px;
	padding-bottom:5px;
	width:100px;
	padding-left:20px;
	padding-right:20px;
	cursor:pointer;
	display:block;
	margin:0 auto;
	margin-top:20px;
	border: 3px solid black;
	background:white;
	font-family:"微軟正黑體";
	font-size:20px;
}
.side_bar ul li{
	margin-bottom:10px;
	background:white;
	text-align:right;
	border:solid 0px rgb(77, 77, 77);
	padding:5px 0;
	padding-right:5px;
	-webkit-box-shadow: 2px 0px 4px 2px rgba(179,179,179,1);
	-moz-box-shadow: 2px 0px 4px 2px rgba(179,179,179,1);
	box-shadow: 2px 0px 4px 2px rgba(179,179,179,1);
	position: relative;
	z-index:2;
	overflow:hidden;
}
.side_bar ul li::before{
	background:rgb(77,77,77);
	display: block;
	content: "";
	height:30px;
	position:absolute;
	z-index:-1;
	width:100%;
	top:0;
	right:160px;
	 -ms-transform: skewX(-40deg); /* IE 9 */
    -webkit-transform: skewX(-40deg); /* Safari */
    transform: skewX(-40deg);
}
.side_bar ul li::after{
	background:rgb(77,77,77);
	display: block;
	content: "";
	height:30px;
	position:absolute;
	z-index:-1;
	width:8px;
	top:0;
	right:145px;
	 -ms-transform: skewX(-40deg); /* IE 9 */
    -webkit-transform: skewX(-40deg); /* Safari */
    transform: skewX(-40deg);
}
.contact_bar{
	position:relative;
	background:rgba(255,255,255,.8);
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	border-radius: 25px;
	float:right;
	text-align:center;
	margin-right:2.5%;
	height:50px;
	line-height:50px;
	padding-left:10px;
	margin-bottom:20px;
}
.mail img{
	margin-top:5px;
	margin-left:5px;
	margin-right:5px;
	width:40px;
	height:40px;
	display:block;
	float:right;
}

.fb img{
	width:50px;
	height:50px;
	display:block;
	float:right;
}

.home_icon img{
	width:50px;
	margin-bottom:10px;
}
.container::after{
	display:block;
	content: "";
	clear:both;
}
ul{
	list-style:none;
}
#owl-custom-navigation{
	margin-top:20px;
	
}
#owl-custom-navigation:after{
	display:block;
	content:"";
	clear:both;

}
.owl-item>div>img{
	display:block;
	margin:0 auto;
	max-width:100%;
}
.image-box{
	width:90px;
	height:90px;
	margin-right:5px;
	margin-left:5px;
	cursor: pointer;
	float:left;
	overflow:hidden;
	margin-bottom:10px;
	background:rgba(0,0,0,0.9);
}

.image-box img{
	height:90px;
	display:block;
	margin:0 auto;
}
.image-box:hover{
	 transform: scale(1.1); 
}

/*Event Slider*/

.wrapper{
	display: block;
	margin: auto;
	height: 720px;
	width: 960px;
}

.slidecontainer{
	overflow: auto;
}

.prev{
	background-image: url(images/arrowleft.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	display: block;
	float: left;
	height: 720px;
	width: 80px;
	position: relative;
	z-index: 10;
}

.next{
	background-image: url(images/arrowright.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	display: block;
	float: right;
	height: 720px;
	width: 80px;
	position: relative;
	z-index: 10;
}

.slider{
	display: block;
	margin: auto;
	height: 720px;
	width: 960px;
	overflow: hidden;
	'position: absolute;
	'float: left;
}

/*Event Slider End*/

@media all and (max-width:1024px){
	.container{
		width:100%;

	}
	nav{
		width:100%;
		float:none;
	}
	nav ul li{
		max-width:100px;
		width:12%;
		min-width:75px;
	}
	#logo{
		width:100%;
		float:none;
	}
	#logo img{
		margin:0 auto;
		max-width:300px;
		width:100%;
		height:auto;
	}
	.side_bar{
		width:200px;
	}
	.main_container{
		margin-left:30px;
		width:-webkit-calc(100% - 270px);
		width:-moz-calc(100% - 270px);
		width:calc(100% - 270px);
		position:relative;
	}
	.page_content{
		width:90%;
	}
	.gslogo{
		width:100%;
		max-width:500px;
		height:auto;
	}
	.side_bar ul a{
		display:block;
	}
}
@media all and (max-width:800px){
	.quarter_container{
	width:48%;
	display:inline-block;
	}
	.event_items{
		float:left;
		min-height:450px;
	}
}
@media all and (max-width:640px){
	.quarter_container{
	width:96%;
	display:inline-block;
	}
	.event_banner{
		display:none;
	}
	.event_items{
		float:left;
		min-height:400px;
	}
	.side_bar{
		float:none;
		width:100%;
		padding:0;
	}
	.side_bar ul{
		width:80%;
		margin:0 auto;
	}
	.side_bar ul a:nth-child(odd){
		float:left;
		width:48%;

	}
	.side_bar ul a:nth-child(even){
		float:right;
		width:48%;

	}
	.main_container{
		width:80%;
		float:none;
		margin:0 auto;
	}
	.full_container{
		width:90%;
		margin:0 auto;
	}

}
@media all and (max-width:480px){
	.side_bar ul{
		width:100%;
		margin:0 auto;
	}
	.side_bar ul a:nth-child(odd){
		float:none;
		width:90%;
		margin:0 auto;

	}
	.side_bar ul a:nth-child(even){
		float:none;
		width:90%;
		margin:0 auto;

	}
	.main_container{
		width:90%;
	}
	.page_content{
		padding-left:3px;
		padding-right:3px;
		width:100%;
	}
	.contact_bar{
		float:none;
		margin:0 auto;
		width:90%;
		margin-bottom:20px;
	}

}




/*Vertical Sliding*/
.slidingVertical{
	display: inline;
	text-indent: 8px;
}
.slidingVertical span{
	animation: topToBottom 12.5s linear infinite 0s;
	-ms-animation: topToBottom 12.5s linear infinite 0s;
	-webkit-animation: topToBottom 12.5s linear infinite 0s;
	color: #00abe9;
	opacity: 0;
	overflow: hidden;
	position: absolute;
}
.slidingVertical span:nth-child(2){
	animation-delay: 2.5s;
	-ms-animation-delay: 2.5s;
	-webkit-animation-delay: 2.5s;
}
.slidingVertical span:nth-child(3){
	animation-delay: 5s;
	-ms-animation-delay: 5s;
	-webkit-animation-delay: 5s;
}
.slidingVertical span:nth-child(4){
	animation-delay: 7.5s;
	-ms-animation-delay: 7.5s;
	-webkit-animation-delay: 7.5s;
}
.slidingVertical span:nth-child(5){
	animation-delay: 10s;
	-ms-animation-delay: 10s;
	-webkit-animation-delay: 10s;
}

/*topToBottom Animation*/
@-moz-keyframes topToBottom{
	0% { opacity: 0; }
	5% { opacity: 0; -moz-transform: translateY(-50px); }
	10% { opacity: 1; -moz-transform: translateY(0px); }
	25% { opacity: 1; -moz-transform: translateY(0px); }
	30% { opacity: 0; -moz-transform: translateY(50px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
@-webkit-keyframes topToBottom{
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: translateY(-50px); }
	10% { opacity: 1; -webkit-transform: translateY(0px); }
	25% { opacity: 1; -webkit-transform: translateY(0px); }
	30% { opacity: 0; -webkit-transform: translateY(50px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
@-ms-keyframes topToBottom{
	0% { opacity: 0; }
	5% { opacity: 0; -ms-transform: translateY(-50px); }
	10% { opacity: 1; -ms-transform: translateY(0px); }
	25% { opacity: 1; -ms-transform: translateY(0px); }
	30% { opacity: 0; -ms-transform: translateY(50px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}

/*Horizontal Sliding*/
.slidingHorizontal{
	display: inline;
	text-indent: 8px;
}
.slidingHorizontal span{
	animation: leftToRight 12.5s linear infinite 0s;
	-ms-animation: leftToRight 12.5s linear infinite 0s;
	-webkit-animation: leftToRight 12.5s linear infinite 0s;
	color: #00abe9;
	opacity: 0;
	overflow: hidden;
	position: absolute;
}
.slidingHorizontal span:nth-child(2){
	animation-delay: 2.5s;
	-ms-animation-delay: 2.5s;
	-webkit-animation-delay: 2.5s;
}
.slidingHorizontal span:nth-child(3){
	animation-delay: 5s;
	-ms-animation-delay: 5s;
	-webkit-animation-delay: 5s;
}
.slidingHorizontal span:nth-child(4){
	animation-delay: 7.5s;
	-ms-animation-delay: 7.5s;
	-webkit-animation-delay: 7.5s;
}
.slidingHorizontal span:nth-child(5){
	animation-delay: 10s;
	-ms-animation-delay: 10s;
	-webkit-animation-delay: 10s;
}

/*leftToRight Animation*/
@-moz-keyframes leftToRight{
	0% { opacity: 0; }
	5% { opacity: 0; -moz-transform: translateX(-50px); }
	10% { opacity: 1; -moz-transform: translateX(0px); }
	25% { opacity: 1; -moz-transform: translateX(0px); }
	30% { opacity: 0; -moz-transform: translateX(50px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
@-webkit-keyframes leftToRight{
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: translateX(-50px); }
	10% { opacity: 1; -webkit-transform: translateX(0px); }
	25% { opacity: 1; -webkit-transform: translateX(0px); }
	30% { opacity: 0; -webkit-transform: translateX(50px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
@-ms-keyframes leftToRight{
	0% { opacity: 0; }
	5% { opacity: 0; -ms-transform: translateX(-50px); }
	10% { opacity: 1; -ms-transform: translateX(0px); }
	25% { opacity: 1; -ms-transform: translateX(0px); }
	30% { opacity: 0; -ms-transform: translateX(50px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}

/*FadeIn*/
.fadeIn{
	display: inline;
	text-indent: 8px;
}
.fadeIn span{
	animation: fadeEffect 12.5s linear infinite 0s;
	-ms-animation: fadeEffect 12.5s linear infinite 0s;
	-webkit-animation: fadeEffect 12.5s linear infinite 0s;
	color: #00abe9;
	opacity: 0;
	overflow: hidden;
	position: absolute;
}
.fadeIn span:nth-child(2){
	animation-delay: 2.5s;
	-ms-animation-delay: 2.5s;
	-webkit-animation-delay: 2.5s;
}
.fadeIn span:nth-child(3){
	animation-delay: 5s;
	-ms-animation-delay: 5s;
	-webkit-animation-delay: 5s;
}
.fadeIn span:nth-child(4){
	animation-delay: 7.5s;
	-ms-animation-delay: 7.5s;
	-webkit-animation-delay: 7.5s;
}
.fadeIn span:nth-child(5){
	animation-delay: 10s;
	-ms-animation-delay: 10s;
	-webkit-animation-delay: 10s;
}

/*FadeIn Animation*/
@-moz-keyframes fadeEffect{
	0% { opacity: 0; }
	5% { opacity: 0; -moz-transform: translateY(0px); }
	10% { opacity: 1; -moz-transform: translateY(0px); }
	25% { opacity: 1; -moz-transform: translateY(0px); }
	30% { opacity: 0; -moz-transform: translateY(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
@-webkit-keyframes fadeEffect{
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: translateY(0px); }
	10% { opacity: 1; -webkit-transform: translateY(0px); }
	25% { opacity: 1; -webkit-transform: translateY(0px); }
	30% { opacity: 0; -webkit-transform: translateY(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
@-ms-keyframes fadeEffect{
	0% { opacity: 0; }
	5% { opacity: 0; -ms-transform: translateY(0px); }
	10% { opacity: 1; -ms-transform: translateY(0px); }
	25% { opacity: 1; -ms-transform: translateY(0px); }
	30% { opacity: 0; -ms-transform: translateY(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}

/*Vertical Flip*/
.verticalFlip{
	display: inline;
	text-indent: 8px;
}
.verticalFlip span{
	animation: vertical 12.5s linear infinite 0s;
	-ms-animation: vertical 12.5s linear infinite 0s;
	-webkit-animation: vertical 12.5s linear infinite 0s;
	color: #00abe9;
	opacity: 0;
	overflow: hidden;
	position: absolute;
}
.verticalFlip span:nth-child(2){
	animation-delay: 2.5s;
	-ms-animation-delay: 2.5s;
	-webkit-animation-delay: 2.5s;
}
.verticalFlip span:nth-child(3){
	animation-delay: 5s;
	-ms-animation-delay: 5s;
	-webkit-animation-delay: 5s;
}
.verticalFlip span:nth-child(4){
	animation-delay: 7.5s;
	-ms-animation-delay: 7.5s;
	-webkit-animation-delay: 7.5s;
}
.verticalFlip span:nth-child(5){
	animation-delay: 10s;
	-ms-animation-delay: 10s;
	-webkit-animation-delay: 10s;
}

/*Vertical Flip Animation*/
@-moz-keyframes vertical{
	0% { opacity: 0; }
	5% { opacity: 0; -moz-transform: rotateX(180deg); }
	10% { opacity: 1; -moz-transform: translateY(0px); }
	25% { opacity: 1; -moz-transform: translateY(0px); }
	30% { opacity: 0; -moz-transform: translateY(0px); }
	80% { opacity: 0; }
	100% { opacity: 0;}
}
@-webkit-keyframes vertical{
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: rotateX(180deg); }
	10% { opacity: 1; -webkit-transform: translateY(0px); }
	25% { opacity: 1; -webkit-transform: translateY(0px); }
	30% { opacity: 0; -webkit-transform: translateY(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
@-ms-keyframes vertical{
	0% { opacity: 0; }
	5% { opacity: 0; -ms-transform: rotateX(180deg); }
	10% { opacity: 1; -ms-transform: translateY(0px); }
	25% { opacity: 1; -ms-transform: translateY(0px); }
	30% { opacity: 0; -ms-transform: translateY(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}

/*Horizontal Flip*/
.horizontalFlip{
	display: inline;
	text-indent: 8px;
}
.horizontalFlip span{
	animation: horizontal 12.5s linear infinite 0s;
	-ms-animation: horizontal 12.5s linear infinite 0s;
	-webkit-animation: horizontal 12.5s linear infinite 0s;
	color: #00abe9;
	opacity: 0;
	overflow: hidden;
	position: absolute;
}
.horizontalFlip span:nth-child(2){
	animation-delay: 2.5s;
	-ms-animation-delay: 2.5s;
	-webkit-animation-delay: 2.5s;
}
.horizontalFlip span:nth-child(3){
	animation-delay: 5s;
	-ms-animation-delay: 5s;
	-webkit-animation-delay: 5s;
}
.horizontalFlip span:nth-child(4){
	animation-delay: 7.5s;
	-ms-animation-delay: 7.5s;
	-webkit-animation-delay: 7.5s;
}
.horizontalFlip span:nth-child(5){
	animation-delay: 10s;
	-ms-animation-delay: 10s;
	-webkit-animation-delay: 10s;
}

/*Horizontal Flip Animation*/
@-moz-keyframes horizontal{
	0% { opacity: 0; }
	5% { opacity: 0; -moz-transform: rotateY(180deg); }
	10% { opacity: 1; -moz-transform: translateX(0px); }
	25% { opacity: 1; -moz-transform: translateX(0px); }
	30% { opacity: 0; -moz-transform: translateX(0px); }
	80% { opacity: 0; }
	100% { opacity: 0;}
}
@-webkit-keyframes horizontal{
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: rotateY(180deg); }
	10% { opacity: 1; -webkit-transform: translateX(0px); }
	25% { opacity: 1; -webkit-transform: translateX(0px); }
	30% { opacity: 0; -webkit-transform: translateX(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
@-ms-keyframes horizontal{
	0% { opacity: 0; }
	5% { opacity: 0; -ms-transform: rotateY(180deg); }
	10% { opacity: 1; -ms-transform: translateX(0px); }
	25% { opacity: 1; -ms-transform: translateX(0px); }
	30% { opacity: 0; -ms-transform: translateX(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}

/*AntiClockWise Effect*/
.antiClock{
	display: inline;
	text-indent: 8px;
}
.antiClock span{
	animation: anti 12.5s linear infinite 0s;
	-ms-animation: anti 12.5s linear infinite 0s;
	-webkit-animation: anti 12.5s linear infinite 0s;
	color: #00abe9;
	opacity: 0;
	overflow: hidden;
	position: absolute;
}
.antiClock span:nth-child(2){
	animation-delay: 2.5s;
	-ms-animation-delay: 2.5s;
	-webkit-animation-delay: 2.5s;
}
.antiClock span:nth-child(3){
	animation-delay: 5s;
	-ms-animation-delay: 5s;
	-webkit-animation-delay: 5s;
}
.antiClock span:nth-child(4){
	animation-delay: 7.5s;
	-ms-animation-delay: 7.5s;
	-webkit-animation-delay: 7.5s;
}
.antiClock span:nth-child(5){
	animation-delay: 10s;
	-ms-animation-delay: 10s;
	-webkit-animation-delay: 10s;
}

/*AntiClockWise Effect Animation*/
@-moz-keyframes anti{
	0% { opacity: 0; }
	5% { opacity: 0; -moz-transform: rotateX(180deg); }
	10% { opacity: 1; -moz-transform: translateY(0px); }
	25% { opacity: 1; -moz-transform: translateY(0px); }
	30% { opacity: 0; -moz-transform: translateY(0px); }
	80% { opacity: 0; }
	100% { opacity: 0;}
}
@-webkit-keyframes anti{
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: rotate(180deg); }
	10% { opacity: 1; -webkit-transform: translateY(0px); }
	25% { opacity: 1; -webkit-transform: translateY(0px); }
	30% { opacity: 0; -webkit-transform: translateY(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
@-ms-keyframes anti{
	0% { opacity: 0; }
	5% { opacity: 0; -ms-transform: rotate(180deg); }
	10% { opacity: 1; -ms-transform: translateY(0px); }
	25% { opacity: 1; -ms-transform: translateY(0px); }
	30% { opacity: 0; -ms-transform: translateY(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}

/*ClockWise Effect*/
.clockWise{
	display: inline;
	text-indent: 8px;
}
.clockWise span{
	animation: clock 12.5s linear infinite 0s;
	-ms-animation: clock 12.5s linear infinite 0s;
	-webkit-animation: clock 12.5s linear infinite 0s;
	color: #00abe9;
	opacity: 0;
	overflow: hidden;
	position: absolute;
}
.clockWise span:nth-child(2){
	animation-delay: 2.5s;
	-ms-animation-delay: 2.5s;
	-webkit-animation-delay: 2.5s;
}
.clockWise span:nth-child(3){
	animation-delay: 5s;
	-ms-animation-delay: 5s;
	-webkit-animation-delay: 5s;
}
.clockWise span:nth-child(4){
	animation-delay: 7.5s;
	-ms-animation-delay: 7.5s;
	-webkit-animation-delay: 7.5s;
}
.clockWise span:nth-child(5){
	animation-delay: 10s;
	-ms-animation-delay: 10s;
	-webkit-animation-delay: 10s;
}

/*ClockWise Effect Animation*/
@-moz-keyframes clock{
	0% { opacity: 0; }
	5% { opacity: 0; -moz-transform: rotate(-180deg); }
	10% { opacity: 1; -moz-transform: translateX(0px); }
	25% { opacity: 1; -moz-transform: translateX(0px); }
	30% { opacity: 0; -moz-transform: translateX(0px); }
	80% { opacity: 0; }
	100% { opacity: 0;}
}
@-webkit-keyframes clock{
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: rotate(-180deg); }
	10% { opacity: 1; -webkit-transform: translateX(0px); }
	25% { opacity: 1; -webkit-transform: translateX(0px); }
	30% { opacity: 0; -webkit-transform: translateX(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
@-ms-keyframes clock{
	0% { opacity: 0; }
	5% { opacity: 0; -ms-transform: rotate(-180deg); }
	10% { opacity: 1; -ms-transform: translateX(0px); }
	25% { opacity: 1; -ms-transform: translateX(0px); }
	30% { opacity: 0; -ms-transform: translateX(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}

/*Pop Effect*/
.popEffect{
	display: inline;
	text-indent: 8px;
}
.popEffect span{
	animation: pop 12.5s linear infinite 0s;
	-ms-animation: pop 12.5s linear infinite 0s;
	-webkit-animation: pop 12.5s linear infinite 0s;
	color: #00abe9;
	opacity: 0;
	overflow: hidden;
	position: absolute;
}
.popEffect span:nth-child(2){
	animation-delay: 2.5s;
	-ms-animation-delay: 2.5s;
	-webkit-animation-delay: 2.5s;
}
.popEffect span:nth-child(3){
	animation-delay: 5s;
	-ms-animation-delay: 5s;
	-webkit-animation-delay: 5s;
}
.popEffect span:nth-child(4){
	animation-delay: 7.5s;
	-ms-animation-delay: 7.5s;
	-webkit-animation-delay: 7.5s;
}
.popEffect span:nth-child(5){
	animation-delay: 10s;
	-ms-animation-delay: 10s;
	-webkit-animation-delay: 10s;
}

/*Pop Effect Animation*/
@-moz-keyframes pop{
	0% { opacity: 0; }
	5% { opacity: 0; -moz-transform: rotate(0deg) scale(0.10) skew(0deg) translate(0px); }
	10% { opacity: 1; -moz-transform: translateY(0px); }
	25% { opacity: 1; -moz-transform: translateY(0px); }
	30% { opacity: 0; -moz-transform: translateY(0px); }
	80% { opacity: 0; }
	100% { opacity: 0;}
}
@-webkit-keyframes pop{
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform: rotate(0deg) scale(0.10) skew(0deg) translate(0px);}
	10% { opacity: 1; -webkit-transform: translateY(0px); }
	25% { opacity: 1; -webkit-transform: translateY(0px); }
	30% { opacity: 0; -webkit-transform: translateY(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
@-ms-keyframes pop{
	0% { opacity: 0; }
	5% { opacity: 0; -ms-transform: rotate(0deg) scale(0.10) skew(0deg) translate(0px); }
	10% { opacity: 1; -ms-transform: translateY(0px); }
	25% { opacity: 1; -ms-transform: translateY(0px); }
	30% { opacity: 0; -ms-transform: translateY(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}

/*Push Effect*/
.pushEffect{
	display: inline;
	text-align: center;
	text-indent: 0px;
	
}
.pushEffect span{
	text-align: center;
	animation: push 12.5s linear infinite 0s;
	-ms-animation: push 12.5s linear infinite 0s;
	-webkit-animation: push 12.5s linear infinite 0s;
	color: #00abe9;
	opacity: 0;
	overflow: hidden;
	position: fixed;
}
.pushEffect span:nth-child(2){
	text-align: center;
	animation-delay: 2.5s;
	-ms-animation-delay: 2.5s;
	-webkit-animation-delay: 2.5s;
}
.pushEffect span:nth-child(3){
	animation-delay: 5s;
	-ms-animation-delay: 5s;
	-webkit-animation-delay: 5s;
}
.pushEffect span:nth-child(4){
	animation-delay: 7.5s;
	-ms-animation-delay: 7.5s;
	-webkit-animation-delay: 7.5s;
}
.pushEffect span:nth-child(5){
	animation-delay: 10s;
	-ms-animation-delay: 10s;
	-webkit-animation-delay: 10s;
}

/*Push Effect Animation*/
@-moz-keyframes push{
	0% { opacity: 0; }
	5% { opacity: 0; -moz-transform: rotate(0deg) scale(2) skew(0deg) translate(0px); }
	10% { opacity: 1; -moz-transform: translateX(0px); }
	25% { opacity: 1; -moz-transform: translateX(0px); }
	30% { opacity: 0; -moz-transform: translateX(0px); }
	80% { opacity: 0; }
	100% { opacity: 0;}
}
@-webkit-keyframes push{
	0% { opacity: 0; }
	5% { opacity: 0; -webkit-transform:rotate(0deg) scale(2) skew(0deg) translate(0px);}
		10% { opacity: 1; -webkit-transform: translateX(0px); }
	25% { opacity: 1; -webkit-transform: translateX(0px); }
	30% { opacity: 0; -webkit-transform: translateX(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
@-ms-keyframes push{
	0% { opacity: 0; }
	5% { opacity: 0; -ms-transform: rotate(0deg) scale(2) skew(0deg) translate(0px); }
	10% { opacity: 1; -ms-transform: translateX(0px); }
	25% { opacity: 1; -ms-transform: translateX(0px); }
	30% { opacity: 0; -ms-transform: translateX(0px); }
	80% { opacity: 0; }
	100% { opacity: 0; }
}
/*Footer*/
h3{
	color: #fff;
	font-size: 30px;
	margin-top: 20px;
	text-align: center;
}

.center {

 margin: 0 auto;

 }

.awesome {

  font-family: futura;
  font-style: italic;

  width:100%;

  margin: 0 auto;
  text-align: left;

  color:#313131;
  font-size:30px;
  font-weight: bold;
  position: absolute;
  -webkit-animation:colorchange 3s infinite alternate;


}

.awesome2 {

  font-family: futura;
  font-style: italic;
  color:#313131;
  font-size:17px;
  
  -webkit-animation:colorchange 5s infinite alternate;


}

@-webkit-keyframes colorchange {
  0% {

    color: red;
  }

  10% {

    color: orange;
  }

  20% {

    color: yellow;
  }

  30% {

    color: green;
  }

  40% {

    color: green;
  }

  50% {

    color: blue;
  }

  60% {

    color: blue;
  }

  70% {

    color: purple;
  }
  80% {

    color: purple;
  }

  90% {

    color: pink;
  }

  100% {

    color: red;
  }
}