diff --git a/img/DropDownMobile.png b/img/DropDownMobile.png
deleted file mode 100644
index 2670c97..0000000
Binary files a/img/DropDownMobile.png and /dev/null differ
diff --git a/img/SpielTypen/Javascript.png b/img/SpielTypen/Javascript.png
new file mode 100644
index 0000000..26385be
Binary files /dev/null and b/img/SpielTypen/Javascript.png differ
diff --git a/img/SpielTypen/PocketCode.png b/img/SpielTypen/PocketCode.png
new file mode 100644
index 0000000..dd0b6a4
Binary files /dev/null and b/img/SpielTypen/PocketCode.png differ
diff --git a/img/SpielTypen/Turbowarp.png b/img/SpielTypen/Turbowarp.png
new file mode 100644
index 0000000..f661875
Binary files /dev/null and b/img/SpielTypen/Turbowarp.png differ
diff --git a/img/SpielTypen/Unity.png b/img/SpielTypen/Unity.png
new file mode 100644
index 0000000..0411914
Binary files /dev/null and b/img/SpielTypen/Unity.png differ
diff --git a/index.html b/index.html
index 26e178e..c37e73e 100644
--- a/index.html
+++ b/index.html
@@ -29,6 +29,20 @@
       <a class="menu-link-mobile" href="">Spiele</a>
     </div>
     <h1 class="headline">Meine Spiele</h1>
+    <div class="SpielTypen">
+      <a href="" class="KategorieLink"
+        ><img src="img/SpielTypen/Javascript.png" alt=""
+      /></a>
+      <a href="" class="KategorieLink"
+        ><img src="img/SpielTypen/PocketCode.png" alt=""
+      /></a>
+      <a href="" class="KategorieLink"
+        ><img src="img/SpielTypen/Unity.png" alt=""
+      /></a>
+      <a href="" class="KategorieLink"
+        ><img src="img/SpielTypen/Turbowarp.png" alt=""
+      /></a>
+    </div>
 
     <script>
       function toggleMenu() {
diff --git a/style.css b/style.css
index be40e72..85cad6f 100644
--- a/style.css
+++ b/style.css
@@ -17,7 +17,6 @@ body {
 .header-container {
   position: relative;
   width: 100%;
-  
 }
 
 .header-image {
@@ -149,3 +148,10 @@ body {
     background-color: rgb(104, 0, 0);
   }
 }
+.Spieletypen {
+  display: block;
+}
+.KategorieLink {
+  width: 15vw;
+  height: 100%;
+}