Initial Commit

css/general.css

@@ -13,6 +13,65 @@ html {
     box-sizing: border-box;
 }
 
+nav {
+    background: rgb(31, 33, 35);;
+    height: auto;
+    width: 100%;
+    overflow: hidden;
+    top: 0;
+    left: 0;
+    position: fixed;
+    flex-wrap: nowrap;
+    z-index: 100;
+    box-shadow: 0 1px 6px 0 rgb(0 0 0 / 20%);
+}
+
+nav * {
+    padding: 0;
+    margin: 1px 1px;
+    text-decoration: none;
+    list-style: none;
+    box-sizing: border-box;
+    z-index: 100;
+}
+
+nav ul {
+    float: right;
+    margin-right: 20px;
+}
+
+nav li {
+    display: inline-block;
+    line-height: 58px;
+    margin: 0 7px;
+}
+
+nav a {
+    color:rgb(136, 180, 231);
+    font-size: 18px;
+}
+
+nav a.active,a:hover {
+    color: rgb(111, 129, 138);
+    transition: .5s;
+}
+
+.checkbtn {
+    font-size: 30px;
+    color: white;
+    float: right;
+    line-height: 60px;
+    margin-right: 20px;
+    cursor: pointer;
+    display: none;
+}
+
+#check {
+    display: none;
+}
+
+
+
 .header-background {
     background-image: none;
     background-position: center;

index.html

@@ -37,7 +37,22 @@
     <header>
         <div class="header-background">
             <div id="header">
-                <!--In Progress-->
+                <nav>
+                    <a href="./">
+                        <img id="logo" src="img/Gilroy Hacks Logo [wide transparent].png" loading="lazy" height="55" width="auto" alt="logo"/>
+                    </a>
+                    <input type="checkbox" id="check">
+                    <label for="check" class="checkbtn">
+                        <img src="img/bars.png" loading="lazy" height="20" width="25" alt="Bars"/>
+                    </label>
+                    <ul>
+                        <li><a href="">Event</a></li>
+                        <li><a href="">Rules</a></li>
+                        <li><a href="">Prizes</a></li>
+                        <li><a href="">Teams</a></li>
+                        <li id="sign-up"><a href="">SIGN UP</a></li>
+                    </ul>
+                </nav>
             </div>
         </div>
     </header>