1 files changed, 24 insertions, 28 deletions
diff --git a/Swift/resources/themes/Default/main.css b/Swift/resources/themes/Default/main.css
index d759ced..c5cc977 100644
--- a/Swift/resources/themes/Default/main.css
+++ b/Swift/resources/themes/Default/main.css
@@ -1,242 +1,238 @@
 /* Chat Window Container */
 
 body {
     font-family: 'Lato', sans-serif;
     margin: 0;
     padding: 0;
 }
 
 /* This turns the insert marker element into a vertical fill.
  * This way the colored side bar is expanded to the full height of the view. */
 #insert {
     display: table-row;
     height: 100%;
 }
 
 .container {
     height: 100%;
     width:  100%;
     background-color: #fff;
-    /*border: solid 1px #595959; /* REMOVE THIS LINE. FOR DISPLAY PURPOSE ONLY. */
-    /*margin-left: 20%; /* REMOVE THIS LINE. FOR DISPLAY PURPOSE ONLY. */
-    /*margin-top: 75px; /* REMOVE THIS LINE. FOR DISPLAY PURPOSE ONLY. */
     position: absolute;
-  display: table;
+    display: table;
 }
 /* Holds all user and message content */
 
 .message-block {
     display: table;
     border: 0px solid black;
     border-spacing: 0;
     height: 100%;
     width: 100%;
     z-index: 10;
     top: 0;
     left: 0;
     overflow-wrap: break-word; /* Allow breaking of long words (e.g. URLs) to prevent overflow. */
-    /*margin-top: -2px; /* REMOVE THIS LINE. FOR DISPLAY PURPOSE ONLY. */
 }
 
 /* Individual message */
 
 .message {
     display: table-row;
     border: inherit;
     width: 100%;
     margin-top: 10px;
     border-top: 0.2em solid transparent;
 }
 
 .additional {
     margin-top: -12px;
 }
 
 .unread {
     height: 30px;
     display: table-row;
     border: inherit;
     /*width: 100%;*/
     margin-top: -6px;
     margin-bottom: -15px;
     margin-left: 190px;
     margin-right: 20px;
     text-align: right;
 }
 
 .unread p {
     margin-top: 0px;
     font-size: 75%;
     text-transform: uppercase;
     color: #ffd180;
     border-top: solid 1px #ffd180;
     margin-left: 20px;
     margin-right: 20px;
 }
 
 /* Left column content */
 
 :not(.additional) > .user {
-    height: 32px;
+    height: 2.5em;
 }
 
 .user {
     display: table-cell;
     border: inherit;
     text-align: center;
     margin-top: 2px;
     width: 175px;
     max-width: 175px;
     min-width: 175px;
     background-color: #595959;
 }
 
 .time {
-    height: 32px;
+    height: 2.5em;
     width: 103px;
     float: left;
     text-align: right;
 }
 
 .time p {
     margin-top: 3px;
     margin-bottom: 1px;
     margin-right: 10px;
     color: #f9f9f9;
     font-size: 80%;
     font-weight: 300;
 }
 
 .time-additional {
     width: 103px;
     float: left;
     text-align: right;
 }
 
 .time-additional p {
     margin-top: 0px;
     margin-bottom: 1px;
     margin-right: 10px;
     color: #f9f9f9;
     font-size: 80%;
     font-weight: 300;
 }
 
 .time img {
     margin-right: 10px;
     height: 10px;
 }
 
 .time-additional img {
     margin-right: 10px;
     height: 10px;
 }
 
 .myavatar {
-    height: 32px;
-    width: 32px;
+    height: 2.5em;
+    width: 2.5em;
     display: inline-block;
-    margin:0 auto;
+    margin: 0 auto;
     background-color: #92c47e;
     border-top-left-radius: 50%;
     border-bottom-left-radius: 50%;
 }
 
 .otheravatar {
-    height: 32px;
-    width: 32px;
+    height: 2.5em;
+    width: 2.5em;
     display: inline-block;
-    margin:0 auto;
+    margin: 0 auto;
     background-color: #6eb6ce;
     border-top-left-radius: 50%;
     border-bottom-left-radius: 50%;
 }
 
 .myavatar img {
     border-radius: 50%;
-    height: 32px;
+    height: 2.5em;
     position: relative;
     left: -1px;
 }
 
 .otheravatar img {
     border-radius: 50%;
-    height: 32px;
+    height: 2.5em;
     position: relative;
     left: -1px;
 }
 
 .myright {
-    float:right;
-    width:40px;
-    height: 32px;
+    float: right;
+    width: 1.65em;
+    height: 2.5em;
     background: #92c47e;
 }
 
 .otherright {
-    float:right;
-    width:40px;
-    height: 32px;
+    float: right;
+    width: 1.65em;
+    height: 2.5em;
     background: #6eb6ce;
 }
 
 :not(.additional) > div > .systemavatar {
-    height: 32px;
+    height: 2.5em;
 }
 
 .systemavatar {
-    width: 32px;
+    width: 2.5em;
     display: inline-block;
-    margin:0 auto;
+    margin: 0 auto;
     background-color: #595959;
     border-top-left-radius: 50%;
     border-bottom-left-radius: 50%;
 }
 
 :not(.additional) > div > .systemright {
-    height: 32px;
+    height: 2.5em;
 }
 
 .systemright {
-    float:right;
-    width: 40px;
+    float: right;
+    width: 1.65em;
     background: #595959;
 }
 
 /* Right column content */
 .message:not(.additional) {
     border-top: 1.2em solid transparent; /* Workaround for table rows not having a padding. */
 }
 
 .message:not(.additional) .text {
-    min-height: 32px;
+    min-height: 2.5em;
 }
 
 .text {
     display: table-cell;
     border: inherit;
     margin-left: 175px;
     color: #595959;
     vertical-align: top;
 
     /* Break long URLs at any point. */
     word-break: break-word;
     word-wrap: break-word;
     hyphens: auto;
 }
 
 .username {
     margin-left: 20px;
     font-weight: 700;
     margin-top: 0px;
     margin-bottom: 0.2em;
 }
 
 .myusername {
     color: #92c47e;
 }
 
 .otherusername {
     color: #6eb6ce;
 }