.title-link {
        display: -webkit-box;      /* Required for Safari */
        -webkit-box-orient: vertical; /* Required for Safari */
        overflow: hidden;
        -webkit-line-clamp: 3;    /* Limits to 3 lines */
        line-height: 1.2em;       /* Adjust this based on your font size */
        max-height: 3.6em;        /* 3 lines x line-height */
    }

    .bs-blog-post {
        margin: 0; /* You can adjust this if needed */
        position: relative;
        padding: 0;
    }
    .responsive-image {
        height: 300px; 
        object-fit: cover; 
        transition: transform 0.5s ease; /* Smooth transition for the zoom effect */
    }

    .bs-blog-post:hover .responsive-image {
        transform: scale(1.1); /* Scale the image to 110% on hover */
    }

    .small-title {
        font-size: 0.8rem; 
    }
    .new-title1 {
        padding: 0.5rem; /* Remove all padding */
        margin: 0; /* Remove any margin if needed */
        font-size: 0.8rem;
    }

    .quality-overlay {
        position: absolute;
        top: 10px;
        right: 10px;
        background-color: rgba(0, 123, 255, 0.7); 
        color: white; 
        padding: 5px 10px; 
        border-radius: 5px; 
        font-weight: bold; 
        font-size: 0.5rem;
    }
    .language-display {
        display: inline-block; /* Keep it inline-block for button effect */
        background-color: rgba(0, 123, 255, 0.7); /* Background color */
        color: white; /* Text color */
        padding: 2px; /* Padding for button appearance */
        font-size: 0.75rem; /* Font size */
        text-align: center; /* Center align text */
        text-decoration: none; /* Remove underline */
        border: none; /* No border */
        border-radius: 0; /* No rounded corners */
        margin: 0; /* No margin */
    }

    .language-display:hover {
        background-color: rgba(0, 100, 200, 0.8); /* Darker background on hover */
    }
    .row {
        margin-left: -0.4rem; /* Adjust for grid gap */
        margin-right: -0.4rem; /* Adjust for grid gap */
    }
    .col-lg-2, .col-md-4, .col-sm-6, .col-6 {
        padding-left: 0.2rem; /* Adjust padding if necessary */
        padding-right: 0.2rem; /* Adjust padding if necessary */
    }
    
    @media (max-width: 768px) {
        .responsive-image {
            height: 200px; 
        }
        .small-title {
            font-size: 0.9rem; 
        }
        .quality-overlay {
            font-size: 0.5rem; 
        }
    }