/******************************************ROOT****************************************************/
:root {
    --danger: #DC143C !important;
    --light-primary: #E1F0FF;
}

/*#kt_body {
    overflow-x: hidden;
}*/

/* Gap Utilities */
.gap-0 {
    gap: 0;
}

.gap-1 {
    gap: 0.25rem; /* 4px */
}

.gap-2 {
    gap: 0.5rem; /* 8px */
}

.gap-3 {
    gap: 1rem; /* 16px */
}

.gap-4 {
    gap: 1.5rem; /* 24px */
}

.gap-5 {
    gap: 3rem; /* 48px */
}

/* Row Gap Utilities */
.row-gap-0 {
    row-gap: 0;
}

.row-gap-1 {
    row-gap: 0.25rem; /* 4px */
}

.row-gap-2 {
    row-gap: 0.5rem; /* 8px */
}

.row-gap-3 {
    row-gap: 1rem; /* 16px */
}

.row-gap-4 {
    row-gap: 1.5rem; /* 24px */
}

.row-gap-5 {
    row-gap: 3rem; /* 48px */
}

/* Column Gap Utilities */
.column-gap-0 {
    column-gap: 0;
}

.column-gap-1 {
    column-gap: 0.25rem; /* 4px */
}

.column-gap-2 {
    column-gap: 0.5rem; /* 8px */
}

.column-gap-3 {
    column-gap: 1rem; /* 16px */
}

.column-gap-4 {
    column-gap: 1.5rem; /* 24px */
}

.column-gap-5 {
    column-gap: 3rem; /* 48px */
}

.last-child-d-none :last-child {
    display: none !important;
}

.kt-badge.kt-badge--danger {
    background-color: #DC143C !important;
}

/* Custom icons css */
.svg-icon.svg-icon-work-stations svg g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
    fill: #e4e6ef !important;
}

.btn.btn-f9:not(.btn-light-danger) {
    background-color: #f9f9f9;
}

/*active work-stations */
.svg-icon.svg-icon-work-stations.svg-icon-active-time-log-start svg g [fill]:nth-child(1),
.svg-icon.svg-icon-work-stations.svg-icon-active-time-log-start svg g [fill]:nth-child(2),
.svg-icon.svg-icon-work-stations.svg-icon-active-time-log-start svg g [fill]:nth-child(3) {
    fill: #1bc5bd !important;
}

.svg-icon.svg-icon-work-stations.svg-icon-active-time-log-stop svg g [fill]:nth-child(1),
.svg-icon.svg-icon-work-stations.svg-icon-active-time-log-stop svg g [fill]:nth-child(2),
.svg-icon.svg-icon-work-stations.svg-icon-active-time-log-stop svg g [fill]:nth-child(3) {
    fill: #efb4b4 !important;
}

.svg-icon.svg-icon-work-stations svg:hover g [fill] {
    -webkit-transition: fill 0.3s ease;
    transition: fill 0.3s ease;
}

/* TOASTR */
.mestric-alert-message.alert {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
}

.mestric-alert-message.alert .close {
    top: 7px !important;
}

.mestric-alert-message.alert .icon {
    display: flex !important;
}

.mestric-alert-message.alert [data-notify="message"] {
    padding-left: 0px !important;
}

.mestric-alert-message.alert.alert-info {
    background-color: #ebedf3;
    border-color: #ebedf3;
    color: rgba(94, 98, 120, 0.7);
}

.mestric-alert-message.alert.alert-info .close::before {
    color: #5e6278 !important;
}

/*OTHER FIXES */
.spinner-button, .spinner-button * {
    display: none;
    color: transparent !important;
}

button:disabled {
    cursor: not-allowed !important;
}

.kt-header__brand {
    background-color: #f5f6fc;
}

.text-align-right {
    text-align: right !important;
}

.text-align-center {
    text-align: center !important;
}

.btn.chart-style-change, .btn.change-precision {
    margin-left: -1px !important;
    height: calc(1.5em + 1.3rem + 2px) !important;
}

.padding-bottom-0 {
    padding-bottom: 0 !important;
}

.dropdown-menu.dropdown-menu-full {
    width: 50vw;
}

.kt-nav__item .btn-group, .kt-nav__item .form-group {
    padding: 0.55rem 1.75rem;
}

.navi .navi-footer.button-line {
    display: block;
    text-align: right;
}

.dataTable .input-group.date {
    width: 130px;
}

.flag-select2 {
    height: 19px;
    border-radius: 50%;
    margin-right: 10px;
}

@media (min-width: 992px) {
    .kt-subheader {
        margin-top: -25px !important;
    }

    .header.header-fixed {
        z-index: 999;
    }
}

@media (max-width: 1199px ) and (min-width: 1139px) {
    #input-production-modal .work-station-and-work-order-wrapper {
        width: 100% !important;
    }

    .last-entry-wrapper {
        margin-top: 24px;
    }
}

@media (max-width: 1399px) {
    .button-group-grid-end {
        grid-column-end: span 4;
    }

    .button-group-grid-end-2 {
        grid-column-end: span 2;
    }
}

#work-station-select {
    width: 240px;
}

.elipsis-title {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.elipsis-title-300 {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 300px;
}

.hover-bg-gray:hover {
    background-color: #E4E6EF;
    cursor: default;
}

.hover-bg-light-gray:hover {
    background-color: #f3f6f9;
    cursor: default;
}

.work-order-key, .article-key {
    cursor: pointer;
}

.work-order-key:hover, .article-key:hover {
    text-decoration: underline;
}

.modal-open {
    overflow: hidden !important;
}

.w-240:not(.w-100) {
    width: 240px !important;
}

.w-505:not(.w-100) {
    width: 505px !important;
}

.mw-240 {
    max-width: 240px !important;
}

.cursor-notallowed {
    cursor: not-allowed;
}

.production-input-warning.swal2-html-container {
    max-height: fit-content;
}

.sticky-toolbar-left {
    left: 0;
}

.last-logged-user-toolbar {
    width: 80px;
    height: 80px;
}

.last-logged-user-toolbar .nav-item, .last-logged-user-toolbar .nav-item .btn {
    width: 100%;
    height: 100%;
}

.last-logged-user-toolbar .nav-item .btn i {
    font-size: 25px;
}

.btn.btn-clean.btn-icon-color-success:hover:not(.btn-text):not(:disabled):not(.disabled) i, .btn.btn-clean.btn-icon-color-success:focus:not(.btn-text) i, .btn.btn-clean.btn-icon-color-success.focus:not(.btn-text) i {
    color: var(--success);
}

.btn-hover-outline-none:hover {
    border-color: transparent !important;
}

.text-overflow-elipsis {
    display: inline-block;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
    max-width: 100%;
}


.no-border-first div:first-child {
    border: none !important;
}

.no-border-last :last-child {
    border: none !important;
}

/******************************************MARGINS****************************************************/
.margin-bottom-0 {
    margin-bottom: 0 !important;
}

.margin-0 {
    margin: 0 !important;
}

/******************************************ROTATE*****************************************************/

.rotate-right-90 {
    transform: rotateZ(90deg);
}

/******************************************FORMS FIXES****************************************************/
.form-control.readonly {
    background-color: #f7f8fa !important;
}


/******************************************MENU***********************************************************/

.aside-menu .menu-nav > .menu-item > .menu-heading, .aside-menu .menu-nav > .menu-item > .menu-link {
    min-height: 60px;
}

.brand {
    padding: 0 15px;
    width: 70px;
    justify-content: center;
}

.minimized-logo {
    width: 35px;
}

.whitelabel-tipteh-ba .minimized-logo,
.minimized-logo.tipteh-logo {
    width: 27px;
    transform: translateX(-6px);
}

.aside-minimize .brand .brand-logo img.minimized-logo,
.aside-minimize .brand .brand-logo img.minimized-logo-tipteh {
    display: block !important;
}

/******************************************Maintenance****************************************************/
.info-maintenance-warning {
    max-height: none !important;
}

/******************************************TELEMETRY --> Analytics****************************************/
#chartdivM71121I100:hover {
    z-index: 100000;
}

#kt_brand {
    background-color: #f5f6fc;
}

/*#region Table*/

/*Table***************************************************************************************************/


tr.align-middle *, table.align-middle td {
    vertical-align: middle !important;
}

.article-table-line, .article-table-line * {
    max-width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dataTables_wrapper .dataTable .filter th {
    vertical-align: middle;
}

.DTFC_ScrollWrapper {
    margin-bottom: 15px;
    margin-right: 10px;
}

/*#endregion */
/*********************************************************************************************************/
/*#region Buttons*/
/*buttons*************************************************************************************************/
.btn.btn-hover-bg-none:hover:not(.btn-text):not(:disabled):not(.disabled), .btn.btn-hover-bg-none:focus:not(.btn-text), .btn.btn-hover-bg-none.focus:not(.btn-text) {
    background-color: transparent !important;
    border-color: transparent !important;
}

@media (max-device-width: 1400px) and (min-device-width: 576px) {
    .work-station-header .btn.btn-icon.btn-xs {
        height: calc(1.35em + 1.1rem + 2px);
        width: calc(1.35em + 1.1rem + 2px);
    }
}

.btn-light-purple {
    color: #9f7aea;
    background-color: #dcd6f7;
    border-color: #dcd6f7;
}

.btn.btn-light-purple:hover:not(.btn-text):not(:disabled):not(.disabled),
.btn.btn-light-purple:focus:not(.btn-text),
.btn.btn-light-purple.focus:not(.btn-text) {
    color: #fff;
    background-color: #9f7aea;
    border-color: transparent;
}

.label-light-purple {
    color: #9f7aea;
    background-color: #f3e8ff;
}

.label-purple {
    color: #f3e8ff;
    background-color: #9f7aea;
}

/*#endregion */
/*********************************************************************************************************/
.cursor-default {
    cursor: default !important;
}

.offcanvas-overlay {
    z-index: 1041;
}

.offcanvas {
    z-index: 1042;
}

.daterangepicker td.week, .daterangepicker th.week {
    color: #ccc;
}

/********************************************CHECKBOX***************************************************/

.checkbox.checkbox-primary > input:disabled ~ span {
    background-color: #3699ff80;
    cursor: not-allowed;
}


.checkbox.checkbox-light-primary > input:checked ~ span {
    background-color: var(--light-primary);
}

.checkbox.checkbox-light-primary > span {
    background-color: #EBEDF3;
}

.checkbox.checkbox-light-primary > input:checked ~ span:after {
    border-color: var(--primary);
}


.btn.btn-hover-text-white:hover:not(.btn-text):not(:disabled):not(.disabled) i,
.btn.btn-hover-text-white:focus:not(.btn-text) i,
.btn.btn-hover-text-white.focus:not(.btn-text) i {
    color: #fff;
}

.btn.btn-hover-text-white:hover * {
    color: #fff !important;
}

.daterangepicker.show-calendar .ranges {
    height: auto !important;
}

.daterangepicker .drp-calendar {
    max-width: 300px;
}

.dataTables_wrapper .dataTables_paginate .pagination .page-item.active > .page-link {
    background-color: var(--light-primary);
    color: var(--primary);
}


.nowrap {
    white-space: nowrap;
}

.h-40 {
    height: 40px !important;
}

.h-50 {
    height: 50px !important;
}

/********************************************PRODUCTION INPUT*********************************/
.work-station-selector {
    cursor: pointer;
}

#input-production-modal .warning-wrapper .flaticon-warning {
    font-size: 1.9rem;
}

/*Production input modal fix to make modal body scrollable*/
@media screen and (max-width: 1200px) {
    #input-production-modal .card-body {
        height: 530px;
        overflow-y: auto;
    }
}

/********************************************OVERLAY******************************************/
.overlay-element {
    position: relative;
}

.overlay-element .overlay-holder, .overlay-element .overlay-text-holder {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 10;
    display: table;
}

.overlay-element .overlay-holder {
    background-color: rgba(0, 0, 0, 0.02);
}

.overlay-element .overlay-text-holder {
    z-index: 11;
}

.overlay-element .centered {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.overlay-element .button-alert {
    vertical-align: bottom;
    text-align: left;
}

.overlay-element .button-alert .overlay-text-element {
    margin-left: 22px;
    margin-bottom: 15px;
    pointer-events: none;
}

.overlay-element .button-alert.has-current-downtime .overlay-test-element {
    margin-bottom: 15px;
}

.overlay-element .overlay-text {
    font-size: 14px;
    background-color: white;
    padding: 10px;
    border-radius: 4px;
    box-shadow: 0px 5px 15px -3px rgba(0, 0, 0, 0.1);
}
.overlay-element .data-wrapper {
    filter: blur(1px);
    opacity: 0.2;
}

/********************************************DOWNTIME MODAL******************************************/

#downtime-list-edit-modal form {
    margin-bottom: 25px;
}

    #downtime-list-edit-modal form:nth-last-child(1) {
        margin-bottom: 0;
    }

.mqtt-item {
    position: absolute !important;
    bottom: 0;
}

.mqtt-status-icon svg {
    height: 11px !important;
    width: 11px !important;
}

.menu-item-active .menu-icon i {
    color: var(--primary);
}

.run-workorder-select {
    border-radius: .42rem !important;
}

.run-workorder-wrapper .select2-container {
    width: 100% !important;
}

.swal2-content .select2-container {
    width: 100% !important;
}

.select2-results__option .work-order-data {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.select2-inputgroup .select2-selection {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

/********************************************PULSE*********************************************/
.unclassified-downtime, .pulse-warning {
    animation: pulse 1.5s infinite;
}

    .unclassified-downtime i, .pulse-warning i {
        animation: pulseColor 1.5s infinite;
    }

.unclassified-downtime {
    animation: pulse 1.5s infinite;
}

#downtime-list-edit-modal .btn-downtimes:not(.unclassified-downtime) {
    display: none;
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }

    70% {
        transform: scale(1.7);
        background-color: #F64E60;
    }

    100% {
        transform: scale(1);
    }
}

@keyframes pulseColor {
    60%, 80% {
        color: #fff;
    }
}

/********************************************PULSE TOOL*********************************************/
.tool-maintenance-warning, .pulse-warning {
    animation: pulseWrench 1.5s infinite;
}

    .tool-maintenance-warning i, .pulse-warning i {
        animation: pulseColorWrench 1.5s infinite;
    }

.tool-maintenance-warning {
    animation: pulseWrench 1.5s infinite;
}

#downtime-list-edit-modal .btn-downtimes:not(.tool-maintenance-warning) {
    display: none;
}

@keyframes pulseWrench {
   /* 0% {
        transform: scale(1);
    }

    70% {
        transform: scale(1.7);
    }

    100% {
        transform: scale(1);
    }*/
}

@keyframes pulseColorWrench {
    60%, 80% {
        color: var(--danger);
    }
}

/********************************************MODAL*************************************************/

.modal-90p {
    max-width: 90%;
    margin: auto;
}

@media (max-width: 1340px) and (min-width: 576px) {
    .modal-sm-90p {
        max-width: 90%;
    }
}

@media (max-width: 1200px) and (min-width: 1139px) {
    .cs-margin-class {
        margin-left: 2rem !important;
    }
}


/********************************************GLOBAL MODAL******************************************/
#globalModal {
    z-index: 1050;
}


.input-group:not(.has-validation) > .input-wrapper > .form-control {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.clear-date-range-picker-button {
    position: absolute;
    right: 52px;
    top: 9px;
}

/********************************************DATE RANGE PICKER******************************************/

.date-range-picker .clear-date:not(.has-date) {
    display: none;
}

.date-range-picker.input-group:focus-within .clear-date {
    border-color: #69b3ff;
    -webkit-transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}

.date-range-picker.input-group:focus-within .calendar-icon {
    border-left-color: #69b3ff;
    -webkit-transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}

.date-range-picker .clear-date {
    display: none;
}

.date-range-picker > input {
    width: 160px !important;
}

.work-station-occupancy-wrapper .overlay-holder {
    border-radius: 5px;
}

.tooltip {
    z-index: 1151 !important;
}

.tooltip.modal-tooltip {
    z-index: 1151 !important;
}


.telemetry-modal .telemetry-modal-body {
    display: flex;
    gap: 20px;
}

#downtime-list-edit-modal.has-downtime-list > .modal-content {
    min-height: 570px !important;
}

#downtime-list-edit-modal .kt-form .downtime-card {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, auto);
    grid-column-gap: 0;
    grid-row-gap: 0;
    align-items: start;
}

    #downtime-list-edit-modal .kt-form .downtime-card .card-header {
        grid-area: 1 / 1 / 2 / 2;
        margin: 25px;
        padding: 0 !important;
        border-bottom: 0;
        border-right: 1px solid #ebedf3;
        border-radius: 0px;
    }

        #downtime-list-edit-modal .kt-form .downtime-card .card-header .row {
            display: flex;
            flex-direction: row;
        }

            #downtime-list-edit-modal .kt-form .downtime-card .card-header .row > div {
                width: 100%;
                min-width: 100%;
                max-width: 100%;
            }

    #downtime-list-edit-modal .kt-form .downtime-card .card-body {
        grid-area: 1 / 2 / 2 / 4;
    }

    #downtime-list-edit-modal .kt-form .downtime-card .card-footer {
        grid-area: 2 / 1 / 3 / 4;
    }

    #downtime-list-edit-modal .kt-form .downtime-card .card-body .btn-outline-secondary {
        background-color: #f9f9f9;
    }

    #downtime-list-edit-modal .kt-form .downtime-card .card-body .planned-downtime-button {
        background-color: #E1F0FF;
    }

    #downtime-list-edit-modal .kt-form .downtime-card .card-body .sampling-downtime-button {
        background-color: #EEE5FF;
    }

        #downtime-list-edit-modal .kt-form .downtime-card .card-body .sampling-downtime-button.active .text-white {
            color: #181C32 !important;
        }

#downtime-list-edit-modal .btn.btn-hover-light-warning:not(:disabled):not(.disabled).active {
    background-color: #fff4de !important;
    border: 1px solid #FFA800 !important;
}
.telemetry-modal .telemetry-modal-body > div {
    width: 50%;
}

.telemetry-modal .telemetry-modal-body hr {
    display: none !important;
}

/* Workorder Info Modal */
.work-order-info-modal .card-body {
    display: flex;
}

.work-order-info-modal .card-body > div {
    min-width: 50%;
    max-width: 50%;
}

.tooltip-inner {
    max-width: 100% !important;
}

/* Input Production Modal */
#input-production-modal .card-body > .work-station-selector-slider {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 5px;
}

#input-production-modal .nav-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%; /* This will make the element's maximum width 50% of its parent's width */
}

#input-production-modal .submit-row {
    position: sticky;
    bottom: 0;
}

#input-production-modal .card-body > .input-wrapper > .row > .col-auto > .form-group,
#input-production-modal .card-body > .input-wrapper > .row > .col-auto > .form-group .alert {
    margin-bottom: 0px !important;
}

#input-production-modal .card-body > .row {
    min-height: 72px;
}

#input-production-modal .work-station-selector-slider-icon.icon-right {
    display: flex;
    position: absolute !important;
    align-items: center !important;
    right: 5px !important;
    height: 60px;
}

#input-production-modal .work-station-selector-slider-icon.icon-left {
    display: flex;
    position: absolute !important;
    align-items: center !important;
    left: 5px !important;
    height: 60px;
}

#input-production-modal .svg-icon.svg-icon-secondary svg g [fill] {
    -webkit-transition: fill .3s ease;
    transition: fill .3s ease;
    fill: #BFBFBF !important;
}

#input-production-modal .card-toolbar .label {
    font-size: 1em !important;
}

.production-input-container .select2-container {
    width: 100% !important;
    max-width: none !important;
}

/* Datatable pagination */
.paging_simple_numbers#kt_table_paginate, .paging_simple_numbers#table_paginate {
    display: flex;
    justify-content: flex-end;
    gap: 30px;
}

.pagination-jump-to {
    display: flex;
    align-items: center;
    max-width: 200px;
    gap: 5px;
}

.pagination-jump-to input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.pagination-jump-to input {
    width: 50px;
    padding: 0px 3px !important;
    height: 100%;
    max-height: 28.25px;
    text-align: center;
    color: #7e8299;
    font-size: 1rem;
    line-height: 1rem;
    font-weight: 500;
}

.min-height-20 {
    min-height: 20px;
}

.w-auto {
    width: auto !important;
}

.w-initial {
    width: initial !important;
}

.min-height-initial {
    min-height: initial !important;
}

#still-here,
#rfid-idle {
    display: none;
    position: fixed;
    bottom: 60px;
    width: 100%;
    transition: transform 0.15s !important;
}

#still-here.scale,
#rfid-idle.scale {
    transform: scale(1.02);
}

#still-here .still-here-container-padding,
#rfid-idle .rfid-idle-container-padding {
    padding: 0 60px;
}

#still-here .still-here-container,
#rfid-idle .rfid-idle-container {
    z-index: 10000;
    max-width: 1300px;
    width: 100%;
    background-color: #fff;
    margin: 0 auto;
    padding: 20px;
    border-radius: 6px;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
}

#still-here .still-here-content,
#rfid-idle .rfid-idle-content {
    display: flex;
    align-items: center;
    margin-right: 10px;
}

#still-here .still-here-buttons {
    display: flex;
    align-items: center;
    justify-content: center !important;
    min-width: 380px
}

.single-work-station-time-log {
    height: 41px;
}

.h-35vh {
    height: 35vh;
}

.quote-font-size {
    font-size: 21px;
}

.quote-ribbon {
    top: -2px;
    right: 20px;
}

.downtime-card-tv-dashboard {
    height: 100% !important;
}

.scroll-simple::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}

.scroll-simple {
    overflow-y: scroll;
}

.scroll-simple > * {
    padding-right: 4px;
}

.scroll-simple:hover::-webkit-scrollbar-track {
    border-radius: 10px;
    background: rgba(0, 0, 0, 0);
}

.scroll-simple:hover::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #E4E6EF;
}

.scroll-simple:hover::-webkit-scrollbar-thumb:hover {
    background: #dedfe9;
}

.scroll-simple:hover::-webkit-scrollbar-thumb:active {
    background: #dedfe9;
}

#oee-card .oee-chart-wrapper {
    max-width: 100px !important;
}

/********************************************TABLET LANDSCAPE STYLE******************************************/
@media (max-device-width: 768px) {
    #still-here .still-here-content > div {
        text-align: center;
    }
}

@media (max-device-width: 1340px) {
    #still-here .still-here-content > div {
        text-align: left;
    }

    #still-here .still-here-content span.text-muted {
        display: flex;
        margin-left: 0px !important;
    }

    #still-here .still-here-content span.text-muted .text-success {
        margin-left: 5px !important;
    }
}

@media (max-device-width: 767px) {
    .modal-sm-with-scroll {
        flex-direction: column;
        height: 500px;
        overflow-y: scroll;
        overflow-x: hidden;
    }

    .modal-content-sm-w100 {
        width: 100% !important;
    }

    .margin-sm-none {
        margin: 0px;
    }
}


@media (max-device-width: 768px) {
    #still-here .still-here-container-padding {
        padding: 0 20px;
    }


    #still-here .still-here-container {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    #still-here .still-here-buttons {
        width: 100%;
        justify-content: start;
        gap: 15px;
    }

    #still-here .still-here-buttons span.label {
        order: 1;
    }
}

@media (max-device-width: 450px) {

    #still-here .still-here-buttons {
        flex-direction: column;
        min-width: unset;
        align-items: flex-start;
    }

    #still-here .still-here-buttons span.label {
        order: 0;
    }
}

.v-popper--theme-tooltip
.v-popper__inner {
    background: #fff;
}

.v-popper__arrow-inner {
    border-color: #004499;
}

.v-popper__wrapper {
    max-width: 400px;
}

.v-popper__inner {
    padding: 10px;
}

@media (min-device-width: 800px) and (max-device-width: 1340px) and (orientation: landscape) {
    .col-lg-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.3333333333%;
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%;
    }

    .card.card-custom:not(.downtime-card) > .card-header .card-title .card-label {
        max-width: 320px;
        min-width: 160px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    /*analytics popup*/
    .dropdown-menu-full .navi .navi-header, .dropdown-menu-full .navi .navi-footer {
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }

    .dropdown-menu-full .navi .navi-separator {
        margin-bottom: 5px !important;
    }

    .dropdown-menu-full .navi .form-group {
        margin-bottom: 0px !important;
    }

    #oee-card {
        /*width: 100% !important;*/
        gap: 20px !important;
        /*margin: 0;*/
        /*padding: 0;*/
    }

    #oee-card > div.col-xl-6 {
        width: 65%;
        max-width: 65%;
        min-width: 65%;
        margin: 0;
        padding: 0;
    }

        /*
    #oee-card > div.col-xl-3 {
        width: calc(35% - 20px);
        max-width: calc(35% - 20px);
        min-width: calc(35% - 20px);
        margin: 0;
        padding: 0;
    }*/

    #oee-card > div .work-order-info {
        width: 100% !important;
    }

    #oee-card .card-rounded .mr-8 {
        margin-right: 0px !important;
    }

   /* #oee-card .card-rounded .row > .col-lg-4 {
        min-width: 35% !important;
        width: 35% !important;
        max-width: 35% !important;
    }*/

    #oee-card div.col-xl-6 .card-rounded,
    #oee-card div.col-xl-3 .card-rounded {
        margin-top: 7px;
    }

    #summary-card #summary-list > div {
        flex-direction: column;
        align-items: baseline !important;
        margin-bottom: 20px;
    }

    .wo-wrapper > div {
        max-width: 65%;
    }

    .wo-wrapper .chart-legend {
        max-width: 35%;
        width: 35%;
        min-width: 35%;
    }

    .editModalButton-TableHeader {
        display: flex;
        flex-direction: column;
        align-content: center;
        align-items: flex-end;
    }

    #kt_table thead tr.d-lg-table-row th:last-child {
        height: 20px !important;
    }

    .mobile-filters-card {
        margin-bottom: 20px;
    }

    .mobile-filters-card .filters-list {
        display: grid;
        grid-template-columns: 24% 24% 24% 24%;
        grid-gap: 7px;
    }

    .mobile-filters-card .filters-list .row {
        margin: 0px 0px !important;
        padding: 5px 0px !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    .mobile-filters-card .card-body > div:last-child {
        margin: 0px;
        margin-top: 15px;
    }


    .timeline-wrapper .chart-body {
        max-height: 100% !important;
    }

    .timeline-wrapper .chart {
        max-height: 230px !important;
        margin-top: 20px;
    }

    /* Input Production Modal */
    #input-production-modal .card-body > .work-station-selector-slider {
        display: flex;
        flex-direction: row;
        gap: 4px;
        overflow-x: auto;
        flex-wrap: unset;
        padding-bottom: 10px;
    }

    #input-production-modal .card-body {
        padding-top: 0px;
        padding-bottom: 0px;
    }

    #input-production-modal .modal-footer {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .production-input-container .editModalButton-TableHeader {
        max-width: 70px !important;
        width: 70px !important;
        height: 38px !important;
    }

    .production-input-container .workOrderKey-TableHeader {
        max-width: 130px !important;
        width: 130px !important;
    }
}

@media (min-device-width: 800px) and (max-device-width: 1340px) and (orientation: portrait) {
    .card.card-custom > .card-header .card-title .card-label {
        max-width: 160px;
        min-width: 160px;
        width: 160px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    #oee-sum .apexcharts-inner {
        transform: scale(.95);
    }

    .text-right > .work-order-info {
        padding: 0px !important;
    }


    .work-order-info,
    .last-shifts-wrapper {
        padding: 1rem 2.25rem 1rem 2.25rem !important;
    }

    .work-order-info .row > .col-lg-4 {
        max-width: 38% !important;
        height: 90px;
    }

    .last-shifts-wrapper .last-shifts-chart {
        max-width: 38%;
        height: 90px;
    }

    .last-shifts-desc > div div.text-muted {
        max-width: 100px;
        min-width: 100px;
        width: 100px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    #work-station-list {
        max-width: 100%;
        overflow-x: hidden !important;
    }

    #kt_content .container-fluid {
        margin-bottom: 20px;
    }

    .analytics-subheader > .container-fluid {
        display: flex !important;
        flex-direction: column;
        align-items: flex-start !important;
        gap: 10px;
        margin-bottom: 10px;
        margin-top: 10px;
    }

    .analytics-subheader > .container-fluid > div:first-child {
        margin-right: 0px !important;
    }

    #oee-card .col-lg-4 {
        width: 100% !important;
    }

    .work-station-card .row > .col-lg-4 {
        max-width: 32% !important;
        height: 90px;
    }

    .dropdown-menu-full {
        z-index: 99999 !important;
    }

    /*analytics popup*/
    .dropdown-menu-full .navi .navi-header,
    .dropdown-menu-full .navi .navi-footer {
        padding-top: 2px !important;
        padding-bottom: 2px !important;
    }

    .dropdown-menu-full .navi .navi-separator {
        margin-bottom: 4px !important;
    }

    .dropdown-menu-full .navi .form-group {
        margin-bottom: 0px !important;
    }


    #oee-card {
        width: 100% !important;
        margin: 0;
        padding: 0;
    }

    #oee-card > div {
        width: 100%;
        max-width: 100%;
        min-width: 100%;
        margin: 0;
        padding: 0;
    }

    #oee-card > div .work-order-info {
        width: 100% !important;
    }

    #oee-card > div .work-order-info > .row {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
    }

    #oee-card > div .work-order-info > .row .col-6 {
        width: 100%;
        min-width: 100%;
    }

    .wo-wrapper {
        gap: 5px !important;
    }

    .wo-wrapper .col-sm-12 .card-body.chart-body {
        max-height: none !important;
        height: 230px !important;
    }

    .wo-wrapper .chart-legend {
        min-height: unset !important;
    }

    .wo-wrapper .chart-legend .card-custom {
        height: auto !important;
    }

    .wo-wrapper .chart-legend .card-body {
        display: flex !important;
        flex-direction: row !important;
        padding: 20px 27px 10px 27px !important;
        align-items: center;
    }

    .wo-wrapper .chart-legend .card-body .col-lg-4 {
        width: 100px !important;
        margin-right: 30px !important;
    }

    .wo-wrapper .chart-legend .card-body > div {
        width: 50% !important;
        max-width: 50% !important;
    }

    /* Input Production Modal */
    #input-production-modal .card-body > .work-station-selector-slider {
        display: flex;
        flex-direction: row;
        gap: 4px;
        overflow-x: auto;
        flex-wrap: unset;
        padding-bottom: 10px;
    }

    #input-production-modal .w-50 {
        width: 100% !important;
    }

    #input-production-modal .w-50:first-child {
        width: 100% !important;
    }

    #input-production-modal .w-50 .align-items-center > .form-group {
        width: 48% !important;
        max-width: 48% !important;
    }

    #input-production-modal .w-50 .align-items-center > .form-group .select2-container {
        width: 100% !important;
    }

    #input-production-modal .w-50:last-child {
        margin-top: 20px;
    }

    #input-production-modal .w-50:last-child .alert {
        margin: 0px !important;
    }

    #input-production-modal .input-wrapper .col-auto {
        width: 100% !important;
    }

    #input-production-modal .input-wrapper .row.summary-row .col-auto {
        width: auto !important;
    }

    #input-production-modal .input-wrapper .col-auto > .form-group {
        margin-bottom: 0px !important;
    }

    #input-production-modal .input-wrapper .col-auto .form-group > div {
        display: flex;
        gap: 5px;
    }

    #input-production-modal .input-wrapper .col-auto .form-group > div > .form-group {
        max-width: 32% !important;
        width: 32% !important;
    }

    #input-production-modal .input-wrapper .col-auto .form-group > div > .form-group input {
        width: 100% !important;
    }

    #input-production-modal .input-wrapper .col {
        border-left-width: 0px !important;
    }

    #input-production-modal .input-wrapper .col .classification-wrapper > .col-auto {
        width: 50% !important;
        max-width: 50% !important;
    }

    #input-production-modal .input-wrapper .col .classification-wrapper > .col-auto input {
        width: 100% !important;
    }
}

.w-70p {
    width: 70%;
}

#kt_table_processing, #table_processing, .dataTables_processing.card {
    padding: 0 !important;
}

.align-items-center {
    align-items: center;
}

@media (min-width: 1139px) {
    .cs-form-group {
        margin-bottom: 0px;
    }
}


.last-entry-alert {
    width: 50%;
}

.custom-margin-top {
    margin-top: 0px;
}

@media (max-device-width: 826px) {
    .custom-margin-top {
        margin-top: 13px;
    }
}

.cs-margin-on-select {
    margin: 0px;
}

@media (max-device-width: 634px) and (min-device-width: 567px) {
    .cs-margin-on-select {
        margin-top: 13px !important;
    }
}

.desktop.tablet.fablet.phone.dtr-control:before {
    left: 8px !important;
}

.article-title {
    max-width: 40%;
    text-overflow: ellipsis;
    overflow: hidden;
}

.article-title-line {
    max-width: 100%;
    white-space: nowrap;
}

.status-indicator {
    height: 8px;
    width: 8px;
    background-color: #50CD89;
    border-radius: 50%;
    display: inline-block;
}

@media (max-width: 1399px) and (min-width: 1203px) {
    .performance-card-padding {
        padding: 1rem 12.5px 0 0 !important;
    }
}


@media (max-width: 1202px) {
    .performance-card-padding {
        padding: 0rem 12.5px 1rem 0rem !important;
    }
}

.mqqt-status-indicator {
    height: calc(1.5em + 1.65rem + 2px);
    width: calc(1.5em + 1.65rem + 2px);
    justify-content: center;
    display: flex;
    align-items: center;
}


@media (max-width: 1599px) {
    .desktop-only {
        display: none;
    }
}


@media (min-width: 1600px) {
    .desktop-only {
        display: table-cell;
    }
}

.divider {
    border: 0;
    clear: both;
    display: block;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.1);
    height: 1px;
}

.filter-gap {
    margin-left: 7px !important;
}

.progress, .progress-text {
    cursor: pointer;
}

.show-on-parent-hover {
    display: none;
}

.show-hover-children:hover .show-on-parent-hover {
    display: initial;
}

.work-order-info-wrapper,
.last-shifts-wrapper {
    flex: unset;
}

.work-order-info-wrapper {
    padding: 1rem 2.25rem 0 2.25rem;
}

.oee-chart-workorder .highcharts-container,
.oee-chart-last-shifts .highcharts-container {
    max-height: 78px;
}

.last-shifts-desc > div:last-child {
    margin-bottom: 0px !important;
}

.last-shifts-chart .button-alert .overlay-text-element {
    margin: 0px;
}

.default-tv-dashboard .last-shifts-chart .button-alert .overlay-text-element {
    margin-left: 22px;
    margin-bottom: 7px;
}

@media screen and (max-width: 799px) {
    .work-order-info-wrapper {
        padding-bottom: 1rem !important;
    }
}

.cs-margin-left {
    margin-left: 1rem !important;
}

@media screen and (max-width: 1100px) {
    .cs-margin-left {
        margin-left: 0rem !important;
        margin-top: 12px !important;
    }
}


@media screen and (max-width: 768px) {
    .norm-info {
        min-width: 100% !important;
    }
}

.label.label-lg {
    white-space: nowrap;
}

.workorder-progress > *, .workorder-estimated-date {
    cursor: default !important;
}

.telemetry-filters .row:last-child {
    grid-column-end: span 4;
    display: flex;
    margin-left: 0;
    justify-content: end;
}


#kt_table_wrapper {
    touch-action: none;
}

.fa-beat {
    animation: fa-beat 5s ease infinite;
}

.fa-beat-x2 {
    animation: fa-beat-x2 5s ease infinite;
}


.fa-beat-x3 {
    animation: fa-beat-x3 5s ease infinite;
}


@keyframes fa-beat {
    0% {
        transform: scale(1);
    }

    5% {
        transform: scale(1.25);
    }

    20% {
        transform: scale(1);
    }

    30% {
        transform: scale(1);
    }

    35% {
        transform: scale(1.25);
    }

    50% {
        transform: scale(1);
    }

    55% {
        transform: scale(1.25);
    }

    70% {
        transform: scale(1);
    }
}

@keyframes fa-beat-x2 {
    0% {
        transform: scale(1);
    }

    20% {
        transform: scale(1.5);
    }

    30% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.5);
    }

    80% {
        transform: scale(1);
    }
}

@keyframes fa-beat-x2 {
    0% {
        transform: scale(1);
    }

    20% {
        transform: scale(3);
    }

    30% {
        transform: scale(1);
    }

    50% {
        transform: scale(3);
    }

    80% {
        transform: scale(1);
    }
}


.icon-switch {
    position: relative;
}

.package-unit-progress-tv-dashboard .work-station-maintenance-img {
    top: calc(50% - 1px);
    left: 50%;
    transform: translate(-50%, -50%);
}

.package-unit-progress-tv-dashboard .fas.fa-wrench {
    font-size: 4.5rem !important;
}

.work-station-maintenance-img {
    position: absolute;
    top: calc(50% - 1px);
    left: calc(50% - 10px);
}

.fas.fa-wrench {
    font-size: 1.7rem !important;
}

.work-station-model-number,
.work-station-maintenance-img {
    position: absolute;
}

.work-station-model-number-animation {
    animation-name: work-station-model-number-animation;
    animation-delay: 150ms;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 1.5s;
    animation-direction: alternate;
}


.maintenance-animation {
    animation-delay: 250ms;
    animation-name: maintenance-animation;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 1.5s;
    animation-direction: alternate;
}

.work-station-notification-animation {
    animation-delay: 250ms;
    animation-name: work-station-notification-animation;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 1.5s;
    animation-direction: alternate;
}

@keyframes work-station-model-number-animation {
    0% {
        opacity: 0;
    }

    25% {
        opacity: 0;
    }

    75% {
        opacity: 1;
    }

    100% {
        opacity: 1;
    }
}


@keyframes maintenance-animation {
    0% {
        opacity: 1;
    }

    25% {
        opacity: 1;
    }

    75% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@keyframes work-station-notification-animation {
    0% {
        opacity: 1;
    }

    25% {
        opacity: 1;
    }

    75% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}


.no-border-right {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

.no-border-left {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}


.with-border {
    border-bottom-right-radius: 0.42rem;
    border-top-right-radius: 0.42rem;
}

.ticket-popup {
    bottom: 100px;
    right: 30px;
}

.open-ticket {
    bottom: 50px;
    right: 30px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

#input-production-modal select + .select2-container {
    width: 100% !important;
}

.work-station-timelog-disabled {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}

.work-station-timelog-sidebar-no-permission {
    cursor: not-allowed !important;
    pointer-events: none !important;
}

.work-station-timelog-sidebar-no-permission-icon {
    opacity: 0.6 !important;
}

.recent-active-work-stations-badge {
    font-size: 1rem;
    bottom: -8px;
    right: -8px;
    min-width: 1.3em;
    text-align: center;
    line-height: 0 !important;
}

.top-bar-active-work-stations-badge {
    font-size: 0.9rem;
    right: 3px;
    top: 23px !important;
    min-width: 1.3em;
    text-align: center;
    width: 17px;
    height: 17px;
    line-height: 0 !important;
}

.login-btn {
    width: 130px;
    height: 50px;
}

.lh-1 {
    line-height: 1;
}

.symbol-38 .symbol-label {
    width: 38.38px;
    height: 38.38px;
}

#active-work-stations .card-icon {
    max-height: 38.38px;
}

/* Tooltip shortcut */
.tooltip-shortcut {
    margin-bottom: -4px;
}

/* Article modal */
.article-info-modal .card-body {
    padding: 1.5rem 0.7rem 1.5rem 1.75rem !important;
}

.article-info-modal .modal-footer {
    padding: 1rem 1.75rem;
}

.article-info-modal .articles-in-family .card-body,
.article-info-modal #collapseNormTime .card-body,
.article-info-modal .edit-article-norm-wrapper > div,
.article-info-modal #collapsePieceCount .card-body,
.article-info-modal #accordionArticleInfo .edit-article-piece-count-wrapper > div,
.article-info-modal .article-in-family .card-body,
.article-info-modal #headingNormTime .card-title,
.article-info-modal #headingNormTime > div {
    padding: 0 !important;
}

.article-info-modal .save-article-norm,
.article-info-modal .save-article-piece-count {
    margin-bottom: 1rem;
}

.article-info-modal #accordionArticleInfo #headingPieceCount > .card-title {
    padding: 0 !important;
}

.accordion-open-close-toggler:not([aria-expanded]) .accordion-expanded-icon {
    display: none;
}

.accordion-open-close-toggler:not([aria-expanded]) .accordion-collapsed-icon {
    display: inline;
}

/* When expanded: show expanded icon, hide collapsed icon */
.accordion-open-close-toggler[aria-expanded="true"] .accordion-expanded-icon {
    display: inline; /* or block/flex depending on your layout */
}

.accordion-open-close-toggler[aria-expanded="true"] .accordion-collapsed-icon {
    display: none;
}

/* When collapsed: show collapsed icon, hide expanded icon */
.accordion-open-close-toggler[aria-expanded="false"] .accordion-expanded-icon {
    display: none;
}

.accordion-open-close-toggler[aria-expanded="false"] .accordion-collapsed-icon {
    display: inline;
}

.tooltip-work-order-info-status-notes .tooltip-inner {
    max-width: 300px;
}

@media (min-width: 1600px) {
    .col-xxxl {
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%
    }

    .row-cols-xxxl-1 > * {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%
    }

    .row-cols-xxxl-2 > * {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%
    }

    .row-cols-xxxl-3 > * {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.3333333333%;
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%
    }

    .row-cols-xxxl-4 > * {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%
    }

    .row-cols-xxxl-5 > * {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%
    }

    .row-cols-xxxl-6 > * {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.6666666667%;
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%
    }

    .col-xxxl-auto {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
        max-width: 100%
    }

    .col-xxxl-1 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 8.3333333333%;
        flex: 0 0 8.3333333333%;
        max-width: 8.3333333333%
    }

    .col-xxxl-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.6666666667%;
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%
    }

    .col-xxxl-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%
    }

    .col-xxxl-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.3333333333%;
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%
    }

    .col-xxxl-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 41.6666666667%;
        flex: 0 0 41.6666666667%;
        max-width: 41.6666666667%
    }

    .col-xxxl-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%
    }

    .col-xxxl-7 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 58.3333333333%;
        flex: 0 0 58.3333333333%;
        max-width: 58.3333333333%
    }

    .col-xxxl-8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 66.6666666667%;
        flex: 0 0 66.6666666667%;
        max-width: 66.6666666667%
    }

    .col-xxxl-9 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%
    }

    .col-xxxl-10 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 83.3333333333%;
        flex: 0 0 83.3333333333%;
        max-width: 83.3333333333%
    }

    .col-xxxl-11 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 91.6666666667%;
        flex: 0 0 91.6666666667%;
        max-width: 91.6666666667%
    }

    .col-xxxl-12 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%
    }

    .order-xxxl-first {
        -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
        order: -1
    }

    .order-xxxl-last {
        -webkit-box-ordinal-group: 14;
        -ms-flex-order: 13;
        order: 13
    }

    .order-xxxl-0 {
        -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
        order: 0
    }

    .order-xxxl-1 {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }

    .order-xxxl-2 {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }

    .order-xxxl-3 {
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3
    }

    .order-xxxl-4 {
        -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
        order: 4
    }

    .order-xxxl-5 {
        -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
        order: 5
    }

    .order-xxxl-6 {
        -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
        order: 6
    }

    .order-xxxl-7 {
        -webkit-box-ordinal-group: 8;
        -ms-flex-order: 7;
        order: 7
    }

    .order-xxxl-8 {
        -webkit-box-ordinal-group: 9;
        -ms-flex-order: 8;
        order: 8
    }

    .order-xxxl-9 {
        -webkit-box-ordinal-group: 10;
        -ms-flex-order: 9;
        order: 9
    }

    .order-xxxl-10 {
        -webkit-box-ordinal-group: 11;
        -ms-flex-order: 10;
        order: 10
    }

    .order-xxxl-11 {
        -webkit-box-ordinal-group: 12;
        -ms-flex-order: 11;
        order: 11
    }

    .order-xxxl-12 {
        -webkit-box-ordinal-group: 13;
        -ms-flex-order: 12;
        order: 12
    }

    .offset-xxxl-0 {
        margin-left: 0
    }

    .offset-xxxl-1 {
        margin-left: 8.3333333333%
    }

    .offset-xxxl-2 {
        margin-left: 16.6666666667%
    }

    .offset-xxxl-3 {
        margin-left: 25%
    }

    .offset-xxxl-4 {
        margin-left: 33.3333333333%
    }

    .offset-xxxl-5 {
        margin-left: 41.6666666667%
    }

    .offset-xxxl-6 {
        margin-left: 50%
    }

    .offset-xxxl-7 {
        margin-left: 58.3333333333%
    }

    .offset-xxxl-8 {
        margin-left: 66.6666666667%
    }

    .offset-xxxl-9 {
        margin-left: 75%
    }

    .offset-xxxl-10 {
        margin-left: 83.3333333333%
    }

    .offset-xxxl-11 {
        margin-left: 91.6666666667%
    }
}


@media (min-width: 1750px) {
    .col-ultra {
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%;
    }

    .row-cols-ultra-1 > * {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .row-cols-ultra-2 > * {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .row-cols-ultra-3 > * {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.3333333333%;
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%;
    }

    .row-cols-ultra-4 > * {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .row-cols-ultra-5 > * {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }

    .row-cols-ultra-6 > * {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.6666666667%;
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%;
    }

    .col-ultra-auto {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
        max-width: 100%;
    }

    .col-ultra-1 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 8.3333333333%;
        flex: 0 0 8.3333333333%;
        max-width: 8.3333333333%;
    }

    .col-ultra-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.6666666667%;
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%;
    }

    .col-ultra-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .col-ultra-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.3333333333%;
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%;
    }

    .col-ultra-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 41.6666666667%;
        flex: 0 0 41.6666666667%;
        max-width: 41.6666666667%;
    }

    .col-ultra-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .col-ultra-7 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 58.3333333333%;
        flex: 0 0 58.3333333333%;
        max-width: 58.3333333333%;
    }

    .col-ultra-8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 66.6666666667%;
        flex: 0 0 66.6666666667%;
        max-width: 66.6666666667%;
    }

    .col-ultra-9 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }

    .col-ultra-10 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 83.3333333333%;
        flex: 0 0 83.3333333333%;
        max-width: 83.3333333333%;
    }

    .col-ultra-11 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 91.6666666667%;
        flex: 0 0 91.6666666667%;
        max-width: 91.6666666667%;
    }

    .col-ultra-12 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .order-ultra-first {
        -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
        order: -1;
    }

    .order-ultra-last {
        -webkit-box-ordinal-group: 14;
        -ms-flex-order: 13;
        order: 13;
    }

    .order-ultra-0 {
        -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
        order: 0;
    }

    .order-ultra-1 {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
    }

    .order-ultra-2 {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
    }

    .order-ultra-3 {
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3;
    }

    .order-ultra-4 {
        -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
        order: 4;
    }

    .order-ultra-5 {
        -webkit-box-ordinal-group: 6;
        -ms-flex-order: 5;
        order: 5;
    }

    .order-ultra-6 {
        -webkit-box-ordinal-group: 7;
        -ms-flex-order: 6;
        order: 6;
    }

    .order-ultra-7 {
        -webkit-box-ordinal-group: 8;
        -ms-flex-order: 7;
        order: 7;
    }

    .order-ultra-8 {
        -webkit-box-ordinal-group: 9;
        -ms-flex-order: 8;
        order: 8;
    }

    .order-ultra-9 {
        -webkit-box-ordinal-group: 10;
        -ms-flex-order: 9;
        order: 9;
    }

    .order-ultra-10 {
        -webkit-box-ordinal-group: 11;
        -ms-flex-order: 10;
        order: 10;
    }

    .order-ultra-11 {
        -webkit-box-ordinal-group: 12;
        -ms-flex-order: 11;
        order: 11;
    }

    .order-ultra-12 {
        -webkit-box-ordinal-group: 13;
        -ms-flex-order: 12;
        order: 12;
    }

    .offset-ultra-0 {
        margin-left: 0;
    }

    .offset-ultra-1 {
        margin-left: 8.3333333333%;
    }

    .offset-ultra-2 {
        margin-left: 16.6666666667%;
    }

    .offset-ultra-3 {
        margin-left: 25%;
    }

    .offset-ultra-4 {
        margin-left: 33.3333333333%;
    }

    .offset-ultra-5 {
        margin-left: 41.6666666667%;
    }

    .offset-ultra-6 {
        margin-left: 50%;
    }

    .offset-ultra-7 {
        margin-left: 58.3333333333%;
    }

    .offset-ultra-8 {
        margin-left: 66.6666666667%;
    }

    .offset-ultra-9 {
        margin-left: 75%;
    }

    .offset-ultra-10 {
        margin-left: 83.3333333333%;
    }

    .offset-ultra-11 {
        margin-left: 91.6666666667%;
    }
}

.no-hover:hover {
    background-color: inherit !important;
    color: inherit !important;
    text-decoration: none !important;
    border-color: inherit !important;
}