fix nav menu

ui/css/menustyle.css

@@ -32,7 +32,7 @@
 
 .menu-container {
 	display: none;
-	width: 100vw;
+	width: 80%;
 }
 
 .active {
@@ -50,18 +50,20 @@
 .toggle-wrapper {
     display: inline-flex;
     height: 100%;
-    width: 70%;
+    width: 80%;
     align-items: center;
     justify-content: flex-end;
 }
 
 .menu-container, .dropdown-menu {
 	list-style: none;
+	margin: 0 5%;
+	padding: 0;
 }
 
 .menubutton {
 	text-decoration: none;
-	width: 80%;
+	width: 96%;
 	display: block;
 	padding: 2%;
 	color: white;
@@ -74,7 +76,11 @@
 }
 
 .sub {
-	width: 79%;
+	width: 96%;
+}
+
+.dropdown-menu {
+	width: 95%;
 }
 
 @media only screen and (min-width: 999px) {
@@ -85,11 +91,12 @@
 	.menu-wrapper {
 		display: inline-block;
 	}
-
+	
 	.menu-container {
 		display: inline-flex;
 		list-style-type: none;
 		width: 80%;
+		margin: 0;
 		justify-content: center;
 	}
 	
@@ -104,6 +111,11 @@
 		transition: 0.6s;
 	}
 
+	.sub {
+		width: 92%;
+		padding: 20px 4%;
+	}
+
 	.menubutton:hover {
 		border-radius: 0%;
 		background-color: darkblue;
@@ -113,6 +125,7 @@
 	.dropdown-menu {
 		margin: 0;
 		padding: 0;
+		width: fit-content;
 		background-color: lightseagreen;
 		display: none;
 		list-style-type: none;