diff --git a/cloned-sites/cyberfiction/index.html b/cloned-sites/cyberfiction/index.html
index b01fda1..ef77eef 100644
--- a/cloned-sites/cyberfiction/index.html
+++ b/cloned-sites/cyberfiction/index.html
@@ -49,7 +49,18 @@ <h1>
             <canvas></canvas>
          
         </div>
-        <div id="page1"></div>
+        <div id="page1">
+            <div id="oleft">
+                <h3>cyberfiction / key word</h3>
+                <h1>have fun<br>let's play<br>
+                    just be together
+            </div>
+            <div id="oright">
+                <h1>make a story<br>take a chance<br>build and owned</h1>
+                <h3>and maintain good humanity</h3>
+            </div>
+
+        </div>
         <div id="page2"></div>
         <div id="page3"></div>
     </div>
diff --git a/cloned-sites/cyberfiction/stle.css b/cloned-sites/cyberfiction/stle.css
index 514f641..d01146b 100644
--- a/cloned-sites/cyberfiction/stle.css
+++ b/cloned-sites/cyberfiction/stle.css
@@ -145,10 +145,52 @@ html,body{
 
 
 #page1{
+    text-transform: uppercase;
     position: relative;
     height: 100vh;
     width: 100vw;
-    background-color: rgb(22, 10, 69);
+    /* background-color: rgb(22, 10, 69); */
+}
+
+#oleft h3{
+    font-weight: 100;
+    font-size: 17px;
+    margin-bottom: 20px;
+}
+
+#oleft h1{
+    font-size: 35px;
+}
+
+
+#oleft{
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    position: absolute;
+    top: 40%;
+    left: 28%;
+    transform: translate(-50%,-50%);
+    /* color: white; */
+}
+
+#oright{
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    /* color: white; */
+    position: absolute;
+    top: 64%;
+    left: 80%;
+    transform: translate(-50%,-50%);
+    text-wrap: nowrap;
+    text-align: right;
+}
+
+#oright h1{
+    font-size: 35px;
+}
+
+#oright h3{
+    font-weight: 100;
+    font-size: 17px;
+    margin-top: 20px;
 }
 
 #page2{