updates boxes under the Looki2000 text

main.css

@@ -77,7 +77,7 @@ nav a:hover {
     
 }
 
-#main_box {
+#over_render_box {
     /* center everything in div horizontally*/
     text-align: center;
 
@@ -90,7 +90,7 @@ nav a:hover {
     backdrop-filter: blur(100px);
     background-image: url(assets/textures/noise.png);
 
-    /* make text look like overexposed blue neon */
+    /* make text look like overexposed neon */
     color: rgb(247, 255, 230);
     text-shadow: 0px 0px 8px rgb(223, 255, 153);
 
@@ -98,34 +98,12 @@ nav a:hover {
     line-height: 20px;
 }
 
-.projects_box {
-    /* rounded corners */
-    border-radius: 8px;
-
-    background-color: rgb(30, 30, 30);
-
-    width: 80%;
-
-    /* aling div in the center of the screen */
-    margin: auto;
-    
-    margin-top: 40px;
-
-    padding: 1px 40px 30px;
-}
-
-.projects_box h1 {
-    /* make font bigger and cyan */
-    font-size: 60px;
-    color: rgb(51, 156, 255);
-}
-
 footer {
     height: 50px;
     background-color: #333;
     text-align: center;
 
-    margin: 50px 0px 0px;
+    margin: 100px 0px 0px;
 
     /* vertcaly center text */
     display: flex;
@@ -137,4 +115,44 @@ footer img {
     width: auto;
     height: 40px;
     margin-left: 20px;
+}
+
+
+/* info boxes under the page welcome div */
+.boxes {
+    /* rounded corners */
+    border-radius: 8px;
+    /**/
+    background-color: rgb(30, 30, 30);
+    width: 80%;
+
+    /* aling div in the center of the screen */
+    margin: auto;
+    margin-top: 40px;
+    padding: 30px 40px;
+}
+
+.boxes h1 {
+    font-size: 60px;
+    display: inline;
+}
+
+.boxes a {
+    /* make text look like overexposed neon */
+    text-shadow: 0px 0px 10px rgb(153, 153, 255);
+    color: rgb(230, 230, 255);
+    
+    text-decoration: none;
+}
+
+
+/* box 1 */
+#box1 h1 {
+    color: rgb(50, 170, 255);
+}
+
+
+/* box 2 */
+#box2 h1 {
+    color: rgb(50, 255, 129);
 }