@media screen and (max-width: 800px) {
    
    
    #work section {
        width: 100%;
    }

    h1{
        padding-left: 10px;
    }
    
    .service{
        /* max-width: 180px; */
        width: 42%;
        /* min-width: 140px; */
    }
    .service span{
        font-size: 12px;
    }
    #banner-info{
        display: block;
        text-align: center;
        margin: auto;
    }

    #banner-info img{
        display: block;
        margin: -50px auto 10px !important;
    }

    .project {
        width: 100%;
    }

    #stack img{
        width: 40px;
    }

    .champs {
        width: 100%;
    }
    #stack {
        text-align: center;
        margin:auto;
        
    }
    form textarea{
        width: 100%;
    }

    nav{
        justify-content: space-between;
    }
    nav #links{
        display: none;
    }
    .burger{
        display: block;
    }

    .course{
        width: 100%;
        box-sizing: border-box;
    }
    .stack{
        width: 42%;
    }
    .stack div{
        display: inline-block;
        text-align: center;
        margin: 10px 10px;
    }
    .stack span{
        display: block;
    }

    #stack .flex{
        justify-content: center;
    }
}

@media screen and (max-width: 500px) {

    .service {
        width: 40%;
    }
    .stack{
        width: 100%;
    }
}