Resoved a couple cross-browser compatibility issues.

messages2.html

@@ -10,7 +10,7 @@
   /* ball styling */
   .message {
     display: block;
-    width: 462px;
+    width: 467px;
     margin: 0;
     color: white;
     position: absolute;
@@ -25,16 +25,16 @@
   /* animation keyframes */
   @-webkit-keyframes moveX {
     /* screen width - width of message */
-    from { left: 0; } to { left: calc(100% - 460px); }
+    from { left: 0; } to { left: calc(100% - 467px); }
   }
   @-moz-keyframes moveX {
-    from { left: 0; } to { left: calc(100% - 460px); }
+    from { left: 0; } to { left: calc(100% - 467px); }
   }
   @-o-keyframes moveX {
-    from { left: 0; } to { left: calc(100% - 460px); }
+    from { left: 0; } to { left: calc(100% - 467px); }
   }
   @keyframes moveX {
-    from { left: 0; } to { left: calc(100% - 460px); }
+    from { left: 0; } to { left: calc(100% - 467px); }
   }
   @-webkit-keyframes moveY {
     from { top: 0; } to { top: calc(100% - 26px); }