body {
}

.tree {
    font-family: sans-serif;
    font-size: 12px;
}

    .tree ul {
        position: relative;
        padding: 1em 0;
        white-space: nowrap;
        margin: 0 auto;
        text-align: center;
    }

    .tree li {
        display: inline-block;
        // need white-space fix vertical-align: top;
        text-align: center;
        list-style-type: none;
        position: relative;
        padding: 1em .5em 0 .5em;
    }

    .tree ul ul::before {
        content: '';
        position: absolute;
        top: 0;
        left: 50%;
        border-left: 1px solid #ccc;
        width: 0;
        height: 1em;
    }

    .tree li a {
        border: 1px solid #ccc;
        padding: .5em .75em;
        text-decoration: none;
        display: inline-block;
        border-radius: 5px;
        color: #333;
        position: relative;
        top: 1px;
    }

        .tree li a:hover {
            background: #e9453f;
            color: #fff;
            border: 1px solid #e9453f;
        }

            .tree li a:hover + ul li::after,
            .tree li a:hover + ul li::before,
            .tree li a:hover + ul::before,
            .tree li a:hover + ul ul::before {
                border-color: #e9453f;
            }

#kitInTree {
    border: double;
    font-size:14px;
    font-weight:bold;
}