.cat-container-master-detail {
    height: 100%;
}

.cat-container-master:not(.cat-vertical) {
    /*display: inline-block;*/
    height: calc(50% - 9px);
    width: 100%;
}

.cat-container-master.cat-no-details {
    height: 100%;
}

.cat-container-detail:not(.cat-vertical) {
    height: calc(50% - 15px);
    width: 100%;
}

.cat-container-master-detail.cat-vertical > div:not(.cat-content-has-toolbar) {
    padding-top: 9px;
}

.cat-container-master.cat-vertical {
    display: inline-block;
    height: calc(100%);
    padding: 0px;
    padding-right: 5px;
    /*width: 100%;*/
}

.cat-container-detail.cat-vertical {
    height: calc(100% );
    padding: 0px;
}

    .cat-container-detail.cat-vertical .cat-dataform {
        padding-bottom: 0px;
    }

.cat-container-splitter {
    height: 3px;
}

    .cat-container-splitter .splitterHandle {
        background-color: orange;
        cursor: ns-resize;
    }

#keyShowHideTree:hover > a > i {
    color: orange;
}

.cat-container-splitter.cat-vertical {
    display: none !important;
}

.cat-vertical .cat-lower-content.cat-content-has-toolbar {
    height: calc(100% - 60px);
}

#cat-main-splitter, .cat-vertical-splitter {
    background: #c7d0d5 !important;
    /*width: 0.1%;*/
    width: 3px;
    height: 100%;
    float: left;
    display: flex;
    align-items: center;
    position: relative;
    cursor: ew-resize;
}

    .cat-vertical-splitter .splitterHandle {
        background-color: orange;
    }

.cat-horizontal-splitter {
    background: #c7d0d5 !important;
    background-color: white !important;
    width: 100%;
    height: 3px;
    position: relative;
}

    .cat-horizontal-splitter .splitterHandle {
        background-color: orange;
        cursor: ns-resize;
        margin: 0 auto;
    }

/*New Splitter begins here vvv*/

.cat-vertical-splitter {
    display: flex;
    align-items: center;
    position: relative;
    background: #c7d0d5;
    width: 4px;
    height: 100%;
    float: left;
    cursor: ew-resize;
    z-index: 100;
}

.cat-horizontal-splitter {
    display: flex;
    align-items: center;
    position: relative;
    background: #c7d0d5;
    height: 4px;
    width: 100%;
    cursor: ns-resize;
    z-index: 100;
}

    .cat-vertical-splitter .handle, .cat-horizontal-splitter .handle {
        margin: auto;
        display: flex;
        align-items: center;
        position: relative;
        background: orange;
    }

        .cat-vertical-splitter .handle:hover, .cat-horizontal-splitter .handle:hover {
            outline: 1px solid #c7d0d5;
        }