/* Functional styling;
 * These styles are required for noUiSlider to function.
 * You don't need to change these rules to apply your design.
 */
.noUi-target,
.noUi-target * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -ms-touch-action: none;
  touch-action: none;
  -ms-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.noUi-target {
  position: relative;
  direction: ltr; }

.noUi-base {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
  /* Fix 401 */ }

.noUi-origin {
  position: absolute;
  right: 0;
  top: 0;
  left: 0;
  bottom: 0; }

.noUi-handle {
  position: relative;
  z-index: 1; }

.noUi-stacking .noUi-handle {
  /* This class is applied to the lower origin when
   its values is > 50%. */
  z-index: 10; }

.noUi-state-tap .noUi-origin {
  -webkit-transition: left 0.3s, top 0.3s;
  transition: left 0.3s, top 0.3s; }

.noUi-state-drag * {
  cursor: inherit !important; }

/* Painting and performance;
 * Browsers can paint handles in their own layer.
 */
.noUi-base,
.noUi-handle {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

/* Slider size and handle placement;
 */
.noUi-horizontal {
  height: 18px; }

.noUi-horizontal .noUi-handle {
  width: 34px;
  height: 28px;
  left: -17px;
  top: -6px; }

.noUi-vertical {
  width: 18px; }

.noUi-vertical .noUi-handle {
  width: 28px;
  height: 34px;
  left: -6px;
  top: -17px; }

/* Styling;
 */
.noUi-background {
  background: #FAFAFA;
  box-shadow: inset 0 1px 1px #f0f0f0; }

.noUi-connect {
  background: #3FB8AF;
  box-shadow: inset 0 0 3px rgba(51, 51, 51, 0.45);
  -webkit-transition: background 450ms;
  transition: background 450ms; }

.noUi-origin {
  border-radius: 2px; }

.noUi-target {
  border-radius: 4px;
  border: 1px solid #D3D3D3;
  box-shadow: inset 0 1px 1px #F0F0F0, 0 3px 6px -5px #BBB; }

.noUi-target.noUi-connect {
  box-shadow: inset 0 0 3px rgba(51, 51, 51, 0.45), 0 3px 6px -5px #BBB; }

/* Handles and cursors;
 */
.noUi-draggable {
  cursor: w-resize; }

.noUi-vertical .noUi-draggable {
  cursor: n-resize; }

.noUi-handle {
  border: 1px solid #D9D9D9;
  border-radius: 3px;
  background: #FFF;
  cursor: default;
  box-shadow: inset 0 0 1px #FFF,
 inset 0 1px 7px #EBEBEB,
 0 3px 6px -3px #BBB; }

.noUi-active {
  box-shadow: inset 0 0 1px #FFF,
 inset 0 1px 7px #DDD,
 0 3px 6px -3px #BBB; }

/* Handle stripes;
 */
.noUi-handle:before,
.noUi-handle:after {
  content: "";
  display: block;
  position: absolute;
  height: 14px;
  width: 1px;
  background: #E8E7E6;
  left: 14px;
  top: 6px; }

.noUi-handle:after {
  left: 17px; }

.noUi-vertical .noUi-handle:before,
.noUi-vertical .noUi-handle:after {
  width: 14px;
  height: 1px;
  left: 6px;
  top: 14px; }

.noUi-vertical .noUi-handle:after {
  top: 17px; }

/* Disabled state;
 */
[disabled].noUi-connect,
[disabled] .noUi-connect {
  background: #B8B8B8; }

[disabled].noUi-origin,
[disabled] .noUi-handle {
  cursor: not-allowed; }

/* Base;
 *
 */
.noUi-pips,
.noUi-pips * {
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.noUi-pips {
  position: absolute;
  color: #999; }

/* Values;
 *
 */
.noUi-value {
  width: 40px;
  position: absolute;
  text-align: center; }

.noUi-value-sub {
  color: #ccc;
  font-size: 10px; }

/* Markings;
 *
 */
.noUi-marker {
  position: absolute;
  background: #CCC; }

.noUi-marker-sub {
  background: #AAA; }

.noUi-marker-large {
  background: #AAA; }

/* Horizontal layout;
 *
 */
.noUi-pips-horizontal {
  padding: 10px 0;
  height: 50px;
  top: 100%;
  left: 0;
  width: 100%; }

.noUi-value-horizontal {
  margin-left: -20px;
  padding-top: 20px; }

.noUi-value-horizontal.noUi-value-sub {
  padding-top: 15px; }

.noUi-marker-horizontal.noUi-marker {
  margin-left: -1px;
  width: 2px;
  height: 5px; }

.noUi-marker-horizontal.noUi-marker-sub {
  height: 10px; }

.noUi-marker-horizontal.noUi-marker-large {
  height: 15px; }

/* Vertical layout;
 *
 */
.noUi-pips-vertical {
  padding: 0 10px;
  height: 100%;
  top: 0;
  left: 100%; }

.noUi-value-vertical {
  width: 15px;
  margin-left: 20px;
  margin-top: -5px; }

.noUi-marker-vertical.noUi-marker {
  width: 5px;
  height: 2px;
  margin-top: -1px; }

.noUi-marker-vertical.noUi-marker-sub {
  width: 10px; }

.noUi-marker-vertical.noUi-marker-large {
  width: 15px; }

.fuel-ui-accordion {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px; }
  .fuel-ui-accordion .fuel-ui-accordion-heading {
    background-color: #f5f5f5;
    border-bottom: 1px solid #ddd;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    color: #333;
    padding: 10px 15px; }
    .fuel-ui-accordion .fuel-ui-accordion-heading.text-muted {
      color: #818a91 !important; }
  .fuel-ui-accordion .fuel-ui-accordion-body {
    padding: 15px; }

.fuel-ui-alert-fade-in {
  -webkit-animation-name: fadeIn;
  -moz-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease;
  -moz-animation-timing-function: ease;
  animation-timing-function: ease; }

.carousel-inner > .carousel-item {
  width: 100%; }
  .carousel-inner > .carousel-item.slide-in-left {
    display: block;
    position: absolute;
    top: 0;
    left: -100%;
    -webkit-animation-name: slideInLeft;
    -moz-animation-name: slideInLeft;
    animation-name: slideInLeft;
    -webkit-animation-duration: 0.5s;
    -moz-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-timing-function: ease;
    -moz-animation-timing-function: ease;
    animation-timing-function: ease; }
  .carousel-inner > .carousel-item.slide-in-right {
    display: block;
    position: absolute;
    top: 0;
    left: 100%;
    -webkit-animation-name: slideInRight;
    -moz-animation-name: slideInRight;
    animation-name: slideInRight;
    -webkit-animation-duration: 0.5s;
    -moz-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-timing-function: ease;
    -moz-animation-timing-function: ease;
    animation-timing-function: ease; }
  .carousel-inner > .carousel-item.slide-out-left {
    -webkit-animation-name: slideOutLeft;
    -moz-animation-name: slideOutLeft;
    animation-name: slideOutLeft;
    -webkit-animation-duration: 0.5s;
    -moz-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-timing-function: ease;
    -moz-animation-timing-function: ease;
    animation-timing-function: ease; }
  .carousel-inner > .carousel-item.slide-out-right {
    -webkit-animation-name: slideOutRight;
    -moz-animation-name: slideOutRight;
    animation-name: slideOutRight;
    -webkit-animation-duration: 0.5s;
    -moz-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-timing-function: ease;
    -moz-animation-timing-function: ease;
    animation-timing-function: ease; }

.date-picker-overlay {
  background-color: transparent;
  display: block;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 100; }
  @media (max-width: 480px), screen and (max-device-width: 480px) {
    .date-picker-overlay {
      background-color: #55595c;
      opacity: .75; } }

.fuel-ui-datepicker-input-group input:read-only, .fuel-ui-datepicker-input-group .form-control[readonly] {
  background-color: #fff; }

.fuel-ui-datepicker-input-group .input-group-addon {
  background-color: #fff; }

.date-picker-component {
  border: 1px solid #eceeef;
  z-index: 120;
  background-color: #fff;
  font-size: .75rem;
  position: absolute;
  width: 350px;
  height: auto;
  top: 0;
  left: 0;
  overflow: hidden;
  border-radius: 0.3rem;
  -webkit-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  transition: all 0.1s ease; }
  @media (max-width: 480px), screen and (max-device-width: 480px) {
    .date-picker-component {
      width: 90%;
      height: 90%;
      position: fixed;
      top: 5%;
      left: 5%; } }
  .date-picker-component .input-group {
    z-index: 110; }
  .date-picker-component .container {
    height: 100%; }
    @media (max-width: 480px), screen and (max-device-width: 480px) {
      .date-picker-component .container .calendar-container {
        height: 91%; } }
    .date-picker-component .container header {
      position: relative;
      top: 0;
      left: 0;
      vertical-align: middle;
      background-color: #fff; }
      .date-picker-component .container header .days-of-week {
        background-color: #0275d8;
        color: #fff; }
      .date-picker-component .container header table {
        border-top: none !important; }
        .date-picker-component .container header table th, .date-picker-component .container header table td {
          text-align: center; }
      .date-picker-component .container header button {
        border: none;
        border-radius: 0;
        color: #0275d8;
        background-color: #fff;
        width: 15%; }
        .date-picker-component .container header button:active {
          background-color: #eceeef; }
        .date-picker-component .container header button.button-disable {
          color: #eceeef;
          cursor: default; }
      .date-picker-component .container header .date-range {
        width: 70%; }
        .date-picker-component .container header .date-range span {
          background-color: #eceeef;
          border-left: none;
          border-right: none; }
      .date-picker-component .container header .input-group-addon {
        border: none;
        background-color: #fff !important; }
      .date-picker-component .container header input {
        border: none;
        display: inline-block;
        margin: 1px auto 0 auto;
        cursor: pointer; }
      .date-picker-component .container header input:read-only, .date-picker-component .container header .form-control[readonly] {
        background-color: #fff; }
      .date-picker-component .container header input.target {
        color: #0275d8; }
        .date-picker-component .container header input.target::-webkit-input-placeholder {
          color: #0275d8; }
        .date-picker-component .container header input.target::-moz-placeholder {
          color: #0275d8; }
        .date-picker-component .container header input.target:-moz-placeholder {
          color: #0275d8; }
        .date-picker-component .container header input.target:-ms-input-placeholder {
          color: #0275d8; }

.fuel-ui-datepicker-calendar .table {
  font-size: .75rem;
  border: none;
  border-top: 1px solid #eceeef;
  background-color: #fff;
  border-collapse: collapse; }
  .fuel-ui-datepicker-calendar .table .calendar-date {
    z-index: 200;
    background-color: transparent; }
  .fuel-ui-datepicker-calendar .table tr {
    border: none; }
  .fuel-ui-datepicker-calendar .table th, .fuel-ui-datepicker-calendar .table td {
    text-align: center;
    vertical-align: middle;
    font-size: .75rem;
    padding: .1rem;
    height: 1.75rem;
    border: none;
    position: relative; }
    @media (max-width: 480px), screen and (max-device-width: 480px) {
      .fuel-ui-datepicker-calendar .table th, .fuel-ui-datepicker-calendar .table td {
        padding: .5rem;
        font-size: 1rem; } }
  .fuel-ui-datepicker-calendar .table td.selectable {
    cursor: pointer !important; }
    .fuel-ui-datepicker-calendar .table td.selectable:hover {
      background-color: #0275d8;
      color: #fff; }
  .fuel-ui-datepicker-calendar .table td.selected {
    background-color: #99c4e9;
    color: #fff; }
  .fuel-ui-datepicker-calendar .table td.disabled {
    color: #c9c9c9; }
  .fuel-ui-datepicker-calendar .table td.startDate, .fuel-ui-datepicker-calendar .table td.endDate {
    background-color: #0275d8;
    color: #fff; }
  .fuel-ui-datepicker-calendar .table td.startDate:after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 0;
    right: 0;
    background-color: transparent;
    border-left: 1em solid transparent;
    border-top: 1.1em solid #99c4e9;
    border-bottom: 1.1em solid #99c4e9; }
  .fuel-ui-datepicker-calendar .table td.endDate:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 0;
    left: 0;
    background-color: transparent;
    border-right: 1em solid transparent;
    border-top: 1.1em solid #99c4e9;
    border-bottom: 1.1em solid #99c4e9; }

.fuel-ui-modal-fade-in {
  -webkit-animation-name: fadeInDown;
  -moz-animation-name: fadeInDown;
  animation-name: fadeInDown;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease;
  -moz-animation-timing-function: ease;
  animation-timing-function: ease; }

.fuel-ui-pagination a {
  cursor: pointer; }
  .fuel-ui-pagination a:hover {
    text-decoration: none; }

.fuel-ui-table-sortable > thead > tr > th {
  cursor: pointer;
  position: relative;
  background-image: none;
  white-space: nowrap; }
  .fuel-ui-table-sortable > thead > tr > th:after, .fuel-ui-table-sortable > thead > tr > th .sort-desc:after, .fuel-ui-table-sortable > thead > tr > th .sort-asc:after {
    font-family: FontAwesome;
    padding-left: 5px; }
  .fuel-ui-table-sortable > thead > tr > th:after {
    content: "\f0dc";
    color: #ddd; }
  .fuel-ui-table-sortable > thead > tr > th.sort-asc:after {
    content: "\f0de";
    color: #767676; }
  .fuel-ui-table-sortable > thead > tr > th.sort-desc:after {
    content: "\f0dd";
    color: #767676; }

.fuel-ui-tag-label {
  margin: 0 .25em; }
  .fuel-ui-tag-label.disabled {
    cursor: not-allowed;
    background: #818a91;
    color: darkgray; }

.fuel-ui-timepicker.has-error {
  border: 1px red solid; }

.fuel-ui-timepicker .fuel-ui-time.has-error input {
  border: 1px red solid; }

.fuel-ui-timepicker .fuel-ui-time input {
  width: 50px; }

.fuel-ui-collapse {
  display: none; }
  .fuel-ui-collapse.in {
    display: block; }

.fuel-ui-collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  -webkit-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
  -webkit-transition-duration: .35s;
  -o-transition-duration: .35s;
  transition-duration: .35s;
  -webkit-transition-property: height, visibility, padding;
  -o-transition-property: height, visibility, padding;
  transition-property: height, visibility, padding; }

.fuel-ui-clickable {
  cursor: pointer; }
  .fuel-ui-clickable.disabled {
    cursor: not-allowed; }
