diff --git a/.DS_Store b/.DS_Store
index cf438c7..6921a10 100644
Binary files a/.DS_Store and b/.DS_Store differ
diff --git a/index.html b/index.html
index d0699dc..c14f41d 100644
--- a/index.html
+++ b/index.html
@@ -9,18 +9,16 @@
-
+
+ 
+ Vu Nguyen
+
+
diff --git a/script.js b/script.js
index b170ce0..abe8633 100644
--- a/script.js
+++ b/script.js
@@ -1,5 +1,5 @@
document.addEventListener("DOMContentLoaded", (e) => {
- const menuLinks = document.querySelectorAll("nav #menu a");
+ const menuLinks = document.querySelectorAll(".menu a");
menuLinks.forEach((link) => {
link.addEventListener("click", function (e) {
e.preventDefault();
diff --git a/styles.css b/styles.css
index 8ad635d..73331b4 100644
--- a/styles.css
+++ b/styles.css
@@ -9,8 +9,8 @@
overflow-x: scroll;
display: flex;
flex-wrap: nowrap;
- width: 100vw; /* Adjust if needed */
- height: 100vh; /* Adjust if needed */
+ width: 100vw;
+ height: 100vh;
}
body,
@@ -35,46 +35,53 @@ html {
z-index: 1000;
border-bottom: 2px solid #f4f4f4;
padding: 20px;
- display: flex;
- justify-content: space-between;
- align-items: center;
- padding: 20px;
+ display: flex;
+ flex: 1;
+ flex-direction: row;
+ justify-content: space-between;
+ align-items: flex-start;
+ padding: 20px;
}
.heading span {
- color: #ffffff;
- font-size: 1.5em;
- letter-spacing: 2px;
- margin-left: 20px;
+ color: #ffffff;
+ font-size: 1.5em;
+ letter-spacing: 2px;
}
-#logo {
- position: relative;
+.logo {
display: flex;
align-items: center;
+ flex-shrink: 0;
}
-#logo img {
- width: 90px; /* Adjust as needed */
+.logo h1 {
+ color: #ffffff;
+ font-size: 1.3em;
+ letter-spacing: 2px;
+ margin-left: 10px;
+ font-weight: bold;
+ text-transform: uppercase;
+ text-decoration: none;
+ cursor: pointer;
+ transition: color 0.3s;
+}
+
+.logo img {
+ width: 90px;
+ flex-shrink: 0;
}
#menu {
- position: relative;
- padding-left: 20px;
- left: 30%;
display: flex;
- align-items: center;
justify-content: space-between;
- gap: 25%;
}
#menu a {
text-decoration: none;
- text-emphasis: bold;
font-size: large;
color: #ffffff;
padding: 20px;
border-radius: 5px;
transition: background-color 0.3s;
-
}
#menu a:hover {