Add gallery, about and error pages

assets/css/_animations.scss

@@ -0,0 +1,53 @@
+// main: style.scss
+
+// ===========================================================================
+// ANIMATIONS
+// ===========================================================================
+
+@-webkit-keyframes wave-up {
+    0% {
+		top: 0;
+	}
+    60% {
+		top: -0.5rem;
+	}
+	100% {
+		top: 0;
+	}
+}
+
+@keyframes wave-up {
+	0% {
+		top: 0;
+	}
+    60% {
+		top: -0.5rem;
+	}
+	100% {
+		top: 0;
+	}
+}
+
+@-webkit-keyframes wave-down {
+    0% {
+		bottom: 0;
+	}
+    60% {
+		bottom: -0.5rem;
+	}
+	100% {
+		bottom: 0;
+	}
+}
+
+@keyframes wave-down {
+    0% {
+		bottom: 0;
+	}
+    60% {
+		bottom: -0.5rem;
+	}
+	100% {
+		bottom: 0;
+	}
+}

assets/css/_fonts.scss

@@ -0,0 +1,72 @@
+// main: style.scss
+
+// ===========================================================================
+// FONTS
+// ===========================================================================
+
+// Nunito
+
+@font-face {
+    font-family: 'Nunito';
+    src: url(../fonts/nunito/Nunito-Regular.ttf) format('truetype');
+    font-weight: 400;
+    font-style: normal;
+}
+
+@font-face {
+	font-family: 'Nunito';
+	src: url(../fonts/nunito/Nunito-Italic.ttf) format('truetype');
+	font-weight: 400;
+	font-style: italic;
+}
+
+@font-face {
+	font-family: 'Nunito';
+	src: url(../fonts/nunito/Nunito-Medium.ttf) format('truetype');
+	font-weight: 500;
+	font-style: normal;
+}
+
+@font-face {
+	font-family: 'Nunito';
+	src: url(../fonts/nunito/Nunito-MediumItalic.ttf) format('truetype');
+	font-weight: 500;
+	font-style: italic;
+}
+
+@font-face {
+	font-family: 'Nunito';
+	src: url(../fonts/nunito/Nunito-SemiBold.ttf) format('truetype');
+	font-weight: 600;
+	font-style: normal;
+}
+
+@font-face {
+	font-family: 'Nunito';
+	src: url(../fonts/nunito/Nunito-SemiBoldItalic.ttf) format('truetype');
+	font-weight: 600;
+	font-style: italic;
+}
+
+@font-face {
+	font-family: 'Nunito';
+	src: url(../fonts/nunito/Nunito-Bold.ttf) format('truetype');
+	font-weight: 700;
+	font-style: normal;
+}
+
+@font-face {
+	font-family: 'Nunito';
+	src: url(../fonts/nunito/Nunito-BoldItalic.ttf) format('truetype');
+	font-weight: 700;
+	font-style: italic;
+}
+
+// Gloria Hallelujah
+
+@font-face {
+	font-family: 'Gloria Hallelujah';
+	src: url(../fonts/gloria-hallelujah/GloriaHallelujah-Regular.ttf) format('truetype');
+	font-weight: 400;
+	font-style: normal;
+}

assets/css/_minireset.css

@@ -0,0 +1,80 @@
+/* main: style.scss */
+
+/* ===========================================================================
+MINIRESET V0.0.6
+=========================================================================== */
+
+html,
+body,
+p,
+ol,
+ul,
+li,
+dl,
+dt,
+dd,
+blockquote,
+figure,
+fieldset,
+legend,
+textarea,
+pre,
+iframe,
+hr,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    margin: 0;
+    padding: 0;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-size: 100%;
+    font-weight: normal;
+}
+
+ul {
+    list-style: none;
+}
+
+button,
+input,
+select {
+    margin: 0;
+}
+
+html {
+    box-sizing: border-box;
+}
+
+*, *::before, *::after {
+    box-sizing: inherit;
+}
+
+img,
+video {
+    height: auto;
+    max-width: 100%;
+}
+
+iframe {
+    border: 0;
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
+
+td,
+th {
+    padding: 0;
+}

assets/css/_variables.scss

@@ -0,0 +1,83 @@
+// main: style.scss
+
+// ===========================================================================
+// VARIABLES
+// ===========================================================================
+
+:root {
+
+    // Fonts
+
+    --text-font-family: 'Nunito', Verdana, sans-serif;
+    --logo-font-family: 'Gloria Hallelujah', Verdana, sans-serif;
+    --regular-font-weight: 400;
+    --medium-font-weight: 500;
+    --semi-bold-font-weight: 600;
+    --bold-font-weight: 700;
+    --text-font-size: 1rem;
+    --caption-font-size: 0.9rem;
+    --footnote-font-size: 0.8rem;
+    --text-line-height: 1.6rem;
+    --h1-font-size: 1.8rem;
+    --h2-font-size: 1.4rem;
+    --h3-font-size: 1.4rem;
+    --h4-font-size: 1.2rem;
+
+    // Dimensions
+
+    --content-max-width: 140rem;
+    --text-max-width: 70rem;
+    --icon-size: 2.5rem;
+    --header-bar-vertical-padding: 2rem;
+    --header-bar-horizontal-padding: 2rem;
+    --header-bar-height: calc((var(--header-bar-vertical-padding) * 2) + var(--h1-font-size));
+    --footer-bar-vertical-padding: 1rem;
+    --footer-bar-horizontal-padding: 2rem;
+    --footer-bar-height: calc((var(--footer-bar-vertical-padding) * 2) + var(--icon-size) + 1rem + var(--text-font-size));
+    --generic-section-vertical-padding: 3rem;
+    --generic-section-horizontal-padding: 2rem;
+    --home-section-vertical-padding: 2rem;
+    --home-section-horizontal-padding: 2rem;
+    --home-section-min-height: calc(100vh - var(--header-bar-height) - var(--footer-bar-height));
+    --home-nav-gap: 1rem;
+    --home-nav-item-size: 2rem;
+    --home-nav-item-translation: 0;
+    --home-nav-image-max-height: calc(100vh - var(--header-bar-height) - ((var(--generic-section-vertical-padding) + var(--home-nav-item-size) + var(--home-nav-gap)) * 2) - var(--footer-bar-height));
+
+    // Colors
+
+    --black: #000;
+    --jet: #333333;
+    --white: #fff;
+}
+
+// Media queries
+
+$tablet-media-query: 48rem;
+$desktop-media-query: 62rem;
+
+@media screen and (min-width: $tablet-media-query) {
+
+    :root {
+
+        // Fonts
+
+        --text-font-size: 1.2rem;
+        --caption-font-size: 1.1rem;
+        --footnote-font-size: 1rem;
+        --h1-font-size: 2rem;
+        --h2-font-size: 1.6rem;
+        --h3-font-size: 1.6rem;
+        --h4-font-size: 1.4rem;
+
+        // Dimensions
+
+        --icon-size: 3rem;
+        --header-bar-horizontal-padding: 4rem;
+        --footer-bar-vertical-padding: 2rem;
+        --footer-bar-horizontal-padding: 4rem;
+        --footer-bar-height: calc((var(--footer-bar-vertical-padding) * 2) + var(--icon-size));
+        --generic-section-horizontal-padding: 4rem;
+        --home-section-horizontal-padding: 4rem;
+    }
+}

assets/css/minireset.min.css

@@ -1 +0,0 @@
-/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}ul{list-style:none}button,input,select{margin:0}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}img,video{height:auto;max-width:100%}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}