
    body {
        font-family: Arial, sans-serif;
        background: url('../img/background1.jpg') no-repeat center center fixed;
        background-size: cover;
        position: relative;
        margin: 0;
        padding: 0;
    }
    body::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(255, 255, 255, 0.50); /* White overlay with 25% transparency */
        z-index: -1;
    }


    .container {
        max-width: 1080px;
        margin: 20px auto;
        padding: 30px;
        background: white;
        border-radius: 10px;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
    }
    .title {
        font-size: 2em;
        font-weight: bold;
        color: #903483;
        text-align: center;
        margin-bottom: 20px;
    }
    .content {
        font-size: 1.1em;
        color: black;
        line-height: 1.6;
    }
    .content ul {
        list-style-type: square;
        margin-left: 20px;
    }

    .download-btn {
        background-color: #ca3c95;
        color: white;
        border-radius: 8px;
        padding: 10px 20px;
        font-size: 1.0em;
        font-weight: bold;
        text-decoration: none;
        display: inline-block;
        transition: all 0.3s ease-in-out;
    }
    .download-btn:hover {
        background-color: #903483;
        transform: scale(1.05);
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
    }
    .download-btn:active {
        transform: scale(0.90);
    }

    /* FAQ section styling */

    .faq-container {
        max-width: 1080px;
        margin: 20px auto;
        padding: 20px;
        background-color: white;
        border-radius: 8px;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
    }
    .faq-question {
        font-weight: bold;
        font-size: 1.0em;
        color: #903483;
        cursor: pointer;
        margin-top: 10px;
    }
    .faq-answer {
        display: none;
        padding: 20px;
        border-left: 3px solid #ca3c95;
        margin-bottom: 10px;
        font-size: 0.9em;
    }

    /* FAQ section ends here*/

    /* Search box */

    .search-box { width: 100%; padding: 8px; margin-bottom: 10px; border: 1px solid #ccc; border-radius: 5px; }

    .profiles {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 15px;
    }

    .profile {
        border: 1px solid #ccc;
        padding: 15px;
        border-radius: 10px;
        text-align: center;
        flex: 1 1 calc(33.33% - 30px); /* Show 3 speakers per row */
        max-width: 250px;
        background: #f9f9f9;
    }

    img {
        width: 100%;
        height: auto;
        aspect-ratio: 3 / 4;
        object-fit: cover;
        border-radius: 10px;
    }

    .buttons { display: flex; justify-content: space-between; margin-top: 10px; }
    button { padding: 10px 15px; cursor: pointer; border: none; background: #007bff; color: white; border-radius: 5px; }
    button:hover { background: #0056b3; }

    /* Responsive styles */
    @media (max-width: 768px) {
        .profiles { flex-direction: column; }
        .profile { flex: 1 1 100%; max-width: 100%; } /* Show only 1 speaker on mobile */
    }
