diff --git a/index.html b/index.html
index bc62ead..fc6a86e 100644
--- a/index.html
+++ b/index.html
@@ -4,15 +4,39 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>animated particles</title>
+    <link rel="stylesheet"
+        href="https://fonts.googleapis.com/css2?family=Montserrat&display=block"
+        crossorigin="anonymous">
     <link rel="stylesheet"
         href="css/index.min.css"
         crossorigin="anonymous"/>
 </head>
 <body onload='particles(avoidMouse=false, speed=15)'>
     <div class="wrapper">
-        <h1>Lorem ipsum dolor sit amet.</h1>
-        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ut delectus quibusdam est rem sequi consectetur doloremque. Laborum suscipit, incidunt excepturi veniam rerum quis accusamus eaque, obcaecati modi doloremque eveniet ratione!</p>
-        <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Repellat quod, ut aliquid doloremque impedit debitis similique dicta perferendis nam iusto consequuntur obcaecati nemo, <a href="#">perspiciatis nobis ipsum</a> nostrum eos quasi est quidem reiciendis ducimus beatae repudiandae. Facere mollitia incidunt recusandae, voluptatem ullam placeat fugiat autem nihil. Hic quia accusantium nesciunt dicta.</p>
+        <div class="spacer"></div>
+        <header>
+            <h1>ab-particles</h1>
+            <h2>simple, lightweight vanilla-javascript particle animation</h2>
+        </header>
+        <main>
+            <p>This is a sample page showing off some settings of this tiny (5kb!) script. No external libraries, no external configuration files, no jQuery. Just javascript and easy colour styling via CSS variables.</p>
+            <p>Configuration details, download and source at <a href="http://git.asifbacchus.app/asif/ab-particles.git">my git repo</a>.</p>
+            <p>Thanks for checking it out!</p>
+        </main>
+        <div class="spacer"></div>
+        <footer>
+            <p>Design, code and content appearing on this site is developed by
+            <a href="https://asifbacchus.com">Asif Bacchus</a> ('author') and
+            may be freely used and redistributed in accordance with the <a
+            href="https://git.asifbacchus.app/asif/ab-particles/LICENSE">license</a>
+            appearing in the <a
+            href="https://git.asifbacchus.app/asif/ab-particles.git">content
+            repo</a>. Author provides no warranties, guarantees or implications
+            of suitability and disclaims any and all responsibility arising from
+            the usage of anything appearing on or linked to this page for any
+            purpose whatsoever. Copyright 2020 Asif Bacchus. Some Rights
+            Reserved.</p>
+        </footer>
     </div>
     <canvas id="particles"></canvas>
     <!-- javascript -->
diff --git a/scss/_palette.scss b/scss/_palette.scss
index b27fd06..a917e42 100644
--- a/scss/_palette.scss
+++ b/scss/_palette.scss
@@ -1,8 +1,10 @@
 // colours used thoughout site
 :root {
     --col-bg: #212121;
-    --col-particle: #536878;
-    --col-particle-stroke: #035096;
-    --col-particle-stroke-hover: #0892d0;
+    --col-link: #bbdefb;
     --col-text: #ebe7c5;
+
+    --col-particle-stroke-hover: #0892d0;
+    --col-particle-stroke: #035096;
+    --col-particle: #536878;
 }
diff --git a/scss/index.scss b/scss/index.scss
index fd14ea1..5edb30c 100644
--- a/scss/index.scss
+++ b/scss/index.scss
@@ -9,12 +9,37 @@ import partials
 body {
     background-color: var(--col-bg);
     color: var(--col-text);
+    font-family: 'Montserrat', sans-serif;
+    font-size: 1.6rem;
+    line-height: 1.6rem;
+}
+
+main {
+    flex: 1;
+}
+
+header {
+    align-items: center;
+    display: flex;
+    flex-direction: column;
+}
+
+footer {
+    display: flex;
+    font-size: 1.5rem;
+    line-height: 1.85rem;
 }
 
 h1 {
     font-size: 5rem;
     line-height: 5rem;
-    margin-bottom: 3rem;
+    margin-bottom: 1rem;
+}
+
+h2 {
+    font-size: 3rem;
+    line-height: 3rem;
+    margin-bottom: 5rem;
 }
 
 p {
@@ -23,19 +48,16 @@ p {
 
 a {
     color: inherit;
+    font-weight: bold;
+    text-decoration: underline;
+    transition: all 0.5s ease;
     &:hover,
     &:focus,
     &:active {
-        color: red;
+        color: var(--col-link);
     }
 }
 
-.wrapper {
-    display: flex;
-    flex-direction: column;
-    padding: 2rem;
-}
-
 #particles {
     height: 100%;
     left: 0;
@@ -44,3 +66,14 @@ a {
     width: 100%;
     z-index: -999;
 }
+
+.wrapper {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    min-height: 100%;
+    padding: 2rem;
+}
+ .spacer {
+     flex: 1;
+ }
