.hc-new-login { position: relative; background-color: #13161F; overflow: hidden; .hc-new-login-bg { position: absolute; object-fit: cover; width: 100%; height: 100%; } .hc-new-login-main .hc-new-login-content .hc-new-login-form-card { position: relative; border-radius: 13px; height: 500px; } .hc-new-login-copyright { position: absolute; bottom: 0; width: 100%; text-align: center; padding: 20px 0; color: white; font-size: 12px; .text { white-space: pre-wrap; } .text + .text { margin-top: 6px; } } } .hc-new-login .hc-new-login-main .hc-new-login-content .hc-new-login-form-card { .form-left { .form-img { position: absolute; width: 370px; bottom: 16px; left: 60px; } &:before { content: ''; position: absolute; width: 2px; height: 90%; right: 0; top: 5%; background: rgba(138, 138, 138, 0.39); } } .form-right { padding: 26px 0; .form-main { position: relative; width: 359px; margin: auto; height: 100%; .title { color: #041015; margin-bottom: 40px; } .el-form .el-form-item { .el-input { --el-input-bg-color: #E7E7E6; --el-input-placeholder-color: #787676; .el-input-group__prepend { padding: 0 10px; background-color: var(--el-input-bg-color); box-shadow: 0 0 0 1px #d3d3d3 inset; i { font-size: 20px; color: #626060; } &:before { content: ''; background: #BBBBBB; position: absolute; right: 0; height: 26px; width: 1px; } } .el-input__wrapper { box-shadow: 0 0 0 1px #d3d3d3 inset; } .el-input__inner { color: #0a0a0a; } } &.checkbox-1, &.checkbox-2 { margin-bottom: 0; .el-form-item__content { line-height: 30px; .el-checkbox.el-checkbox--large { height: 30px; } } } .el-checkbox { color: #626060; } .el-checkbox__input.is-checked + .el-checkbox__label { color: #626060; } &.login-btn { margin-top: 50px; margin-bottom: 0; } } } } }