diff --git a/less/modules/alerts.less b/less/modules/alerts.less
index bdba643..ba82641 100644
--- a/less/modules/alerts.less
+++ b/less/modules/alerts.less
@@ -1,35 +1,15 @@
 .alert-window {
-	position:fixed;
-	width:300px;
-	z-index:10002;
-	.toaster-alert {
-		.pointer;
-	}
+	position: fixed;
+	width: 300px;
+	z-index: 10002;
+
+	right: 20px;
+	bottom: 0px;
 
 	.alert {
 		img {
-			float:left;
-			padding-right:10px;
-		}
+			float: left;
+			padding-right: 10px;
+		}	
 	}
-}
-
-.alert-left-top {
-	left:20px;
-	top:70px;
-}
-
-.alert-left-bottom {
-	left:20px;
-	bottom:20px;
-}
-
-.alert-right-top {
-	right:20px;
-	top:70px;
-}
-
-.alert-right-bottom {
-	right:20px;
-	bottom:20px;
 }
\ No newline at end of file
diff --git a/templates/alert.tpl b/templates/alert.tpl
index 8621593..f59a5a3 100644
--- a/templates/alert.tpl
+++ b/templates/alert.tpl
@@ -1,4 +1,4 @@
-<div id="{alert_id}" class="alert alert-dismissable alert-{type} clearfix">
+<div id="{alert_id}" class="alert alert-dismissable alert-{type} clearfix" component="toaster/toast">
 	<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
 
 	<!-- IF image -->
diff --git a/templates/footer.tpl b/templates/footer.tpl
index 446c761..280ea5b 100644
--- a/templates/footer.tpl
+++ b/templates/footer.tpl
@@ -13,10 +13,7 @@
 			<button type="button" class="btn btn-default next"><i class="fa fa-fw fa-angle-down"></i></button>
 		</div>
 	</div>
-	<div class="alert-window alert-left-top"></div>
-	<div class="alert-window alert-left-bottom"></div>
-	<div class="alert-window alert-right-top"></div>
-	<div class="alert-window alert-right-bottom"></div>
+	<div component="toaster/tray" class="alert-window"></div>
 
 	<script>
 		require(['forum/footer']);