.container{
    display:grid;
    /*grid-template-columns: auto auto;
    grid-template-rows: auto auto auto auto auto auto auto;
    grid-gap: 10px; /*ruimte tussen de blokjes*/
}

.block.block{
    background:#1C2023;
}

.block.block1{
    

    display:grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 3px;
    padding: 3px;
}

.block.block1 img{
    width: 100%;
    height: auto;
    position: relative;
    z-index: 1;
}

.block.block2{
    text-align: center;
}
.block.block3{
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 3px;
    padding: 3px;
}
.block.block3 img{
    width: 100%;
    height: auto;
    position: relative;
    z-index: 1;
    margin: auto;   
}

.block.block4{
    padding: 10px;
}
.block.block5{
    text-align: center;
    padding: 10px;
}
.block.block6{
    padding: 10px;
    text-align: center;
}
.block.block7{
    text-align: center;
    padding: 10px;
}

.responsive{
    width: 25%;
    height: auto;
}

@media screen and (min-width:768px){
    header{
        grid-template-columns: auto;
    }
    .block.block1{
        grid-row: 1;
    }
    .block.block2{
        grid-row: 2;
    }
    main{
        grid-template-columns: auto;
    }
    .block.block3{
        grid-row: 1;
    }
    .block.block4{
        grid-row: 3;
    }
    .block.block5{
        grid-row: 2;
    }
    .block.block6{
        grid-row: 4;
    }
    footer{
        grid-template-columns: auto;
    }
    .block.block7{
        grid-row: 1;
    }
    body{
        font-size: 90%;
    }
}


@media screen and (min-width:992px){
    header{
        grid-template-columns: auto;
    }
    .block.block1{
        grid-row: 1;
        grid-column: 1;
    }
    .block.block2{
        grid-row: 2;
        grid-column: 1;
    }
    main{
        grid-template-columns: auto auto;
    }
    .block.block3{
        grid-row: 1;
        grid-column: 1;
    }
    .block.block4{
        grid-row: 1;
        grid-column: 2;
    }
    .block.block5{
        grid-row: 2;
        grid-column: 1;
    }
    .block.block6{
        grid-row: 2;
        grid-column: 2;
    }
    footer{
        grid-template-columns: auto;
    }
    .block.block7{
        grid-row: 1;
        grid-column: 1;
    }
}  