diff --git a/src/app/promoScreen/PromoScreen.js b/src/app/promoScreen/PromoScreen.js
index 777f3c7..a19e4a2 100644
--- a/src/app/promoScreen/PromoScreen.js
+++ b/src/app/promoScreen/PromoScreen.js
@@ -2,36 +2,39 @@ import React from 'react'
 import FeatureCol from '../../common/FeatureCol'
 import colobus from '../../assets/colobus.png'
 import Login from '../Auth/Login'
+import Styles from './promoScreen.module.css'
 
 const PromoScreen = () => (
   <div style={{ position: 'relative', overflow: 'hidden' }}>
     <div
-      style={{
-        position: 'absolute',
-        zIndex: -2,
-        width: '3000px',
-        height: '1500px',
-        top: '-40%',
-        left: '15%',
-        transform: 'translateX(-4%)',
-        background: 'linear-gradient(rgba(255, 222, 222, 0.5), #DDFFE7)',
-        borderRadius: '40%',
-        overflow: 'hidden',
-      }}
+      style={Styles.gradientBall}
+      // style={{
+      //   position: 'absolute',
+      //   zIndex: -2,
+      //   width: '3000px',
+      //   height: '1500px',
+      //   top: '-40%',
+      //   left: '15%',
+      //   transform: 'translateX(-4%)',
+      //   background: 'linear-gradient(rgba(255, 222, 222, 0.5), #DDFFE7)',
+      //   borderRadius: '40%',
+      //   overflow: 'hidden',
+      // }}
     />
     <div
-      style={{
-        position: 'absolute',
-        zIndex: -2,
-        width: '500px',
-        height: '500px',
-        top: '49%',
-        left: '0%',
-        transform: 'translateX(-4%)',
-        backgroundColor: '#DDFFE7',
-        borderRadius: '50%',
-        overflow: 'hidden',
-      }}
+      style={Styles.circle}
+      // style={{
+      //   position: 'absolute',
+      //   zIndex: -2,
+      //   width: '500px',
+      //   height: '500px',
+      //   top: '49%',
+      //   left: '0%',
+      //   transform: 'translateX(-4%)',
+      //   backgroundColor: '#DDFFE7',
+      //   borderRadius: '50%',
+      //   overflow: 'hidden',
+      // }}
     />
     <div id="topmenu">
       <ul>
@@ -88,17 +91,17 @@ const PromoScreen = () => (
           <div className="footercolumn col-3">
             <h3>FOLLOW US</h3>
             <ul>
-              <li>Facebook</li>
-              <li>Instagram</li>
-              <li>Twitter</li>
+              <li><a href="www.wearepercent.com" target="_blank">Facebook</a></li>
+              <li><a href="www.wearepercent.com" target="_blank">Instagram</a></li>
+              <li><a href="www.wearepercent.com" target="_blank">Twitter</a></li>
             </ul>
           </div>
           <div className="footercolumn col-3">
             <h3>Company</h3>
             <ul>
-              <li>About</li>
-              <li>FAQ</li>
-              <li>Terms and Conditions</li>
+              <li><a href="www.wearepercent.com" target="_blank">About</a></li>
+              <li><a href="www.wearepercent.com" target="_blank">FAQ</a></li>
+              <li><a href="www.wearepercent.com" target="_blank">Terms and Conditions</a></li>
             </ul>
           </div>
         </div>
diff --git a/src/app/promoScreen/promoScreen.module.css b/src/app/promoScreen/promoScreen.module.css
new file mode 100644
index 0000000..16a87e9
--- /dev/null
+++ b/src/app/promoScreen/promoScreen.module.css
@@ -0,0 +1,25 @@
+.gradientBall {
+    position: absolute;
+    z-index: -2;
+    width: 3000px;
+    height: 1500px;
+    top: -40%;
+    left: 15%;
+    transform: translateX(-4%);
+    background: linear-gradient(rgba(255, 222, 222, 0.5), #DDFFE7);
+    border-radius: 40%;
+    overflow: hidden;
+}
+
+.circle {
+    position: absolute;
+    z-index: -2;
+    width: 500px;
+    height: 500px;
+    top: 49%;
+    left: 0%;
+    transform: translateX(-4%);
+    background-color: #DDFFE7;
+    border-radius: 50%;
+    overflow: hidden;
+}
\ No newline at end of file
diff --git a/src/common/FeatureCol.js b/src/common/FeatureCol.js
index 8d93753..86f32ce 100644
--- a/src/common/FeatureCol.js
+++ b/src/common/FeatureCol.js
@@ -4,7 +4,7 @@ const FeatureCol = ({ src, title, description }) => (
   <div style={{
     backgroundColor: 'rgba(196, 201, 255, 1)', borderRadius: 50, width: '80%',
   }} className="featurescolumn col-12 col-md-4">
-    <img src={src} alt='collobus'/>
+    <img src={src} alt='Collobus'/>
     <h2>{title}</h2>
     <p>{description}</p>
   </div>