diff --git a/src/presentations/screendesign/design-in-der-medieninformatik/100-layout.md b/src/presentations/screendesign/design-in-der-medieninformatik/100-lay-out.md
similarity index 100%
rename from src/presentations/screendesign/design-in-der-medieninformatik/100-layout.md
rename to src/presentations/screendesign/design-in-der-medieninformatik/100-lay-out.md
diff --git a/src/presentations/screendesign/design-in-der-medieninformatik/115-layoutbeschreiben.md b/src/presentations/screendesign/design-in-der-medieninformatik/115-lay-out-beschreiben.md
similarity index 100%
rename from src/presentations/screendesign/design-in-der-medieninformatik/115-layoutbeschreiben.md
rename to src/presentations/screendesign/design-in-der-medieninformatik/115-lay-out-beschreiben.md
diff --git a/src/presentations/screendesign/gestaltgesetze/100-beispiele.md b/src/presentations/screendesign/gestaltgesetze/100-beispiele.md
index 5aa39f66..2dee4ca2 100755
--- a/src/presentations/screendesign/gestaltgesetze/100-beispiele.md
+++ b/src/presentations/screendesign/gestaltgesetze/100-beispiele.md
@@ -20,7 +20,7 @@ status: ok
 {% screenshot "./images/example-07.png", '{"transition":"none", "classes":"no-shadow", "width":"auto", "bu":""}' %}
 {% screenshot "./images/example-08.png", '{"transition":"none", "classes":"shadow", "width":"auto", "bu":""}' %}
 {% screenshot "./images/example-09.png", '{"transition":"none", "classes":"shadow", "width":"auto", "bu":""}' %}
-{% screenshot "./images/ibm-logo.png", '{"transition":"none", "classes":"no-shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/ibm-logo.png", '{"transition":"none", "classes":"no-shadow", "width":"auto", "bu":"IBM Logo"}' %}
 {% screenshot "./images/example-10.png", '{"transition":"none", "classes":"shadow", "width":"auto", "bu":""}' %}
 {% screenshot "./images/example-11.png", '{"transition":"none", "classes":"shadow", "width":"auto", "bu":""}' %}
 {% screenshot "./images/example-12.png", '{"transition":"none", "classes":"shadow", "width":"auto", "bu":""}' %}
@@ -29,10 +29,10 @@ status: ok
 {% screenshot "./images/example-15.png", '{"transition":"none", "classes":"shadow", "width":"auto", "bu":""}' %}
 {% screenshot "./images/example-16.png", '{"transition":"none", "classes":"shadow", "width":"auto", "bu":""}' %}
 {% screenshot "./images/example-17.png", '{"transition":"none", "classes":"shadow", "width":"auto", "bu":""}' %}
-{% screenshot "./images/java-logo.png", '{"transition":"none", "classes":"no-shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/java-logo.png", '{"transition":"none", "classes":"no-shadow", "width":"auto", "bu":"Java Logo"}' %}
 {% screenshot "./images/example-18.png", '{"transition":"none", "classes":"no-shadow", "width":"auto", "bu":""}' %}
 {% screenshot "./images/example-19.png", '{"transition":"none", "classes":"no-shadow", "width":"auto", "bu":""}' %}
-{% screenshot "./images/woolmark-logo.png", '{"transition":"none", "classes":"no-shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/woolmark-logo.png", '{"transition":"none", "classes":"no-shadow", "width":"auto", "bu":"Woolmark Logo"}' %}
 {% screenshot "./images/example-20.png", '{"transition":"none", "classes":"no-shadow", "width":"auto", "bu":""}' %}
 {% screenshot "./images/example-21.png", '{"transition":"none", "classes":"no-shadow", "width":"auto", "bu":""}' %}
 {% screenshot "./images/example-22.png", '{"transition":"none", "classes":"shadow", "width":"auto", "bu":""}' %}
diff --git a/src/presentations/screendesign/layout/000-intro.md b/src/presentations/screendesign/layout/000-intro.md
index 6205575a..5eab6e2e 100755
--- a/src/presentations/screendesign/layout/000-intro.md
+++ b/src/presentations/screendesign/layout/000-intro.md
@@ -1,5 +1,5 @@
 ---
-title: Wahrnehmungsarbeit
+title: Layout und Raster
 layout: presentation.11ty.js
 slideClasses: intro
 transition: zoom
@@ -7,7 +7,6 @@ transition: zoom
 
 <div class="is-full-width">
 
-# Demo Präsentation
-## Hier sieht man die verschiedenen Slidetypen und Shotcodes im Einsatz
+# Layout
 
 </div>
\ No newline at end of file
diff --git a/src/presentations/screendesign/layout/010-cite.md b/src/presentations/screendesign/layout/010-cite.md
deleted file mode 100755
index 799d130e..00000000
--- a/src/presentations/screendesign/layout/010-cite.md
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: Cite
-layout: presentation.11ty.js
-slideClasses: cite
-author: Max Mustermann, Beispiel
----
-
-Hier wird ein Zitat hübsch angezeigt.
diff --git a/src/presentations/screendesign/layout/010-das-layout.md b/src/presentations/screendesign/layout/010-das-layout.md
new file mode 100755
index 00000000..3403fead
--- /dev/null
+++ b/src/presentations/screendesign/layout/010-das-layout.md
@@ -0,0 +1,49 @@
+---
+title: Worum geht es?
+layout: presentation.11ty.js
+slideClasses: images
+status: ok
+---
+
+{% interlude "Das Layout.", "Gestalterische Macrostruktur"%}
+
+{% screenshot "./images/layout-01.png", '{"transition":"fade", "classes": "shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/layout-02.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/layout-03.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/layout-04.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/layout-05.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/layout-06.png", '{"transition":"fade", "classes": "shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/layout-07.png", '{"transition":"fade", "classes": "shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/layout-08.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":""}' %}
+
+<section class="simple">
+  <div>
+    <div>
+      {% fragment "<p class=\"list\"><strong>Was?</strong> Inhalt</p>" %}
+      {% fragment "<p class=\"list\"><strong>Warum?</strong> Ziel</p>" %}
+      {% fragment "<p class=\"list\"><strong>Für wen?</strong> Zielgruppe</p>" %}
+      {% fragment "<p class=\"list\"><strong>Wo?</strong> Präsentationsmedium</p>" %}
+      {% fragment "<p class=\"list\"><strong>Wie?</strong> stilistische Festlegungen</p>" %}
+    </div>
+</section>
+
+{% screenshot "./images/layout-09.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":"Elemente einer Seite"}' %}
+
+{% screenshot "./images/layout-09b.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":"Layout"}' %}
+
+{% screenshot "./images/layout-09c.png", '{"transition":"fade", "classes": "shadow", "width":"auto", "bu":""}' %}
+
+{% screenshot "./images/layout-10.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":"Satzspiegelkonstruktion durch Diagonalzug (Villardsche Figur)"}' %}
+
+{% screenshot "./images/layout-11.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":"Satzspiegel"}' %}
+
+{% screenshot "./images/layout-12.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":"Satzspiegel"}' %}
+
+
+
+{% screenshot "./images/layout-14.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":"Gestaltungsraster"}' %}
+{% screenshot "./images/layout-15.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":"2-spaltiges Gestaltungsraster"}' %}
+{% screenshot "./images/layout-16.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":"3-spaltiges  Gestaltungsraster"}' %}
+{% screenshot "./images/layout-17.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":"4-spaltiges  Gestaltungsraster"}' %}
+
+{% screenshot "./images/layout-18.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":"4-spaltiges  Gestaltungsraster"}' %}
diff --git a/src/presentations/screendesign/layout/020-gestaltungsraster.md b/src/presentations/screendesign/layout/020-gestaltungsraster.md
new file mode 100755
index 00000000..7af2ba60
--- /dev/null
+++ b/src/presentations/screendesign/layout/020-gestaltungsraster.md
@@ -0,0 +1,16 @@
+---
+title: Worum geht es?
+layout: presentation.11ty.js
+slideClasses: images
+status: ok
+---
+
+{% interlude "Das Gestaltungsraster.", "Gestalterische Mikrostruktur"%}
+
+{% screenshot "./images/gestaltungsraster-01.png", '{"transition":"fade", "classes": "shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/gestaltungsraster-02.png", '{"transition":"fade", "classes": "shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/gestaltungsraster-03.png", '{"transition":"fade", "classes": "shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/gestaltungsraster-04.png", '{"transition":"fade", "classes": "shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/gestaltungsraster-05.png", '{"transition":"fade", "classes": "shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/gestaltungsraster-06.png", '{"transition":"fade", "classes": "shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/gestaltungsraster-07.png", '{"transition":"fade", "classes": "shadow", "width":"auto", "bu":""}' %}
\ No newline at end of file
diff --git a/src/presentations/screendesign/layout/020-watzlawick.md b/src/presentations/screendesign/layout/020-watzlawick.md
deleted file mode 100755
index d8b3df86..00000000
--- a/src/presentations/screendesign/layout/020-watzlawick.md
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: Cite with Image
-layout: presentation.11ty.js
-slideClasses: cite
-img: paul
-author: Max Mustermann, Beispiel
-status: ok
-src: "Watzlawick, Paul (2016): Man kann nicht nicht kommunizieren. Das Lesebuch. 2., unveränderte Auflage. Hg. v. Trude Trunk. Bern: Hogrefe. Online verfügbar unter http://d-nb.info/1079675604/04."
----
-
-Cite. Diesmal mit Bild, was im Front Matter angegeben werden kann. Gleiches gilt für die Quelle.
diff --git a/src/presentations/screendesign/layout/030-scribbles.md b/src/presentations/screendesign/layout/030-scribbles.md
new file mode 100755
index 00000000..1018e1a1
--- /dev/null
+++ b/src/presentations/screendesign/layout/030-scribbles.md
@@ -0,0 +1,21 @@
+---
+title: Worum geht es?
+layout: presentation.11ty.js
+slideClasses: images
+status: ok
+---
+
+{% interlude "Ein Gestaltungsraster hilft immer!"%}
+
+{% screenshot "./images/sketch-01.png", '{"transition":"fade", "classes": "shadow", "width":"auto", "bu":""}' %}
+{% screenshot "./images/sketch-02.png", '{"transition":"fade", "classes": "shadow", "width":"auto", "bu":""}' %}
+
+<section class="simple">
+  <div>
+    <h1>Rastersysteme zum Starten</h1>
+    <div>
+      {% fragment "<p class=\"list\">Raster sollten gleichmäßig sein.</p>" %}
+      {% fragment "<p class=\"list\">Abstand zwischen zwei Spalten muss stimmig sein.</p>" %}
+      {% fragment "<p class=\"list\">Spaltenbreite muss auf Brotschrift abgestimmt sein.</p>" %}
+    </div>
+</section>
\ No newline at end of file
diff --git a/src/presentations/screendesign/layout/040-bilder-wo-es-voll-ist.md b/src/presentations/screendesign/layout/040-bilder-wo-es-voll-ist.md
deleted file mode 100755
index 4d79eba4..00000000
--- a/src/presentations/screendesign/layout/040-bilder-wo-es-voll-ist.md
+++ /dev/null
@@ -1,55 +0,0 @@
----
-title: Bilder wo et voll ist
-layout: presentation.11ty.js
-slideClasses: images
-status: ok
----
-
-<section class="image is-fullscreen" data-background="./images/time-square.jpg.jpg" data-background-position="bottom">
-  <div class="bu">
-    <p>Viel zu tun</p>
-    <p class="credit">
-      <a href="https://unsplash.com/@nextvoyage_pl" target="_blank">Andreas M</a> // <a href="https://unsplash.com/photos/hJwLoCI1TmA" target="_blank">Unsplash</a></p>
-  </div>
-</section>
-
-<section class="image is-fullscreen" data-background="./images/tokyo-shinjuku.jpg">
-  <div class="bu">
-    <p>Viel zu tun</p>
-    <p class="credit">
-       <a href="https://unsplash.com/@josh" target="_blank">Josh Soto</a> // <a href="https://unsplash.com/photos/M76ZhVCMtYw" target="_blank">Unsplash</a></p>
-  </div>
-</section>
-
-<section class="image is-fullscreen" data-background="./images/iwona-castiello-d-antonio-dnMLdR814aA-unsplash.jpg.jpg">
-  <div class="bu">
-    <p>Viel zu tun</p>
-    <p class="credit">
-      <a href="https://unsplash.com/@aquadrata?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText" target="_blank">Iwona Castiello d'Antonio</a> // <a href="https://unsplash.com/s/photos/candy-store?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText" target="_blank">Unsplash</a></p>
-  </div>
-</section>
-
-<section class="image is-fullscreen" data-background="./images/dan-freeman-G4E6PcOt4Ps-unsplash.jpg.jpg">
-  <div class="bu">
-    <p>Viel zu tun</p>
-    <p class="credit"><a href="https://unsplash.com/@danfreemanphoto?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText" target="_blank">Dan Freeman</a> // <a href="https://unsplash.com/s/photos/busy?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText" target="_blank">Unsplash</a></p>
-  </div>
-</section>
-
-<section class="image is-fullscreen" data-background="./images/juan-davila-P8PlK2nGwqA-unsplash.jpg.jpg">
-  <div class="bu">
-    <p>Nicht so viel zu tun</p>
-    <p class="credit">
-      <a href="https://unsplash.com/@juanster?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText" target="_blank">Juan Davila</a> // <a href="https://unsplash.com/s/photos/forest?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText" target="_blank">Unsplash</a>
-    </p>
-  </div>
-</section>
-
-<section class="image is-fullscreen" data-background="./images/greece-chalcis.jpg" data-background-position="bottom">
-  <div class="bu">
-    <p>Nix zu tun</p>
-    <p class="credit">
-      <a href="https://unsplash.com/@senseiminimal" target="_blank">Sensei Minimal</a> // <a href="https://unsplash.com/photos/W_mp2bgO6n0" target="_blank">Unsplash</a>
-    </p>
-  </div>
-</section>
diff --git a/src/presentations/screendesign/layout/040-raster-icons.md b/src/presentations/screendesign/layout/040-raster-icons.md
new file mode 100755
index 00000000..955d07e1
--- /dev/null
+++ b/src/presentations/screendesign/layout/040-raster-icons.md
@@ -0,0 +1,14 @@
+---
+title: Worum geht es?
+layout: presentation.11ty.js
+slideClasses: images
+status: ok
+---
+
+{% interlude "Raster, Icons & Größe.", "Lessons Learned"%}
+
+{% screenshot "./images/raster-01.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":"Raster: Grund- und Gestaltungsraster verwenden"}' %}
+{% screenshot "./images/raster-02.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":"Icons: benutze fertige Sets"}' %}
+{% screenshot "./images/raster-03.png", '{"transition":"fade", "classes": "no-shadow", "width":"auto", "bu":"Größe: Layout auf Device testen"}' %}
+
+
diff --git a/src/presentations/screendesign/layout/050-online-viel-zu-tun.md b/src/presentations/screendesign/layout/050-online-viel-zu-tun.md
deleted file mode 100755
index 2cab4018..00000000
--- a/src/presentations/screendesign/layout/050-online-viel-zu-tun.md
+++ /dev/null
@@ -1,42 +0,0 @@
----
-title: Komplexe Layouts online
-layout: presentation.11ty.js
-slideClasses: images
-status: ok
----
-
-<section class="image screenshot">
-  <figure>
-    <img src="./images/messy-website.jpg">
-    <figcaption class="bu">
-      <p>Viel zu tun</p>
-      <p class="credit">
-        <a href="https://www.arngren.net/" target="_blank">Arngren Electronics</a>
-      </p> 
-    </figcaption>
-  </figure>
-</section>
-
-<section class="image screenshot">
-  <figure>
-    <img src="./images/lingscars.jpg">
-    <figcaption class="bu">
-      <p>Viel zu tun</p>
-      <p class="credit">
-        <a href="https://www.lingscars.com/" target="_blank">Ling's Cars</a>
-      </p> 
-    </figcaption>
-  </figure>
-</section>
-
-<section class="image screenshot">
-  <figure>
-    <img src="./images/yale-art.jpg">
-    <figcaption class="bu">
-      <p>Viel zu tun</p>
-      <p class="credit">
-        <a href="https://www.art.yale.edu/" target="_blank">Yale School of Art</a>
-      </p> 
-    </figcaption>
-  </figure>
-</section>
diff --git a/src/presentations/screendesign/layout/060-aufmerksamkeitstest.md b/src/presentations/screendesign/layout/060-aufmerksamkeitstest.md
deleted file mode 100755
index 5a386555..00000000
--- a/src/presentations/screendesign/layout/060-aufmerksamkeitstest.md
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: Aufmerksamkeitstest
-layout: presentation.11ty.js
-slideClasses: video
-status: ok
----
-
-<section class="video">
-  <figure>
-    <iframe width="560" height="315" src="https://www.youtube.com/embed/flxmavrgMAo" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-    <figcaption class="bu">
-      <p>kleiner Aufmerksamkeitstest</p>
-    </figcaption>
-  </figure>
-</section>
diff --git a/src/presentations/screendesign/layout/100-orientierung.md b/src/presentations/screendesign/layout/100-orientierung.md
deleted file mode 100755
index 3f032ae4..00000000
--- a/src/presentations/screendesign/layout/100-orientierung.md
+++ /dev/null
@@ -1,9 +0,0 @@
----
-title: Orientierung
-layout: presentation.11ty.js
-slideClasses: statement
-status: ok
-transition: zoom
----
-
-ist die handlungs- und bedeutungsbezogene, menschliche Sicht der Welt.
diff --git a/src/presentations/screendesign/layout/110-orientierung-karte.md b/src/presentations/screendesign/layout/110-orientierung-karte.md
deleted file mode 100755
index 3785e55f..00000000
--- a/src/presentations/screendesign/layout/110-orientierung-karte.md
+++ /dev/null
@@ -1,38 +0,0 @@
----
-title: Orientierung
-layout: presentation.11ty.js
-slideClasses: image
-status: ok
-transition: none
----
-
-<section class="image is-fullscreen" data-transition="fade" data-background-transition="fade" data-background="./images/map-cologne.jpg">
-  <div class="bu">
-    <h3>Orientierung schaffen</h3>
-    aber wie?
-  </div>
-</section>
-
-<section class="image is-fullscreen" data-transition="fade"  data-background-transition="fade" data-background="./images/map-cologne.jpg">
-  <div class="is-centered">
-    <div class="content-blocks">
-      <h3>Orientierung schaffen</h3>
-      <ul>
-        <li class="fragment"><strong>reduzieren:</strong> Unwichtiges weglassen</li>
-        <li class="fragment"><strong>strukturieren:</strong> Muster bilden</li>
-        <li class="fragment"><strong>hierarchisieren:</strong> Bezüge herstellen</li>
-      </ul>
-    </div>
-  </div>
-</section>
-
-<section class="image is-fullscreen" data-transition="fade"  data-background-transition="fade" data-background="./images/map-cologne2.jpg">
-  <div class="bu">
-    <h3>Orientierung schaffen</h3>
-    <ul class="inline">
-      <li>reduzieren</li>
-      <li>strukturieren</li>
-      <li>hierarchisieren</li>
-    </ul>
-  </div>
-</section>
\ No newline at end of file
diff --git a/src/presentations/screendesign/layout/330-lindgaard.md b/src/presentations/screendesign/layout/330-lindgaard.md
deleted file mode 100755
index 7c815821..00000000
--- a/src/presentations/screendesign/layout/330-lindgaard.md
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: Gitte Lindgaard
-layout: presentation.11ty.js
-slideClasses: shout
-author: Gitte Lindgaard, Psychologin
-src: "Lindgaard, G., Fernandes, G., Dudek, C. & Brown, J. (2005). Attention web designers: You have 50 milliseconds to make a good first impression! Behaviour & Information Technology (in Press)."
-status: ok
-info: "Three studies were conducted to ascertain how quickly people form an opinion about web page visual appeal and its relation to several design features. In the first study, 22 participants twice rated the visual appeal of web pages presented for 500msecs each. Thirty-one participants took part in the second study, which replicated the first, but participants also rated each web page on seven design dimensions. Visual appeal was found to be closely related to several design features.<br><br>Forty participants took part in study 3, which replicated studies 1 and 2, but employed a 50msec condition to allow comparisons between exposure times. Throughout, visual appeal ratings were highly correlated from one trial to the next as were the correlations between the 50msec and 500msec conditions. <br><br>Thus, visual appeal is assessed within 50msecs. These findings suggest that web designers have about 50msecs to make a good first impression."
----
-
-Attention (web) designers: you have 50 milliseconds to make a good first impression!
diff --git a/src/presentations/screendesign/layout/images/FAZ_neu_S1_gross-570.jpg b/src/presentations/screendesign/layout/images/FAZ_neu_S1_gross-570.jpg
deleted file mode 100755
index d2f96746..00000000
Binary files a/src/presentations/screendesign/layout/images/FAZ_neu_S1_gross-570.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/amazon.jpg b/src/presentations/screendesign/layout/images/amazon.jpg
deleted file mode 100755
index e28eedeb..00000000
Binary files a/src/presentations/screendesign/layout/images/amazon.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/bild-titel.jpg b/src/presentations/screendesign/layout/images/bild-titel.jpg
deleted file mode 100755
index 1d1d40c3..00000000
Binary files a/src/presentations/screendesign/layout/images/bild-titel.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/dan-freeman-G4E6PcOt4Ps-unsplash.jpg.jpg b/src/presentations/screendesign/layout/images/dan-freeman-G4E6PcOt4Ps-unsplash.jpg.jpg
deleted file mode 100755
index b08e3e41..00000000
Binary files a/src/presentations/screendesign/layout/images/dan-freeman-G4E6PcOt4Ps-unsplash.jpg.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/droppedImage-598.pdf.jpg b/src/presentations/screendesign/layout/images/droppedImage-598.pdf.jpg
deleted file mode 100755
index 3638f01e..00000000
Binary files a/src/presentations/screendesign/layout/images/droppedImage-598.pdf.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/gestaltungsraster-01.png b/src/presentations/screendesign/layout/images/gestaltungsraster-01.png
new file mode 100755
index 00000000..5130f40a
Binary files /dev/null and b/src/presentations/screendesign/layout/images/gestaltungsraster-01.png differ
diff --git a/src/presentations/screendesign/layout/images/gestaltungsraster-02.png b/src/presentations/screendesign/layout/images/gestaltungsraster-02.png
new file mode 100755
index 00000000..99744cd3
Binary files /dev/null and b/src/presentations/screendesign/layout/images/gestaltungsraster-02.png differ
diff --git a/src/presentations/screendesign/layout/images/gestaltungsraster-03.png b/src/presentations/screendesign/layout/images/gestaltungsraster-03.png
new file mode 100755
index 00000000..a2f09f64
Binary files /dev/null and b/src/presentations/screendesign/layout/images/gestaltungsraster-03.png differ
diff --git a/src/presentations/screendesign/layout/images/gestaltungsraster-04.png b/src/presentations/screendesign/layout/images/gestaltungsraster-04.png
new file mode 100755
index 00000000..8760e9f4
Binary files /dev/null and b/src/presentations/screendesign/layout/images/gestaltungsraster-04.png differ
diff --git a/src/presentations/screendesign/layout/images/gestaltungsraster-05.png b/src/presentations/screendesign/layout/images/gestaltungsraster-05.png
new file mode 100755
index 00000000..93469d2c
Binary files /dev/null and b/src/presentations/screendesign/layout/images/gestaltungsraster-05.png differ
diff --git a/src/presentations/screendesign/layout/images/gestaltungsraster-06.png b/src/presentations/screendesign/layout/images/gestaltungsraster-06.png
new file mode 100755
index 00000000..dfa9af1f
Binary files /dev/null and b/src/presentations/screendesign/layout/images/gestaltungsraster-06.png differ
diff --git a/src/presentations/screendesign/layout/images/gestaltungsraster-07.png b/src/presentations/screendesign/layout/images/gestaltungsraster-07.png
new file mode 100755
index 00000000..c271a1aa
Binary files /dev/null and b/src/presentations/screendesign/layout/images/gestaltungsraster-07.png differ
diff --git a/src/presentations/screendesign/layout/images/gestaltungsraster-a.png b/src/presentations/screendesign/layout/images/gestaltungsraster-a.png
new file mode 100755
index 00000000..3841dd38
Binary files /dev/null and b/src/presentations/screendesign/layout/images/gestaltungsraster-a.png differ
diff --git a/src/presentations/screendesign/layout/images/gestaltungsraster-b.png b/src/presentations/screendesign/layout/images/gestaltungsraster-b.png
new file mode 100755
index 00000000..3c33b979
Binary files /dev/null and b/src/presentations/screendesign/layout/images/gestaltungsraster-b.png differ
diff --git a/src/presentations/screendesign/layout/images/gestaltungsraster-c.png b/src/presentations/screendesign/layout/images/gestaltungsraster-c.png
new file mode 100755
index 00000000..ef266dce
Binary files /dev/null and b/src/presentations/screendesign/layout/images/gestaltungsraster-c.png differ
diff --git a/src/presentations/screendesign/layout/images/greece-chalcis.jpg b/src/presentations/screendesign/layout/images/greece-chalcis.jpg
deleted file mode 100755
index 0f99cb06..00000000
Binary files a/src/presentations/screendesign/layout/images/greece-chalcis.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/iwona-castiello-d-antonio-dnMLdR814aA-unsplash.jpg.jpg b/src/presentations/screendesign/layout/images/iwona-castiello-d-antonio-dnMLdR814aA-unsplash.jpg.jpg
deleted file mode 100755
index 862e36f8..00000000
Binary files a/src/presentations/screendesign/layout/images/iwona-castiello-d-antonio-dnMLdR814aA-unsplash.jpg.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/juan-davila-P8PlK2nGwqA-unsplash.jpg.jpg b/src/presentations/screendesign/layout/images/juan-davila-P8PlK2nGwqA-unsplash.jpg.jpg
deleted file mode 100755
index f26af0d5..00000000
Binary files a/src/presentations/screendesign/layout/images/juan-davila-P8PlK2nGwqA-unsplash.jpg.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/kronen-zeitung.jpg b/src/presentations/screendesign/layout/images/kronen-zeitung.jpg
deleted file mode 100755
index fa518ffa..00000000
Binary files a/src/presentations/screendesign/layout/images/kronen-zeitung.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/layout-01.png b/src/presentations/screendesign/layout/images/layout-01.png
new file mode 100644
index 00000000..e000e894
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-01.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-02.png b/src/presentations/screendesign/layout/images/layout-02.png
new file mode 100755
index 00000000..30b03842
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-02.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-03.png b/src/presentations/screendesign/layout/images/layout-03.png
new file mode 100755
index 00000000..8e20983b
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-03.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-04.png b/src/presentations/screendesign/layout/images/layout-04.png
new file mode 100755
index 00000000..95b6b3bf
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-04.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-05.png b/src/presentations/screendesign/layout/images/layout-05.png
new file mode 100755
index 00000000..59f281d9
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-05.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-06.png b/src/presentations/screendesign/layout/images/layout-06.png
new file mode 100755
index 00000000..da0c5b4a
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-06.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-07.png b/src/presentations/screendesign/layout/images/layout-07.png
new file mode 100755
index 00000000..836f1502
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-07.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-08.png b/src/presentations/screendesign/layout/images/layout-08.png
new file mode 100644
index 00000000..36295c4e
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-08.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-09.png b/src/presentations/screendesign/layout/images/layout-09.png
new file mode 100644
index 00000000..0c2e55d2
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-09.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-09b.png b/src/presentations/screendesign/layout/images/layout-09b.png
new file mode 100755
index 00000000..ae65ebb6
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-09b.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-09c.png b/src/presentations/screendesign/layout/images/layout-09c.png
new file mode 100644
index 00000000..d4eb00e6
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-09c.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-10.png b/src/presentations/screendesign/layout/images/layout-10.png
new file mode 100644
index 00000000..7b304bda
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-10.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-11.png b/src/presentations/screendesign/layout/images/layout-11.png
new file mode 100644
index 00000000..63af774b
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-11.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-12.png b/src/presentations/screendesign/layout/images/layout-12.png
new file mode 100644
index 00000000..41bf00ce
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-12.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-13.png b/src/presentations/screendesign/layout/images/layout-13.png
new file mode 100644
index 00000000..af792c0c
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-13.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-14.png b/src/presentations/screendesign/layout/images/layout-14.png
new file mode 100644
index 00000000..8ff1ed47
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-14.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-15.png b/src/presentations/screendesign/layout/images/layout-15.png
new file mode 100644
index 00000000..bba85968
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-15.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-16.png b/src/presentations/screendesign/layout/images/layout-16.png
new file mode 100644
index 00000000..93daf19a
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-16.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-17.png b/src/presentations/screendesign/layout/images/layout-17.png
new file mode 100644
index 00000000..cc586c9a
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-17.png differ
diff --git a/src/presentations/screendesign/layout/images/layout-18.png b/src/presentations/screendesign/layout/images/layout-18.png
new file mode 100644
index 00000000..bf9309be
Binary files /dev/null and b/src/presentations/screendesign/layout/images/layout-18.png differ
diff --git a/src/presentations/screendesign/layout/images/lingscars.jpg b/src/presentations/screendesign/layout/images/lingscars.jpg
deleted file mode 100755
index fe77606c..00000000
Binary files a/src/presentations/screendesign/layout/images/lingscars.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/lueneburger-zeitung-eonwerbung.jpg b/src/presentations/screendesign/layout/images/lueneburger-zeitung-eonwerbung.jpg
deleted file mode 100755
index 99e59765..00000000
Binary files a/src/presentations/screendesign/layout/images/lueneburger-zeitung-eonwerbung.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/map-cologne.jpg b/src/presentations/screendesign/layout/images/map-cologne.jpg
deleted file mode 100755
index 9dfcf618..00000000
Binary files a/src/presentations/screendesign/layout/images/map-cologne.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/map-cologne2.jpg b/src/presentations/screendesign/layout/images/map-cologne2.jpg
deleted file mode 100755
index 311eaf1b..00000000
Binary files a/src/presentations/screendesign/layout/images/map-cologne2.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/messy-website.jpg b/src/presentations/screendesign/layout/images/messy-website.jpg
deleted file mode 100755
index 68d01e54..00000000
Binary files a/src/presentations/screendesign/layout/images/messy-website.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/pasted-image-697.png.jpg b/src/presentations/screendesign/layout/images/pasted-image-697.png.jpg
deleted file mode 100755
index 36452afa..00000000
Binary files a/src/presentations/screendesign/layout/images/pasted-image-697.png.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/paul.jpg b/src/presentations/screendesign/layout/images/paul.jpg
deleted file mode 100755
index 7335fa28..00000000
Binary files a/src/presentations/screendesign/layout/images/paul.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/quelle.pdf.jpg b/src/presentations/screendesign/layout/images/quelle.pdf.jpg
deleted file mode 100755
index 72b533c3..00000000
Binary files a/src/presentations/screendesign/layout/images/quelle.pdf.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/raster-01.png b/src/presentations/screendesign/layout/images/raster-01.png
new file mode 100644
index 00000000..be76893f
Binary files /dev/null and b/src/presentations/screendesign/layout/images/raster-01.png differ
diff --git a/src/presentations/screendesign/layout/images/raster-02.png b/src/presentations/screendesign/layout/images/raster-02.png
new file mode 100644
index 00000000..2db48daf
Binary files /dev/null and b/src/presentations/screendesign/layout/images/raster-02.png differ
diff --git a/src/presentations/screendesign/layout/images/raster-03.png b/src/presentations/screendesign/layout/images/raster-03.png
new file mode 100644
index 00000000..d08c6252
Binary files /dev/null and b/src/presentations/screendesign/layout/images/raster-03.png differ
diff --git a/src/presentations/screendesign/layout/images/reduktion-bsp.jpg b/src/presentations/screendesign/layout/images/reduktion-bsp.jpg
deleted file mode 100755
index 8831a98d..00000000
Binary files a/src/presentations/screendesign/layout/images/reduktion-bsp.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/sketch-01.png b/src/presentations/screendesign/layout/images/sketch-01.png
new file mode 100755
index 00000000..4b75c5ce
Binary files /dev/null and b/src/presentations/screendesign/layout/images/sketch-01.png differ
diff --git a/src/presentations/screendesign/layout/images/sketch-02.png b/src/presentations/screendesign/layout/images/sketch-02.png
new file mode 100755
index 00000000..4d71d8e1
Binary files /dev/null and b/src/presentations/screendesign/layout/images/sketch-02.png differ
diff --git a/src/presentations/screendesign/layout/images/t3n-magazin.jpg b/src/presentations/screendesign/layout/images/t3n-magazin.jpg
deleted file mode 100755
index 081aaa0b..00000000
Binary files a/src/presentations/screendesign/layout/images/t3n-magazin.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/tagesschau.jpg b/src/presentations/screendesign/layout/images/tagesschau.jpg
deleted file mode 100755
index 50e0aafd..00000000
Binary files a/src/presentations/screendesign/layout/images/tagesschau.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/time-square.jpg.jpg b/src/presentations/screendesign/layout/images/time-square.jpg.jpg
deleted file mode 100755
index 22497263..00000000
Binary files a/src/presentations/screendesign/layout/images/time-square.jpg.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/tokyo-shinjuku.jpg b/src/presentations/screendesign/layout/images/tokyo-shinjuku.jpg
deleted file mode 100755
index 40927675..00000000
Binary files a/src/presentations/screendesign/layout/images/tokyo-shinjuku.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/tunnel7.jpg b/src/presentations/screendesign/layout/images/tunnel7.jpg
deleted file mode 100755
index 8edd4c29..00000000
Binary files a/src/presentations/screendesign/layout/images/tunnel7.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/yale-art.jpg b/src/presentations/screendesign/layout/images/yale-art.jpg
deleted file mode 100755
index b497a2f9..00000000
Binary files a/src/presentations/screendesign/layout/images/yale-art.jpg and /dev/null differ
diff --git a/src/presentations/screendesign/layout/images/zdf.jpg b/src/presentations/screendesign/layout/images/zdf.jpg
deleted file mode 100755
index 2fdffc8a..00000000
Binary files a/src/presentations/screendesign/layout/images/zdf.jpg and /dev/null differ