Minor styling changes

frontend/Resources/Components/BottomNavBar/bottom_info_bar.jsx → frontend/src/Components/BottomNavBar/bottom_info_bar.jsx

 import React from 'react'
-import '../..//css/bottom_info_bar.css';
+import '../../Css/bottom_info_bar.css';
 
 export const BottomInfoNavigation = () => {
 
@@ -12,12 +12,12 @@ export const BottomInfoNavigation = () => {
             </div>
             
             <div class = "bottom-info-root__centered">
-                <a class="bottom-info-root__link" href="/contact">
+                <a class="bottom-info-root__link" href="/contact information">
                     <text>Contact Information</text>
                 </a>
             </div>
             <div class = "bottom-info-root__right">
-                <a class="bottom-info-root__link" href="/contact"> 
+                <a class="bottom-info-root__link" href="/legal"> 
                     <text>Legal & Privacy</text>
                 </a>
             </div>

frontend/src/Css/Form.css

@@ -12,7 +12,7 @@ body {
   align-items: center;
   min-height: 100vh;
   
-  /*background: url('../../Assets/background3.jpg') ;*/
+  background: url('../Assets/background3.jpg') ;
   background-color: aliceblue
   no-repeat;  
   

frontend/src/Css/bottom_info_bar.css

 .bottom-info-root {
-  position: relative;
+  position: absolute;
   width: 100%; 
-  top: 20vh;
+  bottom: 40px;
 }
 
 .bottom-info-root__link {
@@ -20,18 +20,18 @@
 }
 
 .bottom-info-root__centered {
-position: absolute;
-top: 50%;
-left: 50%;
-transform: translate(-50%, -50%);
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
 }
 
 .bottom-info-root__right {
   float: right;
-  margin-right: 100px;
+  margin-right: 15%;
 }
   
 .bottom-info-root__left {
   float: left;
-  margin-left: 100px;
+  margin-left: 15%;
 }