<form id="animal-form" onsubmit="return onSubmitAnimal(this)">
  <h5>Identication</h5>
  <div class="row">
    <input type="hidden" class="form-control" name="_id" id="id">

    <div class="form-group col-4">
      <label for="a-UUID">UUID</label>
      <input type="text" class="form-control" name="uuid" id="a-UUID" placeholder="UUID">
    </div>
    <div class="form-group col-3">
      <label for="a-name">Name</label>
      <input type="text" class="form-control" name="name" id="a-name" placeholder="Name" required>
    </div>

    <div class="form-group col-2">
      <label for="a-initial_level">Initial Level</label>
      <input type="number" class="form-control" name="initial_level" id="a-initial_level" placeholder="Initial Level" required>
    </div>

    <div class="form-group col-2">
      <label for="a-level">Level</label>
      <input type="number" class="form-control" name="level" id="a-level" placeholder="Level" required>
    </div>

    <div class="form-group col-3">
    <label for="a-specie">Specie</label>
    <select class="form-control" name="specie" id="a-specie" placeholder="specie" required><option value="">Select one</option></select>
    </div>

    <div class="form-group col-2">
    <label for="a-sex">Sex</label>
    <select class="form-control" name="sex" id="a-sex" placeholder="sex" required><option value="">Select one</option> <option value="Male">Male</option> <option value="Female">Female</option></select>
    </div>


  </div>

  <h5>Initial attributes</h5>
  <div class="row">
    <div class="form-group col-2">
      <label for="a-initial_health">Initial Health</label>
      <input type="number" step="any" class="form-control" name="initial_health" id="a-inital_health" placeholder="Initial Health">
    </div>

    <div class="form-group col-2">
    <label for="a-initial_energy">Initial Energy</label>
    <input type="number" step="any" class="form-control" name="initial_energy" id="a-initial_energy" placeholder="Initial Energy">
    </div>

    <div class="form-group col-2">
    <label for="a-initial_food">Initial Food</label>
    <input type="number" step="any" class="form-control" name="initial_food" id="a-initial_food" placeholder="Initial Food">
    </div>

    <div class="form-group col-2">
    <label for="a-initial_damage">Initial Damage</label>
    <input type="number" step="any" class="form-control" name="initial_damage" id="a-initial_damage" placeholder="Initial Damage">
    </div>

    <div class="form-group col-2">
    <label for="a-initial_velocity">Initial Velocity</label>
    <input type="number" step="any" class="form-control" name="initial_velocity" id="a-initial_velocity" placeholder="Initial Velocity">
    </div>
  </div>
  <h5>Actuality attributes</h5>
  <div class="row">
    <div class="form-group col-2">
      <label for="a-health">Health</label>
      <input type="number" step="any" class="form-control" name="health" id="a-health" placeholder="Health">
    </div>

    <div class="form-group col-2">
    <label for="a-energy">Energy</label>
    <input type="number" step="any" class="form-control" name="energy" id="a-energy" placeholder="Energy">
    </div>

    <div class="form-group col-2">
    <label for="a-food">Food</label>
    <input type="number" step="any" class="form-control" name="food" id="a-food" placeholder="Food">
    </div>

    <div class="form-group col-2">
    <label for="a-damage">Damage</label>
    <input type="number" step="any" class="form-control" name="damage" id="a-damage" placeholder="Damage">
    </div>

    <div class="form-group col-2">
    <label for="a-velocity">Velocity</label>
    <input type="number" step="any" class="form-control" name="velocity" id="a-velocity" placeholder="Velocity">
    </div>
  </div>
  <h5>Parenting attributes</h5>
  <div class="row">
    <div class="form-group col-3">
    <label for="a-father">Father</label>
    <select class="form-control" name="father" id="a-father" placeholder="Father"><option value="">None..</option></select>
    </div>

    <div class="form-group col-3">
    <label for="a-mother">Mother</label>
    <select class="form-control" name="mother" id="a-mother" placeholder="Mother"><option value="">None..</option></select>
    </div>

    <div class="form-group col-2">
    <label for="a-inconsistency">Inconsistency</label>
    <input type="number" step="any" class="form-control" name="inconsistency" id="a-inconsistency" placeholder="Inconsistency">
    </div>

    <div class="form-group col-2">
    <label for="a-imprint">Imprint</label>
    <input type="number" step="any" class="form-control" name="imprint" id="a-imprint" placeholder="Imprint">
    </div>

    <div class="form-group col-2">
    <label for="a-mutations">Mutations</label>
    <input type="number" class="form-control" name="mutations" id="a-mutations" placeholder="Mutations">
    </div>
  </div>
  <h5>Clan attributes</h5>
  <div class="row">
    <div class="form-group col-2">
    <label for="a-server">Server</label>
    <input type="text" class="form-control" name="server" id="a-server" placeholder="Server">
    </div>

    <div class="form-group col-2">
    <label for="a-base">Base</label>
    <input type="text" class="form-control" name="base" id="a-base" placeholder="Base">
    </div>

    <div class="form-group col-2">
    <label for="a-breeder">Breeder</label>
    <input type="text" class="form-control" name="breeder" id="a-breeder" placeholder="Breeder">
    </div>
  </div>
  <button id="animal-add-button" type="submit" class="btn btn-primary float-right">Submit</button>
</form>