@charset "utf-8";
/*
 |  tail.select - Another solution to make select fields beautiful again!
 |  @file       ./css/tail.select-default.css
 |  @author     SamBrishes <sam@pytes.net>
 |  @version    0.5.5 - Beta
 |
 |  @website    https://github.com/pytesNET/tail.select
 |  @license    X11 / MIT License
 |  @copyright  Copyright © 2014 - 2018 SamBrishes, pytesNET <info@pytes.net>
 */

/* @start GENERAL */

.tail-select,
.tail-select *,
.tail-select *:before,
.tail-select *:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.tail-select {
    display: inline-block;
    margin: 0;
    padding: 0;
    position: relative;
    width: 250px;
}

.tail-select mark {
    background-color: #DC4650;
    color: #fff;
}

.tail-select button.tail-all,
.tail-select button.tail-none {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    background-color: transparent;
    box-shadow: none;
    color: #808080;
    cursor: pointer;
    display: inline-block;
    font-size: 10px;
    line-height: 14px;
    margin: 1px 3px 0 0;
    outline: none;
    padding: 1px 5px;
    text-shadow: none;
    vertical-align: top;
}

.tail-select button.tail-all:hover {
    background-color: transparent;
    border-color: #3C82E6;
    color: #3C82E6;
}

.tail-select button.tail-none:hover {
    background-color: transparent;
    border-color: #DC4650;
    color: #DC4650;
}

.tail-select-container {
    margin: 0;
    padding: 3px;
    text-align: left;
}

.tail-select-container .select-handle {
    -moz-transition: background 142ms linear;
    -webkit-transition: background 142ms linear;
    background-color: #3C82E6;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-size: 12px;
    line-height: 16px;
    margin: 1px;
    padding: 2px 24px 2px 5px;
    position: relative;
    text-align: left;
    transition: background 142ms linear;
    vertical-align: top;
    width: auto;
}

.tail-select-container .select-handle:hover {}

.tail-select-container .select-handle:after {
    -moz-transition: opacity 142ms linear;
    -webkit-transition: opacity 142ms linear;
    background-position: center center;
    background-repeat: no-repeat;
    content: "";
    display: inline-block;
    height: 14px;
    margin: 0;
    opacity: 0.3;
    padding: 0;
    position: absolute;
    top: 0;
    transition: opacity 142ms linear;
    vertical-align: top;
    width: 14px;
    z-index: 21;
}

.tail-select-container .select-handle:hover:after {
    opacity: 1;
}

/* @end GENERAL */

/* @start LABEL */

.tail-select .select-label {
    color: #303438;
    cursor: pointer;
    display: block;
    font-size: 14px;
    line-height: 29px;
    margin: 0;
    padding: 5px 10px;
    position: relative;
    text-align: left;
    width: 100%;
    z-index: 20;
}

.tail-select .select-label:after {}

.tail-select .select-label .label-count {
    border-right: 1px solid #cccccc;
    display: inline-block;
    margin: 0 5px 0 0;
    padding: 0 7px 0 0;
}

.tail-select .select-label .label-count,
.tail-select .select-label .label-inner {
    -moz-transition: border-color 142ms linear, opacity 142ms linear;
    -webkit-transition: border-color 142ms linear, opacity 142ms linear;
    transition: border-color 142ms linear, opacity 142ms linear;
}

.tail-select:hover .select-label,
.tail-select.idle .select-label,
.tail-select.active .select-label {
    z-index: 25;
}

.tail-select.active .select-label {
    z-index: 27;
}

.tail-select:hover .select-label:after,
.tail-select.idle .select-label:after,
.tail-select.active .select-label:after {
    /* opacity: 0.85; */
}

.tail-select:hover .select-label .label-count,
.tail-select.idle .select-label .label-count,
.tail-select.active .select-label .label-count,
.tail-select:hover .select-label .label-inner,
.tail-select.idle .select-label .label-inner,
.tail-select.active .select-label .label-inner {
    /* opacity: 1; */
}

.tail-select.active .select-label:after {}

.tail-select.disabled .select-label {
    background-color: #ededed;
    cursor: not-allowed;
}

/* @end LABEL */

/* @start DROPDOWN */

.tail-select .select-dropdown {
    background-color: #FFFFFF;
    border-radius: 0 0 3px 3px;
    display: none;
    height: auto;
    margin-top: 1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    text-align: left;
    top: 100%;
    width: 100%;
    z-index: 23;
}

.tail-select.active .select-dropdown {
    z-index: 26;
}

.tail-select .select-dropdown .dropdown-search,
.tail-select .select-dropdown .dropdown-inner,
.tail-select .select-dropdown .dropdown-empty,
.tail-select .select-dropdown .dropdown-action,
.tail-select .select-dropdown input[type=text].search-input {
    display: block;
    margin: 0;
    padding: 0;
    width: 100%;
}

.tail-select .select-dropdown .dropdown-search {
    border-bottom: 1px solid #cccccc;
    position: relative;
    z-index: 30;
}

.tail-select .select-dropdown .dropdown-search input[type=text].search-input {
    background-color: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    color: #303438;
    font-size: 12px;
    line-height: 20px;
    outline: none;
    padding: 10px 15px;
    text-align: left;
}

.tail-select .select-dropdown .dropdown-inner {
    overflow-x: hidden;
    overflow-y: auto;
    padding: 1px 0;
}

.tail-select .select-dropdown .dropdown-empty {
    font-size: 12px;
    line-height: 18px;
    padding: 16px 0 15px 0;
    text-align: center;
}

.tail-select .select-dropdown .dropdown-action {
    background-color: #f2f2f2;
    border-bottom: 1px solid #cccccc;
    padding: 6px 0 5px 0;
    text-align: center;
}

.tail-select .select-dropdown .dropdown-action button {
    font-size: 12px;
    line-height: 16px;
}

.tail-select .select-dropdown ul,
.tail-select .select-dropdown ul li {
    display: block;
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
    width: auto;
}

.tail-select .select-dropdown ul li {}

.tail-select .select-dropdown ul li:first-of-type {}

.tail-select .select-dropdown ul li:last-of-type {}

.tail-select .select-dropdown ul li.optgroup-title {
    background-color: transparent;
    font-size: 14px;
    padding-left: 10px;
}

.tail-select .select-dropdown ul li.optgroup-title button {
    float: right;
}

.tail-select .select-dropdown ul li.dropdown-option:hover,
.tail-select .select-dropdown ul li.dropdown-option.hover {}

.tail-select .select-dropdown ul li.dropdown-option:before {}

.tail-select .select-dropdown ul li .option-description {
    color: #484e53;
    display: block;
    font-size: 10px;
    line-height: 14px;
    margin: 0;
    padding: 0;
    text-align: left;
    width: auto;
}

.tail-select.open-top .select-dropdown {
    -moz-border-radius: 3px 3px 0 0;
    -webkit-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0;
    bottom: 100%;
    margin: 0 0 -1px 0;
    top: auto;
}

.tail-select.disabled .select-dropdown ul li.dropdown-option,
.tail-select .select-dropdown ul li.dropdown-option.disabled {
    background-color: #ededed;
    cursor: not-allowed;
    opacity: 0.65;
}

.tail-select.hide-selected .select-dropdown ul li.selected {
    display: none;
}

.tail-select.hide-disabled .select-dropdown ul li.disabled {
    display: none;
}

.tail-select .select-dropdown ul li:before {}

.tail-select .select-dropdown ul li:hover:before {}

.tail-select .select-dropdown ul li.selected:before {}

.tail-select.deselect .select-dropdown ul li.selected:hover:before {}

.tail-select.multiple .select-dropdown ul li:before {}

.tail-select.multiple .select-dropdown ul li:hover:before {
    opacity: 0.5;
}

.tail-select.multiple .select-dropdown ul li.selected:before {
    opacity: 0.85;
}

.tail-select.multiple .select-dropdown ul li.selected:hover:before {
    opacity: 0.85;
}

.tail-select.disabled .select-dropdown ul li:before,
.tail-select .select-dropdown ul li.disabled:before {
    opacity: 0.85;
}

.tail-select.multiple.disabled .select-dropdown ul li:before,
.tail-select.multiple .select-dropdown ul li.disabled:before {
    opacity: 0.85;
}

/* @end DROPDOWN */