body::before {
  content: "";
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;

  /* Specify the background image to be used */
  background-image: url("assets/bg-1.jpg");
  background-size: cover;

  /* Specify the background image */
  opacity: 0.8;
  z-index: -1000;
}

.home-main-section {
  display: flex;
  /* align-items: stretch; */
  align-items: center;
  justify-content: space-between;
  height: inherit;
  flex-grow: 1;
}

.home-main-section-left {
  width: fit-content;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
}

.home-main-section-left .btn {
  width: fit-content;
}
.home-main-section-right {
  display: flex;
}

.form-wrap {
  border: 2px solid #bababa;
  border-radius: 8px;
  padding: 2rem;
  /* margin-right: 2rem; */
}

.form-nav {
  text-decoration: none;
  color: rgb(184, 173, 173);
}
.form-nav:hover,
.form-nav.active {
  /* color: green; */
  color: orange;
}
.frm {
  display: none;
}
.show {
  display: block;
}
.form {
  padding-top: 1rem;
  display: flex;
  flex-direction: column;
  /* gap: 1rem; */
  min-width: 15rem;
}
.form input {
  margin-bottom: 1rem;
  height: 2rem;
  border: 1px solid white;
  border-radius: 4px;
  outline: none;
  background: transparent;
  color: white;
  padding-left: 0.4rem;
}

.form .btn {
  margin-top: 1rem;
}

.form a {
  /* text-decoration: none; */
  text-align: right;
  padding-top: 1rem;
  font-size: 0.8rem;
}

.g-recaptcha {
  margin-top: 0.4rem;
  margin-bottom: 0.4rem;
}

.index-or {
  display: block;
  padding: 1rem;
  color: rgb(163, 157, 147);
}
.home-main-section .btn {
  border: 2px solid rgb(219, 144, 4);
  color: rgb(219, 144, 4);
  font-weight: bolder;
  background-color: transparent;
  transition: 0.3s;
}

.home-main-section .btn:hover {
  border-radius: 0;
  /* border: 2px solid white; */
  color: white;
  background-color: rgb(219, 144, 4);
}
.forgot-pass-link {
  text-align: right;
  float: right;
  width: fit-content;
  transition: 0.3s;
  /* color: rgb(219, 144, 4); */
}
.forgot-pass-link:hover {
  /* width: */
  color: rgb(190, 125, 3);
}
/* media queries */
@media screen and (max-width: 765px) {
  .home-main-section {
    flex-direction: column;
  }
  .home-main-section {
    text-align: center;
  }
  .home-main-section .btn {
    margin: 2rem auto;
  }
  .home-main-section-right {
    margin-top: 1rem;
  }
  .index-frm-label {
    width: fit-content;
    float: left;
  }
}