body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    line-height: 1.6;
    color: #333;
    background: url('1.webp') no-repeat center center fixed; /* Page-wide background */
    background-size: cover; /* Ensures the image covers the entire background */
}
/* Navigation Bar */
nav {
    padding: 100px 20px; /* Increase padding to make the navigation bar taller */
    display: flex;
    justify-content: space-between;
    align-items: center; /* Aligns all items vertically */
	margin-bottom: 2rem; /* Add 2-line space below navigation */
}

/* Logo */
nav .logo img {
    max-height: 200px; /* Increase the logo height */
    width: auto; /* Maintain aspect ratio */
}

/* Center the Links */
nav ul {
    list-style: none;
    display: flex;
    gap: 30px;
    margin: 0 auto; /* Center the navigation links */
    padding: 0;
}

/* Style for Navigation Links */
nav ul li a {
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    padding: 20px 40px; /* Increase padding for larger clickable area */
    font-size: 3rem; /* Increase font size */
    background: rgba(0, 0, 0, 0.5);
    border-radius: 5px;
    position: relative; /* Allows us to use top to move the element */
    top: 10rem; /* Moves the links down by 2rem */
	left: 70px; /* Moves the element 10px to the right */
}

/* Hover Effect for Links */
nav ul li a[href="index.html"]:hover,
nav ul li a[href="contact.html"]:hover,
nav ul li a[href="properties.html"]:hover {
    background: rgba(0, 0, 0, 0.7);
}

/* Language Buttons */
nav ul.language-buttons {
    margin: 0; /* Ensure no unnecessary margin */
    padding: 0;
    display: flex;
    gap: 10px; /* Space between language buttons */
}

nav ul.language-buttons button {
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    padding: 10px 20px; /* Adjust padding for larger clickable area */
    font-size: 1rem; /* Match or scale down language button size */
    background: rgba(0, 0, 0, 0.5);
    border-radius: 5px;
    cursor: pointer;
}

nav ul.language-buttons button:hover {
    background: rgba(0, 0, 0, 0.7);
}

/* Ensure Navigation Links and Language Buttons Stay Separate */
nav ul.language-buttons {
    align-self: flex-end; /* Keep language buttons in their current position */
}

/* Remove button styles for Home and Contact links */
nav ul li a[href="index.html"],
nav ul li a[href="contact.html"],
nav ul li a[href="pricing.html"] {
    background: none; /* Remove the background */
    padding: 0; /* Remove padding */
    color: #4abbbd; /* Keep text color */
    text-decoration: none; /* Remove underline */
    font-size: 1.5rem; /* Adjust size if needed */
    font-weight: normal; /* Optional: adjust font weight */
}

nav ul li a[href="index.html"]:hover,
nav ul li a[href="contact.html"]:hover,
nav ul li a[href="pricing.html"]:hover {
    text-decoration: underline; /* Optional: underline on hover */
}

/* Contact Page Styling */
.contact-page {
    max-width: 600px;
    margin: 0 auto;
    text-align: center;
    padding: 50px 20px;
    background: #f4f4f4;/* Contact Page Styling */

.contact-page h1 {
    margin-bottom: 20px;
}

.contact-details {
    text-align: left;
    margin-top: 20px;
    line-height: 1.8;
}

.contact-details ul {
    padding: 0;
    list-style: none;
}

.contact-details strong {
    font-weight: bold;
    color: #4abbbd;
}

    border-radius: 10px;
}

.contact-page form input, .contact-page form textarea {
    width: 100%;
    margin: 10px 0;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

.contact-page form button {
    padding: 10px 20px;
    background: #4abbbd;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.contact-page form button:hover {
    background: #3a9fa3;
}
.lang-switcher button {
    background: #fff;
    color: #4abbbd;
    border: none;
    padding: 15px 25px; /* Increased padding for a bigger button */
    border-radius: 8px; /* Slightly larger border radius for a rounded look */
    margin-left: 15px; /* Increased spacing between buttons */
    font-size: 1.2rem; /* Increased font size */
    cursor: pointer;
}

.lang-switcher button:hover {
    background: #3a9fa3;
    color: white;
}
/* Footer */
footer {
    background: #333;
    color: #fff;
    text-align: center;
    padding: 20px 0;
    margin-top: 20px;
    font-size: 0.9rem;
}
/* Social Media Buttons */
.social-buttons {
    margin-top: 20px;
    display: flex;
    justify-content: center;
    gap: 20px;
}

.social-buttons a {
    text-decoration: none;
    font-size: 1.2rem;
    font-weight: bold;
    padding: 10px 20px;
    border-radius: 5px;
    color: white;
    transition: background 0.3s ease;
}

/* Facebook Button */
.social-buttons .facebook-button {
    background: #3b5998; /* Facebook Blue */
}

.social-buttons .facebook-button:hover {
    background: #2d4373;
}

/* Instagram Button */
.social-buttons .instagram-button {
    background: #e4405f; /* Instagram Pink-Red */
}

.social-buttons .instagram-button:hover {
    background: #c13584;
}