/* X-Large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {
    .res {
        color: rgb(0, 255, 21);
        font-size: 30px;
    }
}

/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
    .res {
        color: blue;
        font-size: 25px;
    }
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {

    .res {
        color: yellow;
        font-size: 20px;
    }

    .blog-post-images {
        max-width: 100%;
        max-height: 255px;
    }
    
    .member-grid {
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    .about-img {
        max-height: 100%;
    }

    .blog-post-images {
        max-width: 100%;
        max-height: 255px;
    }

    .flex-container-filter {
        display: flex;
        flex-direction: column;
    }

    .gender {
        width: 100%;
    }

    .city {
        width: 100%;
    }

    .filter-header-zz {
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .res {
        color: green;
        font-size: 15px;
    }
}

/* X-Small devices 800X600 (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    .breadcrumb ul {
        grid-template-columns: auto auto auto;
    }

    .filter-container .halign-table {
        padding: 3px;
        margin-right: 15px;
    }

    .res {
        color: red;
        font-size: 10px;
    }
    
    .images-wrapper3,
    .images-wrapper2 {
        grid-template-columns: auto;
    }
}