:root {
  --darkBlue: rgba(0, 87, 163, 1);
  --white: rgba(255, 255, 255, 1);
  --lightWhite: rgba(217, 217, 217, 1);
  --black: rgba(46, 46, 46, 1);
  --paraCol: rgba(0, 0, 0, 1);
  --darkerBlue: rgba(0, 29, 54, 1);

  /* rgba(0, 87, 163, 1) */

  --lightBlue: rgba(170, 199, 224, 1);
  --lighterblue: rgba(0, 87, 163, 0.5);
  --lighterblue2: rgba(204, 221, 237, 1);
  --font24: 3.6rem;
  --font16: 1.6rem;
  --font14: 1.6rem;
  --font12: 1.4rem;
  --weight500: 500;
  --weight400: 400;
  --weight600: 600;
  --line36: 4.41rem;
  --line21: 1.941rem;
  --line24: 1.92rem;
  --line18: 1.641rem;
}
nav {
  width: 90%;
  max-width: 124rem;
}
nav .logoCont {
  width: 12rem;
  height: 4.83rem;
}
.innerMain {
  flex-direction: row-reverse;
  width: 90%;
  max-width: 124rem;
}
.imgCont {
  width: 50.3rem;
  height: 50.5rem;
}
.form2 {
  height: 66rem;
  width: 41.936rem;
}

.forgotPassword {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 20;
  width: 100vw;
  height: 100vh;
  /* height: 70vh; */
  /* transform: translateY(100%); */
  background-color: var(--white);

  transition: transform 0.5s ease-in-out;
}
.innerforgot {
  gap: 4rem;
  max-width: 61.8rem;
  border: 1px solid var(--black);
  height: 56.1rem;

  padding: 2rem 0;
  position: relative;
}

.closeImg {
  display: flex;
  position: absolute;
  right: 4rem;
  top: 4rem;
  cursor: pointer;
}

.change,
.forgotPasswordCont {
  max-width: 41.8rem;
}
.forgotPasswordCont button {
  margin-top: 1.5rem;
}
.forgotPasswordCont .input {
  display: flex;
}
.inputs {
  gap: 1.8rem;
}

.input {
  gap: 0.9rem;
}