@charset "utf-8";
/* CSS Document */
<style>
        .navbar {
            background: rgba(76, 111, 86, 0.70);
        }

        body {
            font-family: "Century Gothic", sans-serif;
        }

        .navbar-brand img {
            width: 60px;
            height: 60px;
            border-radius: 50%;
        }

        .nav-link {
            color: white !important;
        }

        .dropdown-menu {
            background: rgba(255, 255, 255, 0.70);
        }

        .dropdown-item {
            color: black !important;
        }

        .testimonial-card {
            max-width: 1309px;
            background: white;
            box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
            border-radius: 14px;
            border: 1.85px solid #D9D9D9;
            padding: 24px 44px 44px 54px;
            display: flex;
            flex-direction: column;
            gap: 20px;
        }
<style>.container-fluid {
    position: relative;
    z-index: 1; /* Ensure the text is above the background */
    padding: 50px 0; /* Add padding for better spacing */
}

.background-image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url('https://via.placeholder.com/1920x1080');; /* Replace with your image path */
    background-size: cover; /* Cover the entire container */
    background-position: center; /* Center the image */
    opacity: 0.2; /* Set the opacity to 20% */
    z-index: 0; /* Place the background behind the text */
}

.blockquote {
    position: relative; /* Ensure the blockquote is above the background */
    color: black; /* Change text color for better visibility */
    z-index: 1; /* Ensure the blockquote is above the background */
}</style>

        .testimonial-title {
            font-size: 34px;
            font-weight: 600;
        }

        .testimonial-author {
            font-size: 26px;
            font-weight: 500;
            color: rgba(0, 0, 0, 0.6);
        }

        .testimonial-text {
            font-size: 16px;
            font-weight: 500;
            color: rgba(0, 0, 0, 0.6);
            line-height: 22.4px;
        }

        .testimonial-image {
            width: 74px;
            height: 74px;
            border-radius: 50%;
            object-fit: cover;
        }

        .footer {
            background: rgba(77, 112, 86, 0.7);
            padding: 50px 30px;
            color: white;
            border-top: 1px solid #D9D9D9;
        }

        .footer .profile-img {
            width: 100px;
            height: 100px;
            border-radius: 50%;
        }

        .footer .social-icons a {
            color: white;
            font-size: 24px;
            margin-right: 15px;
        }

        .footer a {
            color: rgba(255, 255, 255, 0.8);
            text-decoration: none;
        }

        .footer a:hover {
            color: white;
        }

        .section-container {
            width: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 50px 0;
            background: #f5f5f5;
        }

        .grid-container {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            grid-template-rows: repeat(2, auto);
            gap: 20px;
            width: 90%;
            max-width: 1300px;
        }

        .card {
            display: flex;
            flex-direction: row;
            align-items: flex-start;
            background: white;
            opacity: 0.80;
            box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
            padding: 20px;
            position: relative;
            border-radius: 8px;
            min-height: 140px;
        }

        .image-placeholder {
            width: 100px;
            height: 100px;
            background: #ddd;
            border-radius: 8px;
            flex-shrink: 0;
            object-fit: cover;
        }

        .card-content {
            flex: 1;
            padding-left: 20px;
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
        }

        .card-title {
            font-size: 20px;
            font-weight: 600;
            color: #1E1E1E;
            margin-bottom: 5px;
        }

        .card-text {
            font-size: 14px;
            color: #1E1E1E;
            line-height: 20px;
        }

        .arrow-icon {
            width: 25px;
            height: 25px;
            position: absolute;
            bottom: 10px;
            right: 10px;
        }
    </style>






































































@media screen{
}

@media screen{
}