Basictemplatebranch

src/Pages/HomePage/HomePage.css

@@ -11,14 +11,35 @@
   }
 
   header {
-    text-align: center;
-    background-color: rgb(180, 255, 214);
+    text-align: left;
+    background-color:aqua;
     color: black;
     font-size:x-large;
     margin: none;
     border-radius: none;
     padding: 10%;
   }
+
+  h2 {
+    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
+    text-align: center;
+    background-color: rgb(184, 227, 240);
+    color: black;
+    font-size:large;
+    margin: none;
+    border-radius: none;
+    padding: 1%;
+  }
+  h3 {
+    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
+    text-align: justify;
+    color: black;
+    font-size:large;
+    margin: none;
+    border-radius: none;
+    padding: 1%;
+  }
+
 
   button {
     color: black;

src/Pages/HomePage/HomePage.js

@@ -3,11 +3,15 @@ function Home() {
     return (
       <div>
           <div className="App">
-          <header>WorldWide Frames</header>
+          <header><b>WorldWide Frames</b> - <i>See A Better World</i></header>
+          <h2><i>Items on Sale</i></h2>
+          <h3>Deals of the Day</h3>
           <button>frame set 1</button>
           <button>frame set 2</button>
           <button>frame set 3</button>
+          <h3>Sunglasses</h3>
           <button>frame set 4</button>
+          <button>frame set 5</button>
         </div>
         <div className="Topright">
           <button style={{backgroundColor: "lightblue"}}>Shopping Cart</button>

src/Pages/LoginPage/LoginPage.css

@@ -4,11 +4,11 @@
     width: 100%;
     justify-content: center;
     align-items: center;
-
+    background-color:aqua;
   }
 
   input {
-    width: 300px;
+    width: 250px;
     height: 50px;
     font-size: 20px;
     padding-left: 10px;