meh

source/assets/css/_imports.scss

@@ -2,3 +2,39 @@
 @import "fontawesome/css/font-awesome";
 
 // @import "compass";
+
+
+/*  Fonts  */
+@font-face {
+    font-family: 'lato_regular';
+    src: url('/assets/fonts/lato-regular.eot');
+    src: url('/assets/fonts/lato-regular.eot?#iefix') format('embedded-opentype'),
+         url('/assets/fonts/lato-regular.woff') format('woff'),
+         url('/assets/fonts/lato-regular.ttf') format('truetype'),
+         url('/assets/fonts/lato-regular.svg#LatoRegular') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'lato_bold';
+    src: url('/assets/fonts/lato-bold.eot');
+    src: url('/assets/fonts/lato-bold.eot?#iefix') format('embedded-opentype'),
+         url('/assets/fonts/lato-bold.woff') format('woff'),
+         url('/assets/fonts/lato-bold.ttf') format('truetype'),
+         url('/assets/fonts/lato-bold.svg#LatoBold') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'avantgardelt-extralight';
+    src: url('/assets/fonts/avantgardelt-extralight.eot');
+    src: url('/assets/fonts/avantgardelt-extralight.eot?#iefix') format('embedded-opentype'),
+         url('/assets/fonts/avantgardelt-extralight.woff') format('woff'),
+         url('/assets/fonts/avantgardelt-extralight.ttf') format('truetype'),
+         url('/assets/fonts/avantgardelt-extralight.svg#avantgardelt-extralight') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+

source/assets/css/_settings.scss

@@ -3,5 +3,20 @@
   like colors for instance
 */
 
-$backgroundColor: #fff;
-$textColor: #000;
+$bg_color: #fff;
+$main_color: #000;
+
+$header_bgcolor: #fff;
+$header_color: #000;
+
+$dark: #262626;
+$grey: #575757;
+
+$offwhite: #F7F7F7;
+
+/*rusty*/
+$accent_color: #FF9A00;
+
+
+$main_font: "lato-regular", arial;
+$accent_font: "lato-regular", arial;

source/assets/css/all.scss

@@ -3,8 +3,73 @@
 @import "settings";
 @import "imports";
 
+// div {border: 1px dashed orange;}
 
 body {
-  background: $backgroundColor;
-  color: $textColor;
-}
+  background: $offwhite url(/assets/img/bg/subtle_white_feathers.png);
+  color: $dark;
+  font-family: $main_font;
+}
+
+header{
+  background: $dark;
+  color: $offwhite;
+	width: 100%;
+	height: auto;
+  position: relative;
+}
+
+header nav{
+  overflow: hidden;
+  display: inline-block;
+  margin: 10px 0 0 0;
+  padding: 13px 0px;
+}
+
+header ul{
+  list-style: none;
+  margin-left: 0;
+  padding: 0;
+}
+
+header ul li{
+  float: left;
+  margin-left: 0;
+  font-size: 16px;
+  letter-spacing: 1px;
+}
+
+header ul.social{
+  position: absolute;
+  top: 13px;
+  right: 0px;
+  margin: 10px 0 0 0;
+}
+
+header a {
+  text-decoration: none;
+  color: $offwhite;
+  padding: 0 10px;
+}
+
+header a:hover {
+  color: $offwhite;
+  text-decoration: none;
+  border-bottom: 4px solid $accent_color;
+}
+
+.social a:hover {
+  text-decoration: none;
+  border: none;
+  color: $accent_color;
+}
+
+footer {
+  // background: $grey;
+  padding: 50px 0;
+  color: $offwhite;
+}
+footer a, footer a:hover{
+  color: $offwhite;
+  text-decoration: none;
+}