body {
    margin: 0;
    padding: 0;
  }


.lion-log {
  height: 100vh;
  width: 100vw;
  overflow: hidden;
}

.lionhead {
  position: relative;
  padding: 15px;
    transition: height 0.3s ease; /* makes resizing smooth */
 
}

.logo-lion {
  justify-content: center !important;
  align-items: center;
  display: grid;
  margin-right: 52px;
}

.seq-one {
  
  width: 92%;
  transform: rotate(-44deg);
  background-color: rgb(233, 213, 163);
  position: absolute;
  margin-left: 269px;
  top: 35px;
  z-index: -1;
  border-radius: 60px;
}

.space-hrms {
 
  width: 137%;
  transform: rotate(-44deg);
  background-color: goldenrod;
  position: relative;
  margin-left: 259px;
  top: 54px;
  border-radius: 55px;
}

.main-seq {
  padding: 35px;
}

.lion-form {
  margin: 30px;
  justify-content: center;
  align-items: center;
  padding-top: 45px;
}

.lion-work {
  overflow: hidden;
}

.lion-card {
  /* background-color: rgb(248, 248, 248); */
  /* box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); */
  height: 80%;
  width: 90%;
  align-items: center;
  padding: 22px;
}

.sign-text {
  font-family: 'Open Sans', sans-serif;
  text-align: center;
  font-weight: 700;
  margin-bottom: 0px;
  margin-top: 20px;
  margin-bottom: 20px;
}

.lion-signbtn {
  justify-content: space-between;
  display: flex;
  font-family: 'Open Sans', sans-serif;
}

.password-text {
  font-size: 14px;
  margin-bottom: 0px;
  font-family: 'Open Sans', sans-serif;
  padding-top: 3px;
}

.password-text:hover {
  text-decoration: underline;
  color: rgb(2, 111, 155);
}

.star-ic {
  color: red;
}

.lions_account {
  display: flex;
  gap: 1px;
  align-items: center;
  justify-content: center;
  padding-top: 20px;
}

.sign-up {
  font-weight: 600;
  color: #E5B20A;
  font-family: 'Open Sans', sans-serif;
  text-decoration: underline;
  text-decoration-color: #E5B20A;
}

.just-text {
  font-family: 10px;
  font-family: 'Open Sans', sans-serif;
}

.bottom-card {
  margin-bottom: 18px;
}

.lion-icon {
  width: 199px;
  margin-top: 20px;
}

.lion-hov {
  border-radius: 4px;
  border: 1px solid #ccc;
  padding: 13px 10px;
  transition: border-color 0.3s ease;
}

.lion-hov:focus {
  border: 2px solid #E5B20A;
  box-shadow: none;
}

.next-btn {
  justify-content: center;
  align-items: center;
}

.submit-btn {
  border-radius: 4px;
  background: #E5B20A;
  padding: 12px 8px;
  border: none;
  width: 100%;
  font-weight: 510;
  color: rgb(20, 20, 20);
}

.submit-btn:hover {
  background-color: rgb(36, 29, 2);
  color: white;
}

.lion-check {
  font-size: 13px;
}

.form-check-input:checked {
  background-color: #E5B20A;
}

.form-check-input:focus {
  box-shadow: none !important;
  outline: none !important;
  border-color: rgb(224, 224, 224);
}

@media(max-width:2000px){
  .space-hrms {
  height: 79%;
  width: 172%;
  }
  .seq-one{
    height: 50%;
    width: 129%;
    margin-left: 178px;
    top: 35px;
  }
}
@media(max-width:1200px) {
  .space-hrms {
    top: 27px;
    margin-left: 278px;
  }

  .submit-btn {
    font-size: 14px;
  }
}

@media(max-width:991px) {
  .password-text {
    padding-top: 4px;
    font-size: 12px;
  }

  .welcome-lion {
    font-size: 16px;
  }

  .submit-btn {
    font-size: 12px;
  }

  .just-text {
    font-size: 14px;
  }

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

  .lion-card {
    width: 96%;
  }

  .lion-form {
    margin: 30px;

  }

  .lion-icon {
    width: 202px;
  }

  .lion-hov {
    padding: 11px 10px;
    font-size: 14px;
  }

  .space-hrms {
    top: 1px;
    height: 71%;
    width: 172%;
    margin-left: 260px;
  }

  .seq-one {
    height: 60%;
    width: 129%;
    margin-left: 254px;
    top: -29px;
  }
}

@media(max-width:767px) {
  .space-hrms {
   top: -251px;
    height: 95%;
    width: 84%;
    margin-left: -140px;
  }

  .seq-one {
   height: 45%;
    width: 72%;
    margin-left: 372px;
    top: -61px;
  }

  .password-text {
    font-size: 12px;
  }

  .submit-btn {
    font-size: 11px;
  }

  .just-text {
    font-size: 12px;
  }

  .sign-up {
    font-size: 12px;

  }

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


  .bottom-card {
    margin-bottom: 12px;
  }

  .lion-work {
    order: 2;

  }

  .lionhead {
    order: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    height: 30vh;

  }

  .lion-icon {
    width: 180px;
    margin-top: -66px;
  }

  .lion-log {
    height: 100vh;
    width: 100vw;
    overflow: hidden;
  }

  .submit-btn {
    font-size: 14px;
  }
}

@media(max-width:575px) {
 
  .lion-form {
    margin: 5px;
    margin-top: -5px;
  }

  .seq-one {
   margin-left: 243px;
    height: 40%;
  }

  .space-hrms {
   margin-left: -118px;
    top: -280px;
    height: 429px;
  }

  .password-text {
    font-size: 13px;
    padding-top: 3px
  }


  .just-text {
    font-size: 12px;
  }

  .sign-up {
    font-size: 12px;
  }

  .lion-card {
    padding: 30px;
  }

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

  .sign-text {
    font-size: 21px;
  }
}

@media(max-width:485px) {
  .space-hrms {
    margin-left: -143px;
    top: -309px;
  }

  .seq-one {
   margin-left: 257px;
    top: -106px;
  }

  .lion-work {
    margin-top: -98px;
  }
}

@media(max-width:370px) {
  .space-hrms {
  margin-left: -332px;
    top: -380px;
    height: 576px;
  }

  .seq-one {
   margin-left:  176px;
    top: -131px;
  }

  .submit-btn {
    font-size: 14px;
    padding: 3px;
  }

  .lion-card {
    padding: 1px;
  }

  .just-text {
    font-size: 12px;
  }

  .password-text {
    font-size: 12px;
    padding-top: 6px;
  }

  .form-label {
    font-size: 10px;

  }

  .bottom-card {
    margin-bottom: 4px;
  }

  .sign-text {
    font-size: 18px;
    margin-top: 10px;
  }

  .logo-lion {
    margin-right: 25px;
  }


  .lion-icon {

    margin-top: -10px;
  }

  .lion-work {
    overflow: hidden;
    margin-top: -88px;
  }
}