@media (max-width: 768px) {
  .outer-container {
    padding: 20px; 
  }

  .login-container {
    width: 90%;
    padding: 16px; 
  }

  .form-label {
    font-size: 12px; 
  }

  .login-title {
    font-size: 16px; 
  }

  .form-control {
    font-size: 12px; 
  }

  .captcha-container {
    flex-direction: column; 
    align-items: stretch; 
  }

  .captcha-container input,
  .captcha-image-refresh {
    width: 100%; 
    margin-bottom: 10px;
  }

  .captcha-image-refresh {
    flex-direction: row; 
  }

  .captcha-image-refresh img {
    max-height: 40px;
    margin-right: 5px; 
  }

  .login-buttons button {
    width: 100%; 
    margin-bottom: 10px; 
  }

  .form-check a button {
    font-size: 10px; 
  }
}