.navbar-container {
  position: absolute; }

.form-container {
  height: 100vh;
  width: 100%; }

.form-background {
  width: 100%;
  height: 675px;
  background-color: #2F718D;
  padding-top: 100px; }

.solo-form-container {
  width: 400px;
  background-color: #F4FCFF;
  margin: 0 auto;
  height: 80vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 30px;
  box-shadow: 0px -5px 25px rgba(0, 0, 0, 0.16);
  border-radius: 5px; }
  .solo-form-container .error-info {
    border: 1.5px solid #c53b2a;
    width: 100%;
    padding: 14px;
    color: #c53b2a;
    border-radius: 4px;
    font-weight: bold;
    margin-bottom: 20px; }
  .solo-form-container .solo-form {
    display: flex;
    flex-direction: column; }
    .solo-form-container .solo-form article {
      font-size: 24px;
      font-weight: bold;
      margin-bottom: 20px; }
    .solo-form-container .solo-form .solo-form-forgot-password {
      margin-top: 5px; }
    .solo-form-container .solo-form .solo-form-register {
      margin-top: 40px;
      width: 100%;
      text-align: center; }
    .solo-form-container .solo-form .solo-form-back {
      font-size: 24px;
      color: black;
      width: 100%;
      text-align: right;
      margin-top: 40px; }
    .solo-form-container .solo-form .desc {
      margin-bottom: 20px; }
    .solo-form-container .solo-form a {
      font-size: 16px;
      color: #418D2F;
      text-decoration: none;
      font-weight: bold; }
    .solo-form-container .solo-form form {
      display: flex;
      flex-direction: column; }
      .solo-form-container .solo-form form label {
        font-size: 16px; }
      .solo-form-container .solo-form form input {
        background-color: rgba(65, 141, 47, 0.33);
        margin-bottom: 7px;
        transition: 0.25s; }
        .solo-form-container .solo-form form input::-webkit-outer-spin-button, .solo-form-container .solo-form form input::-webkit-inner-spin-button {
          -webkit-appearance: none;
          margin: 0; }
        .solo-form-container .solo-form form input:focus {
          background: linear-gradient(270deg, rgba(65, 141, 47, 0.33), #418d2f, #2a7836);
          background-size: 600%, 600%;
          animation: 10s smoothGradient infinite; }
      .solo-form-container .solo-form form button {
        background-color: #418d2f;
        color: white;
        font-size: 18px;
        font-weight: bold;
        cursor: pointer;
        transition: 0.25s;
        margin-top: 20px; }
        .solo-form-container .solo-form form button:hover {
          opacity: 0.85; }
      .solo-form-container .solo-form form input, .solo-form-container .solo-form form button {
        height: 40px;
        border: none;
        border-radius: 4px;
        color: white;
        padding-left: 14px; }
        .solo-form-container .solo-form form input:focus, .solo-form-container .solo-form form button:focus {
          outline: none; }

@keyframes smoothGradient {
  0% {
    background-position: 0 50%; }
  50% {
    background-position: 100% 50%; }
  100% {
    background-position: 0 50%; } }
@media (max-width: 450px) {
  .form-background {
    padding-top: 60px; }

  .solo-form-container {
    padding: 0 20px;
    height: calc(100vh - 60px);
    width: 100%;
    border-radius: 0; } }

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