.card-body>.table{
text-wrap:nowrap;
}



label.error {
    color: #dc3545;
    font-size: 14px;
}

.image-30 {
    height: 30px !important;
}

.image-35 {
    height: 35px !important;
}

.image-50 {
    height: 50px !important;
}

.image-60 {
    height: 60px !important;
}

.image-90 {
    height: 90px !important;
}

.error {
    color: red;
}

.manual-error {
    display: none;
}

#overlay {
    position: fixed;
    top: 0;
    z-index: 100;
    width: 100%;
    height: 100%;
    display: none;
    background: rgba(0, 0, 0, 0.6);
}

.cv-spinner {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.spinner {
    width: 40px;
    height: 40px;
    border: 4px #ddd solid;
    border-top: 4px #2e93e6 solid;
    border-radius: 50%;
    animation: sp-anime 0.8s infinite linear;
}

@keyframes sp-anime {
    100% {
        transform: rotate(360deg);
    }
}

.is-hide {
    display: none;
}

.select2-container .select2-selection--single {
    height: 37px !important;
}






/*Generology Tree*/

.MemberCard{
        width: 250px;
   position:relative;
    background: white;
   flex-shrink:0;
    border-radius:8px;
   
}

.memberCardContent{
      padding: 15px;
       display: flex;
       flex-direction: column;
    align-items: center;
}

.MemberCard .treeImg .profileImage{
    width:60px;
    height:60px;
    object-fit:cover;
    border-radius:100%;
}

.firstSection {
    display:flex;
    justify-content:center;
}
.secondSection{
        display: Flex;
    gap: 20px;
    position:relative;
}

.newContent{
        overflow: scroll;
}

.mainCard::after{
   content: '';
    display: block;
    width: 23px;
    height: 1.2px;
    background-color: #cccccc;
    transform: rotate(90deg);
    position: absolute;
    left: 43%;
    bottom: -12px;
    
}

.secondSection::before{
        content: '';
    display: block;
    width: 100%;
    height: 1.2px;
    background-color: #cccccc;
    position: absolute;
    top: -24px;
    left: 120px;
}

.secondSection .MemberCard::before{
    content: '';
    display: block;
    width: 1px;
    height: 24px;
    background-color: #cccccc;
    position: absolute;
    top: -24px;
    left: 45%;
}

.makecursor{
    cursor:pointer;
}

.table-responsive{
    display:table;
}

.card{
    overflow:auto;
}


.myModal .modalImage{
    display: inline-block;
    width: 100%;
    padding: 16px;
    text-align: center;

}
.myModal .modalImage img{
    width:250px;
}

.firstSection .mainCard{
    position:relative;
   
}
.firstSection .tableHover{
    position: absolute;
    top: 20%;
    left: 100%;
    opacity: 0;
    visibility: hidden;
    background: #fff;
    transition:ease-in-out .5s;
    z-index:1000;
}

.firstSection .tableHover .table th,
.firstSection .tableHover .table td,
.secondSection .multipleCard .tableHoverNew .table th,
.secondSection .multipleCard .tableHoverNew .table td
{
    font-size:14px;
    padding: 7px 4px;
}


.firstSection .mainCard .tableHover{
    width:100%;
}
    
.firstSection .mainCard:hover .tableHover{
    opacity: 1;
    visibility: visible;
    border: 1px solid #c7c7c7;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    border-radius: 4px;
    
}
.firstSection .mainCard .tableHover .table,
.firstSection .mainCard:hover .tableHover .table{
    margin-bottom:0;
    text-align:center;
}
.secondSection .multipleCard{
 position:relative;
}

.secondSection .multipleCard .tableHoverNew{
    position: absolute;
    top: 20%;
    left: 100%;
    opacity: 0;
    visibility: hidden;
    background: #fff;
    transition: ease-in-out .5s;
    width: 100%;
    z-index: 1000;
}
.secondSection .multipleCard .tableHoverNew .table{
    margin-bottom:0;
    text-align:center;
}
.secondSection .multipleCard:hover .tableHoverNew{
    opacity: 1;
    visibility: visible; 
    border: 1px solid #c7c7c7;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    border-radius: 4px;
}

.newContentWrapper .user-form .toggle-icon{
    position: absolute;
    top: 6px;
    right: 12px;
    z-index: 10000;
}

.register-page{
    background:linear-gradient(45deg, #000000, #626262);
}
.grapSection .secondGraph .selectList{
        display: flex;
    justify-content: flex-end;
    margin-bottom: 0;
}
.grapSection .secondGraph select{
    padding: 3px 4px;
    width: 20%;
}