<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link href="style.css" rel="stylesheet" />
</head>

<body>
  <form>
    <label class="item">
      <span class="fh">Your BahnCard 100 number</span><br />
      <span class="sh">The number on the front of your card starting with <span class="ms">7081</span>.</span><br>
      <input name="bcnum" id="bcnum" type="text" pattern="70814[0-9]{11}" required
        title="Your BahnCard number is 16 digits long and starts with 7081." />
    </label>
    <label class="item">
      <span class="fh">Your date of birth</span><br>
      <input name="birthday" id="birthday" type="date" required />
    </label>
    <label>
      <span class="fh">Skip questionnaire</span><br>
      <span class="sh">Automatically answer "I was delayed, by more than 60 minutes."</span><br>
      <input name="autocontinue" id="autocontinue" type="checkbox" />
    </label>
    <div class="item"><button type="submit">Save</button><span id="success"></span></div>
    <p id="errors"></p>
  </form>
  <script src="script.js"></script>
</body>

</html>