Icons in about Us page

TBorundia · Jun 9, 2024 · af40083 · af40083
1 parent 815c778
commit af40083
Showing 1 changed file with 41 additions and 36 deletions.
diff --git a/assets/html/about.html b/assets/html/about.html
@@ -537,45 +537,50 @@ <h2>Quick Links</h2>
               </div>
             </form>
             <style>
-              .icons .icon i {
-                font-size: 24px;
-                /* Set the default font size for icons */
-                transition: all 0.3s ease;
-                /* Add transition for smooth animation */
-              }
-
-              .icons .icon:hover i {
-                transform: scale(1.2);
-                /* Scale the icon on hover */
-              }
-
-              .icons .icon:hover .fab.fa-facebook {
-                color: #3B5998;
-                /* Change to Facebook color on hover */
-              }
-
-              .icons .icon:hover .fab.fa-twitter {
-                color: #090e11;
-                /* Change to Twitter color on hover */
-              }
-
-              .icons .icon:hover .fab.fa-instagram {
-                background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
-                background-clip: text;
-                border-radius: 20%;
-                transform: scale(1.5);
-                color: transparent;
-                /* Change to Instagram color on hover */
+              .icons {
+                  margin-top: 40px; /* Add margin to move the icons downward */
               }
 
-              .icons .icon:hover .fab.fa-youtube {
-                color: #C31A1E;
-                /* Change to YouTube color on hover */
-              }
+              .icons .icon i {
+                 font-size: 24px;
+                  /* Set the default font size for icons */
+                  transition: all 0.3s ease;
+                  /* Add transition for smooth animation */
+                }
+
+                .icons .icon:hover i {
+                  transform: scale(1.2);
+                  /* Scale the icon on hover */
+                }
+
+.icons .icon:hover .fab.fa-facebook {
+  color: #3B5998;
+  /* Change to Facebook color on hover */
+}
+
+.icons .icon:hover .fab.fa-twitter {
+  color: #090e11;
+  /* Change to Twitter color on hover */
+}
+
+.icons .icon:hover .fab.fa-instagram {
+  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
+  background-clip: text;
+  border-radius: 20%;
+  transform: scale(1.5);
+  color: transparent;
+  /* Change to Instagram color on hover */
+}
+
+.icons .icon:hover .fab.fa-youtube {
+  color: #C31A1E;
+  /* Change to YouTube color on hover */
+}
+
+.icons .icon:hover .fab.fa-github {
+  color: #333;
+}
 
-              .icons .icon:hover .fab.fa-github {
-                color: #333;
-              }
             </style>
 
             <div class="icons">