/* Basic styling. Update as needed. */
body {
    font-family: Arial, sans-serif;
}

header {
    background-color: #00b0ff; /* Lighter shade of blue */
    padding: 10px;
    text-align: center;
}

header nav a {
    color: black; /* Default link color */
    text-decoration: none; /* Removes underline */
    margin: 0 10px; /* Spacing between links */
}

header nav a:hover {
    color: black; /* Black color on hover */
    text-decoration: underline; /* Adds underline on hover */
}

.about-style {
    margin: auto; /* Center the container */
    text-align: justify; /* Justifies the body text */
    text-justify: inter-word; /* Improves spacing between words */
}

.about-style h1 {
    text-align: left; /* Left-aligns the heading */
}

.about-style a {
    color: black; /* Default link color, similar to footer */
    text-decoration: none; /* Removes underline */
}

.about-style a:hover {
    color: black; /* Black color on hover, similar to footer */
    text-decoration: underline; /* Adds underline on hover */
}

.contact-style {
    max-width: 500px; /* Set a maximum width for the body content */
    margin: auto; /* Center the container */
    text-align: justify; /* Justifies the body text */
    text-justify: inter-word; /* Improves spacing between words */
}

.contact-style h1 {
    text-align: left; /* Left-aligns the heading */
}

.contact-style a {
    color: black; /* Default link color, similar to footer */
    text-decoration: none; /* Removes underline */
}

.contact-style a:hover {
    color: black; /* Black color on hover, similar to footer */
    text-decoration: underline; /* Adds underline on hover */
}

footer {
    background-color: #f2f2f2;
    padding: 10px;
    text-align: center;
}

footer a {
    color: black; /* Default link color in footer */
    text-decoration: none; /* Removes underline */
}

footer a:hover {
    color: black; /* White color on hover */
    text-decoration: underline; /* Adds underline on hover */
}

main {
    margin: 20px;
}

.divider {
    border-bottom: 2px solid #00b0ff; /* Light blue divider */
    margin: 10px 0; /* Spacing around the divider */
}

.info-text {
    text-align: justify; /* Justifies the text */
    text-justify: inter-word; /* Improves spacing between words */
}

.content-container {
    max-width: 800px; /* Set a maximum width */
    margin: auto; /* Center the container */
    padding: 0 20px; /* Add some padding */
}
