diff --git a/01_grundlagen/linksammlung.md b/01_grundlagen/linksammlung.md
index a94d4cf..0ff54fd 100644
--- a/01_grundlagen/linksammlung.md
+++ b/01_grundlagen/linksammlung.md
@@ -24,3 +24,10 @@
 ## Tools/ Software
 
 - [Microsoft Powertoys](https://learn.microsoft.com/de-de/windows/powertoys/)
+
+## CSS/SCSS Tuts
+
+- [CSS Reference](https://cssreference.io/)
+- [CSS Tricks - Flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
+- [CSS Flexboxfroggy](https://flexboxfroggy.com/#de)
+- [CSS Gridgarden](https://cssgridgarden.com/#de)
diff --git a/01_grundlagen/unterricht/tag05/01_is-nan.html b/01_grundlagen/unterricht/tag05/01_is-nan.html
new file mode 100644
index 0000000..491640f
--- /dev/null
+++ b/01_grundlagen/unterricht/tag05/01_is-nan.html
@@ -0,0 +1,58 @@
+<!doctype html>
+<html lang="de">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>isNaN()</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>isNaN()</h1>
+        <p>
+          Die <code>isNaN()</code> Methode prüft, ob ein Wert NaN ist. Bemerkung: Aufgrund innerer Zwänge weist die
+          isNaN Methode interessante Regeln auf. Alternativ kann die in ECMAScript 2015 definierte Methode
+          <code>Number.isNaN()</code> genutzt werden.
+        </p>
+        <ul class="list">
+          <li>
+            <a href="https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Global_Objects/isNaN">isNaN()</a>
+          </li>
+        </ul>
+      </div>
+    </main>
+    <script>
+      'use strict';
+
+      console.log(isNaN(3)); // => false
+      console.log(isNaN('Hallo')); // => true
+      // seit ES6 (2015)
+      console.log(Number.isNaN('Hallo')); // => true
+
+      console.log(isNaN(NaN)); // => true, denn NaN bedeutet Not a Number
+
+      console.log(isNaN(-42));
+      console.log(isNaN(27));
+      console.log(isNaN(25.342)); // =>  false, denn die Argumente sind Zahlen.
+
+      console.log(isNaN('17.7')); // => false
+      console.log(isNaN('dreiundzwanzig')); // => true
+      console.log(isNaN('3Autos')); // => true
+
+      console.log(isNaN('3.5')); //=> false - Eselsbrücke mit 2 multiplizieren -> '3.5' * 2 => 7
+      console.log(isNaN('3,5')); //=> true - Eselsbrücke mit 2 multiplizieren -> '3,5' * 2 => NaN
+
+      console.log(isNaN('3m')); //=> '3m' * 2 -> NaN --> true
+
+      // Verneinung über ! - unärer Operator (NOT)
+      console.log(!isNaN('17.7')); // => true
+
+      // Helferfunktion isNumber()
+      const isNumber = (n) => !isNaN(n);
+
+      console.log(isNumber(123)); // => true
+      console.log(isNumber('hello')); // => false
+    </script>
+  </body>
+</html>
diff --git a/01_grundlagen/unterricht/tag05/02_reichweite-verbrauch-formular.html b/01_grundlagen/unterricht/tag05/02_reichweite-verbrauch-formular.html
new file mode 100644
index 0000000..5bcd8e5
--- /dev/null
+++ b/01_grundlagen/unterricht/tag05/02_reichweite-verbrauch-formular.html
@@ -0,0 +1,78 @@
+<!doctype html>
+<html lang="de">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Formularbeispiel: Reichweite & Verbrauch</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>Formularbeispiel: Reichweite & Verbrauch</h1>
+        <p>Berechne deinen PKW-Kraftstoffverbrauch, indem du folgende Felder ausfüllst:</p>
+
+        <form class="form-calculator">
+          <div class="row">
+            <div class="col">
+              <div class="mb-3">
+                <label for="input-distance" class="form-label">Gefahrene Strecke in km</label>
+                <input
+                  type="number"
+                  min="0"
+                  step="0.1"
+                  placeholder="0,0"
+                  id="input-distance"
+                  name="distance"
+                  class="form-control input-distance" />
+              </div>
+            </div>
+          </div>
+          <!-- ▲ /row ▲ -->
+
+          <!-- .row>.col>.mb-3>label.form-label+input:number.form-control -->
+          <div class="row">
+            <div class="col">
+              <div class="mb-3">
+                <label for="input-fuel-used" class="form-label"> Verbrauchte Benzinmenge </label>
+                <input
+                  type="number"
+                  placeholder="0,0"
+                  name="fuel-used"
+                  id="input-fuel-used"
+                  class="form-control input-fuel-used" />
+              </div>
+            </div>
+          </div>
+          <!-- ▲ /row ▲ -->
+          <div class="row">
+            <div class="col">
+              <div class="mb-3">
+                <label for="input-tank-size" class="form-label">Tankgröße </label>
+                <input
+                  type="number"
+                  placeholder="0,0"
+                  name="tank-size"
+                  id="input-tank-size"
+                  class="form-control input-tank-size" />
+              </div>
+            </div>
+          </div>
+          <!-- ▲ /row ▲ -->
+          <!-- .row>.col>.mb-3>button:submit.btn.btn-dark.button-calculate -->
+          <div class="row">
+            <div class="col">
+              <div class="mb-3">
+                <button type="submit" class="btn btn-dark button-calculate">Rechnen</button>
+              </div>
+            </div>
+          </div>
+        </form>
+        <div class="output alert alert-secondary my-3"></div>
+      </div>
+    </main>
+    <script>
+      'use strict';
+    </script>
+  </body>
+</html>
