diff --git a/FlipCardAnimation.html b/FlipCardAnimation.html
index 68d9f23..feaf5e1 100644
--- a/FlipCardAnimation.html
+++ b/FlipCardAnimation.html
@@ -29,7 +29,9 @@
.flip-card {
width: 300px;
- height: 600px;
+ height: 300px;
+ perspective: 800px;
+ margin: 100px;
}
.flip-card img {
@@ -50,7 +52,26 @@
.flip-card:hover .filp-card-inner {
transform: rotateY(180deg);
}
+
+ .flip-card-front,
+ .flip-card-back {
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ backface-visibility: hidden;
+ }
+
+ .flip-card-back {
+ background-color: lightblue;
+ color: #fff;
+ transform: rotateY(180deg);
+ }
+