/*html, body, div, span, applet, h1, h2, h3, h4, h5, h6, ul, li, p {*/
  /*margin: 0px;*/
  /*padding: 0px;*/
  /*list-style-type: none;*/
/*}*/


.l {
  float: left;
}

.r {
  float: right;
}

.login_big_box a:link, .login_big_box a:visited, .login_big_box a:active {
  color: #474b4f;
  text-decoration: none;
}

a:hover {
  color: #000;
  text-decoration: none;
}

.login_big_box {
  background-color: #7ac143;
  height: 420px;
  width: 100%;
}

.login_logo {
  background-image: url(/media/img/login/logo_BioTime_new.png);
  _background: none;
  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/media/img/login/logo_t.png");
  background-repeat: no-repeat;
  background-position: center;
  height: 80px;
  width: 710px;
  margin-right: auto;
  margin-left: auto;
  margin-top: 10px;
  padding-bottom: 30px;
}

#wdms.login_logo {
  background-image: url(/media/img/login/logo_ZKBio_WDMS.png);
}

.login_oem {
  background-image: url(/media/img/login/oem.jpg);
  _background: none;
  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/media/img/login/logo_t.png");
  background-repeat: no-repeat;
  background-position: center;
  height: 80px;
  width: 710px;
  margin-right: auto;
  margin-left: auto;
  margin-top: 10px;
  padding-bottom: 30px;
}

.login_box {
  width: 75%;
  margin-right: auto;
  margin-left: auto;
  /*padding-top: 50px;*/
}

.login_box_type {
  margin-bottom: 15px;
  text-align: center;
}

.login_box_type a {
  color: #474b4f;
  text-decoration: none;
}

.login_box_type a.active {
  color: #78C03F;
}

.login_box_type a, .login_box_type span {
  font-size: 18px;
}

.login_box .login_inp {
  border: 1px solid #D3D4D4;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 15px;
  line-height: 46px;
  height: 46px;
  width: 100%;
  margin-bottom: 20px;
  color: #777c80;
  padding: 0 8px;
  -webkit-box-sizing: border-box;//Chrome
  -moz-box-sizing: border-box;//Firefox
  box-sizing: border-box;//OtherBrowser
}

.login_box .admin_tab {
  padding-right: 25px;
}

.login_box .employee_tab {
  padding-left: 25px;
}

.login_box .login_inp_tip {
  color: #D3D4D4;
}

.login_box .login_check {
  line-height: 20px;
  height: 20px;
  width: 20px;
  border: 1px solid #7ac143;
}

.login_box .logo_check_box {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 22px;
  color: #474b4f;
}

.logo_check_box a:link, .logo_check_box a:visited, .logo_check_box a:active {
  color: #474b4f;
  text-decoration: underline;
}

.logo_check_box a:hover {
  color: #000;
  text-decoration: none;
}

.login_box .login_but {
  margin-top: 15px;
}

.btn_fp, .btn_fp_disabled, .but_login, .but_reset, .empLoginBtn {

  font-size: 16px;
  font-weight: bold;
  color: #FFFFFF;
  background-repeat: no-repeat;
  background-position: left;
  height: 48px;
  background-color: #474b4f;
  text-align: left;
  /*padding-left: 60px;*/
  text-indent: 60px;
  border: 1px solid #FFFFFF;
  cursor: hand;
}

.btn_fp {
  background-image: url(/media/img/login/button1.png);
  /*min-width: 220px;*/
  padding-right: 10px;
  background-color: #7AC142;
  width: 100%;
}

.btn_fp_disabled {
  background-image: url(/media/img/login/fing_disabled.png);
  /*min-width: 220px;*/
  padding-right: 10px;
  color: #cfd3d3;
  background-color: #74777c;
  opacity: 0.9;
  cursor: default;
  width: 100%;
}

.but_login {
  /*background-image: url(/media/img/login/button2.png);*/
  /*min-width: 150px;*/
  background-color: #7AC142;
  width: 100%;
  display: block;
  text-align: center;
  text-indent: 0px;
}

.empLoginBtn {
  width: 100%;
  padding-left: 0px;
  text-align: center;
  text-indent: 0px;
  background-color: #7AC142;
}

.but_reset {
  background-image: url(/media/img/login/button2.png);

}

.but_fing:hover, .but_login:hover, .but_reset:hover {
  filter: alpha(opacity=80);
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  opacity: 0.8;
}

.login_copy {
  text-align: center!important;
  color: #999999;
  margin-top: 10px;
  /* margin-bottom: 50px; */
}

.error_tip {
  padding: 2px 0px;
  color: red;
  overflow: visible;
}

.license-register {
  text-align: center!important;
}

.license-register a {
  color: #7ac143;
  text-decoration: underline;
}

.license-register a:hover {
  color: #7ac143;
  text-decoration: underline;
}

.register-box {

}

.info-box-activation {

}

.info-box-activation a {
  padding: 0 5px;
  text-decoration: underline;
}

.info-box-activation a:hover {
  text-decoration: none;
}

.info-sm-box {
  padding: 3px 10px;
}

.info-sm-box .info-sm-box-label {
  font-size: 18px;
  color: #7ac143;
  padding: 3px 0;
}

.info-box-item {
  padding: 3px 0;
}

.info-box-item .box-item-label {
  font-weight: bold;
}

.info-box-item .box-item {
  display: inline-block;
}

.info-box-item .box-item-val {
  text-decoration: underline;
}

.layui-layer-btn .layui-layer-btn0 {
  border-color: #7ac143 !important;
  background-color: #7ac143 !important;
}

span.required {
  color: red;
}

.online-activation .layui-form-item {
  margin-bottom: 0px;
}

.online-activation .layui-form-item .layui-inline {
  margin: 5px;
}

.online-activation .layui-form-item .layui-input-inline {
  width: 150px;
}

.online-activation .layui-form-label {
  width: 100px;
  padding: 3px;
}

.online-activation .layui-input, .online-activation .layui-select, .online-activation .layui-textarea {
  height: 28px;
}

.online-activation .sn-input .layui-input-inline {
  width: 280px;
}

.online-activation .company-input .layui-input-inline, .upk-download .company-input.layui-input {
  width: 430px;
}

.admin-login .layui-input, .admin-login .layui-select, .admin-login .layui-textarea {
  height: 28px;
}

.license_file-container {
  margin: 15px 0 0 0;
}

.login_about {
  background-image: url(/media/img/login_about.png);
  _background: none;
  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/media/img/login_about.png");
  background-repeat: no-repeat;
  background-position: center;
  height: 22px;
  width: 20px;
  margin-right: auto;
  margin-left: auto;
}

.login_webpunch {
  background-image: url(/media/img/login_webpunch.png);
  _background: none;
  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/media/img/login_webpunch.png");
  background-repeat: no-repeat;
  background-position: center;
  height: 25px;
  width: 20px;
  margin-right: auto;
  margin-left: auto;
}

.login_language {
  background-image: url(/media/img/login_language.png);
  _background: none;
  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/media/img/login_language.png");
  background-repeat: no-repeat;
  background-position: center;
  height: 25px;
  width: 20px;
  margin-right: auto;
  margin-left: auto;
}

.login_about_div{
  float: right;
}


/*base */
.border-0{border:0!important}.w-25{width:25%!important}.w-50{width:50%!important}.w-75{width:75%!important}.w-100{width:100%!important}.w-auto{width:auto!important}.h-25{height:25%!important}.h-50{height:50%!important}.h-75{height:75%!important}.h-100{height:100%!important}.h-auto{height:auto!important}.mw-100{max-width:100%!important}.mh-100{max-height:100%!important}.min-vw-100{min-width:100vw!important}.min-vh-100{min-height:100vh!important}.vw-100{width:100vw!important}.vh-100{height:100vh!important}.m-0{margin:0!important}.mt-0,.my-0{margin-top:0!important}.mr-0,.mx-0{margin-right:0!important}.mb-0,.my-0{margin-bottom:0!important}.ml-0,.mx-0{margin-left:0!important}.m-1{margin:.25rem!important}.mt-1,.my-1{margin-top:.25rem!important}.mr-1,.mx-1{margin-right:.25rem!important}.mb-1,.my-1{margin-bottom:.25rem!important}.ml-1,.mx-1{margin-left:.25rem!important}.m-2{margin:.5rem!important}.mt-2,.my-2{margin-top:.5rem!important}.mr-2,.mx-2{margin-right:.5rem!important}.mb-2,.my-2{margin-bottom:.5rem!important}.ml-2,.mx-2{margin-left:.5rem!important}.m-3{margin:1rem!important}.mt-3,.my-3{margin-top:1rem!important}.mr-3,.mx-3{margin-right:1rem!important}.mb-3,.my-3{margin-bottom:1rem!important}.ml-3,.mx-3{margin-left:1rem!important}.m-4{margin:1.5rem!important}.mt-4,.my-4{margin-top:1.5rem!important}.mr-4,.mx-4{margin-right:1.5rem!important}.mb-4,.my-4{margin-bottom:1.5rem!important}.ml-4,.mx-4{margin-left:1.5rem!important}.m-5{margin:3rem!important}.mt-5,.my-5{margin-top:3rem!important}.mr-5,.mx-5{margin-right:3rem!important}.mb-5,.my-5{margin-bottom:3rem!important}.ml-5,.mx-5{margin-left:3rem!important}.p-0{padding:0!important}.pt-0,.py-0{padding-top:0!important}.pr-0,.px-0{padding-right:0!important}.pb-0,.py-0{padding-bottom:0!important}.pl-0,.px-0{padding-left:0!important}.p-1{padding:.25rem!important}.pt-1,.py-1{padding-top:.25rem!important}.pr-1,.px-1{padding-right:.25rem!important}.pb-1,.py-1{padding-bottom:.25rem!important}.pl-1,.px-1{padding-left:.25rem!important}.p-2{padding:.5rem!important}.pt-2,.py-2{padding-top:.5rem!important}.pr-2,.px-2{padding-right:.5rem!important}.pb-2,.py-2{padding-bottom:.5rem!important}.pl-2,.px-2{padding-left:.5rem!important}.p-3{padding:1rem!important}.pt-3,.py-3{padding-top:1rem!important}.pr-3,.px-3{padding-right:1rem!important}.pb-3,.py-3{padding-bottom:1rem!important}.pl-3,.px-3{padding-left:1rem!important}.p-4{padding:1.5rem!important}.pt-4,.py-4{padding-top:1.5rem!important}.pr-4,.px-4{padding-right:1.5rem!important}.pb-4,.py-4{padding-bottom:1.5rem!important}.pl-4,.px-4{padding-left:1.5rem!important}.p-5{padding:3rem!important}.pt-5,.py-5{padding-top:3rem!important}.pr-5,.px-5{padding-right:3rem!important}.pb-5,.py-5{padding-bottom:3rem!important}.pl-5,.px-5{padding-left:3rem!important}.m-n1{margin:-.25rem!important}.mt-n1,.my-n1{margin-top:-.25rem!important}.mr-n1,.mx-n1{margin-right:-.25rem!important}.mb-n1,.my-n1{margin-bottom:-.25rem!important}.ml-n1,.mx-n1{margin-left:-.25rem!important}.m-n2{margin:-.5rem!important}.mt-n2,.my-n2{margin-top:-.5rem!important}.mr-n2,.mx-n2{margin-right:-.5rem!important}.mb-n2,.my-n2{margin-bottom:-.5rem!important}.ml-n2,.mx-n2{margin-left:-.5rem!important}.m-n3{margin:-1rem!important}.mt-n3,.my-n3{margin-top:-1rem!important}.mr-n3,.mx-n3{margin-right:-1rem!important}.mb-n3,.my-n3{margin-bottom:-1rem!important}.ml-n3,.mx-n3{margin-left:-1rem!important}.m-n4{margin:-1.5rem!important}.mt-n4,.my-n4{margin-top:-1.5rem!important}.mr-n4,.mx-n4{margin-right:-1.5rem!important}.mb-n4,.my-n4{margin-bottom:-1.5rem!important}.ml-n4,.mx-n4{margin-left:-1.5rem!important}.m-n5{margin:-3rem!important}.mt-n5,.my-n5{margin-top:-3rem!important}.mr-n5,.mx-n5{margin-right:-3rem!important}.mb-n5,.my-n5{margin-bottom:-3rem!important}.ml-n5,.mx-n5{margin-left:-3rem!important}.m-auto{margin:auto!important}.mt-auto,.my-auto{margin-top:auto!important}.mr-auto,.mx-auto{margin-right:auto!important}.mb-auto,.my-auto{margin-bottom:auto!important}.ml-auto,.mx-auto{margin-left:auto!important}.text-dark{color:#000!important}.text-white{color:#fff!important}.align-items-center{-ms-flex-align:center!important;align-items:center!important}.bg-transparent{background-color:transparent!important}.font-weight-bold{font-weight:700!important}.bg-primary{background-color:#007bff!important}.flex2{flex:2}.d-flex{display:-ms-flexbox!important;display:flex!important}.flex-wrap{-ms-flex-wrap:wrap!important;flex-wrap:wrap!important}.align-middle{vertical-align:middle!important}.table-borderless tbody+tbody,.table-borderless td,.table-borderless th,.table-borderless thead th{border:0!important}.zk-tbl .widget-content{padding:1rem;flex-direction:row;align-items:center}.zk-tbl .widget-content .widget-content-wrapper{display:flex;flex:1;position:relative;align-items:center}.zk-tbl .widget-content .widget-content-right{margin-left:auto}.card{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-width:0;word-wrap:break-word;background-color:#fff;background-clip:border-box;border-radius:.25rem}.card-header{padding:.75rem 1.25rem;margin-bottom:0;;height:auto;min-height:55px;line-height:40px;text-transform:uppercase}.card-body{-ms-flex:1 1 auto;flex:1 1 auto;min-height:1px;padding:1.25rem}.card-footer{padding:.75rem 1.25rem;line-height:35px}.justify-content-center{-ms-flex-pack:center!important;justify-content:center!important}.scrollbar-container{position:relative;height:100%}.scroll-area{overflow-x:hidden;height:400px;background:transparent!important}[class*=scroll-area-]::-webkit-scrollbar{width:5px;background:transparent!important}[class*=scroll-area-]::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.5)!important;box-shadow:inset 0 0 6px rgba(0,0,0,.5)!important;border-radius:20px!important;background:transparent!important}[class*=scroll-area-]::-webkit-scrollbar-thumb{border-radius:20px!important;-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.5)!important;box-shadow:inset 0 0 6px rgba(0,0,0,.5)!important;background:rgba(39,43,62,.5)!important;visibility:hidden!important}.card-bg:hover .scroll-area-lg::-webkit-scrollbar-thumb,.card-bg:hover .scroll-area-md::-webkit-scrollbar-thumb,.card-bg:hover .scroll-area-sm::-webkit-scrollbar-thumb,.easy-card-bg:hover .scroll-area-lg::-webkit-scrollbar-thumb,.easy-card-bg:hover .scroll-area-md::-webkit-scrollbar-thumb,.easy-card-bg:hover .scroll-area-sm::-webkit-scrollbar-thumb{visibility:visible!important;transition:all 1s ease!important}​ .scroll-area-xs{height:150px;overflow-x:hidden}.scroll-area-sm{height:200px;overflow-x:hidden}.scroll-area-md{height:330px;overflow-x:hidden}.scroll-area-lg{height:400px;overflow-x:hidden}
/* Base end */

.zk-login {
  background-color: #FDFDFD;
  background-image: url(/media/img/login/login-bg.png);
  background-size: cover;
  background-repeat: no-repeat;
  justify-content: center;
  flex: 1;
  display: flex;
  z-index: 8;
  position: relative;
}

.zk-login-container {
  display: flex;
  min-height: 100vh;
  margin: 0;
  box-sizing: border-box !important;
  background: #f9f9f9;
}

.zk-login .input-lg {
  height: 40px !important;
}

.left-container {
  height: 500px;
  display: flex;
  flex-direction: column;
}

.login_label {
  float: left;
  display: none;
}

.img-container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
}
.img-logo {
  flex: 4;
}
.img-banner {
  flex: 4;
}
.left-container-footer {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}
.left-container img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.login-checkbox {
  margin-top: 0px !important;
}

.zk-login-footer {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.zk-login .card-footer {
  background: none !important;
  float: right;
}

.zkteco-logo {
  width: 150px;
  padding-bottom: 10px;
}

.zk-login-copyright {
  color: #474B4F;
  text-align: center;
  margin: 0 auto;
}

.zk-login-card {
  -webkit-box-shadow: 0px 0px 40px 0px rgba(0, 152, 68, 0.17);
  -moz-box-shadow: 0px 0px 40px 0px rgba(0, 152, 68, 0.17);
  box-shadow: 0px 0px 40px 0px rgba(0, 152, 68, 0.17);
  border-radius: 25px;
  border: 0px;
  background: linear-gradient(to right, #79c143 44%, #FFF 44%);
  min-height: 300px;
  z-index: 8;
}

.zk-login .card-header {
  height: auto;
  background: transparent !important;
  position: relative;
}

.zk-login .card-header .header {
  text-transform: uppercase;
  font-weight: 600;
  font-size: 22px;
  color: #7AC142;
}


/* Footer Social Icons */

.social-footer-title {
  display: inline-block;
  margin-top: 5px;
}

.align-items-stretch {
  display: flex;
  align-items: stretch;
}

.social-footer {
  position: relative;
  bottom: 0px;
  right: 12%;
  /*padding-bottom: 20px;*/
  /*padding-top: 20px;*/
}

.social-btn-circle {
  width: 45px;
  height: 45px;
  line-height: 45px;
  text-align: center;
  padding: 0;
  border-radius: 50%;
  background: #fff;
}

.social-btn-circle:hover {
  background: #EFEFEF;
}

.social-btn-circle img {
  padding: 9px !important;
}

.social-btn-sm {
  width: 35px;
  height: 35px;
  line-height: 35px;
  font-size: 0.9rem;
}

.social-btn-lg {
  width: 55px;
  height: 55px;
  line-height: 55px;
  font-size: 1.1rem;
}

.login_btn_div {
  display: flex;
  width: 100%;
  line-height: 1.0;
}

.login_button_left {
  flex-grow: 1;
  max-width: calc(100% - 50px - 10px);
  margin-right: 10px;
}

.login_button_right {
  width: 50px;
  flex-shrink: 0;
}


@media (max-width:767px) {
  .zk-login-card .grad-logo-area {
    height: 100px;
  }
  .zk-login-card {
    background: linear-gradient(to bottom, #79c143 30px, #79c143 100px, #FFF 100px);
    min-height: 300px;
    margin-bottom: 30px;
  }
  .zk-login-header {
    position: absolute;
    top: 5px;
    left: 50%;
    transform: translateX(-50%);
  }

  .zk-login-footer {
    position: relative;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
  }

}

@media (min-width:992px) {
  .zk-login-row {
    margin: 0;
    position: relative;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 8;
  }
  .row {
    margin-right: 0 !important;
    margin-left: 0 !important;;
  }
}

@media (min-width:1400px) {
  .zk-login-card {
    min-height: 400px;
  }
  .zk-login-container {
    overflow: hidden;
  }
}

@media (min-height: 950px) {
  .left-container {
    height: 600px;
  }
  .social-footer {
    padding-bottom: 20px;
    padding-top: 20px;
  }
  .login_label {
    display: block;
  }
}