@media only screen and (max-width: 768px) {
    .h2 {
        font-size: 32px;
    }

    .h1 {
        font-size: 40px;
    }

    .mob-hide {
        display: none;
    }

    .dk-hide {
        display: block;
    }

    .py-large {
        padding-top: 90px;
        padding-bottom: 90px;
    }

    .py-normal {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .pb-normal {
        padding-bottom: 60px;
    }

    .container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .mgap-10 {
        gap: 10px;
    }

    .mgap-20 {
        gap: 20px;
    }

    .mgap-30 {
        gap: 30px;
    }

    .colour-block {
        padding: 50px 20px 0 20px;
    }

    .featured-icon {
        width: 50px;
        left: calc(50% - 25px);
        top: -27px
    }

    .mb-large {
        margin-bottom: 40px;
    }

    .mgrid-1 {
        grid-template-columns: 1fr;
    }

    .mgrid-2 {
        grid-template-columns: 1fr 1fr;
    }

    .mpx-none {
        padding-left: 0;
        padding-right: 0;
    }

    #home-involved .grid-item {
        padding: 50px 20px 118px 20px;
    }

    .mcolumn {
        flex-direction: column;
    }

    .malign-center {
        align-items: center;
    }

    .malign-start {
        align-items: flex-start;
    }

    .mcolumn-reverse {
        flex-direction: column-reverse;
    }

    .mcenter-text {
        text-align: center;
    }

    .home-about {
        width: 100%;
    }

    .three-leaf-abs {
        width: 110px;
        top: 40px;
        left: 0px;
    }

    #about-section .container {
        padding-left: 57.5px;
    }

    #hero-image {
        height: 40vh;
    }

    #vision-mission .grid-item {
        padding: 50px 20px 20px 20px;
    }

    .volunteer-cta {
        padding: 50px 20px 20px 20px;
    }

    .blog-page-meta {
        padding: 10px;
    }

    .h5 {
        font-size: 18px;
    }

    .header-content,
    .page-meta {
        width: 100%;
    }

    .page-meta {
        padding-top: 20px;
    }

    .page-content blockquote {
        padding: 20px;
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .page-content blockquote p {
        font-size: 18px;
    }

    .mb-med {
        margin-bottom: 20px !important;
    }

    .donate-project {
        padding-left: 5px;
        padding-right: 5px;
    }

    .mpb-small {
        padding-bottom: 10px;
    }

    #projects-goals .grid-item {
        padding: 30px 20px;
    }

    #projects-location .orange-bg {
        padding: 50px 20px 20px 20px;
    }

    .mwidth-100 {
        width: 100%;
    }

    .contact-div {
        width: calc(50% - 30px);
    }

    .mwrap {
        flex-wrap: wrap;
    }

    .contact-left {
        padding: 50px 20px;
    }

    .mob-line {
        width: 30px;
        height: 3px;
        background-color: #fff;
    }

    .mob-line:not(:last-child) {
        margin-bottom: 5px;
    }

    #logo img {
        height: 50px;
        width: auto;
    }

    #footer {
        padding: 30px 0 30px 0;
    }

    .footer-logo img {
        height: 100px;
        padding-bottom: 20px;
    }

    .hero-slide {
        width: 0vw;
    }

    .hero-active {
        width: 100vw;
    }

    .modal {
        padding: 0;
    }
}