diff --git a/slides/223015c/02-netzwerke-protokolle-css.md b/slides/223015c/02-netzwerke-protokolle-css.md
index 5f72670..d1dbde3 100644
--- a/slides/223015c/02-netzwerke-protokolle-css.md
+++ b/slides/223015c/02-netzwerke-protokolle-css.md
@@ -827,12 +827,11 @@ SPEAKER NOTES:
 <!-- _footer: '' -->
 <!-- _paginate: false -->
 
-# Der DNS-Lookup
-
-![w:1100 center](./assets/demos/dns-lookup.png)
+![bg fit](./assets/demos/dns-lookup.png)
 
 <!--
 SPEAKER NOTES:
+- Titel: Der DNS-Lookup
 - Kompletter Ablauf (wenn nichts gecached)
 - Resolver = typisch beim Provider, macht Arbeit
 - Root → .de-Server → HdM-NS → IP
@@ -933,14 +932,12 @@ SPEAKER NOTES:
 <!-- _footer: '' -->
 <!-- _paginate: false -->
 
-# Der 3-Way-Handshake
-
-![w:1050 center](./assets/demos/tcp-handshake.png)
-
-**SYN** = Synchronize · **ACK** = Acknowledge
+![bg fit](./assets/demos/tcp-handshake.png)
 
 <!--
 SPEAKER NOTES:
+- Titel: Der 3-Way-Handshake
+- SYN = Synchronize, ACK = Acknowledge
 - 3 Pakete → Verbindung steht
 - 1. Client SYN: "Will Verbindung, starte bei 1000"
 - 2. Server SYN-ACK: "OK, ich starte bei 5000, erwarte 1001"
diff --git a/slides/223015c/assets/demos/css-pseudo-elements.html b/slides/223015c/assets/demos/css-pseudo-elements.html
index 22d5c26..3d84b36 100644
--- a/slides/223015c/assets/demos/css-pseudo-elements.html
+++ b/slides/223015c/assets/demos/css-pseudo-elements.html
@@ -9,13 +9,15 @@
       content: "* ";
       color: red;
     }
+    p.drop { line-height: 1.5; }
     p.drop::first-letter {
-      font-size: 2em;
+      font-size: 3em;
       font-weight: bold;
       color: #d63384;
       float: left;
-      line-height: 1;
-      padding-right: 4px;
+      line-height: 0.9;
+      padding-right: 6px;
+      padding-top: 2px;
     }
     label { display: block; margin-top: 10px; }
     input { padding: 4px 8px; border: 1px solid #9ca3af; border-radius: 3px; margin-top: 3px; }
diff --git a/slides/223015c/assets/demos/css-pseudo-elements.png b/slides/223015c/assets/demos/css-pseudo-elements.png
index fcb74b4..59b7697 100644
Binary files a/slides/223015c/assets/demos/css-pseudo-elements.png and b/slides/223015c/assets/demos/css-pseudo-elements.png differ
diff --git a/slides/223015c/assets/demos/dns-lookup.html b/slides/223015c/assets/demos/dns-lookup.html
index d5b8cfd..9fc4025 100644
--- a/slides/223015c/assets/demos/dns-lookup.html
+++ b/slides/223015c/assets/demos/dns-lookup.html
@@ -70,7 +70,7 @@
 </head>
 <body>
   <div class="diagram">
-    <div class="actor">Dein Laptop</div>
+    <div class="actor">Ihr Laptop</div>
     <div class="actor">Resolver</div>
     <div class="actor">Root (.)</div>
     <div class="actor">.de-Server</div>
diff --git a/slides/223015c/assets/demos/dns-lookup.png b/slides/223015c/assets/demos/dns-lookup.png
index e8d7320..a7d8028 100644
Binary files a/slides/223015c/assets/demos/dns-lookup.png and b/slides/223015c/assets/demos/dns-lookup.png differ
diff --git a/slides/223015c/assets/demos/dns-tree.html b/slides/223015c/assets/demos/dns-tree.html
index f62ae54..52a12b8 100644
--- a/slides/223015c/assets/demos/dns-tree.html
+++ b/slides/223015c/assets/demos/dns-tree.html
@@ -5,54 +5,58 @@
   <title>DNS-Hierarchie</title>
   <style>
     html, body { margin: 0; padding: 0; background: #fff; font-family: system-ui, sans-serif; }
-    body { padding: 30px; display: inline-block; }
-    .tree { display: flex; flex-direction: column; align-items: center; }
-    .node {
-      background: #fef3c7;
-      border: 2px solid #ca8a04;
-      color: #713f12;
-      padding: 8px 18px;
-      border-radius: 6px;
-      font-family: ui-monospace, monospace;
-      font-weight: 700;
-      font-size: 0.95rem;
-    }
-    .root { background: #fde68a; border-color: #b45309; }
-    .leaf { background: #dbeafe; border-color: #1e40af; color: #1e3a8a; }
-    .level { display: flex; gap: 36px; margin-top: 12px; }
-    .edges {
-      width: 100%;
-      height: 20px;
-      position: relative;
-    }
+    body { padding: 20px; display: inline-block; }
     svg { display: block; }
+    .node rect { fill: #fef3c7; stroke: #ca8a04; stroke-width: 2; rx: 6; }
+    .node.root rect { fill: #fde68a; stroke: #b45309; }
+    .node.leaf rect { fill: #dbeafe; stroke: #1e40af; }
+    .node text { font-family: ui-monospace, monospace; font-weight: 700; font-size: 15px; fill: #713f12; }
+    .node.leaf text { fill: #1e3a8a; }
+    .line { stroke: #d63384; stroke-width: 2; fill: none; }
   </style>
 </head>
 <body>
-  <div class="tree">
-    <div class="node root">. (Root)</div>
-    <svg width="360" height="26">
-      <line x1="180" y1="0" x2="60" y2="26" stroke="#d63384" stroke-width="2"/>
-      <line x1="180" y1="0" x2="180" y2="26" stroke="#d63384" stroke-width="2"/>
-      <line x1="180" y1="0" x2="300" y2="26" stroke="#d63384" stroke-width="2"/>
-    </svg>
-    <div class="level">
-      <div class="node">.de</div>
-      <div class="node">.com</div>
-      <div class="node">.org</div>
-    </div>
-    <svg width="360" height="26">
-      <line x1="60" y1="0" x2="60" y2="26" stroke="#d63384" stroke-width="2"/>
-    </svg>
-    <div class="level">
-      <div class="node">hdm-stuttgart</div>
-    </div>
-    <svg width="240" height="26">
-      <line x1="120" y1="0" x2="120" y2="26" stroke="#d63384" stroke-width="2"/>
-    </svg>
-    <div class="level">
-      <div class="node leaf">www</div>
-    </div>
-  </div>
+  <svg width="620" height="520" viewBox="0 0 620 520">
+    <!-- Root -->
+    <g class="node root">
+      <rect x="250" y="10" width="120" height="44"/>
+      <text x="310" y="38" text-anchor="middle">. (Root)</text>
+    </g>
+    <!-- Lines from Root to .de, .com, .org -->
+    <line class="line" x1="310" y1="54" x2="70" y2="120"/>
+    <line class="line" x1="310" y1="54" x2="310" y2="120"/>
+    <line class="line" x1="310" y1="54" x2="550" y2="120"/>
+    <!-- .de -->
+    <g class="node">
+      <rect x="20" y="120" width="100" height="44"/>
+      <text x="70" y="148" text-anchor="middle">.de</text>
+    </g>
+    <!-- .com -->
+    <g class="node">
+      <rect x="260" y="120" width="100" height="44"/>
+      <text x="310" y="148" text-anchor="middle">.com</text>
+    </g>
+    <!-- .org -->
+    <g class="node">
+      <rect x="500" y="120" width="100" height="44"/>
+      <text x="550" y="148" text-anchor="middle">.org</text>
+    </g>
+    <!-- Line .de → hdm-stuttgart -->
+    <line class="line" x1="70" y1="164" x2="70" y2="210"/>
+    <line class="line" x1="70" y1="210" x2="220" y2="210"/>
+    <line class="line" x1="220" y1="210" x2="220" y2="250"/>
+    <!-- hdm-stuttgart -->
+    <g class="node">
+      <rect x="120" y="250" width="200" height="44"/>
+      <text x="220" y="278" text-anchor="middle">hdm-stuttgart</text>
+    </g>
+    <!-- Line hdm → www -->
+    <line class="line" x1="220" y1="294" x2="220" y2="340"/>
+    <!-- www -->
+    <g class="node leaf">
+      <rect x="170" y="340" width="100" height="44"/>
+      <text x="220" y="368" text-anchor="middle">www</text>
+    </g>
+  </svg>
 </body>
 </html>
diff --git a/slides/223015c/assets/demos/dns-tree.png b/slides/223015c/assets/demos/dns-tree.png
index 63b084a..338c32a 100644
Binary files a/slides/223015c/assets/demos/dns-tree.png and b/slides/223015c/assets/demos/dns-tree.png differ
diff --git a/slides/223015c/assets/demos/encap-stack.html b/slides/223015c/assets/demos/encap-stack.html
index e5af10a..97af4a8 100644
--- a/slides/223015c/assets/demos/encap-stack.html
+++ b/slides/223015c/assets/demos/encap-stack.html
@@ -41,12 +41,12 @@
     <div class="arrow"></div>
     <div class="layer tcp">
       <div class="layer-name">TCP</div>
-      <div class="layer-desc">Dest-Port: 52431 (dein Browser)</div>
+      <div class="layer-desc">Dest-Port: 52431 (Ihr Browser)</div>
     </div>
     <div class="arrow"></div>
     <div class="layer ip">
       <div class="layer-name">IP</div>
-      <div class="layer-desc">Dest-IP: 141.62.xxx.xxx (dein Laptop)</div>
+      <div class="layer-desc">Dest-IP: 141.62.xxx.xxx (Ihr Laptop)</div>
     </div>
     <div class="arrow"></div>
     <div class="layer eth">
diff --git a/slides/223015c/assets/demos/encap-stack.png b/slides/223015c/assets/demos/encap-stack.png
index cda7326..67a7e6e 100644
Binary files a/slides/223015c/assets/demos/encap-stack.png and b/slides/223015c/assets/demos/encap-stack.png differ
diff --git a/slides/223015c/assets/demos/hop-chain.html b/slides/223015c/assets/demos/hop-chain.html
index bd371fb..555066d 100644
--- a/slides/223015c/assets/demos/hop-chain.html
+++ b/slides/223015c/assets/demos/hop-chain.html
@@ -46,7 +46,7 @@
 </head>
 <body>
   <div class="chain">
-    <div class="node laptop">Dein Laptop</div>
+    <div class="node laptop">Ihr Laptop</div>
     <div class="edge"><div class="edge-label">[Frame an Router 1]</div><div class="edge-line"></div></div>
     <div class="node router">Router HdM-Netz</div>
     <div class="edge"><div class="edge-label">[Frame an Router 2]</div><div class="edge-line"></div></div>
diff --git a/slides/223015c/assets/demos/hop-chain.png b/slides/223015c/assets/demos/hop-chain.png
index 09a68b1..5fa8991 100644
Binary files a/slides/223015c/assets/demos/hop-chain.png and b/slides/223015c/assets/demos/hop-chain.png differ
diff --git a/slides/223015c/assets/demos/network-chain.html b/slides/223015c/assets/demos/network-chain.html
index 6a561a6..8b61edf 100644
--- a/slides/223015c/assets/demos/network-chain.html
+++ b/slides/223015c/assets/demos/network-chain.html
@@ -39,7 +39,7 @@
 </head>
 <body>
   <div class="chain">
-    <div class="step you">Dein Browser</div>
+    <div class="step you">Ihr Browser</div>
     <div class="arrow"></div>
     <div class="step wire">Netzwerkkarte (WLAN / Ethernet)</div>
     <div class="arrow"></div>
diff --git a/slides/223015c/assets/demos/network-chain.png b/slides/223015c/assets/demos/network-chain.png
index ab5ab97..ea85c77 100644
Binary files a/slides/223015c/assets/demos/network-chain.png and b/slides/223015c/assets/demos/network-chain.png differ
diff --git a/slides/223015c/assets/demos/port-highlight.html b/slides/223015c/assets/demos/port-highlight.html
index 9e4ca68..a852de0 100644
--- a/slides/223015c/assets/demos/port-highlight.html
+++ b/slides/223015c/assets/demos/port-highlight.html
@@ -10,43 +10,48 @@
       font-family: ui-monospace, "SF Mono", monospace;
       font-size: 2.2rem;
       color: #1a1a2e;
+      display: flex;
+      align-items: center;
+    }
+    .port-wrap {
+      display: inline-flex;
+      flex-direction: column;
+      align-items: center;
+      margin-left: 4px;
     }
     .port {
       background: #fde68a;
       color: #7c2d12;
-      padding: 2px 8px;
+      padding: 2px 10px;
       border-radius: 4px;
       font-weight: 700;
     }
-    .caption {
-      margin-top: 14px;
-      font-size: 1rem;
-      color: #4a4a6a;
-      padding-left: 210px;
-      position: relative;
-    }
-    .caption::before {
-      content: "";
-      position: absolute;
-      top: -8px;
-      left: 210px;
+    .connector {
       width: 2px;
-      height: 10px;
+      height: 18px;
       background: #c2410c;
+      margin-top: 4px;
     }
     .caption-text {
       background: #fed7aa;
-      padding: 4px 10px;
+      padding: 6px 12px;
       border-radius: 4px;
-      border-left: 3px solid #c2410c;
-      display: inline-block;
+      border: 2px solid #c2410c;
       color: #7c2d12;
       font-weight: 600;
+      font-size: 1rem;
+      font-family: system-ui, sans-serif;
+      margin-top: 2px;
     }
   </style>
 </head>
 <body>
-  <div class="line">212.132.79.37:<span class="port">443</span></div>
-  <div class="caption"><span class="caption-text">Port 443 = HTTPS</span></div>
+  <div class="line">
+    212.132.79.37:<div class="port-wrap">
+      <span class="port">443</span>
+      <div class="connector"></div>
+      <div class="caption-text">Port 443 = HTTPS</div>
+    </div>
+  </div>
 </body>
 </html>
diff --git a/slides/223015c/assets/demos/port-highlight.png b/slides/223015c/assets/demos/port-highlight.png
index b81df31..ddaeb4e 100644
Binary files a/slides/223015c/assets/demos/port-highlight.png and b/slides/223015c/assets/demos/port-highlight.png differ
diff --git a/slides/223015c/assets/demos/response-hops.html b/slides/223015c/assets/demos/response-hops.html
index 21da3f7..5d835d4 100644
--- a/slides/223015c/assets/demos/response-hops.html
+++ b/slides/223015c/assets/demos/response-hops.html
@@ -44,7 +44,7 @@
     <div class="arrow"></div>
     <div class="step hdm">Router HdM</div>
     <div class="arrow"></div>
-    <div class="step laptop">Dein Laptop</div>
+    <div class="step laptop">Ihr Laptop</div>
   </div>
 </body>
 </html>
diff --git a/slides/223015c/assets/demos/response-hops.png b/slides/223015c/assets/demos/response-hops.png
index bf42145..b4891a8 100644
Binary files a/slides/223015c/assets/demos/response-hops.png and b/slides/223015c/assets/demos/response-hops.png differ
