get a little responsive in our css [ci skip]

app/assets/stylesheets/new_styles/_base.scss

@@ -1,5 +1,6 @@
 body {
   background-image : image_url("pattern.png");
+  padding : none !important;
 }
 
 /* new link color */

app/assets/stylesheets/new_styles/_canvas.scss

@@ -1,7 +1,5 @@
 @mixin wide() {
   width : $two-column-width + px;
-  min-width : $two-column-width + px;
-  max-width : $two-column-width + px;
 }
 .no-post-message {
   text-align: center;
@@ -14,6 +12,8 @@
   margin : 10px;
   margin-bottom : 18px;
 
+  max-width : 100%;
+
   /* expand / contract cursor declarations */
   &.x2 .content {
     cursor : nw-resize;
@@ -57,8 +57,7 @@
     background-color : #fff;
 
     width : $column-width + px;
-    min-width : $column-width + px;
-    max-width : $column-width + px;
+    max-width : 100%;
 
     overflow : hidden;
 
@@ -338,3 +337,23 @@
     }
   }
 }
+
+/* canvas responsive */
+@media (max-width: 767px) {
+  body {
+    padding : 0;
+  }
+
+  .canvas-frame {
+    width : 100%;
+    margin-left : 0;
+    margin-right : 0;
+
+    margin-bottom : 10px;
+
+    .content {
+      margin : 0 20px;
+      width : auto !important;
+    }
+  }
+}

app/assets/stylesheets/new_styles/_profile.scss

@@ -210,4 +210,25 @@
     width : $two-column-width + px;
     text-align : center;
   }
+}
+
+/* canvas responsive */
+@media (max-width: 767px) {
+  .profile-image-container {
+    height : 100px;
+    width : 100px;
+    border-width : 2px;
+  }
+
+  #profile-controls {
+    display : none;
+  }
+
+  #profile-header {
+    padding-bottom : 20px;
+  }
+
+  #wallpaper-upload {
+    display : none;
+  }
 }