primeng/resources/themes/lightness/theme.css

UI Components for Angular 2

@charset "UTF-8";
.ui-widget {
  font-family: Trebuchet MS, Tahoma, Verdana, Arial, sans-serif;
  font-size: 1em; }
  .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
    font-family: Trebuchet MS, Tahoma, Verdana, Arial, sans-serif;
    font-size: 1em; }
  .ui-widget :active {
    outline: none; }

.ui-widget-content {
  border: 1px solid #dddddd;
  background: #eeeeee;
  color: #333333; }
  .ui-widget-content a {
    color: #333333; }

.ui-widget-header {
  border: 1px solid #e78f08;
  background: #f6a828;
  color: #ffffff;
  font-weight: bold; }
  .ui-widget-header a {
    color: #ffffff; }

.ui-widget-overlay {
  background: #666666;
  opacity: .50;
  filter: Alpha(Opacity=50); }

.ui-widget-header .ui-state-default,
.ui-widget-content .ui-state-default,
.ui-state-default {
  border: 1px solid #cccccc;
  background: #f6f6f6;
  color: #1c94c4; }
  .ui-widget-header .ui-state-default a,
  .ui-widget-content .ui-state-default a,
  .ui-state-default a {
    color: #1c94c4; }

.ui-widget-header .ui-state-active,
.ui-widget-content .ui-state-active,
.ui-state-active {
  border-color: #fbd850;
  background: #ffffff;
  color: #eb8f00; }
  .ui-widget-header .ui-state-active a,
  .ui-widget-content .ui-state-active a,
  .ui-state-active a {
    color: #eb8f00; }

.ui-widget-header .ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-state-highlight {
  border-color: #fed22f;
  background: #ffe45c;
  color: #363636; }
  .ui-widget-header .ui-state-highlight a,
  .ui-widget-content .ui-state-highlight a,
  .ui-state-highlight a {
    color: #363636; }

.ui-widget-header .ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-state-focus {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-widget-header .ui-state-focus a,
  .ui-widget-content .ui-state-focus a,
  .ui-state-focus a {
    color: #c77405; }

.ui-widget-header .ui-state-error,
.ui-widget-content .ui-state-error,
.ui-state-error {
  border-color: #cd0a0a;
  background: #b81900;
  color: #ffffff; }
  .ui-widget-header .ui-state-error a,
  .ui-widget-content .ui-state-error a,
  .ui-state-error a {
    color: #ffffff; }

.ui-state-disabled,
.ui-widget:disabled {
  opacity: 0.35;
  filter: Alpha(Opacity=35);
  background-image: none;
  cursor: default !important; }
  .ui-state-disabled *,
  .ui-widget:disabled * {
    cursor: default !important; }

/* Forms */
.ui-inputtext {
  background: #ffffff;
  color: #333333; }

.ui-inputtext:enabled:hover {
  border-color: #fbcb09; }

.ui-inputtext.ui-state-focus,
.ui-inputtext:focus {
  outline: 0 none;
  border-color: #fbcb09;
  -moz-box-shadow: 0px 0px 5px #fbcb09;
  -webkit-box-shadow: 0px 0px 5px #fbcb09;
  box-shadow: 0px 0px 5px #fbcb09; }

.ui-autocomplete .ui-autocomplete-multiple-container:not(.ui-state-disabled):hover {
  border-color: #fbcb09; }
.ui-autocomplete .ui-autocomplete-multiple-container:not(.ui-state-disabled).ui-state-focus {
  border-color: #fbcb09; }

.ui-chips > ul:not(.ui-state-disabled):hover {
  border-color: #fbcb09; }
.ui-chips > ul:not(.ui-state-disabled).ui-state-focus {
  border-color: #fbcb09; }

.ui-button:focus,
.ui-button:enabled:hover {
  outline: 0 none;
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-button:focus a,
  .ui-button:enabled:hover a {
    color: #c77405; }

.ui-button:enabled:active {
  border-color: #fbd850;
  background: #ffffff;
  color: #eb8f00; }

.ui-chkbox-box:not(.ui-state-disabled):not(.ui-state-active):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-chkbox-box:not(.ui-state-disabled):not(.ui-state-active):hover a {
    color: #c77405; }

.ui-radiobutton-box:not(.ui-state-disabled):not(.ui-state-active):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-radiobutton-box:not(.ui-state-disabled):not(.ui-state-active):hover a {
    color: #c77405; }

.ui-dropdown:not(.ui-state-disabled):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-dropdown:not(.ui-state-disabled):hover a {
    color: #c77405; }

.ui-dropdown-panel .ui-dropdown-item:not(.ui-state-highlight):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-dropdown-panel .ui-dropdown-item:not(.ui-state-highlight):hover a {
    color: #c77405; }

.ui-listbox .ui-listbox-header .ui-listbox-filter-container .fa {
  color: #333333; }
.ui-listbox .ui-listbox-item:not(.ui-state-highlight):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-listbox .ui-listbox-item:not(.ui-state-highlight):hover a {
    color: #c77405; }

.ui-multiselect:not(.ui-state-disabled):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-multiselect:not(.ui-state-disabled):hover a {
    color: #c77405; }

.ui-multiselect-panel .ui-multiselect-item:not(.ui-state-highlight):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-multiselect-panel .ui-multiselect-item:not(.ui-state-highlight):hover a {
    color: #c77405; }

.ui-multiselect-panel .ui-multiselect-close {
  color: #ffffff; }

.ui-multiselect-panel .ui-multiselect-filter-container .fa {
  color: #333333; }

.ui-spinner:not(.ui-state-disabled) .ui-spinner-button:enabled:hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-spinner:not(.ui-state-disabled) .ui-spinner-button:enabled:hover a {
    color: #c77405; }

.ui-spinner:not(.ui-state-disabled) .ui-spinner-button:enabled:active {
  border-color: #fbd850;
  background: #ffffff;
  color: #eb8f00; }

.ui-selectbutton .ui-button:not(.ui-state-disabled):not(.ui-state-active):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-selectbutton .ui-button:not(.ui-state-disabled):not(.ui-state-active):hover a {
    color: #c77405; }

.ui-togglebutton:not(.ui-state-disabled):not(.ui-state-active):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-togglebutton:not(.ui-state-disabled):not(.ui-state-active):hover a {
    color: #c77405; }

.ui-paginator a:not(.ui-state-disabled):not(.ui-state-active):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-paginator a:not(.ui-state-disabled):not(.ui-state-active):hover a {
    color: #c77405; }

.ui-datatable .ui-rowgroup-header a {
  color: #ffffff; }
.ui-datatable .ui-sortable-column:not(.ui-state-active):hover {
  background: #fdf5ce;
  color: #c77405; }
.ui-datatable .ui-row-toggler {
  color: #333333; }
.ui-datatable tbody.ui-datatable-hoverable-rows > tr.ui-widget-content:not(.ui-state-highlight):hover {
  cursor: pointer;
  background: #fdf5ce;
  color: #c77405; }

.ui-orderlist .ui-orderlist-item:not(.ui-state-highlight):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-orderlist .ui-orderlist-item:not(.ui-state-highlight):hover a {
    color: #c77405; }

.ui-picklist .ui-picklist-item:not(.ui-state-highlight):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-picklist .ui-picklist-item:not(.ui-state-highlight):hover a {
    color: #c77405; }

.ui-tree .ui-treenode-content.ui-treenode-selectable .ui-treenode-label:not(.ui-state-highlight):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-tree .ui-treenode-content.ui-treenode-selectable .ui-treenode-label:not(.ui-state-highlight):hover a {
    color: #c77405; }
.ui-tree.ui-tree-horizontal .ui-treenode-content.ui-treenode-selectable .ui-treenode-label:not(.ui-state-highlight):hover {
  background-color: inherit;
  color: inherit; }
.ui-tree.ui-tree-horizontal .ui-treenode-content.ui-treenode-selectable:not(.ui-state-highlight):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-tree.ui-tree-horizontal .ui-treenode-content.ui-treenode-selectable:not(.ui-state-highlight):hover a {
    color: #c77405; }

.ui-treetable .ui-treetable-row.ui-treetable-row-selectable:not(.ui-state-highlight):hover {
  background: #fdf5ce;
  color: #c77405; }

.ui-accordion .ui-accordion-header:not(.ui-state-active):not(.ui-state-disabled):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-accordion .ui-accordion-header:not(.ui-state-active):not(.ui-state-disabled):hover a {
    color: #c77405; }

.ui-fieldset.ui-fieldset-toggleable .ui-fieldset-legend:hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-fieldset.ui-fieldset-toggleable .ui-fieldset-legend:hover a {
    color: #c77405; }

.ui-panel .ui-panel-titlebar .ui-panel-titlebar-icon:hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-panel .ui-panel-titlebar .ui-panel-titlebar-icon:hover a {
    color: #c77405; }

.ui-tabview .ui-tabview-nav li:not(.ui-state-active):not(.ui-state-disabled):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-tabview .ui-tabview-nav li:not(.ui-state-active):not(.ui-state-disabled):hover a {
    color: #c77405; }

.ui-dialog .ui-dialog-titlebar-icon {
  color: #ffffff; }
  .ui-dialog .ui-dialog-titlebar-icon:hover {
    border-color: #fbcb09;
    background: #fdf5ce;
    color: #c77405; }
    .ui-dialog .ui-dialog-titlebar-icon:hover a {
      color: #c77405; }

.ui-overlaypanel .ui-overlaypanel-close:hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-overlaypanel .ui-overlaypanel-close:hover a {
    color: #c77405; }

.ui-inplace .ui-inplace-display:hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-inplace .ui-inplace-display:hover a {
    color: #c77405; }

.ui-breadcrumb a {
  color: #ffffff; }

.ui-menu .ui-menuitem .ui-menuitem-link {
  color: #333333; }
  .ui-menu .ui-menuitem .ui-menuitem-link:hover {
    border-color: #fbcb09;
    background: #fdf5ce;
    color: #c77405;
    border-color: transparent; }
    .ui-menu .ui-menuitem .ui-menuitem-link:hover a {
      color: #c77405; }
.ui-menu .ui-menuitem.ui-menuitem-active > .ui-menuitem-link {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405;
  border-color: transparent; }
  .ui-menu .ui-menuitem.ui-menuitem-active > .ui-menuitem-link a {
    color: #c77405; }

.ui-tabmenu .ui-tabmenu-nav li:not(.ui-state-active):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-tabmenu .ui-tabmenu-nav li:not(.ui-state-active):hover a {
    color: #c77405; }

.ui-steps .ui-steps-item:not(.ui-state-highlight):not(.ui-state-disabled):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-steps .ui-steps-item:not(.ui-state-highlight):not(.ui-state-disabled):hover a {
    color: #c77405; }

.ui-panelmenu .ui-panelmenu-header:not(.ui-state-active):hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-panelmenu .ui-panelmenu-header:not(.ui-state-active):hover a {
    color: #c77405; }
  .ui-panelmenu .ui-panelmenu-header:not(.ui-state-active):hover a {
    color: #c77405; }
.ui-panelmenu .ui-panelmenu-header.ui-state-active a {
  color: #eb8f00; }
.ui-panelmenu .ui-panelmenu-content .ui-menuitem-link {
  color: #333333; }
  .ui-panelmenu .ui-panelmenu-content .ui-menuitem-link:hover {
    border-color: #fbcb09;
    background: #fdf5ce;
    color: #c77405;
    border-color: transparent; }
    .ui-panelmenu .ui-panelmenu-content .ui-menuitem-link:hover a {
      color: #c77405; }

.ui-datepicker .ui-datepicker-header a {
  color: #ffffff; }
  .ui-datepicker .ui-datepicker-header a:hover {
    border-color: #fbcb09;
    background: #fdf5ce;
    color: #c77405; }
    .ui-datepicker .ui-datepicker-header a:hover a {
      color: #c77405; }
.ui-datepicker .ui-datepicker-calendar td:not(.ui-state-disabled) a:hover {
  border-color: #fbcb09;
  background: #fdf5ce;
  color: #c77405; }
  .ui-datepicker .ui-datepicker-calendar td:not(.ui-state-disabled) a:hover a {
    color: #c77405; }

.fc .fc-toolbar .fc-prev-button .ui-icon-circle-triangle-w {
  margin-top: .3em;
  background: none !important;
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-indent: 0px !important;
  text-align: center; }
  .fc .fc-toolbar .fc-prev-button .ui-icon-circle-triangle-w:before {
    content: ""; }
.fc .fc-toolbar .fc-next-button .ui-icon-circle-triangle-e {
  margin-top: .3em;
  background: none !important;
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-indent: 0px !important;
  text-align: center; }
  .fc .fc-toolbar .fc-next-button .ui-icon-circle-triangle-e:before {
    content: ""; }

.ui-rating a {
  color: #333333; }

/* Validation */
.ui-inputtext.ng-dirty.ng-invalid,
p-dropdown.ng-dirty.ng-invalid > .ui-dropdown,
p-autocomplete.ng-dirty.ng-invalid > .ui-autocomplete > .ui-inputtext,
p-calendar.ng-dirty.ng-invalid > .ui-inputtext,
p-chips.ng-dirty.ng-invalid > .ui-inputtext,
p-inputmask.ng-dirty.ng-invalid > .ui-inputtext,
p-checkbox.ng-dirty.ng-invalid .ui-chkbox-box,
p-radiobutton.ng-dirty.ng-invalid .ui-radiobutton-box,
p-inputswitch.ng-dirty.ng-invalid .ui-inputswitch,
p-listbox.ng-dirty.ng-invalid .ui-inputtext,
p-multiselect.ng-dirty.ng-invalid > .ui-multiselect,
p-spinner.ng-dirty.ng-invalid > .ui-inputtext,
p-selectbutton.ng-dirty.ng-invalid .ui-button,
p-togglebutton.ng-dirty.ng-invalid .ui-button {
  border-bottom-color: #cd0a0a; }

/* Cornering */
.ui-corner-tl {
  -moz-border-radius-topleft: 4px;
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px; }

.ui-corner-tr {
  -moz-border-radius-topright: 4px;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px; }

.ui-corner-bl {
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px; }

.ui-corner-br {
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px; }

.ui-corner-top {
  -moz-border-radius-topleft: 4px;
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -moz-border-radius-topright: 4px;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px; }

.ui-corner-bottom {
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px; }

.ui-corner-right {
  -moz-border-radius-topright: 4px;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px; }

.ui-corner-left {
  -moz-border-radius-topleft: 4px;
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px; }

.ui-corner-all {
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px; }