add the stream of consciousness

content/caterpillar.md

@@ -3,6 +3,11 @@ title = 'Caterpillar'
 +++
 
 # Caterpillar
-<img src='/caterpillar.jpeg' height='350px' />
+<img src='/caterpillar.jpeg' height='350px' alt='A caterpillar which is actually a cat' />
 
 What did you expect? Its a **cat**erpillar
+
+## Oh, hey! Look!
+Its the stream of consciousness! I bet it would be fun to [see what's in there](/stream).
+
+<img src='/waterstream.gif' alt='The stream of consciousness (the joke is that this is a picture of a waterfall)' />

content/stream.md

@@ -0,0 +1,97 @@
++++
+title = 'The stream of consciousness'
++++
+
+<style>
+    @keyframes thought-fade {
+        0% {
+            opacity: 1;
+            transform: scale(1);
+            filter: blur(0px);
+        }
+        25% {
+            transform: scale(1.1) translate(5%, -5%);
+            filter: blur(0px);
+        }
+        50% {
+            opacity: 0;
+            transform: scale(1.2) translate(-5%, 5%);
+            filter: blur(32px);
+        }
+        to {
+            opacity: 1;
+            transform: scale(1);
+            filter: blur(0px);
+        }
+    }
+    .thought {
+        position: fixed;
+
+        animation: thought-fade 10s infinite;
+        animation-play-state: running;
+    }
+</style>
+
+<span class='thought' style='top: 40%; left: 2%'>
+    I wonder if the fabric of reality can be pierced.
+</span>
+
+
+<span class='thought' style='top: calc(40% + 30px); left: 2.3%;animation-delay:-5s'>
+    It should be able to be pierced, right?
+</span>
+
+
+<span class='thought' style='top: 76%; left: 52%;animation-delay:-2s'>
+    Web 3 is the sneaky WW3
+</span>
+
+
+<span class='thought' style='top: 4%; left: 31%'>
+    Keyboard cat
+</span>
+
+
+<span class='thought' style='top: 23%; left: 87%;animation-delay:-3s'>
+    OMG SO CUTE!!
+</span>
+
+
+<span class='thought' style='top: 27%; left: 73%;animation-delay:-5s'>
+    I wonder if she's flirting or just being friendly
+</span>
+
+
+<span class='thought' style='top: 63%; left: 57%;animation-delay:-12s'>
+    My mind is falling apart
+</span>
+
+
+<span class='thought' style='top: 82%; left: 12%;animation-delay:-5s'>
+    The void forgives you
+</span>
+
+
+<span class='thought' style='top: 70%; left: 82%;animation-delay:-6s'>
+    <s>I should kill myself</s> We already have.
+</span>
+
+
+<span class='thought' style='top: 60%; left: 4%;animation-delay:-7s'>
+    The government is spying on you
+</span>
+
+
+<span class='thought' style='top: 30%; left: 74%;animation-delay:-8s'>
+    Everything is nothing, and nothing is everything
+</span>
+
+
+<span class='thought' style='top: 60%; left: 34%;animation-delay:-9s'>
+    I think that someone is listening to <s>my</s> our thoughts.
+</span>
+
+
+<span class='thought' style='top: calc(60% + 30px); left: 34%;animation-delay:-14s'>
+    Those are <b>OUR</b> thoughts now.
+</span>