Fixes and Design Improvements

res/css/main.css

@@ -84,16 +84,19 @@ body {
   box-shadow: 0px 0px 2px 2px #cecece;
   display: inline-block;
   margin: 16px;
-  float: left; }
+  float: left;
+  height: auto; }
 
 .input {
   width: 100%;
   resize: none;
   border: 0px;
-  height: 100px;
+  height: auto;
+  min-height: 100px;
   font-family: "Roboto", sans-serif;
   font-size: 16px;
-  padding: 20px; }
+  padding: 20px;
+  clear: both; }
 
 .carddivider {
   width: 100%; }

res/css/main.sass

@@ -21,6 +21,12 @@ $card-padding: 20px
     -ms-box-shadow: $horizontal $vertical $blur $spread $color
     box-shadow: $horizontal $vertical $blur $spread $color
 
+=hyphens($value)
+    -moz-hyphens: $value
+    -ms-hyphens: $value
+    -webkit-hyphens: $value
+    hyphens: $value
+
 body
     font-family: $font-stack
     background: $body-color
@@ -101,15 +107,18 @@ body
     display: inline-block
     margin: 16px
     float: left
+    height: auto
 
 .input
     width: 100%
     resize: none
     border: 0px
-    height: 100px
+    height: auto
+    min-height: 100px
     font-family: $font-stack
     font-size: 16px
     padding: $card-padding
+    clear: both
 
 .carddivider
     @extend .drawerdivider
@@ -140,10 +149,7 @@ body
     z-index: 30
 
 #output
-    -moz-hyphens: auto
-    -ms-hyphens: auto
-    -webkit-hyphens: auto
-    hyphens: auto
+    +hyphens(auto)
     word-wrap: break-word