Move back button to the left

// FREEBIE

background.html

@@ -5,7 +5,7 @@
   <script type='text/x-tmpl-mustache' id='two-column'>
     <div class='gutter'>
         <div class='title-bar active' id='header'>
-          <div class='header-buttons'>
+          <div class='header-buttons right'>
             <div class='vertical-align'>
               <div class='global-menu menu'>
                 <button class='hamburger'></button>
@@ -44,9 +44,13 @@
   <script type='text/x-tmpl-mustache' id='conversation'>
     <div class='conversation-header'
         style='background-color: {{ avatar.color }}'>
-        <div class='header-buttons'>
+        <div class='header-buttons left'>
           <div class='vertical-align'>
             <button class='back hide'></button>
+          </div>
+        </div>
+        <div class='header-buttons right'>
+          <div class='vertical-align'>
             <div class='conversation-menu menu'>
               <button class='hamburger'></button>
               <ul class='menu-list'>

stylesheets/_global.scss

@@ -79,7 +79,12 @@ button.back {
 }
 
 .header-buttons {
-  float: right;
+  &.left {
+    float: left;
+  }
+  &.right {
+    float: right;
+  }
   height: 0;
 
   .vertical-align {

stylesheets/manifest.css

@@ -77,8 +77,11 @@ button.back {
   border-radius: 10px; }
 
 .header-buttons {
-  float: right;
   height: 0; }
+  .header-buttons.left {
+    float: left; }
+  .header-buttons.right {
+    float: right; }
   .header-buttons .vertical-align {
     height: 64px;
     vertical-align: middle;