@media(min-width:1441px) {
    body {
        font-family: 'Microsoft YaHei',Arial !important;
        background: url('../images/login_bg.jpg') no-repeat;
        background-position: top center;
        margin: 0 auto;
        font-family: Arial;
        font-size: 14px;
        background-size: 100% auto;
        background-repeat: no-repeat;
        overflow-y: auto;
    }

    .navbar > .container {
        width: 1140px;
    }

    .container {
        width: 100%;
        padding: 0;
    }

    .wrapper {
        width: 100%;
        margin: auto;
        height: 532px;
        position: absolute;
        top: 50%;
        margin: -266px 0 0 0;
        padding: 0;
    }

    #loginbar > .bgBar {
        background-color: #1f8eee;
        height: 317px;
        width: 100%;
        position: absolute;
        top: 106px;
        box-shadow: 0 0 10px rgba(31,142,238,1);
        -webkit-box-shadow: 0 0 10px rgba(31,142,238,1);
        -moz-box-shadow: 0 0 10px rgba(31,142,238,1);
    }

    .login-form {
        min-width: 997px;
        height: 532px;
        left: -490px;
        margin-left: 50%;
        position: relative;
        background-color: #fff;
        box-shadow: 0 0 40px rgba(119, 189, 237, 1);
        -webkit-box-shadow: 0 0 40px rgba(119, 189, 237, 1);
        -moz-box-shadow: 0 0 40px rgba(119, 189, 237, 1);
    }

        .login-form .blockOverlay {
            background-color: transparent !important;
        }

    #loginZone {
        width: 340px;
        float: right;
    }

    .login-form > .column {
        position: absolute;
        top: 0;
    }

    .login-form > img {
        height: 532px;
    }

    .login-form > .mImg {
        left: 0;
    }

    .login-form > .lImg {
        left: -34px;
    }

    .login-form > .rImg {
        right: -34px;
    }

    .login-form .login-form-head {
        text-align: center;
        font-family: 'Microsoft YaHei',Arial;
        letter-spacing: 0px;
        font-size: 26px;
        color: #2979c3;
        margin: 40px auto 30px auto;
        font-weight: bold;
        color: #dad9d9;
    }

        .login-form .login-form-head > img {
            display: none;
        }
    /*UserName&PassWord*/
    .login-form .login-control {
        width: 85%;
        height: 50px;
        margin: 35px auto auto;
        -moz-border-radius: 8px; /* Gecko browsers */
        -webkit-border-radius: 8px; /* Webkit browsers */
        border-radius: 8px; /* W3C syntax */
        padding-left: 14%;
        border: solid 1px #dad9d9;
        background-color: transparent;
        color: #b3b3b3;
    }

    .form-control:hover {
        border-color: rgba(41, 121, 195, 0.5);
        color: rgba(41, 121, 195, 0.5);
    }

    .form-control:focus {
        box-shadow: 0 0 10px -3px #2979c3;
        border-color: rgba(41, 121, 195, 0.5);
        color: rgba(41, 121, 195, 0.5);
    }

        .form-control:hover + i, .form-control:focus + i {
            color: rgba(41, 121, 195, 0.5);
        }

    .login-form .check-img {
        width: 50% !important;
        margin: 35px auto 15px 7.5%;
    }

    .login-form .login-btn {
        width: 85%;
        height: 50px;
        margin: 0px auto;
        -moz-border-radius: 6px; /* Gecko browsers */
        -webkit-border-radius: 6px; /* Webkit browsers */
        border-radius: 6px; /* W3C syntax */
        letter-spacing: 2px;
        font-size: 26px;
        line-height: 0;
        cursor: pointer;
        border: none !important;
        background-color: #66abd4;
        color: #FFF;
    }

    .login-btn:disabled {
        background-color: #b3b3b3;
        cursor: not-allowed !important;
    }

    .login-input-icon {
        color: #dad9d9;
        font-size: 28px;
        position: absolute;
        left: 12%;
        top: 4px;
    }

    .login-check-img {
        width: 100px;
        height: 42px;
        position: absolute;
        right: 7.5%;
        top: 4px;
    }

    .login-right-img {
        width: 25px;
        height: 25px;
        position: absolute;
        right: -6px;
        top: 10px;
    }
    /*checkbox*/
    .login-remember {
        margin: 25px auto 30px 28px;
        overflow: hidden;
        width: 85%;
        font-size: 18px;
    }

        .login-remember .login-remember-check {
            float: left;
            width: 18px;
            height: 18px;
        }

    .remember {
        float: left;
        letter-spacing: 1px;
        margin-left: 4px;
        color: #999999;
    }

    .login-remember .login-fp {
        float: right;
        color: #FFC05E;
    }

    .wrapper > form > div {
        overflow: hidden;
    }
}

@media(max-width:1440px) {
    body {
        font-family: 'Microsoft YaHei',Arial !important;
        background: url('../images/login_bg.jpg') no-repeat;
        background-position: top center;
        margin: 0 auto;
        font-family: "微软雅黑";
        font-size: 14px;
        background-size: 100% auto;
        background-repeat: no-repeat;
        overflow-y: auto;
    }

    .navbar > .container {
        width: 1140px;
    }

    .container {
        width: 100%;
        padding: 0;
    }

    .navbar-nav.navbar-right:last-child {
        margin-right: 0;
    }

    .navbar > .container .navbar-brand {
        margin-left: 15px;
    }

    .wrapper {
        width: 100%;
        margin: auto;
        height: 340px;
        position: absolute;
        top: 50%;
        margin: -165px 0 0 0;
        padding: 0;
    }

    #loginbar > .bgBar {
        background-color: #1f8eee;
        height: 204px;
        width: 100%;
        position: absolute;
        top: 67px;
        box-shadow: 0 0 5px rgba(31,142,238,1);
        -webkit-box-shadow: 0 0 5px rgba(31,142,238,1);
        -moz-box-shadow: 0 0 5px rgba(31,142,238,1);
    }

    .login-form {
        min-width: 699px;
        height: 340px;
        margin-left: 50%;
        margin-right: 50%;
        left: -348px;
        background-color: #fff;
        position: relative;
        box-shadow: 0 0 10px rgba(119, 189, 237, 0.75);
        -webkit-box-shadow: 0 0 10px rgba(119, 189, 237, 0.75);
        -moz-box-shadow: 0 0 10px rgba(119, 189, 237, 0.75);
    }

        .login-form .blockOverlay {
            background-color: transparent !important;
        }

    #loginZone {
        width: 265px;
        float: right;
    }

    .login-form > .column {
        position: absolute;
        top: 0;
    }

    .login-form > img {
        height: 340px;
    }

    .login-form > .mImg {
        left: 0;
    }

    .login-form > .lImg {
        left: -22px;
    }

    .login-form > .rImg {
        right: -22px;
    }

    .login-form .login-form-head {
        text-align: center;
        font-family: 'Microsoft YaHei',Arial;
        letter-spacing: 2px;
        font-size: 26px;
        color: #2979c3;
        margin: 20px auto auto auto;
        font-weight: bold;
    }

        .login-form .login-form-head > img {
            display: none;
        }
    /*UserName&PassWord*/
    .login-form .login-control {
        width: 95%;
        height: 36px;
        margin: 15px auto auto;
        -moz-border-radius: 6px; /* Gecko browsers */
        -webkit-border-radius: 6px; /* Webkit browsers */
        border-radius: 6px; /* W3C syntax */
        padding-left: 12%;
        border: solid 1px #dad9d9;
        background-color: transparent;
        color: #b3b3b3;
    }

    .form-control:hover {
        border-color: rgba(41, 121, 195, 0.5);
        color: rgba(41, 121, 195, 0.5);
    }

    .form-control:focus {
        box-shadow: 0 0 10px -3px #2979c3;
        border-color: rgba(41, 121, 195, 0.5);
        color: rgba(41, 121, 195, 0.5);
    }

        .form-control:hover + i, .form-control:focus + i {
            color: rgba(41, 121, 195, 0.5);
        }

    .login-form .check-img {
        width: 55% !important;
        margin: 15px auto 15px 2.5%;
    }

    .login-form .login-btn {
        width: 95%;
        height: 36px;
        margin: 0px auto;
        -moz-border-radius: 6px; /* Gecko browsers */
        -webkit-border-radius: 6px; /* Webkit browsers */
        border-radius: 6px; /* W3C syntax */
        letter-spacing: 2px;
        background-color: #66abd4;
        color: #FFF;
        font-size: 16px;
        line-height: 0;
        cursor: pointer;
        border: none !important;
    }

    .login-btn:disabled {
        background-color: #b3b3b3;
        cursor: not-allowed !important;
    }

    .login-input-icon {
        color: #dad9d9;
        font-size: 20px;
        position: absolute;
        left: 6%;
        top: 4px;
    }

    .login-check-img {
        width: 80px;
        height: 30px;
        position: absolute;
        right: 2.5%;
        top: 3px;
    }

    .login-right-img {
        width: 25px;
        height: 25px;
        position: absolute;
        right: 0;
        top: 3px;
    }
    /*checkbox*/
    .login-remember {
        margin: 0px auto 15px 7px;
        overflow: hidden;
        width: 95%;
        font-size: 14px;
    }

        .login-remember .login-remember-check {
            float: left;
            width: 14px;
            height: 14px;
        }

    .remember {
        float: left;
        letter-spacing: 1px;
        margin-left: 4px;
        color: #999999;
    }

    .login-remember .login-fp {
        float: right;
        color: #FFC05E;
    }

    .wrapper > form > div {
        overflow: hidden;
    }
}

@media(max-width:1280px) {
    body {
        background-size: 130% auto;
    }

    .navbar > .container {
        width: 970px;
        min-width: inherit;
    }

    .container {
        width: 100%;
        padding: 0;
    }
}

@media(max-width:970px) {
    .navbar > .container {
        width: 750px;
        min-width: inherit;
    }

    .container {
        width: 100%;
        padding: 0;
    }
}

@media(max-width:800px) {
    body {
        background-size: 100% auto;
    }

    .navbar > .container {
        width: 90%;
        min-width: inherit;
    }

    .container {
        width: 100%;
        padding: 0;
    }

    .login-form > img, #loginbar > .bgBar {
        display: none;
    }

    body {
        background-image: url('../images/login_2.jpg');
    }

    .wrapper {
        bottom: 50%;
        margin-top: -250px;
    }

    .login-form {
        min-width: 500px;
        /*height:500px;*/
        left: -200px;
    }

    #loginZone {
        width: 90%;
        float: none;
        margin: auto;
    }

    .login-form .login-form-head {
        font-size: 60px;
    }

    .login-form .login-control {
        height: 50px;
        margin-top: 30px;
        font-size: 24px;
        background-color: transparent;
    }

    .login-btn, .login-btn:disabled {
        background-color: #66abd4 !important;
        color: #FFF;
    }

    .login-form .login-control {
        padding-left: 14%;
    }

    .login-input-icon {
        font-size: 30px;
        color: #b3b3b3;
    }

    .login-check-img {
        width: 70px;
        height: 32px;
    }

    .login-remember {
        font-size: 20px;
        margin-left: 5px;
    }

        .login-remember .login-remember-check {
            width: 20px;
            height: 20px;
            margin-top: 4px;
        }

    .wrapper {
        margin-top: -250px;
        margin-bottom: 100px;
    }

    .login-form {
        min-width: 380px;
        left: -190px;
        height: 500px;
        filter: alpha(opacity=90);
        -moz-opacity: 0.9;
        -khtml-opacity: 0.9;
        opacity: 0.9;
    }

        .login-form .login-form-head {
            font-size: 22px;
        }

        .login-form .login-control, .login-form {
            height: 50px;
            margin-top: 30px;
            font-size: 16px;
        }

            .login-form .login-control {
                padding-left: 16%;
            }

    .form-control:hover, .form-control:focus {
        border-color: rgba(41, 121, 195, 0.5);
        box-shadow: 0 0 10px -4px #2979c3;
    }
}

@media(max-width:768px) {
    body {
        background-image: url(/images/login_bg_phone.jpg);
    }

    .navbar {
        position: absolute;
        background-color: transparent;
        border: none;
    }

    .logo {
        display: none;
    }

    .anav {
        -moz-user-select: none;
        -o-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .footer {
        position: absolute;
        background-color: transparent;
        padding: 0;
    }

    .first-bar i {
        display: none;
    }

    .navbar-collapse {
        display: block;
    }

    .navbar-default .navbar-collapse ul, .navbar-default .navbar-collapse ul:focus, .navbar-default .navbar-collapse ul:visited, .navbar-default .navbar-collapse ul:hover, .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:visited, .navbar-default .navbar-nav > li > a:hover {
        background-color: transparent;
    }

    .navbar-default .navbar-collapse > ul > li {
        padding: 0 !important;
    }

        .navbar-default .navbar-collapse > ul > li > ul {
        }

            .navbar-default .navbar-collapse > ul > li > ul > li, .navbar-default .navbar-collapse > ul > li > ul > li:hover, .navbar-default .navbar-collapse > ul > li > ul > li:visited {
                background-color: #66abd4;
                opacity: 1;
            }

                .navbar-default .navbar-collapse > ul > li > ul > li :first-child {
                    background-color: transparent;
                }

    .navbar-nav.navbar-right:last-child {
        margin-top: -50% !important;
    }

    form.login-form {
        background-color: transparent;
        box-shadow: none;
        width: 100%;
        min-width: initial;
        max-width: initial;
        margin: 0 auto;
        position: initial;
    }

    #loginZone input.login-control {
        border: none;
        border-bottom: 1px solid #d2e5f7;
        box-shadow: none;
        border-radius: 0;
        color: #d2e5f7;
    }

        #loginZone input.login-control + i {
            color: #d2e5f7;
        }

        #loginZone input.login-control:hover + i, #loginZone input.login-control:focus + i {
            color: #d2e5f7;
            box-shadow: none;
        }


    .login-check-img {
        width: 30%;
        height: 40px;
    }

    #loginZone h2.login-form-head {
        font-size: 30px;
        color: #d2e5f7;
    }

    .login-remember {
        padding: 5% 0% 5% 5%;
    }

    .remember {
        color: #d2e5f7;
        vertical-align: bottom;
    }

    a.login-fp {
        text-align: right;
        float: right;
    }

    #loginZone .login-btn {
        border: none;
        box-shadow: none;
        opacity: 0.8;
    }

        #loginZone .login-btn:hover {
            opacity: 1;
        }
}

@media(max-width:480px) {
    .remember, .login-fp {
        font-size: 16px;
    }
}

@media(max-width:420px) {
    .remember, .login-fp {
        font-size: 16px;
    }

    #loginZone h2.login-form-head {
        color: #d2e5f7;
    }
}

@media(max-width:330px) {

    #loginZone h2.login-form-head {
        font-size: 24px;
        color: #d2e5f7;
    }

    .remember, .login-fp {
        font-size: 14px;
    }

    .wrapper {
        top: 60%;
        margin-bottom: 0;
    }

    #loginZone input.login-control {
        margin-top: 20px;
    }

    .remember, .login-fp {
        font-size: 14px;
    }

    #loginZone .login-remember-check {
        margin: 0;
    }

    .login-check-img {
        width: 30%;
        height: 30px;
        margin-top: 15px;
    }

    .footer-inner {
        font-size: 14px;
        line-height: initial;
    }

    #loginZone input.login-control + i {
        font-size: 26px;
    }

    form.login-form {
        padding: 0;
    }

    #loginZone h2.login-form-head + div > input.login-control {
        margin-top: 0;
    }
}
/*IPHONE4适配*/
@media(max-height:481px) {
    .wrapper {
        top: 65%;
    }

    #loginZone .login-btn {
        margin-top: 0;
    }
}