/* Center using CSS Grid */
#log-in-page {
  position: absolute;
  top: 50%; /* Move to the vertical center */
  left: 50%; /* Move to the horizontal center */
  transform: translate(-50%, -50%); /* Center the element completely */
  width: 400px; /* Optional fixed width */
  max-width: 90%; /* Ensures responsiveness */
}

/* Center using CSS Grid */
#register-page {
  //position: absolute;
  //top: 50%; /* Move to the vertical center */
  //left: 50%; /* Move to the horizontal center */
  //transform: translate(-50%, -50%); /* Center the element completely */
  //width: 600px; /* Optional fixed width */
  //max-width: 90%; /* Ensures responsiveness */
  //overflow: auto;
}

/* Optional: Adjust card width for responsiveness */
#log-in-page .card {
  max-width: 400px; /* Set a max width for the card */
  width: 100%; /* Ensure it scales properly */
}

@media (max-width: 900px) {
  #registerPageCol1 {
    width: 15% !important;
  }

  #registerPageCol2 {
    width: 70% !important;
  }

  #registerPageCol3 {
    width: 15% !important;
  }
}

@media (max-width: 767px) {
  #registerPageCol1 {
    width: 10% !important;
  }

  #registerPageCol2 {
    width: 80% !important;
  }

  #registerPageCol3 {
    width: 10% !important;
  }
}

@media (max-width: 576px) {
  #registerPageCol1 {
    width: 0% !important;
  }

  #registerPageCol2 {
    width: 100% !important;
  }

  #registerPageCol3 {
    width: 0% !important;
  }
}