﻿*{margin:0;padding:0}
*,::after,::before{box-sizing:border-box}
html{font-family:'Microsoft YaHei';-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;background-color:#f5f7ff;height:100%}
body{color:#0c0c0d;font-size:14px;font-weight:300}
a{text-decoration:none}
ul,li{list-style:none}
header,section,.stage{display:block}
header{margin-bottom:25px}
header h1{margin:15px 0;color:#0c0c0d;font-weight:300;font-size:22px;line-height:26px}
input::-webkit-input-placeholder{color:#888;font-size:14px}
input:-moz-placeholder{color:#888;font-size:14px}
input::-moz-placeholder{color:#888;font-size:14px}
input:-ms-input-placeholder{color:#888;font-size:14px}

.logo{position:relative;top:30px;z-index:1;margin:0 auto;width:80px;height:85px;background:url(../images/logo.png) no-repeat 100%}
.main{text-align:center}
.error{font-size:13px;font-weight:400;position:relative}
.error .validation-summary-errors{background:#d70022;border-radius:4px;color:#fff;min-height:32px;padding:8px 4px;text-align:center;margin-bottom:15px}

.input-row{position:relative;margin-bottom:18px;width:100%}
.input-row input{position:relative;z-index:2;padding:0 0 0 16px;width:100%;height:44px;line-height:44px;outline:0;border:1px solid rgba(12,12,13,.2);border-radius:2px;background-color:#fff;color:#0c0c0d;font-weight:400;font-size:16px}
.input-row input.password{padding-right:58px}
.input-row input:hover{border-color:rgba(12,12,13,.5)}
.input-row input:focus{border-color:#0a84ff;box-shadow:0 0 0 3px rgba(10,132,255,.3)}
.input-row input.validform_error{border-color:#d70022}
.input-row input.validform_error:focus{box-shadow:0 0 0 3px rgba(215,0,34,.3)}
.button-row{margin:20px 0 24px 0}
.button-row button{display:block;padding:0 8px;width:100%;height:48px;border:0;border-radius:4px;background:#0060df;color:#fff;letter-spacing:.2px;font-weight:300;font-size:15px;cursor:pointer;text-align:center}
.button-row button:hover{background:#003eaa}
.button-row button:focus{box-shadow:0 0 0 1px #0a84ff inset,0 0 0 1px #0a84ff,0 0 0 4px rgba(10,132,255,.3)}
.button-row button:disabled{cursor:auto;opacity:.4}
.button-row .spinner{position:relative;display:block;overflow:hidden;margin:0 auto;width:33px;height:33px;background-image:url(../images/spinnergrey.png);background-size:33px 33px;background-repeat:no-repeat;text-indent:100%;white-space:nowrap;-webkit-animation:.9s spin infinite linear;animation:.9s spin infinite linear}

.verline-row{position:relative;width:100%}
.verline-row:after{clear:both;display:block;overflow:hidden;height:0;content:"."}
.verline-row .left{float:left;font-size:14px;color:#0060df}
.verline-row .right{float:right;font-size:14px;color:#0060df}
.verline-row a:hover{color:#003eaa;text-decoration:underline}

.faint{margin-top:20px;color:#737373;font-size:13px}
.faint a{color:#737373;text-decoration:none}
.faint a:hover{color:#4a4a4f}
.validform_checktip{background:#d70022;border-radius:2px;color:#fff;padding:5px 12px;position:absolute;z-index:5;top:-32px;left:3px;display:none}
.validform_checktip::before{background:#d70022;bottom:-8px;content:'.';height:16px;position:absolute;text-indent:-999px;-webkit-transform:rotate(45deg);transform:rotate(45deg);white-space:nowrap;width:16px;z-index:-1}
.validform_right{display:none}
.validform_wrong{display:block;-webkit-animation:fade-down 450ms;animation:fade-down 450ms}

@media (min-width:521px) and (min-height:481px) {
    .main{margin:-15px auto 0 auto;padding:50px 40px 40px 40px;width:420px;min-height:420px;border-radius:4px;background:#fff;box-shadow:0 2px 8px rgba(12,12,13,.1);transition:box-shadow 250ms cubic-bezier(.07,.95,0,1)}
}
@media (max-width:520px), (orientation:landscape) and (min-width:481px) and (max-height:480px) {
    .main{margin:-15px auto 0 auto;max-width:360px;min-height:300px!important;min-width:300px;padding:50px 20px 20px 20px;position:relative;width:94%}
    .error{width:100%}
}
@-webkit-keyframes fade-down {
    0%{opacity:0;-webkit-transform:translateY(-15px);transform:translateY(-15px)}
    100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}
}
@keyframes fade-down {
    0%{opacity:0;-webkit-transform:translateY(-15px);transform:translateY(-15px)}
    100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}
}
@-webkit-keyframes spin {
    from{-webkit-transform:rotate(0);transform:rotate(0)}
    to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}
}
@keyframes spin {
    from{-webkit-transform:rotate(0);transform:rotate(0)}
    to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}
}