diff --git a/app/front/front.styl b/app/front/front.styl
new file mode 100644
index 0000000..55658fc
--- /dev/null
+++ b/app/front/front.styl
@@ -0,0 +1,138 @@
+article {
+  &.solution {
+    box-shadow: 0 5px 50px #0005;
+    background: #e9e9e9;
+    margin: 0 0 5vh;
+    height: 800px;
+    
+    h3 {
+      font-size: 5vh;
+      padding: 5vh 20px;
+      font-weight: bold;
+      text-align: center;
+      position: relative;
+      align-self: center;
+      
+      .left, .right {
+        position: absolute;
+        top: 50%;
+        margin-top: 0px;
+        border-bottom: 2px solid #29688c;
+      }
+
+      .left {
+        right: 100%;
+        left: -9999px;
+      }
+      
+      .right {
+        left: 100%;
+        right: -9999px;
+      }
+    }
+  }
+  
+  &.hosting {
+    height: 600px;
+  }
+  
+  &.programming {
+    background: #29688c;
+    background: linear-gradient(150deg, #020024 15%, #29688c 100%);
+    color: white;
+    position: relative;
+    min-height: auto;
+    height: 70vw;
+    max-height: 80vh;
+    min-height: 600px;
+    
+    section {
+    }
+    
+    aside {
+      align-self: flex-start;
+      position: relative;
+      z-index: 2;
+      margin-top: 5vh;
+      flex: 1 1 auto;
+      width: 90%;
+      max-width: 1440px;
+      
+      .item {
+        width: 50%;
+        min-width: 500px;
+        text-align: left;
+      }
+    }
+    
+    h3 {
+      align-self: flex-start;
+      padding: 10px 0 40px;
+    }
+    
+    a {
+      border-color: white;
+      color: white;
+      align-self: flex-start;
+    }
+    
+    .image {
+      position: absolute;
+      right: 0;
+      bottom: 0;
+      width: 87%;
+      height: 90%;
+      max-width: none;
+      background-position: right bottom;
+      background-size: contain;
+    }
+  }
+  
+  &.video {
+    min-height: 70vh;
+  }
+}
+
+@media only screen and (max-width: 810px) {
+  article.solution h3 {
+    font-size: 2em;
+  }
+}
+
+@media only screen and (max-width: 800px) {
+  article.programming {
+    max-height: none;
+    min-height: auto;
+    padding: 0 40px 300px;
+    
+    section {
+    }
+    
+    aside {
+      margin-top: 10px;
+      width: 100%;
+
+      .item {
+        width: 100%;
+        min-width: auto;
+      }
+    }
+    
+    h3 {
+      align-self: center;
+    }
+    
+    .image {
+      width: 100%;
+      height: 300px;
+      max-width: none;
+      background-position: right bottom;
+      background-size: contain;
+      transform: translate(50%, 0);
+    }
+    
+    .visible.image {
+      transform: translate(0px, 0px);
+    }
+  }
+}
diff --git a/app/hosting/hosting.styl b/app/hosting/hosting.styl
new file mode 100644
index 0000000..41f867d
--- /dev/null
+++ b/app/hosting/hosting.styl
@@ -0,0 +1,202 @@
+header.hosting {
+  h1 {
+    font-size: 4.3vw;
+    margin-bottom: 10px;
+  }
+  h2 {
+    font-size: 2.5vw;
+  }
+}
+
+article {
+  &.hostintro {
+    .image {
+      transform: translate(-50%, 0px);
+    }
+    
+    .visible.image {
+      transform: translate(0px, 0px);
+    }
+  }
+  
+  &.hoststorage {
+    background: #29688c;
+    background: linear-gradient(150deg, #020024 15%, #29688c 100%);
+    color: white;
+    position: relative;
+    height: 80vh;
+    min-height: 600px;
+    
+    section {
+      justify-content: flex-end;
+    }
+    
+    aside {
+      align-items: center;
+      max-width: none;
+
+      .item {
+        width: 100%;
+        max-width: 600px;
+        text-align: left;
+      }
+    }
+    
+    h3 {
+      align-self: flex-start;
+      padding: 10px 0 40px;
+    }
+    
+    .image {
+      position: absolute;
+      left: 0;
+      bottom: 0;
+      width: 50%;
+      height: 90%;
+      max-width: none;
+      background-position: left center;
+      background-size: contain;
+      transform: translate(-50%, 0px);
+    }
+    
+    .visible.image {
+      transform: translate(0px, 0px);
+    }
+  }
+  
+  &.hostmanaged {
+    position: relative;
+    height: 80vh;
+    min-height: 600px;
+    
+    section {
+      justify-content: flex-end;
+    }
+    
+    aside {
+      align-items: center;
+      max-width: none;
+
+      .item {
+        padding-left: 20px;
+        width: 100%;
+        max-width: 600px;
+        text-align: left;
+      }
+    }
+    
+    h3 {
+      align-self: flex-start;
+      padding: 10px 0 40px;
+    }
+    
+    .image {
+      position: absolute;
+      left: 0;
+      bottom: 0;
+      width: 50%;
+      height: 90%;
+      max-width: none;
+      background-position: left center;
+      background-size: contain;
+      transform: translate(-50%, 0px);
+    }
+    
+    .visible.image {
+      transform: translate(0px, 0px);
+    }
+  }
+}
+
+@media only screen and (max-width: 800px) {
+  header.hosting {
+    h1 {
+      font-size: 2.3em;
+    }
+    h2 {
+      font-size: 1.5em;
+    }
+  }
+  
+  article {
+    &.hostintro {
+      h3 {
+        padding: 30px 0 30px;
+      }
+      
+      .image {
+        transform: translate(0, 50%);
+      }
+      
+      .visible.image {
+        transform: translate(0px, 0px);
+      }
+    }
+    
+    &.hoststorage {
+      min-height: auto;
+      padding: 0;
+
+      section {
+        justify-content: flex-start;
+        padding-bottom: 0;
+      }
+      
+      aside {
+        order: 1;
+        padding: 0 50px;
+      }
+
+      .image {
+        width: 100%;
+        height: auto;
+        background-position: center;
+        padding-top: 66%;
+        position: relative;
+        order: 2;
+      }
+    }
+    
+    &.hostmanaged {
+      min-height: auto;
+      padding: 0;
+      
+      section {
+        justify-content: flex-start;
+        padding-bottom: 0;
+      }
+      
+      aside {
+        order: 1;
+        padding: 0 50px;
+      }
+      
+      aside .item {
+        padding-left: 0;
+      }
+      .image {
+        position: relative;
+        width: 100%;
+        padding-top: 68%;
+        height: auto;
+        order: 2;
+      }
+    }
+  }
+}
+
+@media only screen and (max-width: 500px) {
+  article {
+    &.hoststorage {
+      aside {
+        padding: 0 10px;
+      }
+    }
+    
+    &.hostmanaged {
+      aside {
+        padding: 0 10px;
+      }
+    }
+  }
+}
diff --git a/app/styl/main.styl b/app/main.styl
similarity index 56%
rename from app/styl/main.styl
rename to app/main.styl
index 5fab2b3..cbc0def 100644
--- a/app/styl/main.styl
+++ b/app/main.styl
@@ -1,4 +1,32 @@
-@require 'reset'
+/* http://meyerweb.com/eric/tools/css/reset/ 
+   v2.0 | 20110126
+   License: none (public domain)
+*/
+
+html, body, div, span,
+h1, h2, h3, h4, h5, h6, p, a, img, form, label, input {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  font-size: 100%;
+  font: inherit;
+  vertical-align: baseline;
+}
+
+div, span, h1, h2, h3, h4, h5, h6, p, a, img, form, label, input,
+header, nav, main, article, section {
+  box-sizing: border-box;
+}
+
+body {
+    line-height: 1;
+    font-family: Tahoma, sans-serif;
+    display: flex;
+    flex-direction: column;
+    min-height: 100vh;
+    color: black;
+    background: white;
+}
 
 #container {
   flex-grow: 2;
@@ -153,90 +181,8 @@ header {
       transform: translateY(0px);
     }
   }
-  
-  &.hosting {
-    h1 {
-      font-size: 4.3vw;
-      margin-bottom: 10px;
-    }
-    h2 {
-      font-size: 2.5vw;
-    }
-  }
-  
-  &.programming {
-    text-shadow: 0 0 30px black;
-    
-    nav a {
-      background-color: #0003;
-      border-radius: 20px;
-      box-shadow: 0 0 80px black;
-      text-shadow: 0 0 80px black;
-      opacity: 1;
-      color: #999;
-      transition: opacity 0.5 color 0.5s;
-      
-      &.title {
-        color: white;
-        opacity: 0.6;
-        
-        &:hover {
-          opacity: 1;
-        }
-      }
-      
-      &:hover {
-        color: white;
-      }
-      
-      &.active {
-        color: white;
-      }
-    }
-
-    h1 {
-      font-size: 5.8vw;
-      margin-bottom: 10px;
-    }
-    h2 {
-      font-size: 3.5vw;
-    }
-    
-    h1, h2 {
-    }
-  }
-  
-  &.streaming {
-    text-shadow: 0 0 40px black;
-
-    h1 {
-      font-size: 5.7vw;
-      margin-bottom: 10px;
-    }
-    h2 {
-      font-size: 3vw;
-    }
-  }
 }
 
-/*header {
-  margin-top: 4em;
-  display: flex;
-  flex-direction: column;
-  align-items: stretch;
-  max-height: 600px;
-  padding: 0 2em;
-  
-  h1 {
-    flex-grow: 2;
-    text-indent: -9999px;
-    padding-top: 96%;
-    background: url('./assets/logo.svg') center no-repeat transparent;
-    background-size: contain;
-    max-width: 400px;
-  }
-}*/
-
 main {
   display: flex;
   flex-direction: column;
@@ -335,262 +281,6 @@ article {
     opacity: 1;
     transform: translate(0px, 0px);
   }
-  
-  &.solution {
-    box-shadow: 0 5px 50px #0005;
-    background: #e9e9e9;
-    margin: 0 0 5vh;
-    height: 800px;
-    
-    h3 {
-      font-size: 5vh;
-      padding: 5vh 20px;
-      font-weight: bold;
-      text-align: center;
-      position: relative;
-      align-self: center;
-      
-      .left, .right {
-        position: absolute;
-        top: 50%;
-        margin-top: 0px;
-        border-bottom: 2px solid #29688c;
-      }
-
-      .left {
-        right: 100%;
-        left: -9999px;
-      }
-      
-      .right {
-        left: 100%;
-        right: -9999px;
-      }
-    }
-  }
-  
-  &.hosting {
-    height: 600px;
-  }
-  
-  &.programming {
-    background: #29688c;
-    background: linear-gradient(150deg, #020024 15%, #29688c 100%);
-    color: white;
-    position: relative;
-    min-height: auto;
-    height: 70vw;
-    max-height: 80vh;
-    min-height: 600px;
-    
-    section {
-    }
-    
-    aside {
-      align-self: flex-start;
-      position: relative;
-      z-index: 2;
-      margin-top: 5vh;
-      flex: 1 1 auto;
-      width: 90%;
-      max-width: 1440px;
-      
-      .item {
-        width: 50%;
-        min-width: 500px;
-        text-align: left;
-      }
-    }
-    
-    h3 {
-      align-self: flex-start;
-      padding: 10px 0 40px;
-    }
-    
-    a {
-      border-color: white;
-      color: white;
-      align-self: flex-start;
-    }
-    
-    .image {
-      position: absolute;
-      right: 0;
-      bottom: 0;
-      width: 87%;
-      height: 90%;
-      max-width: none;
-      background-position: right bottom;
-      background-size: contain;
-    }
-  }
-  
-  &.video {
-    min-height: 70vh;
-  }
-
-  &.hostintro {
-    .image {
-      transform: translate(-50%, 0px);
-    }
-    
-    .visible.image {
-      transform: translate(0px, 0px);
-    }
-  }
-  
-  &.hoststorage {
-    background: #29688c;
-    background: linear-gradient(150deg, #020024 15%, #29688c 100%);
-    color: white;
-    position: relative;
-    height: 80vh;
-    min-height: 600px;
-    
-    section {
-      justify-content: flex-end;
-    }
-    
-    aside {
-      align-items: center;
-      max-width: none;
-
-      .item {
-        width: 100%;
-        max-width: 600px;
-        text-align: left;
-      }
-    }
-    
-    h3 {
-      align-self: flex-start;
-      padding: 10px 0 40px;
-    }
-    
-    .image {
-      position: absolute;
-      left: 0;
-      bottom: 0;
-      width: 50%;
-      height: 90%;
-      max-width: none;
-      background-position: left center;
-      background-size: contain;
-      transform: translate(-50%, 0px);
-    }
-    
-    .visible.image {
-      transform: translate(0px, 0px);
-    }
-  }
-  
-  &.hostmanaged {
-    position: relative;
-    height: 80vh;
-    min-height: 600px;
-    
-    section {
-      justify-content: flex-end;
-    }
-    
-    aside {
-      align-items: center;
-      max-width: none;
-
-      .item {
-        padding-left: 20px;
-        width: 100%;
-        max-width: 600px;
-        text-align: left;
-      }
-    }
-    
-    h3 {
-      align-self: flex-start;
-      padding: 10px 0 40px;
-    }
-    
-    .image {
-      position: absolute;
-      left: 0;
-      bottom: 0;
-      width: 50%;
-      height: 90%;
-      max-width: none;
-      background-position: left center;
-      background-size: contain;
-      transform: translate(-50%, 0px);
-    }
-    
-    .visible.image {
-      transform: translate(0px, 0px);
-    }
-  }
-  
-  &.programmingintro {
-    .image {
-      transform: translate(-50%, 0px);
-    }
-    
-    .visible.image {
-      transform: translate(0px, 0px);
-    }
-  }
-  
-  &.programmingstore {
-    background: #29688c;
-    background: linear-gradient(30deg, #020024 15%, #29688c 100%);
-    color: white;
-    position: relative;
-    height: 80vh;
-    min-height: 600px;
-    
-    section {
-      justify-content: flex-start;
-    }
-    
-    aside {
-      align-items: center;
-      max-width: none;
-
-      .item {
-        width: 100%;
-        max-width: 600px;
-        text-align: left;
-      }
-    }
-    
-    h3 {
-      align-self: flex-start;
-      padding: 10px 0 40px;
-    }
-    
-    .image {
-      position: absolute;
-      right: 0;
-      top: 5%;
-      width: 50%;
-      height: 90%;
-      max-width: none;
-      background-position: center;
-      background-size: contain;
-      transform: translate(50%, 0px);
-    }
-    
-    .visible.image {
-      transform: translate(0px, 0px);
-    }
-  }
-  
-  &.programmingcontracting {
-    .image {
-      transform: translate(-50%, 0px);
-    }
-    
-    .visible.image {
-      transform: translate(0px, 0px);
-    }
-  }
 }
 
 footer {
@@ -725,12 +415,6 @@ footer {
   }
 }
 
-@media only screen and (max-width: 810px) {
-  article.solution h3 {
-    font-size: 2em;
-  }
-}
-
 @media only screen and (max-width: 800px) {
   header {
     .container nav {
@@ -762,34 +446,6 @@ footer {
         font-size: 1.5em;
       }
     }
-    
-    &.hosting {
-      h1 {
-        font-size: 2.3em;
-      }
-      h2 {
-        font-size: 1.5em;
-      }
-    }
-    
-    &.programming {
-      nav a {
-        &.title {
-          background-position: calc(50% - 60px) center;
-        }
-      }
-
-      h1 {
-        font-size: 5.8vw;
-        margin-bottom: 10px;
-      }
-      h2 {
-        font-size: 3.5vw;
-      }
-      
-      h1, h2 {
-      }
-    }
   }
   
   article {
@@ -813,160 +469,6 @@ footer {
         transform: translate(0, 50%);
       }
     }
-    
-    &.programming {
-      max-height: none;
-      min-height: auto;
-      padding: 0 40px 300px;
-      
-      section {
-      }
-      
-      aside {
-        margin-top: 10px;
-        width: 100%;
-
-        .item {
-          width: 100%;
-          min-width: auto;
-        }
-      }
-      
-      h3 {
-        align-self: center;
-      }
-      
-      .image {
-        width: 100%;
-        height: 300px;
-        max-width: none;
-        background-position: right bottom;
-        background-size: contain;
-        transform: translate(50%, 0);
-      }
-      
-      .visible.image {
-        transform: translate(0px, 0px);
-      }
-    }
-    
-    &.hostintro {
-      h3 {
-        padding: 30px 0 30px;
-      }
-      
-      .image {
-        transform: translate(0, 50%);
-      }
-      
-      .visible.image {
-        transform: translate(0px, 0px);
-      }
-    }
-    
-    &.hoststorage {
-      min-height: auto;
-      padding: 0;
-
-      section {
-        justify-content: flex-start;
-        padding-bottom: 0;
-      }
-      
-      aside {
-        order: 1;
-        padding: 0 50px;
-      }
-
-      .image {
-        width: 100%;
-        height: auto;
-        background-position: center;
-        padding-top: 66%;
-        position: relative;
-        order: 2;
-      }
-    }
-    
-    &.hostmanaged {
-      min-height: auto;
-      padding: 0;
-      
-      section {
-        justify-content: flex-start;
-        padding-bottom: 0;
-      }
-      
-      aside {
-        order: 1;
-        padding: 0 50px;
-      }
-      
-      aside .item {
-        padding-left: 0;
-      }
-      .image {
-        position: relative;
-        width: 100%;
-        padding-top: 68%;
-        height: auto;
-        order: 2;
-      }
-    }
-    
-    &.programmingintro {
-      .image {
-        transform: translate(0, 50%);
-      }
-      
-      .visible.image {
-        transform: translate(0px, 0px);
-      }
-      
-      h3 {
-        padding: 30px 0 30px;
-      }
-    }
-    
-    &.programmingstore {
-      aside {
-        order: 1;
-        flex: 0 1 auto;
-      }
-      
-      h3 {
-        align-self: flex-start;
-        padding: 10px 0 40px;
-      }
-      
-      .image {
-        position: relative;
-        order: 2;
-        width: 100%;
-        padding-top: 430px;
-        height: auto;
-        background-size: auto 100%;
-        background-position: center -17px;
-        transform: translate(0, 50%);
-      }
-      
-      .visible.image {
-        transform: translate(0px, 0px);
-      }
-    }
-    
-    &.programmingcontracting {
-      h3 {
-        padding: 30px 0 30px;
-      }
-      .image {
-        transform: translate(0, 50%);
-      }
-      
-      .visible.image {
-        transform: translate(0px, 0px);
-      }
-    }
   }
 }
 
@@ -985,18 +487,6 @@ footer {
     padding-left: 10px;
     padding-right: 10px;
     font-size: 0.8em;
-    
-    &.hoststorage {
-      aside {
-        padding: 0 10px;
-      }
-    }
-    
-    &.hostmanaged {
-      aside {
-        padding: 0 10px;
-      }
-    }
   }
   
   footer {
@@ -1009,113 +499,7 @@ footer {
   }
 }
 
-/* section,
-aside {
-  display: flex;
-  flex-direction: column;
-  
-  & > * {
-    max-width: 600px;
-    align-self: center;
-    text-align: center;
-  }
-}
-<a href="https://www.freepik.com/free-photos-vectors/business">Business vector created by pikisuperstar - www.freepik.com</a>
-section {
-  padding: 0.5em 1em 3em;
-
-  p {
-    font-size: 1.5em;
-    line-height: 1.2em;
-  }
-  
-  h5 {
-    margin-top: 1em;
-  }
-}
-
-aside {
-  border-top: 1px solid #333;
-  border-bottom: 1px solid #333;
-  background: #ddd;
-  padding: 1em 1em 0.6em;
-  margin: 2em 0 4em;
-  
-  span {
-    font-size: 0.9em;
-  }
-  
-  h3 {
-    font-size: 1.8em;
-    line-height: 2em;
-  }
-}
-
-.clients {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
-  margin-top: 1em;
-  
-  .client {
-    margin: 0 0.6em;
-    padding: 1em 0;
-    background-color: transparent;
-    background-position: center;
-    background-repeat: no-repeat;
-    background-size: contain;
-    height: 35px;
-    text-indent: -9999px;
-    
-    &.stjornarrad {
-      background-image: url('./assets/stjornarradid.svg');
-      width: 64px;
-    }
-    
-    &.aranja {
-      background-image: url('./assets/aranja.svg');
-      background-position: center 28px;
-      width: 100px;
-    }
-    
-    &.jokula {
-      background-image: url('./assets/jokula.png');
-      background-position: center 24px;
-      width: 120px;
-    }
-    
-    &.filadelfia {
-      background-image: url('./assets/filadelfia.png');
-      width: 67px;
-    }
-  }
-}
-
-footer {
-  flex-grow: 2;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: flex-end;
-  
-  span {
-    flex-grow: 2;
-    text-align: center;
-    font-size: 0.8em;
-    color: #999;
-    line-height: 1.5em;
-    padding: 1em;
-  }
-}
-
-@media only screen and (max-width: 640px) {
-  section p {
-    font-size: 1.3em;
-  }
-}
-
-@media only screen and (max-width: 500px) {
-  section p {
-    font-size: 1.1em;
-  }
-}*/
+@require 'front/front'
+@require 'hosting/hosting'
+@require 'programming/programming'
+@require 'streaming/streaming'
diff --git a/app/programming/programming.styl b/app/programming/programming.styl
new file mode 100644
index 0000000..1c83a9b
--- /dev/null
+++ b/app/programming/programming.styl
@@ -0,0 +1,185 @@
+header.programming {
+  text-shadow: 0 0 30px black;
+  
+  nav a {
+    background-color: #0003;
+    border-radius: 20px;
+    box-shadow: 0 0 80px black;
+    text-shadow: 0 0 80px black;
+    opacity: 1;
+    color: #999;
+    transition: opacity 0.5 color 0.5s;
+    
+    &.title {
+      color: white;
+      opacity: 0.6;
+      
+      &:hover {
+        opacity: 1;
+      }
+    }
+    
+    &:hover {
+      color: white;
+    }
+    
+    &.active {
+      color: white;
+    }
+  }
+
+  h1 {
+    font-size: 5.8vw;
+    margin-bottom: 10px;
+  }
+  h2 {
+    font-size: 3.5vw;
+  }
+  
+  h1, h2 {
+  }
+}
+
+article {
+  &.programmingintro {
+    .image {
+      transform: translate(-50%, 0px);
+    }
+    
+    .visible.image {
+      transform: translate(0px, 0px);
+    }
+  }
+  
+  &.programmingstore {
+    background: #29688c;
+    background: linear-gradient(30deg, #020024 15%, #29688c 100%);
+    color: white;
+    position: relative;
+    height: 80vh;
+    min-height: 600px;
+    
+    section {
+      justify-content: flex-start;
+    }
+    
+    aside {
+      align-items: center;
+      max-width: none;
+
+      .item {
+        width: 100%;
+        max-width: 600px;
+        text-align: left;
+      }
+    }
+    
+    h3 {
+      align-self: flex-start;
+      padding: 10px 0 40px;
+    }
+    
+    .image {
+      position: absolute;
+      right: 0;
+      top: 5%;
+      width: 50%;
+      height: 90%;
+      max-width: none;
+      background-position: center;
+      background-size: contain;
+      transform: translate(50%, 0px);
+    }
+    
+    .visible.image {
+      transform: translate(0px, 0px);
+    }
+  }
+  
+  &.programmingcontracting {
+    .image {
+      transform: translate(-50%, 0px);
+    }
+    
+    .visible.image {
+      transform: translate(0px, 0px);
+    }
+  }
+}
+
+@media only screen and (max-width: 800px) {
+  header.programming {
+    nav a {
+      &.title {
+        background-position: calc(50% - 60px) center;
+      }
+    }
+
+    h1 {
+      font-size: 5.8vw;
+      margin-bottom: 10px;
+    }
+    h2 {
+      font-size: 3.5vw;
+    }
+    
+    h1, h2 {
+    }
+  }
+  
+  article {
+    &.programmingintro {
+      .image {
+        transform: translate(0, 50%);
+      }
+      
+      .visible.image {
+        transform: translate(0px, 0px);
+      }
+      
+      h3 {
+        padding: 30px 0 30px;
+      }
+    }
+    
+    &.programmingstore {
+      aside {
+        order: 1;
+        flex: 0 1 auto;
+      }
+      
+      h3 {
+        align-self: flex-start;
+        padding: 10px 0 40px;
+      }
+      
+      .image {
+        position: relative;
+        order: 2;
+        width: 100%;
+        padding-top: 430px;
+        height: auto;
+        background-size: auto 100%;
+        background-position: center -17px;
+        transform: translate(0, 50%);
+      }
+      
+      .visible.image {
+        transform: translate(0px, 0px);
+      }
+    }
+    
+    &.programmingcontracting {
+      h3 {
+        padding: 30px 0 30px;
+      }
+      .image {
+        transform: translate(0, 50%);
+      }
+      
+      .visible.image {
+        transform: translate(0px, 0px);
+      }
+    }
+  }
+}
diff --git a/app/streaming/index.js b/app/streaming/index.js
index 56bcabd..01f8d30 100644
--- a/app/streaming/index.js
+++ b/app/streaming/index.js
@@ -72,7 +72,7 @@ var Streaming = {
       ),
       m('main', [
         // Solutions
-        m('article.hostintro', [
+        m('article.streamintro', [
           m('section', [
             m('div.image', {
               oncreate: function(subnode) {
diff --git a/app/streaming/streaming.styl b/app/streaming/streaming.styl
new file mode 100644
index 0000000..1b597f9
--- /dev/null
+++ b/app/streaming/streaming.styl
@@ -0,0 +1,39 @@
+header.streaming {
+  text-shadow: 0 0 40px black;
+
+  h1 {
+    font-size: 5.7vw;
+    margin-bottom: 10px;
+  }
+  h2 {
+    font-size: 3vw;
+  }
+}
+
+article.streamintro {
+  .image {
+    transform: translate(-50%, 0px);
+  }
+  
+  .visible.image {
+    transform: translate(0px, 0px);
+  }
+}
+
+@media only screen and (max-width: 800px) {
+  article {
+    &.streamintro {
+      h3 {
+        padding: 30px 0 30px;
+      }
+      
+      .image {
+        transform: translate(0, 50%);
+      }
+      
+      .visible.image {
+        transform: translate(0px, 0px);
+      }
+    }
+  }
+}
diff --git a/app/styl/fonts.styl b/app/styl/fonts.styl
deleted file mode 100644
index 62ed592..0000000
--- a/app/styl/fonts.styl
+++ /dev/null
@@ -1,59 +0,0 @@
-/* https://fonts.google.com/
-   License: Apache 2.0
-*/
-
-/*@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 300;
-  src: local('Roboto Light'), local('Roboto-Light'), url('./assets/fonts/Roboto-Light.ttf') format('truetype');
-}
-
-@font-face {
-  font-family: 'Roboto';
-  font-style: italic;
-  font-weight: 300;
-  src: local('Roboto Light'), local('Roboto-Light'), url('./assets/fonts/Roboto-LightItalic.ttf') format('truetype');
-}*/
-
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 400;
-  src: local('Roboto Regular'), local('Roboto-Regular'), url('./assets/fonts/Roboto-Regular.ttf') format('truetype');
-}
-
-/*@font-face {
-  font-family: 'Roboto';
-  font-style: italic;
-  font-weight: 400;
-  src: local('Roboto Italic'), local('Roboto-Italic'), url('./assets/fonts/Roboto-ItalicItalic.ttf') format('truetype');
-}
-
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 700;
-  src: local('Roboto Bold'), local('Roboto-Bold'), url('./assets/fonts/Roboto-Bold.ttf') format('truetype');
-}
-
-@font-face {
-  font-family: 'Roboto';
-  font-style: italic;
-  font-weight: 700;
-  src: local('Roboto Bold'), local('Roboto-Bold'), url('./assets/fonts/Roboto-BoldItalic.ttf') format('truetype');
-}
-
-@font-face {
-  font-family: 'Roboto';
-  font-style: normal;
-  font-weight: 900;
-  src: local('Roboto Black'), local('Roboto-Black'), url('./assets/fonts/Roboto-Black.ttf') format('truetype');
-}
-
-@font-face {
-  font-family: 'Roboto';
-  font-style: italic;
-  font-weight: 900;
-  src: local('Roboto Black'), local('Roboto-Black'), url('./assets/fonts/Roboto-BlackItalic.ttf') format('truetype');
-}*/
diff --git a/app/styl/reset.styl b/app/styl/reset.styl
deleted file mode 100644
index 852cccf..0000000
--- a/app/styl/reset.styl
+++ /dev/null
@@ -1,29 +0,0 @@
-/* http://meyerweb.com/eric/tools/css/reset/ 
-   v2.0 | 20110126
-   License: none (public domain)
-*/
-
-html, body, div, span,
-h1, h2, h3, h4, h5, h6, p, a, img, form, label, input {
-  margin: 0;
-  padding: 0;
-  border: 0;
-  font-size: 100%;
-  font: inherit;
-  vertical-align: baseline;
-}
-
-div, span, h1, h2, h3, h4, h5, h6, p, a, img, form, label, input,
-header, nav, main, article, section {
-  box-sizing: border-box;
-}
-
-body {
-    line-height: 1;
-    font-family: Tahoma, sans-serif;
-    display: flex;
-    flex-direction: column;
-    min-height: 100vh;
-    color: black;
-    background: white;
-}
diff --git a/package.json b/package.json
index 2a6dbe7..82eab09 100644
--- a/package.json
+++ b/package.json
@@ -6,14 +6,17 @@
   "scripts": {
     "build": "npm run build:styl && npm run build:js",
     "build:js": "browserify -p tinyify --no-commondir -o public/main.js app/main.js",
-    "build:styl": "stylus app/styl/main.styl -c --out public",
+    "build:styl": "stylus app/main.styl -c --out public",
     "watch": "run-p watch:js watch:styl",
     "watch:js": "watchify app/main.js -o public/main.js --debug",
-    "watch:styl": "stylus -w -m app/styl/main.styl --out public",
+    "watch:styl": "stylus -w -m app/main.styl --out public",
     "dev": "run-p watch start",
     "docker": "docker run -it --rm --name nfpis -p 3000:3000 -v \"$PWD\":/usr/src/app -w /usr/src/app node:slim",
+    "wdocker": "docker run -it --rm --name nfpis -p 3000:3000 -v \"%CD%\":/usr/src/app -w /usr/src/app node:slim",
     "docker:dev": "npm run docker -- npm run dev",
     "docker:install": "npm run docker -- npm install",
+    "wdocker:install": "npm run wdocker -- npm install",
+    "wdocker:dev": "npm run wdocker -- npm run dev",
     "start": "spserver -f ./public/index.html -s ./public -p 3000",
     "test": "echo \"Error: no test specified\" && exit 1"
   },