.img1 {
    grid-area: img1;
}

.img2 {
    grid-area: img2;
}

.img3 {
    grid-area: img3;
}

.img4 {
    grid-area: img4;
}

.img5 {
    grid-area: img5;
}

.img6 {
    grid-area: img6;
}

.img7 {
    grid-area: img7;
}

.img8 {
    grid-area: img8;
}

.img9 {
    grid-area: img9;
}

.img10 {
    grid-area: img10;
}

.img11 {
    grid-area: img11;
}

.img12 {
    grid-area: img12;
}

.img13 {
    grid-area: img13;
}

.img14 {
    grid-area: img14;
}

.img15 {
    grid-area: img15;
}

.grid {
    background-color: #001020;
    display: grid;
    grid-template-areas:
        'img1 img2 img3'
        'img4 img5 img6'
        'img7 img8 img9'
        'img10 img11 img12'
        'img13 img14 img15';
    gap: 0px;
    /* background-color: #2196F3; */
    /* background-color: black; */
    padding: 0px;
    grid-template-columns: auto auto auto;
    grid-template-rows: auto auto auto auto auto;
}

.grid img {
    width: 300px;
    height: 300px;
    object-fit: cover;
    vertical-align: middle;
    box-shadow: 0px 0px 300px black inset;
}