.pyramid {
    padding-left: 1000px;
    padding-right: 1000px;
    width: 10000px;
    height: 500px;
    /* height: 120px; */
    /*  border-bottom: 1px solid #ccc;*/
}
.clickDiv{
height:97px;
width:143px;
position:absolute;
background-color:yellow;
}

.userCard {
    cursor: pointer;
    width: 81px;
    height: 94px;
    border: 1px solid #ccc;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: 3px;
}

    .userCard:hover {
        background-color: #68e5da;
    }

.pyramidSol {
    width: 49%;
    float: left;
    display: flex;
    border-right: 1px solid #ccc;
}

.pyramidSag {
    width: 49%;
    float: right;
    display: flex;
}
.childsDiv {
    /* position: absolute; */
    top: 100px;
    height: 120px;
    margin-left: -207px;
    width: 500px;
    margin-top: 17px;
     border-top: 2px dotted #ccc; 
}
.childsDivLeft {
    width: 49%;
    float:left;
   /* border-right: 1px solid #ccc;*/
}
.childsDivRight {
    width: 49%;
    float: Right;
   
}
.userName {
    text-align: center;
    display: block;
    overflow: hidden;
    /* display: inline-block; */
    white-space: nowrap;
}
.arrowlineFirst {
    height: 10px;
    border-left: 2px dotted #ccc;
    margin-left: auto;
    width: 20px;
    margin-right: auto;
    margin-top: -11px;
}
.arrowlineLeft {
    float: right;
    height: 10px;
    border-right: 2px dotted #ccc;
    /* margin-left: auto; */
    width: 20px;
    /* margin-right: auto; */
    margin-top: -11px;
}
.arrowlineRight {
    float: left;
    height: 10px;
    border-left: 2px dotted #ccc;
    /* margin-left: auto; */
    width: 20px;
    /* margin-right: auto; */
    margin-top: -11px;
}
#rowclearfix {
    overflow: scroll;
    display: inline-block;
    flex-wrap: unset
}