Update styles

src/scss/_neat-settings.scss

@@ -1,14 +0,0 @@
-//$visual-grid: true;
-$visual-grid-color: #f00;
-$visual-grid-index: front;
-$visual-grid-opacity: .1;
-
-$max-width: 1000rem;
-
-$first-break: 490rem;
-$second-break: 700rem;
-
-$small: new-breakpoint(max-width $first-break 6);
-$medium: new-breakpoint(min-width $first-break max-width $second-break 12);
-$large: new-breakpoint(min-width $second-break 18);
-

src/scss/_settings.scss

@@ -9,6 +9,10 @@
 
   .half-page {
     @include grid-column(9 of 18);
+
+    @media(max-width: 1100px) {
+      @include grid-column(18 of 18);
+    }
   }
 
   .half-modal {
@@ -263,6 +267,11 @@
     .hold-bottom {
       bottom: 7px;
       position: absolute;
+
+      @media(max-width: 720px) {
+        right: 10px;
+        top: 310px;
+      }
     }
 
     .autosize {
@@ -272,12 +281,33 @@
 
     .tall {
       margin-top: 2.5em;
+
+      @media(max-width: 720px) {
+        margin-top: 1rem;
+      }
     }
 
     .half {
-      @include grid-column(4.5 of 9);
+      @include grid-column(4.73 of 9);
+
+      @media(max-width: 1100px) {
+        @include grid-column(9 of 18);
+      }
+
+      @media(max-width: 720px) {
+        @include grid-column(18 of 18);
+
+        &:last-of-type {
+          margin-left: 0;
+        }
+      }
+
       padding: 7px;
 
+      &:first-of-type {
+        margin-left: 0;
+      }
+
       input,
       button {
         margin-top: 7px;

src/scss/main.scss

@@ -1,6 +1,5 @@
 // Bourbon and Neat
 @import '../../node_modules/bourbon/core/bourbon';
-@import 'neat-settings';
 @import '../../node_modules/bourbon-neat/core/neat';
 
 // scss-base