diff --git a/Easy/navbar.css b/Easy/navbar.css
new file mode 100644
index 0000000..ba51358
--- /dev/null
+++ b/Easy/navbar.css
@@ -0,0 +1,102 @@
+* {
+ text-decoration: none;
+}
+
+.navbar {
+ background: rgb(196, 219, 63);
+ font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
+ padding-right: 15px;
+ padding-left: 15px;
+ padding-top: 10px;
+ padding-bottom: 10px;
+}
+
+.navdiv {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ background-color: rgb(222, 219, 63);
+}
+
+.logo a {
+ font-size: 35px;
+ font-weight: 600;
+ color: white;
+}
+
+ul {
+ margin: 0;
+ padding: 0;
+ display: flex;
+
+}
+
+li {
+ list-style: none;
+ margin-right: 25px;
+ position: relative;
+}
+
+li a {
+ color: white;
+ font-size: 18px;
+ font-weight: bold;
+ padding: 10px 20px;
+ border-radius: 5px;
+ border: 2px solid transparent;
+ transition: border-color 0.1s ease;
+}
+
+li a:hover {
+ border-color: rgb(1, 3, 15);
+}
+
+.dropdown-menu {
+ display: none;
+ position: absolute;
+ top: 100%;
+ left: 0;
+ background-color: rgb(222, 219, 63);
+ min-width: 160px;
+ border-radius: 5px;
+ box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
+}
+
+.dropdown-menu li {
+ padding: 10px;
+}
+
+.dropdown-menu li a {
+ color: white;
+ font-size: 16px;
+ font-weight: normal;
+ display: block;
+ padding: 8px 20px;
+}
+
+.dropdown-menu li a:hover {
+ background-color: rgb(196, 219, 63);
+}
+
+
+.dropdown:hover .dropdown-menu {
+ display: block;
+}
+
+.buttons {
+ display: flex;
+ gap: 10px;
+}
+
+button {
+ background-color: black;
+ border-radius: 5px;
+ padding: 10px;
+ width: 80px;
+}
+
+button a {
+ color: white;
+ font-weight: bold;
+ font-size: 15px;
+}
diff --git a/Easy/navbar.html b/Easy/navbar.html
new file mode 100644
index 0000000..8140cd7
--- /dev/null
+++ b/Easy/navbar.html
@@ -0,0 +1,32 @@
+
+
+
+
+
+ Navigation Bar
+
+
+
+
+
+