.hero-page {
  width: 100vw;
  max-width: 100%;
  min-height: 100vh;
  min-height: calc(100 * var(--vh));
  display: flex;
  overflow: hidden;
}
.hero-page .inside {
  width: 100%;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}
.hero-page .section-top {
  height: 272px;
  background: #1D1D1B;
  z-index: 2;
}
.hero-page .section-top:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: url(../../public/img/stripes-white.svg);
}
@media (max-width: 580px) {
  .hero-page .section-top {
    height: 200px;
  }
}
.hero-page .img-login-wrap {
  position: relative;
  height: 100%;
  background: #FFF2DF;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.hero-page .img-login-wrap:before {
  content: "";
  position: absolute;
  top: 0;
  height: 17px;
  width: 100%;
  background: #FFCD02;
  z-index: 2;
}
.hero-page .img-login-wrap .logo-img {
  z-index: 3;
  transform: translateY(-35%);
}
.hero-page .img-login-wrap h2 {
  max-width: 90%;
  text-align: center;
}
.hero-page .img-login-wrap form {
  width: 90%;
  max-width: 370px;
  margin: 0 auto;
  margin-bottom: 5em;
}
.hero-page .img-login-wrap form input, .hero-page .img-login-wrap form button, .hero-page .img-login-wrap form select {
  width: 100%;
  height: 50px;
  color: #000;
  border: 2px solid #1D1D1B;
  border-radius: 6px;
  padding: 5px 10px;
  position: relative;
  z-index: 2;
}
.hero-page .img-login-wrap form input {
  background: #fff;
  margin-bottom: 1.5em;
  outline: none;
}
.hero-page .img-login-wrap form input:last-child {
  margin-bottom: 0;
}
.hero-page .img-login-wrap form button {
  background: #FFCD02;
  cursor: pointer;
}
@media (min-width: 1024px) {
  .hero-page .img-login-wrap form button {
    transition: all 0.3s ease-in;
  }
  .hero-page .img-login-wrap form button:hover {
    background: #1D1D1B;
    color: #fff;
  }
}
.hero-page .img-login-wrap form select {
  margin-bottom: 5.5em;
  cursor: pointer;
}
.hero-page .img-login-wrap .login-container {
  width: 100%;
  height: 100%;
  flex: 1;
  position: relative;
}
.hero-page .img-login-wrap .login-container .vouchers-title {
  font-size: 1.278em;
  margin: 0 auto;
  margin-bottom: 1.5em;
  hyphens: auto;
}
.hero-page .img-login-wrap .login-container .adjust-date_btn_container {
  width: 90%;
  max-width: 1560px;
  margin: 0 auto;
}
.hero-page .img-login-wrap .login-container .voucher-container {
  overflow: auto;
  margin-bottom: clamp(11.75rem, 10.1458rem + 6.4167vw, 16.5625rem);
}
.hero-page .img-login-wrap .login-container .vouchers-list {
  position: relative;
  width: 90%;
  max-width: 1560px;
  margin: 0 auto;
  z-index: 2;
  border: 2px solid #1D1D1B;
  background: #fff;
  border-collapse: separate;
  border-spacing: 4em 2em;
}
@media (max-width: 1024px) {
  .hero-page .img-login-wrap .login-container .vouchers-list {
    width: 85%;
  }
}
.hero-page .img-login-wrap .login-container .vouchers-list caption {
  background: #FDE480;
  padding: 0.75em 0;
  border: 2px solid #1D1D1B;
  border-bottom: none;
}
.hero-page .img-login-wrap .login-container .vouchers-list th, .hero-page .img-login-wrap .login-container .vouchers-list td {
  font-weight: 300;
}
.hero-page .img-login-wrap .login-container .vouchers-list td {
  text-align: center;
}
.hero-page .img-login-wrap .login-container .vouchers-list td .qr-code {
  border-radius: 5px;
  border: 2px solid #FFCD02;
}
.hero-page .img-login-wrap .login-container .vouchers-list td .download-btn, .hero-page .img-login-wrap .login-container .vouchers-list td .remove-btn, .hero-page .img-login-wrap .login-container .vouchers-list td .adjust.date-btn {
  background: #FFCD02;
  border: 2px solid #1D1D1B;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
}
.hero-page .img-login-wrap .login-container .vouchers-list td .download-btn {
  width: 36px;
  height: 28px;
}
.hero-page .img-login-wrap .login-container .vouchers-list td .remove-btn {
  width: 27px;
  height: 28px;
}
.hero-page .img-login-wrap .login-container .vouchers-list td .adjust.date-btn {
  text-decoration: none;
  padding: 0.15em 0.25em;
  color: #1D1D1B;
}
@media (min-width: 1024px) {
  .hero-page .img-login-wrap .login-container .vouchers-list td .adjust.date-btn {
    transition: all 0.3s ease-in;
  }
  .hero-page .img-login-wrap .login-container .vouchers-list td .adjust.date-btn:hover {
    background: #1D1D1B;
    color: #fff;
  }
}
.hero-page .img-login-wrap .login-container .vouchers-list td .adjust.date-btn:active {
  color: #fff;
}
@media (min-width: 1024px) {
  .hero-page .img-login-wrap .login-container .vouchers-list td .qr-code, .hero-page .img-login-wrap .login-container .vouchers-list td .download-btn, .hero-page .img-login-wrap .login-container .vouchers-list td .remove-btn {
    transition: transform 0.2s ease;
  }
  .hero-page .img-login-wrap .login-container .vouchers-list td .qr-code:hover, .hero-page .img-login-wrap .login-container .vouchers-list td .download-btn:hover, .hero-page .img-login-wrap .login-container .vouchers-list td .remove-btn:hover {
    transform: scale(1.05);
  }
}
.hero-page .btn-container {
  display: flex;
  justify-content: space-between;
  width: 90%;
  max-width: 370px;
  margin: 0 auto;
  margin-bottom: 3em;
}
.hero-page .btn-container .redirect-btn, .hero-page .btn-container .log-out-btn {
  background: #FFCD02;
  height: 35px;
  color: #000;
  border: 2px solid #1D1D1B;
  border-radius: 6px;
  padding: 5px 10px;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin-bottom: 1em;
  color: #1D1D1B;
  position: relative;
  z-index: 2;
}
@media (min-width: 1024px) {
  .hero-page .btn-container .redirect-btn, .hero-page .btn-container .log-out-btn {
    transition: all 0.3s ease-in;
  }
  .hero-page .btn-container .redirect-btn:hover, .hero-page .btn-container .log-out-btn:hover {
    background: #1D1D1B;
    color: #fff;
  }
}
.hero-page .submit-date {
  margin: auto;
  cursor: pointer;
}
.hero-page textarea {
  padding: 0.25em;
  resize: none;
  max-width: 100%;
  max-height: 15em;
  color: #000;
  border: 2px solid #1D1D1B;
  border-radius: 6px;
  position: relative;
  z-index: 2;
}
.hero-page p {
  margin: 1em 0;
}
.hero-page p.error, .hero-page p.message, .hero-page p.regex {
  width: fit-content;
  margin: auto;
  margin-top: 1em;
  margin-bottom: 0;
}

/*# sourceMappingURL=hero.css.map */