#tps-org-chart {
    background: #fff;
    width: 100%;
    margin: auto;
}

figure ul,
figure ul li,
figure ul li a {
    position: relative;
    width: 99%;
}

figure ul {
    padding: 0;
    margin: auto;
    list-style: none;
}

    figure ul .srmgmt {
        width: 100%;
        padding: 0;
        margin: auto;
        list-style: none;
        display: flex;
        justify-content: center;
    }

    figure ul li {
        padding: 10px 0;
    }

        figure ul li a {
            display: block;
            border: 4px solid;
            text-align: center;
            color: #fff;
            font-weight: bold;
            font-size: .8em;
            height: 80px;
            overflow: hidden;
        }

         /*   figure ul li a:hover {
                color: #fff;
                text-decoration: none;
            }*/

            figure ul li a > span {
                display: block;
                min-height: 100%;
                padding-top: 20px;
                overflow: hidden;
                transition: all ease .4s;
                text-shadow: rgba(0,0,0,0.5) 1px 1px 1px;
                background-color: #153181;
                color:white;
            }

  /*  figure ul > li a:hover > span {
        background: #222;
    }*/

figure small {
    display: block;
    font-weight: normal;
}




/* Level 1 
-------------------------------------------------*/
figure > ul > li > div > a {
    width: 50%;
    margin: 0 auto 15px auto;
}

figure > ul > li > div:after {
    content: "";
    width: calc(50%);
    height: 25px;
    margin: 0 auto;
    position: absolute;
    border-left: 4px solid;
    top: 90px;
    left: calc(50%);
    display: block;
    z-index: 0;
}

/* Level 2 
-------------------------------------------------*/
figure > ul > li > ul:after { /* horizontal line connecting boxes under head honcho (and vertical lines on the far left and right) */
    content: "";
    width: calc(100% - 10px - 900px + 9px);
    height: 20px;
    margin: 0 auto;
    position: absolute;
    border: 4px solid;
    border-bottom: none;
    top: 10px;
    display: block;
    z-index: 0;
}

figure > ul > li > ul > li {
    z-index: 1;
}

    figure > ul > li > ul > li:first-of-type:before,
    figure > ul > li > ul > li:last-of-type:before { /* hiding vertical lines on the far left and right */
        border-left: transparent;
    }

    figure > ul > li > ul > li:before { /* vertical lines connecting boxes to horizontal line under head honcho */
        content: "";
        border-left: 4px solid;
        position: relative;
        display: block;
        min-height: 20px;
        margin-left: calc(50% - 2px);
    }

    /* Level 3 
-------------------------------------------------*/
    figure > ul > li > ul > li > ul { /* vertical line connecting boxes under a director (level 2) */
        border-left: 4px solid;
    }

        figure > ul > li > ul > li > ul > li { /* horizontal line connect level 3 boxes to vertical line under director (level 2) */
            border-top: 4px solid;
            top: 50px;
        }

figure ul > li > ul > li > ul > li > a { /* level 3 boxes and below... */
    right: -30px;
    top: -50px;
    width: calc(100% - 30px);
}

/* Level 4 
-------------------------------------------------*/
figure > ul > li ul > li > ul > li > ul { /* vertical line connecting boxes under a level 3 box */
    border-left: 4px solid;
    right: -30px;
    top: -50px;
    width: calc(100% - 30px);
    padding-top: 10px;
}

figure ul > li > ul > li > ul > li.tps-org-branch-end { /* hiding the bottom section of the vertical line above */
    border-left: 4px solid #fff;
   /* right: 4px;*/
    width: calc(100% + 4px);
}

figure ul > li > ul > li > ul > li > ul > li { /* horizontal line connect level 4 boxes to vertical line under level 3 box */
    border-top: 4px solid;
    top: 50px;
}





@media all and (max-width: 1200px) {
    figure > ul > li > div > a {
        width: 100%;
    }

    figure > ul > li > ul { /* vertical line under head honcho (level 1) */
        border-left: 4px solid;
    }

        figure > ul > li > ul > li { /* horizontal line connecting level 2 boxes to vertical line under head honcho (level 1) */
            border-top: 4px solid;
            top: 50px;
        }

            figure > ul > li > div:after,
            figure > ul > li > ul:after,
            figure > ul > li > ul > li:first-of-type:before,
            figure > ul > li > ul > li:last-of-type:before,
            figure > ul > li > ul > li:before {
                display: none;
            }

            figure > ul > li > ul > li.col-lg-2 {
                padding-right: 0px;
                padding-left: 30px;
            }

            figure > ul > li > ul > li > a,
            figure > ul > li > ul > li > ul {
                top: -50px;
            }

    figure ul > li > ul > li.tps-org-branch-end:last-of-type { /* hiding the bottom section of the vertical line above */
        border-left: 4px solid #fff;
        right: 4px;
        width: calc(100% + 4px);
    }
}



/* Line color 
-------------------------------------------------*/
figure ul li a,
figure > ul > li > ul,
figure > ul > li > ul:after,
figure > ul > li > div:after,
figure > ul > li > ul > li,
figure > ul > li > ul > li:before,
figure > ul > li > ul > li > ul,
figure > ul > li > ul > li > ul > li,
figure > ul > li ul > li > ul > li > ul,
figure ul > li > ul > li > ul > li > ul > li {
    border-color: #bbb;
}

/* Background color 
-------------------------------------------------*/
#tps-org-chart,
figure ul > li > ul > li > ul > li.tps-org-branch-end {
    background: #fff;
}
/* Box colors by column 
-------------------------------------------------*/
figure ul li a {
    background: #231f20;
}
/* level 1 and default box color */
figure > ul > li > ul > li:nth-of-type(1) a {
    background: #00aeef;
}

    /*figure > ul > li > ul > li:nth-of-type(1) a:hover {
        color: #00a6de;
    }

figure > ul > li > ul > li:nth-of-type(2) a {
    background: #8aaa04;
}

    figure > ul > li > ul > li:nth-of-type(2) a:hover {
        color: #a6cc09;
    }

figure > ul > li > ul > li:nth-of-type(3) a {
    background: #5f6566;
}

    figure > ul > li > ul > li:nth-of-type(3) a:hover {
        color: #cccccb;
    }

figure > ul > li > ul > li:nth-of-type(4) a {
    background: #1a6180;
}

    figure > ul > li > ul > li:nth-of-type(4) a:hover {
        color: #1a6180;
    }*/
/* 3 steps lighter */
/*figure > ul > li > ul > li:nth-of-type(5) a {
    background: #de5433;
}

    figure > ul > li > ul > li:nth-of-type(5) a:hover {
        color: #ef6544;
    }*/
/* 1 step lighter */
/*figure > ul > li > ul > li:nth-of-type(6) a{  background:#00b0ab; }
figure > ul > li > ul > li:nth-of-type(6) a:hover{ color:#00b0ab; }*/

/* Darken each level 
-------------------------------------------------*/
figure > ul > li > ul > li > a > span {
    background: #4472c4;
}

figure > ul > li > ul > li > ul > li > a > span {
    background: #c6224f;
}

figure > ul > li > ul > li > ul > li > ul > li > a > span {
    background: rgba(0,0,0,0.4);
}

figure > ul > li > ul > li > ul > li > ul > li > ul > li > a > span {
    background: rgba(0,0,0,0.6);
}