Update to site

sass/oscailte/homepage/_hero_unit.scss

@@ -0,0 +1,76 @@
+.hero {
+  background-color: $grayDarker;
+  background-position: 0 50%;
+  -webkit-background-size: cover;
+     -moz-background-size: cover;
+       -o-background-size: cover;
+          background-size: cover;
+  border-bottom: 1px solid $white;
+  color: $white;
+  font-weight: bold;
+  margin-top: -2em;
+  margin-bottom: 1.5em;
+  padding: 50px 0;
+  position: relative;
+
+  &::before {
+    background: url("../images/matrix.png") 0 0 rgba(0, 0, 0, 0.35);
+    box-shadow: inset 0 0 5px $black;
+    content: "";
+    display: block;
+    position: absolute;
+      top: 0; right: 0; bottom: 0; left: 0;
+    z-index: 5;
+  }
+
+  > .grid-wrapper {
+    position: relative;
+    z-index: 7;
+  }
+
+  .credit {
+    font-size: 0.75em;
+    font-style: italic;
+    position: absolute;
+      bottom: 0; right: 10px;
+    z-index: 7;
+    a {
+      border-bottom: 1px solid;
+      color: $white;
+      text-decoration: none;
+    }
+    .licence {
+      border: none;
+    }
+  }
+
+  .avatar {
+    @media only screen and (max-width: $lap-end){
+      margin-bottom: 30px;
+    }
+    text-align: center;
+    img {
+      @include border-radius(100%);
+      border: 10px solid $primary-color;
+    }
+  }
+
+  h1 {
+    font-size: 3.5em;
+    line-height: 1em;
+    text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.75);
+  }
+
+  hr {
+    @extend .divider;
+    box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.75);
+  }
+
+  p {
+    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.75);
+    small {
+      color: $grayLighter;
+      font-size: .65em;
+    }
+  }
+}

sass/oscailte/homepage/_home.scss

@@ -0,0 +1,44 @@
+.usp {
+  text-align: center;
+
+  @media only screen and (min-width: $lap-start) and (max-width: $lap-end){
+    margin-bottom: 25px;
+  }
+
+  .icon {
+    i {
+      @include border-radius(50%);
+      border: 10px solid $blue;
+      color: $grayDarker;
+      display: inline-block;
+      font-size: 6em;
+      height: 1.85em;
+      line-height: normal;
+      padding: 0.3em;
+      width: 1.85em;
+    }
+  }
+
+  .title {
+    color: $grayDarker;
+    font-size: 1.1em;
+    line-height: 3em;
+    margin: 0;
+    text-align: center;
+    text-transform: capitalize;
+
+    + hr {
+      margin: 0;
+      margin-bottom: 1em;
+    }
+  }
+
+  hr {
+    @extend .divider;
+    margin-bottom: 1em;
+  }
+
+  p {
+    text-align: left;
+  }
+}