diff --git a/.gitignore b/.gitignore
index 69f8a8d..364fdec 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,2 +1 @@
 public/
-
diff --git a/config.toml b/config.toml
index 2c2443b..116a705 100644
--- a/config.toml
+++ b/config.toml
@@ -16,8 +16,8 @@ smart_punctuation = true
 git = "https://git.filiprojek.cz/fr/website"
 nav_items = [
 	{name="Home",      path="/"},
-	{name="About",     path="/about"},
-	{name="Projects",  path="/projects/"},
-	{name="Contacts",  path="/contact/"},
+#	{name="About",     path="/about"},
+#	{name="Projects",  path="/projects/"},
+	{name="Contact me",  path="/contact/"},
 ]
 
diff --git a/content/about.md b/content/about.md
new file mode 100644
index 0000000..900fac7
--- /dev/null
+++ b/content/about.md
@@ -0,0 +1,8 @@
++++
+title = "About"
+template = "about.html"
++++
+
+My name is Filip Rojek. I am 20 years old and I study in Prague. My journey into the world of coding started at IT high school. Now I am studying IT at Charles University.
+My coding adventure took me from student collaboration on projects like Fofrweb, where we created applications like FofrMess or FofrTasks - realtime web applications built using `Node.js` and `Vue.js`.
+I now work as a Linux engineer at IS Media. Most of my work involves Debian-based systems - desktops and servers. I have a lot of experience with other distributions as well. For example, I use `Void Linux` or `Gentoo` on my personal workstations. At Fofrweb we used `RHEL` based distributions like `Cent OS` or later `Rocky Linux`.
diff --git a/content/contact.md b/content/contact.md
index 98517d1..99c352e 100644
--- a/content/contact.md
+++ b/content/contact.md
@@ -1,4 +1,4 @@
 +++
-title = "Contacts"
+title = "Contact me"
 template = "contact.html"
 +++
diff --git a/content/projects/dotfiles.md b/content/projects/dotfiles.md
index f4c4638..2835b73 100644
--- a/content/projects/dotfiles.md
+++ b/content/projects/dotfiles.md
@@ -10,6 +10,7 @@ state = "active"
 # Dotfiles
 
 ## About
+- Collection of my configuration dotfiles.
 ## Links
 - [Git](https://git.filiprojek.cz/fr/dotfiles)
 
diff --git a/content/projects/gitlab-ce-auto-minor-upgrade.md b/content/projects/gitlab-ce-auto-minor-upgrade.md
index 91cf7d2..a1e50b7 100644
--- a/content/projects/gitlab-ce-auto-minor-upgrade.md
+++ b/content/projects/gitlab-ce-auto-minor-upgrade.md
@@ -7,4 +7,13 @@ description = "Gitlab CE auto minor upgrade script"
 state = "done"
 +++
 
+# gitlab-ce auto minor upgrade script
+## About
+- This lightweight Bash script automates minor upgrades via crontab, ensuring your GitLab CE stays up to date with minimal effort. Designed for efficiency, it uses `apt` to identify and implement upgrades, while logging any issues for your peace of mind.
+
+## Get Started and Contribute
+- Download the script, set up your crontab. GitLab-CE-Auto-Minor-Upgrade-Script is open source, meaning you can get involved, provide feedback, or contribute enhancements.
+
+## Links
+- [Git](https://git.filiprojek.cz/fr/gitlab-ce-auto-minor-upgrade)
 
diff --git a/content/projects/nork.md b/content/projects/nork.md
index 01a66fe..14a5677 100644
--- a/content/projects/nork.md
+++ b/content/projects/nork.md
@@ -7,4 +7,9 @@ description = "Simple node.js tool that extends express projects"
 state = "done"
 +++
 
+# Nork
+## About
+- Simple node.js tool that extends express projects.
 
+## Links
+- [Git](https://github.com/filiprojek/nork)
diff --git a/content/projects/website.md b/content/projects/website.md
index 73bcdda..f871bfe 100644
--- a/content/projects/website.md
+++ b/content/projects/website.md
@@ -7,4 +7,10 @@ description = "My personal website"
 state = "in development"
 +++
 
+# Website
+## About
+- This website is built using the Zola static site generator.
+
+## Links
+- [Git](https://git.filiprojek.cz/fr/website)
 
diff --git a/content/projects/wpa_tui.md b/content/projects/wpa_tui.md
index b868e31..96884e4 100644
--- a/content/projects/wpa_tui.md
+++ b/content/projects/wpa_tui.md
@@ -8,7 +8,11 @@ state = "in development"
 +++
 
 # wpa_tui
+## About
 - WPA Supplicant Terminal User Interface
 - Collection of `dmenu` scripts for interacting with WPA Supplicant
 - Terminal User Interface app for interacting with WPA Supplicant
 - Main goal of this tool is comfort of sending commands to WPA-Supplicant from terminal over remembering explicit wpa commands as well as having to click in the wpa_gui (abandoned graphical interface)
+
+## Links
+- [Git](https://git.microlab.space/fr/wpa_tui)
diff --git a/sass/content.scss b/sass/content.scss
index 137974e..dfdf197 100644
--- a/sass/content.scss
+++ b/sass/content.scss
@@ -3,3 +3,18 @@
 	flex-direction: column;
 	margin: 2rem 8rem;
 }
+
+.content {
+	@media (max-width: 690px) {
+		margin: 2rem 2rem;
+	}
+		.pgpwrap {
+			 word-break: break-all;
+		}
+}
+
+.contact {
+	h1 {
+		margin-bottom: 1rem;
+	}
+}
diff --git a/sass/style.scss b/sass/style.scss
index 73e4546..0c13c39 100644
--- a/sass/style.scss
+++ b/sass/style.scss
@@ -33,7 +33,7 @@ html {
 nav {
 	position: relative;
 	display: flex;
-	padding: 1rem;
+	padding: 1rem 2rem;
 	justify-content: space-between;
 	isolation: isolate;
 
diff --git a/static/img/at.svg b/static/img/at.svg
new file mode 100644
index 0000000..c6846c9
--- /dev/null
+++ b/static/img/at.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path fill="#ffffffff" d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480v58q0 59-40.5 100.5T740-280q-35 0-66-15t-52-43q-29 29-65.5 43.5T480-280q-83 0-141.5-58.5T280-480q0-83 58.5-141.5T480-680q83 0 141.5 58.5T680-480v58q0 26 17 44t43 18q26 0 43-18t17-44v-58q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93h200v80H480Zm0-280q50 0 85-35t35-85q0-50-35-85t-85-35q-50 0-85 35t-35 85q0 50 35 85t85 35Z"/></svg>
diff --git a/templates/404.html b/templates/404.html
index 60d8f20..e2c97b8 100644
--- a/templates/404.html
+++ b/templates/404.html
@@ -1,161 +1,24 @@
 <!DOCTYPE html>
 <html lang="en">
-	<head>
-		<title>filiprojek.cz | 404 Not found</title>
-		<meta charset="UTF-8">
-		<meta name="viewport" content="width=device-width, initial-scale=1">
-		<link rel="icon" type="image/x-icon" href="/img/fr.ico">
-		<link rel="stylesheet" href="/general.css">
-		<link rel="stylesheet" href="/vars.css">
-<style>
-
-/* 404.css */
-body {
-    margin: 0;
-    overflow: hidden;
-}
-
-.container {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 100vh;
-    text-align: center;
-    position: relative;
-}
-
-.stars {
-    background-image: url('/img/rocket.webp');
-    background-size: cover;
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    z-index: -1;
-    animation: stars 20s linear infinite;
-}
-
-.planet {
-    background-image: url('/img/rocket.webp');
-    background-size: contain;
-    background-repeat: no-repeat;
-    width: 200px;
-    height: 200px;
-    position: absolute;
-    bottom: 50px;
-    left: 50%;
-    transform: translateX(-50%);
-}
-
-.moon {
-    background-image: url('/img/rocket.webp');
-    background-size: contain;
-    background-repeat: no-repeat;
-    width: 40px;
-    height: 40px;
-    position: absolute;
-    top: 120px;
-    left: 130px;
-    animation: moon 10s linear infinite;
-}
-
-.rocket {
-    background-image: url('/img/rocket.webp');
-    background-size: contain;
-    background-repeat: no-repeat;
-    width: 120px;
-    height: 240px;
-    position: absolute;
-    bottom: 0;
-    left: 50%;
-    transform: translateX(-50%);
-}
-
-.fire {
-    background-image: url('/img/rocket.webp');
-    background-size: contain;
-    background-repeat: no-repeat;
-    width: 20px;
-    height: 60px;
-    position: absolute;
-    bottom: 25px;
-    left: 50%;
-    transform: translateX(-50%);
-    animation: fire 0.5s alternate infinite;
-}
-
-.text {
-    color: #fff;
-    z-index: 1;
-}
-
-h1 {
-    font-size: 2.5rem;
-}
-
-p {
-    font-size: 1.2rem;
-    margin-top: 20px;
-}
-
-a {
-    text-decoration: none;
-    color: #58a6ff;
-    font-size: 1.2rem;
-    display: block;
-    margin-top: 20px;
-}
-
-@keyframes stars {
-    0% {
-        background-position: 0 0;
-    }
-    100% {
-        background-position: 100px 100px;
-    }
-}
-
-@keyframes moon {
-    0% {
-        transform: translate(0, 0);
-    }
-    50% {
-        transform: translate(10px, -10px);
-    }
-    100% {
-        transform: translate(0, 0);
-    }
-}
-
-@keyframes fire {
-    0% {
-        opacity: 1;
-    }
-    100% {
-        opacity: 0.6;
-    }
-}
-
-
-</style>
-	</head>
-	<body>
-
-    <div class="container">
-        <div class="stars"></div>
-        <div class="planet">
-            <div class="moon"></div>
-        </div>
-        <div class="rocket">
-            <div class="fire"></div>
-        </div>
-        <div class="text">
-            <h1>Oops! You're Lost in Space!</h1>
-            <p>Looks like you took a wrong turn and ended up in the outer reaches of the internet. Don't worry; our rocket is on its way to bring you back.</p>
-            <a href="/">Return to Earth</a>
-        </div>
-    </div>
-
-
+<head>
+	<title>Filip Rojek | 404 Not found</title>
+	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<link rel="icon" type="image/x-icon" href="/img/fr.ico">
+	<link rel="stylesheet" href="/general.css">
+	<link rel="stylesheet" href="/vars.css">
+	<link rel="stylesheet" href="/style.css">
+	<style>
+		.flex-col {
+			height: 100vh;
+		}
+	</style>
+</head>
+<body>
+	<div class="content flex-col">
+		<h2>404 - Not found</h2>
+		<a href="/">Home</a>
+	</div>
 </body>
 </html>
 
diff --git a/templates/about.html b/templates/about.html
new file mode 100644
index 0000000..3c705d8
--- /dev/null
+++ b/templates/about.html
@@ -0,0 +1,16 @@
+{% extends "base.html" %}
+
+{% block styles %}
+	<link rel="stylesheet" href="/about.css">
+{% endblock styles %}
+
+{% block content %}
+	<section class="about content">
+	<h2>About me</h2>
+
+	<p>My name is Filip Rojek. I am 20 years old and I study in Prague. My journey into the world of coding started at IT high school. Now I am studying IT at Charles University.</p>
+	<p>My coding adventure took me from student collaboration on projects like Fofrweb, where we created applications like FofrMess or FofrTasks - realtime web applications built using `Node.js` and `Vue.js`.</p>
+	<p>I now work as a Linux engineer at IS Media. Most of my work involves Debian-based systems - desktops and servers. I have a lot of experience with other distributions as well. For example, I use `Void Linux` or `Gentoo` on my personal workstations. At Fofrweb we used `RHEL` based distributions like `Cent OS` or later `Rocky Linux`.</p>
+	</section>
+{% endblock content %}
+
diff --git a/templates/base.html b/templates/base.html
index 3a9334c..e887314 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -24,7 +24,7 @@
 		<link rel="stylesheet" href="/style.css">
 		<link rel="stylesheet" href="/home.css">
 		{% block styles %}
-		{% endblock stles %}
+		{% endblock styles %}
 	</head>
 	<body>
 		<header>
@@ -56,10 +56,12 @@
 			{% endblock content %}
 		</main>
 		<footer>
+			<!--
 			<p>Build time: {{ now() | date(format="%Y-%m-%d %H:%M") }},
 			{% if config.extra.git %}
 				<a href="{{ config.extra.git }}">Source</a>
 			{% endif %}</p>
+			-->
 			<p>(c) filiprojek.cz 2022 - {{ now() | date(format="%Y")}}</p>
 		</footer>
 
diff --git a/templates/contact.html b/templates/contact.html
index 2ad05ce..9be160f 100644
--- a/templates/contact.html
+++ b/templates/contact.html
@@ -2,14 +2,13 @@
 
 {% block content %}
 	<section class="contact content">
-		<h1>Contacts</h1>
+		<h1>Contact me</h1>
 		<div class="contact-list">
-			<p>email: <a href="mailto:filip@filiprojek.cz">filip@filiprojek.cz</a></p>
+			<p>email: <a href="mailto:hello@filiprojek.cz">hello@filiprojek.cz</a></p>
 			<p>telegram: <a href="https://t.me/filiprojek">@filiprojek</a></p>
 			<p>git: <a href="https://git.filiprojek.cz">Personal git</a></p>
-			<p>git: <a href="https://git.microlab.space/fr">Microlab Space git</a></p>
 			<p>github: <a href="https://github.com/filiprojek">GitHub</a></p>
-			<p>PGP: <a href="#">fc37b989787acf8cbce7c0c2a56a345efe321161</a></p>
+			<p>PGP: <a href="#" class="pgpwrap">fc37b989787acf8cbce7c0c2a56a345efe321161</a></p>
 		</div>
 	</section>
 {% endblock content %}
diff --git a/templates/index.html b/templates/index.html
index b527432..a0752d6 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,10 +1,18 @@
 {% extends "base.html" %}
 
+{% block styles %}
+	<style>
+		.at {
+			height: 1rem;
+		}
+	</style>
+{% endblock styles %}
+
 {% block content %}
 
 <section class="home">
 	<section>
-		<p>Filip Rojek &ltfilip@filiprojek.cz&gt</p>
+		<p>Filip Rojek &ltfilip<img src="/img/at.svg" alt=" (at) " class="at">filiprojek.cz&gt</p>
 	<br>
 	<p>Backend node.js & php developer <a href="https://www.fofrweb.com/" target="_blank">@fofrweb</a>,<br> GNU/Linux <a href="http://voidlinux.org" target="_blank">Void</a> user, student and coffee enthusiast<span class="underscore">_</span><p>
 		<br>
diff --git a/todo.md b/todo.md
new file mode 100644
index 0000000..0144143
--- /dev/null
+++ b/todo.md
@@ -0,0 +1,20 @@
+# TODO
+- [ ] fixnout resize hr v projektu
+- [ ] redesign contact
+- [ ] redesign about
+- [ ] check about text content
+- [ ] add some more projects
+- [ ] responsibility
+
+# Projects
+ - nork
+ - website
+ - debrepo
+ - auto irrigation
+ - auto awning close
+ - FofrTasks
+ - FofrMess
+ - pkmples.cz
+ - deguapp?
+ - wpa_tui?
+ - dotfiles