*{
    box-sizing:border-box;
}
@media (max-width:991px){
    * {
        
        box-sizing:content-box;
        max-width: 100%;
        min-width:auto;
      }
      
    
    #home-page .links-wrapper{
    transform: translateX(0px);

    }

    /* .navigation-wrapper{
        display:flex;
        flex-direction:column;
        justify-content: center;
        align-items: center;
        height:100%;
        
        
    }
    /* Index page section *
    
    .navigation-wrapper> .left-column{
        order:2;
        margin-top: 10px;
        margin-bottom: 15px;
        /* width: 100%; *
    
    }
    .navigation-wrapper> .center-column{
        order:1;
        width:100%;
        
    }
    .navigation-wrapper> .right-column{
        order:3;
        margin-top: 15px;
        margin-bottom: 15px;
        /* width: 100%; *
        
    }
    .links-wrapper{
        flex-direction: column;
        margin-bottom:20px;
        width:100%;
    
    }
    .links-wrapper> .nav-link{
        margin-top:10px;
        margin-bottom: 10px;
        font-size: 1.5em;
        width: 100%;
    } */
    
    
    /* ===== TABLET & BELOW ===== */

    /* .navigation-wrapper{
        flex-direction:column;
        justify-content:center;
        align-items:center;
        height:auto;
        padding:30px 20px;
        text-align:center;
    } */

    /* Update one */
    /* ===== LOGO / CENTER COLUMN ===== */
    /* .navigation-wrapper > .center-column{
        order:1;
        width:100%;
    }

    .navigation-wrapper > .center-column > .banner-image{
        margin:0;
        justify-content:center;
    }

    .navigation-wrapper > .center-column > .banner-image img{
        width:220px;   /* reduced from 300px *
        padding:0;
    }


    /* ===== NAV LINKS ===== *
    .links-wrapper{
        flex-direction:column;
        align-items:center;
        gap:12px;
        margin-top:15px;
        width:100%;
    }

    .links-wrapper > .nav-link{
        width:100%;
    }

    .links-wrapper > .nav-link a{
        font-size:1.1rem;   /* cleaner than 1.5em *
        padding:8px 0;
        display:block;
    }

    .links-wrapper > .nav-link a:hover{
        letter-spacing:1px; /* reduce aggressive stretch *
    }


    /* ===== LEFT COLUMN ===== *
    .navigation-wrapper > .left-column{
        order:2;
        margin-top:15px;
        align-items:center;
        justify-content:center;
        text-align:center;
    }

    .navigation-wrapper > .left-column > .contact-hours-wrapper{
        text-align:center;
    }

    .navigation-wrapper > .left-column > .contact-hours-wrapper > .hours{
        font-size:0.75rem;
    }


    /* ===== RIGHT COLUMN ===== *
    .navigation-wrapper > .right-column{
        order:3;
        margin-top:15px;
        justify-content:center;
        text-align:center;
        flex-direction:column;
        gap:10px;
    }

    .navigation-wrapper > .right-column > .address-wrapper{
        text-align:center;
        font-size:0.9rem;
    }

    .navigation-wrapper > .right-column > .contact-icon{
        margin-left:0;
        font-size:1.6em;
    } */

/* Update 2 */

    /* ===== TABLET & BELOW ===== */


    .navigation-wrapper{
        flex-direction:column;
        height:auto;
        padding:30px 20px;
        gap:20px;
        text-align:center;
    }

    /* ===== REMOVE DESKTOP OFFSETS ===== */
    .navigation-wrapper > .center-column{
        width:100%;
    }

     .navigation-wrapper > .center-column > .banner-image{
        margin:0 !important;
        display:flex;
        justify-content:center;
        max-width: 100%;
    }

    .navigation-wrapper > .center-column > .banner-image img{
        padding:0 !important;
        margin:0 auto;
        display:block;
        width:clamp(140px, 25vw, 200px);

    }


    /* Review????? */
     .heading-wrapper{
        width:100%;
        text-align:left !important;
    }

    .heading-wrapper h1{
        text-align:left !important;
        font-size:1.8rem;
        margin:0;
    }
   

   
    /* ===== STACK ORDER (LOGICAL FLOW) ===== */
    .navigation-wrapper > .nav-info:first-of-type{
        order:2;
        justify-content:center;
    }

    .navigation-wrapper > .nav-center{
        order:1;
    }

    .navigation-wrapper > .nav-info:last-of-type{
        order:3;
        justify-content:center;
        flex-direction:column;
        gap:8px;
    }

    
    .navigation-wrapper > .right-column > .address-wrapper{

        text-align:center;
    }

    /* ===== NAV LINKS (CLEAN STACK) ===== */
    .links-wrapper{
        flex-direction:column;
        align-items:center;
        gap:5px;
        margin-top:-20px;
        width:100%;
    }

    .links-wrapper > .nav-link{
        width:100%;
    }

    .links-wrapper > .nav-link a{
        display:block;
        font-size:1.05rem;
        padding:10px 0;
        /* border-bottom:1px solid rgba(0,0,0,0.08); */
    }

    .links-wrapper > .nav-link:last-child a{
        border-bottom:none;
    }

    .links-wrapper > .nav-link a:hover{
        letter-spacing:1px;
    }


    /* ===== LEFT COLUMN ===== */
    .navigation-wrapper > .left-column{
        flex-direction:column;
        align-items:center;
        gap:8px;
    }

    .navigation-wrapper > .left-column > .contact-hours-wrapper{
        text-align:center;
    }

    .navigation-wrapper > .left-column > .contact-hours-wrapper .phone{
        font-size:1rem;
        font-weight:600;
    }

    .navigation-wrapper > .left-column > .contact-hours-wrapper .hours{
        font-size:0.75rem;
    }


    /* ===== RIGHT COLUMN ===== */
    .navigation-wrapper > .right-column > .address-wrapper{
        text-align:center;
        font-size:0.9rem;
    }

    .navigation-wrapper > .right-column > .contact-icon{
        margin:0;
        font-size:1.5em;
    }


    .links-wrapper > .nav-link a{
        transition:0.3s ease;
    }

    .links-wrapper > .nav-link a:active{
        transform:scale(0.97);
    }



    .hero-section {
        padding:50px 20px;
        /* width: 100%; */
    
    }
       
    .features-section{
        height:100%;
        width: 100%;
        /* padding:50px 20px; */
    }
    
    .features-section> .columns-wrapper{
        width:100%;
        flex-direction: column;
        align-items:center;
    }

    .google-maps{
        display: flex;
        flex-direction: column;
    }
    .maps img{
       max-width: 100%;
        transition: none;
    }
    .maps img:hover{
        transform: none;
    }
    .maps {
        margin-bottom: 20px;
      }
    .footer{
        height:100%;
    }
    /* About Section */
    .skewed-header>.skewed-header-wrapper> .skewed-header-content{
        flex-direction: column;
    }
    .skewed-header> .header-bg{
        background-size: 100%;
    }
    .page-conatiner{
        padding-left:21px;
        padding-right:21px;
    }
    
    .content-wrapper> #imag {
        /* Important helps stress the code as to overite the previous set code */
        margin:0px 0px 25px 0px !important;
        width:100% !important;
        /* padding-left: 30px; */
    }
    .content-wrapper h1,h2{
        padding-left: 20px;
    }
    .content-wrapper p{
        line-height: 1.3rem;
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .square{
        grid-template-columns: 1fr !important;
    
    }
    .square>.square-text-wrapper{
        order:1;
        /* word-break: break-word; */
    }
    .square> .img-wrapper{
        order:2;
    }
    /* .square > .square-text-wrapper p{
        word-break: break-word;
    } */
    /* Menu Styles */
    /* content auto updated aftersetting up the nav bar and about us page */
    
    /* Contact Stypes */
    .contact-grid-wrapper{
        width:100%;
        grid-template-columns: 1fr;
        grid-gap:50px;
        padding:50px;
    }
    
    form input{
        padding: 1.5rem 0rem;
        
    }
    form textarea {
        padding: 1.5rem 0rem;
    }

    .donate-header h1 {
        font-size: 1.5rem;
        padding-left: 40px;
      }
    .page-text p {
        /* font-size: 0.9rem; */
        line-height: 1.3rem;
        padding-left: 15px;
        padding-right: 15px;
      }

     
      h3 {
        font-size: 1.2rem;
      }
      .payment-dropdown-content p {
        font-size: 0.9rem;
        width: 100%;
      }
    

}