.parent {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(19, 1fr);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    }

    .div1 { grid-area: 1 / 1 / 2 / 2; }
    .div2 { grid-area: 1 / 2 / 2 / 3; }
    .div3 { grid-area: 1 / 3 / 2 / 4; }
    .div4 { grid-area: 1 / 4 / 2 / 5; }
    .div5 { grid-area: 1 / 5 / 2 / 6; }
    .div6 { grid-area: 2 / 1 / 8 / 2; }
    .div7 { grid-area: 8 / 1 / 14 / 2; }
    .div8 { grid-area: 14 / 1 / 20 / 2; }
    .div9 { grid-area: 2 / 2 / 4 / 3; }
    .div10 { grid-area: 4 / 2 / 6 / 3; }
    .div11 { grid-area: 6 / 2 / 8 / 3; }
    .div12 { grid-area: 2 / 3 / 4 / 4; }
    .div13 { grid-area: 4 / 3 / 6 / 4; }
    .div14 { grid-area: 6 / 3 / 8 / 4; }
    .div15 { grid-area: 2 / 4 / 4 / 5; }
    .div16 { grid-area: 4 / 4 / 6 / 5; }
    .div17 { grid-area: 6 / 4 / 8 / 5; }
    .div18 { grid-area: 2 / 5 / 4 / 6; }
    .div19 { grid-area: 8 / 2 / 11 / 3; }
    .div20 { grid-area: 11 / 2 / 14 / 3; }
    .div21 { grid-area: 4 / 5 / 6 / 6; }
    .div22 { grid-area: 6 / 5 / 8 / 6; }
    .div23 { grid-area: 8 / 3 / 11 / 4; }
    .div24 { grid-area: 11 / 3 / 14 / 4; }
    .div25 { grid-area: 11 / 4 / 14 / 5; }
    .div26 { grid-area: 8 / 4 / 11 / 5; }
    .div27 { grid-area: 14 / 2 / 16 / 3; }
    .div28 { grid-area: 16 / 2 / 18 / 3; }
    .div29 { grid-area: 8 / 5 / 11 / 6; }
    .div30 { grid-area: 11 / 5 / 14 / 6; }
    .div31 { grid-area: 18 / 2 / 20 / 3; }
    .div32 { grid-area: 16 / 3 / 18 / 4; }
    .div33 { grid-area: 14 / 3 / 16 / 4; }
    .div34 { grid-area: 18 / 3 / 20 / 4; }
    .div35 { grid-area: 14 / 4 / 16 / 5; }
    .div36 { grid-area: 16 / 4 / 18 / 5; }
    .div37 { grid-area: 18 / 4 / 20 / 5; }
    .div38 { grid-area: 14 / 5 / 16 / 6; }
    .div39 { grid-area: 16 / 5 / 18 / 6; }
    .div40 { grid-area: 18 / 5 / 20 / 6; }

.parent>* {
    display: flex;
    align-items: center;
    justify-content: center;
    border: black solid 1px ;
}

.parents {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    }

    .alt1 { grid-area: 1 / 1 / 2 / 2; }
    .alt2 { grid-area: 1 / 2 / 2 / 3; }
    .alt3 { grid-area: 1 / 3 / 2 / 6; }

.parents>* {
    color: #000000;
    display: flex;
    align-items: center;
    justify-content: center;
}

#black_color {
    color: #000000;
    font-weight: bold;
} 
