Moved mobile bubbles to paddings

app/css/app_mobile.css

@@ -509,16 +509,18 @@ a.im_message_video_thumb {
   font-size: 15px;
   float: left;
   position: relative;
-  max-width: 80%;
+  margin-left: 0;
+  margin-right: 0;
+  max-width: 100%;
 }
 .im_message_out.im_content_message_wrap {
-  margin-right: 0;
+  padding-left: 60px;
-  margin-left: 80px;
+  padding-right: 0;
   float: right;
 }
 .im_message_in.im_content_message_wrap {
-  margin-right: 65px;
+  padding-left: 0;
-  margin-left: 0;
+  padding-right: 42px;
 }
 .im_message_fwd.im_content_message_wrap {
   float: none;
@@ -528,14 +530,13 @@ a.im_message_video_thumb {
 .im_history_messages_group .im_grouped .im_message_in.im_content_message_wrap,
 .im_history_messages_group .im_grouped_fwd .im_message_in.im_content_message_wrap,
 .im_history_messages_group .im_grouped_fwd_short .im_message_in.im_content_message_wrap {
-  /*margin-top: 0;*/
+  padding-left: 45px;
-  margin-left: 45px;
 }
 .im_grouped_short .im_message_out.im_message_fwd,
 .im_grouped .im_message_out.im_message_fwd,
 .im_grouped_fwd .im_message_out.im_message_fwd,
 .im_grouped_fwd_short .im_message_out.im_message_fwd {
-  margin-left: 80px;
+  padding-left: 80px;
 }
 .im_grouped_short .im_content_message_wrap,
 .im_grouped .im_content_message_wrap {
@@ -561,14 +562,14 @@ a.im_message_video_thumb {
   float: none;
   position: absolute;
   bottom: 6px;
-  right: -44px;
+  right: 0;
 }
 .im_message_date {
   font-size: 12px;
 }
 .im_message_out .im_message_meta {
   right: auto;
-  left: -60px;
+  left: 0;
 }
 
 .im_grouped_fwd .im_message_meta,

app/partials/im.html

@@ -272,7 +272,7 @@
 </div>
 
 <div class="im_page_footer">
-  <a class="im_page_footer_brand" target="_blank" href="https://github.com/zhukov/webogram">Telegram alpha</a> by izhukov &amp; toberg
+  <a class="im_page_footer_brand" target="_blank" href="https://github.com/zhukov/webogram">Telegram beta</a> by izhukov &amp; toberg
 </div>
 
 <div id="notify_sound"></div>