.filter-top-wrap {
    /*margin-top: -5px;*/
}

.filter-top-item {
    display: inline-block;
    max-width: 230px;
    min-width: 230px;
    float: left;
    margin-right: 10px;
    margin-top: 10px;
}

    .filter-top-item .ms-options-wrap,
    .filter-top-item .ddt-options-wrap,
    .filter-top-item .ddf-options-wrap {
        position: relative;
    }

        .filter-top-item .ms-options-wrap:hover > button,
        .filter-top-item .ms-options-wrap:active > button,
        .filter-top-item .ms-options-wrap.open > button,
        .filter-top-item .ms-options-wrap:focus > button,
        .filter-top-item .ddt-options-wrap:hover > button,
        .filter-top-item .ddt-options-wrap:active > button,
        .filter-top-item .ddt-options-wrap.open > button,
        .filter-top-item .ddt-options-wrap:focus > button,
        .filter-top-item .ddf-options-wrap:hover > button,
        .filter-top-item .ddf-options-wrap:active > button,
        .filter-top-item .ddf-options-wrap.open > button,
        .filter-top-item .ddf-options-wrap:focus > button {
            border-color: #40a9ff;
        }

        .filter-top-item .ms-options-wrap > .ms-options,
        .filter-top-item .ddt-options-wrap > .ddt-options,
        .filter-top-item .ddf-options-wrap > .ddf-options {
            width: 230px;
            min-width: 100%;
            -webkit-box-shadow: 0 2px 8px rgba(0,0,0,.15);
            box-shadow: 0 2px 8px rgba(0,0,0,.15);
            border: none;
            border-radius: 4px;
        }

            .filter-top-item .ms-options-wrap > .ms-options > ul input[type="checkbox"] {
                left: 11px;
                top: 8px;
            }

            .filter-top-item .ms-options-wrap > .ms-options > ul label {
                border: none;
                padding: 3px 11px 3px 31px;
                cursor: pointer;
                margin: 0;
                min-height: 30px;
            }

        .filter-top-item .ms-options-wrap .ms-selectall.global {
            display: none;
        }

    .filter-top-item .ms-options ul {
        max-height: 240px;
        overflow-y: auto;
        column-count: unset !important;
        padding-top: 8px;
        padding-bottom: 8px;
        cursor: pointer;
    }

        .filter-top-item .ms-options ul li {
            display: block;
            clear: both;
            cursor: pointer;
        }

    .filter-top-item .ms-btn-apply-wrap,
    .filter-top-item .ddt-btn-apply-wrap {
        padding: 10px;
        text-align: right;
        border-top: 1px solid #E8E8E8;
        display: none;
    }

    .filter-top-item .ddf-btn-apply-wrap {
        padding: 10px;
        text-align: right;
        border-top: 1px solid #E8E8E8;
    }

    .filter-top-item .ms-options-wrap.ms-active .ms-btn-apply-wrap,
    .filter-top-item .ddt-options-wrap.ddt-active .ddt-btn-apply-wrap {
        display: block;
    }

    .filter-top-item .ms-options-wrap > button,
    .filter-top-item .ddt-options-wrap > button,
    .filter-top-item .ddf-options-wrap > button {
        border: solid 1px #d9d9d9;
        border-radius: 4px;
        margin-top: 0;
        height: 32px;
        box-sizing: border-box;
        padding-left: 11px;
        padding-top: 6px;
        cursor: pointer;
    }

        .filter-top-item .ms-options-wrap > button:focus,
        .filter-top-item .ms-options-wrap > button,
        .filter-top-item .ddt-options-wrap > button:focus,
        .filter-top-item .ddt-options-wrap > button,
        .filter-top-item .ddf-options-wrap > button:focus,
        .filter-top-item .ddf-options-wrap > button {
            padding-top: 6px;
            outline: none;
            outline-offset: 0;
            height: 32px;
            margin-top: 0;
            padding-left: 11px;
        }

            .filter-top-item .ms-options-wrap > button:focus,
            .filter-top-item .ddt-options-wrap > button:focus,
            .filter-top-item .ddf-options-wrap > button:focus {
                -webkit-box-shadow: 0 0 0 2px rgba(24,144,255,.2);
                box-shadow: 0 0 0 2px rgba(24,144,255,.2);
                border-color: #40a9ff;
            }

            .filter-top-item .ms-options-wrap > button span,
            .filter-top-item .ddf-options-wrap > button span {
                color: rgba(0,0,0,.65);
            }

            .filter-top-item .ms-options-wrap > button:after,
            .filter-top-item .ddt-options-wrap > button:after,
            .filter-top-item .ddf-options-wrap > button:after {
                border: none;
            }

            .filter-top-item .ms-options-wrap > button:after,
            .filter-top-item .ddt-options-wrap > button:after,
            .filter-top-item .ddf-options-wrap > button:after {
                border-bottom: 1px solid rgba(0, 0, 0, 0.5);
                border-right: 1px solid rgba(0, 0, 0, 0.5);
                content: '';
                display: block;
                height: 6px;
                margin-top: -4px;
                pointer-events: none;
                position: absolute;
                right: 11px;
                top: 50%;
                -webkit-transform-origin: 66% 66%;
                -ms-transform-origin: 66% 66%;
                transform-origin: 66% 66%;
                -webkit-transform: rotate(45deg);
                -ms-transform: rotate(45deg);
                transform: rotate(45deg);
                -webkit-transition: all 0.15s ease-in-out;
                transition: all 0.15s ease-in-out;
                width: 6px;
            }

    .filter-top-item .ms-options-wrap.ms-active > button:after,
    .filter-top-item .ddf-options-wrap.ddf-active > button:after {
        -webkit-transform: rotate(-135deg);
        -ms-transform: rotate(-135deg);
        transform: rotate(-135deg);
    }

    .filter-top-item .ms-options-wrap.ms-has-selections > button,
    .filter-top-item .ddf-options-wrap.ddf-has-selections > button {
        color: #555;
        font-weight: bold;
        border: 2px solid #555;
    }

        .filter-top-item .ms-options-wrap.ms-has-selections > button span,
        .filter-top-item .ddf-options-wrap.ddf-has-selections > button span {
            color: #555;
            font-weight: bold;
        }

    /*.filter-top-item .ms-options-wrap.ms-has-selections > button:after,
        .filter-top-item .ddf-options-wrap.ddf-has-selections > button:after {
            border-color: #ffffff;
        }*/

    .filter-top-item .ms-options-wrap.ms-has-selections .btn-reset,
    .filter-top-item .ddf-options-wrap.ddf-has-selections .btn-reset {
        color: #555;
        font-weight: bold;
    }

    .filter-top-item .ms-options-wrap > .ms-options > ul li.selected label {
        background-color: #ffffff;
    }

        .filter-top-item .ms-options-wrap > .ms-options > ul li.selected label:hover,
        .filter-top-item .ms-options-wrap > .ms-options > ul li.selected label.focused,
        .filter-top-item .ms-options-wrap > .ms-options > ul label.focused,
        .filter-top-item .ms-options-wrap > .ms-options > ul label:hover {
            background-color: #E6F7FE;
            border-color: transparent;
        }

    .filter-top-item .btn-reset {
        position: absolute;
        right: 2px;
        top: 2px;
        width: 26px;
        height: 26px;
        background: #ffffff;
        z-index: 1000;
        display: none;
        cursor: pointer;
        color: rgba(0, 0, 0, 0.5);
        text-align: center;
        padding-top: 2px;
    }
