diff --git a/01_grundlagen/uebungen/o01_kontaktformular-adel.html b/01_grundlagen/uebungen/o01_kontaktformular-adel.html
new file mode 100644
index 0000000..dc8ec77
--- /dev/null
+++ b/01_grundlagen/uebungen/o01_kontaktformular-adel.html
@@ -0,0 +1,183 @@
+<!doctype html>
+<html lang="de">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title></title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet" />
+  </head>
+  <body>
+    <main>
+      <div class="container py-5">
+        <h1>Kontaktformular</h1>
+
+        <form class="form-contact">
+          <!-- Eigene CSS-Klasse -->
+          <div class="row">
+            <div class="col-12 col-md-2">
+              <div class="mb-3">
+                <label for="input-gender" class="form-label">Anrede</label>
+                <select id="input-gender" name="gender" class="form-select" required>
+                  <option value="f">Frau</option>
+                  <option value="m">Herr</option>
+                  <option value="d">Divers</option>
+                </select>
+              </div>
+            </div>
+
+            <!-- ------------------------------------------------------------------- -->
+
+            <div class="col-12 col-md-5">
+              <!-- col-12: volle Breite auf Handy, col-md-6: halbe Breite auf Desktop -->
+
+              <div class="mb-3">
+                <!-- margin-bottom: 1rem -->
+
+                <label for="input-firstname" class="form-label">Vorname</label>
+                <input
+                  type="text"
+                  id="input-firstname"
+                  name="firstname"
+                  class="form-control input-firstname"
+                  placeholder="Vorname eingeben.."
+                  required />
+              </div>
+            </div>
+            <!-- --------------------------------- -->
+            <div class="col-12 col-md-5">
+              <div class="mb-3">
+                <label for="lastname" class="form-label">Nachname</label>
+                <input
+                  type="text"
+                  id="lastname"
+                  name="lastname"
+                  class="form-control"
+                  placeholder="Nachname eingeben..."
+                  required />
+              </div>
+            </div>
+          </div>
+          <!-- --------------------------------------------- -->
+
+          <!-- ------------------------------------------------ -->
+          <div class="row">
+            <div class="col-12 col-md-6">
+              <div class="mb-3">
+                <label for="E-Mail" class="form-label">E-Mail</label>
+                <input
+                  type="text"
+                  id="E-Mail"
+                  name="E-Mail"
+                  class="form-control"
+                  placeholder="E-Mail eingeben..."
+                  required />
+              </div>
+            </div>
+            <div class="col-12 col-md-6">
+              <div class="mb-3">
+                <label for="input-birthdate" class="form-label">Geburtsdatum</label>
+                <input type="date" id="input-birthdate" name="birthdate" class="form-control" required />
+              </div>
+            </div>
+          </div>
+
+          <!-- ------------------------ -->
+          <!-- <label for="Adresse" class="form-lable">Adresse</label> -->
+          <!-- ------------------------------------------ -->
+          <div class="row">
+            <div class="col-12 col-md-4">
+              <div class="mb-3">
+                <label for="Strasse" class="form-lable">Straße</label>
+                <input
+                  type="text"
+                  id="Strasse"
+                  name="Straße"
+                  class="form-control"
+                  placeholder="Straße eingeben..."
+                  required />
+              </div>
+            </div>
+            <!-- ---------------------------------------------  -->
+            <div class="col-12 col-md-4">
+              <div class="mb-3">
+                <label for="plz" class="form-lable">PLZ</label>
+                <input type="text" id="plz" name="PLZ" class="form-control" placeholder="PLZ" required />
+              </div>
+            </div>
+
+            <!-- ---------------------------------------------- -->
+            <div class="col-3 col-md-4">
+              <div class="mb-3">
+                <label for="Hausnr" class="form-Hausnr">Hausnummer</label>
+                <input type="text" id="Hausnr" name="Hausnr" class="form-control" placeholder="Hausnr" required />
+              </div>
+            </div>
+          </div>
+          <!-- /row ---------------------------------------------------- -->
+
+          <div class="row">
+            <div class="col-12">
+              <div class="mb-3">
+                <label for="Stadt" class="form-ort">Stadt</label>
+                <input type="text" id="Stadt" name="Stadt" class="form-control" placeholder="Stadt" required />
+              </div>
+            </div>
+          </div>
+          <!-- ----------------------------------------- -->
+          <div class="row">
+            <div class="col">
+              <div class="mb-3">
+                <label for="input-subject" class="form-label">Land</label>
+                <select id="input-subject" name="subject" class="form-select" required>
+                  <option value="">Deutschland</option>
+                  <option value="">Frankreich</option>
+                  <option value="">Österreich</option>
+                </select>
+              </div>
+            </div>
+          </div>
+
+          <!-- ------------------------------------    -->
+          <div class="row">
+            <div class="col-12">
+              <div class="mb-3">
+                <label for="input-message" class="form-label">Nachricht</label>
+                <textarea
+                  id="input-message"
+                  name="message"
+                  class="form-control"
+                  rows="3"
+                  placeholder=""
+                  required></textarea>
+              </div>
+            </div>
+          </div>
+
+          <!-- ----------------------------------------   -->
+
+          <div class="row">
+            <div class="col-12">
+              <div class="mb-3 form-check">
+                <input
+                  type="checkbox"
+                  id="input-datenschutz"
+                  name="datenschutz"
+                  class="form-check-input"
+                  value="datenschutz"
+                  required />
+
+                <label for="input-datenschutz" class="form-check-label">
+                  Ich habe die Datenschutzerklärung gelesen und akzeptiere sie.
+                </label>
+              </div>
+            </div>
+          </div>
+          <!-- ▲ /row ▲ -->
+        </form>
+      </div>
+    </main>
+    <script>
+      'use strict';
+    </script>
+  </body>
+</html>
