Built out kopalife featured work

public/language/en-AU.jsx

@@ -52,7 +52,26 @@ module.exports = {
       },
       "work": {
         "heading": "Some of my work",
-        "paragraph": "Interested to see what I can do? Check out some of my personal favourite projects that I have built!"
+        "paragraph": "Interested to see what I can do? Check out some of my personal favourite projects that I have built!",
+        "kopa": {
+          "heading": "KOPA Life",
+          "description": () => { return (
+            <Fragment>
+              <p>
+                KOPA Life is a modern modular furniture designer in Australia.
+                Since 2016 they have created many modern design pieces, including
+                their signature KUBE, a modular couch available in removable and
+                attachable components.
+              </p>
+              <p>
+                The website features a modern minimalistic design, with a focus
+                on great imagery, and a fully fledged in-site 3D Couch builder,
+                which allows you to design your perfect couch and hit one button
+                to purchase the couch you've designed.
+              </p>
+            </Fragment>
+          ); }
+        }
       },
       "admin": {
         "heading": "Systems Admin",

public/page/about/sections/ExistingWorkSection.jsx

@@ -44,6 +44,7 @@ const ExistingWorkFrame = (props) => {
     fakeURL = "https:" + fakeURL;
   }
   return (
+    <ElementScrollFader from={props.from}>
       <Window95>
         <TitleBar buttons={[
           <Minimize key="Minimize" disabled />,
@@ -68,6 +69,7 @@ const ExistingWorkFrame = (props) => {
           </a>
         </Frame>
       </Window95>
+    </ElementScrollFader>
   );
 };
 
@@ -78,7 +80,7 @@ export default (props) => {
       <PageBoundary small>
         <ElementScrollFader from="left">
           <ContentBox box>
-            <Title>
+            <Title className="u-text-center">
               { Language.get("pages.about.work.heading") }
             </Title>
             <Paragraph>
@@ -96,12 +98,19 @@ export default (props) => {
           <Split padded>
             <ExistingWorkFrame
               title="KOPA Life"
-              href="//www.kopalife.com"
+              href="//www.kopalife.com/product/kube-customise"
+              from="top"
               src={ require('./../../../images/work-showcase/kopalife.png') }
             />
           </Split>
 
           <Split padded>
+            <ElementScrollFader from="bottom">
+              <ContentBox box>
+                <Heading1>{ Language.get("pages.about.work.kopa.heading") }</Heading1>
+                { Language.get("pages.about.work.kopa.description") }
+              </ContentBox>
+            </ElementScrollFader>
           </Split>
         </SplitSection>