diff --git a/styling.css b/styling.css
new file mode 100644
index 0000000..b6f17b5
--- /dev/null
+++ b/styling.css
@@ -0,0 +1,23 @@
+.animate-zoom-1 {animation:animatezoom 0.3s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
+.animate-zoom-2 {animation:animatezoom 0.5s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
+.animate-zoom-3 {animation:animatezoom 0.7s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
+.animate-zoom-4 {animation:animatezoom 0.9s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
+.animate-zoom-5 {animation:animatezoom 1.1s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
+.animate-zoom-6 {animation:animatezoom 1.3s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
+.animate-zoom-7 {animation:animatezoom 1.5s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
+.animate-zoom-8 {animation:animatezoom 1.7s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
+.animate-zoom-9 {animation:animatezoom 1.9s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
+.animate-top{position:relative;animation:animatetop 0.4s}@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
+.animate-bottom{position:relative;animation:animatebottom 0.4s}@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
+
+.zoom-box { 
+ 	-webkit-transition: -webkit-transform 0.2s;
+	transition: -webkit-transform 0.2s;
+	transition: transform 0.2s;
+	transition: transform 0.2s, -webkit-transform 0.2s; 
+}
+
+.zoom-box:hover {
+  -webkit-transform: scale(1.05);
+          transform: scale(1.05);
+}
\ No newline at end of file