diff --git a/index.html b/index.html
index c6aca505..a45f1463 100644
--- a/index.html
+++ b/index.html
@@ -40,17 +40,12 @@
     <img id="mesh" src="/img/mesh-light.svg">
   </main>
   <footer>
-    <div id="sections-menu">
-      <a href="/pages/events.html">Događaji</a>
-      <a href="/pages/services.html">Servisi</a>
-      <a href="/pages/contact.html">Kontakt</a>
-    </div>
     <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
-    <span class="sections">
+    <nav>
       <a href="/pages/events.html">Događaji</a>
       <a href="/pages/services.html">Servisi</a>
       <a href="/pages/contact.html">Kontakt</a>
-    </span>
+    </nav>
     <span class="links">
         <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
             alt="CreativeCommons"></a>
diff --git a/pages/account.html b/pages/account.html
index 3fa2888e..c3c5565c 100644
--- a/pages/account.html
+++ b/pages/account.html
@@ -29,17 +29,12 @@
     <img id="mesh" src="/img/mesh-light.svg">
   </main>
   <footer>
-    <div id="sections-menu">
-      <a href="/pages/events.html">Događaji</a>
-      <a href="/pages/services.html">Servisi</a>
-      <a href="/pages/contact.html">Kontakt</a>
-    </div>
     <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
-    <span class="sections">
+    <nav>
       <a href="/pages/events.html">Događaji</a>
       <a href="/pages/services.html">Servisi</a>
       <a href="/pages/contact.html">Kontakt</a>
-    </span>
+    </nav>
     <span class="links">
       <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
           alt="CreativeCommons"></a>
diff --git a/pages/blog.html b/pages/blog.html
index a1ed2604..f16b438a 100644
--- a/pages/blog.html
+++ b/pages/blog.html
@@ -22,17 +22,12 @@
     <img id="mesh" src="/img/mesh-light.svg">
   </main>
   <footer>
-    <div id="sections-menu">
-      <a href="/pages/events.html">Događaji</a>
-      <a href="/pages/services.html">Servisi</a>
-      <a href="/pages/contact.html">Kontakt</a>
-    </div>
     <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
-    <span class="sections">
+    <nav>
       <a href="/pages/events.html">Događaji</a>
       <a href="/pages/services.html">Servisi</a>
       <a href="/pages/contact.html">Kontakt</a>
-    </span>
+    </nav>
     <span class="links">
       <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
           alt="CreativeCommons"></a>
diff --git a/pages/contact.html b/pages/contact.html
index 66bc1549..5bb6a5c9 100644
--- a/pages/contact.html
+++ b/pages/contact.html
@@ -27,17 +27,12 @@
     <img id="mesh" src="/img/mesh-light.svg">
   </main>
   <footer>
-    <div id="sections-menu">
-      <a href="/pages/events.html">Događaji</a>
-      <a href="/pages/services.html">Servisi</a>
-      <a href="/pages/contact.html">Kontakt</a>
-    </div>
     <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
-    <span class="sections">
+    <nav>
       <a href="/pages/events.html">Događaji</a>
       <a href="/pages/services.html">Servisi</a>
       <a href="/pages/contact.html">Kontakt</a>
-    </span>
+    </nav>
     <span class="links">
       <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
           alt="CreativeCommons"></a>
diff --git a/pages/events.html b/pages/events.html
index f7b2c46a..d6639ca1 100644
--- a/pages/events.html
+++ b/pages/events.html
@@ -70,17 +70,12 @@
     <img id="mesh" src="/img/mesh-light.svg">
   </main>
   <footer>
-    <div id="sections-menu">
-      <a href="/pages/events.html">Događaji</a>
-      <a href="/pages/services.html">Servisi</a>
-      <a href="/pages/contact.html">Kontakt</a>
-    </div>
     <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
-    <span class="sections">
+    <nav>
       <a href="/pages/events.html">Događaji</a>
       <a href="/pages/services.html">Servisi</a>
       <a href="/pages/contact.html">Kontakt</a>
-    </span>
+    </nav>
     <span class="links">
       <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
           alt="CreativeCommons"></a>
diff --git a/pages/projects.html b/pages/projects.html
index 317e4fa2..b0d3dc76 100644
--- a/pages/projects.html
+++ b/pages/projects.html
@@ -22,17 +22,12 @@
     <img id="mesh" src="/img/mesh-light.svg">
   </main>
   <footer>
-    <div id="sections-menu">
-      <a href="/pages/events.html">Događaji</a>
-      <a href="/pages/services.html">Servisi</a>
-      <a href="/pages/contact.html">Kontakt</a>
-    </div>
     <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
-    <span class="sections">
+    <nav>
       <a href="/pages/events.html">Događaji</a>
       <a href="/pages/services.html">Servisi</a>
       <a href="/pages/contact.html">Kontakt</a>
-    </span>
+    </nav>
     <span class="links">
       <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
           alt="CreativeCommons"></a>
diff --git a/pages/services.html b/pages/services.html
index 5233ae4f..7c94bb7c 100644
--- a/pages/services.html
+++ b/pages/services.html
@@ -78,17 +78,12 @@
     <img id="mesh" src="/img/mesh-light.svg">
   </main>
   <footer>
-    <div id="sections-menu">
-      <a href="/pages/events.html">Događaji</a>
-      <a href="/pages/projects.html">Projekti</a>
-      <a href="/pages/contact.html">Kontakt</a>
-    </div>
     <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
-    <span class="sections">
+    <nav>
       <a href="/pages/events.html">Događaji</a>
       <a href="/pages/services.html">Servisi</a>
       <a href="/pages/contact.html">Kontakt</a>
-    </span>
+    </nav>
     <span class="links">
       <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
           alt="CreativeCommons"></a>
diff --git a/pages/webring.html b/pages/webring.html
index 58f15154..44b605e7 100644
--- a/pages/webring.html
+++ b/pages/webring.html
@@ -23,17 +23,12 @@
     </list>
   </main>
   <footer>
-    <div id="sections-menu">
-      <a href="/pages/events.html">Događaji</a>
-      <a href="/pages/services.html">Servisi</a>
-      <a href="/pages/contact.html">Kontakt</a>
-    </div>
     <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
-    <span class="sections">
+    <nav>
       <a href="/pages/events.html">Događaji</a>
       <a href="/pages/services.html">Servisi</a>
       <a href="/pages/contact.html">Kontakt</a>
-    </span>
+    </nav>
     <span class="links">
       <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
           alt="CreativeCommons"></a>
diff --git a/scripts/main.js b/scripts/main.js
index 8ba3f804..e52c9b5d 100644
--- a/scripts/main.js
+++ b/scripts/main.js
@@ -1,7 +1,7 @@
 const theme_switcher = document.getElementById("theme-switcher");
 const imgs = document.getElementsByTagName("img");
 const sections_button = document.getElementById("sections-button");
-const sections_menu = document.getElementById("sections-menu");
+const sections_menu = document.getElementsByTagName("nav")[0];
 const main = document.getElementsByTagName("main")[0];
 
 let theme = window.localStorage.getItem("theme");
diff --git a/styles/style.css b/styles/style.css
index 41a4703e..cd8fb25f 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -112,9 +112,7 @@ a:focus {
   background: linear-gradient(90deg, var(--hightlight) 0%, var(--hightlight) 50%, var(--bg) 51%, var(--bg) 100%);
 }
 
-.account,
-.sections,
-#sections-menu {
+.account {
   font-size: 2rem;
 }
 
@@ -139,27 +137,12 @@ a:focus {
   display: none;
 }
 
-#sections-menu a {
-  margin-bottom: 1rem;
-}
-
-#sections-menu {
-  border: 2px solid var(--border);
-  background-color: var(--bg);
-  position: absolute;
-  bottom: calc(4rem - 2px);
-  left: calc(0px - 2px);
-  align-items: center;
-  padding: 2rem 3rem;
-  display: none;
-}
-
-.sections, #sections-menu {
+nav {
   font-variant: small-caps;
-}
-
-.sections a {
-  margin: 0 1rem 0 0;
+  display: flex;
+  flex-direction: row;
+  gap: 2rem;
+  font-size: 2rem;
 }
 
 button {
@@ -180,7 +163,17 @@ screen and (max-width: 1500px) {
 }
 
 @media screen and (max-width: 1160px) {
-  .sections {
+  nav {
+    flex-direction: column;
+    border: 2px solid var(--border);
+    border-bottom: 0;
+    border-left: 0;
+    background-color: var(--bg);
+    position: absolute;
+    bottom: calc(4rem);
+    left: 0;
+    align-items: center;
+    padding: 2rem 3rem;
     display: none;
   }