/* clear element default style */
html, body, p, h1, h2, h3, h4, h5, h6, ul, li, ol, dl, dd, dt, img, input, textarea, menu, button {
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    outline: none;
}
*{
    padding: 0;
    margin: 0;
    font-family: 'Microsoft Yahei'
}
body{
    width: 100%;
    height: 100%;
    font-size: 16px!important;
}
.OutDiv{
    background-image: url(../img/background.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
    height: 100%;
    width: 100%;
    position: absolute;
    display: flex;
    flex-direction: row;
}
.leftDiv{
    position: relative;
    width: 70%;
    height: 100%;
    background: none;
}
.leftDiv img{
    position: absolute;
    top: 10%;
    left: 4.5%;
    height: 100px;
    width: auto;
}
.leftBottomDiv{
    position: absolute;
    bottom: 16%;
    width: 100%;
    height: 22%;
    background-image: url("../img/left_background.png");
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
    color: white;
    text-align: center;
}
.leftBottomDiv .Name{margin-bottom: 5px;font-weight: bold;font-size: 36pt;word-break: break-word;}
.leftBottomDiv .EName{text-transform: uppercase;font-weight: 200;font-size: 13pt}
.LoginOut{
    display:flex;flex-direction:column;position: fixed;right: 0;top: 0;width: 30%;height: 100%;background: white
}
.Welcome{
    color: #4977fc;text-align: center;margin: 5%;
}
.Login{
    position: relative;
}
.Login .input{
    position: relative;
    width: 90%;
    height: 60px;
    margin: 5%;
    border-bottom: 2px solid #b3b3b3;
    display: flex;
    flex-direction: row;
}
.tip{
    margin-left: 30px;margin-top: 10px;font-size: 16pt;color: red;
}
.Login div:first-child{
    flex: 1;
    height: 60px;
    line-height: 60px;
}
.Login div:first-child img{
    vertical-align: middle;
    line-height: 60px;
}
.Login input::placeholder{
    color: #999999;
}

.Login input{
    padding-left: 2%;
    font-size: 18pt;
    line-height: 60px;
    background: none;
    flex: 8;
}
.checkbox{
    border: 1px solid #4977fc;
    margin-left: 5%;
    padding: 2px;
    width: 15px;
    height: 15px;
}
.checkSpan{
    text-align: center;color: #4977fc;font-size: 12pt;margin-left: 50px;
}
.checkSpan span{
    float: left;
}
.LoginBtnDiv{
    width: 100%;text-align: center;margin-top: 10%;
}
.loginBtn{
    background: #4977fc!important;color: white;margin: auto;width: 80%;line-height: 50px;border-radius: 5px;
}

@font-face {
    font-family: 'icomoon';
    src:  url('../fonts/icomoon.eot?t4qrlz');
    src:  url('../fonts/icomoon.eot?t4qrlz#iefix') format('embedded-opentype'),
    url('../fonts/icomoon.ttf?t4qrlz') format('truetype'),
    url('../fonts/icomoon.woff?t4qrlz') format('woff'),
    url('../fonts/icomoon.svg?t4qrlz#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-checkmark:before {
    content: "\ea10";
}