Hover effects added on cards

Avdhesh-Varshney · Jul 3, 2024 · 050ee43 · 050ee43
1 parent 6c8c41f
commit 050ee43
Showing 1 changed file with 17 additions and 1 deletion.
diff --git a/src/css/Home.css b/src/css/Home.css
@@ -131,6 +131,19 @@
   background-color: #eef1ff;
 }
 
+.feat-card:hover {
+  transform: translateY(-10px);
+  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
+}
+
+.feat-card:hover img {
+  transform: scale(1.05);
+}
+
+.feat-card:hover .card-line {
+  width: 100%;
+}
+
 .feat-card-content {
   display: flex;
   flex-direction: column;
@@ -171,7 +184,10 @@
   border-radius: 100%;
 }
 
-
+.feat-card:hover, .feat-card-2:hover {
+  transform: translateY(-10px);
+  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
+}
 
 .gap-10{
   gap: 40px;