@font-face {
    font-family: "sf-icon";
    src: url('/content/iconfont.woff2?t=1638428754406') format('woff2');
}

* {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
}

html {
    min-width: 1200px;
    height: 100%;
}

body {
    background: url(/owl-ui/metronic/content/img/login_background.webp) center center no-repeat;
    background-size: cover;
    background-attachment: fixed;
    float: left;
    width: 100%;
    height: 100%;
}

input:-webkit-autofill {
    box-shadow: 0 0 0px 10000px #fff inset !important;
}

a {
    text-decoration: none;
}

input::-webkit-input-placeholder {
    color: #d9d9d9;
    font-size: 12px;
}

.content {
    float: left;
    width: 76%;
    margin: 12% 12% 0;
    border: solid 0px blue;
}

    .content .login-logo {
        width: 538px;
        height: 332px;
        float: left;
    }

        .content .login-logo img {
            height: 332px;
        }

    /* .content .login-logo img.phonehight {
                height: 249px;
            } */

    .content .login {
        float: right;
        display: inline-block;
        vertical-align: top;
        width: 366px;
        min-height: 332px;
        background-color: #fff;
    }

    .content .login-phone {
        min-height: 252px;
    }

    .content .login .login-form .login-tab {
        width: 183px;
        float: left;
        height: 40px;
        text-align: center;
        background-color: #48abf9;
        color: #fff;
        font-size: 13px;
        line-height: 40px;
        cursor: pointer;
    }

    .content .login .login-form .login-content {
        float: left;
        width: 82%;
        display: none;
        margin: 0px 9% 10px;
        overflow: hidden;
    }

    .content .login .login-form .login-tab.selected {
        background-color: #fff;
        color: #003f87;
    }

    .content .login .login-form .login-content.selected {
        display: inherit;
    }

    .content .login .login-form .account-login {
        height: 165px;
    }

    .content .login .login-form .phone-login {
        /* height: 88px; */
        height: 149px;
    }

    .content .login.login-phone .login-form .phone-login {
        height: 126px;
    }

    .content .login .login-form .phone-login .btn_sendcode {
        line-height: 1.5;
        position: relative;
        display: inline-block;
        font-weight: 400;
        white-space: nowrap;
        text-align: center;
        background-image: none;
        border: 1px solid transparent;
        box-shadow: 0 2px 0 rgb(0 0 0 / 2%);
        cursor: pointer;
        transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        touch-action: manipulation;
        height: 32px;
        padding: 0 15px;
        font-size: 12px;
        border-radius: 4px;
        color: rgba(0, 0, 0, 0.65);
        background-color: #fff;
        border-color: #d9d9d9;
        float: right;
        width: 117px;
        margin-top: 10px;
    }

    .content .login .login-form .errormsg {
        width: 82%;
        box-sizing: border-box;
        color: rgba(0, 0, 0, 0.85);
        font-size: 12px;
        font-variant: tabular-nums;
        line-height: 1.5;
        list-style: none;
        font-feature-settings: "tnum";
        position: relative;
        padding: 8px 15px 8px 37px;
        word-wrap: break-word;
        border-radius: 4px;
        background-color: #fffbe6;
        height: auto;
        margin: 0px 9% 10px;
    }

        .content .login .login-form .errormsg span {
            width: auto;
        }

    .content .login.login-phone .login-form .client {
        margin: 20px 9% 0px;
    }

    .content .login .login-form .client {
        float: left;
        width: 82%;
        margin: 10px 9% 0px;
    }

    .content .login .login-form div {
        float: left;
        width: 100%;
        line-height: 44px;
        height: 44px;
        position: relative;
    }

    .content .login .login-form .ruleFormPhone div {
        height: 60px;
    }


    .content .login .login-form div span {
        float: left;
        width: 25px;
    }


    .content .login .login-form div i.sf-icon {
        width: 20px;
        font-family: 'sf-icon';
        position: relative;
        font: 12px "sf-icon";
        font: 0.37333rem/1 "sf-icon";
        -webkit-font-smoothing: antialiased;
        font-size: 16px;
        color: rgba(0, 0, 0, 0.65);
    }

    .content .login .login-form div i.login-password-eye {
        float: left;
        width: 25px;
        position: absolute;
        border: 0;
        margin: 0;
        right: 0px;
        top: 14px;
    }

    .content .login .login-form div input.error {
        border-bottom: 1px solid red !important;
    }

        .content .login .login-form div input.error::-webkit-input-placeholder {
            color: red;
        }

    .content .login .login-form div input.control {
        width: 275px;
        height: 43px;
        border-bottom: 1px solid #e4dfdf;
        line-height: 35px;
        outline: none;
        float: left;
        font-size: 14px;
    }

    .content .login .login-form .login-tab.phone-login-tab.selected + div.client {
        height: 60px;
    }




    .content .login .login-form div input.control.authcode {
        width: 225px;
    }

    .content .login .login-form div input.control.phonecode {
        width: 158px;
    }

    .content .login .login-form div input.loginremember {
        float: left;
        margin-top: 18px;
    }

    .content .login .login-form div a.validation_login {
        float: right;
        overflow: hidden;
        padding-top: 10px;
    }

    .content .login .login-form div a.forgetpwd {
        float: right;
        overflow: hidden;
        color: #2d9312;
        cursor: pointer;
        font-size: 12px;
        height: 30px;
    }

    .content .login .login-form div label {
        font-size: 12px;
        color: rgba(0, 0, 0, 0.65);
        margin-left: 10px;
    }

    .content .login .login-form .buttons {
        float: left;
        width: 100%;
        margin-bottom: 10px;
    }

    .content .login.login-phone .login-form .buttons {
        margin-bottom: 32px;
    }

    .content .login .login-form .buttons button {
        width: 82%;
        background-color: rgb(253, 159, 62);
        border: none;
        border-radius: 0px;
        margin: 0px 9%;
        height: 40px;
        color: rgb(255, 255, 255);
        border-radius: 18px;
    }

.control-language {
    width: 22%;
    margin: 8em 39% 1em 39%;
    text-align: center;
    float: left;
}

    .control-language a {
        font-size: 14px;
        padding: 0 15px;
        color: rgba(0, 0, 0, 0.25);
        cursor: pointer;
    }

        .control-language a.selected {
            font-size: 14px;
            padding: 0 15px;
            color: #004bf3;
            font-weight: bold;
            cursor: pointer;
        }

.copyright {
    width: 22%;
    margin: 3em 39% 1em 39%;
    text-align: center;
    font-size: 13px;
    color: #ececec;
    float: left;
}

/* 密码*/
.sf-icon:before {
    content: "\f006";
}
/* 客户端*/
.sf-icon-std_client:before {
    content: "\f004";
}
/* 用户名*/
.sf-icon-std_username:before {
    content: "\f005";
}
/* 密码*/
.sf-icon-std_password:before {
    content: "\f006";
}
/* 密码可见*/
.sf-icon-std_password-eye:before {
    content: "\e61a";
    font-size: 20px;
}
/* 密码不可见*/
.sf-icon-std_password-eye-invisible:before {
    content: "\e63c";
    font-size: 20px;
}
/* 手机号*/
.sf-icon-std_captcha:before {
    content: "\f007";
    font-size: 20px;
}
/* 验证码*/
.sf-icon-std_default:before {
    content: "\e711";
}

.content .login .login-form div i.sf-icon.sf-icon-std_tag_warning {
    position: absolute;
    left: 16px;
    color: rgb(250, 173, 20);
    top: 11px;
}

.sf-icon-std_tag_warning:before {
    content: "\e616";
}