diff --git a/css/skeleton-auto.css b/css/skeleton-auto.css
index cdab579..fdd4e12 100644
--- a/css/skeleton-auto.css
+++ b/css/skeleton-auto.css
@@ -284,23 +284,28 @@ hr {
 .animate-zoom-6 {animation:animatezoom 1.6s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
 .animate-zoom-7 {animation:animatezoom 1.8s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
 
+/* DEMO-SPECIFIC STYLES */
 .typed {
-  animation: typing 2s steps(22), blink .5s step-end infinite alternate;
-  white-space: nowrap;
-  overflow: hidden;
-  border-right: 3px solid;
+  color: #fff;
   font-family: monospace;
-  font-size: 2em;
+  overflow: hidden; /* Ensures the content is not revealed until the animation */
+  border-right: .15em solid orange; /* The typwriter cursor */
+  white-space: nowrap; /* Keeps the content on a single line */
+  margin: 0 auto; /* Gives that scrolling effect as the typing happens */
+  letter-spacing: .15em; /* Adjust as needed */
+  animation: 
+    typing 3.5s steps(30, end),
+    blink-caret .5s step-end infinite;
 }
 
+/* The typing effect */
 @keyframes typing {
-  from {
-    width: 0
-  }
+  from { width: 0 }
+  to { width: 100% }
 }
-    
-@keyframes blink {
-  50% {
-    border-color: transparent
-  }
+
+/* The typewriter cursor effect */
+@keyframes blink-caret {
+  from, to { border-color: transparent }
+  50% { border-color: orange }
 }
\ No newline at end of file