.login {
  align-items: center;
  background: #eaedf9;
  display: flex;
  height: 100vh;
  justify-content: center;
  width: 100vw;

  .formlogin {
    max-width: 330px;
    width: 80%;

    .loginTitle {
      font-size: 17px;
      font-weight: 400;
      margin-bottom: 1rem;
      text-align: center;
      text-transform: uppercase;
    }

    .errorMessage {
      color: #c00;
      padding: 10px;
      text-align: center;
    }

    .connectInput {
      box-sizing: border-box;
      font-size: 17px;
      outline: 0;
      padding: 15px 10px;
      width: 100%;

      &.first {
        border: 1px solid #d2d2d2;
        border-bottom: 0;
        border-radius: 3px 3px 0 0;
        margin-bottom: 0;
      }
      &.second {
        border: 1px solid #d2d2d2;
        border-radius: 0 0 3px 3px;
      }
    }

    .div_pass {
      position: relative;

      .icon_visibility {
        border-radius: 50%;
        height: 52px;
        padding: 13px;
        position: absolute;
        right: 0;
        top: 0;

        span {
          font-size: 26px;
          height: 26px;
        }
      }
    }

    .connectButton {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 1rem;

      button {
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
        background: #1a73e8;
        border: 1px solid #fff;
        border-radius: 5px;
        color: #fff;
        font-weight: 700;
        outline: 3px solid #1a73e8;
        padding: 0.75rem 2.5rem;
        text-transform: uppercase;
      }
    }
  }
}