diff --git a/src/index.html b/src/index.html
index 67e96178d3..4d8c8ce6fe 100644
--- a/src/index.html
+++ b/src/index.html
@@ -34,10 +34,10 @@
   </head>
   <body>
     <header class="header">
-      <a href="#">
+      <a href="/">
         <img
           src="images/logo.png"
-          alt="logo"
+          alt="Moyo logo"
           class="logo"
         />
       </a>
@@ -46,7 +46,7 @@
         <ul class="nav__list">
           <li class="nav__link">
             <a
-              href="#"
+              href="/apple"
               class="is-active nav__item"
             >
               Apple
@@ -55,7 +55,7 @@
 
           <li class="nav__link">
             <a
-              href="#"
+              href="/samsung"
               class="nav__item"
             >
               Samsung
@@ -64,7 +64,7 @@
 
           <li class="nav__link">
             <a
-              href="#"
+              href="/smartphones"
               class="nav__item"
             >
               Smartphones
@@ -73,7 +73,7 @@
 
           <li class="nav__link">
             <a
-              href="#"
+              href="/laptop-Computers"
               class="nav__item"
               data-qa="hover"
             >
@@ -83,7 +83,7 @@
 
           <li class="nav__link">
             <a
-              href="#"
+              href="/gadgets"
               class="nav__item"
             >
               Gadgets
@@ -92,7 +92,7 @@
 
           <li class="nav__link">
             <a
-              href="#"
+              href="/tablets"
               class="nav__item"
             >
               Tablets
@@ -101,7 +101,7 @@
 
           <li class="nav__link">
             <a
-              href="#"
+              href="/photo"
               class="nav__item"
             >
               Photo
@@ -110,7 +110,7 @@
 
           <li class="nav__link">
             <a
-              href="#"
+              href="/video"
               class="nav__item"
             >
               Video
diff --git a/src/reset.css b/src/reset.css
index 313d571428..2c77e5813e 100644
--- a/src/reset.css
+++ b/src/reset.css
@@ -129,9 +129,3 @@ table {
   border-collapse: collapse;
   border-spacing: 0;
 }
-
-a,
-ul {
-  text-decoration: none;
-  color: black;
-}
diff --git a/src/style.css b/src/style.css
index 162c1ecc2d..2a8f7c6fb1 100644
--- a/src/style.css
+++ b/src/style.css
@@ -1,3 +1,7 @@
+:root {
+  --blue-color: #00acdc;
+}
+
 body {
   margin: 0;
 }
@@ -16,6 +20,7 @@ body {
 .nav__list {
   display: flex;
   margin: 0;
+  text-decoration: none;
 }
 
 .nav__link {
@@ -29,24 +34,24 @@ body {
 .nav__item {
   display: flex;
   /* stylelint-disable-next-line font-family-name-quotes */
-  font-family: 'Roboto', serif;
+  font-family: 'Roboto', sans-serif;
   color: black;
   height: 60px;
   font-weight: 500;
   font-size: 12px;
-  text-decoration: none;
   text-align: center;
   text-transform: uppercase;
+  text-decoration: none;
   justify-content: center;
   align-items: center;
 }
 
 .nav__item:hover {
-  color: #00acdc;
+  color: var(--blue-color);
 }
 
 .is-active {
-  color: #00acdc;
+  color: var(--blue-color);
   position: relative;
 }
 
@@ -58,5 +63,5 @@ body {
   width: 100%;
   height: 4px;
   border-radius: 8px;
-  background-color: #00acdc;
+  background-color: var(--blue-color);
 }
