diff --git a/package.json b/package.json
index ae0e750..3a9982d 100644
--- a/package.json
+++ b/package.json
@@ -13,7 +13,7 @@
     "clean": "gulp clean",
     "build": "gulp",
     "start": "npm run build && electron ./build",
-    "start-fast": "gulp runFast && electron ./build",
+    "start-fast": "gulp runFast && electron ./build --debug",
     "dev": "npm run build && electron ./build --debug",
     "package": "npm-run-all package:*",
     "package:mac": "electron-packager ./build --overwrite --platform=darwin --arch=x64 --out=out --icon=assets/images/app.icns --osx-sign.identity='Developer ID Application: GitHub' --extend-info=assets/mac/info.plist",
diff --git a/src/assets/pages/resources-landing-page.html b/src/assets/pages/resources-landing-page.html
index e8f312f..d899780 100644
--- a/src/assets/pages/resources-landing-page.html
+++ b/src/assets/pages/resources-landing-page.html
@@ -11,10 +11,8 @@
     <script>require('popper.js')</script>
     <script>require('bootstrap')</script>
 </head>
-<body hidden ONLOAD="$('body').removeAttr('hidden');">
-
+<body hidden ONLOAD="$('body').removeAttr('hidden');" class="bg-secondary">
 <header>
-    
     <div class="collapse bg-secondary" id="navbarHeader">
         <div class="container">
             <div class="row">
@@ -63,8 +61,10 @@
     </div>
 </main>
 
+</body>
+
 <footer class="page-footer">
-    <div class="container">
+    <div class="container" style="background:#ff0000">
         <p class="float-left text-warning">
             <a href="Design3.html">Design 3</a>
         <p class="float-right text-warning">
@@ -72,7 +72,6 @@
         </p>
     </div>
 </footer>
-</body>
 <script src="scripts/tsUtil.js"></script>
 <script>loadTSTarget("themes.js");</script>
 <script src="scripts/index_app.js"></script>
diff --git a/src/assets/pages/styles/resources-landing-page.scss b/src/assets/pages/styles/resources-landing-page.scss
index c4701b6..591a213 100644
--- a/src/assets/pages/styles/resources-landing-page.scss
+++ b/src/assets/pages/styles/resources-landing-page.scss
@@ -30,6 +30,14 @@
     color: #searchfont;
 }
 
+.card-image-background{
+  display: flex;
+}
+
+.text-align-left{
+  text-align: left;
+}
+
 .form-control::-webkit-input-placeholder { color: searchfont; }  /* WebKit, Blink, Edge */
 .form-control:-moz-placeholder { color: searchfont; }  /* Mozilla Firefox 4 to 18 */
 .form-control::-moz-placeholder { color: searchfont; }  /* Mozilla Firefox 19+ */
diff --git a/src/assets/pages/styles/theme-base.scss b/src/assets/pages/styles/theme-base.scss
index 83ecbc6..07e2ec9 100644
--- a/src/assets/pages/styles/theme-base.scss
+++ b/src/assets/pages/styles/theme-base.scss
@@ -19,3 +19,23 @@ $enable-rounded: true !default;
   background-color: map-get($theme-colors, activecard);
 }
 
+.web-card-image-background{
+  background-color: map-get($theme-colors, webcardimagebackground);
+  border-radius: 50%;
+}
+
+.text-header {
+  color: map-get($theme-colors, headertextcolor);
+}
+
+.text-paragraph{
+  color: map-get($theme-colors, paragraphtextcolor);
+}
+
+html{
+  height:100%
+}
+
+body{
+  height:100%;
+}
\ No newline at end of file
diff --git a/src/assets/pages/styles/theme-dark.scss b/src/assets/pages/styles/theme-dark.scss
index 16b96d8..0473b1d 100644
--- a/src/assets/pages/styles/theme-dark.scss
+++ b/src/assets/pages/styles/theme-dark.scss
@@ -10,6 +10,11 @@ $theme-colors: (
         "boxborder": #55555c,
         "activecardfont":#e1e4e8,
         "searchfont": #808080,
+        "webcardimagebackground": #aa33ff,
+        "paragraphtextcolor": #ffffff,
+        "headertextcolor": #aaaaaa
 );
 
+
+
 @import "theme-base";
\ No newline at end of file
diff --git a/src/assets/pages/styles/theme-light.scss b/src/assets/pages/styles/theme-light.scss
index c0873d2..a6f1afe 100644
--- a/src/assets/pages/styles/theme-light.scss
+++ b/src/assets/pages/styles/theme-light.scss
@@ -1,4 +1,3 @@
-
 $theme-colors: (
         "primary": #2c2c2c,
         "secondary": #e5e5e5,
@@ -7,11 +6,13 @@ $theme-colors: (
         "warning": #700000,
         "inactivecard": #ffffff,
         "activecard": #002752,
-        "boxborder": #c0c2c6, 
+        "boxborder": #c0c2c6,
         "activecardfont":#e1e4e8,
         "searchfont": #2c2c2c,
+        "webcardimagebackground": #000000,
+        "paragraphtextcolor": #000000,
+        "headertextcolor": #444444
 );
 
-//$font-color: #000;
 
 @import "theme-base";
\ No newline at end of file
diff --git a/src/assets/views/web-card.mustache b/src/assets/views/web-card.mustache
index 9afa951..53d59b5 100644
--- a/src/assets/views/web-card.mustache
+++ b/src/assets/views/web-card.mustache
@@ -1,10 +1,10 @@
 <html lang="en">
 <div class="col-md-4 web-card" id="{{{id}}}" >
     <div class="card mb-4 shadow-sm web-card-background">
-        <div class="card-body">
-            <h7 class="card-text text-white" style="text-align:center">{{title}}</h7>
-            <p class="card-text text-success">{{description}} </p>
-            <div class="d-flex justify-content-between align-items-center">
+        <div class="card-body  text-center">
+            <h7 class="card-text text-header" style="text-align:center">{{title}}</h7>
+            <p class="card-text text-paragraph text-align-left">{{description}} </p>
+            <div class="d-inline-block mx-auto justify-content-between align-items-center web-card-image-background">
                 <img class="rounded-circle mx-auto d-block img-fluid"
                      src="{{{imgPath}}}" alt="{{{altText}}}"
                      style="max-height:50px">
