diff --git a/about.html b/about.html
index 2ede06f..b68f5b9 100644
--- a/about.html
+++ b/about.html
@@ -2,14 +2,15 @@
 <html lang="de" >
 	<head>
 		<meta charset="UTF-8">
-        <title>DAIALECT LOCAL</title>
+        <title>DAIALECT 𑁋 ABOUT</title>
         <link rel="stylesheet" type="text/css" href="style.css">
+		<link rel="icon" type="image/x-icon" href="resources/blobs.png">
 		<script type="text/javascript" src="resources/jquery-3.7.1.min.js"></script>
 		<script type="text/javascript" src="blob-animation.js"></script>
       </head>
 	  <body>
 		<div id="navbar-top">
-			<div id="navbar">
+			<div class="navbar">
 				<ul>
 					<li class="link"><a href="index.html">HOME</a></li>
 					<li>|</li>
@@ -33,7 +34,7 @@
 			</div>
 		</div>
 		<div id="navbar-bottom">
-			<div id="navbar">
+			<div class="navbar">
 				<ul>
 					<li class="link"><a href="index.html">HOME</a></li>
 					<li>|</li>
diff --git a/animations.js b/animations.js
index e3107b6..87e98b7 100644
--- a/animations.js
+++ b/animations.js
@@ -17,8 +17,8 @@ $(document).ready(function () {
             var screenheight = $("body").height();
             var pos = $(this).scrollTop ();
             if (stage == 1 && pos-(screenheight/4.5) >= height2) { moveBlobs ("225vh", "31vw", 2)}
-            else if (stage == 2 && pos-(screenheight/1.9) < height2 ) { moveBlobs ("95vh", "52vw", 1)}
-            else if (stage == 0 && pos+(screenheight/1.5) >= height1){ moveBlobs ("95vh", "52vw", 1)}
+            else if (stage == 2 && pos-(screenheight/1.9) < height2 ) { moveBlobs ("105vh", "55vw", 1)}
+            else if (stage == 0 && pos+(screenheight/1.5) >= height1){ moveBlobs ("105vh", "55vw", 1)}
             else if ((stage == 1 && pos < height1-(screenheight/2))) { moveBlobs (0,0,0) }
         })
     }
diff --git a/index.html b/index.html
index 49124a8..0448d2f 100644
--- a/index.html
+++ b/index.html
@@ -2,14 +2,15 @@
 <html lang="de">
 	<head>
 		<meta charset="UTF-8">
-        <title>DAIALECT LOCAL</title>
+        <title>DAIALECT 𑁋 HOME</title>
         <link rel="stylesheet" type="text/css" href="style.css">
+		<link rel="icon" type="image/x-icon" href="resources/blobs.png">
 		<script type="text/javascript" src="resources/jquery-3.7.1.min.js"></script>
 		<script type="text/javascript" src="animations.js"></script>
       </head>
 	  <body>
 		<div id="navbar-top">
-			<div id="navbar">
+			<div class="navbar">
 				<ul>
 					<li><a href="index.html" class="sel">HOME</a></li>
 					<li>|</li>
@@ -23,8 +24,7 @@
 		</div>
 		<div class="start">
 			<div class="title">
-				<h1>D<em>AI</em>A<br>
-					LECT</h1>
+				<h1>D<em>AI</em>A<br>LECT</h1>
 			</div>
 			<div id="blobs">
 				<div id="blue" class="blob"></div>
@@ -43,13 +43,12 @@
 		</div>
 		<div id="zwei">
 			<div class = "text-mittig">
-				<h2> MIT HILFE VON <br> 
-					KI ALLE <br></h2> 
+				<h2> MIT HILFE VON <br> KI ALLE <br></h2> 
 				<h3>MENSCHEN VERSTEHEN</h3> 
 			</div>
 		</div>
 		<div id="navbar-bottom">
-			<div id="navbar">
+			<div class="navbar">
 				<ul>
 					<li><a href="index.html" class="sel">HOME</a></li>
 					<li>|</li>
diff --git a/pricing.html b/pricing.html
index bb2a807..e3f742b 100644
--- a/pricing.html
+++ b/pricing.html
@@ -2,14 +2,15 @@
 <html lang="de">
 	<head>
 		<meta charset="UTF-8">
-        <title>DAIALECT LOCAL</title>
+        <title>DAIALECT 𑁋 PRICING</title>
         <link rel="stylesheet" type="text/css" href="style.css">
+		<link rel="icon" type="image/x-icon" href="resources/blobs.png">
 		<script type="text/javascript" src="resources/jquery-3.7.1.min.js"></script>
 		<script type="text/javascript" src="blob-animation.js"></script>
       </head>
 	  <body>
 		<div id="navbar-top">
-			<div id="navbar">
+			<div class="navbar">
 				<ul>
 					<li class="link"><a href="index.html">HOME</a></li>
 					<li>|</li>
@@ -32,7 +33,7 @@
 			</div>
 		</div>
 		<div id="navbar-bottom">
-			<div id="navbar">
+			<div class="navbar">
 				<ul>
 					<li class="link"><a href="index.html">HOME</a></li>
 					<li>|</li>
diff --git a/readme.md b/readme.md
index fe78f57..0e67f64 100644
--- a/readme.md
+++ b/readme.md
@@ -4,8 +4,17 @@
 ---
  
 Das imaginäre Produkt, für das ich eine Website entwickelt habe, nennt sich um die Dialekterkennungs-API "DAIALECT". 
-Getestet wurde die Website in Chrome, Edge, Opera und Firefox auf 1080p- sowie 1440p-Monitoren. Bei letzteren empfiehlt es sich, für die optimale Darstellung den Browser-Zoom um eine Stelle zu erhöhen.
-Die verwendeten Schriftarten werden importiert. In meinen Tests hat das nie zu Problemen geführt.
+Zwei der drei verwendeten Schriftarten werden importiert, in meinen Tests hat das nie zu Problemen geführt.
+
 ### IMPLEMENTIERTE SEITEN
 Alle Links in der Navbar sind anklickbar, die Seiten "ABOUT" und "PRICING" sind aber nicht ausformuliert, sondern bestehen nur aus den Überschriften.
-### https://dev.paulmartin.cloud/daialect/index.html
\ No newline at end of file
+
+
+### VERSCHIEDENE VERSIONEN
+Zusätzlich zu der abgegeben Version, ist eine identische auch online verfügbar unter:
+
+### https://dev.paulmartin.cloud/daialect/index.html 
+
+Alle Dateien sowie die vergangenen Versionen der Website sind darüber hinaus auch in einem Git-Repository verfügbar:
+
+### https://git.paulmartin.cloud/paul/DAIALECT
diff --git a/resources/blobs.png b/resources/blobs.png
new file mode 100644
index 0000000..4850d04
Binary files /dev/null and b/resources/blobs.png differ
diff --git a/style.css b/style.css
index 0c51548..210b3e1 100644
--- a/style.css
+++ b/style.css
@@ -1,6 +1,12 @@
+/* SCHRIFTARTEN */
+
 @font-face { font-family: "League Spartan"; src: url("resources/LeagueSpartan.ttf");}
 @font-face { font-family: "League Spartan Black"; src: url("resources/LeagueSpartan-Black.ttf");}
 
+
+
+/* BODY + NAVBAR */
+
 body
 {
 	background-color: #FFE49F; 
@@ -11,6 +17,16 @@ body
   width: 100vw;
 }
 
+.navbar {
+  text-align: center;
+  width: 40vw;
+  background-color: #E07A31;
+  z-index: 55;
+  border-radius: 2cqmin;
+  opacity: 90%;
+  height: 3vw;
+}
+
 #navbar-top {
   justify-content: center;
   display: flex;
@@ -26,16 +42,6 @@ body
   margin-bottom: 2.5vh;
 }
 
-#navbar {
-  text-align: center;
-  width: 40vw;
-  background-color: #E07A31;
-  z-index: 55;
-  border-radius: 2cqmin;
-  opacity: 90%;
-  height: 3vw;
-}
-
 ul {
   vertical-align: middle;
   list-style-type: none;
@@ -67,27 +73,18 @@ li.link:hover {
 }
 
 
-.start {
-  display: flex;
-  justify-content: space-evenly;
-  height: 100vh;
+
+/* INHALT ALLGEMEIN */
+
+p {
+  position: relative;
+  font-size: 0.8vw;
+  text-align: right;
+  z-index: 60;
 }
 
-#eins {
-  display: flex;
-  justify-content: right;
-  height: 100vh;
-}
-
-#zwei {
-  width: 100%;
-  z-index: 10;
-  height: 120vh;
-}
-
-.text-rechts {
-  width: 46vw;
-  margin-right: 5vw;
+h1 em {
+  font-style: normal;
 }
 
 h2 {
@@ -98,17 +95,17 @@ h2 {
   text-align-last: justify;
 }
 
-#eins h2 {
+.start {
   display: flex;
-  line-height: 0.3;
+  justify-content: space-evenly;
+  height: 100vh;
 }
 
-#zwei h2 {
-  font-size: 10vw;
-  line-height: 1.8;
+.text-rechts {
+  width: 46vw;
+  margin-right: 5vw;
 }
 
-
 .text-mittig {
   width: 90%;
   margin-left: 5%;
@@ -123,13 +120,6 @@ h2 {
   text-align-last: justify;
 }
 
-p {
-  position: relative;
-  font-size: 0.8vw;
-  text-align: right;
-  z-index: 60;
-}
-
 .title
 {
   font-family: "League Spartan Black";
@@ -164,19 +154,9 @@ p {
   font-family: "League Spartan";
 }
 
-.laut {
-  font-family: sans-serif !important;
-  font-size: 6vw !important;
-  font-style: italic;
-}
-
 .title em { 
   -webkit-text-fill-color: transparent;
   -webkit-text-stroke: 0.3vw #E07A31;
-} 
-
-h1 em {
-  font-style: normal;
 }
 
 .title p {
@@ -186,15 +166,41 @@ h1 em {
   padding-right: 10vw;
 }
 
-.button-rechts {
+#eins {
+  display: flex;
+  justify-content: right;
   height: 100vh;
-  position: relative;
-  top: 25vh;
-  width: 46%;
-  margin-right: 5vw;
-  display: block;
 }
 
+#eins h2 {
+  display: flex;
+  line-height: 0.3;
+}
+
+#zwei {
+  width: 100%;
+  z-index: 10;
+  height: 120vh;
+}
+
+#zwei h2 {
+  font-size: 10vw;
+  line-height: 1.8;
+}
+
+
+
+/* ABOUT */
+.laut {
+  font-family: sans-serif !important;
+  font-size: 6vw !important;
+  font-style: italic;
+}
+
+
+
+/* TRY NOW */ 
+
 form {
   background-color: transparent;
   border-style: dotted;
@@ -229,19 +235,34 @@ hr {
   border-width: 1vh;
 }
 
-#fileselect {
-  visibility: hidden;
+.button-rechts {
+  height: 100vh;
+  position: relative;
+  top: 25vh;
+  width: 46%;
+  margin-right: 5vw;
+  display: block;
 }
 
-
 .sel {
   color:#fff0cb
 }
 
-@keyframes raise {
-  0% {z-index: 0; opacity: 0%;}
-  70% {opacity: 50%;}
-  100% {z-index: 100; opacity: 90%;}
+#fileselect {
+  visibility: hidden;
+}
+
+
+
+/* BLOBS */
+
+.blob {
+  border-radius: 7.5vw;
+  filter: blur(1.6vw);
+  width: 15vw;
+  height: 15vw;
+  top: 25vh;
+  scale: 1.4;
 }
 
 #blobs {
@@ -255,16 +276,6 @@ hr {
   position: relative;
 }
 
-
-.blob {
-  border-radius: 7.5vw;
-  filter: blur(1.6vw);
-  width: 15vw;
-  height: 15vw;
-  top: 25vh;
-  scale: 1.4;
-}
-
 #blue {
   background-color: #50eff4;
   position: relative;
@@ -292,6 +303,32 @@ hr {
   animation: idle-red 7s 0.3s infinite;
 }
 
+
+
+/* ANIMATIONEN 𑁋 ERSCHEINEN */
+
+@keyframes raise {
+  0% {z-index: 0; opacity: 0%;}
+  70% {opacity: 50%;}
+  100% {z-index: 100; opacity: 90%;}
+}
+
+@keyframes appear {
+  0% {transform: scale(0); opacity: 0%}
+  60% {transform: scale(0.8)}
+  80% {transform: scale(1.1); opacity: 100%}
+  100% {transform: scale(1)}
+}
+
+@keyframes float-in {
+  0% {transform: translateY(-15vh); opacity: 0%}
+  100% {transform: translateY(0vh); opacity: 90%;}
+}
+
+
+
+/* ANIMATIONEN 𑁋 TRY NOW */
+
 @keyframes text-in-out {
   0% {color: inherit}
   40% {color: transparent}
@@ -299,12 +336,6 @@ hr {
   100% {color: inherit}
 }
 
-@keyframes border-out {
-  0% {opacity: 1;}
-  40% {opacity: 0;}
-  100% {opacity: 0;}
-}
-
 @keyframes border-in-out {
   0% {border-radius: 1.5vw}
   10%{border-radius: 1.5vw}
@@ -314,12 +345,16 @@ hr {
   100% {border-radius: 1.5vw}
 }
 
-@keyframes float-in {
-  0% {transform: translateY(-15vh); opacity: 0%}
-  100% {transform: translateY(0vh); opacity: 90%;}
+@keyframes border-out {
+  0% {opacity: 1;}
+  40% {opacity: 0;}
+  100% {opacity: 0;}
 }
 
 
+
+/* ANIMATIONEN 𑁋 BLOBS */
+
 @keyframes idle-blue {
   0% {transform: scale(1); z-index: 0;}
   20% {transform: scale(1.4); z-index: 1;}
@@ -399,10 +434,3 @@ hr {
   100% {top: 215vh; right: 10.4vw; opacity: 10%; transform: scale(0.2);}
 }
 
-
-@keyframes appear {
-  0% {transform: scale(0); opacity: 0%}
-  60% {transform: scale(0.8)}
-  80% {transform: scale(1.1); opacity: 100%}
-  100% {transform: scale(1)}
-}
diff --git a/try.html b/try.html
index 5580ad5..8496d17 100644
--- a/try.html
+++ b/try.html
@@ -2,14 +2,15 @@
 <html lang="de">
 	<head>
 		<meta charset="UTF-8">
-        <title>DAIALECT LOCAL</title>
+        <title>DAIALECT 𑁋 TRY NOW</title>
         <link rel="stylesheet" type="text/css" href="style.css">
+		<link rel="icon" type="image/x-icon" href="resources/blobs.png">
 		<script type="text/javascript" src="resources/jquery-3.7.1.min.js"></script>
 		<script type="text/javascript" src="animations.js"></script>
       </head>
 	  <body>
 		<div id="navbar-top">
-			<div id="navbar">
+			<div class="navbar">
 				<ul>
 					<li class="link"><a href="index.html">HOME</a></li>
 					<li>|</li>
@@ -42,7 +43,7 @@
 			</div>
 		</div>
 		<div id="navbar-bottom">
-			<div id="navbar">
+			<div class="navbar">
 				<ul>
 					<li class="link"><a href="index.html">HOME</a></li>
 					<li>|</li>
