/* General styles */
[class^="form-unique-class-"] {
  text-align: left;
  width: 80%;
  max-width: 600px;
  margin: 0 auto;
}

[class^="form-unique-class-"] * {
  box-sizing: border-box;
}

[class^="form-unique-class-"] form {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}

[class^="form-unique-class-"] .fields {
  display: flex;
  flex-wrap: wrap;
}

[class^="form-unique-class-"] label {
  width: 100%;
  margin-bottom: 1rem;
  font-family: 'Lato', 'Helvetica Neue', Helvetica, sans-serif;
}

[class^="form-unique-class-"] input {
  display: block;
  width: 100%;
  padding: 5px 4px;
  font-family: 'Helvetica Neue', Helvetica, sans-serif;
}

[class^="form-unique-class-"] .submit-button {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

[class^="form-unique-class-"] button {
  margin: 1rem 0;
}

[id^="announcement-message-div-"] {
  margin-bottom: 1rem;
  white-space: pre-line;
  font-weight: 700;
}

[id^="announcement-message-div-"].invalid {
  color: #ff0000;
}

/* Page row form styles */
#joinform .submit-button {
  flex-shrink: 0;
}

@media (min-width: 768px) {
  #joinform form {
    flex-direction: row;
  }

  #joinform label {
    flex: 0 1 50%;
    padding-right: 1rem;
  }
}