first load

styles/_forms.scss

@@ -0,0 +1,109 @@
+/***** Forms *****/
+
+.form {
+  max-width: 650px;
+}
+
+.form-field ~ .form-field {
+  margin-top: 25px;
+}
+
+.form-field label {
+  display: block;
+  font-size: $font-size-small;
+  margin-bottom: 5px;
+}
+
+.form-field input {
+  border: 1px solid $high-contrast-border-color;
+  border-radius: 4px;
+  padding: 10px;
+  width: 100%;
+
+  &:focus { border: 1px solid $brand_color; }
+}
+
+.form-field input[type="text"] {
+  border: 1px solid $high-contrast-border-color;
+  border-radius: 4px;
+
+  &:focus { border: 1px solid $brand_color; }
+}
+
+.form-field input[type="checkbox"] {
+  width: auto;
+}
+
+// Select box
+.form-field .nesty-input {
+  border-radius: 4px;
+  border: 1px solid $high-contrast-border-color;
+  height: 40px;
+  line-height: 40px;
+  outline: none;
+  vertical-align: middle;
+
+  &:focus {
+    border: 1px solid $brand_color;
+    text-decoration: none;
+  }
+}
+
+.form-field .hc-multiselect {
+  &-toggle {
+    border: 1px solid $high-contrast-border-color;
+  }
+}
+
+.form-field .hc-multiselect-toggle:focus {
+  outline: none;
+  border: 1px solid $brand_color;
+  text-decoration: none;
+}
+
+.form-field textarea {
+  vertical-align: middle;
+}
+
+.form-field input[type="checkbox"] + label {
+  margin: 0 0 0 10px;
+}
+
+.form-field .optional {
+  color: $secondary-text-color;
+  margin-left: 4px;
+}
+
+.form-field p {
+  color: $secondary-text-color;
+  font-size: 12px;
+  margin: 5px 0;
+}
+
+.form footer {
+  margin-top: 40px;
+  padding-top: 30px;
+}
+
+.form footer a {
+  color: $secondary-text-color;
+  cursor: pointer;
+  margin-right: 15px;
+}
+
+.form .suggestion-list {
+  font-size: $font-size-small;
+  margin-top: 30px;
+
+  label {
+    border-bottom: 1px solid $low-contrast-border-color;
+    display: block;
+    padding-bottom: 5px;
+  }
+
+  li {
+    padding: 10px 0;
+
+    a:visited { color: $visited_link_color; }
+  }
+}