﻿.footer-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    padding: 20px;
    background-color: #333;
    color: white;
}

.footer-sections {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 100%;
}

.footer-section {
    flex: 1 1 200px; /* Allow each section to take up at least 200px, but grow to fill space */
    margin: 10px;
    max-width: 25%; /* Ensure that the sections do not exceed 25% of the width */
}

    .footer-section h4 {
        border-bottom: 1px solid white;
        padding-bottom: 10px;
    }

    .footer-section ul {
        list-style: none;
        padding: 0;
    }

        .footer-section ul li a {
            color: lightblue;
            text-decoration: none;
            padding: 2px 0;
            display: block;
        }

            .footer-section ul li a:hover {
                color: white;
                text-decoration: underline;
            }

.footer-logos, .footer-legal {
    flex: 1 100%;
    text-align: center;
    margin-top: 20px;
}

    .footer-legal p {
        margin: 0;
        padding: 10px 0;
    }

@media (max-width: 768px) {
    .footer-sections {
        flex-direction: column; /* Stack sections vertically */
        align-items: center; /* Center sections horizontally */
        gap: 10px; /* Add smaller spacing between sections */
    }

    .footer-section {
        max-width: 100%; /* Allow sections to span the full width */
        text-align: center; /* Center-align text for better readability */
        margin: -10px 0; /* Reduce the margin between sections */
    }

        .footer-section h4 {
            text-align: center; /* Center-align headings */
            margin-bottom: 5px; /* Reduce space below the heading */
        }

        .footer-section ul {
            padding: 0;
            margin: 0;
        }

            .footer-section ul li {
                margin-bottom: 5px; /* Reduce spacing between list items */
            }

                .footer-section ul li a {
                    font-size: 0.9em; /* Optional: Adjust link size for mobile */
                    line-height: 1.2; /* Adjust line spacing for better readability */
                }
}

