added animation to description, meta tags, contact

static/main.css

@@ -13,6 +13,17 @@ i {
     color:white;
 }
 
+input {
+    background-color:gray;
+    border-radius:15px;
+    color:rgb(226, 226, 226);
+}
+
+::placeholder {
+    color:white;
+    padding-left:5px;
+}
+
 #container {
     /* margin: 0 auto; */
     top:50%;
@@ -22,8 +33,7 @@ i {
 }
 
 #textDiv {
-    /* display:inline-block; */
-    float:left;
+    display:inline-block;
     animation: typingEffect 2s forwards;
     width:0%;
     border-width:1px;
@@ -46,6 +56,23 @@ i {
     transform: translate(-65%, 100%);
 }
 
+#extraInfo {
+    opacity:0;
+    overflow:hidden;
+    animation:fadeIn 1s forwards;
+    animation-delay:2s;
+}
+
+#contact {
+    display:none;
+}
+
+.contactFade {
+    display:block;
+    animation: fadeIn 1s forwards;
+    animation-play-state:paused;
+}
+
 @keyframes cursorBlink {
     0% {opacity:0%;}
     25% {opacity:50%;}
@@ -54,5 +81,10 @@ i {
 
 @keyframes typingEffect {
     from {width:0%;}
-    to {width:34%;}
+    to {width:22%;}
+}
+
+@keyframes fadeIn {
+    from {opacity:0;}
+    to {opacity:1;}
 }