css: starting quiz styles

app/assets/stylesheets/application.scss

@@ -14,6 +14,7 @@
 
 @import 'settings/variables';
 @import 'settings/fonts';
+@import 'settings/mixins';
 
 /*= require normalize-css/normalize */
 @import 'settings/reset';
@@ -23,5 +24,6 @@
 @import 'elements/body';
 @import 'elements/progressbar';
 @import 'elements/header';
+@import 'elements/form-question';
 
 // @import 'objects/';

app/assets/stylesheets/elements/_form-question.scss

@@ -0,0 +1,18 @@
+.form-question {
+
+  textarea {
+    display: block;
+    margin-top: 1em;
+    border: 0;
+    border-bottom: 1px solid;
+    padding: 1em 0.5em;
+    width: 100%;
+    line-height: 1.5;
+    font-size: 1em;
+    box-sizing: border-box;
+  }
+
+  div {
+    margin: $gutter 0;
+  }
+}

app/assets/stylesheets/generic/_typography.scss

@@ -1,5 +1,5 @@
 body {
-  font-family: $primary-font-face;
+  @include primary-font;
   font-size: 1em;
 }
 
@@ -9,7 +9,6 @@ h3,
 h4,
 h5,
 h6 {
+  @include heading-font;
   margin: 0 0 $gutter;
-  font-family: $heading-font-face;
-  font-weight: 100;
 }

app/assets/stylesheets/settings/_mixins.scss

@@ -0,0 +1,9 @@
+@mixin primary-font {
+  font-family: $primary-font-face;
+  font-weight: 300;
+}
+
+@mixin heading-font {
+  font-family: $heading-font-face;
+  font-weight: 100;
+}