App.css

.sign-up {
  color: #6e6d7a;
  width: 100%;
  height: 100%;
  background-color: #f2f6f9;
  flex-direction: column;
  justify-content: space-around;
  align-items: stretch;
  padding-bottom: 34px;
  padding-left: 49px;
  padding-right: 25px;
  font-family: Quicksand;
  font-size: 3rem;
  font-weight: 700;
  line-height: 16px;
  display: flex;
}

.flex-container {
  color: #3ba6f2;
  width: 95%;
  flex-direction: row;
  flex-basis: 5%;
  justify-content: space-between;
  align-self: center;
  align-items: flex-end;
  margin-bottom: 58px;
  font-size: 2.25rem;
  line-height: 45px;
  display: flex;
}

.learn-sign {
  margin-bottom: 3px;
  margin-right: 313px;
}

.rectangle-12 {
  color: #fff;
  height: 100%;
  background-color: #3ba6f2;
  border: none;
  border-radius: 20px;
  flex-direction: row;
  flex-basis: 15%;
  justify-content: center;
  align-items: center;
  margin-left: 156px;
  padding-top: 4px;
  padding-left: 2px;
  font-family: Quicksand;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 30px;
  display: flex;
}

.sign-up-1 {
  margin-top: 2px;
  margin-left: 1px;
}

.rectangle-12-1 {
  color: #3ba6f2;
  height: 100%;
  background-color: #fff;
  border: 2px solid #3ba6f2;
  border-radius: 20px;
  flex-direction: row;
  flex-basis: 15%;
  justify-content: center;
  align-items: center;
  padding-top: 4px;
  padding-left: 1px;
  font-family: Quicksand;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 30px;
  display: flex;
}

.log-in {
  margin-top: 2px;
}

.register-as-user {
  color: #1176bd;
  margin-top: 15px;
  margin-left: 33px;
  line-height: 60px;
}

.flex-container-1 {
  width: 90%;
  flex-direction: row;
  justify-content: space-between;
  align-self: center;
  align-items: center;
  margin-bottom: 32px;
  display: flex;
}

.flex-container-2 {
  height: 100%;
  flex-direction: column;
  flex-basis: 35%;
  justify-content: space-between;
  align-items: stretch;
  margin-top: 4px;
  margin-bottom: 7px;
  display: flex;
}

.input-field-instance-1 {
  width: 100%;
  flex-basis: 19%;
  margin-left: 1px;
}

.input-field-1-instance {
  width: 100%;
  flex-basis: 19%;
  margin-right: 1px;
}

.input-field-2-instance {
  width: 100%;
  flex-basis: 19%;
  margin-bottom: 25px;
  margin-left: 1px;
}

.rectangle-12-2 {
  color: #fff;
  width: 45%;
  background-color: #3ba6f2;
  border: none;
  border-radius: 20px;
  flex-direction: row;
  flex-basis: 13%;
  justify-content: center;
  align-items: center;
  margin-top: 9px;
  margin-left: 1px;
  margin-right: 6px;
  padding-top: 1px;
  font-family: Quicksand;
  font-size: 1.375rem;
  font-weight: 500;
  line-height: 28px;
  display: flex;
}

.sign-up-2 {
  margin-top: 2px;
}

.arrow-right {
  width: 19px;
  height: 19px;
  object-fit: cover;
  margin-left: 8px;
}

.wormies-staying-home {
  width: 581px;
  height: 429px;
  object-fit: cover;
  background-position: center;
  background-size: cover;
}

.already-have-an-acco {
  margin-top: 8px;
  margin-bottom: 17px;
  margin-left: 38px;
  font-family: Roboto;
  font-size: .875rem;
  font-weight: 500;
}