[genuitec-file-id="wc1-160"],[genuitec-lp-path="/hb/WebRoot/login1/login.css"],[genuitec-lp-enabled=false]{
  /* for codelive */
}

html, body {
  height: 100%;
  width: 100%;
  padding: 0;
  margin:0;
}

body{
  background-image: url('../login1/bg-login-v2.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  overflow: hidden;
}

[v-cloak] {
  display: none;
}

#app {
  width: 100%;
  height: 100%;
  padding: 1px;
  position: relative;
}

.errors{
	color:#f0a600 !important;
}

img {
  width: 100%;
  height: 100%;
}

.logo {
  width: 15.573vw;
  height: 12.083vw;
  margin-top: 5.573vw;
  margin-left: 11.354vw;
}

.login-page {
    width: 22.944vw;
    height: 22.944vw;
    margin-top: -2.823vw;
    margin-left: 41.75vw;
    position: relative;
}

.login-ring {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -1;
}

.login-ring .outer-ring, .login-ring .inner-ring, .bg-login-page {
  position: absolute;
  z-index: -1;
}

.login-ring .outer-ring {
  width: 39.063vw;
  height: 39.063vw;
  top: -8.0595vw;
  left: -8.0595vw;
  animation: rotate-outer 28s linear infinite;
  -webkit-animation: rotate-outer 28s  linear infinite;
  -moz-animation: rotate-outer 28s  linear infinite;
  -o-animation: rotate-outer 28s  linear infinite;
}

.login-ring .inner-ring {
  width: 36.927vw;
  height: 36.927vw;
  top: -7.111vw;
  left: -6.888vw;
  animation: rotate-inner 28s  linear infinite;
  -webkit-animation: rotate-inner 28s  linear infinite;
  -moz-animation: rotate-inner 28s  linear infinite;
  -o-animation: rotate-inner 28s  linear infinite;
}

.bg-login-page {
  width: 32.448vw;
  height: 32.448vw;
  top: -4.752vw;
  left: -4.752vw;
}

.login-title {
  width: 7.292vw;
  height: 3.281vw;
  margin: 0 auto;
  margin-bottom: 2.500vw;
}

.login-input {
  width: 100%;
  height: auto;
  margin-bottom: 1.250vw;
}

input::placeholder { /* Firefox, Chrome, Opera */ 
  color: rgb(255, 255, 255)!important;
  font-weight: 100;
} 

input:-ms-input-placeholder { /* Internet Explorer 10-11 */ 
  color: rgb(255, 255, 255)!important;
  font-weight: 100;
} 

input::-ms-input-placeholder { /* Microsoft Edge */ 
  color: rgb(255, 255, 255)!important;
  font-weight: 100;
} 

.login-input input {
  width: 100%;
  height: 2.9vw;
  font-size: 1.351vw;
  color: white;
  font-weight: 100;
  background-color: rgba(41, 130, 244, 0.8);
  border: 0;
  border-radius: 5px;
  padding: 6px 12px;
}

.login-label {
  width: 100%;
  height: auto;
  margin-bottom: 0.833vw; 
  font-size:  0.9286rem;
  font-weight: 100;
  margin-top: 1.667vw;
  -moz-user-select:none;
  -webkit-user-select:none;
  user-select:none;
}

.login-label label{
  color: #fff;
  font-size:  2rem;
  font-weight: 100;
}

.login-label label:hover {
  cursor: pointer;
}

.login-label > div > a {
  font-size: 2rem!important;
  color: #00e4ff;
}

.login-label > div > a.forgot-password:hover {
  color: #fff;
  cursor: pointer;
  text-decoration-line: none;
}

.login-button button {
  height: 2.9vw;
  font-size: 1.500vw;
  font-weight: 100;
}

@keyframes rotate-outer { 

  100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform:  rotate(360deg);
        transform: rotate(360deg);
  }
}

@keyframes rotate-inner {

  100% {
        -webkit-transform: rotate(-360deg);
        -moz-transform: rotate(-360deg);
        -ms-transform: rotate(-360deg);
        -o-transform:  rotate(-360deg);
        transform: rotate(-360deg);
  }
}