body,
html {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  background-image: url("/assets/everest.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow-y: auto; /* Allow scrolling for long content */
}



/*HOMEDIV1 CSS*/

.homediv1 {
  display: flex;
  flex-wrap: wrap; /* Allow wrapping for smaller screens */
  justify-content: center; /* Center content */
  align-items: center; /* Align items vertically */
  gap: 20px; /* Space between elements */
  background-color: #007bff; /* Blue background */
  padding: 30px; /* Add padding around the container */
  margin: 30px; /* Margin for spacing */
}

.text-box {
  flex: 1; /* Adjusts with the container */
  padding: 20px;
  text-align: center; /* Center align text for better responsiveness */
  font-family: "Trebuchet MS", sans-serif;
}

.homediv1h1 {
  color: #ffffff;
  font-size: 56px; /* Adjusted size for responsiveness */
  margin-bottom: 10px; /* Space below heading */
}

.homediv1h2 {
  color: #ffffff;
  font-size: 23px; /* Smaller subheading for responsiveness */
  margin-bottom: 20px; /* Space below subheading */
}

.image-box1 {
  flex: 1; /* Adjusts with the container */
  display: flex;
  justify-content: center; /* Center the image */
  align-items: center;
}

.image-box1 img {
  max-width: 100%; /* Scale the image to fit */
  height: auto; /* Maintain aspect ratio */
  border-radius: 0px; /* Add slight rounding for a modern look */
}

.button1,
.button2 {
  display: inline-block;
  padding: 12px 24px; /* Adjusted for better look */
  font-size: 16px;
  color: #ffffff;
  text-decoration: none;
  border-radius: 5px; /* Rounded corners */
  margin: 10px 5px; /* Space between buttons */
  transition: background-color 0.3s; /* Smooth hover effect */
}

.button1 {
  background-color: #052386; /* Dark blue */
}

.button1:hover {
  background-color: #031764; /* Slightly darker on hover */
}

.button2 {
  background-color: transparent;
  border: 2px solid #ffffff; /* Outline button */
}

.button2:hover {
  background-color: #ffffff; /* White on hover */
  color: #007bff; /* Blue text on hover */
}

/*HOMEDIV2 CSS*/

.homediv2 {
  display: flex;
  flex-wrap: wrap; /* Allow wrapping for smaller screens */
  justify-content: center; /* Center content horizontally */
  align-items: center; /* Center items vertically */
  gap: 20px; /* Space between elements */
  padding: 30px; /* Add padding around the container */
}

.text-box {
  flex: 1; /* Adjusts with container size */
  text-align: center; /* Center align text for responsive design */
  font-family: "Trebuchet MS", sans-serif;
}

.homediv2h1 {
  color: #000000;
  font-size: 56px; /* Adjusted size for better responsiveness */
  margin-bottom: 10px;
}

.homediv2h2 {
  color: #000000;
  font-size: 18px; /* Smaller font size for better readability */
}

.image-box2 {
  flex: 1; /* Adjusts with container size */
  display: flex;
  justify-content: center; /* Center the image horizontally */
  align-items: center;
}

.image-box2 img {
  max-width: 60%; /* Ensure image scales within the container */
  height: auto; /* Maintain aspect ratio */
  border-radius: 10px; /* Add slight rounding for a modern look */
}

/* HOMEDIV3 Container */
.homediv3 {
  text-align: center;
  font-family: "Trebuchet MS", sans-serif;
  font-size: 21px;
  padding: 30px; /* Add padding for spacing */
  background-color: #ffffff; /* Default background color */
}

.homediv3 p {
  color: rgb(105, 105, 105);
  margin: 10px 0 20px; /* Add spacing around the text */
}

.websitelogos {
  max-width: 70%; /* Scale image for responsiveness */
  height: auto; /* Maintain aspect ratio */
  margin: 20px auto; /* Center the image */
  display: block; /* Ensure block-level behavior */
  border-radius: 10px; /* Add slight rounding to corners */
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Subtle shadow for aesthetic */
}

/* HOMEDIV4 Styling */
.homediv4 {
  font-family: "Trebuchet MS", sans-serif;
  text-align: center;
  margin: 30px;
  padding-left: 250px;
  padding-right: 250px;
}

.contact-form {
  display: flex;
  align-items: center; /* Align items vertically centered */
  justify-content: center;
  gap: 20px;
  margin-top: 50px;
}

.form-field {
  margin: 0 10px; /* Space between fields */
  flex: 2; /* Make fields take equal space */
  position: relative; /* For positioning the underline */
}

.form-field label {
  display: block;
  margin-bottom: 5px;
  font-weight: bold; /* Optional: Make label bold */
}

.form-field input {
  width: 60%;
  padding: 10px;
  border: none; /* Remove border */
  border-bottom: 1px solid #333; /* Bottom underline */
  outline: none; /* Remove outline on focus */
  transition: border-bottom-color 0.3s; /* Smooth transition */
  background-color: transparent;
}

.form-field input:focus {
  border-bottom-color: #007bff; /* Change underline color on focus */
}

.form-field input {
  margin-bottom: 10px; /* Space between inputs */
}

.submit-button {
  display: inline-block;
  padding: 12px 24px; /* Adjusted for better look */
  font-size: 16px;
  color: #ffffff;
  text-decoration: none;
  border-radius: 5px; /* Rounded corners */
  margin: 10px 5px; /* Space between buttons */
  transition: background-color 0.3s; /* Smooth hover effect */
  background-color: #052386; /* Dark blue */
}

.submit-button:hover {
  background-color: #0056b3; /* Darker blue on hover */
  transform: translateY(-2px); /* Slight lift effect */
}

.submit-button:active {
  transform: translateY(0); /* Reset lift effect on click */
}

/* Responsive Styles */
@media (max-width: 768px) {
  .contact-form {
    flex-direction: column; /* Stack fields vertically on smaller screens */
    align-items: stretch; /* Align items to stretch */
  }

  .form-field {
    margin: 10px 0; /* Vertical margin for stacked fields */
  }

  .submit-button {
    margin-left: 0; /* Remove left margin for button */
    width: 100%; /* Make button full width on small screens */
  }
}

/* Responsive Design Homediv1*/
@media (max-width: 768px) {
  .homediv1 {
    flex-direction: column; /* Stack elements vertically */
    padding: 20px;
  }

  .text-box {
    text-align: center; /* Keep text centered */
  }

  .homediv1h1 {
    font-size: 28px; /* Adjust heading size for smaller screens */
  }

  .homediv1h2 {
    font-size: 16px; /* Adjust subheading size */
  }

  .button1,
  .button2 {
    width: 80%; /* Buttons span across most of the screen */
    margin: 10px auto; /* Center buttons */
  }
}

/* Responsive Design Homediv2*/
@media (max-width: 768px) {
  .homediv2 {
    flex-direction: column; /* Stack elements vertically */
    padding: 20px;
  }

  .text-box {
    text-align: center; /* Center align text for smaller screens */
  }

  .homediv2h1 {
    font-size: 28px; /* Reduce heading size for mobile */
  }

  .homediv2h2 {
    font-size: 16px; /* Adjust subheading size */
  }

  .image-box2 img {
    max-width: 80%; /* Reduce image size for smaller screens */
    margin: 20px 0; /* Add spacing around the image */
  }
}

/* Responsive Design Homediv3*/
@media (max-width: 768px) {
  .homediv3 {
    background-color: #eaf7ff; /* Light blue background for mobile */
    padding: 20px; /* Adjust padding for smaller screens */
  }

  .homediv3 h1 {
    font-size: 24px; /* Adjust heading size for mobile */
    margin-bottom: 10px;
  }

  .homediv3 p {
    font-size: 16px; /* Reduce text size for readability on mobile */
  }

  .websitelogos {
    max-width: 90%; /* Make image smaller for narrow screens */
  }
}

/* Responsive Styles Homediv4*/
@media (max-width: 768px) {
  .homediv4 {
    padding-left: 20px; /* Reduced padding for smaller screens */
    padding-right: 20px; /* Reduced padding for smaller screens */
  }

  .contact-form {
    flex-direction: column; /* Stack fields vertically */
    align-items: stretch; /* Stretch items to full width */
  }

  .form-field {
    flex: 1; /* Allow fields to take full width */
    margin-bottom: 20px; /* Space between fields */
  }

  .form-field input {
    width: 100%; /* Full width for inputs on small screens */
  }

  .submit-button {
    width: 100%; /* Full width for button on small screens */
    margin: 10px 0; /* Vertical margin for button */
  }
}