diff --git a/stylesheets/_conversation.scss b/stylesheets/_conversation.scss
index 937ce701f2..230780c234 100644
--- a/stylesheets/_conversation.scss
+++ b/stylesheets/_conversation.scss
@@ -239,6 +239,7 @@
 
 
   li {
+    max-width: 800px;
     margin: 0 8px 16px;
 
     &::after {
@@ -256,12 +257,16 @@
     left: -2px;
     display: inline-block;
     vertical-align: top;
-    max-width: calc(100% - 20px - 2 * 22px);
     padding: 9px 12px;
     border-radius: 10px;
     box-shadow: 0 3px 3px -4px black;
     word-wrap: break-word;
     margin-left: 8px;
+    max-width: 30em;
+
+    @media(max-width:950px) {
+      max-width: calc(100% - 45px); // avatar size + padding
+    }
 
     .content {
       -webkit-user-select: text;
@@ -294,6 +299,9 @@
   }
 
   .incoming {
+    .avatar, .bubble {
+      float: left;
+    }
     .bubble {
       color: $grey_d;
       background-color: $grey_l;
diff --git a/stylesheets/_global.scss b/stylesheets/_global.scss
index f00ef74ddc..65b51a527a 100644
--- a/stylesheets/_global.scss
+++ b/stylesheets/_global.scss
@@ -30,6 +30,7 @@ body {
 }
 
 #header {
+  max-width: 1300px;
   position: fixed;
   top: 1px;
   width: calc(100% - 2px);
diff --git a/stylesheets/_index.scss b/stylesheets/_index.scss
index 4d6a0322ed..ce1944bee2 100644
--- a/stylesheets/_index.scss
+++ b/stylesheets/_index.scss
@@ -67,12 +67,19 @@
 .conversation-header {
   border-bottom: solid 1px darken($grey_l, 10%);
   margin-bottom: 4px;
+  padding-bottom: 5px;
   .avatar {
     float: left;
-    width: 70px;
-    height: 70px;
-    line-height: 70px;
-    font-size: x-large;
+    width: 36px;
+    height: 36px;
+    line-height: 36px;
+  }
+  @media(min-width:950px) {
+    .avatar {
+      width: 70px;
+      height: 70px;
+      line-height: 70px;
+    }
   }
 }
 .menu.conversation-menu {
@@ -146,6 +153,8 @@ input.search {
 }
 
 .index {
+  max-width: 1300px;
+  margin: auto;
   color: $grey_d;
   background: linear-gradient(rgba(46,172,224,1.0) 50%, rgba(160,228,208,1.0) 100%);
 
diff --git a/stylesheets/manifest.css b/stylesheets/manifest.css
index 3088a05731..77fa78339e 100644
--- a/stylesheets/manifest.css
+++ b/stylesheets/manifest.css
@@ -39,6 +39,7 @@ body {
   display: none; }
 
 #header {
+  max-width: 1300px;
   position: fixed;
   top: 1px;
   width: calc(100% - 2px);
@@ -467,13 +468,18 @@ img.emoji {
 
 .conversation-header {
   border-bottom: solid 1px #d9d9d9;
-  margin-bottom: 4px; }
+  margin-bottom: 4px;
+  padding-bottom: 5px; }
   .conversation-header .avatar {
     float: left;
-    width: 70px;
-    height: 70px;
-    line-height: 70px;
-    font-size: x-large; }
+    width: 36px;
+    height: 36px;
+    line-height: 36px; }
+  @media (min-width: 950px) {
+    .conversation-header .avatar {
+      width: 70px;
+      height: 70px;
+      line-height: 70px; } }
 
 .menu.conversation-menu button.drop-down {
   background: url("/images/arrow_drop_down.png") no-repeat center; }
@@ -527,6 +533,8 @@ input.search {
     padding-right: 8px; }
 
 .index {
+  max-width: 1300px;
+  margin: auto;
   color: #454545;
   background: linear-gradient(#2eace0 50%, #a0e4d0 100%); }
   .index .gutter .new-group-update-form {
@@ -727,6 +735,7 @@ input.search {
   list-style: none; }
   .message-detail li,
   .message-list li {
+    max-width: 800px;
     margin: 0 8px 16px; }
     .message-detail li::after,
     .message-list li::after {
@@ -742,12 +751,16 @@ input.search {
     left: -2px;
     display: inline-block;
     vertical-align: top;
-    max-width: calc(100% - 20px - 2 * 22px);
     padding: 9px 12px;
     border-radius: 10px;
     box-shadow: 0 3px 3px -4px black;
     word-wrap: break-word;
-    margin-left: 8px; }
+    margin-left: 8px;
+    max-width: 30em; }
+    @media (max-width: 950px) {
+      .message-detail .bubble,
+      .message-list .bubble {
+        max-width: calc(100% - 45px); } }
     .message-detail .bubble .content,
     .message-list .bubble .content {
       -webkit-user-select: text;
@@ -770,6 +783,10 @@ input.search {
   .message-list .outgoing .error.bubble {
     padding-left: 40px;
     background-position: 12px 9px; }
+  .message-detail .incoming .avatar, .message-detail .incoming .bubble,
+  .message-list .incoming .avatar,
+  .message-list .incoming .bubble {
+    float: left; }
   .message-detail .incoming .bubble,
   .message-list .incoming .bubble {
     color: #454545;