@font-face {
	font-family: NotoSansTC-Light;
	src: url(../fonts/NotoSansTC-Light.otf);
	src: url(../fonts/TaipeiSansTCBeta-Bold.otf);
	src: url(../fonts/TaipeiSansTCBeta-Regular.otf);
	src: url(../fonts/TaipeiSansTCBeta-Light.otf);
}
body {
	font-family: '微軟正黑體', 'NotoSansTC-Light', 'Noto Sans TC', sans-serif, Arial, Helvetica, Microsoft JhengHei, Apple LiGothic, 'Roboto Condensed';
	font-size: 16px;
	color: #333;
	margin: 0;
}
   html, body {
   	height: 100%;
   	padding: 0;
   } 
   .bg_cover {
   	width: 1920px;
   	background: linear-gradient(to bottom, #254995 1%, #9367a2 100%);
   	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   	position: relative;
   	top: 50%;
   	left: 50%;
   	transform: translate(-50%, -50%);
   }
   .bg_logo_fa {
    position: absolute;
    width: 150px;
    height: 150px;
    display: block;
    top: 280px;
    left: 46%;
    background: url("../img/loge1.png");
    background-repeat: no-repeat;
    background-size: 100% auto;
    animation: pulse 1.5s ease-in-out infinite; /* 脈衝效果 */
}
  
  /* 脈衝效果 */
@keyframes pulse {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.1);
        opacity: 0.8;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

   @import url(http://fonts.googleapis.com/css?family=Lato:100,300,700);
   #loading {
   	width: 400px;
   	margin: 0 auto;
   	padding-top: 395px;
	text-align: center;   
   }
   #loading h1 {
   	font-family: 'Lato';
   	color: white;
   	text-transform: uppercase;
   	font-size: 1em;
   	letter-spacing: 2px;
   	text-align: center;
   	margin-top: 12px;
   	-webkit-animation: fade 2s infinite;
   	-moz-animation: fade 2s infinite;
   }
   .stick {
   	width: 15px;
   	height: 2px;
   	background: white;
   	display: inline-block;
   	margin-left:8px;
   }
   .stick:nth-child(n) {
   	transform: rotate(30deg);
   	-ms-transform: rotate(30deg);
   	/* IE 9 */
   	-webkit-transform: rotate(30deg);
   	/* Safari and Chrome */
   	-moz-transform: rotate(30deg);
   	-webkit-animation: fall 2s infinite;
   	-moz-animation: fall 2s infinite;
   }
   .stick:nth-child(2n) {
   	transform: rotate(-30deg);
   	-ms-transform: rotate(-30deg);
   	/* IE 9 */
   	-webkit-transform: rotate(-30deg);
   	/* Safari and Chrome */
   	-moz-transform: rotate(-30deg);
   	-webkit-animation: rise 2s infinite;
   	-moz-animation: rise 2s infinite;
   }
   @-webkit-keyframes rise {
   	50% {
   		transform: rotate(30deg);
   		-ms-transform: rotate(30deg);
   		/* IE 9 */
   		-webkit-transform: rotate(30deg);
   		-moz-transform: rotate(30deg);
   	}
   }
   @-moz-keyframes rise {
   	50% {
   		transform: rotate(30deg);
   		-ms-transform: rotate(30deg);
   		/* IE 9 */
   		-webkit-transform: rotate(30deg);
   		-moz-transform: rotate(30deg);
   	}
   }
   @-o-keyframes rise {
   	50% {
   		transform: rotate(30deg);
   		-ms-transform: rotate(30deg);
   		/* IE 9 */
   		-webkit-transform: rotate(30deg);
   		-moz-transform: rotate(30deg);
   	}
   	@keyframes rise {
   		50% {
   			transform: rotate(30deg);
   			-ms-transform: rotate(30deg);
   			/* IE 9 */
   			-webkit-transform: rotate(30deg);
   			-moz-transform: rotate(30deg);
   		}
   	}
   }
   @-webkit-keyframes fall {
   	50% {
   		transform: rotate(-30deg);
   		-ms-transform: rotate(-30deg);
   		/* IE 9 */
   		-webkit-transform: rotate(-30deg);
   		-moz-transform: rotate(30deg);
   	}
   }
   @-moz-keyframes fall {
   	50% {
   		transform: rotate(-30deg);
   		-ms-transform: rotate(-30deg);
   		/* IE 9 */
   		-webkit-transform: rotate(-30deg);
   		-moz-transform: rotate(-30deg);
   	}
   }
   @-o-keyframes fall {
   	50% {
   		transform: rotate(-30deg);
   		-ms-transform: rotate(-30deg);
   		/* IE 9 */
   		-webkit-transform: rotate(-30deg);
   		-moz-transform: rotate(30deg);
   	}
   	@keyframes fall {
   		50% {
   			transform: rotate(-30deg);
   			-ms-transform: rotate(-30deg);
   			/* IE 9 */
   			-webkit-transform: rotate(-30deg);
   			-moz-transform: rotate(30deg);
   		}
   	}
   }

   @-webkit-keyframes fade {
   	50% {
   		opacity: 0.5;
   	}
   	100% {
   		opacity: 1;
   	}
   }
   @-moz-keyframes fade {
   	50% {
   		opacity: 0.5;
   	}
   	100% {
   		opacity: 1;
   	}
   }
   @-o-keyframes fade {
   	50% {
   		opacity: 0.5;
   	}
   	100% {
   		opacity: 1;
   	}
   	@keyframes fade {
   		50% {
   			opacity: 0.5;
   		}
   		100% {
   			opacity: 1;
   		}
   	}
   }