Mark1 navigation

creating a better and functional navigation tab. Added layered scrolling with relative positioning of elements in the DOM.

CSS/index.css

@@ -1,3 +1,8 @@
+*{
+    margin: 0;
+    padding: 0;
+}
+
 html { width:100%; height:100%; margin:0; padding:0; }
 
 body {
@@ -44,22 +49,6 @@ body {
     transition-delay: 0.3s;
 }
 
-nav {
-    background-color: rgb(0, 0, 0);
-    /* color: blue; */
-    /* text-align: center; */
-}
-
-.navbar .nav-item {
-    margin-right: 25px;
-    margin-left: 25px;
-}
-
-#right {
-    float: right;
-    margin-right: 50px;
-}
-
 .logoutbtn {
     margin-top: 14px;
     scale: 1.2;
@@ -72,6 +61,7 @@ nav {
     color: red;
 }
 
+
 .desctext {
     /* float:left; */
     color: white;
@@ -83,6 +73,7 @@ nav {
     width: auto;
 }
 
+
 /*************************
     CAROUSEL
 *************************/
@@ -128,10 +119,76 @@ nav {
     position: relative;
 }
 
-.navbar-fixed-top {
+
+.wrapper {
+    width: 1170px;
+    margin: 0 auto;
+    background-color: black;
+    height: 100px;
+    width: 100%;
+    z-index: 12;
     position: fixed;
-    right: 0;
-    left: 0;
-    z-index: 1030;
     top: 0;
+}
+
+header{
+    text-align: center;
+}
+
+.logo{
+    width: 30%;
+    float: left;
+    line-height: 100px;
+}
+
+.logo a{
+    text-decoration: none;
+    font-size: 30px;
+    font-family: poppins, sans-serif;
+    color: #fff;
+    letter-spacing: 5px;
+}
+
+nav{
+    float: right; 
+    line-height: 100px;
+}
+
+nav a{
+    text-decoration: none;
+    font-family: poppins, sans-serif;
+    letter-spacing: 4px;
+    font-size: 20px;
+    margin: 0 10px;
+    color: #fff;
+}
+
+.banner-area{
+    width: 100%;
+    height: 500px;
+    position: fixed;
+    top: 100px;
+    background-image: url('https://github.com/ION606/selmer-bot-website/blob/main/assets/Header%20BK.gif?raw=true');  
+    background-size: cover; 
+    background-repeat: no-repeat;
+    background-position: center center;
+}
+
+.banner-area h2 {
+    padding: 8%;
+    font-size: 70px;
+    font-family: sans-serif, poppins;
+    text-transform: uppercase;
+    color: #fff;
+}
+
+.content-area {
+    width: 100%;
+    position: relative;
+    top: 450px;
+    background-color: rgb(41, 42, 48);
+}
+
+.content-area h2 {
+
 }