.final-form-example {
  font-family: sans-serif;
  /*
  // Removed. This should have a more specific selector.
  & > div {
    text-align: center;
  }

  a {
    display: block;
    text-align: center;
    color: #222;
  }

  p {
    max-width: 500px;
    margin: 10px auto;
    & > a {
      display: inline;
    }
  }
	*/
  /*
  // Removed. Unused.
  .loading {
    font-size: 2em;
    font-weight: bold;
    text-align: center;
    margin: 50px;
  }
  */ }
  .final-form-example h1 {
    text-align: center;
    color: #222; }
  .final-form-example h2 {
    text-align: center;
    color: #222; }
  .final-form-example > form, .final-form-example > div.form {
    margin: 10px auto; }
  .final-form-example form,
  .final-form-example div.form {
    text-align: left;
    max-width: 500px;
    margin: 10px;
    border: 1px solid #ccc;
    padding: 20px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
    border-radius: 3px;
    position: relative; }
    .final-form-example form > div,
    .final-form-example div.form > div {
      display: flex;
      flex-flow: row nowrap;
      line-height: 2em;
      position: relative;
      padding: 6px 5px 0 5px;
      border: 1px solid transparent; }
      .final-form-example form > div.active,
      .final-form-example div.form > div.active {
        background-color: paleturquoise;
        border-color: turquoise; }
      .final-form-example form > div > label,
      .final-form-example div.form > div > label {
        color: #333;
        width: 110px;
        min-width: 60px;
        font-size: 1em;
        line-height: 32px; }
      .final-form-example form > div > input, .final-form-example form > div > select, .final-form-example form > div > textarea,
      .final-form-example div.form > div > input,
      .final-form-example div.form > div > select,
      .final-form-example div.form > div > textarea {
        flex: 1;
        padding: 3px 5px;
        font-size: 1em;
        margin-left: 15px;
        border: 1px solid #ccc;
        border-radius: 3px; }
      .final-form-example form > div > input[type='checkbox'],
      .final-form-example div.form > div > input[type='checkbox'] {
        margin-top: 7px; }
      .final-form-example form > div > div,
      .final-form-example div.form > div > div {
        margin-left: 16px; }
        .final-form-example form > div > div > label,
        .final-form-example div.form > div > div > label {
          margin-left: 0;
          display: block; }
          .final-form-example form > div > div > label > input,
          .final-form-example div.form > div > div > label > input {
            margin-right: 3px; }
      .final-form-example form > div > span,
      .final-form-example div.form > div > span {
        line-height: 32px;
        margin-left: 10px;
        color: #800;
        font-weight: bold; }
    .final-form-example form > .buttons,
    .final-form-example div.form > .buttons {
      display: flex;
      flex-flow: row nowrap;
      justify-content: center;
      margin-top: 15px; }
    .final-form-example form .error,
    .final-form-example div.form .error {
      display: flex;
      font-weight: bold;
      color: #800;
      flex-flow: row nowrap;
      justify-content: center; }
    .final-form-example form button,
    .final-form-example div.form button {
      margin: 0 10px; }
      .final-form-example form button[type='submit'],
      .final-form-example div.form button[type='submit'] {
        white-space: nowrap;
        display: inline-block;
        border-radius: 5px;
        padding: 5px 15px;
        font-size: 16px;
        color: white;
        cursor: pointer;
        /* Added */
        background-image: linear-gradient(#4f93ce, #285f8f);
        border: 1px solid #285f8f; }
        .final-form-example form button[type='submit']:visited,
        .final-form-example div.form button[type='submit']:visited {
          color: white; }
        .final-form-example form button[type='submit']:hover,
        .final-form-example div.form button[type='submit']:hover {
          background-image: linear-gradient(#4f93ce, #285f8f); }
          .final-form-example form button[type='submit']:hover[disabled],
          .final-form-example div.form button[type='submit']:hover[disabled] {
            background-image: linear-gradient(#4f93ce, #285f8f); }
        .final-form-example form button[type='submit']:visited,
        .final-form-example div.form button[type='submit']:visited {
          color: black; }
        .final-form-example form button[type='submit'][disabled],
        .final-form-example div.form button[type='submit'][disabled] {
          opacity: 0.6;
          cursor: not-allowed; }
      .final-form-example form button[type='button'],
      .final-form-example div.form button[type='button'] {
        white-space: nowrap;
        display: inline-block;
        border-radius: 5px;
        padding: 5px 15px;
        font-size: 16px;
        color: white;
        cursor: pointer;
        /* Added */
        background-image: linear-gradient(#ffffff, #d5d5d5);
        border: 1px solid #d5d5d5;
        color: #555; }
        .final-form-example form button[type='button']:visited,
        .final-form-example div.form button[type='button']:visited {
          color: white; }
        .final-form-example form button[type='button']:hover,
        .final-form-example div.form button[type='button']:hover {
          background-image: linear-gradient(#ffffff, #d5d5d5); }
          .final-form-example form button[type='button']:hover[disabled],
          .final-form-example div.form button[type='button']:hover[disabled] {
            background-image: linear-gradient(#ffffff, #d5d5d5); }
        .final-form-example form button[type='button']:visited,
        .final-form-example div.form button[type='button']:visited {
          color: black; }
        .final-form-example form button[type='button'][disabled],
        .final-form-example div.form button[type='button'][disabled] {
          opacity: 0.6;
          cursor: not-allowed; }
    .final-form-example form pre,
    .final-form-example div.form pre {
      border: 1px solid #ccc;
      background: rgba(0, 0, 0, 0.1);
      box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.2);
      padding: 20px; }

.form-container-row {
  display: flex;
  flex-flow: row nowrap; }

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