diff --git a/README.md b/README.md
index f391232..58167c9 100644
--- a/README.md
+++ b/README.md
@@ -1,5 +1,5 @@
 # [Road](https://www.roadcss.com)
-A simple CSS boilerplate using road signs as design inspiration.
+A lightweight CSS framework using road signs as design inspiration.
 
 [![Codacy Badge](https://api.codacy.com/project/badge/Grade/90293ba076f04e2197b68c32bd6354e9)](https://www.codacy.com/app/kurt1288/Road?utm_source=github.com&utm_medium=referral&utm_content=kurt1288/Road&utm_campaign=Badge_Grade)
 
diff --git a/dist/road.css b/dist/road.css
index 37fe4b3..caca0c7 100644
--- a/dist/road.css
+++ b/dist/road.css
@@ -25,7 +25,8 @@ body {
   margin-bottom: 1rem;
   padding: 0 2rem;
   text-align: center;
-  text-transform: uppercase; }
+  text-transform: uppercase;
+  width: 100%; }
   .button[disabled], button[disabled], input[type="button"][disabled], input[type="reset"][disabled], input[type="submit"][disabled] {
     cursor: default;
     opacity: 0.5; }
@@ -86,6 +87,9 @@ body {
     .button.yellowgreen:focus, .button.yellowgreen:hover, button.yellowgreen:focus, button.yellowgreen:hover, input[type="button"].yellowgreen:focus, input[type="button"].yellowgreen:hover, input[type="reset"].yellowgreen:focus, input[type="reset"].yellowgreen:hover, input[type="submit"].yellowgreen:focus, input[type="submit"].yellowgreen:hover {
       background-color: #dbf000; }
 
+@media (min-width: 30rem) {
+  .button, button, input[type="button"], input[type="reset"], input[type="submit"] {
+    width: auto; } }
 code {
   background: #ededed;
   border: 0.1rem solid #006747;
diff --git a/dist/road.min.css b/dist/road.min.css
index 3634eec..c3684dd 100644
--- a/dist/road.min.css
+++ b/dist/road.min.css
@@ -1,109 +1 @@
-@import url(https://fonts.googleapis.com/css?family=Overpass:200,300,400|Overpass+Mono:300);
-html{box-sizing:border-box;font-size:10px}
-body{background:#fff;font-family:Overpass,Helventica,Arial,sans-serif;font-size:1.6rem;font-weight:200;line-height:1.6}
-.button,button,input[type=button],input[type=reset],input[type=submit]{background-color:#fff;border:.1rem #000 solid;border-radius:.4rem;box-sizing:border-box;display:inline-block;color:#000;cursor:pointer;font-size:1.9rem;font-weight:400;height:3.8rem;line-height:4rem;margin-bottom:1rem;padding:0 2rem;text-align:center;text-transform:uppercase}
-.button[disabled],button[disabled],input[type=button][disabled],input[type=reset][disabled],input[type=submit][disabled]{cursor:default;opacity:.5}
-.button[disabled]:focus,.button[disabled]:hover,button[disabled]:focus,button[disabled]:hover,input[type=button][disabled]:focus,input[type=button][disabled]:hover,input[type=reset][disabled]:focus,input[type=reset][disabled]:hover,input[type=submit][disabled]:focus,input[type=submit][disabled]:hover{border-color:#000;color:#000}
-.button:focus,.button:hover,button:focus,button:hover,input[type=button]:focus,input[type=button]:hover,input[type=reset]:focus,input[type=reset]:hover,input[type=submit]:focus,input[type=submit]:hover{border-color:gray;outline:0}
-.button.black,button.black,input[type=button].black,input[type=reset].black,input[type=submit].black{background-color:#000;color:#fff}
-.button.black:focus,.button.black:hover,button.black:focus,button.black:hover,input[type=button].black:focus,input[type=button].black:hover,input[type=reset].black:focus,input[type=reset].black:hover,input[type=submit].black:focus,input[type=submit].black:hover{background-color:#404040}
-.button.red,button.red,input[type=button].red,input[type=reset].red,input[type=submit].red{background-color:#a6192e;border-color:#a6192e;color:#fff}
-.button.red:focus,.button.red:hover,button.red:focus,button.red:hover,input[type=button].red:focus,input[type=button].red:hover,input[type=reset].red:focus,input[type=reset].red:hover,input[type=submit].red:focus,input[type=submit].red:hover{background-color:#bc1c34}
-.button.green,button.green,input[type=button].green,input[type=reset].green,input[type=submit].green{background-color:#006747;border-color:#006747;color:#fff}
-.button.green:focus,.button.green:hover,button.green:focus,button.green:hover,input[type=button].green:focus,input[type=button].green:hover,input[type=reset].green:focus,input[type=reset].green:hover,input[type=submit].green:focus,input[type=submit].green:hover{background-color:#008159}
-.button.blue,button.blue,input[type=button].blue,input[type=reset].blue,input[type=submit].blue{background-color:#002f6c;border-color:#002f6c;color:#fff}
-.button.blue:focus,.button.blue:hover,button.blue:focus,button.blue:hover,input[type=button].blue:focus,input[type=button].blue:hover,input[type=reset].blue:focus,input[type=reset].blue:hover,input[type=submit].blue:focus,input[type=submit].blue:hover{background-color:#003a86}
-.button.orange,button.orange,input[type=button].orange,input[type=reset].orange,input[type=submit].orange{background-color:#e57200;border-color:#e57200}
-.button.orange:focus,.button.orange:hover,button.orange:focus,button.orange:hover,input[type=button].orange:focus,input[type=button].orange:hover,input[type=reset].orange:focus,input[type=reset].orange:hover,input[type=submit].orange:focus,input[type=submit].orange:hover{background-color:#ff7f00}
-.button.brown,button.brown,input[type=button].brown,input[type=reset].brown,input[type=submit].brown{background-color:#693f23;border-color:#693f23;color:#fff}
-.button.brown:focus,.button.brown:hover,button.brown:focus,button.brown:hover,input[type=button].brown:focus,input[type=button].brown:hover,input[type=reset].brown:focus,input[type=reset].brown:hover,input[type=submit].brown:focus,input[type=submit].brown:hover{background-color:#7c4a29}
-.button.purple,button.purple,input[type=button].purple,input[type=reset].purple,input[type=submit].purple{background-color:#6d2077;border-color:#6d2077;color:#fff}
-.button.purple:focus,.button.purple:hover,button.purple:focus,button.purple:hover,input[type=button].purple:focus,input[type=button].purple:hover,input[type=reset].purple:focus,input[type=reset].purple:hover,input[type=submit].purple:focus,input[type=submit].purple:hover{background-color:#7f258b}
-.button.yellow,button.yellow,input[type=button].yellow,input[type=reset].yellow,input[type=submit].yellow{background-color:#ffcd00;border-color:#ffcd00}
-.button.yellow:focus,.button.yellow:hover,button.yellow:focus,button.yellow:hover,input[type=button].yellow:focus,input[type=button].yellow:hover,input[type=reset].yellow:focus,input[type=reset].yellow:hover,input[type=submit].yellow:focus,input[type=submit].yellow:hover{background-color:#f0c100}
-.button.yellowgreen,button.yellowgreen,input[type=button].yellowgreen,input[type=reset].yellowgreen,input[type=submit].yellowgreen{background-color:#c4d600;border-color:#c4d600}
-.button.yellowgreen:focus,.button.yellowgreen:hover,button.yellowgreen:focus,button.yellowgreen:hover,input[type=button].yellowgreen:focus,input[type=button].yellowgreen:hover,input[type=reset].yellowgreen:focus,input[type=reset].yellowgreen:hover,input[type=submit].yellowgreen:focus,input[type=submit].yellowgreen:hover{background-color:#dbf000}
-code{background:#ededed;border:.1rem solid #006747;border-radius:.4rem;font-family:'Overpass Mono';font-size:1.3rem;font-weight:300;margin:0 .3rem;padding:.5rem .8rem .3rem;white-space:nowrap}
-pre>code{background:#006747;border:.1rem solid #000;box-shadow:inset 0 0 0 .2rem #fff;color:#fff;display:block;overflow:auto;padding:1rem 3rem;white-space:pre}
-input[type=color],input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=month],input[type=number],input[type=password],input[type=range],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select,textarea{appearance:none;border:.1rem solid #000;border-radius:.4rem;box-sizing:border-box;box-shadow:none;height:3.8rem;width:100%;padding:.9rem 1rem .7rem;font-weight:200;margin-bottom:1.8rem}
-input[type=color]:focus,input[type=date]:focus,input[type=datetime-local]:focus,input[type=datetime]:focus,input[type=email]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=range]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=time]:focus,input[type=url]:focus,input[type=week]:focus,select:focus,textarea:focus{border-color:#006747;outline:0}
-textarea{height:auto;min-height:7rem}
-label{display:block;margin-bottom:.3rem}
-input[type=checkbox],input[type=radio]{width:1.5rem;height:1.5rem}
-input[type=checkbox]+label,input[type=radio]+label{display:inline-block;vertical-align:middle;padding-left:.3rem}
-.container{box-sizing:border-box;margin:0 auto;max-width:100rem;padding:3rem 1.5rem;position:relative;width:100%}
-.row{display:flex;flex-wrap:wrap}
-.row .column{display:block;flex:1;max-width:100%;width:100%}
-.row .column-1,.row .column-2,.row .column-25,.row .column-3,.row .column-33,.row .column-4,.row .column-5,.row .column-6,.row .column-67,.row .column-7,.row .column-75,.row .column-8,.row .column-9{max-width:100%;width:100%}
-.row .offset-1{margin-left:0}
-.row .offset-2{margin-left:0}
-.row .offset-3{margin-left:0}
-.row .offset-4{margin-left:0}
-.row .offset-5{margin-left:0}
-.row .offset-6{margin-left:0}
-.row .offset-7{margin-left:0}
-.row .offset-8{margin-left:0}
-.row .offset-9{margin-left:0}
-.row .offset-25,.row .offset-33,.row .offset-67,.row .offset-75{margin-left:0}
-.row>div{box-sizing:border-box;padding:0 .7rem}
-@media (min-width:30rem){
-.row .column-1{flex:0 0 10%;max-width:10%}
-.row .column-2{flex:0 0 20%;max-width:20%}
-.row .column-3{flex:0 0 30%;max-width:30%}
-.row .column-4{flex:0 0 40%;max-width:40%}
-.row .column-5{flex:0 0 50%;max-width:50%}
-.row .column-6{flex:0 0 60%;max-width:60%}
-.row .column-7{flex:0 0 70%;max-width:70%}
-.row .column-8{flex:0 0 80%;max-width:80%}
-.row .column-9{flex:0 0 90%;max-width:90%}
-.row .column-25{flex:0 0 25%;max-width:25%}
-.row .column-33{flex:0 0 33.3333333333%;max-width:33.3333333333%}
-.row .column-67{flex:0 0 66.6666666667%;max-width:66.6666666667%}
-.row .column-75{flex:0 0 75%;max-width:75%}
-.row .offset-1{margin-left:10%}
-.row .offset-2{margin-left:20%}
-.row .offset-3{margin-left:30%}
-.row .offset-4{margin-left:40%}
-.row .offset-5{margin-left:50%}
-.row .offset-6{margin-left:60%}
-.row .offset-7{margin-left:70%}
-.row .offset-8{margin-left:80%}
-.row .offset-9{margin-left:90%}
-.row .offset-25{margin-left:25%}
-.row .offset-33{margin-left:33.3333333333%}
-.row .offset-67{margin-left:66.6666666667%}
-.row .offset-75{margin-left:75%}
-}
-dl dd,dl dt,ol li,ul li{margin-bottom:1rem;padding-left:.4rem}
-li>ol,li>ul{margin-top:.5rem}
-table{border-collapse:collapse;border-radius:.4rem;text-align:left;width:100%}
-table th{font-size:1.9rem;font-weight:400;color:#000}
-table th:first-child{border-radius:.4rem 0 0 0}
-table th:last-child{border-radius:0 .4rem 0 0}
-table td,table th{border-bottom:.1rem solid #000;padding:1.5rem 1.2rem 1rem}
-table.black th{background-color:#000;color:#fff}
-table.red th{background-color:#a6192e;color:#fff}
-table.red td{border-color:#a6192e}
-table.green th{background-color:#006747;color:#fff}
-table.green td{border-color:#006747}
-table.blue th{background-color:#002f6c;color:#fff}
-table.blue td{border-color:#002f6c}
-table.orange th{background-color:#e57200}
-table.orange td{border-color:#e57200}
-table.brown th{background-color:#693f23;color:#fff}
-table.brown td{border-color:#693f23}
-table.purple th{background-color:#6d2077;color:#fff}
-table.purple td{border-color:#6d2077}
-table.yellow th{background-color:#ffcd00}
-table.yellowgreen th{background-color:#c4d600}
-h1,h2,h3,h4,h5,h6{font-weight:200;margin:2rem 0}
-h3,h4,h5,h6{font-weight:300}
-h1{font-size:50px;line-height:1}
-h2{font-size:39px;line-height:1.1}
-h3{font-size:30px;line-height:1.15}
-h4{font-size:25px;line-height:1.2}
-h5{font-size:21px;line-height:1.25}
-h6{font-size:19px;line-height:1.3}
-a{color:#e57200;text-decoration:none}
-a:hover{color:#00459f}
-p{margin-top:0}
\ No newline at end of file
+@import url(https://fonts.googleapis.com/css?family=Overpass:200,300,400|Overpass+Mono:300);html{box-sizing:border-box;font-size:10px}body{background:#fff;font-family:Overpass,Helventica,Arial,sans-serif;font-size:1.6rem;font-weight:200;line-height:1.6}.button,button,input[type=button],input[type=reset],input[type=submit]{background-color:#fff;border:.1rem #000 solid;border-radius:.4rem;box-sizing:border-box;display:inline-block;color:#000;cursor:pointer;font-size:1.9rem;font-weight:400;height:3.8rem;line-height:4rem;margin-bottom:1rem;padding:0 2rem;text-align:center;text-transform:uppercase;width:100%}.button[disabled],button[disabled],input[type=button][disabled],input[type=reset][disabled],input[type=submit][disabled]{cursor:default;opacity:.5}.button[disabled]:focus,.button[disabled]:hover,button[disabled]:focus,button[disabled]:hover,input[type=button][disabled]:focus,input[type=button][disabled]:hover,input[type=reset][disabled]:focus,input[type=reset][disabled]:hover,input[type=submit][disabled]:focus,input[type=submit][disabled]:hover{border-color:#000;color:#000}.button:focus,.button:hover,button:focus,button:hover,input[type=button]:focus,input[type=button]:hover,input[type=reset]:focus,input[type=reset]:hover,input[type=submit]:focus,input[type=submit]:hover{border-color:gray;outline:0}.button.black,button.black,input[type=button].black,input[type=reset].black,input[type=submit].black{background-color:#000;color:#fff}.button.black:focus,.button.black:hover,button.black:focus,button.black:hover,input[type=button].black:focus,input[type=button].black:hover,input[type=reset].black:focus,input[type=reset].black:hover,input[type=submit].black:focus,input[type=submit].black:hover{background-color:#404040}.button.red,button.red,input[type=button].red,input[type=reset].red,input[type=submit].red{background-color:#a6192e;border-color:#a6192e;color:#fff}.button.red:focus,.button.red:hover,button.red:focus,button.red:hover,input[type=button].red:focus,input[type=button].red:hover,input[type=reset].red:focus,input[type=reset].red:hover,input[type=submit].red:focus,input[type=submit].red:hover{background-color:#bc1c34}.button.green,button.green,input[type=button].green,input[type=reset].green,input[type=submit].green{background-color:#006747;border-color:#006747;color:#fff}.button.green:focus,.button.green:hover,button.green:focus,button.green:hover,input[type=button].green:focus,input[type=button].green:hover,input[type=reset].green:focus,input[type=reset].green:hover,input[type=submit].green:focus,input[type=submit].green:hover{background-color:#008159}.button.blue,button.blue,input[type=button].blue,input[type=reset].blue,input[type=submit].blue{background-color:#002f6c;border-color:#002f6c;color:#fff}.button.blue:focus,.button.blue:hover,button.blue:focus,button.blue:hover,input[type=button].blue:focus,input[type=button].blue:hover,input[type=reset].blue:focus,input[type=reset].blue:hover,input[type=submit].blue:focus,input[type=submit].blue:hover{background-color:#003a86}.button.orange,button.orange,input[type=button].orange,input[type=reset].orange,input[type=submit].orange{background-color:#e57200;border-color:#e57200}.button.orange:focus,.button.orange:hover,button.orange:focus,button.orange:hover,input[type=button].orange:focus,input[type=button].orange:hover,input[type=reset].orange:focus,input[type=reset].orange:hover,input[type=submit].orange:focus,input[type=submit].orange:hover{background-color:#ff7f00}.button.brown,button.brown,input[type=button].brown,input[type=reset].brown,input[type=submit].brown{background-color:#693f23;border-color:#693f23;color:#fff}.button.brown:focus,.button.brown:hover,button.brown:focus,button.brown:hover,input[type=button].brown:focus,input[type=button].brown:hover,input[type=reset].brown:focus,input[type=reset].brown:hover,input[type=submit].brown:focus,input[type=submit].brown:hover{background-color:#7c4a29}.button.purple,button.purple,input[type=button].purple,input[type=reset].purple,input[type=submit].purple{background-color:#6d2077;border-color:#6d2077;color:#fff}.button.purple:focus,.button.purple:hover,button.purple:focus,button.purple:hover,input[type=button].purple:focus,input[type=button].purple:hover,input[type=reset].purple:focus,input[type=reset].purple:hover,input[type=submit].purple:focus,input[type=submit].purple:hover{background-color:#7f258b}.button.yellow,button.yellow,input[type=button].yellow,input[type=reset].yellow,input[type=submit].yellow{background-color:#ffcd00;border-color:#ffcd00}.button.yellow:focus,.button.yellow:hover,button.yellow:focus,button.yellow:hover,input[type=button].yellow:focus,input[type=button].yellow:hover,input[type=reset].yellow:focus,input[type=reset].yellow:hover,input[type=submit].yellow:focus,input[type=submit].yellow:hover{background-color:#f0c100}.button.yellowgreen,button.yellowgreen,input[type=button].yellowgreen,input[type=reset].yellowgreen,input[type=submit].yellowgreen{background-color:#c4d600;border-color:#c4d600}.button.yellowgreen:focus,.button.yellowgreen:hover,button.yellowgreen:focus,button.yellowgreen:hover,input[type=button].yellowgreen:focus,input[type=button].yellowgreen:hover,input[type=reset].yellowgreen:focus,input[type=reset].yellowgreen:hover,input[type=submit].yellowgreen:focus,input[type=submit].yellowgreen:hover{background-color:#dbf000}@media (min-width:30rem){.button,button,input[type=button],input[type=reset],input[type=submit]{width:auto}}code{background:#ededed;border:.1rem solid #006747;border-radius:.4rem;font-family:'Overpass Mono';font-size:1.3rem;font-weight:300;margin:0 .3rem;padding:.5rem .8rem .3rem;white-space:nowrap}pre>code{background:#006747;border:.1rem solid #000;box-shadow:inset 0 0 0 .2rem #fff;color:#fff;display:block;overflow:auto;padding:1rem 3rem;white-space:pre}input[type=color],input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=month],input[type=number],input[type=password],input[type=range],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select,textarea{appearance:none;border:.1rem solid #000;border-radius:.4rem;box-sizing:border-box;box-shadow:none;height:3.8rem;width:100%;padding:.9rem 1rem .7rem;font-weight:200;margin-bottom:1.8rem}input[type=color]:focus,input[type=date]:focus,input[type=datetime-local]:focus,input[type=datetime]:focus,input[type=email]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=range]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=time]:focus,input[type=url]:focus,input[type=week]:focus,select:focus,textarea:focus{border-color:#006747;outline:0}textarea{height:auto;min-height:7rem}label{display:block;margin-bottom:.3rem}input[type=checkbox],input[type=radio]{width:1.5rem;height:1.5rem}input[type=checkbox]+label,input[type=radio]+label{display:inline-block;vertical-align:middle;padding-left:.3rem}.container{box-sizing:border-box;margin:0 auto;max-width:100rem;padding:3rem 1.5rem;position:relative;width:100%}.row{display:flex;flex-wrap:wrap}.row .column{display:block;flex:1;max-width:100%;width:100%}.row .column-1,.row .column-2,.row .column-25,.row .column-3,.row .column-33,.row .column-4,.row .column-5,.row .column-6,.row .column-67,.row .column-7,.row .column-75,.row .column-8,.row .column-9{max-width:100%;width:100%}.row .offset-1{margin-left:0}.row .offset-2{margin-left:0}.row .offset-3{margin-left:0}.row .offset-4{margin-left:0}.row .offset-5{margin-left:0}.row .offset-6{margin-left:0}.row .offset-7{margin-left:0}.row .offset-8{margin-left:0}.row .offset-9{margin-left:0}.row .offset-25,.row .offset-33,.row .offset-67,.row .offset-75{margin-left:0}.row>div{box-sizing:border-box;padding:0 .7rem}@media (min-width:30rem){.row .column-1{flex:0 0 10%;max-width:10%}.row .column-2{flex:0 0 20%;max-width:20%}.row .column-3{flex:0 0 30%;max-width:30%}.row .column-4{flex:0 0 40%;max-width:40%}.row .column-5{flex:0 0 50%;max-width:50%}.row .column-6{flex:0 0 60%;max-width:60%}.row .column-7{flex:0 0 70%;max-width:70%}.row .column-8{flex:0 0 80%;max-width:80%}.row .column-9{flex:0 0 90%;max-width:90%}.row .column-25{flex:0 0 25%;max-width:25%}.row .column-33{flex:0 0 33.3333333333%;max-width:33.3333333333%}.row .column-67{flex:0 0 66.6666666667%;max-width:66.6666666667%}.row .column-75{flex:0 0 75%;max-width:75%}.row .offset-1{margin-left:10%}.row .offset-2{margin-left:20%}.row .offset-3{margin-left:30%}.row .offset-4{margin-left:40%}.row .offset-5{margin-left:50%}.row .offset-6{margin-left:60%}.row .offset-7{margin-left:70%}.row .offset-8{margin-left:80%}.row .offset-9{margin-left:90%}.row .offset-25{margin-left:25%}.row .offset-33{margin-left:33.3333333333%}.row .offset-67{margin-left:66.6666666667%}.row .offset-75{margin-left:75%}}dl dd,dl dt,ol li,ul li{margin-bottom:1rem;padding-left:.4rem}li>ol,li>ul{margin-top:.5rem}table{border-collapse:collapse;border-radius:.4rem;text-align:left;width:100%}table th{font-size:1.9rem;font-weight:400;color:#000}table th:first-child{border-radius:.4rem 0 0 0}table th:last-child{border-radius:0 .4rem 0 0}table td,table th{border-bottom:.1rem solid #000;padding:1.5rem 1.2rem 1rem}table.black th{background-color:#000;color:#fff}table.red th{background-color:#a6192e;color:#fff}table.red td{border-color:#a6192e}table.green th{background-color:#006747;color:#fff}table.green td{border-color:#006747}table.blue th{background-color:#002f6c;color:#fff}table.blue td{border-color:#002f6c}table.orange th{background-color:#e57200}table.orange td{border-color:#e57200}table.brown th{background-color:#693f23;color:#fff}table.brown td{border-color:#693f23}table.purple th{background-color:#6d2077;color:#fff}table.purple td{border-color:#6d2077}table.yellow th{background-color:#ffcd00}table.yellowgreen th{background-color:#c4d600}h1,h2,h3,h4,h5,h6{font-weight:200;margin:2rem 0}h3,h4,h5,h6{font-weight:300}h1{font-size:50px;line-height:1}h2{font-size:39px;line-height:1.1}h3{font-size:30px;line-height:1.15}h4{font-size:25px;line-height:1.2}h5{font-size:21px;line-height:1.25}h6{font-size:19px;line-height:1.3}a{color:#e57200;text-decoration:none}a:hover{color:#00459f}p{margin-top:0}
\ No newline at end of file
diff --git a/src/_buttons.scss b/src/_buttons.scss
index bce53a7..99c61d0 100644
--- a/src/_buttons.scss
+++ b/src/_buttons.scss
@@ -14,6 +14,7 @@
     padding: 0 2rem;
     text-align: center;
     text-transform: uppercase;
+    width: 100%;
 
     &[disabled] {
         cursor: default;
@@ -115,4 +116,11 @@
             background-color: lighten($yellowgreen, 5%);
         }
     }
+}
+
+// This applies from 30rem (default 300px) and higher
+@media (min-width: 30rem) {
+    .button, button, input[type="button"], input[type="reset"], input[type="submit"] {
+        width: auto;
+    }
 }
\ No newline at end of file