diff --git a/sass/flash.scss b/sass/flash.scss
new file mode 100644
index 0000000..00d9d90
--- /dev/null
+++ b/sass/flash.scss
@@ -0,0 +1,14 @@
+.flash {
+    background-color: #f14668;
+    border-radius: 6px;
+    box-shadow: 0 .5em 1em -.125em rgba(10,10,10,.1),0 0 0 1px rgba(10,10,10,.02);
+    color: #fff;
+    display: block;
+    padding: 1.25rem; 
+    width: calc(100% - 6rem);
+    margin: 2rem auto;
+
+    .header {
+        font-weight: 800;
+    }
+}
\ No newline at end of file
diff --git a/sass/home.scss b/sass/home.scss
index 459f28f..b7b2534 100644
--- a/sass/home.scss
+++ b/sass/home.scss
@@ -1,8 +1,10 @@
-.header {
-    margin-bottom: 3.25rem;
-    @include respond-to("small-up") {
-        height: 30vh;
-        background-image: url('/header.jpg');
-        background-size: cover;
+.home {
+    .header {
+        margin-bottom: 3.25rem;
+        @include respond-to("small-up") {
+            height: 30vh;
+            background-image: url('/header.jpg');
+            background-size: cover;
+        }
     }
-}
+}
\ No newline at end of file
diff --git a/sass/index.scss b/sass/index.scss
index 87a33e6..64fb5d4 100644
--- a/sass/index.scss
+++ b/sass/index.scss
@@ -31,6 +31,8 @@
 @import './button.scss';
 @import './table';
 @import './modal';
+@import './toast';
+@import './flash';
 
 @import './home';
 @import './connexion';
diff --git a/sass/toast.scss b/sass/toast.scss
index af7a06a..b0fc19b 100644
--- a/sass/toast.scss
+++ b/sass/toast.scss
@@ -8,10 +8,59 @@
     top: 30px;
     font-size: 17px;
 
+    padding: 1.25rem 2.5rem 1.25rem 1.5rem;
+    background-color: #f14668;
+    color: #fff;
+
     &.show {
         visibility: visible;
         animation: toastrFadein 0.5s, toastrFadeout 0.5s 2.5s;
     }
+
+    button {
+        width: 20px;
+        font-size: 0;
+        height: 20px;
+        max-height: 20px;
+        max-width: 20px;
+        min-height: 20px;
+        min-width: 20px;
+        outline: 0;
+        border: none;
+        border-radius: 9999px;
+        cursor: pointer;
+        pointer-events: auto;
+        display: inline-block;
+        user-select: none;
+        right: .5rem;
+        position: absolute;
+        top: .5rem;
+        background-color: rgba(10, 10, 10, 0.2);
+
+        &:hover {
+            background-color: rgba(10,10,10,.3);
+        }
+
+        &::before,
+        &::after {
+            background-color: #fff;
+            content: "";
+            display: block;
+            left: 50%;
+            position: absolute;
+            top: 50%;
+            transform: translateX(-50%) translateY(-50%) rotate(45deg);
+            transform-origin: center center;
+        }
+        &::before {
+            height: 2px;
+            width: 50%;
+        }
+        &::after {
+            height: 50%;
+            width: 2px;
+        }
+    }
 }
 
 @keyframes toastrFadein {
diff --git a/views/index.ejs b/views/index.ejs
index 9dd570f..885ae8b 100644
--- a/views/index.ejs
+++ b/views/index.ejs
@@ -26,7 +26,7 @@
     
         <script>
             function showToastr(message) {
-                var x = document.getElementById("toastr");
+                let x = document.getElementById("toastr");
                 if ( message ) {
                     x.getElementsByTagName("SPAN")[0].innerHTML = message;
                 }
@@ -34,6 +34,12 @@
                 x.className = `${x.className} show`;
                 setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000);
             };
+
+            function hideToastr() {
+                let x = document.getElementById("toastr");
+                
+                x.className = x.className.replace("show", "");
+            }
     
             document.addEventListener('DOMContentLoaded', () => {
                 const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
@@ -120,55 +126,40 @@
             </div>
         </nav>
 
-        <!-- <div id="toastr" class="notification is-danger">
-            <button class="delete"></button>
+        <div id="toastr">
+            <button class="delete" onclick="hideToastr()"></button>
             <span></span>
-        </div> -->
+        </div>
 
-        <!-- <main class="layout-maxed">
-            <% if ( page.failureFlash || (error && error.length > 0 ) ) {%>
-                <div class="columns is-mobile">
-                    <div class="
-                        column 
-                        is-10-mobile is-offset-1-mobile
-                        is-8-tablet is-offset-2-tablet
-                        is-6-desktop is-offset-3-desktop
-                        is-4-widescreen is-offset-4-widescreen
-                    ">
-                        <% if ( page.failureFlash ) {%>
-                        <article class="message is-danger">
-                            <div class="message-header">
-                                <p>Erreur</p>
-                            </div>
-                            <div class="message-body">
-                                <%= page.failureFlash %>
-                            </div>
-                        </article>
-                        <% } %>    
-                        <%
-                            if (error && error.length > 0) {
-                                for( let i = 0 ; i < error.length ; i += 1 ) {
-                        %>
-                        <article class="message is-danger">
-                            <div class="message-header">
-                                <p>Erreur</p>
-                                <button class="delete" aria-label="delete"></button>
-                            </div>
-                            <div class="message-body">
-                                <%= error %>
-                            </div>
-                        </article>
-                        <%
-                            }
-                        } 
-                        %>
+        <% if ( page.failureFlash || (error && error.length > 0 ) ) {%>
+            <div class="flash">
+                <% if ( page.failureFlash ) {%>
+                    <div class="header">
+                        Erreur
                     </div>
+                    <div class="body">
+                        <%= page.failureFlash %>
+                    </div>
+                <% } %>    
+                <%
+                    if (error && error.length > 0) {
+                        for( let i = 0 ; i < error.length ; i += 1 ) {
+                %>
+                <div class="header">
+                    Erreur
                 </div>
-            <% } %>
-        </main> -->
+                <div class="body">
+                    <%= error %>
+                </div>
+                <%
+                        }
+                    } 
+                %>
+            </div>
+        <% } %>
         
         <%- include(viewname) %>
-        
+
         <footer class="footer layout-hero">
             <p>
                 <strong title="Merci Brunus ! 😜">My Music Library</strong> par <a href="https://www.darkou.fr">Damien Broqua</a>. 
diff --git a/views/pages/home.ejs b/views/pages/home.ejs
index 7df15d2..548b129 100644
--- a/views/pages/home.ejs
+++ b/views/pages/home.ejs
@@ -1,4 +1,4 @@
-<main class="layout-maxed">
+<main class="layout-maxed home">
     <div class="header layout-hero"></div>
     <h1>
         My Music Library