diff --git a/roadrunner.png b/static/roadrunner.png
similarity index 100%
rename from roadrunner.png
rename to static/roadrunner.png
diff --git a/roadrunner.psd b/static/roadrunner.psd
similarity index 100%
rename from roadrunner.psd
rename to static/roadrunner.psd
diff --git a/static/styles.css b/static/styles.css
index af2812a..f7a5d3b 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -21,18 +21,37 @@ body, html {
   padding: 2em;
 }
 
-#logo {
+#about .about-img {
+  float: left;
+  max-width: 15em;
+  max-height: 15em;
+  margin: 1em;
+  filter: drop-shadow(5px 7px 6px rgba(0, 0, 0, 0.1));
+}
+#about p {
+  text-align: justify;
+}
+
+.header-primary {
+  background-color: #1b53a8;
+  position: relative;
+  max-height: 100px;
+  padding: 10px 0;
+}
+.header-primary #text-logo {
   text-decoration: none;
   color: #ef7900;
   font-size: 2.5em;
   letter-spacing: -2.8px;
   font-family: "Arial Rounded MT Bold", sans-serif;
 }
-
-.header-primary {
-  background-color: #1b53a8;
-  padding: 10px;
-  position: relative;
+.header-primary #img-logo {
+  height: 100%;
+  box-sizing: border-box;
+}
+.header-primary #img-logo img {
+  max-width: 100%;
+  max-height: 80px;
 }
 .header-primary .header-login {
   position: absolute;
@@ -275,11 +294,14 @@ form button {
   text-decoration: none;
 }
 
+.new-users, .statistics {
+  margin-top: 0 !important;
+}
 .new-users > div, .statistics > div {
   border: 1px solid grey;
   padding: 0.2em;
   width: fit-content;
-  padding-right: 1.2em;
+  padding-right: 1.5em;
 }
 .new-users > div a, .statistics > div a {
   text-decoration: none;
diff --git a/static/styles.css.map b/static/styles.css.map
index 94b2dbf..9bcc18c 100644
--- a/static/styles.css.map
+++ b/static/styles.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["styles.scss"],"names":[],"mappings":"AAAA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;AAEA;EAOE;;AALA;EAEE;;;AAON;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;;AAKN;EACE;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIA;EACE;EACA;;AAEA;EACE;;AAEA;EACE;;;AAMR;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAIA;EACE;EACA;;;AAIJ;EACE;EACA;;;AAGF;EACE;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;;;AAIJ;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;;AAIJ;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;;;AAIJ;EACE;;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA;;;AAMF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;;;AAMR;EACE;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;;AAIJ;EAEE;EACA;EACA;;;AAON;EACE;EACF;EACA;EACA;;AACE;EACE;;;AAKN;EACE;EACA","file":"styles.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["styles.scss"],"names":[],"mappings":"AAAA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;AAEA;EAOE;;AALA;EAEE;;;AASJ;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;;;AAKJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AACA;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;;AAKN;EACE;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAIA;EACE;EACA;;AAEA;EACE;;AAEA;EACE;;;AAMR;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAIA;EACE;EACA;;;AAIJ;EACE;EACA;;;AAGF;EACE;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;;;AAIJ;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;;AAIJ;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;;;AAIJ;EACE;;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA;;;AAMF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;;;AAMR;EACE;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;;AAIJ;EAEE;EACA;EACA;;;AAMR;EACE;;AACA;EACE;EACA;EACA;EACA;;AAEA;EACE;;;AAKN;EACE;EACA","file":"styles.css"}
\ No newline at end of file
diff --git a/static/styles.scss b/static/styles.scss
index 3298000..5190556 100644
--- a/static/styles.scss
+++ b/static/styles.scss
@@ -26,18 +26,44 @@ body, html {
   }
 }
 
-#logo {
-  text-decoration: none;
-  color: #ef7900;
-  font-size: 2.5em;
-  letter-spacing: -2.8px;
-  font-family: "Arial Rounded MT Bold", sans-serif;
+#about {
+
+  .about-img {
+    float: left;
+    max-width: 15em;
+    max-height: 15em;
+    margin: 1em;
+    filter: drop-shadow(5px 7px 6px rgba(0, 0, 0, 0.1));
+  }
+
+  p {
+    text-align: justify;
+  }
 }
 
+
 .header-primary {
   background-color: #1b53a8;
-  padding: 10px;
   position: relative;
+  max-height: 100px;
+  padding: 10px 0;
+
+  #text-logo {
+    text-decoration: none;
+    color: #ef7900;
+    font-size: 2.5em;
+    letter-spacing: -2.8px;
+    font-family: "Arial Rounded MT Bold", sans-serif;
+  }
+
+  #img-logo {
+    height: 100%;
+    box-sizing: border-box;
+    img {
+      max-width: 100%;
+      max-height: 80px;
+    }
+  }
 
   .header-login {
     position: absolute;
@@ -323,11 +349,13 @@ form {
 }
 
 .new-users, .statistics {
+  margin-top: 0 !important;
   > div {
     border: 1px solid grey;
-  padding: 0.2em;
-  width: fit-content;
-  padding-right: 1.2em;
+    padding: 0.2em;
+    width: fit-content;
+    padding-right: 1.5em;
+
     a {
       text-decoration: none;
     }
diff --git a/templates/layouts/base.html b/templates/layouts/base.html
index fc713ea..c30633e 100644
--- a/templates/layouts/base.html
+++ b/templates/layouts/base.html
@@ -9,6 +9,7 @@
             <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.5.0/js/all.min.js"
                     integrity="sha512-YUwFoN1yaVzHxZ1cLsNYJzVt1opqtVLKgBQ+wDj+JyfvOkH66ck1fleCm8eyJG9O1HpKIf86HrgTXkWDyHy9HA=="
                     crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+            <link rel="preload" href="{{ url_for('static', filename='roadrunner_header.png') }}" as="image">
         {% endblock %}
     </head>
     <body>
diff --git a/templates/layouts/header.html b/templates/layouts/header.html
index d6c3db7..1c1852c 100644
--- a/templates/layouts/header.html
+++ b/templates/layouts/header.html
@@ -1,6 +1,9 @@
 <div class="header">
     <div class="header-primary">
-        <a id="logo" href="{{ url_for('main.index') }}">runnerspace</a>
+        <a id="img-logo" href="{{ url_for('main.index') }}">
+            <img src="{{ url_for('static', filename='roadrunner_header.png') }}">
+        </a>
+        {#        <a id="text-logo" href="{{ url_for('main.index') }}">runnerspace</a>#}
         <div class="header-login">
             {% if current_user.is_authenticated %}
                 Logged in as
@@ -18,9 +21,9 @@
             <li><a href="{{ url_for('main.feed') }}">My Feed</a></li>
             <li><a href="{{ url_for('main.browse') }}">Browse</a></li>
             <li><a href="{{ url_for('main.search') }}">Search</a></li>
-{#            <li><a href="{{ url_for('main.messages') }}">My Messages</a></li>#}
-{#            <li><a href="{{ url_for('main.blogs') }}">Blog</a></li>#}
-{#            <li><a href="{{ url_for('main.groups') }}">Groups</a></li>#}
+            {#            <li><a href="{{ url_for('main.messages') }}">My Messages</a></li>#}
+            {#            <li><a href="{{ url_for('main.blogs') }}">Blog</a></li>#}
+            {#            <li><a href="{{ url_for('main.groups') }}">Groups</a></li>#}
             <li><a href="{{ url_for('main.about') }}">About</a></li>
         </ul>
     </nav>