body{
  margin: 0;
  background-image: url(../static/img/login.png) !important;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  height: 100vh !important;
}
.login-form{
  background-image: url(../static/img/loginform.png);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  height: 25.5729vw;
  width: 29.2188vw;
  position: absolute;
  top: 50%;
  right: 8.75vw;
  transform: translateY(-50%);
  padding: 3.9583vw 5.2083vw 3.125vw 5.2083vw;
  box-sizing: border-box;
}
.login-form-title{
  font-size: 1.3542vw;
  color: #fff;
  font-weight: bold;
  text-align: center;
}
.xh-input{
  border: #1A9BFF solid .125rem;
  border-radius: .25rem;
  padding: 0 1.0417vw;
  height: 3.125vw;
  display: flex;
  align-items: center;
}
.xh-input-icon{
  height: 0.9375vw;
  width: 0.9375vw;
}
.xh-input-input{
  margin-left: .8125rem;
  background: none;
  border-width: 0;
  background:none;    
  outline:none;   
  border:none;
  font-size: 0.8333vw;
  color: #0099ff;
}
.xh-input-input::placeholder{
  color: rgba(26, 155, 255, 0.2);
}
.xh-input-input:focus{   
  border:none;
}
.margin-top{
  margin-top: 1.6667vw;
}
.me-checkbox:checked {
  background: #1673ff
}

.me-checkbox {

  outline: none;
  /*轮廓*/

  width: 1.0417vw;

  height: 1.0417vw;

  background: #ffffff;

  border: solid 1px #dddddd;

  /* -webkit-border-radius:50%; */

  border-radius: 50%;

  font-size: 0.8rem;

  margin: 0;

  padding: 0;

  position: relative;

  display: inline-block;

  vertical-align: top;

  -webkit-appearance: button;
  /*让元素看的像一个button*/

  -webkit-user-select: none;
  /*让元素无法选择*/

  user-select: none;

  -webkit-transition: background-color ease 0.1s;

  transition: background-color ease 0.1s;

}

.me-checkbox:checked::after {
  /*这个是划勾*/

  content: '';

  top: 5px;

  left: 5px;

  position: absolute;

  background: transparent;

  border: #fff solid 2px;

  border-top: none;

  border-right: none;

  height: 6px;

  width: 10px;

  -moz-transform: rotate(-45deg);

  -ms-transform: rotate(-45deg);

  -webkit-transform: rotate(-45deg);

  transform: rotate(-45deg);

}

#ccc {

  outline: #00FF00 dotted thick;

  width: 25px;

  height: 25px;

  background-color: #ffffff;

  border: solid 1px #dddddd;

  /* -webkit-border-radius:50%; */

  border-radius: 50%;

  display: inline-block;

  -webkit-appearance: button;

}

#ccc:checked {

  background-color: green;

}
.xh-choice{
  display: flex;
  align-items: center;
}
.xh-choice-lable{
  color: #1A9BFF;
  font-size: .875rem;
  margin-left: .625rem;
}
.xh-bottom{
  line-height: 3.125vw;
  text-align: center;
  border-radius: .25rem;
  background: #1A9BFF;
  color: #fff;
  transition: all .3s;
  cursor: pointer;
}
.xh-bottom:hover{
  opacity: .8;
}
.mask{
  position: fixed;
  left: 0;
  top: 0;
  height: 100vh;
  width: 100vw;
  background-color: rgba(0, 0 ,0, 0.5);
  z-index: -2;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: all .5s;
  
}
.mask img{
  height: 2.6042vw;
  -webkit-animation: rotate-center 2s infinite;
  animation: rotate-center 2s linear infinite;
}
/* ----------------------------------------------
 * Generated by Animista on 2022-6-23 16:53:40
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation rotate-center
 * ----------------------------------------
 */
 @-webkit-keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  50% {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
  }
  100%{
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  50% {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
  }
  100%{
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
