diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..f323499
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,4 @@
+*#
+.#*
+*~
+public/
diff --git a/config.toml b/config.toml
index 8b2b7d4..ac413ac 100644
--- a/config.toml
+++ b/config.toml
@@ -1,5 +1,5 @@
 # The URL the site will be built for
-base_url = "https://elfsternberg.com/notes"
+base_url = "http://192.168.1.143:1025"
 
 # Whether to automatically compile all Sass files in the sass directory
 compile_sass = true
diff --git a/sass/design/_definitions.scss b/sass/design/_definitions.scss
new file mode 100644
index 0000000..b4e2e2f
--- /dev/null
+++ b/sass/design/_definitions.scss
@@ -0,0 +1,8 @@
+:root {
+  --primary-color: #520022;
+  --secondary-color: #dbff98;
+  --background-color: #ffffff;
+  --background-secondary-color: #dcdcdc;
+  --text-color: #1f000d;
+}
+    
diff --git a/sass/design/_fonts.scss b/sass/design/_fonts.scss
new file mode 100644
index 0000000..bde1e8a
--- /dev/null
+++ b/sass/design/_fonts.scss
@@ -0,0 +1,61 @@
+/* Nunito-Regular - latin */
+
+@font-face {
+  font-family: "Nunito";
+  font-style: normal;
+  font-weight: 400;
+  src:
+    url("fonts/nunito/Nunito-Regular.ttf") format("ttf"),
+    url("fonts/nunito/Nunito-Regular.woff2") format("woff2"),
+    url("fonts/nunito/Nunito-Regular.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+}
+
+/* nunito-500 - latin */
+@font-face {
+  font-family: "Nunito";
+  font-style: normal;
+  font-weight: 500;
+  src:
+    url("fonts/nunito/Nunito-SemiBold.woff2") format("woff2"),
+    url("fonts/nunito/Nunito-SemiBold.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+}
+
+/* nunito-700 - latin */
+@font-face {
+  font-family: "Nunito";
+  font-style: normal;
+  font-weight: 700;
+  src:
+    url("fonts/nunito/Nunito-Bold.woff2") format("woff2"),
+    url("fonts/nunito/Nunito-Bold.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+}
+
+/* nunito-italic - latin */
+@font-face {
+  font-family: "Nunito";
+  font-style: italic;
+  font-weight: 400;
+  src:
+    url("fonts/nunito/Nunito-Italic.woff2") format("woff2"),
+    url("fonts/nunito/Nunito-Italic.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+}
+
+/* nunito-500italic - latin */
+@font-face {
+  font-family: "Nunito";
+  font-style: italic;
+  font-weight: 500;
+  src:
+    url("fonts/nunito/Nunito-SemiBoldItalic.woff2") format("woff2"),
+    url("fonts/nunito/Nunito-SemiBoldItalic.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+}
+
+/* nunito-BoldItalic - latin */
+@font-face {
+  font-family: "Nunito";
+  font-style: italic;
+  font-weight: 700;
+  src:
+    url("fonts/nunito/Nunito-BoldItalic.woff2") format("woff2"),
+    url("fonts/nunito/Nunito-BoldItalic.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+}
diff --git a/sass/main.scss b/sass/main.scss
new file mode 100644
index 0000000..e0aa0c6
--- /dev/null
+++ b/sass/main.scss
@@ -0,0 +1,31 @@
+@import "design/definitions";
+@import "design/fonts";
+
+:root {
+  font-size: calc(clamp(0.875rem, .725rem + 0.6666vw, 1.125rem));
+  font-family: "Nunito", sans-serif;
+}
+
+body {
+  font-size: calc(clamp(0.875rem, .725rem + 0.6666vw, 1.125rem));
+  font-family: "Nunito", sans-serif;
+  font-weight: 400;
+}
+  
+header.header {
+  position: fixed;
+  background-color: var(--background-color, #ffffff);
+}
+
+.container {
+    width: 100%;
+    padding-right: 1.5rem;
+    padding-left: 1.5rem;
+    margin-right: auto;
+    margin-left: auto;
+}
+
+.navbar .container {
+  display: flex;
+  align-items: flex-start;
+}