diff --git a/dist/ef19487056b129c8f3eda17f9543ab70.css b/dist/ef19487056b129c8f3eda17f9543ab70.css
index 9c82dab..f446837 100644
--- a/dist/ef19487056b129c8f3eda17f9543ab70.css
+++ b/dist/ef19487056b129c8f3eda17f9543ab70.css
@@ -5,7 +5,7 @@ body {
   margin: 0;
   padding: 0;
   background: #f8f8f8;
-  font-family: sans-serif; }
+  font-family: sans-serifs; }
 
 main {
   z-index: 980;
@@ -93,11 +93,13 @@ h12 {
 
 .notification-primary {
   width: 100%;
-  display: flex; }
+  display: flex;
+  padding: 5px;
+  border: 2px solid #3498db;
+  border-radius: 2px; }
 
 .notification-primary h2 {
   border-right: 0.3rem solid #3498db;
-  border-radius: 2px;
   padding: 5px;
   margin-right: 5px;
   min-width: 70px;
@@ -106,11 +108,13 @@ h12 {
 
 .notification-danger {
   width: 100%;
-  display: flex; }
+  display: flex;
+  padding: 5px;
+  border: 2px solid #e74c3c;
+  border-radius: 2px; }
 
 .notification-danger h2 {
   border-right: 0.3rem solid #e74c3c;
-  border-radius: 2px;
   padding: 5px;
   margin-right: 5px;
   min-width: 70px;
@@ -119,11 +123,13 @@ h12 {
 
 .notification-warning {
   width: 100%;
-  display: flex; }
+  display: flex;
+  padding: 5px;
+  border: 2px solid #f1c40f;
+  border-radius: 2px; }
 
 .notification-warning h2 {
   border-right: 0.3rem solid #f1c40f;
-  border-radius: 2px;
   padding: 5px;
   margin-right: 5px;
   min-width: 70px;
@@ -132,11 +138,13 @@ h12 {
 
 .notification-success {
   width: 100%;
-  display: flex; }
+  display: flex;
+  padding: 5px;
+  border: 2px solid #2ecc71;
+  border-radius: 2px; }
 
 .notification-success h2 {
   border-right: 0.3rem solid #2ecc71;
-  border-radius: 2px;
   padding: 5px;
   margin-right: 5px;
   min-width: 70px;
diff --git a/dist/ef19487056b129c8f3eda17f9543ab70.js b/dist/ef19487056b129c8f3eda17f9543ab70.js
index 16f886f..df1f744 100644
--- a/dist/ef19487056b129c8f3eda17f9543ab70.js
+++ b/dist/ef19487056b129c8f3eda17f9543ab70.js
@@ -68,7 +68,7 @@ require = (function (modules, cache, entry) {
 
   // Override the current require with this new one
   return newRequire;
-})({6:[function(require,module,exports) {
+})({4:[function(require,module,exports) {
 var bundleURL = null;
 function getBundleURLCached() {
   if (!bundleURL) {
@@ -99,7 +99,7 @@ function getBaseURL(url) {
 exports.getBundleURL = getBundleURLCached;
 exports.getBaseURL = getBaseURL;
 
-},{}],5:[function(require,module,exports) {
+},{}],3:[function(require,module,exports) {
 var bundle = require('./bundle-url');
 
 function updateLink(link) {
@@ -131,7 +131,7 @@ function reloadCSS() {
 
 module.exports = reloadCSS;
 
-},{"./bundle-url":6}],0:[function(require,module,exports) {
+},{"./bundle-url":4}],0:[function(require,module,exports) {
 var global = (1, eval)('this');
 var OldModule = module.bundle.Module;
 function Module() {
@@ -149,7 +149,7 @@ function Module() {
 module.bundle.Module = Module;
 
 if (!module.bundle.parent && typeof WebSocket !== 'undefined') {
-  var ws = new WebSocket('ws://localhost:50893/');
+  var ws = new WebSocket('ws://localhost:55832/');
   ws.onmessage = function(event) {
     var data = JSON.parse(event.data);
 
diff --git a/dist/index.html b/dist/index.html
index 6e70ad7..237e7e2 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -26,31 +26,32 @@
         <main>
             <div class="container">
                 <h1 style="text-align: center;">Alert Elements</h1>
-                <div class="alert-primary"> test </div>
-                <div class="alert-danger"> test </div>
-                <div class="alert-warning"> test </div>
+                <div class="alert-primary"> test </div><br>
+                <div class="alert-danger"> test </div><br>
+                <div class="alert-warning"> test </div><br>
                 <div class="alert-success"> test </div>
                 <br>
-                <h1 style="text-align: center;">Alert Elements</h1>
+                <h1 style="text-align: center;">Notification Elements</h1>
                 <div class="notification-primary"> 
-                    <h2 class="notification-primary-head">ein kleiner test satz</h2>
+                    <h2>ein kleiner test satz</h2>
                     <span class="notification-body">Funktion test des objektes</span>
                 </div>
                 <br>
                 <div class="notification-danger"> 
-                    <h2 class="notification-danger-head">ein kleiner test satz</h2>
+                    <h2>ein kleiner test satz</h2>
                     <span class="notification-body">Funktion test des objektes</span>
                 </div>
                 <br>
                 <div class="notification-warning"> 
-                    <h2 class="notification-warning-head">ein kleiner test satz</h2>
+                    <h2>ein kleiner test satz</h2>
                     <span class="notification-body">Funktion test des objektes</span>
                 </div>
                 <br>
                 <div class="notification-success"> 
-                    <h2 class="notification-success-head">ein kleiner test satz</h2>
+                    <h2>ein kleiner test satz</h2>
                     <span class="notification-body">Funktion test des objektes</span>
                 </div>
+                <br>
                 <h1 style="text-align: center;">CSS Grid</h1>
                 <div class="row">
                     <div class="col-12 display"><h1>12</h1></div>
@@ -69,5 +70,7 @@
                 </div>
             </div>
         </main>
+        <br><br><br>
+        <br><br><br>
     </body>
 </html>
\ No newline at end of file
diff --git a/src/index.html b/src/index.html
index 643ebe1..c14e30e 100644
--- a/src/index.html
+++ b/src/index.html
@@ -26,31 +26,32 @@
         <main>
             <div class="container">
                 <h1 style="text-align: center;">Alert Elements</h1>
-                <div class="alert-primary"> test </div>
-                <div class="alert-danger"> test </div>
-                <div class="alert-warning"> test </div>
+                <div class="alert-primary"> test </div><br>
+                <div class="alert-danger"> test </div><br>
+                <div class="alert-warning"> test </div><br>
                 <div class="alert-success"> test </div>
                 <br>
-                <h1 style="text-align: center;">Alert Elements</h1>
+                <h1 style="text-align: center;">Notification Elements</h1>
                 <div class="notification-primary"> 
-                    <h2 class="notification-primary-head">ein kleiner test satz</h2>
+                    <h2>ein kleiner test satz</h2>
                     <span class="notification-body">Funktion test des objektes</span>
                 </div>
                 <br>
                 <div class="notification-danger"> 
-                    <h2 class="notification-danger-head">ein kleiner test satz</h2>
+                    <h2>ein kleiner test satz</h2>
                     <span class="notification-body">Funktion test des objektes</span>
                 </div>
                 <br>
                 <div class="notification-warning"> 
-                    <h2 class="notification-warning-head">ein kleiner test satz</h2>
+                    <h2>ein kleiner test satz</h2>
                     <span class="notification-body">Funktion test des objektes</span>
                 </div>
                 <br>
                 <div class="notification-success"> 
-                    <h2 class="notification-success-head">ein kleiner test satz</h2>
+                    <h2>ein kleiner test satz</h2>
                     <span class="notification-body">Funktion test des objektes</span>
                 </div>
+                <br>
                 <h1 style="text-align: center;">CSS Grid</h1>
                 <div class="row">
                     <div class="col-12 display"><h1>12</h1></div>
@@ -69,5 +70,7 @@
                 </div>
             </div>
         </main>
+        <br><br><br>
+        <br><br><br>
     </body>
 </html>
\ No newline at end of file
diff --git a/src/scss/main.sass b/src/scss/main.sass
index 39dd001..85f3bf8 100644
--- a/src/scss/main.sass
+++ b/src/scss/main.sass
@@ -18,32 +18,26 @@ body
   margin: 0
   padding: 0
   background: $primBG
-  font-family: sans-serif
-// Nav Overlapping fix
+  font-family: sans-serifs
 main
   z-index: 980
   position: relative
   top: 5.5em
   width: 100%
   word-break: break-all
-
-// header classes margin fix
 @for $i from 1 through 12
      h#{$i}
        margin: 0
-// Dev Classes
 .dev
   border: 1px solid black
 .display 
   background-color: lightcoral
   border: 1px solid red
   text-align: center
-// Container
 .container 
   width: calc( 100% - 10em )
   max-width: 90em
   margin: 0 auto
-// Alert
 .alert-primary
   border-radius: 2px
   background-color: $primary
@@ -71,9 +65,11 @@ main
 .notification-primary
   width: 100%;
   display: flex
+  padding: 5px
+  border: 2px solid $primary
+  border-radius: 2px
 .notification-primary h2
   border-right: 0.3rem solid $primary
-  border-radius: 2px
   padding: 5px
   margin-right: 5px;
   min-width: 70px
@@ -82,9 +78,11 @@ main
 .notification-danger
   width: 100%;
   display: flex
+  padding: 5px
+  border: 2px solid $danger
+  border-radius: 2px
 .notification-danger h2
   border-right: 0.3rem solid $danger
-  border-radius: 2px
   padding: 5px
   margin-right: 5px;
   min-width: 70px
@@ -93,9 +91,11 @@ main
 .notification-warning
   width: 100%;
   display: flex
+  padding: 5px
+  border: 2px solid $warning
+  border-radius: 2px
 .notification-warning h2
   border-right: 0.3rem solid $warning
-  border-radius: 2px
   padding: 5px
   margin-right: 5px;
   min-width: 70px
@@ -104,9 +104,11 @@ main
 .notification-success
   width: 100%;
   display: flex
+  padding: 5px
+  border: 2px solid $success
+  border-radius: 2px
 .notification-success h2
   border-right: 0.3rem solid $success
-  border-radius: 2px
   padding: 5px
   margin-right: 5px;
   min-width: 70px
@@ -116,7 +118,6 @@ main
   line-height: 30pt
   font-size: 15pt
   word-wrap: break-word
-// Grid
 div[class^="col-"]
   padding: 1rem 0
 .row
@@ -127,7 +128,6 @@ div[class^="col-"]
     flex: 0 0 100% / $columns * $i
   .col-offset-#{$i}
     margin-left: 100% / $columns * $i
-// Navigation
 header
   background: $navBG
   text-align: center
@@ -214,7 +214,6 @@ nav a:hover
     margin-left: $navgap
     margin-bottom: 0
     list-style: none
-  // Left sided Navbar for more custumisation
   .nav-logo-left
     grid-column: 2 / span 1
   .nav-left