diff --git a/src/index.html b/src/index.html
index 62b8ba5a39..8a19893523 100644
--- a/src/index.html
+++ b/src/index.html
@@ -10,6 +10,18 @@
http-equiv="X-UA-Compatible"
content="ie=edge"
/>
+
+
+
Moyo header
- Moyo header
+
diff --git a/src/style.css b/src/style.css
index 293d3b1f13..c997eae7ae 100644
--- a/src/style.css
+++ b/src/style.css
@@ -1,3 +1,78 @@
+html,
body {
+ width: 100%;
+ height: 100%;
+ margin: 0;
+ font-family: Roboto, sans-serif;
+}
+
+h1 {
+ margin: 38px 0;
+}
+
+.header {
+ justify-content: space-between;
+ display: flex;
+ align-items: center;
+ padding: 0 50px;
+}
+
+.logo {
+ display: flex;
+ align-items: center;
+}
+
+.nav {
+ height: 60px;
+ display: flex;
+}
+
+.nav-links {
+ display: flex;
+ height: 100%;
+ margin: 0;
+ padding: 0;
+}
+
+a {
+ text-decoration: none;
+ display: flex;
+ height: 100%;
+ align-items: center;
+ color: #000;
+ font-size: 12px;
+ font-weight: 500;
+ text-transform: uppercase;
+}
+
+a:hover {
+ color: #00acdc;
+}
+
+.is-active {
+ color: #00acdc;
+
+ position: relative;
+}
+
+.link {
+ text-decoration: none;
+ list-style: none;
+ margin-right: 20px;
+}
+
+.is-active::after {
+ width: 100%;
+ content: '';
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ height: 4px;
+ background-color: #00acdc;
+
+ border-radius: 8px;
+}
+
+.last {
margin: 0;
}