#app {
  background-image: url("./img/bg50@2x.png");
  width: 100vw;
  height: 100vh;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;

  .content {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    height: 100%;

    .left {
      width: 50%;
    }

    .right {
      position: relative;
      width: 50%;

      .login-form {
        position: absolute;
        // right: 201px;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 400px;
        background-color: rgb(238, 246, 255);
        padding: 50px;
        box-sizing: border-box;
        border-radius: 20px;

        .login-form-title {
          font-size: 30px;
          font-weight: 700;
          text-align: center;
          margin-bottom: 20px;
        }

        .demo-ruleForm {

          .captcha {
            .el-form-item__content {
              display: flex;
              flex-wrap: nowrap;
              align-items: center;
              position: relative;

              img {
                height: 40px;
                position: absolute;
                right: 0;
              }

              .input-captcha {
                width: 150px;
              }
            }

          }
        }

        .submit {
          width: 100%;

          span {
            font-size: 25px;
            font-weight: Regular;
          }
        }

        .other {
          font-size: 16px;
          font-weight: Regular;

          .forgot-password {
            cursor: pointer;
          }

          .no-account {
            // margin-left: auto
            cursor: pointer;
            float: right;
            color: #409EF1;
          }

          .sign-up {
            // margin-left: auto
            cursor: pointer;
            float: right;

          }
        }
      }
    }
  }

  .copyright {
    color: #409EF1;
    font-size: 22px;
    font-weight: Regular;

    position: absolute;
    left: 50%;
    bottom: 0px;
    transform: translate(-50%, -33px);

  }
}



.icon {
  height: 16px;
  width: 16px;
  // line-height: 40px;
  display: inline-block;
  background-size: cover;
  vertical-align: middle;
}

.icon-username {
  .icon();
  background-image: url("./img/username2x.png");

}

.icon-password {
  .icon();
  background-image: url("./img/password@2x.png");

}

.el-input__inner {
  // padding-left: 60px;
  background-color: rgb(243, 244, 249);
  // margin: 0px 50px;
}

.el-input__prefix {
  padding: 0px 5px;
  text-align: center;
  vertical-align: middle;
}