﻿* {
    margin: 0;
    padding: 0;
}

body, html {
    width: 100%;
    min-width: 1366px;
    min-height: 650px;
}

.login_content {
    width: 100%;
    height: calc(100vh);
    background: url(../dist/img/111401.png) no-repeat center 0;
    position: relative;
    background-size: 100% 100%;
    overflow: auto;
}

@keyframes titlelogo{
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
.login_content .titlelogo {
    width: 20rem;
    float: right;
}
    .login_content .titlelogo img{
        width: 8rem;
        margin-right:4rem;
        margin-top:2rem;
        float: right;
    }
@keyframes mainArea {
    from {
        margin-top: 6%;
        opacity: 0;
    }

    to {
        margin-top: 10%;
        opacity: 1;
    }
}

.login_content .mainArea {
    width: 60%;
    height: 70%;
    background-color: #F8F6F8;
    margin: 8% auto 0;
    animation: mainArea 1s ease;
}

    .login_content .mainArea .logo {
        width: 60%;
        height: 20%;
        text-align: center;
    }

        .login_content .mainArea .logo img {
            text-align: center;
            margin-top: 2%;
            margin-left:35%;
            width: 90%;
        }

@keyframes iptArea {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.login_content .mainArea .iptArea {
    width: 50%;
    height: 80%;
    background-color: #F8F6F8;
    overflow: hidden;
    float: left;
    animation: iptArea 2s ease;
}

@keyframes righttArea{
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
.login_content .mainArea .righttArea {
    width: 50%;
    height: 80%;
    background-color: #F8F6F8;
    overflow: hidden;
    float: right;
    animation: iptArea 2s ease;
}
    .login_content .mainArea .righttArea img {
        /*margin-top: 1rem;*/
        width: 90%;
        text-align: center;
    }
@keyframes aniLeft {
    from {
        left: 30rem;
    }

    to {
        left: 20rem;
    }
}

@keyframes aniRight {
    from {
        right: 30rem;
    }

    to {
        right: 20rem;
    }
}

.aniLeft {
    position: absolute;
    width: 3rem;
    top: 8.3rem;
    left: 20rem;
    animation: aniLeft 1s ease;
}

.aniRight {
    position: absolute;
    width: 3rem;
    right: 20rem;
    top: 8.3rem;
    animation: aniRight 1s ease;
}


.login_content .mainArea .iptArea .title {
    width: 100%;
    background-color: #F8F6F8;
    height: 15%;
    text-align: center;
}
.login_content .mainArea .iptArea .title img {
    width: 60%;
}
.login_content .mainArea .iptArea .headimage {
    width: 100%;
    height: 30%;
    text-align: center;
    background-color: #F8F6F8;
}
.login_content .mainArea .iptArea .headimage img {
   margin-right:5%;
   margin-top:3%;
    width: 18%;
}

.login_content .mainArea .iptArea .iptMod {
    width: 100%;
    height: 12.8%;
    background: #F8F6F8;
    margin: 0rem auto 0.8rem;
}

    .login_content .mainArea .iptArea .iptMod img {
        width: 12%; /*设置图片显示的宽*/
        height:90%;
        margin-left:15%;
        
    }

    .login_content .mainArea .iptArea .iptMod input {
        border-style: outset;
        outline: none;
        background: #F8F6F8;
        height: 95%;
        width: 55%;
        font-size: 0.7rem;
        color: #000000;
        border-radius: 5px;
    }

        .login_content .mainArea .iptArea .iptMod input::-webkit-input-placeholder { /* WebKit, Blink, Edge */
            color: #BFC1C8;
        }

        .login_content .mainArea .iptArea .iptMod input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
            color: #BFC1C8;
        }

        .login_content .mainArea .iptArea .iptMod input::-moz-placeholder { /* Mozilla Firefox 19+ */
            color: #BFC1C8;
        }

        .login_content .mainArea .iptArea .iptMod input:-ms-input-placeholder { /* Internet Explorer 10-11 */
            color: #BFC1C8;
        }

.login_content .mainArea .iptArea .savePwd {
    width: 12rem;
    margin: -0.5rem auto 0;
}

    .login_content .mainArea .iptArea .savePwd .checkBtn {
        float: left;
        width: 0.7rem;
        height: 0.7rem;
        border: 0.05rem solid #798eab;
        background: #0f254f;
        margin-left: 0.9rem;
        margin-top: 0.6rem;
        text-align: center;
        cursor: pointer;
    }

        .login_content .mainArea .iptArea .savePwd .checkBtn img {
            width: 0.5rem;
            margin-top: 0.125rem;
            margin-left: 0.05rem;
            display: none;
            moz-user-select: -moz-none;
            -moz-user-select: none;
            -o-user-select: none;
            -khtml-user-select: none;
            -webkit-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }

        .login_content .mainArea .iptArea .savePwd .checkBtn.on img {
            display: block;
        }

    .login_content .mainArea .iptArea .savePwd span {
        color: #BFC1C8;
        font-size: 0.6rem;
        margin-left: 0.25rem;
    }

.login_content .mainArea .iptArea .login_btn {
    /*margin-left:1.4rem;
    margin-top:0.5rem;
    width: 81%;*/
    border: 1px,#1229b4,solid;
    width: 100%;
    height: 20%;
    /*line-height: 1.75rem;*/
    background: #F8F6F8;
    margin: 0rem auto;
    color: #1A5C95;
    padding-left: 15%;
    font-size: 0.75rem;
    cursor: pointer;
}
    .login_content .mainArea .iptArea .login_btn input {
        outline: none;
        background: #F8F6F8;
        height: 50%;
        width: 80%;
        /*font-size: 0.7rem;*/
        color: #1A5C95;
        /*margin-left: 0.3rem;*/
        border-radius: 15px;
        border: 2px solid #1A5C95;
        margin-top:3%;
    }




/* 加载动画 */
.app-loading {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    background: rgba(0,0,0,0.6);
    z-index: 20000;
}

    .app-loading .wait {
        font-size: 0.9rem;
        color: #fff;
        text-align: center;
        margin-top: 1.25rem;
    }

.skype-loader {
    width: 4rem;
    height: 4rem;
    position: relative;
    margin: auto;
    margin-top: 16%;
}

    .skype-loader .dot {
        position: absolute;
        top: 0;
        left: 0;
        width: 4rem;
        height: 4rem;
        animation: 1.7s dotrotate cubic-bezier(0.775, 0.005, 0.310, 1.000) infinite;
    }

        .skype-loader .dot:nth-child(1) {
            animation-delay: 0.1s;
        }

        .skype-loader .dot:nth-child(2) {
            animation-delay: 0.35s;
        }

        .skype-loader .dot:nth-child(3) {
            animation-delay: 0.45s;
        }

        .skype-loader .dot:nth-child(4) {
            animation-delay: 0.55s;
        }

        .skype-loader .dot:after, .skype-loader .dot .first {
            content: "";
            position: absolute;
            width: 0.4rem;
            height: 0.4rem;
            background: white;
            border-radius: 50%;
            left: 50%;
            margin-left: -0.2rem;
        }

        .skype-loader .dot .first {
            background: #fff;
            margin-top: -0.2rem;
            animation: 1.7s dotscale cubic-bezier(0.775, 0.005, 0.310, 1.000) infinite;
            animation-delay: 0.1s;
        }

@keyframes dotrotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes dotscale {
    0%, 10% {
        width: 0.8rem;
        height: 0.8rem;
        margin-left: -0.4rem;
        margin-top: -0.2rem;
    }

    50% {
        width: 0.4rem;
        height: 0.4rem;
        margin-left: -0.2rem;
        margin-top: 0;
    }

    90%, 100% {
        width: 0.8rem;
        height: 0.8rem;
        margin-left: -0.4rem;
        margin-top: -0.2rem;
    }
}

.login_content .mainArea .iptArea .iptMod input:-webkit-autofill {
    color: #BFC1C8 !important;
    transition: all 50000s ease-in-out 0s;
}


.k-notification-button .k-notification-wrap {
    font-size: 0.8rem;
    cursor: pointer;
}

.k-notification-wrap .k-i-error {
    display: none;
}

.k-notification-wrap {
    padding: 0.3rem 0.7rem !important;
}

    .k-notification-wrap > .k-i-close {
        display: none !important;
    }
