diff --git a/src/client/css/main.less b/src/client/css/main.less
index f3b129f8..a34b6007 100644
--- a/src/client/css/main.less
+++ b/src/client/css/main.less
@@ -206,6 +206,14 @@ body {
 	color: @qualityLegendary;
 }
 
+.chat-style-white {
+	color: @white !important;
+}
+
+.chat-style-cyan {
+	color: @blueA !important;
+}
+
 .color-red {
 	color: @redB !important;
 }
diff --git a/src/client/ui/templates/messages/messages.js b/src/client/ui/templates/messages/messages.js
index 5544822d..cf5118e9 100644
--- a/src/client/ui/templates/messages/messages.js
+++ b/src/client/ui/templates/messages/messages.js
@@ -245,9 +245,9 @@ define([
 					const isChannel = m?.subType === 'custom';
 					if (isChannel) {
 						if (this.find('.filter[filter="' + m.channel + '"]').hasClass('active'))
-							el.show();
+							el.css({ display: 'flex' });
 						else
-							el.hide();
+							el.css({ display: 'none' });
 					}
 
 					if (isMobile && ['loot', 'info'].indexOf(m.type) !== -1) {
diff --git a/src/client/ui/templates/messages/styles.less b/src/client/ui/templates/messages/styles.less
index 96818e44..fcb73679 100644
--- a/src/client/ui/templates/messages/styles.less
+++ b/src/client/ui/templates/messages/styles.less
@@ -53,6 +53,7 @@
 
 		.list-message {
 			display: none;
+			justify-content: row;
 			width: 100%;
 			padding: 5px 10px;
 			color: white;
@@ -111,19 +112,26 @@
 		}
 
 		&.rep .rep {
-			display: block;
+			display: flex;
 		}
 
 		&.chat .chat {
-			display: block;
+			display: flex;
 		}
 
 		&.info .info {
-			display: block;
+			display: flex;
 		}
 
 		&.loot .loot {
-			display: block;
+			display: flex;
+		}
+
+		.emojiTag {
+			width: 24px;
+			height: 24px;
+			margin-top: -4px;
+			margin-right: 5px;
 		}
 
 	}