diff --git a/resources/[system]/chat/html/App.js b/resources/[system]/chat/html/App.js
index 6a7b8b1..e0552ae 100644
--- a/resources/[system]/chat/html/App.js
+++ b/resources/[system]/chat/html/App.js
@@ -3,6 +3,7 @@ window.APP = {
   name: 'app',
   data() {
     return {
+      style: CONFIG.style,
       showInput: false,
       showWindow: false,
       suggestions: [],
diff --git a/resources/[system]/chat/html/config.default.js b/resources/[system]/chat/html/config.default.js
index 5715853..a517381 100644
--- a/resources/[system]/chat/html/config.default.js
+++ b/resources/[system]/chat/html/config.default.js
@@ -8,4 +8,9 @@ window.CONFIG = {
   },
   fadeTimeout: 7000,
   suggestionLimit: 5,
+  style: {
+    background: 'rgba(52, 73, 94, 0.7)',
+    width: '38%',
+    height: '240px',
+  }
 };
diff --git a/resources/[system]/chat/html/index.html b/resources/[system]/chat/html/index.html
index 8cd6659..de5ced8 100644
--- a/resources/[system]/chat/html/index.html
+++ b/resources/[system]/chat/html/index.html
@@ -21,7 +21,7 @@
   <!-- App Template -->
   <script type="text/x-template" id="app_template">
     <div id="app">
-      <div class="chat-window" :class="{ 'fadeOut animated': !showWindow }">
+      <div class="chat-window" :style="this.style" :class="{ 'fadeOut animated': !showWindow }">
         <div class="chat-messages" ref="messages">
           <message v-for="msg in messages"
                    :templates="templates"