Index: src/main/resources/templates/fragments/header.html
===================================================================
--- src/main/resources/templates/fragments/header.html	(revision a554435c82779a3fdd16512c859c8e2371cde2b5)
+++ src/main/resources/templates/fragments/header.html	(revision 4ee640e57ec5b1e47f479aaa2dcb04c364e92a9b)
@@ -5,6 +5,62 @@
     <title>Title</title>
 </head>
+<style>
+    @import url("https://fonts.googleapis.com/css?family=Varela+Round");
+    html {
+        box-sizing: border-box;
+    }
+
+    *,
+    *:before,
+    *:after {
+        box-sizing: inherit;
+        padding: 0;
+        margin: 0;
+        letter-spacing: 1.1px;
+    }
+
+    body,
+    html {
+        width: 100%;
+        height: 10%;
+        background: #1c1d22;
+        font-family: "Varela Round", sans-serif;
+    }
+
+    .menu {
+        display: flex;
+        justify-content: start;
+        align-items: start;
+        margin: 20px auto;
+        /*height: 100vh;*/
+        list-style: none;
+    }
+
+    .menu li {
+        width: 125px;
+        height: 50px;
+        transition: background-position-x 0.9s linear;
+        text-align: center;
+
+    }
+    .menu li a {
+        font-size: 22px;
+        color: #777;
+        text-decoration: none;
+        transition: all 0.45s;
+    }
+
+
+</style>
 <body>
-
+<nav>
+    <ul class="menu">
+        <li><a href="#!">MovieZone</a></li>
+        <li><a href="#!">Филмови</a></li>
+        <li><a href="#!">Програма</a></li>
+        <li><a href="#!">Настани</a></li>
+        <li><a href="#!">Faq</a></li>
+    </ul>
+</nav>
 </body>
 </html>
