2 * selectize.bootstrap3.css (v0.12.0) - Bootstrap 3 Theme
3 * Copyright (c) 2013–2015 Brian Reavis & contributors
5 * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
6 * file except in compliance with the License. You may obtain a copy of the License at:
7 * http://www.apache.org/licenses/LICENSE-2.0
9 * Unless required by applicable law or agreed to in writing, software distributed under
10 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
11 * ANY KIND, either express or implied. See the License for the specific language
12 * governing permissions and limitations under the License.
14 * @author Brian Reavis <brian@thirdroute.com>
16 .selectize-control.plugin-drag_drop.multi > .selectize-input > div.ui-sortable-placeholder {
17 visibility: visible !important;
18 background: #f2f2f2 !important;
19 background: rgba(0, 0, 0, 0.06) !important;
20 border: 0 none !important;
21 -webkit-box-shadow: inset 0 0 12px 4px #ffffff;
22 box-shadow: inset 0 0 12px 4px #ffffff;
24 .selectize-control.plugin-drag_drop .ui-sortable-placeholder::after {
28 .selectize-control.plugin-drag_drop .ui-sortable-helper {
29 -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
30 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
32 .selectize-dropdown-header {
35 border-bottom: 1px solid #d0d0d0;
37 -webkit-border-radius: 4px 4px 0 0;
38 -moz-border-radius: 4px 4px 0 0;
39 border-radius: 4px 4px 0 0;
41 .selectize-dropdown-header-close {
49 font-size: 20px !important;
51 .selectize-dropdown-header-close:hover {
54 .selectize-dropdown.plugin-optgroup_columns .optgroup {
55 border-right: 1px solid #f2f2f2;
58 -webkit-box-sizing: border-box;
59 -moz-box-sizing: border-box;
60 box-sizing: border-box;
62 .selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
65 .selectize-dropdown.plugin-optgroup_columns .optgroup:before {
68 .selectize-dropdown.plugin-optgroup_columns .optgroup-header {
71 .selectize-control.plugin-remove_button [data-value] {
73 padding-right: 24px !important;
75 .selectize-control.plugin-remove_button [data-value] .remove {
77 /* fixes ie bug (see #392) */
87 text-decoration: none;
88 vertical-align: middle;
89 display: inline-block;
91 border-left: 1px solid rgba(0, 0, 0, 0);
92 -webkit-border-radius: 0 2px 2px 0;
93 -moz-border-radius: 0 2px 2px 0;
94 border-radius: 0 2px 2px 0;
95 -webkit-box-sizing: border-box;
96 -moz-box-sizing: border-box;
97 box-sizing: border-box;
99 .selectize-control.plugin-remove_button [data-value] .remove:hover {
100 background: rgba(0, 0, 0, 0.05);
102 .selectize-control.plugin-remove_button [data-value].active .remove {
103 border-left-color: rgba(0, 0, 0, 0);
105 .selectize-control.plugin-remove_button .disabled [data-value] .remove:hover {
108 .selectize-control.plugin-remove_button .disabled [data-value] .remove {
109 border-left-color: rgba(77, 77, 77, 0);
116 .selectize-input input {
118 font-family: inherit;
121 -webkit-font-smoothing: inherit;
124 .selectize-control.single .selectize-input.input-active {
127 display: inline-block;
130 border: 1px solid #cccccc;
132 display: inline-block;
137 -webkit-box-sizing: border-box;
138 -moz-box-sizing: border-box;
139 box-sizing: border-box;
140 -webkit-box-shadow: none;
142 -webkit-border-radius: 4px;
143 -moz-border-radius: 4px;
146 .selectize-control.multi .selectize-input.has-items {
147 padding: 5px 12px 2px;
149 .selectize-input.full {
150 background-color: #ffffff;
152 .selectize-input.disabled,
153 .selectize-input.disabled * {
154 cursor: default !important;
156 .selectize-input.focus {
157 -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
158 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
160 .selectize-input.dropdown-active {
161 -webkit-border-radius: 4px 4px 0 0;
162 -moz-border-radius: 4px 4px 0 0;
163 border-radius: 4px 4px 0 0;
165 .selectize-input > * {
166 vertical-align: baseline;
167 display: -moz-inline-stack;
168 display: inline-block;
172 .selectize-control.multi .selectize-input > div {
178 border: 0 solid rgba(0, 0, 0, 0);
180 .selectize-control.multi .selectize-input > div.active {
183 border: 0 solid rgba(0, 0, 0, 0);
185 .selectize-control.multi .selectize-input.disabled > div,
186 .selectize-control.multi .selectize-input.disabled > div.active {
189 border: 0 solid rgba(77, 77, 77, 0);
191 .selectize-input > input {
192 display: inline-block !important;
193 padding: 0 !important;
194 min-height: 0 !important;
195 max-height: none !important;
196 max-width: 100% !important;
197 margin: 0 !important;
198 text-indent: 0 !important;
199 border: 0 none !important;
200 background: none !important;
201 line-height: inherit !important;
202 -webkit-user-select: auto !important;
203 -webkit-box-shadow: none !important;
204 box-shadow: none !important;
206 .selectize-input > input::-ms-clear {
209 .selectize-input > input:focus {
210 outline: none !important;
212 .selectize-input::after {
217 .selectize-input.dropdown-active::before {
227 .selectize-dropdown {
230 border: 1px solid #d0d0d0;
234 -webkit-box-sizing: border-box;
235 -moz-box-sizing: border-box;
236 box-sizing: border-box;
237 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
238 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
239 -webkit-border-radius: 0 0 4px 4px;
240 -moz-border-radius: 0 0 4px 4px;
241 border-radius: 0 0 4px 4px;
243 .selectize-dropdown [data-selectable] {
247 .selectize-dropdown [data-selectable] .highlight {
248 background: rgba(255, 237, 40, 0.4);
249 -webkit-border-radius: 1px;
250 -moz-border-radius: 1px;
253 .selectize-dropdown [data-selectable],
254 .selectize-dropdown .optgroup-header {
257 .selectize-dropdown .optgroup:first-child .optgroup-header {
260 .selectize-dropdown .optgroup-header {
265 .selectize-dropdown .active {
266 background-color: #f5f5f5;
269 .selectize-dropdown .active.create {
272 .selectize-dropdown .create {
273 color: rgba(51, 51, 51, 0.5);
275 .selectize-dropdown-content {
280 .selectize-control.single .selectize-input,
281 .selectize-control.single .selectize-input input {
284 .selectize-control.single .selectize-input.input-active,
285 .selectize-control.single .selectize-input.input-active input {
288 .selectize-control.single .selectize-input:after {
298 border-width: 5px 5px 0 5px;
299 border-color: #333333 transparent transparent transparent;
301 .selectize-control.single .selectize-input.dropdown-active:after {
303 border-width: 0 5px 5px 5px;
304 border-color: transparent transparent #333333 transparent;
306 .selectize-control.rtl.single .selectize-input:after {
310 .selectize-control.rtl .selectize-input > input {
311 margin: 0 4px 0 -2px !important;
313 .selectize-control .selectize-input.disabled {
315 background-color: #ffffff;
318 .selectize-dropdown.form-control {
324 border: 1px solid #cccccc;
325 border: 1px solid rgba(0, 0, 0, 0.15);
326 -webkit-border-radius: 4px;
327 -moz-border-radius: 4px;
329 -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
330 box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
332 .selectize-dropdown .optgroup-header {
334 line-height: 1.42857143;
336 .selectize-dropdown .optgroup:first-child:before {
339 .selectize-dropdown .optgroup:before {
345 background-color: #e5e5e5;
349 .selectize-dropdown-content {
352 .selectize-dropdown-header {
358 .selectize-input.dropdown-active {
359 -webkit-border-radius: 4px;
360 -moz-border-radius: 4px;
363 .selectize-input.dropdown-active::before {
366 .selectize-input.focus {
367 border-color: #66afe9;
369 -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
370 box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
372 .has-error .selectize-input {
373 border-color: #a94442;
374 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
375 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
377 .has-error .selectize-input:focus {
378 border-color: #843534;
379 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
380 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
382 .selectize-control.multi .selectize-input.has-items {
386 .selectize-control.multi .selectize-input > div {
387 -webkit-border-radius: 3px;
388 -moz-border-radius: 3px;
391 .form-control.selectize-control {
396 -webkit-box-shadow: none;
398 -webkit-border-radius: 0;
399 -moz-border-radius: 0;