diff --git a/style.css b/style.css
index 00abf8d..1e4ecec 100644
--- a/style.css
+++ b/style.css
@@ -38,7 +38,27 @@ body {
 }
 
 a {
-  color: var(--text);
+  color: inherit;
+  position: relative;
+}
+
+a::after,
+.title::after {
+  content: "";
+  display: block;
+  position: absolute;
+  z-index: -1;
+  bottom: -0.1875rem;
+  right: 0;
+  height: 0.4em;
+  max-width: 75%;
+  width: 0;
+  background: var(--highlight);
+  transition: width ease-in-out 0.175s;
+}
+
+a:hover::after {
+  width: 100%;
 }
 
 main {
@@ -61,42 +81,41 @@ main {
   border-radius: 100%;
   overflow: hidden;
   background: var(--text);
+  opacity: 0;
+  transform: scale(0.2);
+  animation: 0.5s ease-in-out 0.8s profile-picture-show forwards;
 }
 
 .profile-picture img {
   object-fit: contain;
   width: 100%;
   height: 100%;
+  opacity: 0;
+  animation: 0.125s ease-in 1.4s profile-picture-fade forwards;
 }
 
 .title {
   text-align: right;
   position: relative;
   line-height: 1;
+  margin-left: 25%;
 }
 
-.title::before,
-.title::after {
+.title::before {
   content: "";
   position: absolute;
-  z-index: -1;
   display: block;
   right: 0;
   bottom: 0;
-  width: 100%;
-}
-
-.title::before {
   height: 0.0625rem;
-  max-width: 65%;
+  max-width: 90%;
+  width: 0;
   background: var(--text);
+  animation: 0.45s ease-in-out 0.1s title-slide forwards;
 }
 
 .title::after {
-  height: 0.75rem;
-  max-width: 55%;
-  transform: translateY(0.1875rem);
-  background: var(--highlight);
+  animation: 0.45s ease-in-out 0.25s title-slide forwards;
 }
 
 .about {
@@ -104,8 +123,21 @@ main {
 }
 
 .about p,
-.about address {
+.about footer {
+  position: relative;
   margin-bottom: 1.25rem;
+  color: transparent;
+  animation: 0s linear 1s about-text forwards;
+}
+
+.about p::after,
+.about footer::after {
+  content: "";
+  position: absolute;
+  display: block;
+  width: 100%;
+  background: var(--text);
+  animation: 1.25s ease-in-out 0.5s about-mask forwards;
 }
 
 .about address {
@@ -125,3 +157,63 @@ main {
 .footer li {
   margin-bottom: 1.25rem;
 }
+
+@keyframes profile-picture-show {
+  10% {
+    opacity: 1;
+  }
+  20% {
+    opacity: 0;
+  }
+  30% {
+    opacity: 1;
+  }
+  40% {
+    opacity: 0;
+  }
+  50% {
+    opacity: 1;
+    transform: scale(0.2);
+  }
+  100% {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+
+@keyframes profile-picture-fade {
+  100% {
+    opacity: 1;
+  }
+}
+
+@keyframes title-slide {
+  100% {
+    width: 100%;
+  }
+}
+
+@keyframes about-text {
+  100% {
+    color: inherit;
+  }
+}
+
+@keyframes about-mask {
+  0% {
+    top: 0;
+    bottom: 100%;
+  }
+  25% {
+    top: 0;
+    bottom: 0;
+  }
+  75% {
+    top: 0;
+    bottom: 0;
+  }
+  100% {
+    top: 100%;
+    bottom: 0;
+  }
+}