diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..8cffccc
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,13 @@
+            DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
+                    Version 2, December 2004
+
+ Copyright (C) 2004 Sam Hocevar <sam@hocevar.net>
+
+ Everyone is permitted to copy and distribute verbatim or modified
+ copies of this license document, and changing it is allowed as long
+ as the name is changed.
+
+            DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
+   TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION
+
+  0. You just DO WHAT THE FUCK YOU WANT TO.
\ No newline at end of file
diff --git a/index.html b/index.html
index fcbfd83..0e81eb8 100644
--- a/index.html
+++ b/index.html
@@ -1,27 +1,43 @@
 <!DOCTYPE html>
-<html lang="tr">
+<html lang="en">
   <head>
     <meta charset="UTF-8" />
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Site yapım aşamasında</title>
-    <link rel="stylesheet" href="s.css" />
+    <title>Özgür Yazılım Mekanı</title>
+    <link rel="stylesheet" href="style.css" />
+    <link href="noto-serif/noto-serif.css" rel="stylesheet" />
   </head>
   <body>
+    <header>
+      <span class="sitebasligi">Alperen İsa Nalbant</span>
+      <nav>
+        <ul>
+          <li><a href="#">Ana Sayfa</a></li>
+          <li><a href="#">Beni GitHub'da çatalla!</a></li>
+        </ul>
+      </nav>
+    </header>
     <main>
-      <div class="kapsayici">
-        <img
-          src="/uct.png"
-          alt="Yol üzerine konulmuş sarı ve siyah çizgili engel"
-        />
-        <h1>Site Yapım Aşamasında</h1>
-        <p>Daha sonra tekrar kontrol edin.</p>
-        <div>
-          <a href="https://github.com/afacanc38" target="_blank">GitHub</a>
-          <a href="mailto:afacanc38@vuhuv.com">E-Posta</a>
-        </div>
-        <span class="atif"><a href="https://github.com/Afacanc38/myartwork/blob/main/illustrations/under-construction-transparent.png">Fotoğraf</a> <a href="https://github.com/afacanc38">Alperen İsa Nalbant</a> tarafından <a href="https://github.com/Afacanc38/myartwork/blob/main/LICENSE">Apache 2.0</a> altında lisanslanmıştır.</span>
-      </div>
+      13 yaşındayım. Şu an okullardan dolayı pek fazla geliştirme yapmıyorum.
+      O yüzden bu site oldukça içeriksiz gibi gözüküyor.
+      <blockquote>
+        Psst. Bu web sitesi özür yazılımdır, WTFPL altında dağıtılıyor.
+      </blockquote>
+      <pre>
+        <code>
+Çırcır böceklerinden başka bir şey yok anlayacağın. Eh şimdilik işte...</code>
+      </pre>
     </main>
+    <footer>
+      <span class="telifhakki">Telif Hakkı © 2022 Alperen İsa Nalbant</span>
+      <nav>
+        <ul>
+          <li><a href="https://github.com/afacanc38/afacanc38.github.io">Web sitesi kaynak kodu</a></li>
+          <li><a href="#">Lisans</a></li>
+          <li><a href="/link.jpg">Başka bir link</a></li>
+        </ul>
+      </nav>
+    </footer>
   </body>
 </html>
diff --git a/link.jpg b/link.jpg
new file mode 100644
index 0000000..41f7aa2
Binary files /dev/null and b/link.jpg differ
diff --git a/noto-serif/noto-serif-bold-italic.woff2 b/noto-serif/noto-serif-bold-italic.woff2
new file mode 100644
index 0000000..e3b3f3f
Binary files /dev/null and b/noto-serif/noto-serif-bold-italic.woff2 differ
diff --git a/noto-serif/noto-serif-bold.woff2 b/noto-serif/noto-serif-bold.woff2
new file mode 100644
index 0000000..4ed128f
Binary files /dev/null and b/noto-serif/noto-serif-bold.woff2 differ
diff --git a/noto-serif/noto-serif-italic.woff2 b/noto-serif/noto-serif-italic.woff2
new file mode 100644
index 0000000..4c8ffc0
Binary files /dev/null and b/noto-serif/noto-serif-italic.woff2 differ
diff --git a/noto-serif/noto-serif.css b/noto-serif/noto-serif.css
new file mode 100644
index 0000000..8d40303
--- /dev/null
+++ b/noto-serif/noto-serif.css
@@ -0,0 +1,29 @@
+/* noto-serif-bold */
+@font-face {
+	font-family: Noto Serif;
+	font-style: normal;
+	font-weight: 700;
+	src: local("Noto Serif Bold"), local("NotoSerif-Bold"), url(noto-serif-bold.woff2) format("woff2");
+}
+/* noto-serif-bold-italic */
+@font-face {
+	font-family: Noto Serif;
+	font-style: italic;
+	font-weight: 700;
+	src: local("Noto Serif Bold Italic"), local("NotoSerif-BoldItalic"), url(noto-serif-bold-italic.woff2) format("woff2");
+}
+/* noto-serif-italic */
+@font-face {
+	font-family: Noto Serif;
+	font-style: italic;
+	font-weight: 400;
+	src: local("Noto Serif Italic"), local("NotoSerif-Italic"), url(noto-serif-italic.woff2) format("woff2");
+}
+/* noto-serif */
+@font-face {
+	font-family: Noto Serif;
+	font-style: normal;
+	font-weight: 400;
+	src: local("Noto Serif"), local("NotoSerif"), url(noto-serif.woff2) format("woff2");
+}
+
diff --git a/noto-serif/noto-serif.woff2 b/noto-serif/noto-serif.woff2
new file mode 100644
index 0000000..b19251c
Binary files /dev/null and b/noto-serif/noto-serif.woff2 differ
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..e612c76
--- /dev/null
+++ b/style.css
@@ -0,0 +1,81 @@
+:root {
+  --default-bg: #F0F0F0;
+  --text: #212427;
+  --border: rgba(0, 0, 0, .5);
+  --pre-bg: #dbdbdb;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --default-bg: #212427;
+    --text: #f0f0f0;
+    --border: rgba(255, 255, 255, .5);
+    --pre-bg: #2e3235;
+  }
+  
+}
+
+* {
+  color: var(--text);
+  transition: color 200ms 200ms linear, background-color 200ms linear;
+}
+
+body {
+  max-width: 70ch;
+  padding: 3em 1em;
+  margin: auto;
+  line-height: 1.75;
+  font-size: 1.25em;
+  font-family: 'Noto Serif', sans-serif;
+  background-color: var(--default-bg);
+}
+
+h1,h2,h3,h4,h5,h6 {
+  margin: 3em 0 1em;
+}
+
+p,ul,ol {
+  margin-bottom: 2em;
+  color: #1d1d1d;
+  font-family: 'sans-serif';
+}
+
+h1, .sitebasligi {
+  font-size: 1.5em;
+}
+
+header > nav > ul {
+  list-style-type: none;
+  padding: 0;
+  display: flex;
+  gap: 20px;
+  flex-wrap: wrap;
+}
+
+footer {
+  display: flex;
+  flex-direction: column;
+  margin-top: 2.5em;
+  padding-top: 2.5em;
+  border-top: 1px solid var(--border);
+}
+
+footer > nav > ul {
+  list-style-type: none;
+  padding: 0;
+  display: flex;
+  gap: 12px;
+}
+
+blockquote {
+  border-left: 1px solid var(--text);
+  margin: 30px;
+  padding: 10px 20px;
+}
+
+pre {
+  background: var(--pre-bg);
+  padding: 0 30px;
+  border-radius: 12px;
+  color: var(--text);
+}
\ No newline at end of file