.uk-offcanvas-bar.uk-light {
  background-color: #f8fafc!important;
  color: #000!important;
}

/* .uk-offcanvas-bar.light * {
  color: #000!important;
} */

.uk-light h1,
.uk-light .uk-h1,
.uk-light h2,
.uk-light .uk-h2,
.uk-light h3,
.uk-light .uk-h3,
.uk-light h4,
.uk-light .uk-h4,
.uk-light h5,
.uk-light .uk-h5,
.uk-light h6,
.uk-light .uk-h6,
.uk-light .uk-heading-small,
.uk-light .uk-heading-medium,
.uk-light .uk-heading-large,
.uk-light .uk-heading-xlarge,
.uk-light .uk-heading-2xlarge,
.uk-light .uk-heading-3xlarge,
.uk-section-primary:not(.uk-preserve-color) h1,
.uk-section-primary:not(.uk-preserve-color) .uk-h1,
.uk-section-primary:not(.uk-preserve-color) h2,
.uk-section-primary:not(.uk-preserve-color) .uk-h2,
.uk-section-primary:not(.uk-preserve-color) h3,
.uk-section-primary:not(.uk-preserve-color) .uk-h3,
.uk-section-primary:not(.uk-preserve-color) h4,
.uk-section-primary:not(.uk-preserve-color) .uk-h4,
.uk-section-primary:not(.uk-preserve-color) h5,
.uk-section-primary:not(.uk-preserve-color) .uk-h5,
.uk-section-primary:not(.uk-preserve-color) h6,
.uk-section-primary:not(.uk-preserve-color) .uk-h6,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-small,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-medium,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-large,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-xlarge,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-2xlarge,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-3xlarge,
.uk-section-secondary:not(.uk-preserve-color) h1,
.uk-section-secondary:not(.uk-preserve-color) .uk-h1,
.uk-section-secondary:not(.uk-preserve-color) h2,
.uk-section-secondary:not(.uk-preserve-color) .uk-h2,
.uk-section-secondary:not(.uk-preserve-color) h3,
.uk-section-secondary:not(.uk-preserve-color) .uk-h3,
.uk-section-secondary:not(.uk-preserve-color) h4,
.uk-section-secondary:not(.uk-preserve-color) .uk-h4,
.uk-section-secondary:not(.uk-preserve-color) h5,
.uk-section-secondary:not(.uk-preserve-color) .uk-h5,
.uk-section-secondary:not(.uk-preserve-color) h6,
.uk-section-secondary:not(.uk-preserve-color) .uk-h6,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-small,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-medium,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-large,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-xlarge,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-2xlarge,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-3xlarge,
.uk-tile-primary:not(.uk-preserve-color) h1,
.uk-tile-primary:not(.uk-preserve-color) .uk-h1,
.uk-tile-primary:not(.uk-preserve-color) h2,
.uk-tile-primary:not(.uk-preserve-color) .uk-h2,
.uk-tile-primary:not(.uk-preserve-color) h3,
.uk-tile-primary:not(.uk-preserve-color) .uk-h3,
.uk-tile-primary:not(.uk-preserve-color) h4,
.uk-tile-primary:not(.uk-preserve-color) .uk-h4,
.uk-tile-primary:not(.uk-preserve-color) h5,
.uk-tile-primary:not(.uk-preserve-color) .uk-h5,
.uk-tile-primary:not(.uk-preserve-color) h6,
.uk-tile-primary:not(.uk-preserve-color) .uk-h6,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-small,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-medium,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-large,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-xlarge,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-2xlarge,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-3xlarge,
.uk-tile-secondary:not(.uk-preserve-color) h1,
.uk-tile-secondary:not(.uk-preserve-color) .uk-h1,
.uk-tile-secondary:not(.uk-preserve-color) h2,
.uk-tile-secondary:not(.uk-preserve-color) .uk-h2,
.uk-tile-secondary:not(.uk-preserve-color) h3,
.uk-tile-secondary:not(.uk-preserve-color) .uk-h3,
.uk-tile-secondary:not(.uk-preserve-color) h4,
.uk-tile-secondary:not(.uk-preserve-color) .uk-h4,
.uk-tile-secondary:not(.uk-preserve-color) h5,
.uk-tile-secondary:not(.uk-preserve-color) .uk-h5,
.uk-tile-secondary:not(.uk-preserve-color) h6,
.uk-tile-secondary:not(.uk-preserve-color) .uk-h6,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-small,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-medium,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-large,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-xlarge,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-2xlarge,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-3xlarge,
.uk-card-primary.uk-card-body h1,
.uk-card-primary.uk-card-body .uk-h1,
.uk-card-primary.uk-card-body h2,
.uk-card-primary.uk-card-body .uk-h2,
.uk-card-primary.uk-card-body h3,
.uk-card-primary.uk-card-body .uk-h3,
.uk-card-primary.uk-card-body h4,
.uk-card-primary.uk-card-body .uk-h4,
.uk-card-primary.uk-card-body h5,
.uk-card-primary.uk-card-body .uk-h5,
.uk-card-primary.uk-card-body h6,
.uk-card-primary.uk-card-body .uk-h6,
.uk-card-primary.uk-card-body .uk-heading-small,
.uk-card-primary.uk-card-body .uk-heading-medium,
.uk-card-primary.uk-card-body .uk-heading-large,
.uk-card-primary.uk-card-body .uk-heading-xlarge,
.uk-card-primary.uk-card-body .uk-heading-2xlarge,
.uk-card-primary.uk-card-body .uk-heading-3xlarge,
.uk-card-primary > :not([class*="uk-card-media"]) h1,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-h1,
.uk-card-primary > :not([class*="uk-card-media"]) h2,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-h2,
.uk-card-primary > :not([class*="uk-card-media"]) h3,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-h3,
.uk-card-primary > :not([class*="uk-card-media"]) h4,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-h4,
.uk-card-primary > :not([class*="uk-card-media"]) h5,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-h5,
.uk-card-primary > :not([class*="uk-card-media"]) h6,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-h6,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-heading-small,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-heading-medium,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-heading-large,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-heading-xlarge,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-heading-2xlarge,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-heading-3xlarge,
.uk-card-secondary.uk-card-body h1,
.uk-card-secondary.uk-card-body .uk-h1,
.uk-card-secondary.uk-card-body h2,
.uk-card-secondary.uk-card-body .uk-h2,
.uk-card-secondary.uk-card-body h3,
.uk-card-secondary.uk-card-body .uk-h3,
.uk-card-secondary.uk-card-body h4,
.uk-card-secondary.uk-card-body .uk-h4,
.uk-card-secondary.uk-card-body h5,
.uk-card-secondary.uk-card-body .uk-h5,
.uk-card-secondary.uk-card-body h6,
.uk-card-secondary.uk-card-body .uk-h6,
.uk-card-secondary.uk-card-body .uk-heading-small,
.uk-card-secondary.uk-card-body .uk-heading-medium,
.uk-card-secondary.uk-card-body .uk-heading-large,
.uk-card-secondary.uk-card-body .uk-heading-xlarge,
.uk-card-secondary.uk-card-body .uk-heading-2xlarge,
.uk-card-secondary.uk-card-body .uk-heading-3xlarge,
.uk-card-secondary > :not([class*="uk-card-media"]) h1,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-h1,
.uk-card-secondary > :not([class*="uk-card-media"]) h2,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-h2,
.uk-card-secondary > :not([class*="uk-card-media"]) h3,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-h3,
.uk-card-secondary > :not([class*="uk-card-media"]) h4,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-h4,
.uk-card-secondary > :not([class*="uk-card-media"]) h5,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-h5,
.uk-card-secondary > :not([class*="uk-card-media"]) h6,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-h6,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-heading-small,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-heading-medium,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-heading-large,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-heading-xlarge,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-heading-2xlarge,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-heading-3xlarge,
.uk-overlay-primary h1,
.uk-overlay-primary .uk-h1,
.uk-overlay-primary h2,
.uk-overlay-primary .uk-h2,
.uk-overlay-primary h3,
.uk-overlay-primary .uk-h3,
.uk-overlay-primary h4,
.uk-overlay-primary .uk-h4,
.uk-overlay-primary h5,
.uk-overlay-primary .uk-h5,
.uk-overlay-primary h6,
.uk-overlay-primary .uk-h6,
.uk-overlay-primary .uk-heading-small,
.uk-overlay-primary .uk-heading-medium,
.uk-overlay-primary .uk-heading-large,
.uk-overlay-primary .uk-heading-xlarge,
.uk-overlay-primary .uk-heading-2xlarge,
.uk-overlay-primary .uk-heading-3xlarge,
.uk-offcanvas-bar h1,
.uk-offcanvas-bar .uk-h1,
.uk-offcanvas-bar h2,
.uk-offcanvas-bar .uk-h2,
.uk-offcanvas-bar h3,
.uk-offcanvas-bar .uk-h3,
.uk-offcanvas-bar h4,
.uk-offcanvas-bar .uk-h4,
.uk-offcanvas-bar h5,
.uk-offcanvas-bar .uk-h5,
.uk-offcanvas-bar h6,
.uk-offcanvas-bar .uk-h6,
.uk-offcanvas-bar .uk-heading-small,
.uk-offcanvas-bar .uk-heading-medium,
.uk-offcanvas-bar .uk-heading-large,
.uk-offcanvas-bar .uk-heading-xlarge,
.uk-offcanvas-bar .uk-heading-2xlarge,
.uk-offcanvas-bar .uk-heading-3xlarge {
  color: inherit;
}

.uk-light .uk-close,
.uk-section-primary:not(.uk-preserve-color) .uk-close,
.uk-section-secondary:not(.uk-preserve-color) .uk-close,
.uk-tile-primary:not(.uk-preserve-color) .uk-close,
.uk-tile-secondary:not(.uk-preserve-color) .uk-close,
.uk-card-primary.uk-card-body .uk-close,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-close,
.uk-card-secondary.uk-card-body .uk-close,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-close,
.uk-overlay-primary .uk-close,
.uk-offcanvas-bar .uk-close{
  color: rgba(0, 0, 0, 0.5)
}

.uk-light .uk-input,
.uk-light .uk-select,
.uk-light .uk-textarea,
.uk-section-primary:not(.uk-preserve-color) .uk-input,
.uk-section-primary:not(.uk-preserve-color) .uk-select,
.uk-section-primary:not(.uk-preserve-color) .uk-textarea,
.uk-section-secondary:not(.uk-preserve-color) .uk-input,
.uk-section-secondary:not(.uk-preserve-color) .uk-select,
.uk-section-secondary:not(.uk-preserve-color) .uk-textarea,
.uk-tile-primary:not(.uk-preserve-color) .uk-input,
.uk-tile-primary:not(.uk-preserve-color) .uk-select,
.uk-tile-primary:not(.uk-preserve-color) .uk-textarea,
.uk-tile-secondary:not(.uk-preserve-color) .uk-input,
.uk-tile-secondary:not(.uk-preserve-color) .uk-select,
.uk-tile-secondary:not(.uk-preserve-color) .uk-textarea,
.uk-card-primary.uk-card-body .uk-input,
.uk-card-primary.uk-card-body .uk-select,
.uk-card-primary.uk-card-body .uk-textarea,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-input,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-select,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-textarea,
.uk-card-secondary.uk-card-body .uk-input,
.uk-card-secondary.uk-card-body .uk-select,
.uk-card-secondary.uk-card-body .uk-textarea,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-input,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-select,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-textarea,
.uk-overlay-primary .uk-input,
.uk-overlay-primary .uk-select,
.uk-overlay-primary .uk-textarea,
.uk-offcanvas-bar .uk-input,
.uk-offcanvas-bar .uk-select,
.uk-offcanvas-bar .uk-textarea{
  background-color: #fff!important;
  color: rgba(0, 0, 0, 0.7)!important;
  border-color: rgba(0, 0, 0, 0.1)!important;
}

.uk-light .uk-button-secondary,
.uk-section-primary:not(.uk-preserve-color) .uk-button-secondary,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-secondary,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-secondary,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-secondary,
.uk-card-primary.uk-card-body .uk-button-secondary,
.uk-card-primary > :not([class*="uk-card-media"]) .uk-button-secondary,
.uk-card-secondary.uk-card-body .uk-button-secondary,
.uk-card-secondary > :not([class*="uk-card-media"]) .uk-button-secondary,
.uk-overlay-primary .uk-button-secondary,
.uk-offcanvas-bar .uk-button-secondary {
  background-color: #222!important;
  color: #fff!important;
}

.uk-light .uk-form-label,
.uk-section-primary:not(.uk-preserve-color) .uk-form-label,
.uk-section-secondary:not(.uk-preserve-color) .uk-form-label,
.uk-tile-primary:not(.uk-preserve-color) .uk-form-label,
.uk-tile-secondary:not(.uk-preserve-color) .uk-form-label,
.uk-card-primary.uk-card-body .uk-form-label,
.uk-card-primary> :not([class*="uk-card-media"]) .uk-form-label,
.uk-card-secondary.uk-card-body .uk-form-label,
.uk-card-secondary> :not([class*="uk-card-media"]) .uk-form-label,
.uk-overlay-primary .uk-form-label,
.uk-offcanvas-bar .uk-form-label {
  color: #333!important;
}

.uk-offcanvas-bar.uk-light .uk-checkbox,
.uk-offcanvas-bar.uk-light .uk-radio {
  background-color: transparent!important;
  background-repeat: no-repeat!important;
  border: 1px solid #ccc!important;
  transition: .2s ease-in-out!important;
  transition-property: background-color, border!important;
}

.uk-offcanvas-bar.uk-light .uk-checkbox:checked, 
.uk-offcanvas-bar.uk-light .uk-checkbox:indeterminate, 
.uk-offcanvas-bar.uk-light .uk-radio:checked {
  background-color: #1e87f0!important;
  border-color: transparent!important;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2211%22%20viewBox%3D%220%200%2014%2011%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23fff%22%20points%3D%2212%201%205%207.5%202%205%201%205.5%205%2010%2013%201.5%22%20%2F%3E%0A%3C%2Fsvg%3E%0A")!important;
}


.uk-light .uk-close,
.uk-light .uk-section-primary:not(.uk-preserve-color) .uk-close,
.uk-light .uk-section-secondary:not(.uk-preserve-color) .uk-close,
.uk-light .uk-tile-primary:not(.uk-preserve-color) .uk-close,
.uk-light .uk-tile-secondary:not(.uk-preserve-color) .uk-close,
.uk-light .uk-card-primary.uk-card-body .uk-close,
.uk-light .uk-card-primary> :not([class*="uk-card-media"]) .uk-close,
.uk-light .uk-card-secondary.uk-card-body .uk-close,
.uk-light .uk-card-secondary> :not([class*="uk-card-media"]) .uk-close,
.uk-light .uk-overlay-primary .uk-close,
.uk-light .uk-offcanvas-bar .uk-close {
  color: rgba(0, 0, 0, 0.5) !important;
}


.uk-light .uk-button-default,
.uk-light .uk-section-primary:not(.uk-preserve-color) .uk-button-default,
.uk-light .uk-section-secondary:not(.uk-preserve-color) .uk-button-default,
.uk-light .uk-tile-primary:not(.uk-preserve-color) .uk-button-default,
.uk-light .uk-tile-secondary:not(.uk-preserve-color) .uk-button-default,
.uk-light .uk-card-primary.uk-card-body .uk-button-default,
.uk-light .uk-card-primary> :not([class*="uk-card-media"]) .uk-button-default,
.uk-light .uk-card-secondary.uk-card-body .uk-button-default,
.uk-light .uk-card-secondary> :not([class*="uk-card-media"]) .uk-button-default,
.uk-light .uk-overlay-primary .uk-button-default,
.uk-light .uk-offcanvas-bar .uk-button-default {
  background-color: transparent!important;
  color: #333 !important;
  border: 1px solid #e5e5e5!important;
}


.uk-light .uk-button-default:hover,
.uk-light .uk-section-primary:not(.uk-preserve-color) .uk-button-default:hover,
.uk-light .uk-section-secondary:not(.uk-preserve-color) .uk-button-default:hover,
.uk-light .uk-tile-primary:not(.uk-preserve-color) .uk-button-default:hover,
.uk-light .uk-tile-secondary:not(.uk-preserve-color) .uk-button-default:hover,
.uk-light .uk-card-primary.uk-card-body .uk-button-default:hover,
.uk-light .uk-card-primary> :not([class*="uk-card-media"]) .uk-button-default:hover,
.uk-light .uk-card-secondary.uk-card-body .uk-button-default:hover,
.uk-light .uk-card-secondary> :not([class*="uk-card-media"]) .uk-button-default:hover,
.uk-light .uk-overlay-primary .uk-button-default:hover,
.uk-light .uk-offcanvas-bar .uk-button-default:hover {
  background-color: transparent!important;
  color: #333!important;
  border-color: #b2b2b2!important;
}


.uk-light hr,
.uk-light .uk-hr,
.uk-light .uk-section-primary:not(.uk-preserve-color) hr,
.uk-light .uk-section-primary:not(.uk-preserve-color) .uk-hr,
.uk-light .uk-section-secondary:not(.uk-preserve-color) hr,
.uk-light .uk-section-secondary:not(.uk-preserve-color) .uk-hr,
.uk-light .uk-tile-primary:not(.uk-preserve-color) hr,
.uk-light .uk-tile-primary:not(.uk-preserve-color) .uk-hr,
.uk-light .uk-tile-secondary:not(.uk-preserve-color) hr,
.uk-light .uk-tile-secondary:not(.uk-preserve-color) .uk-hr,
.uk-light .uk-card-primary.uk-card-body hr,
.uk-light .uk-card-primary.uk-card-body .uk-hr,
.uk-light .uk-card-primary> :not([class*="uk-card-media"]) hr,
.uk-light .uk-card-primary> :not([class*="uk-card-media"]) .uk-hr,
.uk-light .uk-card-secondary.uk-card-body hr,
.uk-light .uk-card-secondary.uk-card-body .uk-hr,
.uk-light .uk-card-secondary> :not([class*="uk-card-media"]) hr,
.uk-light .uk-card-secondary> :not([class*="uk-card-media"]) .uk-hr,
.uk-light .uk-overlay-primary hr,
.uk-light .uk-overlay-primary .uk-hr,
.uk-light .uk-offcanvas-bar hr,
.uk-light .uk-offcanvas-bar .uk-hr {
  border-top: 1px solid #e5e5e5!important;
}

.uk-light a,
.uk-light .uk-link,
.uk-light .uk-section-primary:not(.uk-preserve-color) a,
.uk-light .uk-section-primary:not(.uk-preserve-color) .uk-link,
.uk-light .uk-section-secondary:not(.uk-preserve-color) a,
.uk-light .uk-section-secondary:not(.uk-preserve-color) .uk-link,
.uk-light .uk-tile-primary:not(.uk-preserve-color) a,
.uk-light .uk-tile-primary:not(.uk-preserve-color) .uk-link,
.uk-light .uk-tile-secondary:not(.uk-preserve-color) a,
.uk-light .uk-tile-secondary:not(.uk-preserve-color) .uk-link,
.uk-light .uk-card-primary.uk-card-body a,
.uk-light .uk-card-primary.uk-card-body .uk-link,
.uk-light .uk-card-primary> :not([class*="uk-card-media"]) a,
.uk-light .uk-card-primary> :not([class*="uk-card-media"]) .uk-link,
.uk-light .uk-card-secondary.uk-card-body a,
.uk-light .uk-card-secondary.uk-card-body .uk-link,
.uk-light .uk-card-secondary> :not([class*="uk-card-media"]) a,
.uk-light .uk-card-secondary> :not([class*="uk-card-media"]) .uk-link,
.uk-light .uk-overlay-primary a,
.uk-light .uk-overlay-primary .uk-link,
.uk-light .uk-offcanvas-bar a,
.uk-light .uk-offcanvas-bar .uk-link {
  color: inherit;
}

.uk-offcanvas-bar.uk-light .uk-input::placeholder {
  color: #cccccc !important;
  opacity: 1 !important;
  font-weight: 300 !important;
}