\ No newline at end of file
diff --git a/_includes/svg/logo-multi.html b/_includes/svg/logo-multi.html
new file mode 100644
index 0000000..e86fa05
--- /dev/null
+++ b/_includes/svg/logo-multi.html
@@ -0,0 +1,6 @@
+
diff --git a/_includes/svg/logo.html b/_includes/svg/logo.html
new file mode 100644
index 0000000..8f06fa0
--- /dev/null
+++ b/_includes/svg/logo.html
@@ -0,0 +1,6 @@
+
diff --git a/_layouts/default.html b/_layouts/default.html
index e69de29..2c9527a 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -0,0 +1,8 @@
+
+
+ {% include common/head.html %}
+
+ {{ content }}
+ {% include common/footer.html %}
+
+
\ No newline at end of file
diff --git a/_layouts/main.html b/_layouts/main.html
new file mode 100644
index 0000000..3fb0f15
--- /dev/null
+++ b/_layouts/main.html
@@ -0,0 +1,8 @@
+---
+layout: default
+---
+
+
+ {{ content }}
+ {% include common/footer.html %}
+
\ No newline at end of file
diff --git a/_layouts/page-with-header.html b/_layouts/page-with-header.html
new file mode 100644
index 0000000..7d7290a
--- /dev/null
+++ b/_layouts/page-with-header.html
@@ -0,0 +1,8 @@
+---
+layout: page
+---
+
+
+{% include svg/logo-multi.html %}
+ {{ content }}
+
\ No newline at end of file
diff --git a/_layouts/page.html b/_layouts/page.html
new file mode 100644
index 0000000..3fb0f15
--- /dev/null
+++ b/_layouts/page.html
@@ -0,0 +1,8 @@
+---
+layout: default
+---
+
+
+ {{ content }}
+ {% include common/footer.html %}
+
\ No newline at end of file
diff --git a/_posts/2019-10-20-welcome-to-jekyll.markdown b/_posts/2019-10-20-welcome-to-jekyll.markdown
deleted file mode 100644
index 5ddb135..0000000
--- a/_posts/2019-10-20-welcome-to-jekyll.markdown
+++ /dev/null
@@ -1,29 +0,0 @@
----
-layout: post
-title: "Welcome to Jekyll!"
-date: 2019-10-20 11:59:04 +0200
-categories: jekyll update
----
-You’ll find this post in your `_posts` directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run `jekyll serve`, which launches a web server and auto-regenerates your site when a file is updated.
-
-Jekyll requires blog post files to be named according to the following format:
-
-`YEAR-MONTH-DAY-title.MARKUP`
-
-Where `YEAR` is a four-digit number, `MONTH` and `DAY` are both two-digit numbers, and `MARKUP` is the file extension representing the format used in the file. After that, include the necessary front matter. Take a look at the source for this post to get an idea about how it works.
-
-Jekyll also offers powerful support for code snippets:
-
-{% highlight ruby %}
-def print_hi(name)
- puts "Hi, #{name}"
-end
-print_hi('Tom')
-#=> prints 'Hi, Tom' to STDOUT.
-{% endhighlight %}
-
-Check out the [Jekyll docs][jekyll-docs] for more info on how to get the most out of Jekyll. File all bugs/feature requests at [Jekyll’s GitHub repo][jekyll-gh]. If you have questions, you can ask them on [Jekyll Talk][jekyll-talk].
-
-[jekyll-docs]: https://jekyllrb.com/docs/home
-[jekyll-gh]: https://github.com/jekyll/jekyll
-[jekyll-talk]: https://talk.jekyllrb.com/
diff --git a/_sass/fontface.scss b/_sass/fontface.scss
new file mode 100644
index 0000000..1f433e0
--- /dev/null
+++ b/_sass/fontface.scss
@@ -0,0 +1,27 @@
+@font-face {
+ font-family: 'SpaceMono Regular';
+ src: url('../fonts/space-mono/SpaceMono-Regular.ttf') format('truetype');
+ font-weight: 300;
+ font-style: normal;
+}
+
+@font-face {
+ font-family: 'SpaceMono Bold';
+ src: url('../fonts/space-mono/SpaceMono-Bold.ttf') format('truetype');
+ font-weight: 700;
+ font-style: normal;
+}
+
+@font-face {
+ font-family: 'SpaceMono Italic';
+ src: url('../fonts/space-mono/SpaceMono-Bold.ttf') format('truetype');
+ font-weight: 400;
+ font-style: italic;
+}
+
+@font-face {
+ font-family: 'SpaceMono Bold Italic';
+ src: url('../fonts/space-mono/SpaceMono-BoldItalic.ttf') format('truetype');
+ font-weight: 700;
+ font-style: italic;
+}
diff --git a/_sass/includes/scrollbar.scss b/_sass/includes/scrollbar.scss
new file mode 100644
index 0000000..3e88ae2
--- /dev/null
+++ b/_sass/includes/scrollbar.scss
@@ -0,0 +1,17 @@
+::-webkit-scrollbar {
+ // width: 5px;
+}
+/* Track */
+::-webkit-scrollbar-track {
+ // background-image: url('../img/bg/scroll.jpg');
+ // background-color: transparent;
+}
+
+/* Handle */
+::-webkit-scrollbar-thumb {
+ // background: transparent;
+ // background-color: $black;
+ // background-blend-mode: difference;
+ // background-size: cover;
+ // border-radius: 50px;
+}
diff --git a/_sass/layout.scss b/_sass/layout.scss
new file mode 100644
index 0000000..96b4fe0
--- /dev/null
+++ b/_sass/layout.scss
@@ -0,0 +1,36 @@
+body {
+ background-color: $white;
+ background-image: url('../img/bg/es-c.jpg');
+ background-repeat-x: no-repeat;
+ background-repeat-y: repeat;
+ background-size: cover;
+ background-attachment: fixed;
+}
+
+.page-content {
+ max-width: 920px;
+ margin: 0 auto;
+}
+
+html,
+body {
+ height: 100%;
+}
+
+body {
+ display: flex;
+ flex-direction: column;
+}
+
+.content {
+ flex: 1 0 auto;
+}
+
+footer.page-footer {
+ flex-shrink: 0;
+}
+
+.rf-logo path {
+ fill: transparent;
+ stroke-width: 1;
+}
diff --git a/_sass/layouts/default.scss b/_sass/layouts/default.scss
new file mode 100644
index 0000000..3e7a4b4
--- /dev/null
+++ b/_sass/layouts/default.scss
@@ -0,0 +1,22 @@
+.rf-logo {
+ margin: $size-64 0 $size-64 $size-32;
+ max-width: 80%;
+
+ @include touch {
+ @include margin-vertical(0);
+ }
+}
+
+p {
+ max-width: $size-512 + $size-128;
+}
+
+h2 {
+ margin-top: $size-32;
+}
+
+.page-content {
+ @include touch {
+ @include margin-horizontal($size-32);
+ }
+}
diff --git a/_sass/reset.scss b/_sass/reset.scss
new file mode 100644
index 0000000..4e96ea0
--- /dev/null
+++ b/_sass/reset.scss
@@ -0,0 +1,124 @@
+html,
+body,
+div,
+span,
+applet,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+a,
+abbr,
+acronym,
+address,
+big,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+s,
+samp,
+small,
+strike,
+strong,
+sub,
+sup,
+tt,
+var,
+b,
+u,
+i,
+center,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+canvas,
+details,
+embed,
+figure,
+figcaption,
+footer,
+header,
+hgroup,
+menu,
+nav,
+output,
+ruby,
+section,
+summary,
+time,
+mark,
+audio,
+video {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ font-size: 100%;
+ font: inherit;
+ vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+ display: block;
+}
+body {
+ line-height: 1;
+}
+ol,
+ul {
+ list-style: none;
+}
+blockquote,
+q {
+ quotes: none;
+}
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+ content: '';
+ content: none;
+}
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
diff --git a/_sass/temp.scss b/_sass/temp.scss
deleted file mode 100644
index f61a831..0000000
--- a/_sass/temp.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-body, .reyyyryr {
- background-color: red;
-}
diff --git a/_sass/typography.scss b/_sass/typography.scss
new file mode 100644
index 0000000..c262e28
--- /dev/null
+++ b/_sass/typography.scss
@@ -0,0 +1,92 @@
+p,
+a,
+span,
+h1,
+h2,
+h3,
+h4,
+h5,
+strong,
+em,
+h6,
+.separator {
+ font-family: $font;
+ color: $white;
+ margin-bottom: $size-16;
+
+ &::selection {
+ background-color: transparent;
+ color: transparent;
+ text-shadow: 3px 0 8px;
+ }
+}
+
+strong {
+ font-family: $font-bold;
+}
+
+em {
+ font-family: $font-italic;
+}
+
+h1 {
+ font-size: 84px;
+}
+
+h1,
+.h1 {
+ font-size: $size-64;
+ font-family: $font-title;
+ font-style: italic;
+}
+
+h2,
+.h2 {
+ font-size: $size-32;
+ font-family: $font-title;
+ font-style: italic;
+}
+
+h3,
+.h3 {
+ font-size: $size-16;
+ font-family: $font-title;
+ font-style: italic;
+}
+
+p,
+.text-p {
+ font-size: $size-14;
+ font-family: $font;
+ line-height: $size-32;
+}
+
+a {
+ color: $black;
+ font-weight: bold;
+
+ &:hover,
+ &:visited {
+ font-style: italic;
+ }
+}
+
+.separator {
+ max-width: $size-512 + $size-128;
+ display: flex;
+ justify-content: center;
+
+ .dot {
+ height: $size-8;
+ width: $size-8;
+ border-radius: 100%;
+ background-color: $black;
+
+ &.background-blue {
+ background-color: $highlight;
+ }
+ &.background-white {
+ background-color: $white;
+ }
+ }
+}
diff --git a/_sass/utils/layout-utils.scss b/_sass/utils/layout-utils.scss
new file mode 100644
index 0000000..524a5ae
--- /dev/null
+++ b/_sass/utils/layout-utils.scss
@@ -0,0 +1,35 @@
+@mixin center-content-flex() {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+@mixin padding-vertical($padding) {
+ padding-top: $padding;
+ padding-bottom: $padding;
+}
+
+@mixin padding-horizontal($padding) {
+ padding-left: $padding;
+ padding-right: $padding;
+}
+
+@mixin margin-vertical($margin) {
+ margin-top: $margin;
+ margin-bottom: $margin;
+}
+
+@mixin margin-horizontal($margin) {
+ margin-left: $margin;
+ margin-right: $margin;
+}
+
+@mixin dir-col() {
+ display: flex;
+ flex-direction: column;
+}
+
+@mixin dir-row() {
+ display: flex;
+ flex-direction: row;
+}
diff --git a/_sass/utils/responsive.scss b/_sass/utils/responsive.scss
new file mode 100644
index 0000000..044798a
--- /dev/null
+++ b/_sass/utils/responsive.scss
@@ -0,0 +1,52 @@
+/* --------------------------------------------------------------------------
+ * Breakpoints
+ */
+
+// Max mobile
+@mixin mobile() {
+ @media (max-width: $breakpoint-tablet + 1px) {
+ @content;
+ }
+}
+
+// Min tablet
+@mixin tablet() {
+ @media (min-width: $breakpoint-tablet) {
+ @content;
+ }
+}
+
+// Tablet only
+@mixin tablet-only() {
+ @media (min-width: $breakpoint-tablet) and (max-width: $breakpoint-desktop + 1px) {
+ @content;
+ }
+}
+
+// Max tablet
+@mixin touch() {
+ @media (max-width: $breakpoint-desktop + 1px) {
+ @content;
+ }
+}
+
+// Min Desktop
+@mixin desktop() {
+ @media (min-width: $breakpoint-desktop) {
+ @content;
+ }
+}
+
+// Desktop only
+@mixin desktop-only() {
+ @media (min-width: $breakpoint-desktop) and (max-width: $breakpoint-widescreen + 1px) {
+ @content;
+ }
+}
+
+// Min widescreen
+@mixin widescreen() {
+ @media (min-width: $breakpoint-widescreen) {
+ @content;
+ }
+}
diff --git a/_sass/variables.scss b/_sass/variables.scss
new file mode 100644
index 0000000..c9f2517
--- /dev/null
+++ b/_sass/variables.scss
@@ -0,0 +1,36 @@
+// Colours
+
+$black: #1d2022;
+$white: #fff;
+$highlight: #0ddfe7;
+$highlight-darker: #0ac2c9;
+
+$bg: $black;
+
+// margin
+
+$size-base: 4px;
+$size-8: 8px;
+$size-12: 12px;
+$size-14: 14px;
+$size-16: 16px;
+$size-32: 32px;
+$size-64: 64px;
+$size-128: 128px;
+$size-256: 256px;
+$size-512: 512px;
+$size-1028: 1028px;
+
+// Typography
+
+$font-title: 'Orator Std', 'Courier New', Courier, monospace;
+$font: 'SpaceMono Regular', 'Courier New', Courier, monospace;
+$font-bold: 'SpaceMono Bold', 'Courier New', Courier, monospace;
+$font-italic: 'SpaceMono Italic', 'Courier New', Courier, monospace;
+$font-bold-italic: 'SpaceMono Bold Italic', 'Courier New', Courier, monospace;
+
+// Responsive breakpoints
+
+$breakpoint-tablet: 768px !default;
+$breakpoint-desktop: 1024px !default;
+$breakpoint-widescreen: 1440px !default;
diff --git a/about.markdown b/about.markdown
index 8b4e0b2..caf83b5 100644
--- a/about.markdown
+++ b/about.markdown
@@ -1,5 +1,5 @@
---
-layout: page
+layout: page-with-header
title: About
permalink: /about/
---
diff --git a/assets/css/index.scss b/assets/css/index.scss
index 18c4b13..3d23378 100644
--- a/assets/css/index.scss
+++ b/assets/css/index.scss
@@ -1,7 +1,13 @@
---
---
-@import "temp";
-body, .testing {
- display: none;
-}
\ No newline at end of file
+@import 'reset';
+@import 'fontface';
+@import 'variables';
+@import 'typography';
+@import 'utils/responsive';
+@import 'utils/layout-utils';
+@import 'layout';
+@import 'layouts/default';
+@import 'layouts/404';
+@import 'includes/scrollbar';
diff --git a/assets/img/bg/es-c.jpg b/assets/img/bg/es-c.jpg
new file mode 100644
index 0000000..a1ce57e
Binary files /dev/null and b/assets/img/bg/es-c.jpg differ
diff --git a/assets/img/bg/es.png b/assets/img/bg/es.png
new file mode 100644
index 0000000..3a6e001
Binary files /dev/null and b/assets/img/bg/es.png differ
diff --git a/assets/img/bg/scroll.jpg b/assets/img/bg/scroll.jpg
new file mode 100644
index 0000000..b805648
Binary files /dev/null and b/assets/img/bg/scroll.jpg differ
diff --git a/fr/index.markdown b/fr/index.markdown
new file mode 100644
index 0000000..202d36e
--- /dev/null
+++ b/fr/index.markdown
@@ -0,0 +1,12 @@
+---
+# Feel free to add content and custom Front Matter to this file.
+# To modify the layout, see https://jekyllrb.com/docs/themes/#overriding-theme-defaults
+
+layout: page-with-header
+
+---
+
+## -- What is ReclaimFutures?
+
+
+French text!
\ No newline at end of file
diff --git a/index.markdown b/index.markdown
index 0671507..2bb7e2d 100644
--- a/index.markdown
+++ b/index.markdown
@@ -2,5 +2,30 @@
# Feel free to add content and custom Front Matter to this file.
# To modify the layout, see https://jekyllrb.com/docs/themes/#overriding-theme-defaults
-layout: home
+layout: page-with-header
+
---
+
+## -- What is ReclaimFutures?
+
+As networks of increasingly opaque algorithms drive hyper-consumption and bolster deeply questionable political agendas/regimes the once radical utopian vision of the future offered by the internet is rapidly fading into a lofty nostalgic throwback, how can we reclaim the narratives for non-capitalistic aims?
+
+Perhaps through radical acts of creativity, resistance and collective action it may be possible to once again to imagine a plurality of futures other than those offered by tech’s big four.
+
+Indeed ReclaimFutures is a technology and culture conference based upon these perhaps lofty ‘ideals’. It does not seek to disrupt nor 'innovate'. ReclaimFutures is not about the latest technologies, design trends or most exciting new startup incubator. It's not even about 'ethical tech'.
+
+{% include common/separator.html colour="white" %}
+
+Instead, ReclaimFutures (RF) aims to inspect, interrogate and expose the neoliberal forces at play within communication technology and startup culture, whilst championing radical thinkers and creators. In short reclaim futures is a conference for all the creators and thinkers attempting to smash, replace, and escape capitalism though acts of resistance in all their forms.
+
+RF aims to foster an environment where creative and engaged artists, philosophers, technologists, activists, hackers, researchers and educators can collectively assemble to imagine new futures, beyond the walls of capitalistic limitation and stage the question of what we can do next, big or small to achieve political and/or social transformation in these troubled times in our species history.
+
+Over the course of 3 days in spring 2020 the inaugural edition of ReclaimFutures will be held at a to-be-confirmed location in the city of Lausanne, Switzerland. During these 3 days a series of workshops, talks, roundtables, performances and artworks will be presented.
+
+RF is also introspective in that it seeks to challenge our own preconceptions, and invites critical reflection. In the same way we cannot fix the societal technology-imposed problems on by applying yet more technology, we must not make the mistake that our own way will provides answers that cannot be challenged.
+
+{% include common/separator.html colour="white" %}
+
+RF in built upon an open, inclusive and respectful philosophy and is a conference trying to give a voice to those typically less heard within tech circles. Thus, RF invites all non-commercial individuals or small groups to participate in talks, artworks, and performances and strongly enthuses submissions from anyone who considers themselves to belong to an underrepresented group including but not limited to POCs, LGBT+, people with disabilities, working class and first-time speakers. ReclaimFutures is run as a DIT (Do It Together), self-funded, not-for-profit project and rejects commercial financial influence and thus cannot pay expenses of participants nor *large* fees (though all participants will be paid in accordance to the ticket sales and where possible we will offer meals as part of the event as well as trying to assist in finding accommodation and other practical needs).
+
+If you're looking for inspiration we've assembled a list of [hypothetical talk titles and subjects](https://www.are.na/share/YDqWVUY) which you can take as a starting point, fully adopt, use to get an impression, or of course completely disregarded.
\ No newline at end of file