/* Main elements */
body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f0efe9; /* Light beige for background */
    text-align: center;
}
header {
    background-image: url('header.png');
    background-size: cover;
    background-position: center;
    color: #44423d; /* Dark grey for text */
    text-align: center;
    padding: 1em 0;
}
iframe {
    width: 100%;
    border: none;
    box-shadow: none;
}
nav {
    background-color: #8b8075; /* Muted brownish-grey for navbar */
    padding: 1em;
    text-align: center;
}
nav a {
    color: white;
    margin: 0 1.5em;
    text-decoration: none;
    padding: 0.5em 1em;
    font-size: 1.1em;
    border-radius: 4px;
}
nav a:hover {
    background-color: #a09688; /* Slightly lighter hover */
}
.container {
    width: 80%;
    margin: auto;
    overflow: hidden;
}
header h1 {
    font-size: 4em;
    color: #302f2c; /* Dark greyish brown */
    text-shadow: -3px -3px 0 #e9e8e2, 3px -3px 0 #e9e8e2, -2px 2px 0 #e9e8e2, 2px 2px 0 #e9e8e2;
}
h2 {
    text-align: center;
    color: #302f2c;
}
footer {
    background-color: #8b8075;
    color: white;
    text-align: center;
    padding: 6em 0 1em;
    background-image: url('logo-circle.png');
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 90px;
}
/* Footer links same as nav */
footer a {
    color: white;
    margin: 0 1.5em;
    text-decoration: none;
    padding: 0.5em 1em;
    font-size: 1.1em;
    border-radius: 4px;
}
footer a:hover {
    background-color: #a09688;
}

/* Box styling */
.box {
    background-color: #b5b1a5; /* Light grey-beige */
    text-align: center;
    max-width: 600px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s, box-shadow 0.3s;
}
.box a {
    background-color: #8b8075;
    color: white;
    border-radius: 4px;
}
.box a:hover {
    background-color: #a09688;
}

/* Mission and Testimonial boxes */
.testimonial, .mission {
    background-color: #b5b1a5;
    color: #302f2c;
    border-left: 5px solid #8b8075;
}


/* Black button style for links */
a.black-button {
    display: inline-block;
    background-color: #000000; /* Black background */
    color: white; /* White text */
    padding: 10px 20px; /* Padding to make it look like a button */
    text-align: center; /* Center the text */
    text-decoration: none; /* Remove underline */
    border-radius: 4px; /* Rounded corners */
    font-size: 1.1em; /* Adjust font size if needed */
    transition: background-color 0.3s ease; /* Smooth hover transition */
}

a.black-button:hover {
    background-color: #444444; /* Lighter black on hover */
}
