UNPKG

@progress/kendo-ui

Version:

This package is part of the [Kendo UI for jQuery](http://www.telerik.com/kendo-ui) suite.

1,895 lines 690 kB
/*! * Copyright 2019 Progress Software Corporation and/or one of its subsidiaries or affiliates. All rights reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ .k-button[disabled], .k-button[disabled]:focus, .k-button.k-state-focused[disabled], [disabled] .k-button, [disabled] .k-button:focus, [disabled] .k-button.k-state-focused, .k-button.k-state-disabled, .k-button.k-state-disabled:focus, .k-button.k-state-disabled.k-state-focused { outline: none; cursor: default; opacity: 0.6; -webkit-filter: grayscale(0.1); filter: grayscale(0.1); pointer-events: none; box-shadow: none; } .k-widget, .k-block, .k-panel { border-color: rgba(0, 0, 0, 0.12); color: rgba(0, 0, 0, 0.87); background-color: #fff; } .k-content, .k-spreadsheet-filter-menu .k-spreadsheet-value-treeview-wrapper, .k-editor, .k-gantt, .k-scheduler, .k-scheduler-agendaview tr.k-state-hover .k-scheduler-datecolumn, .k-scheduler-agendaview tr:hover .k-scheduler-datecolumn, .k-scheduler-agendaview tr:hover .k-scheduler-groupcolumn, .k-notification { border-color: rgba(0, 0, 0, 0.12); color: rgba(0, 0, 0, 0.87); background-color: #fff; } .k-popup, .k-column-menu .k-menu:not(.k-context-menu), .k-gantt-views.k-state-expanded, .k-menu-group, .k-menu.k-context-menu { border-color: rgba(0, 0, 0, 0.12); color: rgba(0, 0, 0, 0.87); background-color: #fff; } .k-treemap .k-treemap-title, .k-block > .k-header, .k-panel > .k-header { border-color: rgba(0, 0, 0, 0.08); color: rgba(0, 0, 0, 0.87); background-color: #fff; } .k-button, .k-list-container .k-nodata .k-button, .k-toolbar .k-split-button .k-button, .k-spreadsheet-filter, .k-numerictextbox .k-select, .k-handle, .k-map .k-navigator { border-color: #fff; color: rgba(0, 0, 0, 0.87); background-color: #fff; } .k-toolbar .k-split-button .k-button:hover, .k-toolbar .k-split-button .k-button.k-state-hover, .k-spreadsheet-filter:hover, .k-numerictextbox .k-select:hover, .k-numerictextbox .k-select > .k-state-selected, .k-numerictextbox .k-select > .k-state-active, .k-numerictextbox .k-state-hover .k-select, .k-handle:hover { border-color: #e0e0e0; background-color: #e0e0e0; } .k-toolbar .k-split-button .k-button:active, .k-toolbar .k-split-button .k-button.k-state-active, .k-spreadsheet-filter.k-state-active { border-color: #e0e0e0; background-color: #e0e0e0; box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12); } .k-button.k-primary, .k-slider .k-draghandle { border-color: #3f51b5; color: #fff; background-color: #3f51b5; } .k-slider .k-draghandle:hover { border-color: #5666be; background-color: #5666be; } .k-toolbar, .k-spreadsheet-sheets-bar, .k-editor-toolbar, .k-gantt-toolbar, .k-scheduler-toolbar, .k-scheduler-footer, .k-scheduler-header { border-color: #f5f5f5; color: rgba(0, 0, 0, 0.87); background-color: #f5f5f5; } .k-numerictextbox .k-numeric-wrap { border-color: rgba(0, 0, 0, 0.42); color: rgba(0, 0, 0, 0.87); } .k-numerictextbox .k-state-hover { border-color: rgba(0, 0, 0, 0.87); } .k-autocomplete.k-state-focused, .k-numerictextbox .k-state-focused { border-color: #3f51b5; } .k-list-filter > .k-textbox, .k-timeselector .k-time-list-wrapper .k-time-list .k-item:hover, .k-datetime-wrap .k-time-list-wrapper .k-time-list .k-item:hover, .k-scheduler-agendaview tr.k-state-hover, .k-scheduler-agendaview .k-scheduler-content tr:hover { border-color: rgba(0, 0, 0, 0.15); color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.04); } .k-drag-clue { border-color: rgba(0, 0, 0, 0.1); color: #fff; background-color: #ff4081; } .k-column-menu .k-menu:not(.k-context-menu) .k-item { color: rgba(0, 0, 0, 0.87); background-color: #fff; } .k-list .k-item:hover, .k-list .k-item.k-state-hover, .k-list-optionlabel:hover, .k-list-optionlabel.k-state-hover, .k-list-container .k-button:hover, .k-list-container .k-button.k-state-hover, .k-column-list-item:hover, .k-columnmenu-item:hover, .k-column-menu .k-menu:not(.k-context-menu) .k-item:hover, .k-column-menu .k-menu:not(.k-context-menu) .k-item.k-state-hover, .k-spreadsheet-popup .k-button:hover, .k-spreadsheet-popup .k-button.k-state-hover, .k-menu-group .k-item:hover, .k-menu-group .k-item.k-state-hover, .k-menu.k-context-menu .k-item:hover, .k-menu.k-context-menu .k-item.k-state-hover { color: rgba(0, 0, 0, 0.87); background-color: rgba(0, 0, 0, 0.04); } .k-list .k-item.k-state-selected, .k-list-optionlabel.k-state-selected, .k-list-container .k-button:active, .k-list-container .k-button.k-state-active, .k-column-menu .k-menu:not(.k-context-menu) .k-item.k-state-selected, .k-spreadsheet-popup .k-button:active, .k-spreadsheet-popup .k-button.k-state-active, .k-spreadsheet-popup .k-button.k-state-selected, .k-menu-group .k-item.k-state-selected, .k-menu.k-context-menu .k-item.k-state-selected { color: #ff4081; background-color: #fff; } .k-theme-test-class, .k-common-test-class { opacity: 0; } .k-reset { margin: 0; padding: 0; border-width: 0; outline: 0; text-decoration: none; font: inherit; list-style: none; } .k-widget { border-width: 1px; border-style: solid; box-sizing: border-box; outline: 0; font-size: 14px; line-height: 2; display: block; -webkit-touch-callout: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } table.k-widget { display: table; } kendo-sortable { display: block; } .k-overlay { width: 100%; height: 100%; background-color: #000000; opacity: 0.5; position: fixed; top: 0; left: 0; z-index: 10001; } .k-rtl { direction: rtl; } .k-link, .k-link:hover { color: inherit; text-decoration: none; outline: 0; cursor: pointer; } .k-content { outline: 0; } .k-centered { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .k-no-click { pointer-events: none; } .k-pdf-export-shadow { position: absolute; overflow: hidden; left: -15000px; width: 14400px; } .kendo-pdf-hide-pseudo-elements::before, .kendo-pdf-hide-pseudo-elements::after { display: none !important; } .k-state-disabled, .k-widget[disabled] { outline: none; cursor: default; opacity: 0.6; -webkit-filter: grayscale(0.1); filter: grayscale(0.1); pointer-events: none; box-shadow: none; } .k-state-disabled .k-link, .k-state-disabled .k-button, .k-widget[disabled] .k-link, .k-widget[disabled] .k-button { cursor: default; outline: 0; } .k-state-disabled [disabled], .k-state-disabled .k-state-disabled, .k-widget[disabled] [disabled], .k-widget[disabled] .k-state-disabled { opacity: 1; -webkit-filter: grayscale(0); filter: grayscale(0); } .k-hr, .k-separator, .k-menu-group .k-item.k-separator, .k-menu-vertical .k-item.k-separator { margin: 1em auto; height: 0; border-width: 1px 0 0; border-style: solid; border-color: rgba(0, 0, 0, 0.12); display: block; } .k-hbox > .k-hr, .k-columnset > .k-hr, .k-toolbar .k-separator, .k-menu-horizontal > .k-item.k-separator { margin: 0; width: 0; height: auto; border-width: 0 0 0 1px; -ms-flex: 0 0 auto; flex: 0 0 auto; } .k-hr { padding: 0; float: none; clear: both; } .k-vbox > .k-hr, .k-rowset > .k-hr { margin: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; } .k-dirty { margin: 0; padding: 0; width: 0; height: 0; border-width: 3px; border-style: solid; border-color: #f31700 #f31700 transparent transparent; position: absolute; top: 0; right: 0; } [dir="rtl"] .k-dirty, .k-rtl .k-dirty { border-color: transparent transparent #f31700 #f31700; right: auto; left: 0; } .k-display-inline { display: inline !important; } .k-display-block { display: block !important; } .k-display-inline-block { display: inline-block !important; } .k-display-flex { display: -ms-flexbox !important; display: flex !important; } .k-display-inline-flex { display: -ms-inline-flexbox !important; display: inline-flex !important; } .k-display-table { display: table !important; } .k-display-inline-table { display: inline-table !important; } .k-display-none, .k-hidden { display: none !important; } .k-float-left { float: left !important; } .k-float-right { float: right !important; } .k-float-none { float: none !important; } .k-floatwrap::after, .k-grid-toolbar::after, .k-slider-items::after { content: ""; display: block; clear: both; } .k-flex-wrap { -ms-flex-wrap: wrap; flex-wrap: wrap; } .k-flex-nowrap { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .k-flex-wrap-reverse { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; } .k-flex { -ms-flex: 1 1 0px; flex: 1 1 0; } .k-flex-auto { -ms-flex: 1 1 auto; flex: 1 1 auto; } .k-no-flex { -ms-flex: 0 0 0px; flex: 0 0 0; } .k-no-flex-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; } .k-flex-grow { -ms-flex-positive: 1; flex-grow: 1; } .k-no-flex-grow { -ms-flex-positive: 0; flex-grow: 0; } .k-flex-shrink { -ms-flex-negative: 1; flex-shrink: 1; } .k-no-flex-shrink { -ms-flex-negative: 0; flex-shrink: 0; } .k-align-items-start { -ms-flex-align: start; align-items: flex-start; } .k-align-items-end { -ms-flex-align: end; align-items: flex-end; } .k-align-items-center { -ms-flex-align: center; align-items: center; } .k-align-items-stretch { -ms-flex-align: stretch; align-items: stretch; } .k-align-items-baseline { -ms-flex-align: baseline; align-items: baseline; } .k-align-content-start { -ms-flex-line-pack: start; align-content: flex-start; } .k-align-content-end { -ms-flex-line-pack: end; align-content: flex-end; } .k-align-content-center { -ms-flex-line-pack: center; align-content: center; } .k-align-content-stretch { -ms-flex-line-pack: stretch; align-content: stretch; } .k-align-content-baseline { -ms-flex-line-pack: baseline; align-content: baseline; } .k-align-self-start { -ms-flex-item-align: start; align-self: flex-start; } .k-align-self-end { -ms-flex-item-align: end; align-self: flex-end; } .k-align-self-center { -ms-flex-item-align: center; align-self: center; } .k-align-self-stretch { -ms-flex-item-align: stretch; align-self: stretch; } .k-align-self-baseline { -ms-flex-item-align: baseline; align-self: baseline; } .k-justify-content-start { -ms-flex-pack: start; justify-content: flex-start; } .k-justify-content-end { -ms-flex-pack: end; justify-content: flex-end; } .k-justify-content-center { -ms-flex-pack: center; justify-content: center; } .k-justify-content-between { -ms-flex-pack: justify; justify-content: space-between; } .k-justify-content-around { -ms-flex-pack: distribute; justify-content: space-around; } .k-justify-content-evenly { -ms-flex-pack: space-evenly; justify-content: space-evenly; } .k-hbox, .k-columnset, .k-vbox, .k-rowset { display: -ms-flexbox; display: flex; } .k-ihbox, .k-ivbox { display: -ms-inline-flexbox; display: inline-flex; } .k-hbox, .k-columnset, .k-ihbox { -ms-flex-direction: row; flex-direction: row; } .k-vbox, .k-rowset, .k-ivbox { -ms-flex-direction: column; flex-direction: column; } .k-column { -ms-flex-positive: 1; flex-grow: 1; -ms-flex-preferred-size: 0; flex-basis: 0; } .k-reset { margin: 0; padding: 0; border-width: 0; outline: 0; font: inherit; text-decoration: none; list-style: none; } .k-text-nowrap { white-space: nowrap !important; } .k-text-ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .k-text-left { text-align: left !important; } .k-text-right { text-align: right !important; } .k-text-center { text-align: center !important; } .k-text-justify { text-align: justify !important; } .k-text-lowercase { text-transform: lowercase !important; } .k-text-uppercase { text-transform: uppercase !important; } .k-text-capitalize { text-transform: capitalize !important; } .k-font-weight-light { font-weight: 300 !important; } .k-font-weight-normal { font-weight: 400 !important; } .k-font-weight-bold { font-weight: 500 !important; } .k-flip-h { -webkit-transform: scaleX(-1); -ms-transform: scaleX(-1); transform: scaleX(-1); } .k-flip-v { -webkit-transform: scaleY(-1); -ms-transform: scaleY(-1); transform: scaleY(-1); } .k-flip-h.k-flip-v { -webkit-transform: scale(-1, -1); -ms-transform: scale(-1, -1); transform: scale(-1, -1); } .k-rotate-45 { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .k-rotate-90 { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } .k-rotate-135 { -webkit-transform: rotate(135deg); -ms-transform: rotate(135deg); transform: rotate(135deg); } .k-rotate-180 { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .k-rotate-225 { -webkit-transform: rotate(225deg); -ms-transform: rotate(225deg); transform: rotate(225deg); } .k-rotate-270 { -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); transform: rotate(270deg); } .k-rotate-315 { -webkit-transform: rotate(315deg); -ms-transform: rotate(315deg); transform: rotate(315deg); } .k-scale-0 { -webkit-transform: scale(0, 0); -ms-transform: scale(0, 0); transform: scale(0, 0); } .k-scale-1 { -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); } .k-scale-2 { -webkit-transform: scale(2, 2); -ms-transform: scale(2, 2); transform: scale(2, 2); } .k-translate-0 { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .k-translate-0-50 { -webkit-transform: translate(0, 50%); -ms-transform: translate(0, 50%); transform: translate(0, 50%); } .k-translate-0-100 { -webkit-transform: translate(0, 100%); -ms-transform: translate(0, 100%); transform: translate(0, 100%); } .k-translate-50-0 { -webkit-transform: translate(50%, 0); -ms-transform: translate(50%, 0); transform: translate(50%, 0); } .k-translate-50-50 { -webkit-transform: translate(50%, 50%); -ms-transform: translate(50%, 50%); transform: translate(50%, 50%); } .k-translate-50-100 { -webkit-transform: translate(50%, 100%); -ms-transform: translate(50%, 100%); transform: translate(50%, 100%); } .k-translate-100-0 { -webkit-transform: translate(100%, 0); -ms-transform: translate(100%, 0); transform: translate(100%, 0); } .k-translate-100-50 { -webkit-transform: translate(100%, 50%); -ms-transform: translate(100%, 50%); transform: translate(100%, 50%); } .k-translate-100-100 { -webkit-transform: translate(100%, 100%); -ms-transform: translate(100%, 100%); transform: translate(100%, 100%); } .k-animation-container { position: absolute; overflow: hidden; z-index: 100; } .k-animation-container-fixed { position: fixed; } .k-animation-container-relative { position: relative; display: inline-block; } .k-push-right-enter, .k-push-right-appear { -webkit-transform: translate(-100%, 0); -ms-transform: translate(-100%, 0); transform: translate(-100%, 0); } .k-push-right-enter-active, .k-push-right-appear-active { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-push-right-exit { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .k-push-right-exit-active { -webkit-transform: translate(100%, 0); -ms-transform: translate(100%, 0); transform: translate(100%, 0); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-push-left-enter, .k-push-left-appear { -webkit-transform: translate(100%, 0); -ms-transform: translate(100%, 0); transform: translate(100%, 0); } .k-push-left-enter-active, .k-push-left-appear-active { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-push-left-exit { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .k-push-left-exit-active { -webkit-transform: translate(-100%, 0); -ms-transform: translate(-100%, 0); transform: translate(-100%, 0); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-push-down-enter, .k-push-down-appear { -webkit-transform: translate(0, -100%); -ms-transform: translate(0, -100%); transform: translate(0, -100%); } .k-push-down-enter-active, .k-push-down-appear-active { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-push-down-exit { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .k-push-down-exit-active { -webkit-transform: translate(0, 100%); -ms-transform: translate(0, 100%); transform: translate(0, 100%); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-push-up-enter, .k-push-up-appear { -webkit-transform: translate(0, 100%); -ms-transform: translate(0, 100%); transform: translate(0, 100%); } .k-push-up-enter-active, .k-push-up-appear-active { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-push-up-exit { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .k-push-up-exit-active { -webkit-transform: translate(0, -100%); -ms-transform: translate(0, -100%); transform: translate(0, -100%); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-expand-vertical-enter, .k-expand-vertical-appear { -webkit-transform: scaleY(0); -ms-transform: scaleY(0); transform: scaleY(0); } .k-expand-vertical-enter-active, .k-expand-vertical-appear-active { -webkit-transform: scaleY(1); -ms-transform: scaleY(1); transform: scaleY(1); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-expand-vertical-exit { -webkit-transform: scaleY(1); -ms-transform: scaleY(1); transform: scaleY(1); } .k-expand-vertical-exit-active { -webkit-transform: scaleY(0); -ms-transform: scaleY(0); transform: scaleY(0); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-expand-horizontal-enter, .k-expand-horizontal-appear { -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); } .k-expand-horizontal-enter-active, .k-expand-horizontal-appear-active { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-expand-horizontal-exit { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); } .k-expand-horizontal-exit-active { -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-fade-enter, .k-fade-appear { opacity: 0; } .k-fade-enter-active, .k-fade-appear-active { opacity: 1; transition: opacity 500ms ease-in-out; } .k-fade-exit { opacity: 1; } .k-fade-exit-active { opacity: 0; transition: opacity 500ms ease-in-out; } .k-fade-exit-active + .k-fade-exit-active, .k-fade-enter-active + .k-fade-enter-active { display: none; } .k-zoom-in-enter, .k-zoom-in-appear { opacity: 0; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } .k-zoom-in-enter-active, .k-zoom-in-appear-active { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); transition: opacity 300ms ease-in-out, -webkit-transform; transition: transform, opacity 300ms ease-in-out; transition: transform, opacity 300ms ease-in-out, -webkit-transform; } .k-zoom-in-exit { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .k-zoom-in-exit-active { opacity: 0; -webkit-transform: scale(2); -ms-transform: scale(2); transform: scale(2); transition: opacity 300ms ease-in-out, -webkit-transform; transition: transform, opacity 300ms ease-in-out; transition: transform, opacity 300ms ease-in-out, -webkit-transform; } .k-zoom-out-enter, .k-zoom-out-appear { opacity: 0; -webkit-transform: scale(2); -ms-transform: scale(2); transform: scale(2); } .k-zoom-out-enter-active, .k-zoom-out-appear-active { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); transition: opacity 300ms ease-in-out, -webkit-transform; transition: transform, opacity 300ms ease-in-out; transition: transform, opacity 300ms ease-in-out, -webkit-transform; } .k-zoom-out-exit { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .k-zoom-out-exit-active { opacity: 0; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); transition: opacity 300ms ease-in-out, -webkit-transform; transition: transform, opacity 300ms ease-in-out; transition: transform, opacity 300ms ease-in-out, -webkit-transform; } .k-slide-in-appear { opacity: 0.1; -webkit-transform: translate(0, -3em); -ms-transform: translate(0, -3em); transform: translate(0, -3em); } .k-slide-in-appear .k-centered { -webkit-transform: translate(-50%, -60%); -ms-transform: translate(-50%, -60%); transform: translate(-50%, -60%); } .k-slide-in-appear-active { opacity: 1; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); transition: opacity 0.3s cubic-bezier(0.2, 1, 0.2, 1), -webkit-transform 0.3s cubic-bezier(0.2, 0.6, 0.4, 1); transition: transform 0.3s cubic-bezier(0.2, 0.6, 0.4, 1), opacity 0.3s cubic-bezier(0.2, 1, 0.2, 1); transition: transform 0.3s cubic-bezier(0.2, 0.6, 0.4, 1), opacity 0.3s cubic-bezier(0.2, 1, 0.2, 1), -webkit-transform 0.3s cubic-bezier(0.2, 0.6, 0.4, 1); } .k-slide-in-appear-active .k-centered { -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .k-slide-down-enter, .k-slide-down-appear { -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); } .k-slide-down-enter-active, .k-slide-down-appear-active { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-slide-down-exit { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .k-slide-down-exit-active { -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-slide-up-enter, .k-slide-up-appear { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); } .k-slide-up-enter-active, .k-slide-up-appear-active { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-slide-up-exit { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .k-slide-up-exit-active { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-slide-right-enter, .k-slide-right-appear { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-slide-right-enter-active, .k-slide-right-appear-active { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-slide-right-exit { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .k-slide-right-exit-active { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-slide-left-enter, .k-slide-left-appear { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-slide-left-enter-active, .k-slide-left-appear-active { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-slide-left-exit { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .k-slide-left-exit-active { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .k-reveal-vertical-enter, .k-reveal-vertical-appear { max-height: 0; } .k-reveal-vertical-enter-active, .k-reveal-vertical-appear-active { transition: max-height 300ms ease-in-out; } .k-reveal-vertical-exit-active { max-height: 0 !important; transition: max-height 300ms ease-in-out; } .k-reveal-horizontal-enter, .k-reveal-horizontal-appear { max-width: 0; } .k-reveal-horizontal-enter-active, .k-reveal-horizontal-appear-active { transition: max-width 300ms ease-in-out; } .k-reveal-horizontal-exit-active { max-width: 0 !important; transition: max-width 300ms ease-in-out; } .k-fx-end .k-fx-next, .k-fx-end .k-fx-current { transition: all 350ms ease-out; } .k-fx { position: relative; } .k-fx .k-fx-current { z-index: 0; } .k-fx .k-fx-next { z-index: 1; } .k-fx-hidden, .k-fx-hidden * { visibility: hidden !important; } .k-fx-reverse .k-fx-current { z-index: 1; } .k-fx-reverse .k-fx-next { z-index: 0; } .k-fx-zoom.k-fx-start .k-fx-next { -webkit-transform: scale(0) !important; -ms-transform: scale(0) !important; transform: scale(0) !important; } .k-fx-zoom.k-fx-end .k-fx-next { -webkit-transform: scale(1) !important; -ms-transform: scale(1) !important; transform: scale(1) !important; } .k-fx-zoom.k-fx-reverse.k-fx-start .k-fx-next, .k-fx-zoom.k-fx-reverse.k-fx-end .k-fx-next { -webkit-transform: scale(1) !important; -ms-transform: scale(1) !important; transform: scale(1) !important; } .k-fx-zoom.k-fx-reverse.k-fx-start .k-fx-current { -webkit-transform: scale(1) !important; -ms-transform: scale(1) !important; transform: scale(1) !important; } .k-fx-zoom.k-fx-reverse.k-fx-end .k-fx-current { -webkit-transform: scale(0) !important; -ms-transform: scale(0) !important; transform: scale(0) !important; } .k-fx-fade.k-fx-start .k-fx-next { will-change: opacity; opacity: 0; } .k-fx-fade.k-fx-end .k-fx-next { opacity: 1; } .k-fx-fade.k-fx-reverse.k-fx-start .k-fx-current { will-change: opacity; opacity: 1; } .k-fx-fade.k-fx-reverse.k-fx-end .k-fx-current { opacity: 0; } .k-fx-slide.k-fx-end .k-fx-next .k-content, .k-fx-slide.k-fx-end .k-fx-next .k-header, .k-fx-slide.k-fx-end .k-fx-next .k-footer, .k-fx-slide.k-fx-end .k-fx-current .k-content, .k-fx-slide.k-fx-end .k-fx-current .k-header, .k-fx-slide.k-fx-end .k-fx-current .k-footer, .k-fx-slide.k-fx-end .k-fx-next .km-content, .k-fx-slide.k-fx-end .k-fx-next .km-header, .k-fx-slide.k-fx-end .k-fx-next .km-footer, .k-fx-slide.k-fx-end .k-fx-current .km-content, .k-fx-slide.k-fx-end .k-fx-current .km-header, .k-fx-slide.k-fx-end .k-fx-current .km-footer { transition: all 350ms ease-out; } .k-fx-slide.k-fx-start .k-fx-next .k-content, .k-fx-slide.k-fx-start .k-fx-next .km-content { will-change: transform; -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx-slide.k-fx-start .k-fx-next .k-header, .k-fx-slide.k-fx-start .k-fx-next .k-footer, .k-fx-slide.k-fx-start .k-fx-next .km-header, .k-fx-slide.k-fx-start .k-fx-next .km-footer { will-change: opacity; opacity: 0; } .k-fx-slide.k-fx-end .k-fx-current .k-content, .k-fx-slide.k-fx-end .k-fx-current .km-content { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx-slide.k-fx-end .k-fx-next .k-header, .k-fx-slide.k-fx-end .k-fx-next .k-footer, .k-fx-slide.k-fx-end .k-fx-next .km-header, .k-fx-slide.k-fx-end .k-fx-next .km-footer { opacity: 1; } .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-current .k-content, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-current .km-content { will-change: transform; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-current .k-content, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-current .km-content { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-next .k-content, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-next .km-content { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-next .k-content, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-next .km-content { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-current .k-header, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-current .k-footer, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-current .km-header, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-current .km-footer { will-change: opacity; opacity: 1; } .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-next .k-header, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-next .k-footer, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-next .km-header, .k-fx-slide.k-fx-reverse.k-fx-start .k-fx-next .km-footer { opacity: 1; } .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-current .k-header, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-current .k-footer, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-current .km-header, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-current .km-footer { opacity: 0; } .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-next .k-header, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-next .k-footer, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-next .km-header, .k-fx-slide.k-fx-reverse.k-fx-end .k-fx-next .km-footer { opacity: 1; } .k-fx-slide.k-fx-right.k-fx-start .k-fx-next .k-content, .k-fx-slide.k-fx-right.k-fx-start .k-fx-next .km-content { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx-slide.k-fx-right.k-fx-end .k-fx-current .k-content, .k-fx-slide.k-fx-right.k-fx-end .k-fx-current .km-content { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx-slide.k-fx-right.k-fx-reverse.k-fx-start .k-fx-current .k-content, .k-fx-slide.k-fx-right.k-fx-reverse.k-fx-start .k-fx-current .km-content { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .k-fx-slide.k-fx-right.k-fx-reverse.k-fx-end .k-fx-current .k-content, .k-fx-slide.k-fx-right.k-fx-reverse.k-fx-end .k-fx-current .km-content { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx-slide.k-fx-right.k-fx-reverse.k-fx-start .k-fx-next .k-content, .k-fx-slide.k-fx-right.k-fx-reverse.k-fx-start .k-fx-next .km-content { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx-slide.k-fx-right.k-fx-reverse.k-fx-end .k-fx-next .k-content, .k-fx-slide.k-fx-right.k-fx-reverse.k-fx-end .k-fx-next .km-content { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } .k-fx-tile.k-fx-start .k-fx-next { will-change: transform; -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx-tile.k-fx-end .k-fx-current { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx-tile.k-fx-reverse.k-fx-start .k-fx-current { will-change: transform; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .k-fx-tile.k-fx-reverse.k-fx-end .k-fx-current { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx-tile.k-fx-reverse.k-fx-start .k-fx-next { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx-tile.k-fx-reverse.k-fx-end .k-fx-next { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .k-fx-tile.k-fx-right.k-fx-start .k-fx-next { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx-tile.k-fx-right.k-fx-end .k-fx-current { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx-tile.k-fx-right.k-fx-reverse.k-fx-start .k-fx-current { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .k-fx-tile.k-fx-right.k-fx-reverse.k-fx-end .k-fx-current { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx-tile.k-fx-right.k-fx-reverse.k-fx-start .k-fx-next { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx-tile.k-fx-right.k-fx-reverse.k-fx-end .k-fx-next { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } .k-fx-tile.k-fx-start .k-fx-next { will-change: transform; -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx-tile.k-fx-end .k-fx-current { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx-tile.k-fx-reverse.k-fx-start .k-fx-current { will-change: transform; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .k-fx-tile.k-fx-reverse.k-fx-end .k-fx-current { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx-tile.k-fx-reverse.k-fx-start .k-fx-next { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx-tile.k-fx-reverse.k-fx-end .k-fx-next { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .k-fx-tile.k-fx-right.k-fx-start .k-fx-next { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx-tile.k-fx-right.k-fx-end .k-fx-current { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx-tile.k-fx-right.k-fx-reverse.k-fx-start .k-fx-current { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .k-fx-tile.k-fx-right.k-fx-reverse.k-fx-end .k-fx-current { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx-tile.k-fx-right.k-fx-reverse.k-fx-start .k-fx-next { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx-tile.k-fx-right.k-fx-reverse.k-fx-end .k-fx-next { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } .k-fx.k-fx-overlay.k-fx-start .k-fx-next, .k-fx.k-fx-overlay.k-fx-left.k-fx-start .k-fx-next { will-change: transform; -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx.k-fx-overlay.k-fx-right.k-fx-start .k-fx-next { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx.k-fx-overlay.k-fx-up.k-fx-start .k-fx-next { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); } .k-fx.k-fx-overlay.k-fx-down.k-fx-start .k-fx-next { -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); } .k-fx.k-fx-overlay.k-fx-reverse.k-fx-start .k-fx-next { -webkit-transform: none; -ms-transform: none; transform: none; } .k-fx.k-fx-overlay.k-fx-reverse.k-fx-start .k-fx-current { will-change: transform; -webkit-transform: none; -ms-transform: none; transform: none; } .k-fx.k-fx-overlay.k-fx-reverse.k-fx-end .k-fx-current, .k-fx.k-fx-overlay.k-fx-reverse.k-fx-left.k-fx-end .k-fx-current { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .k-fx.k-fx-overlay.k-fx-reverse.k-fx-right.k-fx-end .k-fx-current { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .k-fx.k-fx-overlay.k-fx-reverse.k-fx-up.k-fx-end .k-fx-current { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); } .k-fx.k-fx-overlay.k-fx-reverse.k-fx-down.k-fx-end .k-fx-current { -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); } .k-arrow-e, .k-arrow-w { width: 0; height: 0; border: 5px solid transparent; position: absolute; top: -4px; } .k-arrow-e { border-left-color: currentColor; right: -6px; } .k-arrow-w { border-right-color: currentColor; left: -6px; } .k-drag-clue { padding: 2px 8px; border-width: 1px; border-style: solid; font-size: 12px; white-space: nowrap; overflow: hidden; cursor: move; } .k-drag-status { margin-right: 0.4ex; } .k-reorder-cue { position: absolute; } .k-reorder-cue::before, .k-reorder-cue::after { content: ""; width: 0; height: 0; border: 3px solid transparent; position: absolute; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .k-reorder-cue::before { border-bottom-width: 0; border-top-color: currentColor; top: -4px; } .k-reorder-cue::after { border-top-width: 0; border-bottom-color: currentColor; bottom: -4px; } .k-autocomplete, .k-combobox, .k-dateinput, .k-datepicker, .k-datetimepicker, .k-dropdown, .k-multiselect, .k-numerictextbox, .k-maskedtextbox, .k-timepicker, .k-dropdowntree { width: 200px; font-size: 16px; line-height: 1.125; text-align: left; white-space: nowrap; display: -ms-inline-flexbox; display: inline-flex; vertical-align: middle; position: relative; } .k-autocomplete[dir="rtl"], .k-rtl .k-autocomplete, .k-combobox[dir="rtl"], .k-rtl .k-combobox, .k-dateinput[dir="rtl"], .k-rtl .k-dateinput, .k-datepicker[dir="rtl"], .k-rtl .k-datepicker, .k-datetimepicker[dir="rtl"], .k-rtl .k-datetimepicker, .k-dropdown[dir="rtl"], .k-rtl .k-dropdown, .k-multiselect[dir="rtl"], .k-rtl .k-multiselect, .k-numerictextbox[dir="rtl"], .k-rtl .k-numerictextbox, .k-maskedtextbox[dir="rtl"], .k-rtl .k-maskedtextbox, .k-timepicker[dir="rtl"], .k-rtl .k-timepicker, .k-dropdowntree[dir="rtl"], .k-rtl .k-dropdowntree { text-align: right; } .k-autocomplete[dir="rtl"] .k-select, .k-rtl .k-autocomplete .k-select, .k-combobox[dir="rtl"] .k-select, .k-rtl .k-combobox .k-select, .k-dateinput[dir="rtl"] .k-select, .k-rtl .k-dateinput .k-select, .k-datepicker[dir="rtl"] .k-select, .k-rtl .k-datepicker .k-select, .k-datetimepicker[dir="rtl"] .k-select, .k-rtl .k-datetimepicker .k-select, .k-dropdown[dir="rtl"] .k-select, .k-rtl .k-dropdown .k-select, .k-multiselect[dir="rtl"] .k-select, .k-rtl .k-multiselect .k-select, .k-numerictextbox[dir="rtl"] .k-select, .k-rtl .k-numerictextbox .k-select, .k-maskedtextbox[dir="rtl"] .k-select, .k-rtl .k-maskedtextbox .k-select, .k-timepicker[dir="rtl"] .k-select, .k-rtl .k-timepicker .k-select, .k-dropdowntree[dir="rtl"] .k-select, .k-rtl .k-dropdowntree .k-select { border-radius: 2px 0 0 2px; } .k-autocomplete ::-ms-clear, .k-combobox ::-ms-clear, .k-dateinput ::-ms-clear, .k-datepicker ::-ms-clear, .k-datetimepicker ::-ms-clear, .k-dropdown ::-ms-clear, .k-multiselect ::-ms-clear, .k-numerictextbox ::-ms-clear, .k-maskedtextbox ::-ms-clear, .k-timepicker ::-ms-clear, .k-dropdowntree ::-ms-clear { display: none; } .k-colorpicker, .k-combobox, .k-dateinput, .k-datepicker, .k-datetimepicker, .k-dropdown, .k-multiselect, .k-numerictextbox, .k-maskedtextbox, .k-timepicker, .k-dropdowntree { border-width: 0; background-color: transparent; } .k-nodata { min-height: 138px; width: 100%; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; text-transform: uppercase; font-weight: lighter; text-align: center; white-space: normal; } .k-searchbar { -ms-flex: 1; flex: 1; display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; } .k-autocomplete, .k-dateinput-wrap, .k-dropdown-wrap, .k-picker-wrap, .k-multiselect-wrap, .k-numeric-wrap { border-radius: 0; padding: 0; width: 100%; border-width: 1px; border-style: solid; box-sizing: border-box; position: relative; transition: all 0.1s ease; cursor: default; outline: 0; } .k-autocomplete .k-input, .k-dateinput-wrap .k-input, .k-dropdown-wrap .k-input, .k-picker-wrap .k-input, .k-multiselect-wrap .k-input, .k-numeric-wrap .k-input { padding: 8px 0; height: calc(16px + 1.125em); box-sizing: border-box; border: 0; outline: 0; color: inherit; background: none; font: inherit; -ms-flex: 0 1 auto; flex: 0 1 auto; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; overflow: hidden; text-overflow: ellipsis; } .k-autocomplete.k-invalid, .k-autocomplete.k-invalid:hover, .k-autocomplete.k-state-invalid, .k-autocomplete.ng-invalid.ng-touched, .k-autocomplete.ng-invalid.ng-dirty, .k-dateinput-wrap.k-invalid, .k-dateinput-wrap.k-invalid:hover, .k-dateinput-wrap.k-state-invalid, .k-dateinput-wrap.ng-invalid.ng-touched, .k-dateinput-wrap.ng-invalid.ng-dirty, .k-dropdown-wrap.k-invalid, .k-dropdown-wrap.k-invalid:hover, .k-dropdown-wrap.k-state-invalid, .k-dropdown-wrap.ng-invalid.ng-touched, .k-dropdown-wrap.ng-invalid.ng-dirty, .k-picker-wrap.k-invalid, .k-picker-wrap.k-invalid:hover, .k-picker-wrap.k-state-invalid, .k-picker-wrap.ng-invalid.ng-touched, .k-picker-wrap.ng-invalid.ng-dirty, .k-multiselect-wrap.k-invalid, .k-multiselect-wrap.k-invalid:hover, .k-multiselect-wrap.k-state-invalid, .k-multiselect-wrap.ng-invalid.ng-touched, .k-multiselect-wrap.ng-invalid.ng-dirty, .k-numeric-wrap.k-invalid, .k-numeric-wrap.k-invalid:hover, .k-numeric-wrap.k-state-invalid, .k-numeric-wrap.ng-invalid.ng-touched, .k-numeric-wrap.ng-invalid.ng-dirty { color: #f31700; border-color: rgba(243, 23, 0, 0.5); } .k-autocomplete { width: 200px; } .k-dateinput-wrap, .k-dropdown-wrap, .k-picker-wrap, .k-numeric-wrap { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; } .k-dateinput-wrap .k-input, .k-dropdown-wrap .k-input, .k-picker-wrap .k-input, .k-numeric-wrap .k-input { width: 100%; } .k-edge .k-dateinput-wrap .k-input, .k-edge .k-dropdown-wrap .k-input, .k-edge .k-picker-wrap .k-input, .k-edge .k-numeric-wrap .k-input { min-width: 0; } .k-dateinput-wrap .k-select, .k-dropdown-wrap .k-select, .k-picker-wrap .k-select, .k-numeric-wrap .k-select { border-radius: 0 2px 2px 0; padding: 8px 4px; border-width: 0 0 0 0; box-sizing: border-box; border-style: solid; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; -ms-flex: 0 0 auto; flex: 0 0 auto; text-align: center; cursor: pointer; } .k-autocomplete .k-i-loading, .k-multiselect-wrap .k-i-loading { height: 18px; line-height: 18px; position: absolute; top: 8px; right: 4px; } .k-rtl .k-autocomplete .k-i-loading, [dir="rtl"] .k-autocomplete .k-i-loading, .k-rtl .k-multiselect-wrap .k-i-loading, [dir="rtl"] .k-multiselect-wrap .k-i-loading { right: auto; left: 4px; } .k-autocomplete .k-clear-value, .k-dropdown-wrap .k-clear-value, .k-multiselect-wrap .k-clear-value { height: 18px; line-height: 18px; outline: 0; cursor: pointer; display: none; -ms-flex-direction: row; flex-direction: row; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; opacity: 0.5; position: absolute; top: 8px; right: 4px; } .k-rtl .k-autocomplete .k-clear-value, [dir="rtl"] .k-autocomplete .k-clear-value, .k-rtl .k-dropdown-wrap .k-clear-value, [dir="rtl"] .k-dropdown-wrap .k-clear-value, .k-rtl .k-multiselect-wrap .k-clear-value, [dir="rtl"] .k-multiselect-wrap .k-clear-value { right: auto; left: 4px; } .k-autocomplete .k-clear-value:hover, .k-dropdown-wrap .k-clear-value:hover, .k-multiselect-wrap .k-clear-value:hover { opacity: 1; } .k-autocomplete.k-state-focused .k-clear-value, .k-autocomplete.k-state-hover .k-clear-value, .k-autocomplete:hover .k-clear-value, .k-dropdown-wrap.k-state-focused .k-clear-value, .k-dropdown-wrap.k-state-hover .k-clear-value, .k-dropdown-wrap:hover .k-clear-value { display: -ms-inline-flexbox; display: inline-flex; } .k-multiselect-wrap:hover .k-clear-value, .k-multiselect-wrap.k-state-hover .k-clear-value, .k-state-hover > .k-multiselect-wrap .k-clear-value, .k-multiselect-wrap.k-state-focused .k-clear-value, .k-state-focused > .k-multiselect-wrap .k-clear-value, .k-multiselect-wrap:hover .k-clear-value { display: -ms-inline-flexbox; display: inline-flex; } .k-dropdown-wrap .k-clear-value { right: 28px; } .k-rtl .k-dropdown-wrap .k-clear-value, [dir="rtl"] .k-dropdown-wrap .k-clear-value { right: auto; left: 28px; } .k-multiselect-wrap { padding-right: 24px; } .k-rtl .k-multiselect-wrap, [dir="rtl"] .k-multiselect-wrap { padding-left: 24px; padding-right: 0; } .k-autocomplete { padding-right: 24px; } .k-rtl .k-autocomplete, .k-autocomplete[dir="rtl"] { padding-left: 24px; padding-right: 0; } .k-dateinput .k-select, .k-numerictextbox .k-select { padding: 0; border-width: 0; width: calc(16px + 1.42857143em); display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-align: stretch; align-items: stretch; } .k-dateinput .k-link, .k-numerictextbox .k-link { -ms-flex: 1 1 auto; flex: 1 1 auto; display: block; overflow: hidden; position: relative; } .k-dateinput .k-link .k-icon, .k-numerictextbox .k-link .k-icon { position: absolute; right: 50%; -webkit-transform: translateX(50%); -ms-transform: translateX(50%); transform: translateX(50%); } .k-dateinput .k-link-increase .k-icon, .k-numerictextbox .k-link-increase .k-icon { bottom: -2px; } .k-dateinput .k-link-decrease .k-icon, .k-numerictextbox .k-link-decrease .k-icon { top: -2px; } .k-virtual-content { overflow-y: scroll; -webkit-overflow-scrolling: tou