.perent {
    background-color: rgb(236, 233, 232);
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    padding: 20px;
    text-align: center;
}

.child {
    background-color: yellow;
    padding: 22px;
    margin: 7px;
}

.child.sheikh {
    grid-column: 1/13;
}

.child.qasmi {
    grid-column: 1/7;
}

.child.jatoi {
    grid-column: 7/13;
}

.child.bihari {
    grid-column: 1/5;
}

.child.brohi {
    grid-column: 5/9;
}

.child.qureshi {
    grid-column: 9/13;
}

.child.bangali {
    grid-column: 1/4;
}

.child.rana {
    grid-column: 4/7;
}

.child.gujar {
    grid-column: 7/10;
}

.child.khan {
    grid-column: 10/13;
}

.child.mirzai {
    grid-column: 1/3
}

.child.gujrati {
    grid-column: 3/5;
}

.child.memon {
    grid-column: 5/7;
}

.child.pathan {
    grid-column: 7/9;

}

.child.arain {
    grid-column: 9/11;
}

.child.malik {
    grid-column: 11/13;
}

.child.ansari {
    grid-column: 1/2;
}

.child.bhatti {
    grid-column: 2/3;

}

.child.awan {
    grid-column: 3/4;
}

.child.bukhari {
    grid-column: 4/5;
}

.child.syed {
    grid-column: 5/6;
}

.child.somroo {
    grid-column: 6/7;
}

.child.shah {
    grid-column: 7/8;
}

.child.hashmi {
    grid-column: 8/9;
}

.child.rajput {
    grid-column: 9/10;
}

.child.khokhar {
    grid-column: 10/11;
}

.child.mugal {
    grid-column: 11/12;
}

.child.jut {
    grid-column: 12/13;
}









.perent1 {
    background-color: rgb(236, 233, 232);
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    padding: 20px;
    text-align: center;
}

.child1 {
    background-color: rgb(24, 206, 8);
    padding: 20px;
    margin: 7px;
}

.child1.sheikh {
    grid-row: 1/13;
}

.child1.qasmi {
    grid-row: 1/7;
}

.child1.jatoi {
    grid-row: 7/13;
}

.child1.bihari {
    grid-row: 1/5;
}

.child1.brohi {
    grid-row: 5/9;
}

.child1.qureshi {
    grid-row: 9/13;
}

.child1.bangali {
    grid-row: 1/4;
}

.child1.rana {
    grid-row: 4/7;
}

.child1.gujar {
    grid-row: 7/10;
}

.child1.khan {
    grid-row: 10/13;
}

.child1.mirzai {
    grid-row: 1/3;
}

.child1.gujrati {
    grid-row: 3/5;
}

.child1.memon {
    grid-row: 5/7;
}

.child1.pathan {
    grid-row: 7/9;

}

.child1.arain {
    grid-row: 9/11;
}

.child1.malik {
    grid-row: 11/13;
}

.child1.ansari {
    grid-row: 1/2;
}

.child1.bhatti {
    grid-row: 2/3;

}

.child1.awan {
    grid-row: 3/4;
}

.child1.bukhari {
    grid-row: 4/5;
}

.child1.syed {
    grid-row: 5/6;
}

.child1.somroo {
    grid-row: 6/7;
}

.child1.shah {
    grid-row: 7/8;
}

.child1.hashmi {
    grid-row: 8/9;
}

.child1.rajput {
    grid-row: 9/10;
}

.child1.khokhar {
    grid-row: 10/11;
}

.child1.mugal {
    grid-row: 11/12;
}

.child1.jut {
    grid-row: 12/13;
}