/* Site geneli responsive */

img,
video {
    max-width: 100%;
    height: auto;
}

.table-responsive,
.bank-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.bank-table {
    min-width: 520px;
}

.prose img,
.article-body img {
    border-radius: 10px;
    margin: 1rem 0;
    width: 100%;
}

.prose table,
.article-body table {
    display: block;
    width: 100%;
    overflow-x: auto;
    border-collapse: collapse;
    font-size: .9375rem;
    margin: 1rem 0;
}

.prose table th,
.prose table td,
.article-body table th,
.article-body table td {
    border: 1px solid #e8e2d8;
    padding: .65rem .85rem;
    text-align: left;
}

iframe {
    max-width: 100%;
}

@media (max-width: 1024px) {
    .contact-layout,
    .about-layout,
    .blog-layout,
    .campaigns-layout {
        grid-template-columns: 1fr !important;
    }

    .blog-filter,
    .campaigns-filter,
    .about-nav {
        position: static;
    }

    .trust-grid,
    .bank-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .container {
        padding-left: 16px;
        padding-right: 16px;
    }

    .section {
        padding: 2rem 0;
    }

    .page-hero {
        padding: 2.25rem 0;
    }

    .page-hero h1 {
        font-size: clamp(1.45rem, 5.5vw, 1.9rem);
    }

    .page-hero p {
        font-size: 1.0625rem;
    }

    .donate-box {
        position: static;
    }

    .form-row {
        grid-template-columns: 1fr;
    }

    .amount-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .event-grid,
    .photo-grid,
    .gallery-row,
    .news-grid {
        grid-template-columns: 1fr !important;
    }

    .cta-band {
        padding: 2.5rem 0;
    }

    .cta-band__actions {
        flex-direction: column;
        align-items: stretch;
    }

    .campaigns-chips,
    .blog-topics {
        justify-content: flex-start;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding-bottom: .35rem;
        margin-left: -4px;
        margin-right: -4px;
    }

    .campaigns-chip,
    .blog-topic-chip {
        flex-shrink: 0;
    }
}

@media (max-width: 480px) {
    .amount-grid {
        grid-template-columns: 1fr 1fr;
    }

    .navbar__menu {
        max-height: calc(100vh - 70px);
        overflow-y: auto;
    }

    .campaign-list-card__actions {
        grid-template-columns: 1fr;
    }
}