diff --git a/public/CSS/index_styles.css b/public/CSS/index_styles.css
index 733d579..5a9a031 100644
--- a/public/CSS/index_styles.css
+++ b/public/CSS/index_styles.css
@@ -177,6 +177,9 @@ span {
     color: rgb(30,30,30);
 }
 
+
+
+/* Miscallaneous shapes */
 .indexCircle {
     background: rgb(35,58,108);
     width: 300px;
@@ -187,10 +190,58 @@ span {
     box-shadow: 0px 4px 70px rgba(0, 0, 0, 0.6);
 }
 
-/* .cityRectTall {
+.indexCircleTwo {
+        background: rgb(255,165,30);
+        width: 180px;
+        height: 180px;
+        border-radius: 50%;
+        display: grid;
+        margin: 80px 240px;
+        box-shadow: 0px 4px 30px rgba(0, 0, 0, 0.3);
+        top: 50%;  /* Adjust as needed */
+        left: 50%;  /* Adjust as needed */
+        position: absolute;
+}
+
+.indexCircleThree {
+    background: rgb(35,58,108);
+    width: 290px;
+    height: 290px;
+    border-radius: 50%;
+    display: grid;
+    margin: 10px -400px;
+    box-shadow: 0px 4px 50px rgba(0, 0, 0, 0.5);
+    top: 50%;  /* Adjust as needed */
+    left: 50%;  /* Adjust as needed */
+    position: absolute;
+}
+
+.indexRectangleTwo {
+    background: rgb(0,173,56);
+    width: 80px;
+    height: 300px;
+    border-radius: 20px;
+    margin: 80px 100px;
+    position: absolute;
+    box-shadow: 0px 4px 80px rgba(0, 0, 0, 0.2);
+}
+
+.indexRectangleThree {
+    background: rgb(255,82,0);
+    width: 320px;
+    height: 200px;
+    border-radius: 20px;
+    margin: 190px 520px;
+    position: absolute;
+    box-shadow: 0px 4px 50px rgba(0, 0, 0, 0.6);
+}
+
+.indexRectangleFour {
     background: rgb(255,165,30);
-    width: 400px;
-    height: 750px;
+    width: 80px;
+    height: 300px;
     border-radius: 20px;
-    margin: -80% 1100px;
-} */
\ No newline at end of file
+    margin: -120px 40%;
+    position: absolute;
+    box-shadow: 0px 4px 80px rgba(0, 0, 0, 0.2);
+}
\ No newline at end of file
diff --git a/public/index.html b/public/index.html
index f76218d..21030e7 100644
--- a/public/index.html
+++ b/public/index.html
@@ -7,6 +7,9 @@
     <title>api project</title>
   </head>
   <body>
+    <section class="indexRectangleFour">
+    </section>
+    
     <section class = "indexWelcomeCircle">
       <h1 id = "welcomeText">Welcome to Radar</h1>
     </section>
@@ -18,6 +21,15 @@ <h1 id = "welcomeText">Welcome to Radar</h1>
       </form>
     </section>
 
+    <section class="indexCircleThree">
+    </section>
+    
+    <section class="indexRectangleThree">
+    </section>
+
+    <section class="indexRectangleTwo">
+    </section>
+
     <section class = "indexSquare">
       <a href = "city.html">
         <button id = "indexSubmit" class = "indexSubmit">&#8626;</button>
@@ -33,6 +45,9 @@ <h1 id = "welcomeText">Welcome to Radar</h1>
     <section class = "indexCircle">
     </section>
 
+    <section class = "indexCircleTwo">
+    </section>
+
 <!-- Hidden instructions popup -->
     <div id = "indexHelpPopup" class = "indexHelpPopup">
       <div class = "indexPopupContent">
