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

html{overflow-y:hidden;}
a:active,a:hover{outline:0}
button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}
button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}
input,select,button{outline:none;}
table{border-collapse:collapse;border-spacing:0}
td,th{padding:0}
img{vertical-align:middle;border:0}
@-ms-viewport{width:device-width}
html{font-size:50px;-webkit-tap-highlight-color:transparent;height:100%;min-width:320px;overflow-x:hidden}
body{
	margin: 0;
	height: 100%;
	font-family: "Century Gothic", "Varela Round", "sans-serif", "微軟正黑體";
	font-size: .28em;
	line-height: 1;
	color: #333;
	margin: 0;
	padding: 0;
	-moz-background-size: cover;
	background-size: cover;
	background-attachment: fixed;
	background-color: #000;
	background-image: url(../images/bg.jpg);
	background-repeat: no-repeat;
	background-position: center bottom;
}

button,input,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}
a{color:#06c1ae;text-decoration:none;outline:0}
a:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}
a.react,label.react{display:block;color:inherit;height:100%}
a.react.react-active,a.react:active,label.react:active{background:rgba(0,0,0,.1)}
ul{margin:0;padding:0;list-style-type:none}
hr{margin-top:.28rem;margin-bottom:.28rem;border:0;border-top:1px solid #DDD8CE}
h6,p{line-height:1.41;text-align:justify;margin:-.2em 0;word-break:break-all}
small,weak{color:#666}
::-webkit-input-placeholder {color:#999;line-height:inherit;} 
:-moz-placeholder {color:#999;line-height:inherit;} 
::-moz-placeholder {color:#999;line-height:inherit;}
canvas{z-index:-1;position:absolute;}

#Block{
	padding: 5%;
	top: 50%;
	height: auto;
	overflow: hidden;
	margin-right: auto;
	margin-left: auto;
}

#logo{
	width:100%;
	overflow: hidden;
	text-align:center;
}


.admin_login{
	width:400px;
	height:auto;
	overflow:hidden;
	margin:2% auto 0 auto;
	padding:40px;
	box-shadow: 0 -8px 30px rgba(19, 19, 19, 0.26);
	border-radius:5px;
}
.admin_login dt{
	font-size: 20pt;
	text-align: center;
	color: #000000;
	text-shadow: 0 0 1px #ffffff;
	margin-bottom: 15px;
}
.admin_login dt strong{display:block;}
.admin_login dt em{display:block;font-size:12px;margin-top:8px;}
.admin_login dd{margin:5px 0;overflow:hidden;position:relative;}
.admin_login dd .login_txtbx{
	font-size:14px;
	height:42px;
	line-height:26px;
	padding:8px 5%;
	width:100%;
	text-indent:2em;
	border:none;  
	background: rgba(0, 0, 0, 0.50);
	color:white;
}
.admin_login dd .login_txtbx::-webkit-input-placeholder {color:#f4f4f4;line-height:inherit;} 
.admin_login dd .login_txtbx:-moz-placeholder {color:#f4f4f4;line-height:inherit;} 
.admin_login dd .login_txtbx::-moz-placeholder {color:#f4f4f4;line-height:inherit;}
.admin_login dd .login_txtbx:focus{background: rgba(0, 0, 0, 0.80);}

.admin_login .fa{
	position: absolute;
	top: 0;
	left: 10px;
	height: 42px;
	line-height: 42px;
	color: #FFFFFF;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
}

.admin_login dd.val_icon input {
    width: calc(100% - 125px);
}
.admin_login dd.val_icon #auth_code{
	width: 120px;
	height:35px;
    z-index: 0;
    background: rgba(0, 0, 0, 0.50);
}

.admin_login dd .submit_btn{width:100%;height:42px;border:none;font-size:16px;background:#00BCD4;;color:#f8f8f8;}
.admin_login dd .submit_btn:hover{background:#0c9076;color:#f4f4f4;}
.admin_login dd p {
    color: #000000;
    font-size: 12px;
    text-align: center;
    margin: 5px 0;
}



@media only screen and (max-width: 780px) {
	#Block{
		width: 100%;
		padding: 5%;
		height: auto;
		overflow: hidden;
		margin:0px auto;
		top:0;
	}
	.admin_login{
		width: 100%;	
	}
}