UPDATE

src/index.css

@@ -1,4 +1,4 @@
-*{
+body{
   margin: 0;
   padding: 0;
   box-sizing: border-box;
@@ -21,7 +21,12 @@
   /* background-color: #e2e8f01c !important; */
 }
 
-
+.active>.css-1ic543h {
+  -webkit-transition: rotate 0.2s;
+  transition: rotate 0.2s;
+  transform-origin: center;
+  color: #fff;
+}
 
 .linkChild:hover{
   color: #02A0A0 !important;
@@ -48,71 +53,3 @@
   /* background-color: #e2e8f01c !important; */
 }
 
-
-/* Sphere.css */
-
-/* ✅ Red Spheres */
-.red-sphere-1,
-.red-sphere-2, 
-.red-sphere-3{
-  position: absolute;
-  border-radius: 50%;
-  background-color: #D90B2E46;
-  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
-  filter: blur(100px);
-}
-
-/* ✅ Blue Spheres */
-.blue-sphere-1,
-.blue-sphere-2,
-.blue-sphere-3{
-  position: absolute;
-  border-radius: 50%;
-  background-color: #009DAB46;
-  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
-  filter: blur(100px);
-}
-
-/* 🔧 Positioning for Spheres */
-.red-sphere-1 {
-  width: 250px;
-  height: 250px;
-  top: 10%;
-  left: 5%;
-}
-
-.blue-sphere-1 {
-  width: 320px;
-  height: 320px;
-  top: 30%;
-  right: 0%;
-}
-
-.red-sphere-2 {
-  width: 180px;
-  height: 180px;
-  bottom: 15%;
-  left: 20%;
-}
-
-.blue-sphere-2 {
-  width: 140px;
-  height: 140px;
-  bottom: 5%;
-  right: 25%;
-}
-
-.red-sphere-3 {
-  width: 480px;
-  height: 480px;
-  bottom: 55%;
-  left: 40%;
-}
-
-.blue-sphere-3{
-  width: 300px;
-  height: 300px;
-  bottom: 10%;
-  right: 40%;
-}
-