diff --git a/src/components/footer/footer-styles.js b/src/components/footer/footer-styles.js
index acfb29b..c6afa5c 100644
--- a/src/components/footer/footer-styles.js
+++ b/src/components/footer/footer-styles.js
@@ -7,7 +7,7 @@ import {
 } from "../../style/variables"
 
 export const FooterContainer = styled.div`
-  background-color: rgb(0, 0, 0, 0.55);
+  background-color: ${colors.black_overlay};
   width: 100%;
   color: ${colors.white900};
   position: absolute;
diff --git a/src/components/footer/footer.js b/src/components/footer/footer.js
index a6e27d6..4814665 100644
--- a/src/components/footer/footer.js
+++ b/src/components/footer/footer.js
@@ -34,6 +34,7 @@ export default function footer({ data }) {
               sock_description
               sock_title
               address
+              footer_image_alt
               footer_image {
                 url
               }
@@ -53,7 +54,7 @@ export default function footer({ data }) {
         <FooterSection>
           <FooterImage>
             <img
-              alt="PowerHouse house footer background image"
+              alt={data.prismicFooter.data.footer_image_alt}
               src={data.prismicFooter.data.footer_image.url}
             />
           </FooterImage>
diff --git a/src/style/colors.js b/src/style/colors.js
index be398b7..caf71eb 100644
--- a/src/style/colors.js
+++ b/src/style/colors.js
@@ -13,6 +13,7 @@ const colors = {
   lighterblue900: "#6EA8C0",
   softblue900: "#ECF3F7",
   gray900: "#585858",
+  black_overlay: "rgb(0, 0, 0, 0.55)"
 }
 
 export default colors
\ No newline at end of file