diff --git a/index.html b/index.html
new file mode 100644
index 0000000..9ffa6d7
--- /dev/null
+++ b/index.html
@@ -0,0 +1,16 @@
+
+
+
+
+
+
+
+ HermitCollective.net
+
+
+
+
Welcome to HermitCollective
+
We are still work in progress...
+
+
+
diff --git a/typewriter.css b/typewriter.css
new file mode 100644
index 0000000..4e7f09c
--- /dev/null
+++ b/typewriter.css
@@ -0,0 +1,68 @@
+body {
+ height: 100%;
+ width: 100%;
+ background: #000000;
+ color: #b30000;
+ font-family: "Lucida Console", monospace;
+}
+.container {
+ margin-top: 5%;
+ width: 100%;
+ height: 100%;
+ padding: 70px;
+}
+.first_line,
+.second_line {
+ white-space: nowrap; /* keep text in one line */
+ overflow: hidden; /* hide text behind the cursor */
+ margin: 0.5rem auto;
+ font-family: "Lucida Console", monospace;
+ font-size: 2rem;
+ font-weight: bold;
+}
+.first_line {
+ border-right: 2px solid rgba(17, 17, 17, 0.9);
+ /* define animation types for text + cursor */
+ animation: typewriter_1 3s steps(25) 1s 1 normal both,
+ first_cursor 900ms steps(33) 8;
+}
+.second_line {
+ border-right: 2px solid rgba(17, 17, 17, 0.9);
+ /* define animation types for text + cursor */
+ animation: typewriter_2 5s steps(31) 1s 1 normal both,
+ second_cursor 900ms steps(31) infinite;
+ -webkit-animation-delay: 7s;
+ animation-delay: 7s;
+}
+@keyframes typewriter_1 {
+ from {
+ width: 0;
+ }
+ to {
+ width: 34rem;
+ }
+}
+@keyframes typewriter_2 {
+ from {
+ width: 0;
+ }
+ to {
+ width: 40rem;
+ }
+}
+@keyframes first_cursor {
+ from {
+ border-right-color: rgba(17, 17, 17, 0.9);
+ }
+ to {
+ border-right-color: rgba(255, 255, 255, 0.8);
+ }
+}
+@keyframes second_cursor{
+ from {
+ border-right-color: rgba(17, 17, 17, 0.9);
+ }
+ to {
+ border-right-color: rgba(255, 255, 255, 0.8);
+ }
+}