diff --git a/website/public/css/avatar.styl b/website/public/css/avatar.styl
index 13bd58246d..4f74c086b4 100644
--- a/website/public/css/avatar.styl
+++ b/website/public/css/avatar.styl
@@ -11,11 +11,22 @@ future re: pets and whatnot, this is just temporary.
 
 // see http://stackoverflow.com/questions/24166568/set-bootstrap-modal-body-height-by-percentage
 .profile-modal
-  .modal-dialog,.modal-content
-    height: 96%
+  .modal-dialog
+    height: 100%
+    width: auto
+    max-width: 920px
+    margin: 0 auto
+    padding: 10px
+    @media screen and (min-width:768px)
+      padding: 30px 10px
+  .modal-content
+    height: 100%
   .modal-body
-    max-height: calc(100% - 150px) //100% = dialog height, 150px = header + footer
+    max-height: calc(100% - 137px) // 100% = dialog height, 150px = header (70px) + footer (67px)
     overflow-y: scroll
+  .modal-footer
+    margin: 0
+    padding: 16px 20px
 
 .herobox
   // Base styles