/*! * Angular Material Design * https://github.com/angular/material * @license MIT * v1.1.3 */ md-autocomplete { border-radius: 2px; display: block; height: 40px; position: relative; overflow: visible; min-width: 190px; } md-autocomplete[disabled] input { cursor: default; } md-autocomplete[md-floating-label] { border-radius: 0; background: transparent; height: auto; } md-autocomplete[md-floating-label] md-input-container { padding-bottom: 0; } md-autocomplete[md-floating-label] md-autocomplete-wrap { height: auto; } md-autocomplete[md-floating-label] .md-show-clear-button button { display: block; position: absolute; right: 0; top: 20px; width: 30px; height: 30px; } md-autocomplete[md-floating-label] .md-show-clear-button input { padding-right: 30px; } [dir=rtl] md-autocomplete[md-floating-label] .md-show-clear-button input { padding-right: 0; padding-left: 30px; } md-autocomplete md-autocomplete-wrap { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; flex-direction: row; box-sizing: border-box; position: relative; overflow: visible; height: 40px; } md-autocomplete md-autocomplete-wrap.md-menu-showing { z-index: 51; } md-autocomplete md-autocomplete-wrap md-input-container, md-autocomplete md-autocomplete-wrap input { -webkit-box-flex: 1; -webkit-flex: 1 1 0%; flex: 1 1 0%; box-sizing: border-box; min-width: 0; } md-autocomplete md-autocomplete-wrap md-progress-linear { position: absolute; bottom: -2px; left: 0; } md-autocomplete md-autocomplete-wrap md-progress-linear.md-inline { bottom: 40px; right: 2px; left: 2px; width: auto; } md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate { position: absolute; top: 0; left: 0; width: 100%; height: 3px; -webkit-transition: none; transition: none; } md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate .md-container { -webkit-transition: none; transition: none; height: 3px; } md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate.ng-enter { -webkit-transition: opacity 0.15s linear; transition: opacity 0.15s linear; } md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate.ng-enter.ng-enter-active { opacity: 1; } md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate.ng-leave { -webkit-transition: opacity 0.15s linear; transition: opacity 0.15s linear; } md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate.ng-leave.ng-leave-active { opacity: 0; } md-autocomplete input:not(.md-input) { font-size: 14px; box-sizing: border-box; border: none; box-shadow: none; outline: none; background: transparent; width: 100%; padding: 0 15px; line-height: 40px; height: 40px; } md-autocomplete input:not(.md-input)::-ms-clear { display: none; } md-autocomplete .md-show-clear-button button { position: relative; line-height: 20px; text-align: center; width: 30px; height: 30px; cursor: pointer; border: none; border-radius: 50%; padding: 0; font-size: 12px; background: transparent; margin: auto 5px; } md-autocomplete .md-show-clear-button button:after { content: ''; position: absolute; top: -6px; right: -6px; bottom: -6px; left: -6px; border-radius: 50%; -webkit-transform: scale(0); transform: scale(0); opacity: 0; -webkit-transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); } md-autocomplete .md-show-clear-button button:focus { outline: none; } md-autocomplete .md-show-clear-button button:focus:after { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } md-autocomplete .md-show-clear-button button md-icon { position: absolute; top: 50%; left: 50%; -webkit-transform: translate3d(-50%, -50%, 0) scale(0.9); transform: translate3d(-50%, -50%, 0) scale(0.9); } md-autocomplete .md-show-clear-button button md-icon path { stroke-width: 0; } md-autocomplete .md-show-clear-button button.ng-enter { -webkit-transform: scale(0); transform: scale(0); -webkit-transition: -webkit-transform 0.15s ease-out; transition: -webkit-transform 0.15s ease-out; transition: transform 0.15s ease-out; transition: transform 0.15s ease-out, -webkit-transform 0.15s ease-out; } md-autocomplete .md-show-clear-button button.ng-enter.ng-enter-active { -webkit-transform: scale(1); transform: scale(1); } md-autocomplete .md-show-clear-button button.ng-leave { -webkit-transition: -webkit-transform 0.15s ease-out; transition: -webkit-transform 0.15s ease-out; transition: transform 0.15s ease-out; transition: transform 0.15s ease-out, -webkit-transform 0.15s ease-out; } md-autocomplete .md-show-clear-button button.ng-leave.ng-leave-active { -webkit-transform: scale(0); transform: scale(0); } @media screen and (-ms-high-contrast: active) { md-autocomplete input { border: 1px solid #fff; } md-autocomplete li:focus { color: #fff; } } .md-virtual-repeat-container.md-autocomplete-suggestions-container { position: absolute; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25); z-index: 100; height: 100%; } .md-virtual-repeat-container.md-not-found { height: 48px; } .md-autocomplete-suggestions { margin: 0; list-style: none; padding: 0; } .md-autocomplete-suggestions li { font-size: 14px; overflow: hidden; padding: 0 15px; line-height: 48px; height: 48px; -webkit-transition: background 0.15s linear; transition: background 0.15s linear; margin: 0; white-space: nowrap; text-overflow: ellipsis; } .md-autocomplete-suggestions li:focus { outline: none; } .md-autocomplete-suggestions li:not(.md-not-found-wrapper) { cursor: pointer; } @media screen and (-ms-high-contrast: active) { md-autocomplete, .md-autocomplete-suggestions { border: 1px solid #fff; } }