@media all and (orientation: portrait) and (max-width: 1024px) {
}
@media all and (orientation: portrait) and (max-width: 640px) {
}

@media all and (orientation: portrait) and (max-width: 420px) {
}

@media all and (orientation: portrait) and (max-width: 320px) {
}
/*========================Ngang=========================*/

@media all and (orientation: landscape) and (max-width: 1500px) {
}

@media all and (orientation: landscape) and (max-width: 1280.1px) {
}

@media all and (orientation: landscape) and (max-width: 1024.1px) {
}

@media all and (orientation: landscape) and (max-width: 956.1px) {
  .hero-banner-bg {
    min-height: 420px;
  }
  .card-form {
    max-width: 290px;
  }
  .card-form .logo img {
    max-width: 80px;
  }
  .form-input > .input {
    height: 38px;
    padding: 6px 12px;
  }
  .form-input .icon {
    width: 16px;
    height: 16px;
  }
  .form-input input {
    font-size: 12px;
  }
  .button-submit-form button {
    height: 38px;
    font-size: 14px;
  }
}

@media all and (orientation: landscape) and (max-width: 896px) {
  .hero-banner-bg {
    min-height: 390px;
  }
  .card-form {
    max-width: 290px;
  }
  .card-form .logo img {
    max-width: 60px;
  }
  .form-input > .input {
    height: 36px;
    padding: 6px 12px;
  }
}

@media all and (orientation: landscape) and (max-width: 812px) {
}

@media all and (orientation: landscape) and (max-width: 640px) {
}