Merge pull request #66 from RobinCheptileh/master

Added font stylesheet files

6 files changed, 1086 insertions, 0 deletions

diff --git a/fonts/otf/Montserrat.css b/fonts/otf/Montserrat.css
new file mode 100755
index 0000000..f6b7098
--- /dev/null
+++ b/fonts/otf/Montserrat.css
@@ -0,0 +1,291 @@
+/** =================== MONTSERRAT =================== **/
+
+/** Montserrat Thin **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 100;
+    font-style: normal;
+    src: url("Montserrat-Thin.otf") format('opentype');
+}
+
+/** Montserrat Thin-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 100;
+    font-style: italic;
+    src: url("Montserrat-ThinItalic.otf") format('opentype');
+}
+
+/** Montserrat ExtraLight **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 200;
+    font-style: normal;
+    src: url("Montserrat-ExtraLight.otf") format('opentype');
+}
+
+/** Montserrat ExtraLight-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 200;
+    font-style: italic;
+    src: url("Montserrat-ExtraLightItalic.otf") format('opentype');
+}
+
+/** Montserrat Light **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 300;
+    font-style: normal;
+    src: url("Montserrat-Light.otf") format('opentype');
+}
+
+/** Montserrat Light-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 300;
+    font-style: italic;
+    src: url("Montserrat-LightItalic.otf") format('opentype');
+}
+
+/** Montserrat Regular **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 400;
+    font-style: normal;
+    src: url("Montserrat-Regular.otf") format('opentype');
+}
+
+/** Montserrat Regular-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 400;
+    font-style: italic;
+    src: url("Montserrat-Italic.otf") format('opentype');
+}
+
+/** Montserrat Medium **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 500;
+    font-style: normal;
+    src: url("Montserrat-Medium.otf") format('opentype');
+}
+
+/** Montserrat Medium-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 500;
+    font-style: italic;
+    src: url("Montserrat-MediumItalic.otf") format('opentype');
+}
+
+/** Montserrat SemiBold **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 600;
+    font-style: normal;
+    src: url("Montserrat-SemiBold.otf") format('opentype');
+}
+
+/** Montserrat SemiBold-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 600;
+    font-style: italic;
+    src: url("Montserrat-SemiBoldItalic.otf") format('opentype');
+}
+
+/** Montserrat Bold **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 700;
+    font-style: normal;
+    src: url("Montserrat-Bold.otf") format('opentype');
+}
+
+/** Montserrat Bold-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 700;
+    font-style: italic;
+    src: url("Montserrat-BoldItalic.otf") format('opentype');
+}
+
+/** Montserrat ExtraBold **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 800;
+    font-style: normal;
+    src: url("Montserrat-ExtraBold.otf") format('opentype');
+}
+
+/** Montserrat ExtraBold-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 800;
+    font-style: italic;
+    src: url("Montserrat-ExtraBoldItalic.otf") format('opentype');
+}
+
+/** Montserrat Black **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 900;
+    font-style: normal;
+    src: url("Montserrat-Black.otf") format('opentype');
+}
+
+/** Montserrat Black-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 900;
+    font-style: italic;
+    src: url("Montserrat-BlackItalic.otf") format('opentype');
+}
+
+/** =================== MONTSERRAT ALTERNATES =================== **/
+
+/** Montserrat Alternates Thin **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 100;
+    font-style: normal;
+    src: url("MontserratAlternates-Thin.otf") format('opentype');
+}
+
+/** Montserrat Alternates Thin-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 100;
+    font-style: italic;
+    src: url("MontserratAlternates-ThinItalic.otf") format('opentype');
+}
+
+/** Montserrat Alternates ExtraLight **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 200;
+    font-style: normal;
+    src: url("MontserratAlternates-ExtraLight.otf") format('opentype');
+}
+
+/** Montserrat Alternates ExtraLight-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 200;
+    font-style: italic;
+    src: url("MontserratAlternates-ExtraLightItalic.otf") format('opentype');
+}
+
+/** Montserrat Alternates Light **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 300;
+    font-style: normal;
+    src: url("MontserratAlternates-Light.otf") format('opentype');
+}
+
+/** Montserrat Alternates Light-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 300;
+    font-style: italic;
+    src: url("MontserratAlternates-LightItalic.otf") format('opentype');
+}
+
+/** Montserrat Alternates Regular **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 400;
+    font-style: normal;
+    src: url("MontserratAlternates-Regular.otf") format('opentype');
+}
+
+/** Montserrat Alternates Regular-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 400;
+    font-style: italic;
+    src: url("MontserratAlternates-Italic.otf") format('opentype');
+}
+
+/** Montserrat Alternates Medium **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 500;
+    font-style: normal;
+    src: url("MontserratAlternates-Medium.otf") format('opentype');
+}
+
+/** Montserrat Alternates Medium-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 500;
+    font-style: italic;
+    src: url("MontserratAlternates-MediumItalic.otf") format('opentype');
+}
+
+/** Montserrat Alternates SemiBold **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 600;
+    font-style: normal;
+    src: url("MontserratAlternates-SemiBold.otf") format('opentype');
+}
+
+/** Montserrat Alternates SemiBold-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 600;
+    font-style: italic;
+    src: url("MontserratAlternates-SemiBoldItalic.otf") format('opentype');
+}
+
+/** Montserrat Alternates Bold **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 700;
+    font-style: normal;
+    src: url("MontserratAlternates-Bold.otf") format('opentype');
+}
+
+/** Montserrat Alternates Bold-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 700;
+    font-style: italic;
+    src: url("MontserratAlternates-BoldItalic.otf") format('opentype');
+}
+
+/** Montserrat Alternates ExtraBold **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 800;
+    font-style: normal;
+    src: url("MontserratAlternates-ExtraBold.otf") format('opentype');
+}
+
+/** Montserrat Alternates ExtraBold-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 800;
+    font-style: italic;
+    src: url("MontserratAlternates-ExtraBoldItalic.otf") format('opentype');
+}
+
+/** Montserrat Alternates Black **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 900;
+    font-style: normal;
+    src: url("MontserratAlternates-Black.otf") format('opentype');
+}
+
+/** Montserrat Alternates Black-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 900;
+    font-style: italic;
+    src: url("MontserratAlternates-BlackItalic.otf") format('opentype');
+}
\ No newline at end of file
diff --git a/fonts/otf/README.MD b/fonts/otf/README.MD
new file mode 100644
index 0000000..1de8753
--- /dev/null
+++ b/fonts/otf/README.MD
@@ -0,0 +1,35 @@
+# The Montserrat Font Project
+To use this font as a webfont, ```Montserrat.css``` is included.
+
+## How to use
+### 1. @import
+You can import the file into your stylesheet as follows:
+```css
+@import url("static/fonts/Montserrat/fonts/otf/Montserrat.css");
+```
+
+**NOTE:** The directory where the stylesheet is placed.
+
+Then we can use it to style elements:
+```css
+body {
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 400;
+}
+```
+
+### 2. \<link>ing a stylesheet
+Similarly, you could link to the same asset as you would any other CSS filter, in the \<head> of the HTML document rather than in the CSS:
+```html
+<link rel="stylesheet" type="text/css" href="static/fonts/Montserrat/fonts/otf/Montserrat.css">
+```
+
+**NOTE:** The directory where the stylesheet is placed.
+
+Then we can use it to style elements:
+```css
+body {
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 400;
+}
+```
\ No newline at end of file
diff --git a/fonts/ttf/Montserrat.css b/fonts/ttf/Montserrat.css
new file mode 100755
index 0000000..75d021d
--- /dev/null
+++ b/fonts/ttf/Montserrat.css
@@ -0,0 +1,291 @@
+/** =================== MONTSERRAT =================== **/
+
+/** Montserrat Thin **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 100;
+    font-style: normal;
+    src: url("Montserrat-Thin.ttf") format('truetype');
+}
+
+/** Montserrat Thin-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 100;
+    font-style: italic;
+    src: url("Montserrat-ThinItalic.ttf") format('truetype');
+}
+
+/** Montserrat ExtraLight **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 200;
+    font-style: normal;
+    src: url("Montserrat-ExtraLight.ttf") format('truetype');
+}
+
+/** Montserrat ExtraLight-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 200;
+    font-style: italic;
+    src: url("Montserrat-ExtraLightItalic.ttf") format('truetype');
+}
+
+/** Montserrat Light **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 300;
+    font-style: normal;
+    src: url("Montserrat-Light.ttf") format('truetype');
+}
+
+/** Montserrat Light-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 300;
+    font-style: italic;
+    src: url("Montserrat-LightItalic.ttf") format('truetype');
+}
+
+/** Montserrat Regular **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 400;
+    font-style: normal;
+    src: url("Montserrat-Regular.ttf") format('truetype');
+}
+
+/** Montserrat Regular-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 400;
+    font-style: italic;
+    src: url("Montserrat-Italic.ttf") format('truetype');
+}
+
+/** Montserrat Medium **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 500;
+    font-style: normal;
+    src: url("Montserrat-Medium.ttf") format('truetype');
+}
+
+/** Montserrat Medium-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 500;
+    font-style: italic;
+    src: url("Montserrat-MediumItalic.ttf") format('truetype');
+}
+
+/** Montserrat SemiBold **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 600;
+    font-style: normal;
+    src: url("Montserrat-SemiBold.ttf") format('truetype');
+}
+
+/** Montserrat SemiBold-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 600;
+    font-style: italic;
+    src: url("Montserrat-SemiBoldItalic.ttf") format('truetype');
+}
+
+/** Montserrat Bold **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 700;
+    font-style: normal;
+    src: url("Montserrat-Bold.ttf") format('truetype');
+}
+
+/** Montserrat Bold-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 700;
+    font-style: italic;
+    src: url("Montserrat-BoldItalic.ttf") format('truetype');
+}
+
+/** Montserrat ExtraBold **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 800;
+    font-style: normal;
+    src: url("Montserrat-ExtraBold.ttf") format('truetype');
+}
+
+/** Montserrat ExtraBold-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 800;
+    font-style: italic;
+    src: url("Montserrat-ExtraBoldItalic.ttf") format('truetype');
+}
+
+/** Montserrat Black **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 900;
+    font-style: normal;
+    src: url("Montserrat-Black.ttf") format('truetype');
+}
+
+/** Montserrat Black-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 900;
+    font-style: italic;
+    src: url("Montserrat-BlackItalic.ttf") format('truetype');
+}
+
+/** =================== MONTSERRAT ALTERNATES =================== **/
+
+/** Montserrat Alternates Thin **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 100;
+    font-style: normal;
+    src: url("MontserratAlternates-Thin.ttf") format('truetype');
+}
+
+/** Montserrat Alternates Thin-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 100;
+    font-style: italic;
+    src: url("MontserratAlternates-ThinItalic.ttf") format('truetype');
+}
+
+/** Montserrat Alternates ExtraLight **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 200;
+    font-style: normal;
+    src: url("MontserratAlternates-ExtraLight.ttf") format('truetype');
+}
+
+/** Montserrat Alternates ExtraLight-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 200;
+    font-style: italic;
+    src: url("MontserratAlternates-ExtraLightItalic.ttf") format('truetype');
+}
+
+/** Montserrat Alternates Light **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 300;
+    font-style: normal;
+    src: url("MontserratAlternates-Light.ttf") format('truetype');
+}
+
+/** Montserrat Alternates Light-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 300;
+    font-style: italic;
+    src: url("MontserratAlternates-LightItalic.ttf") format('truetype');
+}
+
+/** Montserrat Alternates Regular **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 400;
+    font-style: normal;
+    src: url("MontserratAlternates-Regular.ttf") format('truetype');
+}
+
+/** Montserrat Alternates Regular-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 400;
+    font-style: italic;
+    src: url("MontserratAlternates-Italic.ttf") format('truetype');
+}
+
+/** Montserrat Alternates Medium **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 500;
+    font-style: normal;
+    src: url("MontserratAlternates-Medium.ttf") format('truetype');
+}
+
+/** Montserrat Alternates Medium-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 500;
+    font-style: italic;
+    src: url("MontserratAlternates-MediumItalic.ttf") format('truetype');
+}
+
+/** Montserrat Alternates SemiBold **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 600;
+    font-style: normal;
+    src: url("MontserratAlternates-SemiBold.ttf") format('truetype');
+}
+
+/** Montserrat Alternates SemiBold-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 600;
+    font-style: italic;
+    src: url("MontserratAlternates-SemiBoldItalic.ttf") format('truetype');
+}
+
+/** Montserrat Alternates Bold **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 700;
+    font-style: normal;
+    src: url("MontserratAlternates-Bold.ttf") format('truetype');
+}
+
+/** Montserrat Alternates Bold-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 700;
+    font-style: italic;
+    src: url("MontserratAlternates-BoldItalic.ttf") format('truetype');
+}
+
+/** Montserrat Alternates ExtraBold **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 800;
+    font-style: normal;
+    src: url("MontserratAlternates-ExtraBold.ttf") format('truetype');
+}
+
+/** Montserrat Alternates ExtraBold-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 800;
+    font-style: italic;
+    src: url("MontserratAlternates-ExtraBoldItalic.ttf") format('truetype');
+}
+
+/** Montserrat Alternates Black **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 900;
+    font-style: normal;
+    src: url("MontserratAlternates-Black.ttf") format('truetype');
+}
+
+/** Montserrat Alternates Black-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 900;
+    font-style: italic;
+    src: url("MontserratAlternates-BlackItalic.ttf") format('truetype');
+}
\ No newline at end of file
diff --git a/fonts/ttf/README.MD b/fonts/ttf/README.MD
new file mode 100644
index 0000000..a3da10f
--- /dev/null
+++ b/fonts/ttf/README.MD
@@ -0,0 +1,35 @@
+# The Montserrat Font Project
+To use this font as a webfont, ```Montserrat.css``` is included.
+
+## How to use
+### 1. @import
+You can import the file into your stylesheet as follows:
+```css
+@import url("static/fonts/Montserrat/fonts/ttf/Montserrat.css");
+```
+
+**NOTE:** The directory where the stylesheet is placed.
+
+Then we can use it to style elements:
+```css
+body {
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 400;
+}
+```
+
+### 2. \<link>ing a stylesheet
+Similarly, you could link to the same asset as you would any other CSS filter, in the \<head> of the HTML document rather than in the CSS:
+```html
+<link rel="stylesheet" type="text/css" href="static/fonts/Montserrat/fonts/ttf/Montserrat.css">
+```
+
+**NOTE:** The directory where the stylesheet is placed.
+
+Then we can use it to style elements:
+```css
+body {
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 400;
+}
+```
\ No newline at end of file
diff --git a/fonts/webfonts/Montserrat.css b/fonts/webfonts/Montserrat.css
new file mode 100755
index 0000000..a52ef06
--- /dev/null
+++ b/fonts/webfonts/Montserrat.css
@@ -0,0 +1,399 @@
+/** =================== MONTSERRAT =================== **/
+
+/** Montserrat Thin **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 100;
+    font-style: normal;
+    src: url("Montserrat-Thin.eot");
+    src: url("Montserrat-Thin.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-Thin.woff2") format("woff2"),
+         url("Montserrat-Thin.woff") format("woff");
+}
+
+/** Montserrat Thin-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 100;
+    font-style: italic;
+    src: url("Montserrat-ThinItalic.eot");
+    src: url("Montserrat-ThinItalic.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-ThinItalic.woff2") format("woff2"),
+         url("Montserrat-ThinItalic.woff") format("woff");
+}
+
+/** Montserrat ExtraLight **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 200;
+    font-style: normal;
+    src: url("Montserrat-ExtraLight.eot");
+    src: url("Montserrat-ExtraLight.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-ExtraLight.woff2") format("woff2"),
+         url("Montserrat-ExtraLight.woff") format("woff");
+}
+
+/** Montserrat ExtraLight-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 200;
+    font-style: italic;
+    src: url("Montserrat-ExtraLightItalic.eot");
+    src: url("Montserrat-ExtraLightItalic.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-ExtraLightItalic.woff2") format("woff2"),
+         url("Montserrat-ExtraLightItalic.woff") format("woff");
+}
+
+/** Montserrat Light **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 300;
+    font-style: normal;
+    src: url("Montserrat-Light.eot");
+    src: url("Montserrat-Light.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-Light.woff2") format("woff2"),
+         url("Montserrat-Light.woff") format("woff");
+}
+
+/** Montserrat Light-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 300;
+    font-style: italic;
+    src: url("Montserrat-LightItalic.eot");
+    src: url("Montserrat-LightItalic.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-LightItalic.woff2") format("woff2"),
+         url("Montserrat-LightItalic.woff") format("woff");
+}
+
+/** Montserrat Regular **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 400;
+    font-style: normal;
+    src: url("Montserrat-Regular.eot");
+    src: url("Montserrat-Regular.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-Regular.woff2") format("woff2"),
+         url("Montserrat-Regular.woff") format("woff");
+}
+
+/** Montserrat Regular-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 400;
+    font-style: italic;
+    src: url("Montserrat-Italic.eot");
+    src: url("Montserrat-Italic.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-Italic.woff2") format("woff2"),
+         url("Montserrat-Italic.woff") format("woff");
+}
+
+/** Montserrat Medium **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 500;
+    font-style: normal;
+    src: url("Montserrat-Medium.eot");
+    src: url("Montserrat-Medium.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-Medium.woff2") format("woff2"),
+         url("Montserrat-Medium.woff") format("woff");
+}
+
+/** Montserrat Medium-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 500;
+    font-style: italic;
+    src: url("Montserrat-MediumItalic.eot");
+    src: url("Montserrat-MediumItalic.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-MediumItalic.woff2") format("woff2"),
+         url("Montserrat-MediumItalic.woff") format("woff");
+}
+
+/** Montserrat SemiBold **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 600;
+    font-style: normal;
+    src: url("Montserrat-SemiBold.eot");
+    src: url("Montserrat-SemiBold.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-SemiBold.woff2") format("woff2"),
+         url("Montserrat-SemiBold.woff") format("woff");
+}
+
+/** Montserrat SemiBold-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 600;
+    font-style: italic;
+    src: url("Montserrat-SemiBoldItalic.eot");
+    src: url("Montserrat-SemiBoldItalic.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-SemiBoldItalic.woff2") format("woff2"),
+         url("Montserrat-SemiBoldItalic.woff") format("woff");
+}
+
+/** Montserrat Bold **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 700;
+    font-style: normal;
+    src: url("Montserrat-Bold.eot");
+    src: url("Montserrat-Bold.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-Bold.woff2") format("woff2"),
+         url("Montserrat-Bold.woff") format("woff");
+}
+
+/** Montserrat Bold-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 700;
+    font-style: italic;
+    src: url("Montserrat-BoldItalic.eot");
+    src: url("Montserrat-BoldItalic.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-BoldItalic.woff2") format("woff2"),
+         url("Montserrat-BoldItalic.woff") format("woff");
+}
+
+/** Montserrat ExtraBold **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 800;
+    font-style: normal;
+    src: url("Montserrat-ExtraBold.eot");
+    src: url("Montserrat-ExtraBold.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-ExtraBold.woff2") format("woff2"),
+         url("Montserrat-ExtraBold.woff") format("woff");
+}
+
+/** Montserrat ExtraBold-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 800;
+    font-style: italic;
+    src: url("Montserrat-ExtraBoldItalic.eot");
+    src: url("Montserrat-ExtraBoldItalic.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-ExtraBoldItalic.woff2") format("woff2"),
+         url("Montserrat-ExtraBoldItalic.woff") format("woff");
+}
+
+/** Montserrat Black **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 900;
+    font-style: normal;
+    src: url("Montserrat-Black.eot");
+    src: url("Montserrat-Black.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-Black.woff2") format("woff2"),
+         url("Montserrat-Black.woff") format("woff");
+}
+
+/** Montserrat Black-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 900;
+    font-style: italic;
+    src: url("Montserrat-BlackItalic.eot");
+    src: url("Montserrat-BlackItalic.eot?#iefix") format('embedded-opentype'),
+         url("Montserrat-BlackItalic.woff2") format("woff2"),
+         url("Montserrat-BlackItalic.woff") format("woff");
+}
+
+/** =================== MONTSERRAT ALTERNATES =================== **/
+
+/** Montserrat Alternates Thin **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 100;
+    font-style: normal;
+    src: url("MontserratAlternates-Thin.eot");
+    src: url("MontserratAlternates-Thin.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-Thin.woff2") format("woff2"),
+         url("MontserratAlternates-Thin.woff") format("woff");
+}
+
+/** Montserrat Alternates Thin-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 100;
+    font-style: italic;
+    src: url("MontserratAlternates-ThinItalic.eot");
+    src: url("MontserratAlternates-ThinItalic.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-ThinItalic.woff2") format("woff2"),
+         url("MontserratAlternates-ThinItalic.woff") format("woff");
+}
+
+/** Montserrat Alternates ExtraLight **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 200;
+    font-style: normal;
+    src: url("MontserratAlternates-ExtraLight.eot");
+    src: url("MontserratAlternates-ExtraLight.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-ExtraLight.woff2") format("woff2"),
+         url("MontserratAlternates-ExtraLight.woff") format("woff");
+}
+
+/** Montserrat Alternates ExtraLight-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 200;
+    font-style: italic;
+    src: url("MontserratAlternates-ExtraLightItalic.eot");
+    src: url("MontserratAlternates-ExtraLightItalic.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-ExtraLightItalic.woff2") format("woff2"),
+         url("MontserratAlternates-ExtraLightItalic.woff") format("woff");
+}
+
+/** Montserrat Alternates Light **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 300;
+    font-style: normal;
+    src: url("MontserratAlternates-Light.eot");
+    src: url("MontserratAlternates-Light.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-Light.woff2") format("woff2"),
+         url("MontserratAlternates-Light.woff") format("woff");
+}
+
+/** Montserrat Alternates Light-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 300;
+    font-style: italic;
+    src: url("MontserratAlternates-LightItalic.eot");
+    src: url("MontserratAlternates-LightItalic.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-LightItalic.woff2") format("woff2"),
+         url("MontserratAlternates-LightItalic.woff") format("woff");
+}
+
+/** Montserrat Alternates Regular **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 400;
+    font-style: normal;
+    src: url("MontserratAlternates-Regular.eot");
+    src: url("MontserratAlternates-Regular.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-Regular.woff2") format("woff2"),
+         url("MontserratAlternates-Regular.woff") format("woff");
+}
+
+/** Montserrat Alternates Regular-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 400;
+    font-style: italic;
+    src: url("MontserratAlternates-Italic.eot");
+    src: url("MontserratAlternates-Italic.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-Italic.woff2") format("woff2"),
+         url("MontserratAlternates-Italic.woff") format("woff");
+}
+
+/** Montserrat Alternates Medium **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 500;
+    font-style: normal;
+    src: url("MontserratAlternates-Medium.eot");
+    src: url("MontserratAlternates-Medium.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-Medium.woff2") format("woff2"),
+         url("MontserratAlternates-Medium.woff") format("woff");
+}
+
+/** Montserrat Alternates Medium-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 500;
+    font-style: italic;
+    src: url("MontserratAlternates-MediumItalic.eot");
+    src: url("MontserratAlternates-MediumItalic.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-MediumItalic.woff2") format("woff2"),
+         url("MontserratAlternates-MediumItalic.woff") format("woff");
+}
+
+/** Montserrat Alternates SemiBold **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 600;
+    font-style: normal;
+    src: url("MontserratAlternates-SemiBold.eot");
+    src: url("MontserratAlternates-SemiBold.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-SemiBold.woff2") format("woff2"),
+         url("MontserratAlternates-SemiBold.woff") format("woff");
+}
+
+/** Montserrat Alternates SemiBold-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 600;
+    font-style: italic;
+    src: url("MontserratAlternates-SemiBoldItalic.eot");
+    src: url("MontserratAlternates-SemiBoldItalic.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-SemiBoldItalic.woff2") format("woff2"),
+         url("MontserratAlternates-SemiBoldItalic.woff") format("woff");
+}
+
+/** Montserrat Alternates Bold **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 700;
+    font-style: normal;
+    src: url("MontserratAlternates-Bold.eot");
+    src: url("MontserratAlternates-Bold.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-Bold.woff2") format("woff2"),
+         url("MontserratAlternates-Bold.woff") format("woff");
+}
+
+/** Montserrat Alternates Bold-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 700;
+    font-style: italic;
+    src: url("MontserratAlternates-BoldItalic.eot");
+    src: url("MontserratAlternates-BoldItalic.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-BoldItalic.woff2") format("woff2"),
+         url("MontserratAlternates-BoldItalic.woff") format("woff");
+}
+
+/** Montserrat Alternates ExtraBold **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 800;
+    font-style: normal;
+    src: url("MontserratAlternates-ExtraBold.eot");
+    src: url("MontserratAlternates-ExtraBold.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-ExtraBold.woff2") format("woff2"),
+         url("MontserratAlternates-ExtraBold.woff") format("woff");
+}
+
+/** Montserrat Alternates ExtraBold-Italic **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 800;
+    font-style: italic;
+    src: url("MontserratAlternates-ExtraBoldItalic.eot");
+    src: url("MontserratAlternates-ExtraBoldItalic.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-ExtraBoldItalic.woff2") format("woff2"),
+         url("MontserratAlternates-ExtraBoldItalic.woff") format("woff");
+}
+
+/** Montserrat Alternates Black **/
+@font-face {
+    font-family: "Montserrat Alternates";
+    font-weight: 900;
+    font-style: normal;
+    src: url("MontserratAlternates-Black.eot");
+    src: url("MontserratAlternates-Black.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-Black.woff2") format("woff2"),
+         url("MontserratAlternates-Black.woff") format("woff");
+}
+
+/** Montserrat Alternates Black-Italic **/
+@font-face {
+    font-family: "Montserrat";
+    font-weight: 900;
+    font-style: italic;
+    src: url("MontserratAlternates-BlackItalic.eot");
+    src: url("MontserratAlternates-BlackItalic.eot?#iefix") format('embedded-opentype'),
+         url("MontserratAlternates-BlackItalic.woff2") format("woff2"),
+         url("MontserratAlternates-BlackItalic.woff") format("woff");
+}
\ No newline at end of file
diff --git a/fonts/webfonts/README.MD b/fonts/webfonts/README.MD
new file mode 100644
index 0000000..811ad40
--- /dev/null
+++ b/fonts/webfonts/README.MD
@@ -0,0 +1,35 @@
+# The Montserrat Font Project
+To use this font as a webfont, ```Montserrat.css``` is included.
+
+## How to use
+### 1. @import
+You can import the file into your stylesheet as follows:
+```css
+@import url("static/fonts/Montserrat/fonts/webfonts/Montserrat.css");
+```
+
+**NOTE:** The directory where the stylesheet is placed.
+
+Then we can use it to style elements:
+```css
+body {
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 400;
+}
+```
+
+### 2. \<link>ing a stylesheet
+Similarly, you could link to the same asset as you would any other CSS filter, in the \<head> of the HTML document rather than in the CSS:
+```html
+<link rel="stylesheet" type="text/css" href="static/fonts/Montserrat/fonts/webfonts/Montserrat.css">
+```
+
+**NOTE:** The directory where the stylesheet is placed.
+
+Then we can use it to style elements:
+```css
+body {
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 400;
+}
+```
\ No newline at end of file