diff --git a/src/assets/pages/resources-landing-page.html b/src/assets/pages/resources-landing-page.html
index 3eab02e..fcf3192 100644
--- a/src/assets/pages/resources-landing-page.html
+++ b/src/assets/pages/resources-landing-page.html
@@ -89,7 +89,7 @@
 
                 <div class="album py-5">
                     <div class="container">
-                        <input type="text" class="form-control w-100 bg-info border border-boxborder text-searchfont"
+                        <input type="text" class="form-control w-100 bg-info border border-boxborder text-searchfont input"
                                placeholder="Search (What kind of resource are you looking for?)"
                                aria-label="Search">
                     </div>
diff --git a/src/assets/pages/styles/resources-landing-page.scss b/src/assets/pages/styles/resources-landing-page.scss
index 1d000ed..cf1f04f 100644
--- a/src/assets/pages/styles/resources-landing-page.scss
+++ b/src/assets/pages/styles/resources-landing-page.scss
@@ -129,18 +129,6 @@ body {
   text-align: left;
 }
 
-.input::-webkit-input-placeholder { 
-  color: searchfont !important; 
-}  /* WebKit, Blink, Edge */
-
-.input:-moz-placeholder { 
-  color: searchfont !important; 
-}  /* Mozilla Firefox 4 to 18 */
-
-.input::-moz-placeholder { 
-  color: searchfont !important; 
-}  /* Mozilla Firefox 19+ */
-
 .category-header p {
   margin: 0 0 .15em 0;
   padding-left: 1rem; 
diff --git a/src/assets/pages/styles/theme-base.scss b/src/assets/pages/styles/theme-base.scss
index 122da3b..4701f4f 100644
--- a/src/assets/pages/styles/theme-base.scss
+++ b/src/assets/pages/styles/theme-base.scss
@@ -1,4 +1,5 @@
 @use "sass:map";
+
 $enable-rounded: true !default;
 
 
@@ -11,27 +12,27 @@ $enable-rounded: true !default;
   cursor: pointer;
 }
 
-.web-card-background{
+.web-card-background {
   background-color: map-get($theme-colors, inactivecard);
 }
 
-.web-card-background:hover{
+.web-card-background:hover {
   background-color: map-get($theme-colors, activecard);
 }
 
-.web-card-background:hover .text-header{
+.web-card-background:hover .text-header {
   color: map-get($theme-colors, headertextcolorhover);
 }
 
-.web-card-background:hover .text-paragraph{
+.web-card-background:hover .text-paragraph {
   color: map-get($theme-colors, paragraphtextcolorhover);
 }
 
-.web-card-background:hover .web-card-image-background{
+.web-card-background:hover .web-card-image-background {
   background-color: map-get($theme-colors, webcardimagebackgroundhover);
 }
 
-.web-card-image-background{
+.web-card-image-background {
   background-color: map-get($theme-colors, webcardimagebackground);
   border-radius: 50%;
 }
@@ -40,7 +41,7 @@ $enable-rounded: true !default;
   color: map-get($theme-colors, headertextcolor);
 }
 
-.text-paragraph{
+.text-paragraph {
   color: map-get($theme-colors, paragraphtextcolor);
 }
 
@@ -48,11 +49,11 @@ $enable-rounded: true !default;
   overflow: hidden;
 }
 
-html{
+html {
   height: 100%
 }
 
-body{
+body {
   height: 100%;
 }
 
@@ -73,4 +74,8 @@ body{
   border-color: map-get($theme-colors, activeborderaccordion);
 }
 
+.form-control::-webkit-input-placeholder {
+  color: map-get($theme-colors, searchfont) !important;
+}
+
 
diff --git a/src/assets/pages/styles/theme-dark.scss b/src/assets/pages/styles/theme-dark.scss
index d53c3a1..afc9d1e 100644
--- a/src/assets/pages/styles/theme-dark.scss
+++ b/src/assets/pages/styles/theme-dark.scss
@@ -11,7 +11,7 @@ $theme-colors: (
         "activecard": #707070,
         "boxborder": #272727,
         "activecardfont":#e1e4e8,
-        "searchfont": #808080,
+        "searchfont": grey,
         "sidebarfill": #202023,
         "sidebartext": #808080,
         "webcardimagebackground": #707070,