.inner-tree{
    padding-bottom: 40px;
}

/* Scrollbar size */
.tree::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

/* Track */
.tree::-webkit-scrollbar-track {
    background: #f0f0f0;   /* light grey */
}

/* Thumb */
.tree::-webkit-scrollbar-thumb {
    background: #E6E6E6;   /* standard grey */
    border-radius: 4px;
     cursor: pointer; 
}

/* Thumb hover */
.tree::-webkit-scrollbar-thumb:hover {
    background: #9e9e9e;
}
.box {
        font-weight: 700;
}
.arow-bx{
        width: max-content;
    height: auto;
      border-radius: 12px !important;
          padding: 10px !important;
}

.transparent{
    background: none !important;
    border: 4px solid #8E2956;
}
.secretary{
       background: none !important;
    border: 4px solid #CF3570;
}
.secretary-pink{
      background: none !important;
    border: 4px solid #CF3570;
}
.corporate-green{
      background: none !important;
    border: 4px solid #6B9E4B;
}
.chairperson{
       background: none !important;
    border: 4px solid #A62F71;   
}
.md{
         background: none !important;
    border: 4px solid #7F3987;
        width: max-content;
}
.corporate-blue{
     background: none !important;
    border: 4px solid #2777A6; 
        width: max-content;
            border-radius: 12px !important;
}
.regional-green {
        background: none !important;
    border: 4px solid #669D4B; 
}
.reg-top{
        margin-top: 130px;
}
.reg-top::after{
        content: '';
    position: absolute;
    top: -137px !important;
    background: #669D4B;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 131px !important;
    
    left: 50%;
}
.district_office{
        background: none !important;
    border: 4px solid #669D4B; 
}
.regional-orange{
           background: none !important;
    border: 4px solid #E6732D; 
       position: relative;
}
.purple_linestraight::after{
    content: '';
    position: absolute;
    top: -0;
    background: #7F3987;
    height: 50px;
    width: 3px;
    margin: auto;
    left: 50%;
}
.corporate_line::after{
    content: '';
    position: absolute;
    top: -0;
    background: #2777A6;
    height: 50px;
    width: 3px;
    margin: auto;
    left: 50%;
}
.purple_linearrow::after{
        background: #7F3987;
            height: 3px !important;
    border-top: 0 !important;
}
.regional_office::before{
        background: #7F3987;
            height: 3px !important;
    border-top: 0 !important;
}
.corporate_sub::after{
      background: #2777A6;
            height: 3px !important;
    border-top: 0 !important;
}
.corporate_subleft::before{
       background: #2777A6;
            height: 3px !important;
    border-top: 0 !important;
}
.corporate_sublefts::after{
      background: #2777A6;
            height: 3px !important;
    border-top: 0 !important 
}
.arrow-box-grey{
        border-radius: 12px !important;
}
.regional_officegreen{
        padding-top: 250px !important;
            left: -104px;

}
.regional_officeorange{
      padding-top: 250px !important;
          left: -120px;
}
.regional_officepurple{
      padding-top: 250px !important;
          left: -142px;
}
.wwh{
    padding-top: 160px !important;
}
.reach_knr{
  padding-top: 50px !important;  
}
.arrow-box-grey::after{
    content: '';
    position: absolute;
    top: -53px;
    background: #555555;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 50px;
    left: 50%;
}
.arrow-box-grey::before{
    content: "";
    position: absolute;
    top: -8px;
    left: 50.3%;
    transform: translateX(-50%);
    width: 0;
    height: 17px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    z-index: 11;
    border-top: 8px solid #555555;
}
.corporate-blue::after{
    content: '';
    position: absolute;
    top: -53px;
    background: #2777A6;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 50px;
    left: 50%;
}
.corporate-blue::before{
    content: "";
    position: absolute;
    top: -8px;
    left: 50.5%;
    transform: translateX(-50%);
    width: 0;
    height: 17px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    z-index: 11;
    border-top: 8px solid #2777A6;
}
.secretary-pink::before{
    content: "";
    position: absolute;
    top: -8px;
    left: 50.5%;
    transform: translateX(-50%);
    width: 0;
    height: 17px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    z-index: 11;
    border-top: 8px solid #CD2E74;
}
.secretary-pink::after{
    content: '';
    position: absolute;
    top: -53px;
    background: #CD2E74;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 50px;
    left: 50%;
}
.corporate-green::before{
    content: "";
    position: absolute;
    top: -8px;
    left: 50.5%;
    transform: translateX(-50%);
    width: 0;
    height: 17px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    z-index: 11;
    border-top: 8px solid #6B9E4B;
}
.corporate-green::after{
    content: '';
    position: absolute;
    top: -53px;
    background: #6B9E4B;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 50px;
    left: 50%;
}
.regional-green::after{
     content: '';
    position: absolute;
    top: -252px;
    background: #669D4B;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 245px;
    left: 50%;
}
.regional-green::before{
    content: "";
    position: absolute;
    top: -8px;
    left: 50.5%;
    transform: translateX(-50%);
    width: 0;
    height: 17px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    z-index: 11;
    border-top: 8px solid #669D4B;
}
.district_line::after{
      background: #669D4B;
    height: 3px !important;
    border-top: 0 !important;
}

.district_top::after{
          background: #669D4B;
               width: 3px;
}
.tvpm_top{
       padding-top: 100px !important;
}
.tvpm_top::after{
     background: #E6732D;
        width: 3px;
        height: 101px;
}
.wwh::before{
    background: #669D4B;
    height: 3px !important;
    border-top: 0 !important;  
}
.tvpm_line::after{
    background: #E6732D;
    height: 3px !important;
    border-top: 0 !important;
}
.reach_knr::before{
      background: #E6732D;
    height: 3px !important;
    border-top: 0 !important;
}
.regional-orange::after{
     content: '';
    position: absolute;
      top: -252px;
    background: #E6732D;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
       height: 245px;
    left: 49%;
}
.regional-orange::before{
    content: "";
    position: absolute;
    top: -8px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 17px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    z-index: 11;
    border-top: 8px solid #E6732D;
}
.regional-purple::after{
        content: '';
    position: absolute;
    top: -254px;
    background: #7F3987;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 247px;
    left: 50%;

}
.regional-purple::before{
    content: "";
    position: absolute;
    top: -8px;
    left: 50.5%;
    transform: translateX(-50%);
    width: 0;
    height: 17px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    z-index: 11;
    border-top: 8px solid #7F3987;
}
.district_officesubtop{
       position: relative; 
}
.district_officesubtop::after{
        content: '';
    position: absolute;
    top: -21px;
    background: #669D4B;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 93px;
    left: -46px;
    transform: rotate(90deg);
}
.district_officesubtop::before{
   content: "";
    position: absolute;
    top: 16px;
    transform: rotate(266deg);
    left: -4px;
    /* transform: translateX(-50%); */
    width: 0;
    height: 17px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    z-index: 11;
    border-top: 8px solid #669D4B;
}
.district_office::after{
       content: '';
    position: absolute;
    top: -53px;
    background: #669D4B;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 45px;
    left: 50%;
}
.district_officesub::after{
             content: '';
    position: absolute;
    top: -164px;
    background: #669D4B;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 159px;
    left: 50%;
}
.district_office::before{
    content: "";
    position: absolute;
    top: -8px;
    left: 50.5%;
    transform: translateX(-50%);
    width: 0;
    height: 17px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    z-index: 11;
    border-top: 8px solid #669D4B;
}
.orange_sub::after{
      content: '';
    position: absolute;
    top: -52px;
    background: #E6732D;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 51px;
    left: 50%;
}
.orange_subdown::after{
        content: '';
    position: absolute;
    top: -54px;
    background: #E6732D;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 52px;
    left: 50%;
}
.purple::after {
     content: '';
    position: absolute;
    top: -54px;
    background: #7F3987;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 54px;
    left: 50%;
}
.purple::before{
        content: "";
    position: absolute;
    top: -8px;
    left: 50.5%;
    transform: translateX(-50%);
    width: 0;
    height: 17px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    z-index: 11;
    border-top: 8px solid #7F3987;
}
.district_office-top{
        position: relative;
}
.district_office-top::before{
       content: '';
    position: absolute;
    bottom: -90px;
    background: #669D4B;
    width: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 90px;
    left: 64%;

}