.maindiv {
    /* border: 2px solid black; */
    gap: 10px;
    width: 100%;
    height: 500px;

    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;


}

.div1 {
    /* border: 2px solid black; */
    background-color: yellow;
    text-align: center;
    font-size: 25px;
    font-weight: 900;
}

.box1 {
    grid-column: 1/13;
}

.box2 {
    grid-column: 1/7;

}

.box3 {
    grid-column: 7/13;
}

.box4 {
    grid-column: 1/5;

}

.box5 {
    grid-column: 5/9;

}

.box6 {
    grid-column: 9/13;
}

.box7 {
    grid-column: 1/4;
}

.box8 {
    grid-column: 4/7;
}

.box9 {
    grid-column: 7/10;
}

.box10 {
    grid-column: 10/13;

}

.box11 {
    grid-column: 1/3;
}

.box12 {
    grid-column: 3/5;
}

.box13 {
    grid-column: 5/7;
}

.box14 {
    grid-column: 7/9;
}

.box15 {
    grid-column: 9/11;
}

.box16 {
    grid-column: 11/13;
}