@media screen and (max-width:576px) {
    .header-container{
        flex-direction: column;
        padding: 15px;
        background-color: blue;
    }
    .list-item {
        flex-direction: column;
    }
    .logo-title{
        font-size: 30px; 
    }
    .banner-container{
        flex-direction: column ;
    
    }

.banner-text-container{
    width: 100%;
}
.banner-title{
    font-size: 50px;
}
.banner-image-container{
    width: 100%;
}
.banner-sub-title{
    text-align: center;
}
/*.discount-badge{
    top: 80%;

}*/
.products-container{
    grid-template-columns: repeat(1,1fr);
}

}