POC frontend setup w/ static data.

frontend/styles/global.scss

@@ -0,0 +1,36 @@
+
+@font-face {
+  font-family: Moderat;
+  font-weight: normal;
+  font-style: normal;
+  src: url(/public/assets/fonts/Moderat-Regular.eot);
+  src: url(/public/assets/fonts/Moderat-Regular.eot?#iefix) format("embedded-opentype"), url(/public/assets/fonts/Moderat-Regular.woff2) format("woff2");
+}
+
+@font-face {
+  font-family: Moderat;
+  font-weight: 700;
+  font-style: normal;
+  src: url(/public/assets/fonts/Moderat-Bold.eot);
+  src: url(/public/assets/fonts/Moderat-Bold.eot?#iefix) format("embedded-opentype"),
+       url(/public/assets/fonts/Moderat-Bold.woff2) format("woff2"),
+       url(/public/assets/fonts/Moderat-Bold.woff) format("woff");
+}
+
+body {
+  font-family: Moderat, Helvetica Neue;
+  margin: 0;
+}
+
+a {
+  text-decoration: none;
+}
+
+input,
+textarea {
+  border-radius: 0;
+  box-shadow: none;
+  -webkit-appearance: none;
+  font-size: 1.1rem;
+  border: 1px solid rgba(#333333, 0.3);
+}

frontend/styles/media-queries.scss

@@ -0,0 +1,28 @@
+$mobile-width: 768px;
+$tablet-max: 1200px;
+$desktop-max: 2004px;
+
+
+@mixin mobile {
+  @media (max-width: #{$mobile-width}) {
+    @content;
+  }
+}
+
+@mixin tablet {
+  @media (min-width: #{$mobile-width + 1px}) {
+    @content;
+  }
+}
+
+@mixin desktop {
+  @media (min-width: #{$tablet-max + 1px}) {
+    @content;
+  }
+}
+
+@mixin widescreen {
+  @media (min-width: #{$desktop-max + 1px}){
+    @content;
+  }
+}

frontend/styles/variables.scss

@@ -0,0 +1,2 @@
+
+$color-primary: #6ec800;