@media screen and (min-width: 768px) and (max-width: 1023px){

.wrapper{
width: min(76.8rem, 100vw);
}
.box-txt{
width: 76.8rem;
}
.banner{
    width: 100%;
    height: 100%;
    
    object-fit:cover;
    object-position:0% 70%;
    
    }

.info-belagua{
padding-top: 40vh;
grid-template-columns: 2fr;
grid-template-areas: 'A B';
background-color: var(--background-primary);
}
.info-belagua h3{
font-size: 3.6rem;
}
.info-belagua p{

padding-top: 4rem;
}


.min{
width: 23rem;
object-fit: cover;
}
.box-voluntarios{
display: flex;
flex-direction: row;
}
.card-voluntario{
width: 50%;
}
.card{
    width: 40%;
    height: 45rem;
    margin: 3rem 1rem 2rem 1rem;
    background-color:#364F75;
    border: none;
    border-radius: 2rem;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4rem;

    padding: 2.6rem;  

    box-shadow: 0rem 0rem 1rem;
    margin-bottom: 1rem;
}
.img-voluntario{
width: 65%;
}
.card-projeto{
width: 45%;
height: 65rem;
padding: 2rem 1.5rem;
}
#footer{
height: 25rem;
}
footer .wrapper{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
}
#modalImg{
    width: auto;
    height: 95vh;
    object-fit:contain;
    border-radius: 2rem;
     
}


}