diff --git a/luckydiamond/src/assets/css/ComponentsStyles/notification.css b/luckydiamond/src/assets/css/ComponentsStyles/notification.css
new file mode 100644
index 0000000..14d8dfb
--- /dev/null
+++ b/luckydiamond/src/assets/css/ComponentsStyles/notification.css
@@ -0,0 +1,24 @@
+.notification {
+ position: absolute;
+ top: 0%;
+ left: 34%;
+ background: #000;
+ width: 20%;
+ height: 5%;
+ z-index: 1000;
+}
+
+.notification__content {
+ margin-top: 10px;
+ display: flex;
+ justify-content: center;
+}
+
+.fade-enter-active, .fade-leave-active {
+ opacity: 0;
+ transform: translateY(20px);
+}
+.fade-enter, .fade-leave-to {
+ opacity: 1;
+ transform: translateY(100px);
+}
\ No newline at end of file
diff --git a/luckydiamond/src/components/AsidebarComponent.vue b/luckydiamond/src/components/AsidebarComponent.vue
index ba344e0..7794291 100644
--- a/luckydiamond/src/components/AsidebarComponent.vue
+++ b/luckydiamond/src/components/AsidebarComponent.vue
@@ -17,14 +17,17 @@
+
+
+
\ No newline at end of file