Add Calibre font, fixed responsiveness of category list

client/css/navbar.css

@@ -61,4 +61,11 @@ nav a.selected::after {
 	-webkit-transform: translateY(0px);
 	-moz-transform: translateY(0px);
 	transform: translateY(0px);
+}
+
+ul#product-category-nav li.category-item {
+	display: inline-block;
+	width: 10%;
+	vertical-align: middle;
+	text-align: center;
 }

client/css/products.css

@@ -1,6 +1,7 @@
 ul.product-list {
     list-style: none;
     text-align: center;
+    min-height: 50%;
 }
 
 ul.product-list li {

client/css/responsiveness.css

@@ -18,4 +18,16 @@
     .product-short-desc p {
         padding: 0 10px;
     }
+}
+
+@media screen and (min-width: 756px) and (max-width: 1866px) {
+    ul#product-category-nav li {
+        display: inline-block;
+        width: 20%;
+        text-align: center;
+    }
+    ul#product-category-nav li a {
+        font-size: 95%;
+        margin: 15px 0px;
+    }
 }

client/css/styles.css

@@ -4,6 +4,12 @@
 /*
     TURQUOISE: #1EAEDB
 */
+@font-face {
+    font-family: calibreRegular;
+    src: url('../fonts/CalibreWeb-Regular.woff2') format("woff2");
+    font-style: normal;
+    font-weight: 300;
+}
 
 @font-face {
     font-family: ralewayRegular;
@@ -42,8 +48,14 @@ body {
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     font-family: ralewayRegular;
+
 }
 
+p {
+    font-family: "Calibre", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+    font-weight: 300;
+    font-size: 1.5rem;
+}
 section {
     transition: ease 1s display;
 }