Add index page, favicon, robots.txt and sitemap.xml

assets/styles/_animations.scss

@@ -0,0 +1,34 @@
+/* ===========================================================================
+ANIMATIONS
+=========================================================================== */
+
+@keyframes expand-width {
+    0% {
+        width: 0;
+    }
+    100% {
+        width: 100%;
+    }
+}
+
+@keyframes fade-in-from-bottom {
+    0% {
+        opacity: 0;
+        transform: translateY(0.25rem);
+    }
+    100% {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+@keyframes fade-in-from-top {
+    0% {
+        opacity: 0;
+        transform: translateY(-0.25rem);
+    }
+    100% {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}

assets/styles/_fonts.scss

@@ -0,0 +1,61 @@
+// ----------------------------------------------------------------------------
+// FONTS
+// ----------------------------------------------------------------------------
+
+// Cairo
+
+@font-face {
+    font-family: 'Cairo';
+    src: url(~/assets/fonts/cairo/Cairo-ExtraLight.ttf) format('truetype');
+    font-weight: 200;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'Cairo';
+    src: url(~/assets/fonts/cairo/Cairo-Light.ttf) format('truetype');
+    font-weight: 300;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'Cairo';
+    src: url(~/assets/fonts/cairo/Cairo-Regular.ttf) format('truetype');
+    font-weight: 400;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'Cairo';
+    src: url(~/assets/fonts/cairo/Cairo-Medium.ttf) format('truetype');
+    font-weight: 500;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'Cairo';
+    src: url(~/assets/fonts/cairo/Cairo-SemiBold.ttf) format('truetype');
+    font-weight: 600;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'Cairo';
+    src: url(~/assets/fonts/cairo/Cairo-Bold.ttf) format('truetype');
+    font-weight: 700;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'Cairo';
+    src: url(~/assets/fonts/cairo/Cairo-ExtraBold.ttf) format('truetype');
+    font-weight: 800;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'Cairo';
+    src: url(~/assets/fonts/cairo/Cairo-Black.ttf) format('truetype');
+    font-weight: 900;
+    font-style: normal;
+}

assets/styles/_variables.scss

@@ -0,0 +1,54 @@
+// ----------------------------------------------------------------------------
+// VARIABLES
+// ----------------------------------------------------------------------------
+
+:root {
+
+    // Fonts
+
+    --text-font-family: 'Cairo', sans-serif;
+    --title-font-family: 'Cairo', sans-serif;
+    --extra-light-font-weight: 200;
+    --light-font-weight: 300;
+    --regular-font-weight: 400;
+    --medium-font-weight: 500;
+    --semi-bold-font-weight: 600;
+    --bold-font-weight: 700;
+    --extra-bold-font-weight: 800;
+    --black-font-weight: 900;
+    --text-font-size: 1.2rem;
+    --text-line-height: calc(var(--text-font-size) * 1.2);
+    --caption-font-size: 1.1rem;
+    --caption-line-height: calc(var(--caption-font-size) * 1.2);
+    --footnote-font-size: 1rem;
+    --footnote-line-height: calc(var(--footnote-font-size) * 1.2);
+    --h1-font-size: 2rem;
+    --h1-line-height: calc(var(--h1-font-size) * 1.2);
+    --h2-font-size: 1.8rem;
+    --h2-line-height: calc(var(--h2-font-size) * 1.2);
+    --h3-font-size: 1.6rem;
+    --h3-line-height: calc(var(--h3-font-size) * 1.2);
+
+    // Dimensions
+
+    --icon-size: 2.5rem;
+
+    // Colors
+
+    --eerie-black: #212121;
+    --emerald: #72C080;
+    --granny-smith-apple: #A3F3B0;
+    --middle-green: #428F53;
+}
+
+// Media queries
+
+$tablet-media-query: 48rem;
+$desktop-media-query: 62rem;
+
+@media screen and (min-width: $tablet-media-query) {
+
+    :root {
+
+    }
+}