@media only screen and (max-width: 1560px) {
    .services .container_s2 div {
        padding-left: 5%;
        grid-template: 100% / 1fr 1fr;
    }

    .services .container_s2 div:nth-child(even){
        padding-left: 0;
        padding-right: 5%;
        grid-template: 100% / 1fr 1fr;
    }

    .contact .container_s2 .wrapper {
        padding-left: 5%;
    }


    .contact .container_s2 .wrapper .form_wrapper {
        padding-right: 5%;
    }
}

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

}

@media only screen and (max-width: 1250px) {
    .uit_proj .container_s1 .proj_holder .proj_row {
        height: 300px;
    }

    .contact .container_s2 .wrapper .form_wrapper form > span {
        display: flex;
        flex-flow: column;
        gap: 20px;
    }
}

@media only screen and (max-width: 1070px) {
    nav .main_nav > span > span {
        display: none;
    }

    nav .main_nav > span .hamburger {
        display: flex;
        margin-left: auto;
        margin-right: 20px;
    }

    .diensten_banner .container_s1 .list_diensten {
        justify-content: center;
    }

    footer .big_logo {
        bottom: 90px;
        left: calc(100% - 380px);
        height: 210px;
        width: 464px;
    }

    .services .container_s2 div {
        padding-left: 0;
        max-width: 90%;
        margin: auto;
    }

    .services .container_s2 div:nth-child(even){
        padding-left: 0;
        padding-right: 0;
        max-width: 90%;
        margin: auto;
    }

    .services .container_s2 div,
    .services .container_s2 div:nth-child(even) {
        grid-template: auto auto / 100%;
    }

    .services .container_s2 div:nth-child(even) figure {
        grid-row: 2/3;
        grid-column: 1/2;
    }

    .services .container_s2 div figure {
        min-height: 100px;
        max-height: 430px;
    }

    .services .container_s2 {
        gap: 80px;
    }

    header .container_s1 figure.background-blue img {
        bottom: -10%;
        right: -10px;
        height: 60%;
      }
}

@media only screen and (max-width: 950px) {
    .contact .container_s2 .wrapper {
        flex-flow: column;
    }
}

@media only screen and (max-width: 850px) {
    footer .container_s1 .list_holder .list:nth-child(1) {
        margin-right: 100px;
    }
}

@media only screen and (max-width: 800px) {
    .uit_proj .container_s1 .proj_holder .proj_row,
    .uit_proj .container_s1 .proj_holder .proj_row:nth-child(odd) {
        grid-template: 1fr 1fr / 1fr;
        height: auto;
    }

    .uit_proj .container_s1 .proj_holder .proj_row figure {
        height: auto;
    }

    .uit_proj .container_s1 .proj_holder .proj_row figure img {
        height: auto;
    }

    .filter_container {
        display: flex;
        flex-wrap: wrap;
    }
    
    .uit_proj .container_s1 .sub_title_container > .filter_container {
        display: none;
    }
}

@media only screen and (max-width: 750px) {
    .size_big {
        font-size: 2.5rem;
        line-height: 48px;
    }

    .button {
        padding: 13px 20px 15px 20px;
    }

    nav .main_nav {
        padding: 30px 0;
    }

    nav .nav_top > span {
        align-items: center;
        justify-content: center;
    }

    header .container_s1 {
        clip-path: polygon(0 50px, 50px 0, 100% 0, 100% calc(100% - 50px), calc(100% - 50px) 100%, 0 100%);
        max-height: 530px;
        min-height: 490px;
    }

    header.small .container_s1 {
        min-height: 200px;
        max-height: 290px;
    }

    header .container_s1 .grad {
        width: 100%;
        background: -moz-linear-gradient(90deg, rgba(6,3,47,0.8) 0%, rgba(6,3,47,0.15) 100%);
        background: -webkit-linear-gradient(90deg, rgba(6,3,47,0.8) 0%, rgba(6,3,47,0.15) 100%);
        background: linear-gradient(90deg, rgba(6,3,47,0.8) 0%, rgba(6,3,47,0.15) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#06032f",endColorstr="#06032f",GradientType=1);
    }

    header .container_s1 article {
        bottom: 30px;
        left: 30px;
        width: calc(80% - 30px);
    }

    header .container_s1 article .buttonwrapper {
        flex-wrap: wrap;
    }

    footer .container_s1 .list_holder {
        flex-flow: row;
        flex-wrap: wrap;
        gap: 50px;
    }
}

@media only screen and (max-width: 600px) {
    nav .main_nav > span .hamburger {
        margin-right: 0;
    }

    nav .main_nav > span .button {
        display: none;
    }

    .mobile {
        display: flex !important;
    }

    .desktop {
        display: none !important;
    }
}

@media only screen and (max-width: 500px) {
    nav .main_nav .logo {
        width: 130px;
    }

    header .container_s1 article {
        bottom: 20px;
        left: 20px;
        width: calc(95% - 20px);
    }
}
