@charset "utf-8";

html, body {
	margin:0; 
	padding:0; 
	height:100%; 
	position:relative; 
	font-family:"century gothic", "微軟正黑體";
}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: #636363;
}
input:-moz-placeholder, textarea:-moz-placeholder {
  color: #636363;
}
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
	-webkit-box-shadow: 0 0 0px 1000px #e6ecef inset;
}
input:focus { 
    background-color:transparent;
}
.row {display:table-row;}
.cell {
	display:table-cell; 
	vertical-align:middle; 
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
#wrap {
	width:100%;
	height:100%;
	min-width:1200px;
	
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d1dce2+0,ffffff+100 */
	background: #d1dce2; /* Old browsers */
	background: -moz-linear-gradient(45deg,  #d1dce2 0%, #ffffff 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(45deg,  #d1dce2 0%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(45deg,  #d1dce2 0%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1dce2', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
#login_bg {
	position:absolute;
	bottom:50px;
	right:5%;
}
#login{
	min-width:1200px;
	display:table; 
	margin:0 auto;
}
#login .row .cell:first-child {
	padding-left:30px;
}
#login .row .cell:last-child {
	width:590px;
}
#login .logo{
	width:500px; 
	height:95px; 
	border-bottom:2px solid #adbec8;
}
#login .pic{
	width:590px;
	margin-left:70px;
}
#login .logo img{width:220px;}
#login .company{
	width:520px;
	color:#4d9db0;
	font-size:2em;
	display:block;
}
#login .login_form{
	width:450px;
	margin-top:20px;
	border:5px solid #b7c6cf;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	
	background-color:#e6ecef;
}
#login .login_form table {
	 width:95%;
	 margin:0 auto;
}
#login .login_form table tr td {
	border-bottom:1px dashed #b7c6cf;
	text-align:right;
}
#login .login_form table tr:nth-of-type(1) td {
	background: url(../images2/top_ico_member.png) no-repeat left center;
}
#login .login_form table tr:nth-of-type(2) td {
	background: url(../images2/lock.png) no-repeat left center;
}
#login .login_form table tr:last-child td {
	border-bottom:none;
	padding:30px 0 10px;
	text-align:center;
}
#recommendation {
	width:440px;
	color:#e57369;
	font-weight:bold;
	background-color:#fee;
	text-align:center;
	padding:10px;
	border:1px solid #ccc;
	border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
}
#footer{
	width:100%;
	height:30px;
	line-height:30px;
	font-size:0.75em;
	background:#353636;
	position:fixed;
	z-index:999;
	left:0px;
	bottom:0px;
	color:#fff;
	text-align:right;
	padding:0 30px;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

input {
	border:none;
	background:none;
	width:90.5%;
	height:50px;
	font-size:1.2em;
	outline:none;
	font-family:"century gothic", "微軟正黑體";
	
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

#member_id, #member_pwd{background-color:transparent;}

button {
	width:50%; 
	height:40px; 
	line-height:40px; 
	color:#fff; 
	border:none; 
	outline:none; 
	font-size:1em; 
	font-weight:bold; 
	letter-spacing:10px; 
	font-family:"century gothic", "微軟正黑體";
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#96be83+0,7bad63+100 */
	background: #96be83; /* Old browsers */
	background: -moz-linear-gradient(top,  #96be83 0%, #7bad63 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #96be83 0%,#7bad63 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #96be83 0%,#7bad63 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#96be83', endColorstr='#7bad63',GradientType=0 ); /* IE6-9 */

}
button:active{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#7bad63+0,96be83+100 */
	background: #7bad63; /* Old browsers */
	background: -moz-linear-gradient(top,  #7bad63 0%, #96be83 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #7bad63 0%,#96be83 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #7bad63 0%,#96be83 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7bad63', endColorstr='#96be83',GradientType=0 ); /* IE6-9 */
}
input.login_btn{
	color:#fff;
	width: 100%;
    height: 40px;
    text-align: center;
    padding: 0;
	font-family: "century gothic", "微軟正黑體";
    font-size: 1em;
    letter-spacing: 10px;
    font-weight: bold;
}
input.login_btn:focus, input.login_btn:active{
	background-color:transparent;
	color:#fff;
}
.parent_logo {
	margin-top:20px;
}
.parent_logo img:nth-of-type(2) {
	margin-left:100px;
}

/*-------------------------------------------------- change password*/
.chg_pwd table tr td {
	padding:10px 0 0;
}
.chg_pwd input {
	height:30px;
	border:1px solid #999;
}
.chg_pwd .buton {
	background:#ffba00;
	font-size:16px;
	display:inline-block;
	padding:5px 15px;
	cursor:pointer;
	margin:5px 0 5px 5px;
	color:#242424;
	letter-spacing:2px;
	min-width:130px;
	text-decoration:none;
	text-align:center;
	border:none;
	line-height:24px;
	-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
	border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;
	-moz-box-shadow:2px 2px 3px #bbb;
	-webkit-box-shadow:2px 2px 3px #bbb;
	box-shadow:2px 2px 3px #bbb;
}
.chg_pwd .buton:active {
	position:relative;
	top:1px;
}