.app-main {
  /* display */
  display: flex;
  flex-flow: column nowrap;

  /* box-model */
  height: 100%;

  /* misc */
  overflow-y: scroll;
}

.app-main .ignore {
  display: contents;
}

.app-main .create-attraction #map .pfp {
  max-width: 4em;
  max-height: 4em;
}

.app-main #map {
  /* display */
  flex: 1 1 0;
  display: flex;
  align-items: center;
  justify-content: center;
  /* positioning */
  /* box-model */
  min-height: max(15vh, 200px);
  /* typography */
  /* manipulation */
  /* misc */
}

.app-main form {
  flex: 0 0 auto;

  /* display */
  display: flex;
  flex-flow: column nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.5em;

  /* positioning */
  /* box-model */
  padding: 1rem;

  /* typography */
  /* manipulation */
  /* misc */
}

.app-main button#submit-button {
  /* display */
  align-self: flex-end;

  /* positioning */
  /* box-model */
  /* typography */
  /* manipulation */
  /* misc */
}

.app-main .text-input-component {
  /* display */
  /* positioning */

  /* typography */
  font-size: 1.5rem;

  /* manipulation */
  /* misc */
}

.app-main .inline-inputs {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-end;
  gap: 1em;
  justify-content: center;

  width: 100%;
  font-size: 1.5em;
}

.app-main .inline-inputs .text-input-component {
  flex: 1 0 100px;
  font-size: 1em;
}

.app-main .inline-inputs button {
  flex: 0 0 auto;
}