/*dropdown*/
.li-select.dropdown {
    cursor: pointer;
    display: inline-block;
    border: solid 1px #d8d8d8;
    padding: 0.375rem 0.75rem;
    border-radius: 4px;
}

    .li-select.dropdown::after {
        content: "\f0d7";
        display: inline-block;
        font-family: FontAwesome;
        margin-left: 10px;
    }

    .li-select.dropdown ul {
        padding: 0px;
        position: absolute;
        border: solid 1px #d8d8d8;
        z-index: 100;
        background-color: #fff;
        display: none;
        border-radius: 4px;
    }

    .li-select.dropdown.open ul {
        display: block;
        margin-left: -13px;
        margin-top: 8px;
        position: absolute;
        margin-right: -20px;
    }

    .li-select.dropdown.open.right ul {
        right: 0px;
        margin-right: -1px;
    }

    .li-select.dropdown li {
        display: block;
        padding: 0.375rem 0.75rem;
        white-space: nowrap;
    }

        .li-select.dropdown li:hover {
            background-color: #f7f7f7;
        }

.li-select.inline {
    display: inline-block;
}

    .li-select.inline > span {
        display: none;
    }

    .li-select.inline ul {
        padding: 0px;
        margin: 0px;
        display: flex;
        flex-wrap: wrap;
    }

    .li-select.inline li {
        display: inline-block;
        padding: 4px 10px;
        border: solid 1px #d8d8d8;
        border-radius: 4px;
        margin-right: 5px;
        margin-bottom: 5px;
        min-width: 40px;
        text-align: center;
        cursor: pointer;
    }

        .li-select.inline li.no-stock {
            color: #d8d8d8;
        }

        .li-select.inline li.active {
            background-color: #f7f7f7;
            position: relative;
        }

            .li-select.inline li.active::after {
                content: "\f058";
                font: normal normal normal 16px/1 FontAwesome;
                position: absolute;
                left: -3px;
                top: -5px;
                color: #868686;
            }

/*checkbox*/
.li-select.checkbox ul {
    padding: 0px;
    margin: 0px
}

.li-select.checkbox li {
    list-style: none;
    padding-right: 15px;
    cursor: pointer;
    display: inline-block;
}

    .li-select.checkbox li:before {
        content: '';
        display: inline-block;
        border: solid 1px #000;
        border-radius: 100%;
        width: 12px;
        height: 12px;
        margin-right: 10px;
    }

    .li-select.checkbox li.active:before {
        background-color: #000000;
    }