diff --git a/input.css b/input.css
index e09b184..0dba1cb 100644
--- a/input.css
+++ b/input.css
@@ -1,175 +1,179 @@
-.ok {
-  color: #5cff56; }
-
-.warning {
-  color: #ff4b41; }
-
-.green {
-  background: #c0ffb4; }
-
-.red {
-  background: #ff7c70; }
-
-.blue {
-  background: #c1c8ff; }
-
-.orange {
-  background: #ffbf7c; }
-
-.lightblue {
-  background: #b5ffff; }
-
-.yellow {
-  background: #fffe97; }
-
-.purple {
-  background: #bfa5ff; }
-
-.pink {
-  background: #ffa6e3; }
-
-.grey {
-  background: #dcdcdc; }
-
-.darkred {
-  background: #d16059; }
-
-.darkgreen {
-  background: #77d17c; }
-
-.darkblue {
-  background: #7ba9d1; }
-
-input, select, textarea, .textarea {
-  border: 1px solid #b7b7b7; }
-
-select {
-  cursor: pointer; }
-
-progress {
-  height: 20px;
-  width: 100%;
-  min-width: 150px; }
-
-.textarea,
-textarea,
-select,
-input[type="password"],
-input[type="text"],
-input[type="datetime"],
-input[type="email"],
-input[type="date"],
-input[type="number"],
-input[type="datetime-local"] {
-  -webkit-border-radius: 2px;
-  -moz-border-radius: 2px;
-  -ms-border-radius: 2px;
-  border-radius: 2px;
-  background-clip: padding-box;
-  color: #454545;
-  background: #fff;
-  width: 100%;
-  min-width: 70px;
-  font-size: 1.0em;
-  height: 2em;
-  line-height: 2em;
-  padding: 0 10px 0 10px;
-  border: solid 1px #dcdcdc;
-  transition: background 0.3s, border 0.3s;
-  box-shadow: inset 1px 1px 4px -2px #c5c5c5; }
-
-input[type="file"] {
-  border: solid 1px #dcdcdc;
-  width: 100%;
-  color: #454545; }
-
-input[placeholder], textarea {
-  font-family: 'FontAwesome', serif; }
-
-input:invalid {
-  transition: all 0.5s;
-  border: 1px solid #b85450; }
-
-select {
-  height: 2em;
-  line-height: 2em; }
-
-.textarea {
-  overflow: auto;
-  resize: both; }
-
-textarea, .textarea {
-  min-height: 100px;
-  -moz-box-sizing: border-box;
-  -webkit-box-sizing: border-box;
-  box-sizing: border-box; }
-
-span.check input[type="checkbox"], span.radio input[type="radio"] {
-  position: relative;
-  vertical-align: middle;
-  bottom: 1px;
-  margin-right: 5px;
-  cursor: pointer; }
-
-input[type="range"] {
-  border: none;
-  width: 100%;
-  min-width: 150px;
-  cursor: pointer; }
-
-.input {
-  width: 100%;
-  min-width: 120px;
-  display: flex;
-  flex-direction: row;
-  flex-wrap: nowrap; }
-  .input button {
-    -webkit-border-bottom-left-radius: 2px;
-    border-bottom-left-radius: 2px;
-    -webkit-border-top-left-radius: 2px;
-    border-top-left-radius: 2px;
-    background-clip: padding-box;
-    -webkit-border-bottom-right-radius: 0px;
-    border-bottom-right-radius: 0px;
-    -webkit-border-top-right-radius: 0px;
-    border-top-right-radius: 0px;
-    background-clip: padding-box;
-    -moz-box-sizing: border-box;
-    -webkit-box-sizing: border-box;
-    box-sizing: border-box;
-    display: inline-block;
-    background: #fff;
-    height: 2em;
-    font-size: 1em;
-    line-height: 2em;
-    padding: 0;
-    min-width: 40px;
-    border-left: solid 1px #dcdcdc;
-    border-top: solid 1px #dcdcdc;
-    border-bottom: solid 1px #dcdcdc;
-    border-right: none;
-    position: relative;
-    vertical-align: middle;
-    flex-grow: 0;
-    flex-shrink: 0; }
-    .input button:hover {
-      background: #fff; }
-  .input i {
-    position: relative;
-    vertical-align: middle; }
-  .input input {
-    -webkit-border-bottom-left-radius: 0px;
-    border-bottom-left-radius: 0px;
-    -webkit-border-top-left-radius: 0px;
-    border-top-left-radius: 0px;
-    background-clip: padding-box;
-    -moz-box-sizing: border-box;
-    -webkit-box-sizing: border-box;
-    box-sizing: border-box;
-    font-size: 1em;
-    position: relative;
-    vertical-align: middle;
-    flex-grow: 1;
-    flex-shrink: 1; }
-
-/*# sourceMappingURL=input.css.map */
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+input, select, textarea, .textarea {
+  border: 1px solid #b7b7b7; }
+
+progress {
+  height: 20px;
+  width: 100%;
+  min-width: 150px; }
+
+.textarea,
+.tag-input,
+textarea,
+select,
+input[type="password"],
+input[type="text"],
+input[type="datetime"],
+input[type="email"],
+input[type="date"],
+input[type="number"],
+input[type="datetime-local"] {
+  box-sizing: border-box;
+  color: #454545;
+  background: #fff;
+  width: 100%;
+  height: 2rem;
+  min-width: 70px;
+  max-width: 100%;
+  padding: 7px;
+  font-size: 0.9rem;
+  border: solid 1px #dcdcdc;
+  transition: background 0.3s, border 0.3s;
+  box-shadow: inset 1px 1px 4px -2px #c5c5c5; }
+  .textarea:focus,
+  .tag-input:focus,
+  textarea:focus,
+  select:focus,
+  input[type="password"]:focus,
+  input[type="text"]:focus,
+  input[type="datetime"]:focus,
+  input[type="email"]:focus,
+  input[type="date"]:focus,
+  input[type="number"]:focus,
+  input[type="datetime-local"]:focus {
+    border-color: #0c69d6; }
+
+select {
+  cursor: pointer;
+  padding: 0 7px 0 7px;
+  /* overwrites input padding: 7px. don't know why i have to do this! */ }
+
+option {
+  line-height: 1rem; }
+
+input[type="file"] {
+  border: solid 1px #dcdcdc;
+  width: 100%;
+  max-width: 100%;
+  color: #454545;
+  padding: 10px;
+  box-sizing: border-box; }
+
+input[placeholder], textarea {
+  font-family: 'FontAwesome', serif; }
+
+input:invalid {
+  transition: all 0.5s;
+  border: 1px solid #b85450; }
+
+textarea, .textarea {
+  overflow: auto;
+  resize: both;
+  min-height: 100px;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box; }
+
+span.checkbox, span.radio {
+  -moz-user-select: none;
+  -ms-user-select: none;
+  -webkit-user-select: none;
+  user-select: none; }
+  span.checkbox label, span.radio label {
+    cursor: pointer; }
+
+span.checkbox input[type="checkbox"], span.radio input[type="radio"] {
+  position: relative;
+  vertical-align: middle;
+  bottom: 1px;
+  margin-right: 5px;
+  cursor: pointer; }
+
+input[type="range"] {
+  border: none;
+  width: 100%;
+  min-width: 150px;
+  cursor: pointer; }
+
+.input {
+  width: 100%;
+  min-width: 120px;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap; }
+  .input button {
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    display: inline-block;
+    background: #fff;
+    height: 2rem;
+    font-size: 1rem;
+    min-width: 40px;
+    border-left: solid 1px #dcdcdc;
+    border-top: solid 1px #dcdcdc;
+    border-bottom: solid 1px #dcdcdc;
+    border-right: none;
+    padding: 0;
+    position: relative;
+    vertical-align: middle;
+    flex-grow: 0;
+    flex-shrink: 0; }
+    .input button:hover {
+      background: #fff; }
+  .input i {
+    position: relative;
+    vertical-align: middle; }
+  .input input {
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    font-size: 1em;
+    position: relative;
+    vertical-align: middle;
+    flex-grow: 1;
+    flex-shrink: 1; }
+
+.dropdown {
+  position: relative;
+  display: inline-block; }
+  .dropdown:hover .content {
+    display: block; }
+  .dropdown .content {
+    display: none;
+    position: absolute;
+    z-index: 2;
+    background: #fff; }
+    .dropdown .content input {
+      display: none; }
+    .dropdown .content label {
+      display: block;
+      margin: 5px;
+      padding: 5px; }
+
+select.plain {
+  width: auto;
+  margin: 0;
+  padding: 0;
+  border: none;
+  outline: none;
+  display: inline-block;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  cursor: pointer;
+  box-shadow: none; }
+
+.tag-input input {
+  border: none;
+  padding: 0;
+  margin: 0; }
+.tag-input .tag {
+  padding: 3px;
+  font-size: 0.8rem; }
+
+/*# sourceMappingURL=input.css.map */
diff --git a/input.scss b/input.scss
index d0843a5..dfbdebd 100644
--- a/input.scss
+++ b/input.scss
@@ -66,17 +66,25 @@ input:invalid {
     border: 1px solid #b85450;
 }
 
-.textarea {
+textarea, .textarea {
     overflow: auto;
     resize: both;
-}
-
-textarea, .textarea {
     min-height: 100px;
     @include box-sizing(border-box);
 }
 
-span.check input[type="checkbox"], span.radio input[type="radio"] {
+span.checkbox, span.radio {
+    -moz-user-select: none;
+    -ms-user-select: none;
+    -webkit-user-select: none;
+    user-select: none;
+
+    label {
+        cursor: pointer;
+    }
+}
+
+span.checkbox input[type="checkbox"], span.radio input[type="radio"] {
     position: relative;
     vertical-align: middle;
     bottom: 1px;
diff --git a/styles.css b/styles.css
index eebaa06..e41dd18 100644
--- a/styles.css
+++ b/styles.css
@@ -3711,7 +3711,15 @@ textarea, .textarea {
   -webkit-box-sizing: border-box;
   box-sizing: border-box; }
 
-span.check input[type="checkbox"], span.radio input[type="radio"] {
+span.checkbox, span.radio {
+  -moz-user-select: none;
+  -ms-user-select: none;
+  -webkit-user-select: none;
+  user-select: none; }
+  span.checkbox label, span.radio label {
+    cursor: pointer; }
+
+span.checkbox input[type="checkbox"], span.radio input[type="radio"] {
   position: relative;
   vertical-align: middle;
   bottom: 1px;