body {
  font-family: "Nunito Sans", sans-serif;
  line-height: 50px;
  color: #333;
  padding: 20px;
  padding-top: 120px;
  padding-top: 120px; /* Adjust this value based on the header height */


}


body {
padding-top: 120px; /* Adjust this value based on the header height */
}

header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  background-color: white; /* Ensure the header has a background color */
  box-shadow: 0 2px 5px rgba(255, 229, 163, 0.1); /* Optional: Add a shadow for better visibility */

}




body {
  padding-top: 120px; /* Adjust this value based on the header height */
}

header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 1900px;
  height: 70px;
  margin: 0 auto;
  padding: 50px;
  box-sizing: border-box;

}

header .logo img {
  width: 66px;
  height: 40px;
  flex-shrink: 0;
}

nav ul {
  list-style: none;
  display: flex;
  gap: 40px;
  margin-left: auto;
}

nav ul li a {
  color: #676767;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-decoration: none;
}
*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;}

.resume-link {
  color: #2e3eed; 
  text-decoration: none;
  font-weight: bold;
  text-decoration: underline;
}

.profile-image {
  display: flex;
  flex-direction: column;
  align-items: flex-start; 
}

.resume-link {
  margin-left: 100px; 

}



.about-section {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 50px;
  max-width: 1200px;
  margin: 0 auto;
  margin-top: 150px;
}

.profile-image {
  flex: 1;
  text-align: center;
  margin-right: 50px;
  margin-top: 30px;
  border-radius: 10px;
}

.profile-image img {
  max-width: 100%;
  border-radius: 30px;
}

.profile-image p {
  margin-top: 10px;
  color: #6c757d;
}

.about-info {
  flex: 2;
  line-height: 4;
}

.about-info h2 {
  font-weight: 700;
  margin-bottom: 20px;
}

.about-info p {
  margin-bottom: 20px;
}

.about-info a {
  color: #007bff;
  text-decoration: none;
}

.about-info a:hover {
  text-decoration: underline;
}

.contact-info {
  margin-top: 30px;
}

.contact-info h3 {
  font-weight: 700;
  margin-bottom: 10px;
}

.contact-info p a {
  color: #007bff;
  text-decoration: none;
  display: inline-block;
  margin-bottom: 10px;
}

.contact-info p a:hover {
  text-decoration: underline;
}

footer {
  background-color: #A7A7A7;
  padding: 50px 50px;
  color: white; 
  margin-top: 150px;
}

.footer-content {
  display: flex;
  justify-content: space-between; /* Space between the left and right sections */
  align-items: center;
  max-width: 1440px;
  margin: 0 auto; /* Center the content within the footer */
}

.footer-left h2 {
  font-size: 28px; 
  font-weight: bold;
  margin: 0; 
}

.footer-right p {
  margin: 0; 
  font-size: 22px; /* Adjust the font size */
  text-align: right; /* Align text to the right */
  line-height: 40px; /* 300% */

}

/* Media Query for Smaller Screens */
@media only screen and (max-width: 768px) {
  .about-section {
      flex-direction: column;
      align-items: center;
  }

  .profile-image {
      margin-right: 0;
      margin-bottom: 20px;
      width: 100%;
      text-align: center;
  }

  .profile-image img {
      max-width: 150px;
      margin: 0 auto;
  }

  body {
    padding: 10px; /* Reduce body padding */
}

header {
  margin-top: 20px;
    padding: 10px 20px; /* Reduce header padding */
    height: 60px; /* Adjust header height */
}
header .logo img {
  width: 40px; /* Further reduce logo size for iPhones */
  height: 24px; /* Adjust logo height proportionally */
}

nav ul {
    gap: 10px; /* Reduce the gap between nav items */
    margin-top: 10px; /* Add space between the logo and nav */
}

nav ul li a {
    font-size: 14px; /* Reduce font size of nav links */
}

header {
  margin-top: 20px;
    padding: 10px 20px; /* Reduce header padding */
    height: 60px; /* Adjust header height */
}
header .logo img {
  width: 40px; /* Further reduce logo size for iPhones */
  height: 24px; /* Adjust logo height proportionally */
}

nav ul {
    gap: 10px; /* Reduce the gap between nav items */
    margin-top: 10px; /* Add space between the logo and nav */
}

nav ul li a {
    font-size: 14px; /* Reduce font size of nav links */
}

.footer-content {
    flex-direction: column; /* Stack footer content vertically */
    text-align: center; /* Center footer text */
    padding: 20px 10px; /* Adjust padding */
}

.footer-left h2, .footer-right p {
    font-size: 16px; /* Reduce footer font sizes */
}

.footer-right p {
    margin-top: 5px; /* Reduce margin between footer elements */
    text-align: center; /* Center align the text */
}

footer {
    padding: 20px; /* Reduce padding for the footer */
}

  }