/*==========================================================
  Loaded in personnel-login.html & personnel-user-login.html
===========================================================*/


@keyframes grow-up {
  0% { height: 0; bottom: 0; }
  100% { height: 100%; bottom: 0; }
}
@keyframes grow-down {
  0% { height: 0; top: 0; }
  100% { height: 100%; top: 0; }
}
@keyframes expand {
  0% { width: 0; left: 50%; transform: translate(-50%, -50%); }
  100% { width: 100%; left: 0; transform: translateY(-50%); }
}
.animate-grow-up {
  animation: grow-up 0.6s ease-in-out infinite alternate;
  position: absolute;
  bottom: 0;
}
.animate-grow-down {
  animation: grow-down 0.6s ease-in-out infinite alternate;
  position: absolute;
  top: 0;
}
.animate-expand {
  animation: expand 0.6s ease-in-out infinite alternate;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}
.animate-spin {
  animation: spin 1s linear infinite;
}

.verify-step, .reset-step {
  transition: opacity 0.3s ease-in-out;
}

html { 
  scroll-behavior: smooth; 
  font-size: 90%;
}