.kl-auc-filters-category-modal .modal-dialog {
    margin: 30px auto;
}
.kl-auc-filters-category-modal .modal-header {
    border: none;
    height: 0;
    min-height: 0;
}
.kl-auc-filters-category-modal .modal-body {
    padding: 6px 0;
}
.kl-auc-filters-category-modal .modal-header .close {
    position: absolute;
    top: 4px;
    right: 4px;
    padding: 12px 12px 12px 24px;
    z-index: 2;
}

.kl-auc-categories,
.kl-auc-categories-header{
    position: static;
    float: none;
    box-shadow: none;
    display: block;
    top: auto;
    bottom: auto;
    left: auto;
    right: auto;
    width: 100%;
    font-size: 15px;
}

.kl-auc-categories-container {
    overflow: hidden;
}
.kl-auc-categories-container .kl-auc-categories {
    transition: transform .16s cubic-bezier(.42,0,.58,1), opacity .16s cubic-bezier(.42,0,.58,1);
    will-change: transform;
    opacity: .3;
    transform: translate3D(16px, 0, 0);
}

.kl-auc-categories-container.is-back .kl-auc-categories {
    transform: translate3D(-16px, 0, 0);
}

.kl-auc-categories-container.is-open .kl-auc-categories{
    opacity: 1;
    transform: translate3D(0, 0, 0);
}

.kl-auc-categories-header > li > a,
.kl-auc-categories > li > a {
    padding: 9px 30px 9px 20px;
    position: relative;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kl-auc-categories-header {
    border-bottom: 1px solid #D6D6D6;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.kl-auc-categories-header > li > a {
    padding-left: 43px;
    padding-right: 36px;
}
.kl-auc-categories-header > li > a:hover,
.kl-auc-categories-header > li > a:focus,
.kl-auc-categories-header > li > a:active {
    background-color: #fff;
}

.kl-auc-categories-ico {
    color: #C5C5C5;
    vertical-align: top;
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px;
}

.kl-auc-categories > li > a:hover .kl-auc-categories-ico,
.kl-auc-categories  > li > a:focus .kl-auc-categories-ico,
.kl-auc-categories  > li > a:active .kl-auc-categories-ico,
.active > .kl-auc-categories-link .kl-auc-categories-ico {
    color: inherit;
}
li:not(.active) > .kl-auc-categories-link-all {
    color: #319932;
}
.kl-auc-categories-dummy {
    width: 100%;
    display: block;
    padding-right: 24px;
}
.kl-auc-categories-text {
    display: block;
    width: 100%;
    overflow: hidden;
    text-overflow:ellipsis;
}
.kl-auc-categories-dummy.selected .kl-auc-categories-text > span {
    font-weight: bold;
}
.kl-auc-categories-dummy:active,
.kl-auc-categories-dummy:hover,
.kl-auc-categories-dummy:focus {
    -webkit-tap-highlight-color: transparent !important;
}

.kl-auc-categories-ico-back {
    left: 20px;
    right: 0;
    color: inherit;
    font-size: inherit;
}
@media(max-width: 767px) {
    .kl-auc-categories {
        /**
        30px*2 - bottom/top modal margins
        6px*2 - bottom/top modal body padding
        40px - modal header
        56px - android phone bottom virtual navbar
        10px - extra for safety :)
         */
        max-height: calc(100vh - 178px);
        overflow-y: auto;
    }
    .kl-auc-categories > li > a {
        margin-top: 4px;
        margin-bottom: 4px;
    }

    /*
        last item opacity gradient
     */
    .kl-auc-categories-container::after {
        content: '';
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 35px;
        background: linear-gradient(
                rgba(255, 255, 255, 0.011),
                white
        ); /* transparent keyword is broken in Safari */
        pointer-events: none;
        z-index: 1000;
    }

    .kl-auc-categories li:last-child {
        margin-bottom: 30px;
    }
}

.kl-auc-filters-brand {
    margin: 5px 0;
}
.kl-auc-filters-brand-list {
    max-height: 280px;
    overflow-y: auto;
    width: 100%;
}
.kl-auc-filters-brand-control:checked ~ .kl-auc-filters-brand-name {
    font-weight: bold;
}
@media (max-width: 767px) {
    .kl-auc-filters-brand {
        margin: 7px 0;
    }
}

/* new iphone modal scrolling main content issue fixes */
/* iPhone XR
 1792x828px at 326ppi */
@media only screen
and (device-width : 414px)
and (device-height : 896px)
and (-webkit-device-pixel-ratio : 2) {
    .kl-auc-categories {
        max-height: calc(100vh - 208px);
    }
}

/* iPhone XS 2436x1125px at 458ppi */
@media only screen
and (device-width : 375px)
and (device-height : 812px)
and (-webkit-device-pixel-ratio : 3) {
    .kl-auc-categories {
        max-height: calc(100vh - 208px);
    }
}

/* Iphone XS Max 2688x1242px at 458ppi */
@media only screen
and (device-width : 414px)
and (device-height : 896px)
and (-webkit-device-pixel-ratio : 3) {
    .kl-auc-categories {
        max-height: calc(100vh - 208px);
    }
}