html,
body{
    margin:0;
    padding:0;
}

.orgchart-page{
    width:100%;
    height:80vh;
    overflow:hidden;
    background:#f4f5f7;
}

#tree{
          width:100%;
          height:100%;
        }

        .node.orange rect {
          fill: #E8A87C;
        }
        .node.yellow rect {
          fill: #F4D58D;
        }
        .node.red rect {
          fill: #FA9D94;
        }
        .node.green rect {
          fill: #BEDBBF;
        }
        .node.blue rect {
          fill: #b6dde8;
        }
        .node.pink rect {
          fill: #F1C4CC;
        }
        .node.brown rect {
          fill: #E4CBAC;
        }
        .node.lightblue rect {
          fill: #e5dfec;
        }
        .node.darkblue rect {
          fill: #b2a1c7;
        }



        [data-n-id='4'] rect {
            fill: #FA9D94;
        }
        [data-n-id='5'] rect {
            fill: #FA9D94;
        }
        [data-n-id='6'] rect {
            fill: #F4D58D;
        }
        [data-l-id='[1][2]'] path {
            stroke: none;
        }
        [data-l-id='[2][3]'] path {
            stroke: none;
        }

/* SVG */

#tree svg{
    overflow:visible !important;
}

/* Mobile */

@media(max-width:768px){

    .orgchart-page{
        height:1200px;
    }

}