/* Base styles */

body {
    font-family: "Nunito Sans" !important;
    font-size: 1.4rem !important;
    background-color: #fff !important;
}
 

.page-wrapper {
    overflow: hidden;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0;
    display: flex;
    flex-direction: row;
}

/* Sub container (lado izquierdo con imagen y texto) */
.sub-container {
    width: 66.6666%;
    height: 100%;
    background: #fff;
    position: relative;
    transition: transform 0.3s ease-in-out;
}

@media screen and (max-width: 1024px) {
    .sub-container {
        width: 50%;
    }
}

@media screen and (max-width: 480px) {
    .sub-container {
        display: none;
    }
}

.sub-container .img {
    overflow: hidden;
    z-index: 2;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
}

    .sub-container .img:before {
        content: '';
        position: absolute;
        right: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-image: url('/webapp2/assets/images/bg-login.jpg');
        background-size: cover;
        background-position: center bottom;
        transition: background-position 0.3s ease-in-out;
    }

    .sub-container .img:after {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.5));
        opacity: 0.85;
        outline: 6px solid #00d45a;
        outline-offset: -1.25rem;
    }

.info-container {
    width: 100%;
    padding: 7rem 5rem;
    z-index: 2;
}

    .info-container .text {
        text-align: left;
        color: #fff;
    }

    .info-container h2 {
        font-size: 34px;
        font-weight: 800;
        line-height: 60px;
        margin: 0;
        text-shadow: 0 3px 18px rgba(0, 0, 0, 0.75);
        letter-spacing: -1px;
        text-transform: uppercase;
        color: white;
    }

        .info-container h2 strong {
            display: block;
            font-size: 78px;
            color: #00d45a;
        }

@media screen and (max-width: 1024px) {
    .info-container {
        padding: 5rem 3rem;
    }

        .info-container h2 {
            font-size: 24px;
            line-height: 36px;
        }

            .info-container h2 strong {
                font-size: 42px;
            }
}

/* Form container (lado derecho) */
.form {
    position: relative;
    width: 33.3333%;
    height: 100%;
    display: flex;
    background-color: white;
}

@media screen and (max-width: 1024px) {
    .form {
        width: 50%;
    }
}

@media screen and (max-width: 480px) {
    .form {
        width: 100%;
    }
}

.form-container {
    width: 100%;
    padding: 5rem 6rem 6rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    z-index: 1;
    overflow: hidden;
}

@media screen and (max-width: 1366px) {
    .form-container {
        padding: 2.5rem 2rem;
    }
}

.version {
    position: fixed;
    top: 1rem;
    right: 1rem;
    font-size: 14px;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.3);
}

.blob-container {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 220px;
    z-index: -1;
    overflow: hidden;
}

.blob {
    margin: 0 auto;
    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
    animation: morph 6s linear infinite alternate;
    position: absolute;
    top: 0;
    left: -25%;
    width: 200%;
    height: 300px;
    background: linear-gradient(to bottom, #ffcccc, #00d45a);
}

@media screen and (max-width: 480px) {
    .blob {
        left: -15%;
        width: 150%;
        height: 200px;
    }
}

@keyframes morph {
    0% {
        border-radius: 40% 60% 60% 40% / 70% 30% 70% 30%;
    }

    100% {
        border-radius: 40% 60%;
    }
}

.crol-logo {
    width: 260px;
    margin: auto auto 1rem;
}

    .crol-logo img {
        max-width: 100%;
    }

@media screen and (max-width: 480px) {
    .crol-logo {
        width: 280px;
        margin-bottom: 3rem;
    }
}

.subtitle {
    color: #666;
    font-size: 20px;
    font-weight: 600;
    padding: 0 1rem;
    margin: 1rem auto 0.5rem;
}

@media screen and (max-width: 480px) {
    .subtitle {
        display: none;
    }
}

.content {
    max-width: 600px;
    width: 100%;
    margin: 0 auto;
}

.form-group {
    margin: 0.5rem 0 1rem;
}

    .form-group label {
        display: block;
        font-weight: 600;
        padding-left: 1rem;
    }

    .form-group input {
        width: 100%;
        padding: 0.75rem;
        border: 1px solid #ccc;
        border-radius: 6px;
        font-size: 16px;
    }

    .form-group.remember {
        padding: 0 1rem;
        margin-bottom: 1.5rem;
        display: flex;
        justify-content: space-between;
        font-size: 16px;
        font-weight: 600;
        color: #666;
    }

@media screen and (max-width: 480px) {
    .form-group.remember {
        padding: 0;
        font-size: 14px;
    }
}

.btn {
    display: block;
    width: 100%;
    padding: 0.75rem;
    background-color: #00d45a;
    color: white;
    font-size: 18px;
    font-weight: bold;
    border: none;
    border-radius: 32px;
    cursor: pointer;
    text-align: center;
}

.change-form-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: 2rem;
    margin-top: auto;
}

    .change-form-container span {
        text-align: center;
        color: #fff;
        font-size: 18px;
        font-weight: 600;
    }

    .change-form-container a {
        color: white;
    }

@media screen and (max-width: 480px) {
    .change-form-container a {
        font-size: 15px;
    }
}





.col,
.col-1,
.col-10,
.col-11,
.col-12,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-auto,
.col-lg,
.col-lg-1,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-auto,
.col-md,
.col-md-1,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-auto,
.col-sm,
.col-sm-1,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-auto,
.col-xl,
.col-xl-1,
.col-xl-10,
.col-xl-11,
.col-xl-12,
.col-xl-2,
.col-xl-3,
.col-xl-4,
.col-xl-5,
.col-xl-6,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-auto {
    padding-right: 8px;
    padding-left: 8px;
}

.list {
    margin: 0;
}

    .list ion-list-header.list-header {
        min-height: 0;
        padding: 0;
        margin-bottom: 0;
        border-top: none;
        border-bottom: none;
    }

        .list ion-list-header.list-header .label {
            margin: 0;
            padding: 1rem;
            text-align: center;
        }

    .list ion-item-sliding ion-item-options .btn {
        width: 72px;
        height: unset;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-flow: column;
        -ms-flex-flow: column;
        flex-flow: column;
        border-radius: 0;
    }

        .list ion-item-sliding ion-item-options .btn i {
            font-size: 24px;
        }

            .list ion-item-sliding ion-item-options .btn i.fas {
                font-size: 22px;
            }

        .list ion-item-sliding ion-item-options .btn span {
            font-size: 12px;
            margin-top: 0.5rem;
        }

.action-sheet-container .action-sheet-group {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-evenly;
    -webkit-justify-content: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
    background-color: #f6f8fc;
    padding: 0.5rem;
    -webkit-box-shadow: 0 -4px 16px rgba(136, 103, 103, 0.15);
    box-shadow: 0 -4px 16px rgba(136, 103, 103, 0.15);
}

    .action-sheet-container .action-sheet-group .action-sheet-button {
        margin: 0.5rem;
        padding: 1.5rem 1rem;
        background-color: white;
        border-radius: 1rem;
        -webkit-box-shadow: 0 4px 16px rgba(136, 103, 103, 0.15);
        box-shadow: 0 4px 16px rgba(136, 103, 103, 0.15);
    }

        .action-sheet-container .action-sheet-group .action-sheet-button .button-inner {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            font-size: 13pt;
            text-align: center;
        }

            .action-sheet-container .action-sheet-group .action-sheet-button .button-inner .action-sheet-icon {
                margin: 0 0 1rem;
                color: #00d45a;
            }

.select-popover .popover-content .list .item .item-inner .input-wrapper .label {
    font-size: 16px;
    text-transform: capitalize;
}

[class^="mat-"]:not(.material-icons) {
    font-family: 'Nunito Sans' !important;
}

.mat-table thead tr.mat-header-row {
    height: 40px;
}

.mat-table thead tr th.mat-header-cell {
    font-size: 10px;
    font-weight: 700;
}

    .mat-table thead tr th.mat-header-cell .mat-sort-header-container button {
        letter-spacing: 0.5px;
        text-transform: uppercase;
    }

    .mat-table thead tr th.mat-header-cell .mat-sort-header-container.mat-sort-header-sorted {
        color: #212121;
    }

.mat-table tbody tr {
    height: 54px;
}

    .mat-table tbody tr td {
        color: #333;
        font-size: 12px;
    }

        .mat-table tbody tr td strong {
            font-weight: 600;
            text-transform: capitalize;
        }

        .mat-table tbody tr td small {
            font-size: 10px;
        }

    .mat-table tbody tr:hover {
        background-color: rgba(0, 0, 0, 0.1);
    }

.mat-menu-panel {
    border-radius: 2px;
}

    .mat-menu-panel .mat-menu-content:not(:empty) {
        padding-top: 0;
        padding-bottom: 0;
    }

        .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item {
            height: 36px;
            padding: 0;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            line-height: 0;
        }

            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item .far,
            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item .fas {
                width: 36px;
                height: 36px;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                color: white;
                font-size: 14px;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

                .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item .far ~ span,
                .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item .fas ~ span {
                    font-size: 12px;
                    padding: 0 0.75rem 0 0.5rem;
                }

                    .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item .far ~ span strong,
                    .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item .fas ~ span strong {
                        font-weight: 600;
                    }

            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item.mat-menu-item-submenu-trigger {
                padding-right: 1.5rem;
            }

            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(1) .far,
            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(1) .fas {
                background-color: #ffa000;
            }

            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(2) .far,
            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(2) .fas {
                background-color: #e02626;
            }

            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(3) .far,
            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(3) .fas {
                background-color: #1e88e5;
            }

            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(4) .far,
            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(4) .fas {
                background-color: #2196f3;
            }

            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(5) .far,
            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(5) .fas {
                background-color: #66bb6a;
            }

            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(6) .far,
            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(6) .fas {
                background-color: #28b52e;
            }

            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(7) .far,
            .mat-menu-panel .mat-menu-content:not(:empty) .mat-menu-item:nth-of-type(7) .fas {
                background-color: #00796b;
            }

.mat-calendar .mat-calendar-body-cell-content {
    line-height: unset;
}

    .mat-calendar .mat-calendar-body-cell-content.mat-calendar-body-selected {
        background-color: #00d45a;
    }

.mat-select.mat-form-control,
mat-autocomplete.form-control {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 46px;
    font-size: 14px;
    border-radius: 0;
    border: 1px solid #e0e0e0;
}

    .mat-select.mat-form-control .mat-select-trigger .mat-select-value,
    mat-autocomplete.form-control .mat-select-trigger .mat-select-value {
        padding-left: 1.5rem;
    }

    .mat-select.mat-form-control .mat-select-trigger .mat-select-arrow-wrapper .mat-select-arrow,
    mat-autocomplete.form-control .mat-select-trigger .mat-select-arrow-wrapper .mat-select-arrow {
        margin: 0 0.5rem;
    }

.mat-option.contains-mat-select-search {
    height: 40px;
}

    .mat-option.contains-mat-select-search .mat-select-search-input {
        font-size: 14px;
        height: 40px;
        line-height: 40px;
    }

    .mat-option.contains-mat-select-search .mat-select-search-inner .mat-select-search-input {
        font-size: 14px;
        height: 40px;
        line-height: 40px;
    }

.ui-picklist {
    margin-top: 1rem;
}

    .ui-picklist .ui-picklist-buttons .ui-button {
        background-color: #1e88e5;
        border-color: #1e88e5;
        border-radius: 0;
        margin-bottom: 0.25rem;
        outline: none;
    }

    .ui-picklist .ui-picklist-buttons:first-child, .ui-picklist .ui-picklist-buttons:last-child {
        display: none;
        width: 0;
    }

    .ui-picklist .ui-picklist-listwrapper {
        width: 45% !important;
    }

        .ui-picklist .ui-picklist-listwrapper .ui-picklist-caption {
            background-color: transparent;
            color: #212121;
            text-transform: lowercase;
            font-size: 12px;
            font-weight: 600;
            border: none;
            padding: 0;
            border-radius: 0 !important;
        }

        .ui-picklist .ui-picklist-listwrapper .ui-picklist-filter-container {
            padding: 0;
            border: none;
        }

            .ui-picklist .ui-picklist-listwrapper .ui-picklist-filter-container input.ui-picklist-filter {
                border-width: 1px;
                border-color: #e0e0e0;
                padding: 1rem 1.5rem;
                height: 46px;
                font-size: 14px;
                border-radius: 0 !important;
            }

                .ui-picklist .ui-picklist-listwrapper .ui-picklist-filter-container input.ui-picklist-filter:focus {
                    border-color: #1e88e5;
                    -webkit-box-shadow: 0 0 0 0.2rem rgba(30, 136, 229, 0.25);
                    box-shadow: 0 0 0 0.2rem rgba(30, 136, 229, 0.25);
                }

        .ui-picklist .ui-picklist-listwrapper .ui-picklist-list {
            border-width: 1px;
            border-color: #e0e0e0;
            border-top: none;
            border-radius: 0 !important;
        }

            .ui-picklist .ui-picklist-listwrapper .ui-picklist-list li {
                display: none;
            }

                .ui-picklist .ui-picklist-listwrapper .ui-picklist-list li.ui-picklist-item {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    padding: 1rem;
                }

                    .ui-picklist .ui-picklist-listwrapper .ui-picklist-list li.ui-picklist-item.ui-state-highlight {
                        background-color: #1e88e5;
                    }

.mat-tooltip-panel .mat-tooltip {
    font-size: 12px !important;
    border-radius: 1rem;
}

.mat-autocomplete-panel .mat-option,
.mat-select-panel .mat-option {
    height: 40px;
    line-height: 40px;
    padding: 0 1rem;
}

.mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-label .mat-slide-toggle-bar {
    background-color: rgba(0, 212, 90, 0.5);
}

    .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-label .mat-slide-toggle-bar .mat-slide-toggle-thumb-container .mat-slide-toggle-thumb {
        background-color: #00d45a;
    }

.mat-ripple-element {
    background-color: rgba(0, 212, 90, 0.1) !important;
}

.bg-crol {
    background: #00d45a !important;
}

    .bg-crol.btn {
        border: none !important;
    }

.bg-crolLT {
    background: #08e465 !important;
}

.bg-crolDK {
    background: #00be51 !important;
}

.bg-crol-x {
    background: #00d45a !important;
    background: -webkit-gradient(linear, right top, left top, from(#00d45a), to(#00be51)) !important;
    background: linear-gradient(to left, #00d45a, #00be51) !important;
}

    .bg-crol-x.btn {
        border: none !important;
    }

.bg-crol-y {
    background: #00d45a;
    background: -webkit-gradient(linear, left top, left bottom, from(#00d45a), to(#00be51)) !important;
    background: linear-gradient(to bottom, #00d45a, #00be51) !important;
}

    .bg-crol-y.btn {
        border: none !important;
    }

.bg-blue {
    background-color: #1e88e5 !important;
}

    .bg-blue.btn {
        border: none !important;
    }

.bg-carbon {
    background: #333;
}

.bg-carbonDK {
    background: #212121;
}

button {
    background-color: transparent;
    border: none;
    outline: none !important;
    font-size: 14px;
}

    button:not([disabled]):focus {
        border: none;
        outline: none !important;
    }

    button[disabled] {
        opacity: 1 !important;
        color: rgba(0, 0, 0, 0.2) !important;
        border-color: rgba(0, 0, 0, 0.2) !important;
    }

.btn {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 1.5rem;
    height: 46px;
    font-size: 18px;
    font-weight: 500;
    white-space: nowrap;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    line-height: 1;
    border-radius: 1rem;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    overflow: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    position: relative;
}

    .btn:not([disabled]):focus {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .btn:after {
        content: "";
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        pointer-events: none;
        background-image: radial-gradient(circle, #000 10%, transparent 10.01%);
        background-repeat: no-repeat;
        background-position: 50%;
        -webkit-transform: scale(10, 10);
        transform: scale(10, 10);
        opacity: 0;
        -webkit-transition: opacity 1s, -webkit-transform .5s;
        transition: opacity 1s, -webkit-transform .5s;
        transition: transform .5s, opacity 1s;
        transition: transform .5s, opacity 1s, -webkit-transform .5s;
    }

    .btn:active:after {
        -webkit-transform: scale(0, 0);
        transform: scale(0, 0);
        opacity: .2;
        -webkit-transition: 0s;
        transition: 0s;
    }

    .btn > i.left, .btn i.right {
        position: absolute;
        width: 46px;
        height: 46px;
        top: 0;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        font-size: 22px;
    }

    .btn > i.left {
        left: 0;
    }

    .btn > i.right {
        right: 0;
    }

    .btn .mat-spinner {
        width: 26px !important;
        height: 26px !important;
    }

        .btn .mat-spinner svg {
            width: 26px !important;
            height: 26px !important;
        }

            .btn .mat-spinner svg * {
                stroke: white !important;
            }

    .btn.btn-sm {
        height: 36px;
        font-size: 14px;
    }

    .btn.btn-lg {
        font-weight: 700;
    }

.btn-flat {
    border-radius: 0;
}

.btn-icon {
    width: 48px;
    height: 48px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 48px;
    -ms-flex: 0 0 48px;
    flex: 0 0 48px;
    padding: 0;
}

    .btn-icon .material-icons {
        width: 24px;
        font-size: 24px;
    }

.btn-pill {
    border-radius: 500px;
}

.btn-round {
    border-radius: 50%;
}

.no-shadow {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn-crol {
    color: #ffffff !important;
    background: #00d45a !important;
    -webkit-box-shadow: 0 14px 26px -12px rgba(0, 212, 90, 0.42), 0 4px 23px 0 rgba(0, 212, 90, 0.22), 0 8px 10px -5px rgba(0, 212, 90, 0.2);
    box-shadow: 0 14px 26px -12px rgba(0, 212, 90, 0.42), 0 4px 23px 0 rgba(0, 212, 90, 0.22), 0 8px 10px -5px rgba(0, 212, 90, 0.2);
}

    .btn-crol:not([disabled]):hover, .btn-crol:not([disabled]):focus, .btn-crol:not([disabled]):active, .btn-crol:active:not([disabled]):focus {
        color: #ffffff !important;
        background-color: #00d45a !important;
    }

.btn-default {
    color: #00d45a !important;
    background-color: transparent !important;
}

    .btn-default:not([disabled]):hover, .btn-default:not([disabled]):focus, .btn-default:not([disabled]):active, .btn-default:active:not([disabled]):focus {
        color: #00d45a !important;
        background-color: transparent !important;
    }

.btn-primary {
    color: #ffffff !important;
    background-color: #1e88e5 !important;
    -webkit-box-shadow: 0 14px 26px -12px rgba(30, 136, 229, 0.42), 0 4px 23px 0 rgba(30, 136, 229, 0.22), 0 8px 10px -5px rgba(30, 136, 229, 0.2);
    box-shadow: 0 14px 26px -12px rgba(30, 136, 229, 0.42), 0 4px 23px 0 rgba(30, 136, 229, 0.22), 0 8px 10px -5px rgba(30, 136, 229, 0.2);
}

    .btn-primary:not([disabled]):hover, .btn-primary:not([disabled]):focus, .btn-primary:not([disabled]):active, .btn-primary:active:not([disabled]):focus {
        color: #ffffff !important;
        background-color: #1976d2 !important;
    }

.btn-success {
    color: #ffffff !important;
    background-color: #28b52e;
    border-color: #28b52e;
    -webkit-box-shadow: 0 14px 26px -12px rgba(40, 181, 46, 0.42), 0 4px 23px 0 rgba(40, 181, 46, 0.22), 0 8px 10px -5px rgba(40, 181, 46, 0.2);
    box-shadow: 0 14px 26px -12px rgba(40, 181, 46, 0.42), 0 4px 23px 0 rgba(40, 181, 46, 0.22), 0 8px 10px -5px rgba(40, 181, 46, 0.2);
}

    .btn-success:not([disabled]):hover, .btn-success:not([disabled]):focus, .btn-success:not([disabled]):active, .btn-success:active:not([disabled]):focus {
        color: #ffffff !important;
        background-color: #18a21d !important;
        border-color: #18a21d !important;
    }

.btn-warning {
    color: #ffffff !important;
    background-color: #ffa000;
    border-color: #ffa000;
    -webkit-box-shadow: 0 14px 26px -12px rgba(255, 160, 0, 0.42), 0 4px 23px 0 rgba(255, 160, 0, 0.22), 0 8px 10px -5px rgba(255, 160, 0, 0.2);
    box-shadow: 0 14px 26px -12px rgba(255, 160, 0, 0.42), 0 4px 23px 0 rgba(255, 160, 0, 0.22), 0 8px 10px -5px rgba(255, 160, 0, 0.2);
}

    .btn-warning:not([disabled]):hover, .btn-warning:not([disabled]):focus, .btn-warning:not([disabled]):active, .btn-warning:active:not([disabled]):focus {
        color: #ffffff !important;
        background-color: #e59000 !important;
        border-color: #e59000 !important;
    }

.btn-danger {
    color: #ffffff !important;
    background-color: #e02626 !important;
    border-color: #e02626 !important;
    -webkit-box-shadow: 0 14px 26px -12px rgba(224, 38, 38, 0.42), 0 4px 23px 0 rgba(224, 38, 38, 0.22), 0 8px 10px -5px rgba(224, 38, 38, 0.2);
    box-shadow: 0 14px 26px -12px rgba(224, 38, 38, 0.42), 0 4px 23px 0 rgba(224, 38, 38, 0.22), 0 8px 10px -5px rgba(224, 38, 38, 0.2);
}

    .btn-danger:not([disabled]):hover, .btn-danger:not([disabled]):focus, .btn-danger:not([disabled]):active, .btn-danger:active:not([disabled]):focus {
        color: #ffffff !important;
        background-color: #b71c1c !important;
        border-color: #b71c1c !important;
    }

.btn-magenta {
    color: #ffffff !important;
    background-color: #e91e63 !important;
    border-color: #e91e63 !important;
    -webkit-box-shadow: 0 14px 26px -12px rgba(233, 30, 99, 0.42), 0 4px 23px 0 rgba(233, 30, 99, 0.22), 0 8px 10px -5px rgba(233, 30, 99, 0.2);
    box-shadow: 0 14px 26px -12px rgba(233, 30, 99, 0.42), 0 4px 23px 0 rgba(233, 30, 99, 0.22), 0 8px 10px -5px rgba(233, 30, 99, 0.2);
}

    .btn-magenta:not([disabled]):hover, .btn-magenta:not([disabled]):focus, .btn-magenta:not([disabled]):active, .btn-magenta:active:not([disabled]):focus {
        color: #ffffff !important;
        background-color: #d81b60 !important;
        border-color: #d81b60 !important;
    }

.btn-facebook {
    color: #ffffff !important;
    background-color: #3b5998 !important;
    border-color: #3b5998 !important;
    -webkit-box-shadow: 0 14px 26px -12px rgba(59, 89, 152, 0.42), 0 4px 23px 0 rgba(59, 89, 152, 0.22), 0 8px 10px -5px rgba(59, 89, 152, 0.2);
    box-shadow: 0 14px 26px -12px rgba(59, 89, 152, 0.42), 0 4px 23px 0 rgba(59, 89, 152, 0.22), 0 8px 10px -5px rgba(59, 89, 152, 0.2);
}

    .btn-facebook:not([disabled]):hover, .btn-facebook:not([disabled]):focus, .btn-facebook:not([disabled]):active, .btn-facebook:active:not([disabled]):focus {
        color: #ffffff !important;
        background-color: #3b5998 !important;
        border-color: #3b5998 !important;
    }

.btn-twitter {
    color: #ffffff !important;
    background-color: #00b6f1 !important;
    border-color: #00b6f1 !important;
    -webkit-box-shadow: 0 14px 26px -12px rgba(0, 182, 241, 0.42), 0 4px 23px 0 rgba(0, 182, 241, 0.22), 0 8px 10px -5px rgba(0, 182, 241, 0.2);
    box-shadow: 0 14px 26px -12px rgba(0, 182, 241, 0.42), 0 4px 23px 0 rgba(0, 182, 241, 0.22), 0 8px 10px -5px rgba(0, 182, 241, 0.2);
}

    .btn-twitter:not([disabled]):hover, .btn-twitter:not([disabled]):focus, .btn-twitter:not([disabled]):active, .btn-twitter:active:not([disabled]):focus {
        color: #ffffff !important;
        background-color: #00b6f1 !important;
        border-color: #00b6f1 !important;
    }

.btn-google {
    color: #ffffff !important;
    background-color: #df4a32 !important;
    border-color: #df4a32 !important;
    -webkit-box-shadow: 0 14px 26px -12px rgba(223, 74, 50, 0.42), 0 4px 23px 0 rgba(223, 74, 50, 0.22), 0 8px 10px -5px rgba(223, 74, 50, 0.2);
    box-shadow: 0 14px 26px -12px rgba(223, 74, 50, 0.42), 0 4px 23px 0 rgba(223, 74, 50, 0.22), 0 8px 10px -5px rgba(223, 74, 50, 0.2);
}

    .btn-google:not([disabled]):hover, .btn-google:not([disabled]):focus, .btn-google:not([disabled]):active, .btn-google:active:not([disabled]):focus {
        color: #ffffff !important;
        background-color: #df4a32 !important;
        border-color: #df4a32 !important;
    }

.btn-outline-crol {
    color: #1e88e5;
    border: 1px solid #1e88e5 !important;
    background-color: transparent !important;
}

    .btn-outline-crol:hover, .btn-outline-crol:active {
        color: #FFF;
        background-color: #1e88e5 !important;
    }

.btn-outline-primary {
    color: #1e88e5;
    border: 1px solid #1e88e5 !important;
    background-color: transparent !important;
}

    .btn-outline-primary:hover, .btn-outline-primary:active {
        color: #FFF;
        background-color: #1e88e5 !important;
    }

.btn-outline-white {
    color: #FFF;
    border: 1px solid #FFF !important;
    background-color: transparent !important;
}

    .btn-outline-white:hover, .btn-outline-white:active {
        color: #FFF;
        background-color: #FFF;
    }

.btn-invoices {
    background-color: #2196f3 !important;
    border: 2px solid #1e88e5 !important;
    color: white;
    font-size: 16px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: auto;
    width: 100%;
    cursor: not-allowed !important;
}

    .btn-invoices.done {
        background-color: #00d45a !important;
        border: 2px solid #00d45a !important;
        cursor: pointer;
    }

        .btn-invoices.done i {
            color: white;
        }

    .btn-invoices:hover {
        color: white;
    }

ion-app .button {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    height: 40px;
    padding: 0 0.65rem;
    margin: 0;
    border-radius: 1rem;
    font-size: 14px;
    font-weight: 500;
    text-transform: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

    ion-app .button[icon-only] {
        width: 40px;
        height: 40px;
        padding: 0.25rem;
    }

        ion-app .button[icon-only] i {
            font-size: 22px;
        }

    ion-app .button[color="secondary"] {
        background-color: #ffa000;
    }

        ion-app .button[color="secondary"].activated {
            background-color: #ffa000;
        }

        ion-app .button[color="secondary"]:hover:not(.disable-hover) {
            background-color: #ffa000;
        }

    ion-app .button.button-outline {
        border-width: 1px;
        background-color: transparent;
    }

        ion-app .button.button-outline[disabled] {
            border-color: #bdbdbd !important;
            color: #bdbdbd !important;
        }

        ion-app .button.button-outline[color="primary"] {
            border-color: #1e88e5;
            color: #1e88e5;
        }

            ion-app .button.button-outline[color="primary"].activated {
                color: white;
                background-color: #1e88e5;
            }

        ion-app .button.button-outline[color="secondary"] {
            border-color: #ffa000;
            color: #ffa000;
        }

            ion-app .button.button-outline[color="secondary"].activated {
                border-color: #ffa000;
                color: #ffa000;
                background-color: transparent;
            }

        ion-app .button.button-outline[color="mint"] {
            border-color: #00796b;
            color: #00796b;
        }

            ion-app .button.button-outline[color="mint"].activated {
                color: white;
                background-color: #00796b;
            }

        ion-app .button.button-outline[color="cerofila"] {
            border-color: #1e88e5;
            color: #1e88e5;
        }

            ion-app .button.button-outline[color="cerofila"].activated {
                color: white;
                background-color: #1e88e5;
            }

ion-app .button-md,
ion-app [class^="button-md-"],
ion-app .button-ios,
ion-app [class^="button-ios-"] {
    border-radius: 1rem;
    overflow: initial;
    height: 40px;
    font-size: 14px;
    font-weight: 500;
    text-transform: initial;
    color: initial;
    background-color: initial;
    -webkit-box-shadow: initial;
    box-shadow: initial;
    -webkit-transition: initial;
    transition: initial;
    margin: initial;
    padding: 0 0.65rem;
}

    ion-app .button-md.activated,
    ion-app [class^="button-md-"].activated,
    ion-app .button-ios.activated,
    ion-app [class^="button-ios-"].activated {
        background-color: initial;
        -webkit-box-shadow: initial;
        box-shadow: initial;
    }

    ion-app .button-md:not(.button-outline),
    ion-app [class^="button-md-"]:not(.button-outline),
    ion-app .button-ios:not(.button-outline),
    ion-app [class^="button-ios-"]:not(.button-outline) {
        color: white;
    }

/*  BORDERS
============================================== */
.no-border {
    border-color: transparent;
    border-width: 0;
}

.no-borders {
    border-width: 0 !important;
}

.b {
    border-color: rgba(0, 0, 0, 0.15);
    background-clip: padding-box;
}

.b-a {
    border: 1px solid #e0e0e0;
}

.b-t {
    border-top: 1px solid r #e0e0e0;
}

.b-r {
    border-right: 1px solid #e0e0e0;
}

.b-b {
    border-bottom: 1px solid #e0e0e0;
}

.b-l {
    border-left: 1px solid #e0e0e0;
}

.b-2x {
    border-width: 1px;
}

.b-3x {
    border-width: 3px;
}

.b-4x {
    border-width: 4px;
}

.b-5x {
    border-width: 5px;
}

.b-t-2x {
    border-top-width: 2px !important;
}

.b-t-3x {
    border-top-width: 3px !important;
}

.b-t-4x {
    border-top-width: 4px !important;
}

.b-t-5x {
    border-top-width: 5px !important;
}

.b-r-2x {
    border-right-width: 2px !important;
}

.b-r-3x {
    border-right-width: 3px !important;
}

.b-r-4x {
    border-right-width: 4px !important;
}

.b-r-5x {
    border-right-width: 5px !important;
}

.b-b-2x {
    border-bottom-width: 2px !important;
}

.b-b-3x {
    border-bottom-width: 3px !important;
}

.b-b-4x {
    border-bottom-width: 4px !important;
}

.b-b-5x {
    border-bottom-width: 5px !important;
}

.b-l-2x {
    border-left-width: 2px !important;
}

.b-l-3x {
    border-left-width: 3px !important;
}

.b-l-4x {
    border-left-width: 4px !important;
}

.b-l-5x {
    border-left-width: 5px !important;
}

.b-primary {
    border-color: #0cc2aa;
}

.b-t-primary {
    border-top-color: #0cc2aa;
}

.b-r-#e7f9f7 {
    border-right-color: #0cc2aa;
}

.b-b-primary {
    border-bottom-color: #0cc2aa;
}

.b-l-primary {
    border-left-color: #0cc2aa;
}

.b-accent {
    border-color: #a88add;
}

.b-t-accent {
    border-top-color: #a88add;
}

.b-r-#f6f3fc {
    border-right-color: #a88add;
}

.b-b-accent {
    border-bottom-color: #a88add;
}

.b-l-accent {
    border-left-color: #a88add;
}

.b-warn {
    border-color: #fcc100;
}

.b-t-warn {
    border-top-color: #fcc100;
}

.b-r-#fff9e6 {
    border-right-color: #fcc100;
}

.b-b-warn {
    border-bottom-color: #fcc100;
}

.b-l-warn {
    border-left-color: #fcc100;
}

.b-success {
    border-color: #6cc788;
}

.b-t-success {
    border-top-color: #6cc788;
}

.b-r-#f0f9f3 {
    border-right-color: #6cc788;
}

.b-b-success {
    border-bottom-color: #6cc788;
}

.b-l-success {
    border-left-color: #6cc788;
}

.b-info {
    border-color: #6887ff;
}

.b-t-info {
    border-top-color: #6887ff;
}

.b-r-#f0f3ff {
    border-right-color: #6887ff;
}

.b-b-info {
    border-bottom-color: #6887ff;
}

.b-l-info {
    border-left-color: #6887ff;
}

.b-warning {
    border-color: #f77a99;
}

.b-t-warning {
    border-top-color: #f77a99;
}

.b-r-#fef2f5 {
    border-right-color: #f77a99;
}

.b-b-warning {
    border-bottom-color: #f77a99;
}

.b-l-warning {
    border-left-color: #f77a99;
}

.b-danger {
    border-color: #f44455;
}

.b-t-danger {
    border-top-color: #f44455;
}

.b-r-#feecee {
    border-right-color: #f44455;
}

.b-b-danger {
    border-bottom-color: #f44455;
}

.b-l-danger {
    border-left-color: #f44455;
}

.b-light {
    border-color: #f8f8f8;
}

.b-t-light {
    border-top-color: #f8f8f8;
}

.b-r-#fefefe {
    border-right-color: #f8f8f8;
}

.b-b-light {
    border-bottom-color: #f8f8f8;
}

.b-l-light {
    border-left-color: #f8f8f8;
}

.b-grey {
    border-color: #424242;
}

.b-t-grey {
    border-top-color: #424242;
}

.b-r-#ececec {
    border-right-color: #424242;
}

.b-b-grey {
    border-bottom-color: #424242;
}

.b-l-grey {
    border-left-color: #424242;
}

.b-dark {
    border-color: #2e3e4e;
}

.b-t-dark {
    border-top-color: #2e3e4e;
}

.b-r-#eaeced {
    border-right-color: #2e3e4e;
}

.b-b-dark {
    border-bottom-color: #2e3e4e;
}

.b-l-dark {
    border-left-color: #2e3e4e;
}

.b-black {
    border-color: #2a2b3c;
}

.b-t-black {
    border-top-color: #2a2b3c;
}

.b-r-#eaeaec {
    border-right-color: #2a2b3c;
}

.b-b-black {
    border-bottom-color: #2a2b3c;
}

.b-l-black {
    border-left-color: #2a2b3c;
}

.b-white {
    border-color: #fff;
}

.b-t-white {
    border-top-color: #fff;
}

.b-r-white {
    border-right-color: #fff;
}

.b-b-white {
    border-bottom-color: #fff;
}

.b-l-white {
    border-left-color: #fff;
}

.b-blue {
    border-color: #2196f3;
}

.b-t-blue {
    border-top-color: #2196f3;
}

.b-r-#e9f5fe {
    border-right-color: #2196f3;
}

.b-b-blue {
    border-bottom-color: #2196f3;
}

.b-l-blue {
    border-left-color: #2196f3;
}

.no-b-t {
    border-top-width: 0;
}

.no-b-r {
    border-right-width: 0;
}

.no-b-b {
    border-bottom-width: 0;
}

.no-b-l {
    border-left-width: 0;
}

.b-dashed {
    border-style: dashed !important;
}

.bs-l {
    -webkit-box-shadow: inset 1px 0px 0px 0px rgba(0, 0, 0, 0.05);
    box-shadow: inset 1px 0px 0px 0px rgba(0, 0, 0, 0.05);
}

.bs-r {
    -webkit-box-shadow: inset -1px 0px 0px 0px rgba(0, 0, 0, 0.05);
    box-shadow: inset -1px 0px 0px 0px rgba(0, 0, 0, 0.05);
}

.card {
    margin-bottom: 2rem;
    border: none;
    -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    -webkit-transition: all 0.15s ease;
    transition: all 0.15s ease;
    -webkit-animation-fill-mode: none !important;
    animation-fill-mode: none !important;
    border-radius: 1rem;
}

    .card .card-header {
        border-radius: 0.5rem 0.5rem 0 0;
        padding: 1rem;
    }

    .card .card-body {
        padding: 1rem;
    }

        .card .card-body .decor-title {
            color: #FFF;
            font-size: 20px;
            padding: 10px 28px;
            display: -webkit-inline-box;
            display: -webkit-inline-flex;
            display: -ms-inline-flexbox;
            display: inline-flex;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            white-space: nowrap;
            border-radius: 22px;
            background-color: #00d45a;
            -webkit-box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.15), 0 0px 20px -5px rgba(150, 150, 150, 0.35);
            box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.15), 0 0px 20px -5px rgba(150, 150, 150, 0.35);
        }

    .card .card-footer {
        padding: 1rem;
        border-radius: 0 0 0.5rem 0.5rem;
    }

input:focus,
textarea:focus,
*:-webkit-autofill:focus {
    outline: none;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}

input[type=number] {
    text-align: right;
}

    input[type=number]::-webkit-inner-spin-button,
    input[type=number]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

input::-webkit-input-placeholder {
    font-size: 16px !important;
    letter-spacing: 0 !important;
}

input::-moz-placeholder {
    font-size: 16px !important;
    letter-spacing: 0 !important;
}

input::-ms-input-placeholder {
    font-size: 16px !important;
    letter-spacing: 0 !important;
}

input::placeholder {
    font-size: 16px !important;
    letter-spacing: 0 !important;
}

input.mask-input {
    -webkit-text-security: disc !important;
    -moz-webkit-text-security: disc !important;
    -moz-text-security: disc !important;
}

.form-control {
    border-width: 1px;
    border-color: #e0e0e0;
    padding: 0 1rem;
    height: 46px;
    font-size: 16px;
    border-radius: 1rem;
}

    .form-control:focus {
        border-color: #00d45a;
        -webkit-box-shadow: 0 0 0 0.25rem rgba(0, 212, 90, 0.25);
        box-shadow: 0 0 0 0.25rem rgba(0, 212, 90, 0.25);
    }

    .form-control.is-invalid {
        border-color: #e02626;
        background: none;
    }

textarea.form-control {
    padding: 1rem;
    resize: none;
}

.mat-form-control {
    display: block !important;
    margin-bottom: 0;
}

    .mat-form-control .mat-select-value-text {
        text-transform: capitalize;
    }

    .mat-form-control .mat-form-field-wrapper {
        padding-bottom: 0;
    }

        .mat-form-control .mat-form-field-wrapper .mat-form-field-flex {
            border: 1px solid #e0e0e0;
            border-radius: 1rem;
            position: relative;
            height: 46px;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-transition: border-color 0.15s ease, -webkit-box-shadow 0.3s ease;
            transition: border-color 0.15s ease, -webkit-box-shadow 0.3s ease;
            transition: border-color 0.15s ease, box-shadow 0.3s ease;
            transition: border-color 0.15s ease, box-shadow 0.3s ease, -webkit-box-shadow 0.3s ease;
        }

            .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix {
                width: 100%;
                height: 42px;
                padding: 0;
                border: none;
            }

                .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-select {
                    font-size: 16px;
                    height: 42px;
                }

                    .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-select .mat-select-trigger {
                        height: 42px;
                    }

                        .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-select .mat-select-trigger .mat-select-value {
                            padding-left: 1.5rem;
                            vertical-align: middle;
                        }

                        .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-select .mat-select-trigger .mat-select-arrow-wrapper .mat-select-arrow {
                            margin: 0 1.5rem;
                        }

                    .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-select.mat-select-disabled {
                        opacity: 0.4;
                    }

                .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-input-element {
                    font-size: 16px;
                    height: 42px;
                    margin: 0;
                    padding: 0.25rem 1.5rem;
                    border-radius: 1rem;
                }

                .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper {
                    top: 0;
                    padding-top: 0;
                    overflow: visible;
                }

                    .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
                        font-size: 16px;
                        font-weight: 500;
                        top: 12px;
                        left: 1rem;
                        padding: 0 5px;
                        width: auto;
                        background: white;
                        -webkit-transition-property: color, width, font-size, -webkit-transform;
                        transition-property: color, width, font-size, -webkit-transform;
                        transition-property: transform, color, width, font-size;
                        transition-property: transform, color, width, font-size, -webkit-transform;
                    }

        .mat-form-control .mat-form-field-wrapper .mat-form-field-underline {
            display: none;
            visibility: visible;
            z-index: -999;
        }

        .mat-form-control .mat-form-field-wrapper .mat-form-field-subscript-wrapper {
            margin-top: 0;
            top: calc(100% - 30px);
            text-align: right;
        }

            .mat-form-control .mat-form-field-wrapper .mat-form-field-subscript-wrapper .mat-error {
                display: inline-block;
                background: white;
                padding: 0 5px;
                margin-right: 0.5rem;
            }

    .mat-form-control.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
        -webkit-transform: translateY(-20px) scale(0.75) perspective(100px) translateZ(0.001px);
        transform: translateY(-20px) scale(0.75) perspective(100px) translateZ(0.001px);
    }

    .mat-form-control.mat-focused .mat-form-field-wrapper .mat-form-field-flex {
        border-color: #00d45a;
        -webkit-box-shadow: 0 0 0 0.25rem rgba(0, 212, 90, 0.25);
        box-shadow: 0 0 0 0.25rem rgba(0, 212, 90, 0.25);
    }

        .mat-form-control.mat-focused .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
            color: #00d45a;
        }

    .mat-form-control.mat-form-field-invalid .mat-form-field-wrapper .mat-form-field-flex {
        border-color: #e02626;
        -webkit-box-shadow: 0 0 0 0.25rem rgba(224, 38, 38, 0.25);
        box-shadow: 0 0 0 0.25rem rgba(224, 38, 38, 0.25);
    }

        .mat-form-control.mat-form-field-invalid .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
            color: #e02626;
        }

    .mat-form-control.mat-form-sm .mat-form-field-wrapper {
        padding-bottom: 0;
    }

        .mat-form-control.mat-form-sm .mat-form-field-wrapper .mat-form-field-flex {
            height: 36px;
        }

            .mat-form-control.mat-form-sm .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix {
                height: 36px;
            }

                .mat-form-control.mat-form-sm .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-select {
                    height: 36px;
                    font-size: 14px;
                }

                    .mat-form-control.mat-form-sm .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-select .mat-select-trigger {
                        height: 36px;
                    }

                .mat-form-control.mat-form-sm .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-input-element {
                    height: 36px;
                    font-size: 14px;
                }

                .mat-form-control.mat-form-sm .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper {
                    top: 0;
                    padding-top: 0;
                    overflow: visible;
                }

                    .mat-form-control.mat-form-sm .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
                        top: 10px;
                    }

    .mat-form-control.mat-form-sm.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
        -webkit-transform: translateY(-15px) scale(0.75) perspective(100px) translateZ(0.001px);
        transform: translateY(-15px) scale(0.75) perspective(100px) translateZ(0.001px);
    }

    .mat-form-control.mat-form-sm.mat-focused .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
        color: #00d45a;
    }

    .mat-form-control.mat-form-sm.mat-form-field-invalid .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
        color: #e02626;
    }

    .mat-form-control.mat-form-field-disabled .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
        opacity: 0.5;
    }

    .mat-form-control.bg-crol .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
        background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, #1d82df), color-stop(50%, #338ee1));
        background: linear-gradient(to bottom, #1d82df 50%, #338ee1 50%);
        color: rgba(255, 255, 255, 0.5);
    }

        .mat-form-control.bg-crol .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label .active {
            color: white;
        }

.form-group {
    margin: 0.5rem 0 1rem;
    position: relative;
}

    .form-group.inline-form-group {
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

        .form-group.inline-form-group .mat-form-control {
            -webkit-box-flex: 0 !important;
            -webkit-flex: 0 0 calc(50% - 0.5rem) !important;
            -ms-flex: 0 0 calc(50% - 0.5rem) !important;
            flex: 0 0 calc(50% - 0.5rem) !important;
        }

.input-group-append {
    margin-top: -1px;
}

.mat-select-panel .mat-option {
    text-transform: capitalize;
}

    .mat-select-panel .mat-option.mat-selected:not(.mat-option-disabled) {
        color: #00be51 !important;
        background: rgba(0, 0, 0, 0.05) !important;
    }

.mat-option.contains-mat-select-search {
    height: 40px;
}

    .mat-option.contains-mat-select-search .mat-select-search-input {
        font-size: 14px;
        height: 40px;
        line-height: 40px;
    }

    .mat-option.contains-mat-select-search .mat-select-search-inner .mat-select-search-input {
        font-size: 14px;
        height: 40px;
        line-height: 40px;
    }

.mat-autocomplete-panel .mat-option {
    font-size: 14px !important;
}

@media (max-width: 480px) {
    .mat-autocomplete-panel .mat-option {
        height: 40px;
        padding: 0 0.75rem;
    }
}

.mat-autocomplete-panel .mat-option .mat-option-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

@media (max-width: 480px) {
    .mat-autocomplete-panel .mat-option .mat-option-text {
        font-size: 12px;
    }
}

.mat-autocomplete-panel .mat-option .mat-option-text .img {
    width: 40px;
    height: 25px;
    display: block;
    margin-right: 0.5rem;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.table tbody td .mat-form-control {
    width: 100%;
    max-width: 100%;
    height: 36px;
    padding: 5px 0.5rem;
    background-color: white;
    position: relative;
    border-radius: 1rem;
    text-align: left;
}

    .table tbody td .mat-form-control .mat-select-value {
        padding-left: 0 !important;
    }

.mat-checkbox .mat-checkbox-inner-container {
    width: 18px;
    height: 18px;
}

    .mat-checkbox .mat-checkbox-inner-container .mat-checkbox-frame {
        border-color: #e0e0e0;
        border-width: 1px;
    }

.mat-checkbox.mat-checkbox-checked .mat-checkbox-inner-container .mat-checkbox-background {
    background-color: #00d45a;
}

.mat-checkbox:not(.mat-checkbox-disabled).mat-accent .mat-checkbox-ripple .mat-ripple-element {
    background-color: rgba(0, 212, 90, 0.2);
}

.mat-radio-button.mat-radio-checked .mat-radio-label .mat-radio-container .mat-radio-outer-circle {
    border-color: #00d45a;
}

.mat-radio-button.mat-radio-checked .mat-radio-label .mat-radio-container .mat-radio-inner-circle {
    background-color: #00d45a;
}

.mat-slide-toggle {
    margin-right: 5px;
}

    .mat-slide-toggle .mat-slide-toggle-label {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
    }

        .mat-slide-toggle .mat-slide-toggle-label .mat-slide-toggle-bar {
            margin-right: 0;
            margin-left: 0.5rem;
        }

        .mat-slide-toggle .mat-slide-toggle-label .mat-slide-toggle-content {
            font-size: 14px;
        }

    .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-label .mat-slide-toggle-bar {
        background-color: rgba(0, 212, 90, 0.5);
    }

        .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-label .mat-slide-toggle-bar .mat-slide-toggle-thumb-container .mat-slide-toggle-thumb {
            background-color: #00d45a;
        }

.mat-ripple-element {
    background-color: rgba(0, 212, 90, 0.1) !important;
}

p-inputmask {
    display: block;
}

    p-inputmask .ui-inputtext {
        width: 100%;
        border-width: 1px;
        border-color: #e0e0e0;
        padding: 1rem 1.5rem;
        height: 46px;
        font-size: 14px;
        border-radius: 0;
        text-transform: uppercase;
    }

        p-inputmask .ui-inputtext:focus {
            border-color: #00d45a;
            -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
            box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
        }

        p-inputmask .ui-inputtext:hover {
            border: 1px solid #e0e0e0;
        }

    p-inputmask.ui-inputwrapper-focus.ng-invalid .ui-inputtext {
        border: 1px solid #e02626;
        -webkit-box-shadow: 0 0 0 0.2rem rgba(224, 38, 38, 0.25);
        box-shadow: 0 0 0 0.2rem rgba(224, 38, 38, 0.25);
    }

    p-inputmask.ui-inputwrapper-focus .ui-inputtext {
        border: 1px solid #e0e0e0;
    }

.mat-slide-toggle.sidemenu-toggle {
    z-index: 8;
    margin-top: 0.5rem;
    height: 46px;
}

    .mat-slide-toggle.sidemenu-toggle .mat-slide-toggle-label {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        padding: 0 1.5rem;
    }

        .mat-slide-toggle.sidemenu-toggle .mat-slide-toggle-label .mat-slide-toggle-bar {
            width: 36px;
            margin-left: 0;
            margin-right: 1rem;
        }

        .mat-slide-toggle.sidemenu-toggle .mat-slide-toggle-label .mat-slide-toggle-content {
            font-size: 16px;
            font-weight: 500;
        }

.shortcut-checkbox .mat-checkbox-layout .mat-checkbox-label {
    font-size: 16px;
    font-weight: 600;
    line-height: 18px;
}

    .shortcut-checkbox .mat-checkbox-layout .mat-checkbox-label small {
        display: block;
        white-space: normal;
    }

.layer-informativa .mat-slide-toggle-label {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.form-toggle.mat-slide-toggle .mat-slide-toggle-label {
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: normal !important;
    -webkit-flex-direction: row !important;
    -ms-flex-direction: row !important;
    flex-direction: row !important;
}

    .form-toggle.mat-slide-toggle .mat-slide-toggle-label .mat-slide-toggle-bar {
        margin-left: 0;
        margin-right: 1.5rem;
    }

.afectaciones-toggle {
    height: auto;
}

    .afectaciones-toggle .mat-slide-toggle-label {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        padding-left: 1rem;
    }

        .afectaciones-toggle .mat-slide-toggle-label .mat-slide-toggle-content {
            font-size: 12px;
            line-height: 1.2;
            padding-left: 1rem;
        }

    .afectaciones-toggle.bg-crol .mat-slide-toggle-label .mat-slide-toggle-content {
        color: white;
    }

    .afectaciones-toggle.accent.mat-checked:not(.mat-disabled) .mat-slide-toggle-label .mat-slide-toggle-bar {
        background-color: #e59000 !important;
    }

        .afectaciones-toggle.accent.mat-checked:not(.mat-disabled) .mat-slide-toggle-label .mat-slide-toggle-bar .mat-slide-toggle-thumb-container .mat-slide-toggle-thumb {
            background-color: #ffa000;
        }

ion-modal .modal-wrapper {
    background-color: #FFF;
    border-radius: 1rem !important;
}

    ion-modal .modal-wrapper .ion-page {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-flow: column;
        -ms-flex-flow: column;
        flex-flow: column;
    }

    ion-modal .modal-wrapper .page-wrapper {
        height: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-flow: column;
        -ms-flex-flow: column;
        flex-flow: column;
    }

        ion-modal .modal-wrapper .page-wrapper .page-header {
            background-color: white;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 60px;
            -ms-flex: 0 0 60px;
            flex: 0 0 60px;
            border-bottom: 1px solid rgba(0, 0, 0, 0.15);
        }

            ion-modal .modal-wrapper .page-wrapper .page-header .page-title {
                width: 100%;
                font-size: 22px;
                font-weight: 800;
                color: #212121;
                margin: 0;
                padding: 1rem 2rem;
                white-space: nowrap;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

            ion-modal .modal-wrapper .page-wrapper .page-header .toolbar {
                width: 60px;
                height: 60px;
                padding: 1rem;
                -webkit-flex-shrink: 0;
                -ms-flex-negative: 0;
                flex-shrink: 0;
                display: -webkit-inline-box;
                display: -webkit-inline-flex;
                display: -ms-inline-flexbox;
                display: inline-flex;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                padding: 1;
            }

                ion-modal .modal-wrapper .page-wrapper .page-header .toolbar .btn {
                    width: 40px;
                    height: 40px;
                    padding: 0;
                    color: #757575 !important;
                    background-color: transparent !important;
                    border-color: transparent !important;
                    font-size: 15px;
                    -webkit-transition: background-color 0.3s ease;
                    transition: background-color 0.3s ease;
                    -webkit-box-shadow: none !important;
                    box-shadow: none !important;
                }

                    ion-modal .modal-wrapper .page-wrapper .page-header .toolbar .btn:hover {
                        background-color: rgba(0, 0, 0, 0.05) !important;
                    }

                    ion-modal .modal-wrapper .page-wrapper .page-header .toolbar .btn i {
                        font-size: 24px;
                    }

        ion-modal .modal-wrapper .page-wrapper .page-body {
            height: calc(100% - 46px);
            overflow-y: auto;
            position: relative;
        }

            ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal {
                height: 100%;
            }

                ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-stepper-header-container {
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                }

                    ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header {
                        width: 100%;
                        height: 45px;
                        padding: 0 1rem;
                        -webkit-box-sizing: border-box;
                        box-sizing: border-box;
                        position: relative;
                        border-left: 1px solid #e0e0e0;
                        border-bottom: 1px solid #e0e0e0;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                    }

                        ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon {
                            width: 100%;
                            height: 100%;
                            position: absolute;
                            top: 0;
                            right: 0;
                            bottom: 0;
                            left: 0;
                            margin: 0;
                            border-radius: 0;
                            z-index: 0;
                            background-color: white;
                        }

                            ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon .mat-step-icon-content {
                                left: 0.25rem;
                                top: 0.25rem;
                                width: 24px;
                                height: 24px;
                                font-size: 12px;
                                -webkit-transform: none;
                                transform: none;
                                border-radius: 50%;
                                background-color: rgba(0, 0, 0, 0.15);
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-pack: center;
                                -webkit-justify-content: center;
                                -ms-flex-pack: center;
                                justify-content: center;
                                -webkit-box-align: center;
                                -webkit-align-items: center;
                                -ms-flex-align: center;
                                align-items: center;
                            }

                            ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon.mat-step-icon-selected {
                                background-color: #1e88e5;
                            }

                                ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon.mat-step-icon-selected ~ .mat-step-label.mat-step-label-active {
                                    color: white;
                                }

                        ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label.mat-step-label-active {
                            color: #333;
                            font-size: 12px;
                            font-weight: 700;
                            text-transform: uppercase;
                            position: relative;
                        }

                        ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header:first-of-type {
                            border-left: none;
                        }

                    ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-stepper-horizontal-line {
                        display: none;
                    }

                ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container {
                    height: calc(100% - 45px);
                    padding: 0;
                }

                    ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] {
                        height: 100%;
                    }

                        ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .messages {
                            padding: 0 1.5rem;
                            font-size: 12px;
                            color: #757575;
                        }

                        ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container {
                            height: calc(100% - 40px - 2rem);
                            padding: 1rem;
                        }

                            ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container hr {
                                margin: 1rem auto;
                            }

                            ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .step-title {
                                font-size: 16px;
                                text-align: center;
                                text-transform: uppercase;
                                margin: 1rem 0 1.5rem;
                            }

                            ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .form-group {
                                margin: 0;
                                padding: 0.5rem 1rem 1rem;
                            }

                            ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item {
                                padding: 0.5rem 1rem;
                            }

                                ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item label {
                                    font-size: 12px;
                                    font-weight: 600;
                                    text-transform: lowercase;
                                    margin-bottom: 0.25rem;
                                    height: 36px;
                                    display: -webkit-box;
                                    display: -webkit-flex;
                                    display: -ms-flexbox;
                                    display: flex;
                                    -webkit-box-align: end;
                                    -webkit-align-items: flex-end;
                                    -ms-flex-align: end;
                                    align-items: flex-end;
                                }

                                ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .file-container ngx-dropzone-image-preview ngx-dropzone-remove-badge,
                                ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .photo-container ngx-dropzone-image-preview ngx-dropzone-remove-badge {
                                    background: #e02626;
                                    color: white;
                                    top: 0;
                                    z-index: 99;
                                }

                                ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .file-container {
                                    height: 132px;
                                    border: 1px solid #e0e0e0;
                                    border-radius: 1rem;
                                    padding: 1rem;
                                    text-align: center;
                                    -webkit-transition: border-color 0.15s, -webkit-box-shadow 0.3s;
                                    transition: border-color 0.15s, -webkit-box-shadow 0.3s;
                                    transition: border-color 0.15s, box-shadow 0.3s;
                                    transition: border-color 0.15s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
                                    position: relative;
                                    cursor: pointer;
                                }

                                    ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .file-container i {
                                        font-size: 30px;
                                        color: #bdbdbd;
                                        -webkit-transition: opacity 0.15s;
                                        transition: opacity 0.15s;
                                        opacity: 0.6;
                                    }

                                    ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .file-container ngx-dropzone-image-preview {
                                        position: relative !important;
                                        width: 100%;
                                        height: 76px !important;
                                        min-height: 0 !important;
                                    }

                                        ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .file-container ngx-dropzone-image-preview img {
                                            display: none !important;
                                        }

                                        ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .file-container ngx-dropzone-image-preview ngx-dropzone-label {
                                            width: 100%;
                                            height: 70px;
                                            margin: 0 auto;
                                        }

                                            ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .file-container ngx-dropzone-image-preview ngx-dropzone-label h2 {
                                                line-height: 22px !important;
                                            }

                                            ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .file-container ngx-dropzone-image-preview ngx-dropzone-label .file-icon-container .file-icon {
                                                height: 70px;
                                                display: block !important;
                                                margin: 0 auto;
                                            }

                                        ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .file-container ngx-dropzone-image-preview ngx-dropzone-remove-badge {
                                            background: #e02626;
                                            color: white;
                                            top: 0;
                                        }

                                    ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .file-container:not(.disabled):hover {
                                        border-color: #1e88e5;
                                        -webkit-box-shadow: 0 0 0 0.2rem rgba(30, 136, 229, 0.25);
                                        box-shadow: 0 0 0 0.2rem rgba(30, 136, 229, 0.25);
                                    }

                                        ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .file-container:not(.disabled):hover i {
                                            opacity: 1;
                                        }

                                ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .photo-container {
                                    padding: 1rem;
                                    height: auto;
                                    min-height: 354px;
                                    max-height: 354px;
                                    -webkit-box-pack: center;
                                    -webkit-justify-content: center;
                                    -ms-flex-pack: center;
                                    justify-content: center;
                                }

@media (max-width: 1199px) {
    ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .photo-container {
        min-height: 180px;
    }
}

ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .photo-container ngx-dropzone-image-preview {
    margin: 0 !important;
    height: auto !important;
    max-height: calc(332px - 2rem);
    display: block !important;
    overflow: hidden;
}

    ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .photo-container ngx-dropzone-image-preview img {
        display: block;
        width: 100%;
        max-height: 100%;
        height: 100%;
        opacity: 1;
    }

    ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] .form-container .doc-item .photo-container ngx-dropzone-image-preview ngx-dropzone-label {
        display: none;
    }

ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] form {
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

    ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .mat-horizontal-content-container .mat-horizontal-stepper-content[aria-expanded=true] form .form-container {
        height: 100%;
    }

ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .stepper-footer {
    height: calc(40px + 2rem);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem;
}

    ion-modal .modal-wrapper .page-wrapper .page-body .mat-stepper-horizontal .stepper-footer .btn {
        height: 40px;
        padding: 0 2rem;
    }

ion-modal .modal-wrapper .page-wrapper .page-footer {
    padding: 1.5rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 calc(46px + 3rem);
    -ms-flex: 0 0 calc(46px + 3rem);
    flex: 0 0 calc(46px + 3rem);
    height: calc(46px + 3rem);
    background-color: white;
}

@media only screen and (max-width: 480px) {
    ion-modal .modal-wrapper .page-wrapper .page-footer {
        padding-top: 2rem;
    }
}

ion-modal .modal-wrapper .page-wrapper .page-footer .btn {
    padding: 0 3.5rem;
}

@media only screen and (max-width: 480px) {
    ion-modal .modal-wrapper .page-wrapper .page-footer .btn {
        font-size: 12px;
        padding: 0 1.5rem;
        height: 36px;
    }
}

@media only screen and (min-width: 768px) and (min-height: 768px) {
    ion-modal .modal-wrapper {
        left: calc(50% - (780px/2));
        top: calc(50% - (700px/2));
        position: absolute;
        width: 780px;
        height: 700px;
        -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    }
}

ion-modal.modal-large .modal-wrapper {
    left: 10%;
    position: absolute;
    width: 80%;
}

@media only screen and (max-width: 767px) and (max-height: 767px) {
    ion-modal.modal-large .modal-wrapper {
        border-radius: 1rem !important;
        width: 100%;
        left: 0;
    }
}

ion-modal.modal-fullscreen .modal-wrapper {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    border-radius: 0 !important;
    width: 100%;
}

ion-modal.modal-discount .modal-wrapper {
    left: calc(50% - (480px/2));
    top: calc(50% - (480px/2));
    position: absolute;
    width: 480px;
    height: 480px;
    background-color: transparent !important;
}

@media only screen and (max-width: 767px) and (max-height: 767px) {
    ion-modal.modal-discount .modal-wrapper {
        border-radius: 0 !important;
        width: 100%;
        left: 0;
    }
}

.alert {
    border-radius: 1rem;
}

ion-alert ion-backdrop {
    opacity: 0.4 !important;
}

ion-alert .alert-wrapper {
    width: 400px !important;
    max-width: 90% !important;
    padding: 4rem 3.5rem 3rem;
    border-radius: 1rem !important;
    background: white;
    font-size: 1rem;
    -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

    ion-alert .alert-wrapper .alert-head {
        padding: 1rem;
    }

        ion-alert .alert-wrapper .alert-head .alert-title {
            display: block;
            position: relative;
            max-width: 100%;
            margin: 0;
            padding: 0;
            color: black;
            font-size: 30px;
            line-height: 32px;
            font-weight: 900;
            text-align: center;
            text-transform: none;
            word-wrap: break-word;
        }

        ion-alert .alert-wrapper .alert-head .alert-sub-title {
            margin-bottom: 1rem;
            text-align: center;
        }

    ion-alert .alert-wrapper .alert-message {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin: 0;
        padding: 0;
        color: #757575;
        font-size: 17px;
        font-weight: 400;
        line-height: 24px;
        z-index: 1;
        word-wrap: break-word;
        text-align: center;
        overflow: auto;
        max-height: none;
    }

        ion-alert .alert-wrapper .alert-message ul li {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
            padding: 0.5rem 2rem;
        }

    ion-alert .alert-wrapper .alert-input-group {
        padding: 2rem 0 0;
    }

        ion-alert .alert-wrapper .alert-input-group .alert-input-wrapper input.alert-input {
            border-bottom: none;
            border: 1px solid #e0e0e0;
            padding: 0 1rem;
            margin: 0 0 1rem;
            height: 46px;
            font-size: 14px;
            border-radius: 1rem;
            -webkit-transition: border-color 0.15s ease, -webkit-box-shadow 0.3s ease;
            transition: border-color 0.15s ease, -webkit-box-shadow 0.3s ease;
            transition: border-color 0.15s ease, box-shadow 0.3s ease;
            transition: border-color 0.15s ease, box-shadow 0.3s ease, -webkit-box-shadow 0.3s ease;
        }

            ion-alert .alert-wrapper .alert-input-group .alert-input-wrapper input.alert-input:focus {
                border-color: #00d45a;
                -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
            }

            ion-alert .alert-wrapper .alert-input-group .alert-input-wrapper input.alert-input.is-invalid {
                border-color: #e02626;
                background: none;
            }

        ion-alert .alert-wrapper .alert-input-group .alert-input-wrapper:last-child input.alert-input {
            margin-bottom: 0;
        }

    ion-alert .alert-wrapper .alert-button-group {
        width: 100%;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding: 0;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        margin: 3rem auto 0;
    }

        ion-alert .alert-wrapper .alert-button-group .alert-button {
            width: 100%;
            height: 46px;
            display: -webkit-inline-box;
            display: -webkit-inline-flex;
            display: -ms-inline-flexbox;
            display: inline-flex;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            padding: 0 1.5rem;
            margin: 0 0 1rem;
            font-size: 18px;
            font-weight: 400;
            white-space: nowrap;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
            line-height: 1;
            border-radius: 1rem;
            border: none;
            -webkit-box-shadow: none;
            box-shadow: none;
            text-transform: none;
            overflow: hidden;
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
            -webkit-transition: all 0.3s ease;
            transition: all 0.3s ease;
            position: relative;
        }

            ion-alert .alert-wrapper .alert-button-group .alert-button .button-inner {
                -webkit-box-pack: center !important;
                -webkit-justify-content: center !important;
                -ms-flex-pack: center !important;
                justify-content: center !important;
            }

            ion-alert .alert-wrapper .alert-button-group .alert-button.btn-primary {
                color: white !important;
                background-color: #00d45a !important;
                border-color: #00d45a !important;
                -webkit-box-shadow: 0 14px 26px -12px rgba(0, 212, 90, 0.42), 0 4px 23px 0 rgba(0, 212, 90, 0.22), 0 8px 10px -5px rgba(0, 212, 90, 0.2);
                box-shadow: 0 14px 26px -12px rgba(0, 212, 90, 0.42), 0 4px 23px 0 rgba(0, 212, 90, 0.22), 0 8px 10px -5px rgba(0, 212, 90, 0.2);
            }

                ion-alert .alert-wrapper .alert-button-group .alert-button.btn-primary:hover, ion-alert .alert-wrapper .alert-button-group .alert-button.btn-primary:focus, ion-alert .alert-wrapper .alert-button-group .alert-button.btn-primary:active, ion-alert .alert-wrapper .alert-button-group .alert-button.btn-primary.active, ion-alert .alert-wrapper .alert-button-group .alert-button.btn-primary:active:focus {
                    color: white !important;
                    background-color: #00d45a !important;
                    border-color: #00d45a !important;
                }

            ion-alert .alert-wrapper .alert-button-group .alert-button.btn-success {
                color: white !important;
                background-color: #28b52e;
                border-color: #28b52e;
                -webkit-box-shadow: 0 14px 26px -12px rgba(40, 181, 46, 0.42), 0 4px 23px 0 rgba(40, 181, 46, 0.22), 0 8px 10px -5px rgba(40, 181, 46, 0.2);
                box-shadow: 0 14px 26px -12px rgba(40, 181, 46, 0.42), 0 4px 23px 0 rgba(40, 181, 46, 0.22), 0 8px 10px -5px rgba(40, 181, 46, 0.2);
            }

                ion-alert .alert-wrapper .alert-button-group .alert-button.btn-success:not([disabled]):hover, ion-alert .alert-wrapper .alert-button-group .alert-button.btn-success:not([disabled]):focus, ion-alert .alert-wrapper .alert-button-group .alert-button.btn-success:not([disabled]):active, ion-alert .alert-wrapper .alert-button-group .alert-button.btn-success:active:not([disabled]):focus {
                    color: white !important;
                    background-color: #18a21d !important;
                    border-color: #18a21d !important;
                }

            ion-alert .alert-wrapper .alert-button-group .alert-button.btn-default {
                color: #757575 !important;
                background-color: transparent !important;
                border-color: transparent !important;
            }

                ion-alert .alert-wrapper .alert-button-group .alert-button.btn-default:hover, ion-alert .alert-wrapper .alert-button-group .alert-button.btn-default:focus, ion-alert .alert-wrapper .alert-button-group .alert-button.btn-default:active, ion-alert .alert-wrapper .alert-button-group .alert-button.btn-default.active, ion-alert .alert-wrapper .alert-button-group .alert-button.btn-default:active:focus {
                    color: #00d45a !important;
                    background-color: transparent !important;
                    border-color: transparent !important;
                }

    ion-alert .alert-wrapper .alert-radio-group {
        border: none;
        margin-top: 1rem;
    }

        ion-alert .alert-wrapper .alert-radio-group .alert-radio-button {
            height: 36px;
        }

            ion-alert .alert-wrapper .alert-radio-group .alert-radio-button .alert-button-inner .alert-radio-icon {
                border-color: #1e88e5;
                left: 0;
            }

                ion-alert .alert-wrapper .alert-radio-group .alert-radio-button .alert-button-inner .alert-radio-icon .alert-radio-inner {
                    background-color: #1e88e5;
                }

            ion-alert .alert-wrapper .alert-radio-group .alert-radio-button .alert-button-inner .alert-radio-label {
                padding: 0 1rem;
                font-size: 14px;
            }

ion-picker-cmp .picker-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    top: 0;
    bottom: 0;
    border-top: none;
    border-bottom: 0.55px solid rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, 0.08);
    border-radius: 1rem;
}

    ion-picker-cmp .picker-wrapper .picker-toolbar {
        padding: 1rem;
        height: 84px;
    }

        ion-picker-cmp .picker-wrapper .picker-toolbar .picker-toolbar-button .button {
            font-size: 16px;
        }

    ion-picker-cmp .picker-wrapper .picker-columns {
        height: 256px;
    }

#print-section {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
}

@media print {
    #print-section {
        display: block;
    }
}

.invoice {
    padding: 4mm;
    margin: 0;
    width: 100%;
    height: 100%;
    background: white;
    z-index: 9999;
    color: black;
    text-transform: uppercase;
    font-size: 11px;
}

    .invoice h1 {
        font-size: 18px;
        margin: 0;
    }

    .invoice h2 {
        font-size: 16px;
        margin: 0;
    }

    .invoice h3 {
        font-size: 14px;
        margin: 0;
    }

    .invoice p {
        margin: 0;
    }

    .invoice .top,
    .invoice .middle,
    .invoice .bottom {
        border-bottom: 1px solid #ddd;
        margin: 0 auto 15px;
        padding-bottom: 15px;
    }

    .invoice .top {
        min-height: 100px;
        padding-top: 20px;
    }

        .invoice .top .logo {
            height: 60px;
            margin: 0 auto 15px;
            width: 150px;
        }

            .invoice .top .logo img {
                height: 100%;
                -o-object-fit: contain;
                object-fit: contain;
                -o-object-position: bottom center;
                object-position: bottom center;
                width: 100%;
            }

        .invoice .top .info {
            margin: 0 auto;
            text-align: center;
        }

            .invoice .top .info h2 {
                font-size: 15px;
                margin-bottom: 0px;
            }

    .invoice .middle {
        min-height: 80px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

@media screen and (max-width: 1080px) {
    .invoice .middle {
        display: block;
    }
}

.invoice .middle .info {
    margin-bottom: 15px;
}

    .invoice .middle .info:last-child {
        margin-bottom: 0;
    }

    .invoice .middle .info table tr th {
        width: 50px;
        padding: 0;
        vertical-align: top;
    }

    .invoice .middle .info table tr td {
        padding: 0;
    }

.invoice .bottom {
    min-height: 50px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-bottom: 0;
}

    .invoice .bottom .bottom-container {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 calc(50% - 0.75rem);
        -ms-flex: 0 0 calc(50% - 0.75rem);
        flex: 0 0 calc(50% - 0.75rem);
        padding-bottom: 15px;
    }

@media screen and (max-width: 1080px) {
    .invoice .bottom .bottom-container {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
    }
}

.invoice .bottom h2 {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 10px;
    text-align: left;
}

@media screen and (max-width: 1080px) {
    .invoice .bottom h2 {
        text-align: center;
    }
}

.invoice .bottom table th,
.invoice .bottom table td {
    padding: 2px 5px;
}

.invoice .bottom table thead,
.invoice .bottom table tfoot {
    background-color: #eee;
}

    .invoice .bottom table thead tr.total th,
    .invoice .bottom table tfoot tr.total th {
        font-size: 14px;
    }

    .invoice .bottom table thead tr th {
        text-align: center;
    }

.invoice .bottom table tbody tr td {
    padding-bottom: 10px;
}

.invoice .barcode-container {
    padding: 30px 15px 5px;
    text-align: center;
}

.invoice .powered-by {
    padding: 10px 15px 20px;
    text-align: center;
}

    .invoice .powered-by img {
        -o-object-fit: contain;
        object-fit: contain;
        -o-object-position: center;
        object-position: center;
        width: 100%;
        max-width: 120px;
    }

@media print {
    .ion-page {
        display: none;
    }

    #print-section {
        display: block;
        font-size: 10px;
        width: 100vw;
    }

    .invoice {
        font-size: 10px;
    }

        .invoice .middle {
            display: block;
        }
}

ion-loading {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

    ion-loading ion-backdrop {
        opacity: 1 !important;
        background-color: white;
        background-color: rgba(255, 255, 255, 0.95);
    }

    ion-loading .loading-wrapper {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 99999;
        border-radius: 0 !important;
        max-width: 100% !important;
        max-height: 100% !important;
        background: transparent !important;
        background-color: transparent !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        padding: 1rem !important;
        color: #212121 !important;
    }

        ion-loading .loading-wrapper .loading-content {
            position: fixed;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            z-index: 99999;
        }

            ion-loading .loading-wrapper .loading-content .loader-modal {
                position: fixed;
                top: 0;
                right: 0;
                bottom: 0;
                left: 0;
                z-index: 99999;
            }

@media only screen and (max-width: 480px) {
    ion-loading .loading-wrapper .loading-content .loader-modal {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }
}

ion-loading .loading-wrapper .loading-content .loader-modal .tips-container {
    padding: 5rem;
    padding-right: 8rem;
    max-width: 45%;
    font-size: 16px;
    font-weight: 600;
}

@media only screen and (max-width: 480px) {
    ion-loading .loading-wrapper .loading-content .loader-modal .tips-container {
        max-width: 100%;
        padding: 2rem 2rem 6rem;
    }
}

ion-loading .loading-wrapper .loading-content .loader-modal .tips-container h3 {
    font-weight: 700;
}

    ion-loading .loading-wrapper .loading-content .loader-modal .tips-container h3 strong {
        color: #00d45a;
    }

ion-loading .loading-wrapper .loading-content .loader-modal .tips-container p {
    font-weight: 500;
    line-height: 1.6;
    margin-bottom: 0.5rem;
}

ion-loading .loading-wrapper .loading-content .loader-modal .tips-container a {
    font-weight: 600;
    margin-top: 2rem;
    color: #00d45a;
    display: block;
}

@media only screen and (min-width: 1651px) {
    ion-loading .loading-wrapper .loading-content .loader-modal .tips-container h3 {
        font-size: 28px;
    }

    ion-loading .loading-wrapper .loading-content .loader-modal .tips-container p, ion-loading .loading-wrapper .loading-content .loader-modal .tips-container a {
        font-size: 16px;
        line-height: 24px;
    }
}

ion-loading .loading-wrapper .loading-content .loader-modal .loader-container {
    position: absolute;
    bottom: 1rem;
    right: 1rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2rem;
    padding-left: 5rem;
}

    ion-loading .loading-wrapper .loading-content .loader-modal .loader-container .logo {
        height: 66px;
    }

@media only screen and (max-width: 480px) {
    ion-loading .loading-wrapper .loading-content .loader-modal .loader-container .logo {
        height: 56px;
    }
}

ion-loading .loading-wrapper .loading-content .loader-modal .loader-container .logo img {
    width: auto;
    height: 100%;
}

ion-loading .loading-wrapper .loading-content .loader-modal .loader-container span {
    font-size: 32px;
    font-weight: 600;
    padding-left: 1rem;
}

@media only screen and (max-width: 480px) {
    ion-loading .loading-wrapper .loading-content .loader-modal .loader-container span {
        display: none;
    }
}

.overlay {
    background: linear-gradient(135deg, rgba(51, 51, 51, 0.5), rgba(33, 33, 33, 0.5));
    display: block;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
}

.text-primary {
    color: #00d45a !important;
}

    .text-primary:hover {
        color: #00d45a !important;
    }

.text-blue {
    color: #1e88e5 !important;
}

    .text-blue:hover {
        color: #1e88e5 !important;
    }

.text-success {
    color: #28b52e !important;
}

    .text-success:hover {
        color: #28b52e !important;
    }

.text-warning {
    color: #ffa000 !important;
}

    .text-warning:hover {
        color: #ffa000 !important;
    }

.text-danger {
    color: #e02626 !important;
}

    .text-danger:hover {
        color: #e02626 !important;
    }

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 1.5;
}

strong {
    font-weight: 800;
}

ion-action-sheet {
    left: 0;
    top: 0;
    position: absolute;
    z-index: 1000;
    display: block;
    width: 100%;
    height: 100%;
}

.action-sheet-wrapper {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    position: absolute;
    z-index: 10;
    display: block;
    width: 100%;
    max-width: 500px;
    pointer-events: none;
}

.action-sheet-button {
    width: 100%;
}

.action-sheet-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    height: 100%;
    max-height: 100%;
}

.action-sheet-group {
    overflow: scroll;
    -webkit-flex-shrink: 2;
    -ms-flex-negative: 2;
    flex-shrink: 2;
    pointer-events: all;
}

.action-sheet-group-cancel {
    overflow: hidden;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.action-sheet-ios {
    text-align: center;
}

    .action-sheet-ios .action-sheet-wrapper {
        margin: constant(safe-area-inset-top) auto constant(safe-area-inset-bottom);
        margin: env(safe-area-inset-top) auto env(safe-area-inset-bottom);
    }

    .action-sheet-ios .action-sheet-container {
        padding: 0 10px;
    }

    .action-sheet-ios .action-sheet-group {
        border-radius: 13px;
        margin-bottom: 8px;
        background: #f9f9f9;
    }

        .action-sheet-ios .action-sheet-group:first-child {
            margin-top: 10px;
        }

        .action-sheet-ios .action-sheet-group:last-child {
            margin-bottom: 10px;
        }

    .action-sheet-ios .action-sheet-title {
        padding: 1.5rem;
        text-align: center;
        border-radius: 0;
        border-bottom: 0.55px solid #d6d6da;
        font-size: 1.3rem;
        font-weight: 400;
        color: #8f8f8f;
    }

    .action-sheet-ios .action-sheet-button {
        margin: 0;
        padding: 18px;
        min-height: 5.6rem;
        border-bottom: 0.55px solid #d6d6da;
        font-size: 2rem;
        color: #007aff;
        background: transparent;
    }

        .action-sheet-ios .action-sheet-button:last-child {
            border-bottom-color: transparent;
        }

        .action-sheet-ios .action-sheet-button.activated {
            margin-top: -0.55px;
            border-top: 0.55px solid #ebebeb;
            border-bottom-color: #ebebeb;
            background: #ebebeb;
        }

    .action-sheet-ios .action-sheet-selected {
        font-weight: bold;
        background: #fff;
    }

    .action-sheet-ios .action-sheet-destructive {
        color: #f53d3d;
    }

    .action-sheet-ios .action-sheet-cancel {
        font-weight: 600;
        background: #fff;
    }

.action-sheet-md .action-sheet-title {
    text-align: left;
    text-align: start;
    font-size: 1.6rem;
    color: #757575;
    padding: 11px 16px 17px;
}

.action-sheet-md .action-sheet-button {
    text-align: left;
    text-align: start;
    position: relative;
    overflow: hidden;
    min-height: 4.8rem;
    font-size: 1.6rem;
    color: #222;
    background: transparent;
    padding: 0 16px;
}

    .action-sheet-md .action-sheet-button.activated {
        background: #f1f1f1;
    }

.action-sheet-md .action-sheet-icon {
    padding: 0;
    text-align: center;
    width: 2.3rem;
    font-size: 2.4rem;
    vertical-align: middle;
    margin: 0 32px 0 0;
}

.action-sheet-md .action-sheet-group {
    background: #fafafa;
}

    .action-sheet-md .action-sheet-group:first-child {
        padding-top: 0.8rem;
    }

    .action-sheet-md .action-sheet-group:last-child {
        padding-bottom: 0.8rem;
    }

    .action-sheet-md .action-sheet-group .button-inner {
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

.action-sheet-md .action-sheet-selected {
    font-weight: bold;
}

.action-sheet-wp .action-sheet-title {
    text-align: left;
    text-align: start;
    font-size: 2rem;
    color: #4d4d4d;
    padding: 11px 16px 17px;
}

.action-sheet-wp .action-sheet-button {
    text-align: left;
    text-align: start;
    min-height: 4.8rem;
    font-size: 1.5rem;
    color: #4d4d4d;
    background: transparent;
    padding: 0 16px;
}

    .action-sheet-wp .action-sheet-button.activated {
        background: #aaa;
    }

.action-sheet-wp .action-sheet-icon {
    padding: 0;
    text-align: center;
    width: 2.3rem;
    font-size: 2.4rem;
    vertical-align: middle;
    margin: 0 20px 0 0;
}

.action-sheet-wp .action-sheet-group {
    background: #fff;
}

    .action-sheet-wp .action-sheet-group:first-child {
        padding-top: 0.8rem;
        -webkit-box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
        box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
    }

    .action-sheet-wp .action-sheet-group:last-child {
        padding-bottom: 0.8rem;
    }

    .action-sheet-wp .action-sheet-group .button-inner {
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

.action-sheet-wp .action-sheet-selected {
    font-weight: bold;
}

.action-sheet-wp .action-sheet-cancel {
    background: transparent;
}

ion-alert {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    z-index: 1000;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    contain: strict;
}

    ion-alert.alert-top {
        padding-top: 50px;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    ion-alert input {
        width: 100%;
    }

.alert-wrapper {
    z-index: 10;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 250px;
    max-height: 90%;
    opacity: 0;
    contain: content;
}

.alert-title {
    margin: 0;
    padding: 0;
}

.alert-sub-title {
    margin: 5px 0 0;
    padding: 0;
    font-weight: normal;
}

.alert-message {
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
}

.alert-input {
    padding: 10px 0;
    border: 0;
    background: inherit;
}

    .alert-input::-moz-placeholder {
        color: #999;
    }

    .alert-input:-ms-input-placeholder {
        color: #999;
    }

    .alert-input::-webkit-input-placeholder {
        text-indent: 0;
        color: #999;
    }

.alert-button-group {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}

.alert-button-group-vertical {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.alert-button {
    margin: 0;
    z-index: 0;
    display: block;
    font-size: 14px;
    line-height: 20px;
}

.alert-tappable {
    text-align: left;
    text-align: start;
    -moz-appearance: none;
    -ms-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
    padding: 0;
    width: 100%;
    font-size: inherit;
    line-height: initial;
    background: transparent;
}

.alert-ios .alert-wrapper {
    border-radius: 13px;
    overflow: hidden;
    max-width: 270px;
    background-color: #f8f8f8;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.alert-ios .alert-head {
    text-align: center;
    padding: 12px 16px 7px;
}

.alert-ios .alert-title {
    margin-top: 8px;
    font-size: 17px;
    font-weight: 600;
}

.alert-ios .alert-sub-title {
    font-size: 14px;
    color: #666;
}

.alert-ios .alert-message,
.alert-ios .alert-input-group {
    text-align: center;
    font-size: 13px;
    color: inherit;
    padding: 0 16px 21px;
}

.alert-ios .alert-message {
    max-height: 240px;
}

    .alert-ios .alert-message:empty {
        padding: 0 0 12px;
    }

.alert-ios .alert-input {
    -moz-appearance: none;
    -ms-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    margin-top: 10px;
    border-radius: 4px;
    border: 0.55px solid #ccc;
    background-color: #fff;
    padding: 6px;
}

.alert-ios .alert-radio-group,
.alert-ios .alert-checkbox-group {
    overflow: scroll;
    max-height: 240px;
    border-top: 0.55px solid #dbdbdf;
    -webkit-overflow-scrolling: touch;
}

.alert-ios .alert-tappable {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    min-height: 44px;
}

.alert-ios .alert-radio-label {
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-ordinal-group: 1;
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: initial;
    padding: 13px;
}

.alert-ios [aria-checked=true] .alert-radio-label {
    color: #488aff;
}

.alert-ios .alert-radio-icon {
    position: relative;
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
    min-width: 30px;
}

.alert-ios [aria-checked=true] .alert-radio-inner {
    left: 7px;
    top: -7px;
    position: absolute;
    width: 6px;
    height: 12px;
    border-width: 2px;
    border-top-width: 0;
    border-left-width: 0;
    border-style: solid;
    border-color: #488aff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.alert-ios .alert-checkbox-label {
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: initial;
    padding: 13px;
}

.alert-ios [aria-checked=true] .alert-checkbox-label {
    color: initial;
}

.alert-ios .alert-checkbox-icon {
    border-radius: 50%;
    position: relative;
    width: 21px;
    height: 21px;
    border-width: 0.55px;
    border-style: solid;
    border-color: #c8c7cc;
    background-color: #fff;
    margin: 10px 6px 10px 16px;
}

.alert-ios [aria-checked=true] .alert-checkbox-icon {
    border-color: #488aff;
    background-color: #488aff;
}

.alert-ios [aria-checked=true] .alert-checkbox-inner {
    left: 7px;
    top: 4px;
    position: absolute;
    width: 4px;
    height: 9px;
    border-width: 0.55px;
    border-top-width: 0;
    border-left-width: 0;
    border-style: solid;
    border-color: #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.alert-ios .alert-button-group {
    margin-right: -0.55px;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.alert-ios .alert-button {
    margin: 0;
    border-radius: 0;
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-width: 50%;
    height: 44px;
    border-top: 0.55px solid #dbdbdf;
    border-right: 0.55px solid #dbdbdf;
    font-size: 17px;
    color: #488aff;
    background-color: transparent;
}

    .alert-ios .alert-button:last-child {
        border-right: 0;
        font-weight: bold;
    }

    .alert-ios .alert-button.activated {
        background-color: #e9e9e9;
    }

.alert-md .alert-wrapper {
    border-radius: 2px;
    max-width: 280px;
    background-color: #fafafa;
    -webkit-box-shadow: 0 16px 20px rgba(0, 0, 0, 0.4);
    box-shadow: 0 16px 20px rgba(0, 0, 0, 0.4);
}

.alert-md .alert-head {
    text-align: left;
    text-align: start;
    padding: 24px 24px 20px;
}

.alert-md .alert-title {
    font-size: 22px;
}

.alert-md .alert-sub-title {
    font-size: 16px;
}

.alert-md .alert-message,
.alert-md .alert-input-group {
    color: rgba(0, 0, 0, 0.5);
    padding: 0 24px 24px;
}

.alert-md .alert-message {
    max-height: 240px;
    font-size: 15px;
}

    .alert-md .alert-message:empty {
        padding: 0;
    }

.alert-md .alert-input {
    margin: 5px 0;
    border-bottom: 1px solid #dedede;
    color: #000;
}

    .alert-md .alert-input:focus {
        margin-bottom: 4px;
        border-bottom: 2px solid #488aff;
    }

.alert-md .alert-radio-group,
.alert-md .alert-checkbox-group {
    position: relative;
    overflow: auto;
    max-height: 240px;
    border-top: 1px solid #dedede;
    border-bottom: 1px solid #dedede;
}

.alert-md .alert-tappable {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    min-height: 4.4rem;
}

.alert-md .alert-radio-label {
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: initial;
    padding: 13px 26px;
}

.alert-md .alert-radio-icon {
    left: 13px;
    top: 0;
    border-radius: 50%;
    position: relative;
    display: block;
    width: 16px;
    height: 16px;
    border-width: 2px;
    border-style: solid;
    border-color: #787878;
}

.alert-md .alert-radio-inner {
    left: 2px;
    top: 2px;
    border-radius: 50%;
    position: absolute;
    width: 8px;
    height: 8px;
    background-color: #488aff;
    -webkit-transform: scale3d(0, 0, 0);
    transform: scale3d(0, 0, 0);
    -webkit-transition: -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.alert-md [aria-checked=true] .alert-radio-label {
    color: #488aff;
}

.alert-md [aria-checked=true] .alert-radio-icon {
    border-color: #488aff;
}

.alert-md [aria-checked=true] .alert-radio-inner {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
}

.alert-md .alert-checkbox-label {
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: initial;
    padding: 13px 26px;
}

.alert-md [aria-checked=true] .alert-checkbox-label {
    color: initial;
}

.alert-md .alert-checkbox-icon {
    left: 13px;
    top: 0;
    border-radius: 2px;
    position: relative;
    width: 16px;
    height: 16px;
    border-width: 2px;
    border-style: solid;
    border-color: #787878;
}

.alert-md [aria-checked=true] .alert-checkbox-icon {
    border-color: #488aff;
    background-color: #488aff;
}

.alert-md [aria-checked=true] .alert-checkbox-inner {
    left: 3px;
    top: 0;
    position: absolute;
    width: 6px;
    height: 10px;
    border-width: 2px;
    border-top-width: 0;
    border-left-width: 0;
    border-style: solid;
    border-color: #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.alert-md .alert-button-group {
    -webkit-flex-wrap: wrap-reverse;
    -ms-flex-wrap: wrap-reverse;
    flex-wrap: wrap-reverse;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 8px 8px 8px 24px;
}

.alert-md .alert-button {
    text-align: right;
    text-align: end;
    border-radius: 2px;
    position: relative;
    overflow: hidden;
    font-weight: 500;
    text-transform: uppercase;
    color: #488aff;
    background-color: transparent;
    margin: 0 8px 0 0;
    padding: 10px;
}

    .alert-md .alert-button.activated {
        background-color: rgba(158, 158, 158, 0.2);
    }

    .alert-md .alert-button .button-inner {
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }

.alert-wp ion-backdrop {
    background: #fff;
}

.alert-wp .alert-wrapper {
    border-radius: 0;
    width: 100%;
    max-width: 520px;
    border: 1px solid #488aff;
    background: #e6e6e6;
}

.alert-wp .alert-head {
    text-align: left;
    text-align: start;
    padding: 20px 22px 5px;
}

.alert-wp .alert-title {
    font-size: 20px;
    font-weight: 400;
}

.alert-wp .alert-sub-title {
    font-size: 16px;
}

.alert-wp .alert-message,
.alert-wp .alert-input-group {
    color: #000;
    padding: 0 22px 8px;
}

.alert-wp .alert-message {
    max-height: 240px;
    font-size: 13px;
}

    .alert-wp .alert-message:empty {
        padding: 0;
    }

.alert-wp .alert-input {
    border: 2px solid rgba(0, 0, 0, 0.5);
    line-height: 3rem;
    color: #000;
    margin: 5px 0;
    padding: 0 8px;
}

    .alert-wp .alert-input:focus {
        border-color: #488aff;
    }

.alert-wp .alert-radio-group,
.alert-wp .alert-checkbox-group {
    position: relative;
    overflow: auto;
    max-height: 240px;
}

.alert-wp .alert-tappable {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    min-height: 4.4rem;
}

.alert-wp .alert-radio-label {
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: initial;
    padding: 13px 26px;
}

.alert-wp .alert-radio-icon {
    left: 13px;
    top: 0;
    margin: 0;
    border-radius: 50%;
    position: relative;
    display: block;
    width: 16px;
    height: 16px;
    border-width: 2px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.5);
}

.alert-wp .alert-radio-inner {
    left: 2px;
    top: 2px;
    border-radius: 50%;
    position: absolute;
    display: none;
    width: 8px;
    height: 8px;
    background: #488aff;
}

.alert-wp [aria-checked=true] .alert-radio-label {
    color: #000;
}

.alert-wp [aria-checked=true] .alert-radio-icon {
    border-color: rgba(0, 0, 0, 0.5);
}

.alert-wp [aria-checked=true] .alert-radio-inner {
    display: block;
}

.alert-wp .alert-checkbox-label {
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: initial;
    padding: 13px 26px;
}

.alert-wp [aria-checked=true] .alert-checkbox-label {
    color: initial;
}

.alert-wp .alert-checkbox-icon {
    left: 13px;
    top: 0;
    border-radius: 0;
    position: relative;
    width: 16px;
    height: 16px;
    border-width: 2px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.5);
    background: transparent;
}

.alert-wp [aria-checked=true] .alert-checkbox-icon {
    border-color: #488aff;
    background: #488aff;
}

.alert-wp [aria-checked=true] .alert-checkbox-inner {
    left: 3px;
    top: -2px;
    position: absolute;
    width: 6px;
    height: 12px;
    border-width: 1px;
    border-top-width: 0;
    border-left-width: 0;
    border-style: solid;
    border-color: #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.alert-wp .alert-button-group {
    -webkit-flex-wrap: wrap-reverse;
    -ms-flex-wrap: wrap-reverse;
    flex-wrap: wrap-reverse;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 20px 22px;
}

.alert-wp .alert-button-group-vertical .alert-button {
    margin-top: 5px;
    width: 100%;
}

    .alert-wp .alert-button-group-vertical .alert-button:first-child:not(:only-child) {
        margin-right: 0;
        margin-top: 0;
    }

.alert-wp .alert-button {
    border-radius: 0;
    width: 49.5%;
    font-weight: 400;
    color: #000;
    background: #b8b8b8;
    padding: 5px;
}

    .alert-wp .alert-button:first-child:not(:only-child) {
        margin-right: 1%;
    }

    .alert-wp .alert-button.activated {
        background: darkgray;
    }

audio,
canvas,
progress,
video {
    vertical-align: baseline;
}

    audio:not([controls]) {
        display: none;
        height: 0;
    }

b,
strong {
    font-weight: bold;
}

img {
    max-width: 100%;
    border: 0;
}

svg:not(:root) {
    overflow: hidden;
}

figure {
    margin: 1em 40px;
}

hr {
    height: 1px;
    border-width: 0;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}

pre {
    overflow: auto;
}

code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

label,
input,
select,
textarea {
    font-family: inherit;
    line-height: normal;
}

textarea {
    overflow: auto;
    height: auto;
    font: inherit;
    color: inherit;
}

    textarea::-webkit-input-placeholder {
        padding-left: 2px;
    }

    textarea::-moz-placeholder {
        padding-left: 2px;
    }

    textarea::-ms-input-placeholder {
        padding-left: 2px;
    }

    textarea::placeholder {
        padding-left: 2px;
    }

form,
input,
optgroup,
select {
    margin: 0;
    font: inherit;
    color: inherit;
}

    html input[type="button"],
    input[type="reset"],
    input[type="submit"] {
        cursor: pointer;
        -webkit-appearance: button;
    }

a,
a div,
a span,
a ion-icon,
a ion-label,
button,
button div,
button span,
button ion-icon,
button ion-label,
[tappable],
[tappable] div,
[tappable] span,
[tappable] ion-icon,
[tappable] ion-label,
input,
textarea {
    -ms-touch-action: manipulation;
    touch-action: manipulation;
}

    a ion-label,
    button ion-label {
        pointer-events: none;
    }

button {
    border: 0;
    font-family: inherit;
    font-style: inherit;
    font-variant: inherit;
    line-height: 1;
    text-transform: none;
    cursor: pointer;
    -webkit-appearance: button;
}

[tappable] {
    cursor: pointer;
}

a[disabled],
button[disabled],
html input[disabled] {
    cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
    padding: 0;
    border: 0;
}

input[type="checkbox"],
input[type="radio"] {
    padding: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

td,
th {
    padding: 0;
}

.hide,
[hidden],
template {
    display: none !important;
}

.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
}

:focus,
:active {
    outline: none;
}

.focus-outline :focus {
    outline: thin dotted;
    outline-offset: -1px;
}

.focus-outline button:focus,
.focus-outline [ion-button]:focus {
    border-color: #51a7e8;
    outline: 2px solid #51a7e8;
    -webkit-box-shadow: 0 0 8px 1px #51a7e8;
    box-shadow: 0 0 8px 1px #51a7e8;
}

ion-input :focus {
    outline: none;
}

.click-block {
    display: none;
}

.click-block-enabled {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    -webkit-transform: translate3d(0, -100%, 0) translateY(1px);
    transform: translate3d(0, -100%, 0) translateY(1px);
    position: absolute;
    z-index: 99999;
    display: block;
    opacity: 0;
    contain: strict;
}

.click-block-active {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
}

html {
    width: 100%;
    height: 100%;
    font-size: 62.5%;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    margin: 0;
    padding: 0;
    position: fixed;
    overflow: hidden;
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -webkit-user-drag: none;
    -ms-content-zooming: none;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    word-wrap: break-word;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;
    text-size-adjust: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

a {
    background-color: transparent;
}

.enable-hover a:hover {
    opacity: .7;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 1.6rem;
    margin-bottom: 1rem;
    font-weight: 500;
    line-height: 1.2;
}

[padding] h1:first-child,
[padding] h2:first-child,
[padding] h3:first-child,
[padding] h4:first-child,
[padding] h5:first-child,
[padding] h6:first-child {
    margin-top: -0.3rem;
}

h1 + h2,
h1 + h3,
h2 + h3 {
    margin-top: -0.3rem;
}

h1 {
    margin-top: 2rem;
    font-size: 2.6rem;
}

h2 {
    margin-top: 1.8rem;
    font-size: 2.4rem;
}

h3 {
    font-size: 2.2rem;
}

h4 {
    font-size: 2rem;
}

h5 {
    font-size: 1.8rem;
}

h6 {
    font-size: 1.6rem;
}

small {
    font-size: 75%;
}

sub,
sup {
    position: relative;
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline;
}

sup {
    top: -.5em;
}

sub {
    bottom: -.25em;
}

ion-app,
ion-nav,
ion-tab,
ion-tabs,
.app-root {
    left: 0;
    top: 0;
    position: absolute;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
}

ion-nav,
ion-tab,
ion-tabs {
    overflow: hidden;
}

ion-tab {
    display: none;
}

    ion-tab.show-tab {
        display: block;
    }

ion-app,
ion-nav,
ion-tab,
ion-tabs,
.app-root,
.ion-page {
    contain: strict;
}

.ion-page {
    left: 0;
    top: 0;
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0;
}

    .ion-page.show-page {
        opacity: 1;
    }

ion-header {
    left: 0;
    top: 0;
    position: absolute;
    z-index: 10;
    display: block;
    width: 100%;
}

ion-footer {
    left: 0;
    bottom: 0;
    position: absolute;
    z-index: 10;
    display: block;
    width: 100%;
}

[app-viewport],
[overlay-portal],
[nav-viewport],
[tab-portal],
.nav-decor {
    display: none;
}

[text-center] {
    text-align: center !important;
}

[text-justify] {
    text-align: justify !important;
}

[text-start] {
    text-align: left;
    text-align: start !important;
}

[text-end] {
    text-align: right;
    text-align: end !important;
}

[text-left] {
    text-align: left !important;
}

[text-right] {
    text-align: right !important;
}

[text-nowrap] {
    white-space: nowrap !important;
}

[text-wrap] {
    white-space: normal !important;
}

@media (min-width: 576px) {
    [text-sm-center] {
        text-align: center !important;
    }

    [text-sm-justify] {
        text-align: justify !important;
    }

    [text-sm-start] {
        text-align: left;
        text-align: start !important;
    }

    [text-sm-end] {
        text-align: right;
        text-align: end !important;
    }

    [text-sm-left] {
        text-align: left !important;
    }

    [text-sm-right] {
        text-align: right !important;
    }

    [text-sm-nowrap] {
        white-space: nowrap !important;
    }

    [text-sm-wrap] {
        white-space: normal !important;
    }
}

@media (min-width: 768px) {
    [text-md-center] {
        text-align: center !important;
    }

    [text-md-justify] {
        text-align: justify !important;
    }

    [text-md-start] {
        text-align: left;
        text-align: start !important;
    }

    [text-md-end] {
        text-align: right;
        text-align: end !important;
    }

    [text-md-left] {
        text-align: left !important;
    }

    [text-md-right] {
        text-align: right !important;
    }

    [text-md-nowrap] {
        white-space: nowrap !important;
    }

    [text-md-wrap] {
        white-space: normal !important;
    }
}

@media (min-width: 992px) {
    [text-lg-center] {
        text-align: center !important;
    }

    [text-lg-justify] {
        text-align: justify !important;
    }

    [text-lg-start] {
        text-align: left;
        text-align: start !important;
    }

    [text-lg-end] {
        text-align: right;
        text-align: end !important;
    }

    [text-lg-left] {
        text-align: left !important;
    }

    [text-lg-right] {
        text-align: right !important;
    }

    [text-lg-nowrap] {
        white-space: nowrap !important;
    }

    [text-lg-wrap] {
        white-space: normal !important;
    }
}

@media (min-width: 1200px) {
    [text-xl-center] {
        text-align: center !important;
    }

    [text-xl-justify] {
        text-align: justify !important;
    }

    [text-xl-start] {
        text-align: left;
        text-align: start !important;
    }

    [text-xl-end] {
        text-align: right;
        text-align: end !important;
    }

    [text-xl-left] {
        text-align: left !important;
    }

    [text-xl-right] {
        text-align: right !important;
    }

    [text-xl-nowrap] {
        white-space: nowrap !important;
    }

    [text-xl-wrap] {
        white-space: normal !important;
    }
}

[text-uppercase] {
    text-transform: uppercase !important;
}

[text-lowercase] {
    text-transform: lowercase !important;
}

[text-capitalize] {
    text-transform: capitalize !important;
}

@media (min-width: 576px) {
    [text-sm-uppercase] {
        text-transform: uppercase !important;
    }

    [text-sm-lowercase] {
        text-transform: lowercase !important;
    }

    [text-sm-capitalize] {
        text-transform: capitalize !important;
    }
}

@media (min-width: 768px) {
    [text-md-uppercase] {
        text-transform: uppercase !important;
    }

    [text-md-lowercase] {
        text-transform: lowercase !important;
    }

    [text-md-capitalize] {
        text-transform: capitalize !important;
    }
}

@media (min-width: 992px) {
    [text-lg-uppercase] {
        text-transform: uppercase !important;
    }

    [text-lg-lowercase] {
        text-transform: lowercase !important;
    }

    [text-lg-capitalize] {
        text-transform: capitalize !important;
    }
}

@media (min-width: 1200px) {
    [text-xl-uppercase] {
        text-transform: uppercase !important;
    }

    [text-xl-lowercase] {
        text-transform: lowercase !important;
    }

    [text-xl-capitalize] {
        text-transform: capitalize !important;
    }
}

[float-left] {
    float: left !important;
}

[float-right] {
    float: right !important;
}

[float-start] {
    float: left !important;
}

[float-end] {
    float: right !important;
}

@media (min-width: 576px) {
    [float-sm-left] {
        float: left !important;
    }

    [float-sm-right] {
        float: right !important;
    }

    [float-sm-start] {
        float: left !important;
    }

    [float-sm-end] {
        float: right !important;
    }
}

@media (min-width: 768px) {
    [float-md-left] {
        float: left !important;
    }

    [float-md-right] {
        float: right !important;
    }

    [float-md-start] {
        float: left !important;
    }

    [float-md-end] {
        float: right !important;
    }
}

@media (min-width: 992px) {
    [float-lg-left] {
        float: left !important;
    }

    [float-lg-right] {
        float: right !important;
    }

    [float-lg-start] {
        float: left !important;
    }

    [float-lg-end] {
        float: right !important;
    }
}

@media (min-width: 1200px) {
    [float-xl-left] {
        float: left !important;
    }

    [float-xl-right] {
        float: right !important;
    }

    [float-xl-start] {
        float: left !important;
    }

    [float-xl-end] {
        float: right !important;
    }
}

ion-app.ios {
    font-family: "Nunito Sans";
    font-size: 1.4rem;
    background-color: #fff;
}

ion-app.md {
    font-family: "Nunito Sans";
    font-size: 1.4rem;
    background-color: #fff;
}

ion-app.wp {
    font-family: "Nunito Sans";
    font-size: 1.4rem;
    background-color: #fff;
}

ion-backdrop {
    left: 0;
    top: 0;
    position: absolute;
    z-index: 2;
    display: block;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: .01;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

    ion-backdrop.backdrop-no-tappable {
        cursor: auto;
    }

ion-badge {
    padding: 3px 8px;
    text-align: center;
    display: inline-block;
    min-width: 10px;
    font-size: 1.3rem;
    font-weight: bold;
    line-height: 1;
    white-space: nowrap;
    vertical-align: baseline;
}

    ion-badge:empty {
        display: none;
    }

.badge-ios {
    border-radius: 10px;
    color: #fff;
    background-color: #488aff;
}

.badge-ios-primary {
    color: #fff;
    background-color: #488aff;
}

.badge-ios-secondary {
    color: #fff;
    background-color: #32db64;
}

.badge-ios-danger {
    color: #fff;
    background-color: #f53d3d;
}

.badge-ios-light {
    color: #000;
    background-color: #f4f4f4;
}

.badge-ios-dark {
    color: #fff;
    background-color: #222;
}

.badge-md {
    border-radius: 4px;
    color: #fff;
    background-color: #488aff;
}

.badge-md-primary {
    color: #fff;
    background-color: #488aff;
}

.badge-md-secondary {
    color: #fff;
    background-color: #32db64;
}

.badge-md-danger {
    color: #fff;
    background-color: #f53d3d;
}

.badge-md-light {
    color: #000;
    background-color: #f4f4f4;
}

.badge-md-dark {
    color: #fff;
    background-color: #222;
}

.badge-wp {
    border-radius: 0;
    color: #fff;
    background-color: #488aff;
}

.badge-wp-primary {
    color: #fff;
    background-color: #488aff;
}

.badge-wp-secondary {
    color: #fff;
    background-color: #32db64;
}

.badge-wp-danger {
    color: #fff;
    background-color: #f53d3d;
}

.badge-wp-light {
    color: #000;
    background-color: #f4f4f4;
}

.badge-wp-dark {
    color: #fff;
    background-color: #222;
}

.button {
    text-align: center;
    -moz-appearance: none;
    -ms-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    position: relative;
    z-index: 0;
    display: inline-block;
    text-overflow: ellipsis;
    text-transform: none;
    white-space: nowrap;
    cursor: pointer;
    vertical-align: top;
    vertical-align: -webkit-baseline-middle;
    -webkit-transition: background-color, opacity 100ms linear;
    transition: background-color, opacity 100ms linear;
    -webkit-font-kerning: none;
    font-kerning: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    contain: content;
}

.button-inner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-flow: row nowrap;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

[ion-button] {
    text-decoration: none;
}

    a[disabled],
    button[disabled],
    [ion-button][disabled] {
        cursor: default;
        opacity: .4;
        pointer-events: none;
    }

.button-block {
    display: block;
    clear: both;
    width: 100%;
    contain: strict;
}

    .button-block::after {
        clear: both;
    }

.button-full {
    display: block;
    width: 100%;
    contain: strict;
}

    .button-full.button-outline {
        border-radius: 0;
        border-right-width: 0;
        border-left-width: 0;
    }

[icon-left] ion-icon,
[icon-start] ion-icon {
    font-size: 1.4em;
    line-height: .67;
    pointer-events: none;
    padding-right: 0.3em;
}

[icon-right] ion-icon,
[icon-end] ion-icon {
    font-size: 1.4em;
    line-height: .67;
    pointer-events: none;
    padding-left: 0.4em;
}

.button[icon-only] {
    padding: 0;
    min-width: .9em;
}

[icon-only] ion-icon {
    padding: 0 0.5em;
    font-size: 1.8em;
    line-height: .67;
    pointer-events: none;
}

.button-ios {
    border-radius: 4px;
    height: 2.8em;
    font-size: 1.6rem;
    color: #fff;
    background-color: #488aff;
    margin: 0.4rem 0.2rem;
    padding: 0 1em;
}

    .button-ios.activated {
        background-color: #427feb;
        opacity: 1;
    }

    .button-ios:hover:not(.disable-hover) {
        opacity: 0.8;
    }

.button-large-ios {
    height: 2.8em;
    font-size: 2rem;
    padding: 0 1em;
}

.button-small-ios {
    height: 2.1em;
    font-size: 1.3rem;
    padding: 0 0.9em;
}

    .button-small-ios[icon-only] ion-icon {
        font-size: 1.3em;
    }

.button-block-ios {
    margin-left: 0;
    margin-right: 0;
}

.button-full-ios {
    margin-left: 0;
    margin-right: 0;
    border-radius: 0;
    border-right-width: 0;
    border-left-width: 0;
}

.button-outline-ios {
    border-radius: 4px;
    border-width: 1px;
    border-style: solid;
    border-color: #488aff;
    color: #488aff;
    background-color: transparent;
}

    .button-outline-ios.activated {
        color: #fff;
        background-color: #488aff;
        opacity: 1;
    }

.button-clear-ios {
    border-color: transparent;
    color: #488aff;
    background-color: transparent;
}

    .button-clear-ios.activated {
        background-color: transparent;
        opacity: 0.4;
    }

    .button-clear-ios:hover:not(.disable-hover) {
        color: #488aff;
        opacity: 0.6;
    }

.button-round-ios {
    border-radius: 64px;
    padding: 0 2.6rem;
}

.button-ios-primary {
    color: #fff;
    background-color: #488aff;
}

    .button-ios-primary.activated {
        background-color: #427feb;
    }

.button-outline-ios-primary {
    border-color: #488aff;
    color: #488aff;
    background-color: transparent;
}

    .button-outline-ios-primary.activated {
        color: #fff;
        background-color: #488aff;
    }

.button-clear-ios-primary {
    border-color: transparent;
    color: #488aff;
    background-color: transparent;
}

    .button-clear-ios-primary.activated {
        opacity: 0.4;
    }

    .button-clear-ios-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.button-ios-secondary {
    color: #fff;
    background-color: #32db64;
}

    .button-ios-secondary.activated {
        background-color: #2ec95c;
    }

.button-outline-ios-secondary {
    border-color: #32db64;
    color: #32db64;
    background-color: transparent;
}

    .button-outline-ios-secondary.activated {
        color: #fff;
        background-color: #32db64;
    }

.button-clear-ios-secondary {
    border-color: transparent;
    color: #32db64;
    background-color: transparent;
}

    .button-clear-ios-secondary.activated {
        opacity: 0.4;
    }

    .button-clear-ios-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.button-ios-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .button-ios-danger.activated {
        background-color: #e13838;
    }

.button-outline-ios-danger {
    border-color: #f53d3d;
    color: #f53d3d;
    background-color: transparent;
}

    .button-outline-ios-danger.activated {
        color: #fff;
        background-color: #f53d3d;
    }

.button-clear-ios-danger {
    border-color: transparent;
    color: #f53d3d;
    background-color: transparent;
}

    .button-clear-ios-danger.activated {
        opacity: 0.4;
    }

    .button-clear-ios-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.button-ios-light {
    color: #000;
    background-color: #f4f4f4;
}

    .button-ios-light.activated {
        background-color: #e0e0e0;
    }

.button-outline-ios-light {
    border-color: #f4f4f4;
    color: #f4f4f4;
    background-color: transparent;
}

    .button-outline-ios-light.activated {
        color: #000;
        background-color: #f4f4f4;
    }

.button-clear-ios-light {
    border-color: transparent;
    color: #f4f4f4;
    background-color: transparent;
}

    .button-clear-ios-light.activated {
        opacity: 0.4;
    }

    .button-clear-ios-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.button-ios-dark {
    color: #fff;
    background-color: #222;
}

    .button-ios-dark.activated {
        background-color: #343434;
    }

.button-outline-ios-dark {
    border-color: #222;
    color: #222;
    background-color: transparent;
}

    .button-outline-ios-dark.activated {
        color: #fff;
        background-color: #222;
    }

.button-clear-ios-dark {
    border-color: transparent;
    color: #222;
    background-color: transparent;
}

    .button-clear-ios-dark.activated {
        opacity: 0.4;
    }

    .button-clear-ios-dark:hover:not(.disable-hover) {
        color: #222;
    }

.button-strong-ios {
    font-weight: 600;
}

.button-md {
    border-radius: 2px;
    overflow: hidden;
    height: 3.6rem;
    font-size: 1.4rem;
    font-weight: 500;
    text-transform: uppercase;
    color: #fff;
    background-color: #488aff;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
    -webkit-transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
    margin: 0.4rem 0.2rem;
    padding: 0 1.1em;
}

    .button-md:hover:not(.disable-hover) {
        background-color: #488aff;
    }

    .button-md.activated {
        background-color: #427feb;
        -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.14), 0 3px 5px rgba(0, 0, 0, 0.21), 0 0 0 0 transparent;
        box-shadow: 0 3px 5px rgba(0, 0, 0, 0.14), 0 3px 5px rgba(0, 0, 0, 0.21), 0 0 0 0 transparent;
    }

    .button-md .button-effect {
        background-color: #fff;
    }

.button-large-md {
    height: 2.8em;
    font-size: 2rem;
    padding: 0 1em;
}

.button-small-md {
    height: 2.1em;
    font-size: 1.3rem;
    padding: 0 0.9em;
}

    .button-small-md[icon-only] ion-icon {
        font-size: 1.4em;
    }

.button-block-md {
    margin-left: 0;
    margin-right: 0;
}

.button-full-md {
    margin-left: 0;
    margin-right: 0;
    border-radius: 0;
    border-right-width: 0;
    border-left-width: 0;
}

.button-outline-md {
    border-width: 1px;
    border-style: solid;
    border-color: #488aff;
    color: #488aff;
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
}

    .button-outline-md:hover:not(.disable-hover) {
        background-color: rgba(158, 158, 158, 0.1);
    }

    .button-outline-md.activated {
        background-color: transparent;
        -webkit-box-shadow: none;
        box-shadow: none;
        opacity: 1;
    }

    .button-outline-md .button-effect {
        background-color: #488aff;
    }

.button-clear-md {
    border-color: transparent;
    color: #488aff;
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    opacity: 1;
}

    .button-clear-md.activated {
        background-color: rgba(158, 158, 158, 0.2);
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .button-clear-md:hover:not(.disable-hover) {
        background-color: rgba(158, 158, 158, 0.1);
    }

    .button-clear-md .button-effect {
        background-color: #999;
    }

.button-round-md {
    border-radius: 64px;
    padding: 0 2.6rem;
}

.button-md [icon-only] {
    padding: 0;
}

.button-effect {
    border-radius: 50%;
    -webkit-transform-origin: center center;
    transform-origin: center center;
    position: absolute;
    z-index: 0;
    display: none;
    background-color: #555;
    opacity: .2;
    -webkit-transition-timing-function: ease-in-out;
    transition-timing-function: ease-in-out;
    pointer-events: none;
    top: 0;
    left: 0;
}

.md button .button-effect {
    display: block;
}

.button-md-primary {
    color: #fff;
    background-color: #488aff;
}

    .button-md-primary:hover:not(.disable-hover) {
        background-color: #488aff;
    }

    .button-md-primary.activated {
        background-color: #427feb;
        opacity: 1;
    }

    .button-md-primary .button-effect {
        background-color: #fff;
    }

.button-outline-md-primary {
    border-color: #4483f2;
    color: #4483f2;
    background-color: transparent;
}

    .button-outline-md-primary:hover:not(.disable-hover) {
        background-color: rgba(158, 158, 158, 0.1);
    }

    .button-outline-md-primary.activated {
        background-color: transparent;
    }

    .button-outline-md-primary .button-effect {
        background-color: #4483f2;
    }

.button-clear-md-primary {
    border-color: transparent;
    color: #488aff;
    background-color: transparent;
}

    .button-clear-md-primary.activated {
        background-color: rgba(158, 158, 158, 0.2);
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .button-clear-md-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.button-md-secondary {
    color: #fff;
    background-color: #32db64;
}

    .button-md-secondary:hover:not(.disable-hover) {
        background-color: #32db64;
    }

    .button-md-secondary.activated {
        background-color: #2ec95c;
        opacity: 1;
    }

    .button-md-secondary .button-effect {
        background-color: #fff;
    }

.button-outline-md-secondary {
    border-color: #30d05f;
    color: #30d05f;
    background-color: transparent;
}

    .button-outline-md-secondary:hover:not(.disable-hover) {
        background-color: rgba(158, 158, 158, 0.1);
    }

    .button-outline-md-secondary.activated {
        background-color: transparent;
    }

    .button-outline-md-secondary .button-effect {
        background-color: #30d05f;
    }

.button-clear-md-secondary {
    border-color: transparent;
    color: #32db64;
    background-color: transparent;
}

    .button-clear-md-secondary.activated {
        background-color: rgba(158, 158, 158, 0.2);
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .button-clear-md-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.button-md-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .button-md-danger:hover:not(.disable-hover) {
        background-color: #f53d3d;
    }

    .button-md-danger.activated {
        background-color: #e13838;
        opacity: 1;
    }

    .button-md-danger .button-effect {
        background-color: #fff;
    }

.button-outline-md-danger {
    border-color: #e93a3a;
    color: #e93a3a;
    background-color: transparent;
}

    .button-outline-md-danger:hover:not(.disable-hover) {
        background-color: rgba(158, 158, 158, 0.1);
    }

    .button-outline-md-danger.activated {
        background-color: transparent;
    }

    .button-outline-md-danger .button-effect {
        background-color: #e93a3a;
    }

.button-clear-md-danger {
    border-color: transparent;
    color: #f53d3d;
    background-color: transparent;
}

    .button-clear-md-danger.activated {
        background-color: rgba(158, 158, 158, 0.2);
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .button-clear-md-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.button-md-light {
    color: #000;
    background-color: #f4f4f4;
}

    .button-md-light:hover:not(.disable-hover) {
        background-color: #f4f4f4;
    }

    .button-md-light.activated {
        background-color: #e0e0e0;
        opacity: 1;
    }

    .button-md-light .button-effect {
        background-color: #000;
    }

.button-outline-md-light {
    border-color: #e8e8e8;
    color: #e8e8e8;
    background-color: transparent;
}

    .button-outline-md-light:hover:not(.disable-hover) {
        background-color: rgba(158, 158, 158, 0.1);
    }

    .button-outline-md-light.activated {
        background-color: transparent;
    }

    .button-outline-md-light .button-effect {
        background-color: #e8e8e8;
    }

.button-clear-md-light {
    border-color: transparent;
    color: #f4f4f4;
    background-color: transparent;
}

    .button-clear-md-light.activated {
        background-color: rgba(158, 158, 158, 0.2);
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .button-clear-md-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.button-md-dark {
    color: #fff;
    background-color: #222;
}

    .button-md-dark:hover:not(.disable-hover) {
        background-color: #222;
    }

    .button-md-dark.activated {
        background-color: #343434;
        opacity: 1;
    }

    .button-md-dark .button-effect {
        background-color: #fff;
    }

.button-outline-md-dark {
    border-color: #2d2d2d;
    color: #2d2d2d;
    background-color: transparent;
}

    .button-outline-md-dark:hover:not(.disable-hover) {
        background-color: rgba(158, 158, 158, 0.1);
    }

    .button-outline-md-dark.activated {
        background-color: transparent;
    }

    .button-outline-md-dark .button-effect {
        background-color: #2d2d2d;
    }

.button-clear-md-dark {
    border-color: transparent;
    color: #222;
    background-color: transparent;
}

    .button-clear-md-dark.activated {
        background-color: rgba(158, 158, 158, 0.2);
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .button-clear-md-dark:hover:not(.disable-hover) {
        color: #222;
    }

.button-strong-md {
    font-weight: bold;
}

.button-wp {
    border-radius: 0;
    height: 3.6rem;
    border: 3px solid transparent;
    font-size: 1.4rem;
    color: #fff;
    background-color: #488aff;
    margin: 0.4rem 0.2rem;
    padding: 0 1.1em;
}

    .button-wp:hover:not(.disable-hover) {
        border-color: #427feb;
        background-color: #488aff;
    }

    .button-wp.activated {
        background-color: #427feb;
    }

.button-large-wp {
    height: 2.8em;
    font-size: 2rem;
    padding: 0 1em;
}

.button-small-wp {
    height: 2.1em;
    font-size: 1.3rem;
    padding: 0 0.9em;
}

    .button-small-wp[icon-only] ion-icon {
        font-size: 1.4em;
    }

.button-block-wp {
    margin-left: 0;
    margin-right: 0;
}

.button-full-wp {
    margin-left: 0;
    margin-right: 0;
    border-radius: 0;
    border-right-width: 0;
    border-left-width: 0;
}

.button-outline-wp {
    border-width: 1px;
    border-style: solid;
    border-color: #488aff;
    color: #488aff;
    background-color: transparent;
}

    .button-outline-wp:hover:not(.disable-hover) {
        background-color: rgba(158, 158, 158, 0.1);
    }

    .button-outline-wp.activated {
        background-color: rgba(72, 138, 255, 0.16);
    }

.button-clear-wp {
    color: #488aff;
    background-color: transparent;
}

    .button-clear-wp.activated {
        background-color: rgba(158, 158, 158, 0.2);
    }

    .button-clear-wp:hover:not(.disable-hover) {
        background-color: rgba(158, 158, 158, 0.1);
    }

.button-round-wp {
    border-radius: 64px;
    padding: 0 2.6rem;
}

.button-wp [icon-only] {
    padding: 0;
}

.button-wp-primary {
    color: #fff;
    background-color: #488aff;
}

    .button-wp-primary:hover:not(.disable-hover) {
        border-color: #427feb;
        background-color: #488aff;
    }

    .button-wp-primary.activated {
        background-color: #427feb;
    }

.button-outline-wp-primary {
    border-color: #4483f2;
    color: #4483f2;
    background-color: transparent;
}

    .button-outline-wp-primary:hover:not(.disable-hover) {
        border-color: #4483f2;
        background-color: rgba(158, 158, 158, 0.1);
    }

    .button-outline-wp-primary.activated {
        background-color: rgba(68, 131, 242, 0.16);
    }

.button-clear-wp-primary {
    color: #488aff;
    background-color: transparent;
}

    .button-clear-wp-primary.activated {
        background-color: rgba(158, 158, 158, 0.2);
    }

    .button-clear-wp-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.button-wp-secondary {
    color: #fff;
    background-color: #32db64;
}

    .button-wp-secondary:hover:not(.disable-hover) {
        border-color: #2ec95c;
        background-color: #32db64;
    }

    .button-wp-secondary.activated {
        background-color: #2ec95c;
    }

.button-outline-wp-secondary {
    border-color: #30d05f;
    color: #30d05f;
    background-color: transparent;
}

    .button-outline-wp-secondary:hover:not(.disable-hover) {
        border-color: #30d05f;
        background-color: rgba(158, 158, 158, 0.1);
    }

    .button-outline-wp-secondary.activated {
        background-color: rgba(48, 208, 95, 0.16);
    }

.button-clear-wp-secondary {
    color: #32db64;
    background-color: transparent;
}

    .button-clear-wp-secondary.activated {
        background-color: rgba(158, 158, 158, 0.2);
    }

    .button-clear-wp-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.button-wp-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .button-wp-danger:hover:not(.disable-hover) {
        border-color: #e13838;
        background-color: #f53d3d;
    }

    .button-wp-danger.activated {
        background-color: #e13838;
    }

.button-outline-wp-danger {
    border-color: #e93a3a;
    color: #e93a3a;
    background-color: transparent;
}

    .button-outline-wp-danger:hover:not(.disable-hover) {
        border-color: #e93a3a;
        background-color: rgba(158, 158, 158, 0.1);
    }

    .button-outline-wp-danger.activated {
        background-color: rgba(233, 58, 58, 0.16);
    }

.button-clear-wp-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .button-clear-wp-danger.activated {
        background-color: rgba(158, 158, 158, 0.2);
    }

    .button-clear-wp-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.button-wp-light {
    color: #000;
    background-color: #f4f4f4;
}

    .button-wp-light:hover:not(.disable-hover) {
        border-color: #e0e0e0;
        background-color: #f4f4f4;
    }

    .button-wp-light.activated {
        background-color: #e0e0e0;
    }

.button-outline-wp-light {
    border-color: #e8e8e8;
    color: #e8e8e8;
    background-color: transparent;
}

    .button-outline-wp-light:hover:not(.disable-hover) {
        border-color: #e8e8e8;
        background-color: rgba(158, 158, 158, 0.1);
    }

    .button-outline-wp-light.activated {
        background-color: rgba(232, 232, 232, 0.16);
    }

.button-clear-wp-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .button-clear-wp-light.activated {
        background-color: rgba(158, 158, 158, 0.2);
    }

    .button-clear-wp-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.button-wp-dark {
    color: #fff;
    background-color: #222;
}

    .button-wp-dark:hover:not(.disable-hover) {
        border-color: #343434;
        background-color: #222;
    }

    .button-wp-dark.activated {
        background-color: #343434;
    }

.button-outline-wp-dark {
    border-color: #2d2d2d;
    color: #2d2d2d;
    background-color: transparent;
}

    .button-outline-wp-dark:hover:not(.disable-hover) {
        border-color: #2d2d2d;
        background-color: rgba(158, 158, 158, 0.1);
    }

    .button-outline-wp-dark.activated {
        background-color: rgba(45, 45, 45, 0.16);
    }

.button-clear-wp-dark {
    color: #222;
    background-color: transparent;
}

    .button-clear-wp-dark.activated {
        background-color: rgba(158, 158, 158, 0.2);
    }

    .button-clear-wp-dark:hover:not(.disable-hover) {
        color: #222;
    }

.button-strong-wp {
    font-weight: bold;
}

ion-card {
    display: block;
    overflow: hidden;
}

    ion-card img {
        display: block;
        width: 100%;
    }

ion-card-header {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

ion-card-content {
    display: block;
}

.card-ios {
    margin: 12px;
    border-radius: 2px;
    width: calc(100% - 24px);
    font-size: 1.4rem;
    background: #fff;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

    .card-ios ion-list {
        margin-bottom: 0;
    }

    .card-ios > .item:last-child,
    .card-ios > .item:last-child .item-inner,
    .card-ios > .item-wrapper:last-child .item {
        border-bottom: 0;
    }

    .card-ios .item-ios.item-block .item-inner {
        border: 0;
    }

.card-content-ios {
    padding: 13px 16px 14px;
    font-size: 1.4rem;
    line-height: 1.4;
}

.card-header-ios {
    font-size: 1.6rem;
    font-weight: 500;
    color: #333;
    padding: 16px;
}

    .card-header-ios + .card-content-ios,
    .card-ios .item + .card-content-ios {
        padding-top: 0;
    }

.card .note-ios {
    font-size: 1.3rem;
}

.card-title-ios {
    display: block;
    font-size: 1.8rem;
    line-height: 1.2;
    color: #222;
    margin: 2px 0;
    padding: 8px 0;
}

.card-ios h1 {
    margin: 0 0 2px;
    font-size: 2.4rem;
    font-weight: normal;
}

.card-ios h2 {
    margin: 2px 0;
    font-size: 1.6rem;
    font-weight: normal;
}

.card-ios h3,
.card-ios h4,
.card-ios h5,
.card-ios h6 {
    margin: 2px 0;
    font-size: 1.4rem;
    font-weight: normal;
}

.card-ios p {
    margin: 0 0 2px;
    font-size: 1.4rem;
    color: #666;
}

.card-ios + ion-card {
    margin-top: 0;
}

.card-ios .text-ios-primary {
    color: #488aff;
}

.card-ios-primary {
    color: #fff;
    background-color: #488aff;
}

    .card-ios-primary .card-header-ios,
    .card-ios-primary .card-title-ios,
    .card-ios-primary .card-content-ios,
    .card-ios-primary p {
        color: #fff;
    }

    .card-ios-primary .text-ios-primary,
    .card-ios-primary .card-header-ios-primary,
    .card-ios-primary .card-title-ios-primary,
    .card-ios-primary .card-content-ios-primary {
        color: #488aff;
    }

    .card-ios-primary .text-ios-secondary,
    .card-ios-primary .card-header-ios-secondary,
    .card-ios-primary .card-title-ios-secondary,
    .card-ios-primary .card-content-ios-secondary {
        color: #32db64;
    }

    .card-ios-primary .text-ios-danger,
    .card-ios-primary .card-header-ios-danger,
    .card-ios-primary .card-title-ios-danger,
    .card-ios-primary .card-content-ios-danger {
        color: #f53d3d;
    }

    .card-ios-primary .text-ios-light,
    .card-ios-primary .card-header-ios-light,
    .card-ios-primary .card-title-ios-light,
    .card-ios-primary .card-content-ios-light {
        color: #f4f4f4;
    }

    .card-ios-primary .text-ios-dark,
    .card-ios-primary .card-header-ios-dark,
    .card-ios-primary .card-title-ios-dark,
    .card-ios-primary .card-content-ios-dark {
        color: #222;
    }

.card-header-ios-primary,
.card-title-ios-primary,
.card-content-ios-primary {
    color: #488aff;
}

.card-ios .text-ios-secondary {
    color: #32db64;
}

.card-ios-secondary {
    color: #fff;
    background-color: #32db64;
}

    .card-ios-secondary .card-header-ios,
    .card-ios-secondary .card-title-ios,
    .card-ios-secondary .card-content-ios,
    .card-ios-secondary p {
        color: #fff;
    }

    .card-ios-secondary .text-ios-primary,
    .card-ios-secondary .card-header-ios-primary,
    .card-ios-secondary .card-title-ios-primary,
    .card-ios-secondary .card-content-ios-primary {
        color: #488aff;
    }

    .card-ios-secondary .text-ios-secondary,
    .card-ios-secondary .card-header-ios-secondary,
    .card-ios-secondary .card-title-ios-secondary,
    .card-ios-secondary .card-content-ios-secondary {
        color: #32db64;
    }

    .card-ios-secondary .text-ios-danger,
    .card-ios-secondary .card-header-ios-danger,
    .card-ios-secondary .card-title-ios-danger,
    .card-ios-secondary .card-content-ios-danger {
        color: #f53d3d;
    }

    .card-ios-secondary .text-ios-light,
    .card-ios-secondary .card-header-ios-light,
    .card-ios-secondary .card-title-ios-light,
    .card-ios-secondary .card-content-ios-light {
        color: #f4f4f4;
    }

    .card-ios-secondary .text-ios-dark,
    .card-ios-secondary .card-header-ios-dark,
    .card-ios-secondary .card-title-ios-dark,
    .card-ios-secondary .card-content-ios-dark {
        color: #222;
    }

.card-header-ios-secondary,
.card-title-ios-secondary,
.card-content-ios-secondary {
    color: #32db64;
}

.card-ios .text-ios-danger {
    color: #f53d3d;
}

.card-ios-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .card-ios-danger .card-header-ios,
    .card-ios-danger .card-title-ios,
    .card-ios-danger .card-content-ios,
    .card-ios-danger p {
        color: #fff;
    }

    .card-ios-danger .text-ios-primary,
    .card-ios-danger .card-header-ios-primary,
    .card-ios-danger .card-title-ios-primary,
    .card-ios-danger .card-content-ios-primary {
        color: #488aff;
    }

    .card-ios-danger .text-ios-secondary,
    .card-ios-danger .card-header-ios-secondary,
    .card-ios-danger .card-title-ios-secondary,
    .card-ios-danger .card-content-ios-secondary {
        color: #32db64;
    }

    .card-ios-danger .text-ios-danger,
    .card-ios-danger .card-header-ios-danger,
    .card-ios-danger .card-title-ios-danger,
    .card-ios-danger .card-content-ios-danger {
        color: #f53d3d;
    }

    .card-ios-danger .text-ios-light,
    .card-ios-danger .card-header-ios-light,
    .card-ios-danger .card-title-ios-light,
    .card-ios-danger .card-content-ios-light {
        color: #f4f4f4;
    }

    .card-ios-danger .text-ios-dark,
    .card-ios-danger .card-header-ios-dark,
    .card-ios-danger .card-title-ios-dark,
    .card-ios-danger .card-content-ios-dark {
        color: #222;
    }

.card-header-ios-danger,
.card-title-ios-danger,
.card-content-ios-danger {
    color: #f53d3d;
}

.card-ios .text-ios-light {
    color: #f4f4f4;
}

.card-ios-light {
    color: #000;
    background-color: #f4f4f4;
}

    .card-ios-light .card-header-ios,
    .card-ios-light .card-title-ios,
    .card-ios-light .card-content-ios,
    .card-ios-light p {
        color: #000;
    }

    .card-ios-light .text-ios-primary,
    .card-ios-light .card-header-ios-primary,
    .card-ios-light .card-title-ios-primary,
    .card-ios-light .card-content-ios-primary {
        color: #488aff;
    }

    .card-ios-light .text-ios-secondary,
    .card-ios-light .card-header-ios-secondary,
    .card-ios-light .card-title-ios-secondary,
    .card-ios-light .card-content-ios-secondary {
        color: #32db64;
    }

    .card-ios-light .text-ios-danger,
    .card-ios-light .card-header-ios-danger,
    .card-ios-light .card-title-ios-danger,
    .card-ios-light .card-content-ios-danger {
        color: #f53d3d;
    }

    .card-ios-light .text-ios-light,
    .card-ios-light .card-header-ios-light,
    .card-ios-light .card-title-ios-light,
    .card-ios-light .card-content-ios-light {
        color: #f4f4f4;
    }

    .card-ios-light .text-ios-dark,
    .card-ios-light .card-header-ios-dark,
    .card-ios-light .card-title-ios-dark,
    .card-ios-light .card-content-ios-dark {
        color: #222;
    }

.card-header-ios-light,
.card-title-ios-light,
.card-content-ios-light {
    color: #f4f4f4;
}

.card-ios .text-ios-dark {
    color: #222;
}

.card-ios-dark {
    color: #fff;
    background-color: #222;
}

    .card-ios-dark .card-header-ios,
    .card-ios-dark .card-title-ios,
    .card-ios-dark .card-content-ios,
    .card-ios-dark p {
        color: #fff;
    }

    .card-ios-dark .text-ios-primary,
    .card-ios-dark .card-header-ios-primary,
    .card-ios-dark .card-title-ios-primary,
    .card-ios-dark .card-content-ios-primary {
        color: #488aff;
    }

    .card-ios-dark .text-ios-secondary,
    .card-ios-dark .card-header-ios-secondary,
    .card-ios-dark .card-title-ios-secondary,
    .card-ios-dark .card-content-ios-secondary {
        color: #32db64;
    }

    .card-ios-dark .text-ios-danger,
    .card-ios-dark .card-header-ios-danger,
    .card-ios-dark .card-title-ios-danger,
    .card-ios-dark .card-content-ios-danger {
        color: #f53d3d;
    }

    .card-ios-dark .text-ios-light,
    .card-ios-dark .card-header-ios-light,
    .card-ios-dark .card-title-ios-light,
    .card-ios-dark .card-content-ios-light {
        color: #f4f4f4;
    }

    .card-ios-dark .text-ios-dark,
    .card-ios-dark .card-header-ios-dark,
    .card-ios-dark .card-title-ios-dark,
    .card-ios-dark .card-content-ios-dark {
        color: #222;
    }

.card-header-ios-dark,
.card-title-ios-dark,
.card-content-ios-dark {
    color: #222;
}

.card-md {
    margin: 10px;
    border-radius: 2px;
    width: calc(100% - 20px);
    font-size: 1.4rem;
    background: #fff;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
}

    .card-md ion-list {
        margin-bottom: 0;
    }

    .card-md > .item:last-child,
    .card-md > .item:last-child .item-inner,
    .card-md > .item-wrapper:last-child .item {
        border-bottom: 0;
    }

    .card-md .item-md.item-block .item-inner {
        border: 0;
    }

.card-content-md {
    padding: 13px 16px;
    font-size: 1.4rem;
    line-height: 1.5;
}

.card-header-md {
    font-size: 1.6rem;
    color: #222;
    padding: 16px;
}

    .card-header-md + .card-content-md,
    .card-md .item + .card-content-md {
        padding-top: 0;
    }

.card .note-md {
    font-size: 1.3rem;
}

.card-title-md {
    display: block;
    font-size: 2.4rem;
    line-height: 1.2;
    color: #222;
    margin: 2px 0;
    padding: 8px 0;
}

.card-md h1 {
    margin: 0 0 2px;
    font-size: 2.4rem;
    font-weight: normal;
    color: #222;
}

.card-md h2 {
    margin: 2px 0;
    font-size: 1.6rem;
    font-weight: normal;
    color: #222;
}

.card-md h3,
.card-md h4,
.card-md h5,
.card-md h6 {
    margin: 2px 0;
    font-size: 1.4rem;
    font-weight: normal;
    color: #222;
}

.card-md p {
    margin: 0 0 2px;
    font-size: 1.4rem;
    font-weight: normal;
    line-height: 1.5;
    color: #222;
}

.card-md + ion-card {
    margin-top: 0;
}

.card-md .text-md-primary {
    color: #488aff;
}

.card-md-primary {
    color: #fff;
    background-color: #488aff;
}

    .card-md-primary .card-header-md,
    .card-md-primary .card-title-md,
    .card-md-primary .card-content-md,
    .card-md-primary h1,
    .card-md-primary h2,
    .card-md-primary h3,
    .card-md-primary h4,
    .card-md-primary h5,
    .card-md-primary h6,
    .card-md-primary p {
        color: #fff;
    }

    .card-md-primary .text-md-primary,
    .card-md-primary .card-header-md-primary,
    .card-md-primary .card-title-md-primary,
    .card-md-primary .card-content-md-primary {
        color: #488aff;
    }

    .card-md-primary .text-md-secondary,
    .card-md-primary .card-header-md-secondary,
    .card-md-primary .card-title-md-secondary,
    .card-md-primary .card-content-md-secondary {
        color: #32db64;
    }

    .card-md-primary .text-md-danger,
    .card-md-primary .card-header-md-danger,
    .card-md-primary .card-title-md-danger,
    .card-md-primary .card-content-md-danger {
        color: #f53d3d;
    }

    .card-md-primary .text-md-light,
    .card-md-primary .card-header-md-light,
    .card-md-primary .card-title-md-light,
    .card-md-primary .card-content-md-light {
        color: #f4f4f4;
    }

    .card-md-primary .text-md-dark,
    .card-md-primary .card-header-md-dark,
    .card-md-primary .card-title-md-dark,
    .card-md-primary .card-content-md-dark {
        color: #222;
    }

.card-header-md-primary,
.card-title-md-primary,
.card-content-md-primary {
    color: #488aff;
}

.card-md .text-md-secondary {
    color: #32db64;
}

.card-md-secondary {
    color: #fff;
    background-color: #32db64;
}

    .card-md-secondary .card-header-md,
    .card-md-secondary .card-title-md,
    .card-md-secondary .card-content-md,
    .card-md-secondary h1,
    .card-md-secondary h2,
    .card-md-secondary h3,
    .card-md-secondary h4,
    .card-md-secondary h5,
    .card-md-secondary h6,
    .card-md-secondary p {
        color: #fff;
    }

    .card-md-secondary .text-md-primary,
    .card-md-secondary .card-header-md-primary,
    .card-md-secondary .card-title-md-primary,
    .card-md-secondary .card-content-md-primary {
        color: #488aff;
    }

    .card-md-secondary .text-md-secondary,
    .card-md-secondary .card-header-md-secondary,
    .card-md-secondary .card-title-md-secondary,
    .card-md-secondary .card-content-md-secondary {
        color: #32db64;
    }

    .card-md-secondary .text-md-danger,
    .card-md-secondary .card-header-md-danger,
    .card-md-secondary .card-title-md-danger,
    .card-md-secondary .card-content-md-danger {
        color: #f53d3d;
    }

    .card-md-secondary .text-md-light,
    .card-md-secondary .card-header-md-light,
    .card-md-secondary .card-title-md-light,
    .card-md-secondary .card-content-md-light {
        color: #f4f4f4;
    }

    .card-md-secondary .text-md-dark,
    .card-md-secondary .card-header-md-dark,
    .card-md-secondary .card-title-md-dark,
    .card-md-secondary .card-content-md-dark {
        color: #222;
    }

.card-header-md-secondary,
.card-title-md-secondary,
.card-content-md-secondary {
    color: #32db64;
}

.card-md .text-md-danger {
    color: #f53d3d;
}

.card-md-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .card-md-danger .card-header-md,
    .card-md-danger .card-title-md,
    .card-md-danger .card-content-md,
    .card-md-danger h1,
    .card-md-danger h2,
    .card-md-danger h3,
    .card-md-danger h4,
    .card-md-danger h5,
    .card-md-danger h6,
    .card-md-danger p {
        color: #fff;
    }

    .card-md-danger .text-md-primary,
    .card-md-danger .card-header-md-primary,
    .card-md-danger .card-title-md-primary,
    .card-md-danger .card-content-md-primary {
        color: #488aff;
    }

    .card-md-danger .text-md-secondary,
    .card-md-danger .card-header-md-secondary,
    .card-md-danger .card-title-md-secondary,
    .card-md-danger .card-content-md-secondary {
        color: #32db64;
    }

    .card-md-danger .text-md-danger,
    .card-md-danger .card-header-md-danger,
    .card-md-danger .card-title-md-danger,
    .card-md-danger .card-content-md-danger {
        color: #f53d3d;
    }

    .card-md-danger .text-md-light,
    .card-md-danger .card-header-md-light,
    .card-md-danger .card-title-md-light,
    .card-md-danger .card-content-md-light {
        color: #f4f4f4;
    }

    .card-md-danger .text-md-dark,
    .card-md-danger .card-header-md-dark,
    .card-md-danger .card-title-md-dark,
    .card-md-danger .card-content-md-dark {
        color: #222;
    }

.card-header-md-danger,
.card-title-md-danger,
.card-content-md-danger {
    color: #f53d3d;
}

.card-md .text-md-light {
    color: #f4f4f4;
}

.card-md-light {
    color: #000;
    background-color: #f4f4f4;
}

    .card-md-light .card-header-md,
    .card-md-light .card-title-md,
    .card-md-light .card-content-md,
    .card-md-light h1,
    .card-md-light h2,
    .card-md-light h3,
    .card-md-light h4,
    .card-md-light h5,
    .card-md-light h6,
    .card-md-light p {
        color: #000;
    }

    .card-md-light .text-md-primary,
    .card-md-light .card-header-md-primary,
    .card-md-light .card-title-md-primary,
    .card-md-light .card-content-md-primary {
        color: #488aff;
    }

    .card-md-light .text-md-secondary,
    .card-md-light .card-header-md-secondary,
    .card-md-light .card-title-md-secondary,
    .card-md-light .card-content-md-secondary {
        color: #32db64;
    }

    .card-md-light .text-md-danger,
    .card-md-light .card-header-md-danger,
    .card-md-light .card-title-md-danger,
    .card-md-light .card-content-md-danger {
        color: #f53d3d;
    }

    .card-md-light .text-md-light,
    .card-md-light .card-header-md-light,
    .card-md-light .card-title-md-light,
    .card-md-light .card-content-md-light {
        color: #f4f4f4;
    }

    .card-md-light .text-md-dark,
    .card-md-light .card-header-md-dark,
    .card-md-light .card-title-md-dark,
    .card-md-light .card-content-md-dark {
        color: #222;
    }

.card-header-md-light,
.card-title-md-light,
.card-content-md-light {
    color: #f4f4f4;
}

.card-md .text-md-dark {
    color: #222;
}

.card-md-dark {
    color: #fff;
    background-color: #222;
}

    .card-md-dark .card-header-md,
    .card-md-dark .card-title-md,
    .card-md-dark .card-content-md,
    .card-md-dark h1,
    .card-md-dark h2,
    .card-md-dark h3,
    .card-md-dark h4,
    .card-md-dark h5,
    .card-md-dark h6,
    .card-md-dark p {
        color: #fff;
    }

    .card-md-dark .text-md-primary,
    .card-md-dark .card-header-md-primary,
    .card-md-dark .card-title-md-primary,
    .card-md-dark .card-content-md-primary {
        color: #488aff;
    }

    .card-md-dark .text-md-secondary,
    .card-md-dark .card-header-md-secondary,
    .card-md-dark .card-title-md-secondary,
    .card-md-dark .card-content-md-secondary {
        color: #32db64;
    }

    .card-md-dark .text-md-danger,
    .card-md-dark .card-header-md-danger,
    .card-md-dark .card-title-md-danger,
    .card-md-dark .card-content-md-danger {
        color: #f53d3d;
    }

    .card-md-dark .text-md-light,
    .card-md-dark .card-header-md-light,
    .card-md-dark .card-title-md-light,
    .card-md-dark .card-content-md-light {
        color: #f4f4f4;
    }

    .card-md-dark .text-md-dark,
    .card-md-dark .card-header-md-dark,
    .card-md-dark .card-title-md-dark,
    .card-md-dark .card-content-md-dark {
        color: #222;
    }

.card-header-md-dark,
.card-title-md-dark,
.card-content-md-dark {
    color: #222;
}

.card-wp {
    margin: 8px;
    border-radius: 1px;
    width: calc(100% - 16px);
    font-size: 1.4rem;
    background: #fff;
    -webkit-box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.2);
}

    .card-wp ion-list {
        margin-bottom: 0;
    }

    .card-wp > .item:last-child,
    .card-wp > .item:last-child .item-inner,
    .card-wp > .item-wrapper:last-child .item {
        border-bottom: 0;
    }

    .card-wp .item-wp.item-block .item-inner {
        border: 0;
    }

.card-content-wp {
    padding: 13px 16px;
    font-size: 1.4rem;
    line-height: 1.5;
}

.card-header-wp {
    font-size: 1.6rem;
    color: #222;
    padding: 16px;
}

    .card-header-wp + .card-content-wp,
    .card-wp .item + .card-content-wp {
        padding-top: 0;
    }

.card .note-wp {
    font-size: 1.3rem;
}

.card-title-wp {
    display: block;
    font-size: 2.4rem;
    line-height: 1.2;
    color: #222;
    margin: 2px 0;
    padding: 8px 0;
}

.card-wp h1 {
    margin: 0 0 2px;
    font-size: 2.4rem;
    font-weight: normal;
    color: #222;
}

.card-wp h2 {
    margin: 2px 0;
    font-size: 1.6rem;
    font-weight: normal;
    color: #222;
}

.card-wp h3,
.card-wp h4,
.card-wp h5,
.card-wp h6 {
    margin: 2px 0;
    font-size: 1.4rem;
    font-weight: normal;
    color: #222;
}

.card-wp p {
    margin: 0 0 2px;
    font-size: 1.4rem;
    font-weight: normal;
    line-height: 1.5;
    color: #222;
}

.card-wp + ion-card {
    margin-top: 0;
}

.card-wp .text-wp-primary {
    color: #488aff;
}

.card-wp-primary {
    color: #fff;
    background-color: #488aff;
}

    .card-wp-primary .card-header-wp,
    .card-wp-primary .card-title-wp,
    .card-wp-primary .card-content-wp,
    .card-wp-primary h1,
    .card-wp-primary h2,
    .card-wp-primary h3,
    .card-wp-primary h4,
    .card-wp-primary h5,
    .card-wp-primary h6,
    .card-wp-primary p {
        color: #fff;
    }

    .card-wp-primary .text-wp-primary,
    .card-wp-primary .card-header-wp-primary,
    .card-wp-primary .card-title-wp-primary,
    .card-wp-primary .card-content-wp-primary {
        color: #488aff;
    }

    .card-wp-primary .text-wp-secondary,
    .card-wp-primary .card-header-wp-secondary,
    .card-wp-primary .card-title-wp-secondary,
    .card-wp-primary .card-content-wp-secondary {
        color: #32db64;
    }

    .card-wp-primary .text-wp-danger,
    .card-wp-primary .card-header-wp-danger,
    .card-wp-primary .card-title-wp-danger,
    .card-wp-primary .card-content-wp-danger {
        color: #f53d3d;
    }

    .card-wp-primary .text-wp-light,
    .card-wp-primary .card-header-wp-light,
    .card-wp-primary .card-title-wp-light,
    .card-wp-primary .card-content-wp-light {
        color: #f4f4f4;
    }

    .card-wp-primary .text-wp-dark,
    .card-wp-primary .card-header-wp-dark,
    .card-wp-primary .card-title-wp-dark,
    .card-wp-primary .card-content-wp-dark {
        color: #222;
    }

.card-header-wp-primary,
.card-title-wp-primary,
.card-content-wp-primary {
    color: #488aff;
}

.card-wp .text-wp-secondary {
    color: #32db64;
}

.card-wp-secondary {
    color: #fff;
    background-color: #32db64;
}

    .card-wp-secondary .card-header-wp,
    .card-wp-secondary .card-title-wp,
    .card-wp-secondary .card-content-wp,
    .card-wp-secondary h1,
    .card-wp-secondary h2,
    .card-wp-secondary h3,
    .card-wp-secondary h4,
    .card-wp-secondary h5,
    .card-wp-secondary h6,
    .card-wp-secondary p {
        color: #fff;
    }

    .card-wp-secondary .text-wp-primary,
    .card-wp-secondary .card-header-wp-primary,
    .card-wp-secondary .card-title-wp-primary,
    .card-wp-secondary .card-content-wp-primary {
        color: #488aff;
    }

    .card-wp-secondary .text-wp-secondary,
    .card-wp-secondary .card-header-wp-secondary,
    .card-wp-secondary .card-title-wp-secondary,
    .card-wp-secondary .card-content-wp-secondary {
        color: #32db64;
    }

    .card-wp-secondary .text-wp-danger,
    .card-wp-secondary .card-header-wp-danger,
    .card-wp-secondary .card-title-wp-danger,
    .card-wp-secondary .card-content-wp-danger {
        color: #f53d3d;
    }

    .card-wp-secondary .text-wp-light,
    .card-wp-secondary .card-header-wp-light,
    .card-wp-secondary .card-title-wp-light,
    .card-wp-secondary .card-content-wp-light {
        color: #f4f4f4;
    }

    .card-wp-secondary .text-wp-dark,
    .card-wp-secondary .card-header-wp-dark,
    .card-wp-secondary .card-title-wp-dark,
    .card-wp-secondary .card-content-wp-dark {
        color: #222;
    }

.card-header-wp-secondary,
.card-title-wp-secondary,
.card-content-wp-secondary {
    color: #32db64;
}

.card-wp .text-wp-danger {
    color: #f53d3d;
}

.card-wp-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .card-wp-danger .card-header-wp,
    .card-wp-danger .card-title-wp,
    .card-wp-danger .card-content-wp,
    .card-wp-danger h1,
    .card-wp-danger h2,
    .card-wp-danger h3,
    .card-wp-danger h4,
    .card-wp-danger h5,
    .card-wp-danger h6,
    .card-wp-danger p {
        color: #fff;
    }

    .card-wp-danger .text-wp-primary,
    .card-wp-danger .card-header-wp-primary,
    .card-wp-danger .card-title-wp-primary,
    .card-wp-danger .card-content-wp-primary {
        color: #488aff;
    }

    .card-wp-danger .text-wp-secondary,
    .card-wp-danger .card-header-wp-secondary,
    .card-wp-danger .card-title-wp-secondary,
    .card-wp-danger .card-content-wp-secondary {
        color: #32db64;
    }

    .card-wp-danger .text-wp-danger,
    .card-wp-danger .card-header-wp-danger,
    .card-wp-danger .card-title-wp-danger,
    .card-wp-danger .card-content-wp-danger {
        color: #f53d3d;
    }

    .card-wp-danger .text-wp-light,
    .card-wp-danger .card-header-wp-light,
    .card-wp-danger .card-title-wp-light,
    .card-wp-danger .card-content-wp-light {
        color: #f4f4f4;
    }

    .card-wp-danger .text-wp-dark,
    .card-wp-danger .card-header-wp-dark,
    .card-wp-danger .card-title-wp-dark,
    .card-wp-danger .card-content-wp-dark {
        color: #222;
    }

.card-header-wp-danger,
.card-title-wp-danger,
.card-content-wp-danger {
    color: #f53d3d;
}

.card-wp .text-wp-light {
    color: #f4f4f4;
}

.card-wp-light {
    color: #000;
    background-color: #f4f4f4;
}

    .card-wp-light .card-header-wp,
    .card-wp-light .card-title-wp,
    .card-wp-light .card-content-wp,
    .card-wp-light h1,
    .card-wp-light h2,
    .card-wp-light h3,
    .card-wp-light h4,
    .card-wp-light h5,
    .card-wp-light h6,
    .card-wp-light p {
        color: #000;
    }

    .card-wp-light .text-wp-primary,
    .card-wp-light .card-header-wp-primary,
    .card-wp-light .card-title-wp-primary,
    .card-wp-light .card-content-wp-primary {
        color: #488aff;
    }

    .card-wp-light .text-wp-secondary,
    .card-wp-light .card-header-wp-secondary,
    .card-wp-light .card-title-wp-secondary,
    .card-wp-light .card-content-wp-secondary {
        color: #32db64;
    }

    .card-wp-light .text-wp-danger,
    .card-wp-light .card-header-wp-danger,
    .card-wp-light .card-title-wp-danger,
    .card-wp-light .card-content-wp-danger {
        color: #f53d3d;
    }

    .card-wp-light .text-wp-light,
    .card-wp-light .card-header-wp-light,
    .card-wp-light .card-title-wp-light,
    .card-wp-light .card-content-wp-light {
        color: #f4f4f4;
    }

    .card-wp-light .text-wp-dark,
    .card-wp-light .card-header-wp-dark,
    .card-wp-light .card-title-wp-dark,
    .card-wp-light .card-content-wp-dark {
        color: #222;
    }

.card-header-wp-light,
.card-title-wp-light,
.card-content-wp-light {
    color: #f4f4f4;
}

.card-wp .text-wp-dark {
    color: #222;
}

.card-wp-dark {
    color: #fff;
    background-color: #222;
}

    .card-wp-dark .card-header-wp,
    .card-wp-dark .card-title-wp,
    .card-wp-dark .card-content-wp,
    .card-wp-dark h1,
    .card-wp-dark h2,
    .card-wp-dark h3,
    .card-wp-dark h4,
    .card-wp-dark h5,
    .card-wp-dark h6,
    .card-wp-dark p {
        color: #fff;
    }

    .card-wp-dark .text-wp-primary,
    .card-wp-dark .card-header-wp-primary,
    .card-wp-dark .card-title-wp-primary,
    .card-wp-dark .card-content-wp-primary {
        color: #488aff;
    }

    .card-wp-dark .text-wp-secondary,
    .card-wp-dark .card-header-wp-secondary,
    .card-wp-dark .card-title-wp-secondary,
    .card-wp-dark .card-content-wp-secondary {
        color: #32db64;
    }

    .card-wp-dark .text-wp-danger,
    .card-wp-dark .card-header-wp-danger,
    .card-wp-dark .card-title-wp-danger,
    .card-wp-dark .card-content-wp-danger {
        color: #f53d3d;
    }

    .card-wp-dark .text-wp-light,
    .card-wp-dark .card-header-wp-light,
    .card-wp-dark .card-title-wp-light,
    .card-wp-dark .card-content-wp-light {
        color: #f4f4f4;
    }

    .card-wp-dark .text-wp-dark,
    .card-wp-dark .card-header-wp-dark,
    .card-wp-dark .card-title-wp-dark,
    .card-wp-dark .card-content-wp-dark {
        color: #222;
    }

.card-header-wp-dark,
.card-title-wp-dark,
.card-content-wp-dark {
    color: #222;
}

.checkbox-ios {
    position: relative;
    display: inline-block;
}

    .checkbox-ios .checkbox-icon {
        border-radius: 50%;
        position: relative;
        width: 21px;
        height: 21px;
        border-width: 1px;
        border-style: solid;
        border-color: #c8c7cc;
        background-color: #fff;
    }

    .checkbox-ios .checkbox-checked {
        border-color: #488aff;
        background-color: #488aff;
    }

        .checkbox-ios .checkbox-checked .checkbox-inner {
            left: 7px;
            top: 4px;
            position: absolute;
            width: 4px;
            height: 9px;
            border-width: 1px;
            border-top-width: 0;
            border-left-width: 0;
            border-style: solid;
            border-color: #fff;
            -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
        }

    .checkbox-ios.checkbox-disabled,
    .item-ios.item-checkbox-disabled ion-label {
        opacity: 0.3;
        pointer-events: none;
    }

.item.item-ios .checkbox-ios {
    position: static;
    display: block;
    margin: 8px 16px 8px 2px;
}

    .item.item-ios .checkbox-ios[item-right],
    .item.item-ios .checkbox-ios[item-end] {
        margin: 10px 8px 9px 0;
    }

.checkbox-ios-primary .checkbox-checked {
    border-color: #488aff;
    background-color: #488aff;
}

    .checkbox-ios-primary .checkbox-checked .checkbox-inner {
        border-color: #fff;
    }

.checkbox-ios-secondary .checkbox-checked {
    border-color: #32db64;
    background-color: #32db64;
}

    .checkbox-ios-secondary .checkbox-checked .checkbox-inner {
        border-color: #fff;
    }

.checkbox-ios-danger .checkbox-checked {
    border-color: #f53d3d;
    background-color: #f53d3d;
}

    .checkbox-ios-danger .checkbox-checked .checkbox-inner {
        border-color: #fff;
    }

.checkbox-ios-light .checkbox-checked {
    border-color: #f4f4f4;
    background-color: #f4f4f4;
}

    .checkbox-ios-light .checkbox-checked .checkbox-inner {
        border-color: #000;
    }

.checkbox-ios-dark .checkbox-checked {
    border-color: #222;
    background-color: #222;
}

    .checkbox-ios-dark .checkbox-checked .checkbox-inner {
        border-color: #fff;
    }

.checkbox-md {
    position: relative;
    display: inline-block;
}

    .checkbox-md .checkbox-icon {
        border-radius: 2px;
        position: relative;
        width: 16px;
        height: 16px;
        border-width: 2px;
        border-style: solid;
        border-color: #787878;
        background-color: #fff;
        -webkit-transition-duration: 280ms;
        transition-duration: 280ms;
        -webkit-transition-property: background;
        transition-property: background;
        -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    }

    .checkbox-md .checkbox-checked {
        border-color: #488aff;
        background-color: #488aff;
    }

        .checkbox-md .checkbox-checked .checkbox-inner {
            left: 4px;
            top: 0;
            position: absolute;
            width: 5px;
            height: 10px;
            border-width: 2px;
            border-top-width: 0;
            border-left-width: 0;
            border-style: solid;
            border-color: #fff;
            -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
        }

    .checkbox-md.checkbox-disabled,
    .item-md.item-checkbox-disabled ion-label {
        opacity: 0.3;
        pointer-events: none;
    }

.item.item-md .checkbox-md {
    position: static;
    display: block;
    margin: 9px 36px 9px 4px;
}

    .item.item-md .checkbox-md[item-right],
    .item.item-md .checkbox-md[item-end] {
        margin: 11px 10px 10px 0;
    }

.checkbox-md + .item-inner ion-label {
    margin-left: 0;
}

.checkbox-md-primary .checkbox-checked {
    border-color: #488aff;
    background-color: #488aff;
}

    .checkbox-md-primary .checkbox-checked .checkbox-inner {
        border-color: #fff;
    }

.checkbox-md-secondary .checkbox-checked {
    border-color: #32db64;
    background-color: #32db64;
}

    .checkbox-md-secondary .checkbox-checked .checkbox-inner {
        border-color: #fff;
    }

.checkbox-md-danger .checkbox-checked {
    border-color: #f53d3d;
    background-color: #f53d3d;
}

    .checkbox-md-danger .checkbox-checked .checkbox-inner {
        border-color: #fff;
    }

.checkbox-md-light .checkbox-checked {
    border-color: #f4f4f4;
    background-color: #f4f4f4;
}

    .checkbox-md-light .checkbox-checked .checkbox-inner {
        border-color: #000;
    }

.checkbox-md-dark .checkbox-checked {
    border-color: #222;
    background-color: #222;
}

    .checkbox-md-dark .checkbox-checked .checkbox-inner {
        border-color: #fff;
    }

.checkbox-wp {
    position: relative;
    display: inline-block;
}

    .checkbox-wp .checkbox-icon {
        border-radius: 0;
        position: relative;
        width: 16px;
        height: 16px;
        border-width: 2px;
        border-style: solid;
        border-color: #333;
        background-color: #fff;
    }

    .checkbox-wp .checkbox-checked {
        border-color: #488aff;
        background-color: #488aff;
    }

        .checkbox-wp .checkbox-checked .checkbox-inner {
            left: 3px;
            top: -2px;
            position: absolute;
            width: 6px;
            height: 12px;
            border-width: 1px;
            border-top-width: 0;
            border-left-width: 0;
            border-style: solid;
            border-color: #fff;
            -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
        }

    .checkbox-wp.checkbox-disabled,
    .item-wp.item-checkbox-disabled ion-label {
        opacity: 0.3;
        pointer-events: none;
    }

.item.item-wp .checkbox-wp {
    position: static;
    display: block;
    margin: 9px 16px 9px 4px;
}

    .item.item-wp .checkbox-wp[item-right],
    .item.item-wp .checkbox-wp[item-end] {
        margin: 11px 10px 10px 0;
    }

.checkbox-wp + .item-inner ion-label {
    margin-left: 0;
}

.checkbox-wp-primary .checkbox-checked {
    border-color: #488aff;
    background-color: #488aff;
}

    .checkbox-wp-primary .checkbox-checked .checkbox-inner {
        border-color: #fff;
    }

.checkbox-wp-secondary .checkbox-checked {
    border-color: #32db64;
    background-color: #32db64;
}

    .checkbox-wp-secondary .checkbox-checked .checkbox-inner {
        border-color: #fff;
    }

.checkbox-wp-danger .checkbox-checked {
    border-color: #f53d3d;
    background-color: #f53d3d;
}

    .checkbox-wp-danger .checkbox-checked .checkbox-inner {
        border-color: #fff;
    }

.checkbox-wp-light .checkbox-checked {
    border-color: #f4f4f4;
    background-color: #f4f4f4;
}

    .checkbox-wp-light .checkbox-checked .checkbox-inner {
        border-color: #000;
    }

.checkbox-wp-dark .checkbox-checked {
    border-color: #222;
    background-color: #222;
}

    .checkbox-wp-dark .checkbox-checked .checkbox-inner {
        border-color: #fff;
    }

ion-chip {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    font-weight: normal;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

    ion-chip .button {
        border-radius: 50%;
        width: 32px;
        height: 32px;
        margin: 0;
    }

    ion-chip ion-icon {
        text-align: center;
        border-radius: 50%;
        width: 32px;
        height: 32px;
        font-size: 18px;
        line-height: 32px;
    }

    ion-chip ion-avatar {
        border-radius: 50%;
        width: 32px;
        min-width: 32px;
        height: 32px;
        min-height: 32px;
    }

        ion-chip ion-avatar img {
            border-radius: 50%;
            display: block;
            width: 100%;
            max-width: 100%;
            height: 100%;
            max-height: 100%;
        }

.chip-ios {
    border-radius: 16px;
    height: 32px;
    font-size: 13px;
    line-height: 32px;
    color: rgba(0, 0, 0, 0.87);
    background: rgba(0, 0, 0, 0.12);
    margin: 2px 0;
}

    .chip-ios > ion-label {
        margin: 0 10px;
    }

    .chip-ios > ion-icon {
        color: #fff;
        background-color: #488aff;
    }

    .chip-ios-primary,
    .chip-ios .icon-ios-primary {
        color: #fff;
        background-color: #488aff;
    }

    .chip-ios-secondary,
    .chip-ios .icon-ios-secondary {
        color: #fff;
        background-color: #32db64;
    }

    .chip-ios-danger,
    .chip-ios .icon-ios-danger {
        color: #fff;
        background-color: #f53d3d;
    }

    .chip-ios-light,
    .chip-ios .icon-ios-light {
        color: #000;
        background-color: #f4f4f4;
    }

    .chip-ios-dark,
    .chip-ios .icon-ios-dark {
        color: #fff;
        background-color: #222;
    }

.chip-md {
    border-radius: 16px;
    height: 32px;
    font-size: 13px;
    line-height: 32px;
    color: rgba(0, 0, 0, 0.87);
    background: rgba(0, 0, 0, 0.12);
    margin: 2px 0;
}

    .chip-md > ion-label {
        margin: 0 10px;
    }

    .chip-md > ion-icon {
        color: #fff;
        background-color: #488aff;
    }

    .chip-md-primary,
    .chip-md .icon-md-primary {
        color: #fff;
        background-color: #488aff;
    }

    .chip-md-secondary,
    .chip-md .icon-md-secondary {
        color: #fff;
        background-color: #32db64;
    }

    .chip-md-danger,
    .chip-md .icon-md-danger {
        color: #fff;
        background-color: #f53d3d;
    }

    .chip-md-light,
    .chip-md .icon-md-light {
        color: #000;
        background-color: #f4f4f4;
    }

    .chip-md-dark,
    .chip-md .icon-md-dark {
        color: #fff;
        background-color: #222;
    }

.chip-wp {
    border-radius: 16px;
    height: 32px;
    font-size: 13px;
    line-height: 32px;
    color: rgba(0, 0, 0, 0.87);
    background: rgba(0, 0, 0, 0.12);
    margin: 2px 0;
}

    .chip-wp > ion-label {
        margin: 0 10px;
    }

    .chip-wp > ion-icon {
        color: #fff;
        background-color: #488aff;
    }

    .chip-wp .button {
        border: 0;
    }

    .chip-wp-primary,
    .chip-wp .icon-wp-primary {
        color: #fff;
        background-color: #488aff;
    }

    .chip-wp-secondary,
    .chip-wp .icon-wp-secondary {
        color: #fff;
        background-color: #32db64;
    }

    .chip-wp-danger,
    .chip-wp .icon-wp-danger {
        color: #fff;
        background-color: #f53d3d;
    }

    .chip-wp-light,
    .chip-wp .icon-wp-light {
        color: #000;
        background-color: #f4f4f4;
    }

    .chip-wp-dark,
    .chip-wp .icon-wp-dark {
        color: #fff;
        background-color: #222;
    }

ion-content {
    left: 0;
    top: 0;
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    contain: size style;
}

.ion-page > ion-content {
    position: absolute;
}

a {
    color: #488aff;
}

.scroll-content {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    z-index: 1;
    display: block;
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    will-change: scroll-position;
    contain: size style layout;
}

ion-content.js-scroll > .scroll-content {
    position: relative;
    min-height: 100%;
    overflow-x: initial;
    overflow-y: initial;
    -webkit-overflow-scrolling: auto;
    will-change: initial;
}

.disable-scroll .ion-page {
    pointer-events: none;
    -ms-touch-action: none;
    touch-action: none;
}

ion-content.has-refresher > .scroll-content {
    background-color: inherit;
}

.fixed-content {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    display: block;
}

[ion-fixed] {
    position: absolute;
    z-index: 999;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

ion-app [no-padding],
ion-app [no-padding] .scroll-content {
    padding: 0;
}

ion-app [no-margin],
ion-app [no-margin] .scroll-content {
    margin: 0;
}

.content-ios {
    color: #000;
    background-color: #fff;
}

    .content-ios.outer-content {
        background: #efeff4;
    }

    .content-ios hr {
        height: 0.55px;
        background-color: rgba(0, 0, 0, 0.12);
    }

.ios .ion-page.show-page ~ .nav-decor {
    left: 0;
    top: 0;
    position: absolute;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    background: #000;
    pointer-events: none;
}

ion-app.ios [padding] {
    padding: 16px;
}

ion-app.ios [padding-top] {
    padding-top: 16px;
}

ion-app.ios [padding-left] {
    padding-left: 16px;
}

ion-app.ios [padding-right] {
    padding-right: 16px;
}

ion-app.ios [padding-bottom] {
    padding-bottom: 16px;
}

ion-app.ios [padding-vertical] {
    padding-top: 16px;
    padding-bottom: 16px;
}

ion-app.ios [padding-horizontal] {
    padding-left: 16px;
    padding-right: 16px;
}

ion-app.ios [padding] .scroll-content {
    padding: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.ios [padding] .scroll-content {
        padding-left: calc(constant(safe-area-inset-left) + 16px);
        padding-top: 16px;
        padding-bottom: 16px;
        padding: 16px calc(env(safe-area-inset-right) + 16px) 16px calc(env(safe-area-inset-left) + 16px);
    }
}

ion-app.ios [padding-top] .scroll-content {
    padding-top: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.ios [padding-top] .scroll-content {
        padding-top: 16px;
        padding-top: 16px;
    }
}

ion-app.ios [padding-left] .scroll-content {
    padding-left: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.ios [padding-left] .scroll-content {
        padding-left: calc(constant(safe-area-inset-left) + 16px);
        padding-left: calc(env(safe-area-inset-left) + 16px);
    }
}

ion-app.ios [padding-right] .scroll-content {
    padding-right: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.ios [padding-right] .scroll-content {
        padding-right: calc(constant(safe-area-inset-right) + 16px);
        padding-right: calc(env(safe-area-inset-right) + 16px);
    }
}

ion-app.ios [padding-bottom] .scroll-content {
    padding-bottom: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.ios [padding-bottom] .scroll-content {
        padding-bottom: 16px;
        padding-bottom: 16px;
    }
}

ion-app.ios [padding-vertical] .scroll-content {
    padding-top: 16px;
    padding-bottom: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.ios [padding-vertical] .scroll-content {
        padding-top: 16px;
        padding-bottom: 16px;
        padding-top: 16px;
        padding-bottom: 16px;
    }
}

ion-app.ios [padding-horizontal] .scroll-content {
    padding-left: 16px;
    padding-right: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.ios [padding-horizontal] .scroll-content {
        padding-left: calc(constant(safe-area-inset-left) + 16px);
        padding-right: calc(constant(safe-area-inset-right) + 16px);
        padding-left: calc(env(safe-area-inset-left) + 16px);
        padding-right: calc(env(safe-area-inset-right) + 16px);
    }
}

ion-app.ios [margin],
ion-app.ios [margin] .scroll-content {
    margin: 16px;
}

ion-app.ios [margin-top],
ion-app.ios [margin-top] .scroll-content {
    margin-top: 16px;
}

ion-app.ios [margin-left],
ion-app.ios [margin-left] .scroll-content {
    margin-left: 16px;
}

ion-app.ios [margin-start],
ion-app.ios [margin-start] .scroll-content {
    margin-left: 16px;
}

ion-app.ios [margin-right],
ion-app.ios [margin-right] .scroll-content {
    margin-right: 16px;
}

ion-app.ios [margin-end],
ion-app.ios [margin-end] .scroll-content {
    margin-right: 16px;
}

ion-app.ios [margin-bottom],
ion-app.ios [margin-bottom] .scroll-content {
    margin-bottom: 16px;
}

ion-app.ios [margin-vertical],
ion-app.ios [margin-vertical] .scroll-content {
    margin-top: 16px;
    margin-bottom: 16px;
}

ion-app.ios [margin-horizontal],
ion-app.ios [margin-horizontal] .scroll-content {
    margin-left: 16px;
    margin-right: 16px;
}

.content-ios:not([no-bounce]) > .scroll-content::before,
.content-ios:not([no-bounce]) > .scroll-content::after {
    position: absolute;
    width: 1px;
    height: 1px;
    content: "";
}

.content-ios:not([no-bounce]) > .scroll-content::before {
    bottom: -1px;
}

.content-ios:not([no-bounce]) > .scroll-content::after {
    top: -1px;
}

.platform-core .content-ios .scroll-content::after,
.platform-core .content-ios .scroll-content::before {
    position: initial;
    top: initial;
    bottom: initial;
    width: initial;
    height: initial;
}

.content-md {
    color: #000;
    background-color: #fff;
}

    .content-md hr {
        background-color: rgba(0, 0, 0, 0.08);
    }

ion-app.md [padding] {
    padding: 16px;
}

ion-app.md [padding-top] {
    padding-top: 16px;
}

ion-app.md [padding-left] {
    padding-left: 16px;
}

ion-app.md [padding-right] {
    padding-right: 16px;
}

ion-app.md [padding-bottom] {
    padding-bottom: 16px;
}

ion-app.md [padding-vertical] {
    padding-top: 16px;
    padding-bottom: 16px;
}

ion-app.md [padding-horizontal] {
    padding-left: 16px;
    padding-right: 16px;
}

ion-app.md [padding] .scroll-content {
    padding: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.md [padding] .scroll-content {
        padding-left: calc(constant(safe-area-inset-left) + 16px);
        padding-top: 16px;
        padding-bottom: 16px;
        padding: 16px calc(env(safe-area-inset-right) + 16px) 16px calc(env(safe-area-inset-left) + 16px);
    }
}

ion-app.md [padding-top] .scroll-content {
    padding-top: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.md [padding-top] .scroll-content {
        padding-top: 16px;
        padding-top: 16px;
    }
}

ion-app.md [padding-left] .scroll-content {
    padding-left: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.md [padding-left] .scroll-content {
        padding-left: calc(constant(safe-area-inset-left) + 16px);
        padding-left: calc(env(safe-area-inset-left) + 16px);
    }
}

ion-app.md [padding-right] .scroll-content {
    padding-right: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.md [padding-right] .scroll-content {
        padding-right: calc(constant(safe-area-inset-right) + 16px);
        padding-right: calc(env(safe-area-inset-right) + 16px);
    }
}

ion-app.md [padding-bottom] .scroll-content {
    padding-bottom: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.md [padding-bottom] .scroll-content {
        padding-bottom: 16px;
        padding-bottom: 16px;
    }
}

ion-app.md [padding-vertical] .scroll-content {
    padding-top: 16px;
    padding-bottom: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.md [padding-vertical] .scroll-content {
        padding-top: 16px;
        padding-bottom: 16px;
        padding-top: 16px;
        padding-bottom: 16px;
    }
}

ion-app.md [padding-horizontal] .scroll-content {
    padding-left: 16px;
    padding-right: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.md [padding-horizontal] .scroll-content {
        padding-left: calc(constant(safe-area-inset-left) + 16px);
        padding-right: calc(constant(safe-area-inset-right) + 16px);
        padding-left: calc(env(safe-area-inset-left) + 16px);
        padding-right: calc(env(safe-area-inset-right) + 16px);
    }
}

ion-app.md [margin],
ion-app.md [margin] .scroll-content {
    margin: 16px;
}

ion-app.md [margin-top],
ion-app.md [margin-top] .scroll-content {
    margin-top: 16px;
}

ion-app.md [margin-left],
ion-app.md [margin-left] .scroll-content {
    margin-left: 16px;
}

ion-app.md [margin-start],
ion-app.md [margin-start] .scroll-content {
    margin-left: 16px;
}

ion-app.md [margin-right],
ion-app.md [margin-right] .scroll-content {
    margin-right: 16px;
}

ion-app.md [margin-end],
ion-app.md [margin-end] .scroll-content {
    margin-right: 16px;
}

ion-app.md [margin-bottom],
ion-app.md [margin-bottom] .scroll-content {
    margin-bottom: 16px;
}

ion-app.md [margin-vertical],
ion-app.md [margin-vertical] .scroll-content {
    margin-top: 16px;
    margin-bottom: 16px;
}

ion-app.md [margin-horizontal],
ion-app.md [margin-horizontal] .scroll-content {
    margin-left: 16px;
    margin-right: 16px;
}

.content-wp {
    color: #000;
    background-color: #fff;
}

    .content-wp hr {
        background-color: rgba(0, 0, 0, 0.08);
    }

ion-app.wp [padding] {
    padding: 16px;
}

ion-app.wp [padding-top] {
    padding-top: 16px;
}

ion-app.wp [padding-left] {
    padding-left: 16px;
}

ion-app.wp [padding-right] {
    padding-right: 16px;
}

ion-app.wp [padding-bottom] {
    padding-bottom: 16px;
}

ion-app.wp [padding-vertical] {
    padding-top: 16px;
    padding-bottom: 16px;
}

ion-app.wp [padding-horizontal] {
    padding-left: 16px;
    padding-right: 16px;
}

ion-app.wp [padding] .scroll-content {
    padding: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.wp [padding] .scroll-content {
        padding-left: calc(constant(safe-area-inset-left) + 16px);
        padding-top: 16px;
        padding-bottom: 16px;
        padding: 16px calc(env(safe-area-inset-right) + 16px) 16px calc(env(safe-area-inset-left) + 16px);
    }
}

ion-app.wp [padding-top] .scroll-content {
    padding-top: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.wp [padding-top] .scroll-content {
        padding-top: 16px;
        padding-top: 16px;
    }
}

ion-app.wp [padding-left] .scroll-content {
    padding-left: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.wp [padding-left] .scroll-content {
        padding-left: calc(constant(safe-area-inset-left) + 16px);
        padding-left: calc(env(safe-area-inset-left) + 16px);
    }
}

ion-app.wp [padding-right] .scroll-content {
    padding-right: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.wp [padding-right] .scroll-content {
        padding-right: calc(constant(safe-area-inset-right) + 16px);
        padding-right: calc(env(safe-area-inset-right) + 16px);
    }
}

ion-app.wp [padding-bottom] .scroll-content {
    padding-bottom: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.wp [padding-bottom] .scroll-content {
        padding-bottom: 16px;
        padding-bottom: 16px;
    }
}

ion-app.wp [padding-vertical] .scroll-content {
    padding-top: 16px;
    padding-bottom: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.wp [padding-vertical] .scroll-content {
        padding-top: 16px;
        padding-bottom: 16px;
        padding-top: 16px;
        padding-bottom: 16px;
    }
}

ion-app.wp [padding-horizontal] .scroll-content {
    padding-left: 16px;
    padding-right: 16px;
}

@media screen and (orientation: landscape) {
    ion-app.wp [padding-horizontal] .scroll-content {
        padding-left: calc(constant(safe-area-inset-left) + 16px);
        padding-right: calc(constant(safe-area-inset-right) + 16px);
        padding-left: calc(env(safe-area-inset-left) + 16px);
        padding-right: calc(env(safe-area-inset-right) + 16px);
    }
}

ion-app.wp [margin],
ion-app.wp [margin] .scroll-content {
    margin: 16px;
}

ion-app.wp [margin-top],
ion-app.wp [margin-top] .scroll-content {
    margin-top: 16px;
}

ion-app.wp [margin-left],
ion-app.wp [margin-left] .scroll-content {
    margin-left: 16px;
}

ion-app.wp [margin-start],
ion-app.wp [margin-start] .scroll-content {
    margin-left: 16px;
}

ion-app.wp [margin-right],
ion-app.wp [margin-right] .scroll-content {
    margin-right: 16px;
}

ion-app.wp [margin-end],
ion-app.wp [margin-end] .scroll-content {
    margin-right: 16px;
}

ion-app.wp [margin-bottom],
ion-app.wp [margin-bottom] .scroll-content {
    margin-bottom: 16px;
}

ion-app.wp [margin-vertical],
ion-app.wp [margin-vertical] .scroll-content {
    margin-top: 16px;
    margin-bottom: 16px;
}

ion-app.wp [margin-horizontal],
ion-app.wp [margin-horizontal] .scroll-content {
    margin-left: 16px;
    margin-right: 16px;
}

ion-datetime {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
}

.datetime-text {
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 16px;
    min-height: 1.2em;
    font-size: inherit;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.datetime-disabled,
.item-datetime-disabled ion-label {
    opacity: .4;
    pointer-events: none;
}

.item-label-stacked ion-datetime,
.item-label-floating ion-datetime {
    padding-left: 0;
    width: 100%;
}

.datetime-ios {
    padding: 11px 8px 11px 16px;
}

    .datetime-ios .datetime-placeholder {
        color: #999;
    }

.datetime-md {
    padding: 13px 8px 13px 16px;
}

    .datetime-md .datetime-placeholder {
        color: #999;
    }

.datetime-wp {
    padding: 13px 8px 13px 16px;
    min-width: 45%;
}

    .datetime-wp .datetime-text {
        padding: 0 8px;
        min-height: 3.4rem;
        border: 2px solid rgba(0, 0, 0, 0.5);
        line-height: 3rem;
    }

.item-datetime .datetime-wp ion-label[floating] {
    -webkit-transform: translate3d(8px, 41px, 0);
    transform: translate3d(8px, 41px, 0);
}

.datetime-wp .datetime-placeholder {
    color: rgba(0, 0, 0, 0.5);
}

.fab {
    text-align: center;
    -moz-appearance: none;
    -ms-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 50%;
    position: relative;
    z-index: 0;
    display: block;
    overflow: hidden;
    width: 56px;
    height: 56px;
    font-size: 14px;
    line-height: 56px;
    text-overflow: ellipsis;
    text-transform: none;
    white-space: nowrap;
    cursor: pointer;
    -webkit-transition: background-color, opacity 100ms linear;
    transition: background-color, opacity 100ms linear;
    background-clip: padding-box;
    -webkit-font-kerning: none;
    font-kerning: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    contain: strict;
}

    .fab ion-icon {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        font-size: 2.4rem;
    }

    .fab[mini] {
        margin: 8px;
        width: 40px;
        height: 40px;
        line-height: 40px;
    }

        .fab[mini] .fab-close-icon {
            line-height: 40px;
        }

ion-fab {
    position: absolute;
    z-index: 999;
}

    ion-fab[center] {
        left: 50%;
        margin-left: -28px;
    }

    ion-fab[middle] {
        margin-top: -28px;
        top: 50%;
    }

    ion-fab[top] {
        top: 10px;
    }

    ion-fab[right] {
        right: 10px;
        right: calc(10px + constant(safe-area-inset-right));
        right: calc(10px + env(safe-area-inset-right));
    }

    ion-fab[end] {
        right: 10px;
        right: calc(constant(safe-area-inset-right) + 10px);
        right: calc(env(safe-area-inset-right) + 10px);
    }

    ion-fab[bottom] {
        bottom: 10px;
    }

    ion-fab[left] {
        left: 10px;
        left: calc(10px + constant(safe-area-inset-left));
        left: calc(10px + env(safe-area-inset-left));
    }

    ion-fab[start] {
        left: 10px;
        left: calc(constant(safe-area-inset-left) + 10px);
        left: calc(env(safe-area-inset-left) + 10px);
    }

    ion-fab[top][edge] {
        top: -28px;
    }

    ion-fab[bottom][edge] {
        bottom: -28px;
    }

ion-fab-list {
    margin: 66px 0;
    position: absolute;
    top: 0;
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 56px;
    min-height: 56px;
}

.fab-in-list {
    margin: 8px 0;
    width: 40px;
    height: 40px;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: scale(0);
    transform: scale(0);
}

    .fab-in-list.show {
        opacity: 1;
        visibility: visible;
        -webkit-transform: scale(1);
        transform: scale(1);
    }

ion-fab-list[side=left] .fab-in-list,
ion-fab-list[side=right] .fab-in-list {
    margin: 0 8px;
}

ion-fab-list[side=top] {
    top: auto;
    bottom: 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
}

ion-fab-list[side=left] {
    margin: 0 66px;
    right: 0;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

ion-fab-list[side=right] {
    margin: 0 66px;
    left: 0;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}

.fab-list-active {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.fab-close-icon {
    left: 0;
    right: 0;
    top: 0;
    position: absolute;
    line-height: 56px;
    opacity: 0;
    -webkit-transform: scale(0.4) rotateZ(-45deg);
    transform: scale(0.4) rotateZ(-45deg);
    -webkit-transition: all ease-in-out 300ms;
    transition: all ease-in-out 300ms;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
}

.fab .button-inner {
    -webkit-transition: all ease-in-out 300ms;
    transition: all ease-in-out 300ms;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
}

.fab-close-active .fab-close-icon {
    opacity: 1;
    -webkit-transform: scale(1) rotateZ(0deg);
    transform: scale(1) rotateZ(0deg);
}

.fab-close-active .button-inner {
    opacity: 0;
    -webkit-transform: scale(0.4) rotateZ(45deg);
    transform: scale(0.4) rotateZ(45deg);
}

.fab-ios {
    color: #fff;
    background-color: #488aff;
}

    .fab-ios.activated {
        background-color: #427feb;
    }

.fab-ios-in-list {
    color: #000;
    background-color: #f4f4f4;
    -webkit-transition: opacity 200ms ease 10ms, -webkit-transform 200ms ease 10ms;
    transition: opacity 200ms ease 10ms, -webkit-transform 200ms ease 10ms;
    transition: transform 200ms ease 10ms, opacity 200ms ease 10ms;
    transition: transform 200ms ease 10ms, opacity 200ms ease 10ms, -webkit-transform 200ms ease 10ms;
}

    .fab-ios-in-list.activated {
        background-color: #e0e0e0;
    }

.fab-ios-primary {
    color: #fff;
    background-color: #488aff;
}

    .fab-ios-primary.activated {
        background-color: #427feb;
    }

.fab-ios-secondary {
    color: #fff;
    background-color: #32db64;
}

    .fab-ios-secondary.activated {
        background-color: #2ec95c;
    }

.fab-ios-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .fab-ios-danger.activated {
        background-color: #e13838;
    }

.fab-ios-light {
    color: #000;
    background-color: #f4f4f4;
}

    .fab-ios-light.activated {
        background-color: #e0e0e0;
    }

.fab-ios-dark {
    color: #fff;
    background-color: #222;
}

    .fab-ios-dark.activated {
        background-color: #343434;
    }

.fab-md {
    color: #fff;
    background-color: #488aff;
    -webkit-box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.14), 0 4px 5px rgba(0, 0, 0, 0.1);
    box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.14), 0 4px 5px rgba(0, 0, 0, 0.1);
    -webkit-transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

    .fab-md.activated {
        background-color: #427feb;
        -webkit-box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.4), 0 4px 7px 0 rgba(0, 0, 0, 0.1);
        box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.4), 0 4px 7px 0 rgba(0, 0, 0, 0.1);
    }

.fab-md-in-list {
    color: #000;
    background-color: #f4f4f4;
    -webkit-transition: opacity 200ms ease 10ms, background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 200ms ease 10ms, -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: opacity 200ms ease 10ms, background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 200ms ease 10ms, -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 200ms ease 10ms, opacity 200ms ease 10ms, box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 200ms ease 10ms, opacity 200ms ease 10ms, box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 200ms ease 10ms, -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

    .fab-md-in-list.activated {
        background-color: #e0e0e0;
    }

.fab-md .button-effect {
    background-color: #fff;
}

.fab-md-primary {
    color: #fff;
    background-color: #488aff;
}

    .fab-md-primary.activated {
        background-color: #427feb;
    }

    .fab-md-primary .button-effect {
        background-color: #fff;
    }

.fab-md-secondary {
    color: #fff;
    background-color: #32db64;
}

    .fab-md-secondary.activated {
        background-color: #2ec95c;
    }

    .fab-md-secondary .button-effect {
        background-color: #fff;
    }

.fab-md-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .fab-md-danger.activated {
        background-color: #e13838;
    }

    .fab-md-danger .button-effect {
        background-color: #fff;
    }

.fab-md-light {
    color: #000;
    background-color: #f4f4f4;
}

    .fab-md-light.activated {
        background-color: #e0e0e0;
    }

    .fab-md-light .button-effect {
        background-color: #000;
    }

.fab-md-dark {
    color: #fff;
    background-color: #222;
}

    .fab-md-dark.activated {
        background-color: #343434;
    }

    .fab-md-dark .button-effect {
        background-color: #fff;
    }

.fab-wp {
    color: #fff;
    background-color: #488aff;
}

    .fab-wp.activated {
        background-color: #427feb;
    }

.fab-wp-in-list {
    color: #000;
    background-color: #f4f4f4;
    -webkit-transition: opacity 200ms ease 10ms, -webkit-transform 200ms ease 10ms;
    transition: opacity 200ms ease 10ms, -webkit-transform 200ms ease 10ms;
    transition: transform 200ms ease 10ms, opacity 200ms ease 10ms;
    transition: transform 200ms ease 10ms, opacity 200ms ease 10ms, -webkit-transform 200ms ease 10ms;
}

    .fab-wp-in-list.activated {
        background-color: #e0e0e0;
    }

.fab-wp-primary {
    color: #fff;
    background-color: #488aff;
}

    .fab-wp-primary.activated {
        background-color: #427feb;
    }

.fab-wp-secondary {
    color: #fff;
    background-color: #32db64;
}

    .fab-wp-secondary.activated {
        background-color: #2ec95c;
    }

.fab-wp-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .fab-wp-danger.activated {
        background-color: #e13838;
    }

.fab-wp-light {
    color: #000;
    background-color: #f4f4f4;
}

    .fab-wp-light.activated {
        background-color: #e0e0e0;
    }

.fab-wp-dark {
    color: #fff;
    background-color: #222;
}

    .fab-wp-dark.activated {
        background-color: #343434;
    }

.grid {
    padding: 5px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

    .grid[no-padding] {
        padding: 0;
    }

        .grid[no-padding] > .row > .col {
            padding: 0;
        }

@media (min-width: 576px) {
    .grid[fixed] {
        width: 540px;
        max-width: 100%;
    }
}

@media (min-width: 768px) {
    .grid[fixed] {
        width: 720px;
        max-width: 100%;
    }
}

@media (min-width: 992px) {
    .grid[fixed] {
        width: 960px;
        max-width: 100%;
    }
}

@media (min-width: 1200px) {
    .grid[fixed] {
        width: 1140px;
        max-width: 100%;
    }
}

.row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

    .row[nowrap] {
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .row[wrap-reverse] {
        -webkit-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
    }

    .row[align-items-start] {
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    .row[align-items-center] {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .row[align-items-end] {
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
        -ms-flex-align: end;
        align-items: flex-end;
    }

    .row[align-items-stretch] {
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .row[align-items-baseline] {
        -webkit-box-align: baseline;
        -webkit-align-items: baseline;
        -ms-flex-align: baseline;
        align-items: baseline;
    }

    .row[justify-content-start] {
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

    .row[justify-content-center] {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .row[justify-content-end] {
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }

    .row[justify-content-around] {
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
    }

    .row[justify-content-between] {
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

.col {
    padding: 5px;
    position: relative;
    width: 100%;
    margin: 0;
    min-height: 1px;
    -webkit-flex-basis: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
}

    .col[align-self-start] {
        -webkit-align-self: flex-start;
        -ms-flex-item-align: start;
        align-self: flex-start;
    }

    .col[align-self-end] {
        -webkit-align-self: flex-end;
        -ms-flex-item-align: end;
        align-self: flex-end;
    }

    .col[align-self-center] {
        -webkit-align-self: center;
        -ms-flex-item-align: center;
        align-self: center;
    }

    .col[align-self-stretch] {
        -webkit-align-self: stretch;
        -ms-flex-item-align: stretch;
        align-self: stretch;
    }

    .col[align-self-baseline] {
        -webkit-align-self: baseline;
        -ms-flex-item-align: baseline;
        align-self: baseline;
    }

[col-1] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-1] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-1] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-1] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-1] {
        padding: 5px;
    }
}

[col-2] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-2] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-2] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-2] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-2] {
        padding: 5px;
    }
}

[col-3] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-3] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-3] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-3] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-3] {
        padding: 5px;
    }
}

[col-4] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-4] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-4] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-4] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-4] {
        padding: 5px;
    }
}

[col-5] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-5] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-5] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-5] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-5] {
        padding: 5px;
    }
}

[col-6] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-6] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-6] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-6] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-6] {
        padding: 5px;
    }
}

[col-7] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-7] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-7] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-7] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-7] {
        padding: 5px;
    }
}

[col-8] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-8] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-8] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-8] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-8] {
        padding: 5px;
    }
}

[col-9] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-9] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-9] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-9] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-9] {
        padding: 5px;
    }
}

[col-10] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-10] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-10] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-10] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-10] {
        padding: 5px;
    }
}

[col-11] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-11] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-11] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-11] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-11] {
        padding: 5px;
    }
}

[col-12] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-12] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-12] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-12] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-12] {
        padding: 5px;
    }
}

[col] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col] {
        padding: 5px;
    }
}

[col] {
    -webkit-flex-basis: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
}

[col-auto] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
}

[col-1] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 8.33333%;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    width: 8.33333%;
    max-width: 8.33333%;
}

[col-2] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 16.66667%;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    width: 16.66667%;
    max-width: 16.66667%;
}

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

[col-4] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 33.33333%;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    width: 33.33333%;
    max-width: 33.33333%;
}

[col-5] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 41.66667%;
    -ms-flex: 0 0 41.66667%;
    flex: 0 0 41.66667%;
    width: 41.66667%;
    max-width: 41.66667%;
}

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

[col-7] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 58.33333%;
    -ms-flex: 0 0 58.33333%;
    flex: 0 0 58.33333%;
    width: 58.33333%;
    max-width: 58.33333%;
}

[col-8] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 66.66667%;
    -ms-flex: 0 0 66.66667%;
    flex: 0 0 66.66667%;
    width: 66.66667%;
    max-width: 66.66667%;
}

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

[col-10] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 83.33333%;
    -ms-flex: 0 0 83.33333%;
    flex: 0 0 83.33333%;
    width: 83.33333%;
    max-width: 83.33333%;
}

[col-11] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 91.66667%;
    -ms-flex: 0 0 91.66667%;
    flex: 0 0 91.66667%;
    width: 91.66667%;
    max-width: 91.66667%;
}

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

[pull-0] {
    right: auto;
}

[pull-1] {
    right: 8.33333%;
}

[pull-2] {
    right: 16.66667%;
}

[pull-3] {
    right: 25%;
}

[pull-4] {
    right: 33.33333%;
}

[pull-5] {
    right: 41.66667%;
}

[pull-6] {
    right: 50%;
}

[pull-7] {
    right: 58.33333%;
}

[pull-8] {
    right: 66.66667%;
}

[pull-9] {
    right: 75%;
}

[pull-10] {
    right: 83.33333%;
}

[pull-11] {
    right: 91.66667%;
}

[pull-12] {
    right: 100%;
}

[push-0] {
    left: auto;
}

[push-1] {
    left: 8.33333%;
}

[push-2] {
    left: 16.66667%;
}

[push-3] {
    left: 25%;
}

[push-4] {
    left: 33.33333%;
}

[push-5] {
    left: 41.66667%;
}

[push-6] {
    left: 50%;
}

[push-7] {
    left: 58.33333%;
}

[push-8] {
    left: 66.66667%;
}

[push-9] {
    left: 75%;
}

[push-10] {
    left: 83.33333%;
}

[push-11] {
    left: 91.66667%;
}

[push-12] {
    left: 100%;
}

[offset-1] {
    margin-left: 8.33333%;
}

[offset-2] {
    margin-left: 16.66667%;
}

[offset-3] {
    margin-left: 25%;
}

[offset-4] {
    margin-left: 33.33333%;
}

[offset-5] {
    margin-left: 41.66667%;
}

[offset-6] {
    margin-left: 50%;
}

[offset-7] {
    margin-left: 58.33333%;
}

[offset-8] {
    margin-left: 66.66667%;
}

[offset-9] {
    margin-left: 75%;
}

[offset-10] {
    margin-left: 83.33333%;
}

[offset-11] {
    margin-left: 91.66667%;
}

[col-sm-1] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-sm-1] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-sm-1] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-sm-1] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-sm-1] {
        padding: 5px;
    }
}

[col-sm-2] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-sm-2] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-sm-2] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-sm-2] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-sm-2] {
        padding: 5px;
    }
}

[col-sm-3] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-sm-3] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-sm-3] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-sm-3] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-sm-3] {
        padding: 5px;
    }
}

[col-sm-4] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-sm-4] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-sm-4] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-sm-4] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-sm-4] {
        padding: 5px;
    }
}

[col-sm-5] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-sm-5] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-sm-5] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-sm-5] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-sm-5] {
        padding: 5px;
    }
}

[col-sm-6] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-sm-6] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-sm-6] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-sm-6] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-sm-6] {
        padding: 5px;
    }
}

[col-sm-7] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-sm-7] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-sm-7] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-sm-7] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-sm-7] {
        padding: 5px;
    }
}

[col-sm-8] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-sm-8] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-sm-8] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-sm-8] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-sm-8] {
        padding: 5px;
    }
}

[col-sm-9] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-sm-9] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-sm-9] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-sm-9] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-sm-9] {
        padding: 5px;
    }
}

[col-sm-10] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-sm-10] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-sm-10] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-sm-10] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-sm-10] {
        padding: 5px;
    }
}

[col-sm-11] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-sm-11] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-sm-11] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-sm-11] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-sm-11] {
        padding: 5px;
    }
}

[col-sm-12] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-sm-12] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-sm-12] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-sm-12] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-sm-12] {
        padding: 5px;
    }
}

[col-sm] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-sm] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-sm] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-sm] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-sm] {
        padding: 5px;
    }
}

@media (min-width: 576px) {
    [col-sm] {
        -webkit-flex-basis: 0;
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%;
    }

    [col-sm-auto] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
    }

    [col-sm-1] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 8.33333%;
        -ms-flex: 0 0 8.33333%;
        flex: 0 0 8.33333%;
        width: 8.33333%;
        max-width: 8.33333%;
    }

    [col-sm-2] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 16.66667%;
        -ms-flex: 0 0 16.66667%;
        flex: 0 0 16.66667%;
        width: 16.66667%;
        max-width: 16.66667%;
    }

    [col-sm-3] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 25%;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        width: 25%;
        max-width: 25%;
    }

    [col-sm-4] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 33.33333%;
        -ms-flex: 0 0 33.33333%;
        flex: 0 0 33.33333%;
        width: 33.33333%;
        max-width: 33.33333%;
    }

    [col-sm-5] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 41.66667%;
        -ms-flex: 0 0 41.66667%;
        flex: 0 0 41.66667%;
        width: 41.66667%;
        max-width: 41.66667%;
    }

    [col-sm-6] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 50%;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        width: 50%;
        max-width: 50%;
    }

    [col-sm-7] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 58.33333%;
        -ms-flex: 0 0 58.33333%;
        flex: 0 0 58.33333%;
        width: 58.33333%;
        max-width: 58.33333%;
    }

    [col-sm-8] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 66.66667%;
        -ms-flex: 0 0 66.66667%;
        flex: 0 0 66.66667%;
        width: 66.66667%;
        max-width: 66.66667%;
    }

    [col-sm-9] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 75%;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        width: 75%;
        max-width: 75%;
    }

    [col-sm-10] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 83.33333%;
        -ms-flex: 0 0 83.33333%;
        flex: 0 0 83.33333%;
        width: 83.33333%;
        max-width: 83.33333%;
    }

    [col-sm-11] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 91.66667%;
        -ms-flex: 0 0 91.66667%;
        flex: 0 0 91.66667%;
        width: 91.66667%;
        max-width: 91.66667%;
    }

    [col-sm-12] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }

    [pull-sm-0] {
        right: auto;
    }

    [pull-sm-1] {
        right: 8.33333%;
    }

    [pull-sm-2] {
        right: 16.66667%;
    }

    [pull-sm-3] {
        right: 25%;
    }

    [pull-sm-4] {
        right: 33.33333%;
    }

    [pull-sm-5] {
        right: 41.66667%;
    }

    [pull-sm-6] {
        right: 50%;
    }

    [pull-sm-7] {
        right: 58.33333%;
    }

    [pull-sm-8] {
        right: 66.66667%;
    }

    [pull-sm-9] {
        right: 75%;
    }

    [pull-sm-10] {
        right: 83.33333%;
    }

    [pull-sm-11] {
        right: 91.66667%;
    }

    [pull-sm-12] {
        right: 100%;
    }

    [push-sm-0] {
        left: auto;
    }

    [push-sm-1] {
        left: 8.33333%;
    }

    [push-sm-2] {
        left: 16.66667%;
    }

    [push-sm-3] {
        left: 25%;
    }

    [push-sm-4] {
        left: 33.33333%;
    }

    [push-sm-5] {
        left: 41.66667%;
    }

    [push-sm-6] {
        left: 50%;
    }

    [push-sm-7] {
        left: 58.33333%;
    }

    [push-sm-8] {
        left: 66.66667%;
    }

    [push-sm-9] {
        left: 75%;
    }

    [push-sm-10] {
        left: 83.33333%;
    }

    [push-sm-11] {
        left: 91.66667%;
    }

    [push-sm-12] {
        left: 100%;
    }

    [offset-sm-0] {
        margin-left: 0%;
    }

    [offset-sm-1] {
        margin-left: 8.33333%;
    }

    [offset-sm-2] {
        margin-left: 16.66667%;
    }

    [offset-sm-3] {
        margin-left: 25%;
    }

    [offset-sm-4] {
        margin-left: 33.33333%;
    }

    [offset-sm-5] {
        margin-left: 41.66667%;
    }

    [offset-sm-6] {
        margin-left: 50%;
    }

    [offset-sm-7] {
        margin-left: 58.33333%;
    }

    [offset-sm-8] {
        margin-left: 66.66667%;
    }

    [offset-sm-9] {
        margin-left: 75%;
    }

    [offset-sm-10] {
        margin-left: 83.33333%;
    }

    [offset-sm-11] {
        margin-left: 91.66667%;
    }
}

[col-md-1] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-md-1] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md-1] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-md-1] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-md-1] {
        padding: 5px;
    }
}

[col-md-2] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-md-2] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md-2] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-md-2] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-md-2] {
        padding: 5px;
    }
}

[col-md-3] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-md-3] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md-3] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-md-3] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-md-3] {
        padding: 5px;
    }
}

[col-md-4] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-md-4] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md-4] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-md-4] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-md-4] {
        padding: 5px;
    }
}

[col-md-5] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-md-5] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md-5] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-md-5] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-md-5] {
        padding: 5px;
    }
}

[col-md-6] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-md-6] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md-6] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-md-6] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-md-6] {
        padding: 5px;
    }
}

[col-md-7] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-md-7] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md-7] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-md-7] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-md-7] {
        padding: 5px;
    }
}

[col-md-8] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-md-8] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md-8] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-md-8] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-md-8] {
        padding: 5px;
    }
}

[col-md-9] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-md-9] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md-9] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-md-9] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-md-9] {
        padding: 5px;
    }
}

[col-md-10] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-md-10] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md-10] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-md-10] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-md-10] {
        padding: 5px;
    }
}

[col-md-11] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-md-11] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md-11] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-md-11] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-md-11] {
        padding: 5px;
    }
}

[col-md-12] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-md-12] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md-12] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-md-12] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-md-12] {
        padding: 5px;
    }
}

[col-md] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-md] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-md] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-md] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-md] {
        -webkit-flex-basis: 0;
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%;
    }

    [col-md-auto] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
    }

    [col-md-1] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 8.33333%;
        -ms-flex: 0 0 8.33333%;
        flex: 0 0 8.33333%;
        width: 8.33333%;
        max-width: 8.33333%;
    }

    [col-md-2] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 16.66667%;
        -ms-flex: 0 0 16.66667%;
        flex: 0 0 16.66667%;
        width: 16.66667%;
        max-width: 16.66667%;
    }

    [col-md-3] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 25%;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        width: 25%;
        max-width: 25%;
    }

    [col-md-4] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 33.33333%;
        -ms-flex: 0 0 33.33333%;
        flex: 0 0 33.33333%;
        width: 33.33333%;
        max-width: 33.33333%;
    }

    [col-md-5] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 41.66667%;
        -ms-flex: 0 0 41.66667%;
        flex: 0 0 41.66667%;
        width: 41.66667%;
        max-width: 41.66667%;
    }

    [col-md-6] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 50%;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        width: 50%;
        max-width: 50%;
    }

    [col-md-7] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 58.33333%;
        -ms-flex: 0 0 58.33333%;
        flex: 0 0 58.33333%;
        width: 58.33333%;
        max-width: 58.33333%;
    }

    [col-md-8] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 66.66667%;
        -ms-flex: 0 0 66.66667%;
        flex: 0 0 66.66667%;
        width: 66.66667%;
        max-width: 66.66667%;
    }

    [col-md-9] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 75%;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        width: 75%;
        max-width: 75%;
    }

    [col-md-10] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 83.33333%;
        -ms-flex: 0 0 83.33333%;
        flex: 0 0 83.33333%;
        width: 83.33333%;
        max-width: 83.33333%;
    }

    [col-md-11] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 91.66667%;
        -ms-flex: 0 0 91.66667%;
        flex: 0 0 91.66667%;
        width: 91.66667%;
        max-width: 91.66667%;
    }

    [col-md-12] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }

    [pull-md-0] {
        right: auto;
    }

    [pull-md-1] {
        right: 8.33333%;
    }

    [pull-md-2] {
        right: 16.66667%;
    }

    [pull-md-3] {
        right: 25%;
    }

    [pull-md-4] {
        right: 33.33333%;
    }

    [pull-md-5] {
        right: 41.66667%;
    }

    [pull-md-6] {
        right: 50%;
    }

    [pull-md-7] {
        right: 58.33333%;
    }

    [pull-md-8] {
        right: 66.66667%;
    }

    [pull-md-9] {
        right: 75%;
    }

    [pull-md-10] {
        right: 83.33333%;
    }

    [pull-md-11] {
        right: 91.66667%;
    }

    [pull-md-12] {
        right: 100%;
    }

    [push-md-0] {
        left: auto;
    }

    [push-md-1] {
        left: 8.33333%;
    }

    [push-md-2] {
        left: 16.66667%;
    }

    [push-md-3] {
        left: 25%;
    }

    [push-md-4] {
        left: 33.33333%;
    }

    [push-md-5] {
        left: 41.66667%;
    }

    [push-md-6] {
        left: 50%;
    }

    [push-md-7] {
        left: 58.33333%;
    }

    [push-md-8] {
        left: 66.66667%;
    }

    [push-md-9] {
        left: 75%;
    }

    [push-md-10] {
        left: 83.33333%;
    }

    [push-md-11] {
        left: 91.66667%;
    }

    [push-md-12] {
        left: 100%;
    }

    [offset-md-0] {
        margin-left: 0%;
    }

    [offset-md-1] {
        margin-left: 8.33333%;
    }

    [offset-md-2] {
        margin-left: 16.66667%;
    }

    [offset-md-3] {
        margin-left: 25%;
    }

    [offset-md-4] {
        margin-left: 33.33333%;
    }

    [offset-md-5] {
        margin-left: 41.66667%;
    }

    [offset-md-6] {
        margin-left: 50%;
    }

    [offset-md-7] {
        margin-left: 58.33333%;
    }

    [offset-md-8] {
        margin-left: 66.66667%;
    }

    [offset-md-9] {
        margin-left: 75%;
    }

    [offset-md-10] {
        margin-left: 83.33333%;
    }

    [offset-md-11] {
        margin-left: 91.66667%;
    }
}

[col-lg-1] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-lg-1] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-lg-1] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg-1] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-lg-1] {
        padding: 5px;
    }
}

[col-lg-2] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-lg-2] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-lg-2] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg-2] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-lg-2] {
        padding: 5px;
    }
}

[col-lg-3] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-lg-3] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-lg-3] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg-3] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-lg-3] {
        padding: 5px;
    }
}

[col-lg-4] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-lg-4] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-lg-4] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg-4] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-lg-4] {
        padding: 5px;
    }
}

[col-lg-5] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-lg-5] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-lg-5] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg-5] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-lg-5] {
        padding: 5px;
    }
}

[col-lg-6] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-lg-6] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-lg-6] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg-6] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-lg-6] {
        padding: 5px;
    }
}

[col-lg-7] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-lg-7] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-lg-7] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg-7] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-lg-7] {
        padding: 5px;
    }
}

[col-lg-8] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-lg-8] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-lg-8] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg-8] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-lg-8] {
        padding: 5px;
    }
}

[col-lg-9] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-lg-9] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-lg-9] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg-9] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-lg-9] {
        padding: 5px;
    }
}

[col-lg-10] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-lg-10] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-lg-10] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg-10] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-lg-10] {
        padding: 5px;
    }
}

[col-lg-11] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-lg-11] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-lg-11] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg-11] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-lg-11] {
        padding: 5px;
    }
}

[col-lg-12] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-lg-12] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-lg-12] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg-12] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-lg-12] {
        padding: 5px;
    }
}

[col-lg] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-lg] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-lg] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-lg] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-lg] {
        -webkit-flex-basis: 0;
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%;
    }

    [col-lg-auto] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
    }

    [col-lg-1] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 8.33333%;
        -ms-flex: 0 0 8.33333%;
        flex: 0 0 8.33333%;
        width: 8.33333%;
        max-width: 8.33333%;
    }

    [col-lg-2] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 16.66667%;
        -ms-flex: 0 0 16.66667%;
        flex: 0 0 16.66667%;
        width: 16.66667%;
        max-width: 16.66667%;
    }

    [col-lg-3] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 25%;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        width: 25%;
        max-width: 25%;
    }

    [col-lg-4] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 33.33333%;
        -ms-flex: 0 0 33.33333%;
        flex: 0 0 33.33333%;
        width: 33.33333%;
        max-width: 33.33333%;
    }

    [col-lg-5] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 41.66667%;
        -ms-flex: 0 0 41.66667%;
        flex: 0 0 41.66667%;
        width: 41.66667%;
        max-width: 41.66667%;
    }

    [col-lg-6] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 50%;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        width: 50%;
        max-width: 50%;
    }

    [col-lg-7] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 58.33333%;
        -ms-flex: 0 0 58.33333%;
        flex: 0 0 58.33333%;
        width: 58.33333%;
        max-width: 58.33333%;
    }

    [col-lg-8] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 66.66667%;
        -ms-flex: 0 0 66.66667%;
        flex: 0 0 66.66667%;
        width: 66.66667%;
        max-width: 66.66667%;
    }

    [col-lg-9] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 75%;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        width: 75%;
        max-width: 75%;
    }

    [col-lg-10] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 83.33333%;
        -ms-flex: 0 0 83.33333%;
        flex: 0 0 83.33333%;
        width: 83.33333%;
        max-width: 83.33333%;
    }

    [col-lg-11] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 91.66667%;
        -ms-flex: 0 0 91.66667%;
        flex: 0 0 91.66667%;
        width: 91.66667%;
        max-width: 91.66667%;
    }

    [col-lg-12] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }

    [pull-lg-0] {
        right: auto;
    }

    [pull-lg-1] {
        right: 8.33333%;
    }

    [pull-lg-2] {
        right: 16.66667%;
    }

    [pull-lg-3] {
        right: 25%;
    }

    [pull-lg-4] {
        right: 33.33333%;
    }

    [pull-lg-5] {
        right: 41.66667%;
    }

    [pull-lg-6] {
        right: 50%;
    }

    [pull-lg-7] {
        right: 58.33333%;
    }

    [pull-lg-8] {
        right: 66.66667%;
    }

    [pull-lg-9] {
        right: 75%;
    }

    [pull-lg-10] {
        right: 83.33333%;
    }

    [pull-lg-11] {
        right: 91.66667%;
    }

    [pull-lg-12] {
        right: 100%;
    }

    [push-lg-0] {
        left: auto;
    }

    [push-lg-1] {
        left: 8.33333%;
    }

    [push-lg-2] {
        left: 16.66667%;
    }

    [push-lg-3] {
        left: 25%;
    }

    [push-lg-4] {
        left: 33.33333%;
    }

    [push-lg-5] {
        left: 41.66667%;
    }

    [push-lg-6] {
        left: 50%;
    }

    [push-lg-7] {
        left: 58.33333%;
    }

    [push-lg-8] {
        left: 66.66667%;
    }

    [push-lg-9] {
        left: 75%;
    }

    [push-lg-10] {
        left: 83.33333%;
    }

    [push-lg-11] {
        left: 91.66667%;
    }

    [push-lg-12] {
        left: 100%;
    }

    [offset-lg-0] {
        margin-left: 0%;
    }

    [offset-lg-1] {
        margin-left: 8.33333%;
    }

    [offset-lg-2] {
        margin-left: 16.66667%;
    }

    [offset-lg-3] {
        margin-left: 25%;
    }

    [offset-lg-4] {
        margin-left: 33.33333%;
    }

    [offset-lg-5] {
        margin-left: 41.66667%;
    }

    [offset-lg-6] {
        margin-left: 50%;
    }

    [offset-lg-7] {
        margin-left: 58.33333%;
    }

    [offset-lg-8] {
        margin-left: 66.66667%;
    }

    [offset-lg-9] {
        margin-left: 75%;
    }

    [offset-lg-10] {
        margin-left: 83.33333%;
    }

    [offset-lg-11] {
        margin-left: 91.66667%;
    }
}

[col-xl-1] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-xl-1] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-xl-1] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-xl-1] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl-1] {
        padding: 5px;
    }
}

[col-xl-2] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-xl-2] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-xl-2] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-xl-2] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl-2] {
        padding: 5px;
    }
}

[col-xl-3] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-xl-3] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-xl-3] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-xl-3] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl-3] {
        padding: 5px;
    }
}

[col-xl-4] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-xl-4] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-xl-4] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-xl-4] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl-4] {
        padding: 5px;
    }
}

[col-xl-5] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-xl-5] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-xl-5] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-xl-5] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl-5] {
        padding: 5px;
    }
}

[col-xl-6] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-xl-6] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-xl-6] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-xl-6] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl-6] {
        padding: 5px;
    }
}

[col-xl-7] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-xl-7] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-xl-7] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-xl-7] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl-7] {
        padding: 5px;
    }
}

[col-xl-8] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-xl-8] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-xl-8] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-xl-8] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl-8] {
        padding: 5px;
    }
}

[col-xl-9] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-xl-9] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-xl-9] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-xl-9] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl-9] {
        padding: 5px;
    }
}

[col-xl-10] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-xl-10] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-xl-10] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-xl-10] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl-10] {
        padding: 5px;
    }
}

[col-xl-11] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-xl-11] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-xl-11] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-xl-11] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl-11] {
        padding: 5px;
    }
}

[col-xl-12] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-xl-12] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-xl-12] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-xl-12] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl-12] {
        padding: 5px;
    }
}

[col-xl] {
    padding: 5px;
}

@media (min-width: 576px) {
    [col-xl] {
        padding: 5px;
    }
}

@media (min-width: 768px) {
    [col-xl] {
        padding: 5px;
    }
}

@media (min-width: 992px) {
    [col-xl] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl] {
        padding: 5px;
    }
}

@media (min-width: 1200px) {
    [col-xl] {
        -webkit-flex-basis: 0;
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%;
    }

    [col-xl-auto] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
    }

    [col-xl-1] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 8.33333%;
        -ms-flex: 0 0 8.33333%;
        flex: 0 0 8.33333%;
        width: 8.33333%;
        max-width: 8.33333%;
    }

    [col-xl-2] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 16.66667%;
        -ms-flex: 0 0 16.66667%;
        flex: 0 0 16.66667%;
        width: 16.66667%;
        max-width: 16.66667%;
    }

    [col-xl-3] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 25%;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        width: 25%;
        max-width: 25%;
    }

    [col-xl-4] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 33.33333%;
        -ms-flex: 0 0 33.33333%;
        flex: 0 0 33.33333%;
        width: 33.33333%;
        max-width: 33.33333%;
    }

    [col-xl-5] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 41.66667%;
        -ms-flex: 0 0 41.66667%;
        flex: 0 0 41.66667%;
        width: 41.66667%;
        max-width: 41.66667%;
    }

    [col-xl-6] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 50%;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        width: 50%;
        max-width: 50%;
    }

    [col-xl-7] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 58.33333%;
        -ms-flex: 0 0 58.33333%;
        flex: 0 0 58.33333%;
        width: 58.33333%;
        max-width: 58.33333%;
    }

    [col-xl-8] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 66.66667%;
        -ms-flex: 0 0 66.66667%;
        flex: 0 0 66.66667%;
        width: 66.66667%;
        max-width: 66.66667%;
    }

    [col-xl-9] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 75%;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        width: 75%;
        max-width: 75%;
    }

    [col-xl-10] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 83.33333%;
        -ms-flex: 0 0 83.33333%;
        flex: 0 0 83.33333%;
        width: 83.33333%;
        max-width: 83.33333%;
    }

    [col-xl-11] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 91.66667%;
        -ms-flex: 0 0 91.66667%;
        flex: 0 0 91.66667%;
        width: 91.66667%;
        max-width: 91.66667%;
    }

    [col-xl-12] {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }

    [pull-xl-0] {
        right: auto;
    }

    [pull-xl-1] {
        right: 8.33333%;
    }

    [pull-xl-2] {
        right: 16.66667%;
    }

    [pull-xl-3] {
        right: 25%;
    }

    [pull-xl-4] {
        right: 33.33333%;
    }

    [pull-xl-5] {
        right: 41.66667%;
    }

    [pull-xl-6] {
        right: 50%;
    }

    [pull-xl-7] {
        right: 58.33333%;
    }

    [pull-xl-8] {
        right: 66.66667%;
    }

    [pull-xl-9] {
        right: 75%;
    }

    [pull-xl-10] {
        right: 83.33333%;
    }

    [pull-xl-11] {
        right: 91.66667%;
    }

    [pull-xl-12] {
        right: 100%;
    }

    [push-xl-0] {
        left: auto;
    }

    [push-xl-1] {
        left: 8.33333%;
    }

    [push-xl-2] {
        left: 16.66667%;
    }

    [push-xl-3] {
        left: 25%;
    }

    [push-xl-4] {
        left: 33.33333%;
    }

    [push-xl-5] {
        left: 41.66667%;
    }

    [push-xl-6] {
        left: 50%;
    }

    [push-xl-7] {
        left: 58.33333%;
    }

    [push-xl-8] {
        left: 66.66667%;
    }

    [push-xl-9] {
        left: 75%;
    }

    [push-xl-10] {
        left: 83.33333%;
    }

    [push-xl-11] {
        left: 91.66667%;
    }

    [push-xl-12] {
        left: 100%;
    }

    [offset-xl-0] {
        margin-left: 0%;
    }

    [offset-xl-1] {
        margin-left: 8.33333%;
    }

    [offset-xl-2] {
        margin-left: 16.66667%;
    }

    [offset-xl-3] {
        margin-left: 25%;
    }

    [offset-xl-4] {
        margin-left: 33.33333%;
    }

    [offset-xl-5] {
        margin-left: 41.66667%;
    }

    [offset-xl-6] {
        margin-left: 50%;
    }

    [offset-xl-7] {
        margin-left: 58.33333%;
    }

    [offset-xl-8] {
        margin-left: 66.66667%;
    }

    [offset-xl-9] {
        margin-left: 75%;
    }

    [offset-xl-10] {
        margin-left: 83.33333%;
    }

    [offset-xl-11] {
        margin-left: 91.66667%;
    }
}

ion-icon {
    display: inline-block;
    font-size: 1.2em;
}

    ion-icon[small] {
        min-height: 1.1em;
        font-size: 1.1em;
    }

.icon-ios-primary {
    color: #488aff;
}

.icon-ios-secondary {
    color: #32db64;
}

.icon-ios-danger {
    color: #f53d3d;
}

.icon-ios-light {
    color: #f4f4f4;
}

.icon-ios-dark {
    color: #222;
}

.icon-md-primary {
    color: #488aff;
}

.icon-md-secondary {
    color: #32db64;
}

.icon-md-danger {
    color: #f53d3d;
}

.icon-md-light {
    color: #f4f4f4;
}

.icon-md-dark {
    color: #222;
}

.icon-wp-primary {
    color: #488aff;
}

.icon-wp-secondary {
    color: #32db64;
}

.icon-wp-danger {
    color: #f53d3d;
}

.icon-wp-light {
    color: #f4f4f4;
}

.icon-wp-dark {
    color: #222;
}

ion-img {
    display: inline-block;
    min-width: 20px;
    min-height: 20px;
    background: #eee;
    contain: strict;
}

    ion-img img {
        -o-object-fit: cover;
        object-fit: cover;
    }

    ion-img.img-unloaded img {
        display: none;
    }

    ion-img.img-loaded img {
        display: block;
    }

ion-infinite-scroll {
    display: block;
    width: 100%;
}

ion-infinite-scroll-content {
    text-align: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%;
    min-height: 84px;
}

.infinite-loading {
    display: none;
    width: 100%;
    margin: 0 0 32px;
}

.infinite-loading-text {
    color: #666;
    margin: 4px 32px 0;
}

.infinite-loading-spinner .spinner-ios line,
.infinite-loading-spinner .spinner-ios-small line,
.infinite-loading-spinner .spinner-crescent circle {
    stroke: #666;
}

.infinite-loading-spinner .spinner-bubbles circle,
.infinite-loading-spinner .spinner-circles circle,
.infinite-loading-spinner .spinner-dots circle {
    fill: #666;
}

ion-infinite-scroll-content[state=loading] .infinite-loading {
    display: block;
}

ion-infinite-scroll-content[state=disabled] {
    display: none;
}

ion-input,
ion-textarea {
    position: relative;
    display: block;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
}

.item-input ion-input,
.item-input ion-textarea {
    position: static;
}

.item.item-textarea {
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.text-input {
    -moz-appearance: none;
    -ms-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    display: inline-block;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 92%;
    width: calc(100% - 10px);
    border: 0;
    background: transparent;
}

    .text-input::-moz-placeholder {
        color: #999;
    }

    .text-input:-ms-input-placeholder {
        color: #999;
    }

    .text-input::-webkit-input-placeholder {
        text-indent: 0;
        color: #999;
    }

textarea.text-input {
    display: block;
}

.text-input[disabled] {
    opacity: .4;
}

input.text-input:-webkit-autofill {
    background-color: transparent;
}

.platform-mobile textarea.text-input {
    resize: none;
}

.input-cover {
    left: 0;
    top: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
}

.input[disabled] .input-cover {
    pointer-events: none;
}

.item-input-has-focus .input-cover,
.input-has-focus .input-cover {
    display: none;
}

.item-input-has-focus,
.input-has-focus {
    pointer-events: none;
}

    .item-input-has-focus input,
    .input-has-focus input,
    .item-input-has-focus textarea,
    .input-has-focus textarea,
    .item-input-has-focus a,
    .input-has-focus a,
    .item-input-has-focus button,
    .input-has-focus button {
        pointer-events: auto;
    }

.text-input-clear-icon {
    margin: 0;
    padding: 0;
    background-position: center;
    position: absolute;
    top: 0;
    display: none;
    height: 100%;
    background-repeat: no-repeat;
}

.item-input-has-focus.item-input-has-value .text-input-clear-icon,
.input-has-focus.input-has-value .text-input-clear-icon {
    display: block;
}

.text-input-ios {
    margin: 11px 8px 11px 0;
    padding: 0;
    width: calc(100% - 8px);
}

.input-ios .inset-input {
    padding: 5.5px 8px;
    margin: 5.5px 16px 5.5px 0;
}

.item-ios.item-label-stacked .text-input,
.item-ios.item-label-floating .text-input {
    margin-left: 0;
    margin-top: 8px;
    margin-bottom: 8px;
    width: calc(100% - 8px);
}

.item-ios.item-label-stacked .label-ios + .input + .cloned-input,
.item-ios.item-label-floating .label-ios + .input + .cloned-input {
    margin-left: 0;
}

.item-label-stacked .select-ios,
.item-label-floating .select-ios {
    padding-left: 0;
    padding-top: 8px;
    padding-bottom: 8px;
}

.input-ios[clearInput] {
    position: relative;
}

    .input-ios[clearInput] .text-input {
        padding-right: 30px;
    }

.input-ios .text-input-clear-icon {
    right: 8px;
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(0,%200,%200,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
    width: 30px;
    background-size: 18px;
}

.text-input-md {
    margin: 13px 8px;
    padding: 0;
    width: calc(100% - 8px - 8px);
}

.input-md .inset-input {
    padding: 6.5px 8px;
    margin: 6.5px 16px;
}

.item-md.item-input.item-input-has-focus .item-inner,
.item-md.item-input.input-has-focus .item-inner {
    border-bottom-color: #488aff;
    -webkit-box-shadow: inset 0 -1px 0 0 #488aff;
    box-shadow: inset 0 -1px 0 0 #488aff;
}

.list-md .item-input.item-input-has-focus:last-child,
.list-md .item-input.input-has-focus:last-child {
    border-bottom-color: #488aff;
    -webkit-box-shadow: inset 0 -1px 0 0 #488aff;
    box-shadow: inset 0 -1px 0 0 #488aff;
}

    .list-md .item-input.item-input-has-focus:last-child .item-inner,
    .list-md .item-input.input-has-focus:last-child .item-inner {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

.item-md.item-input.ng-valid.item-input-has-value:not(.input-has-focus):not(.item-input-has-focus) .item-inner,
.item-md.item-input.ng-valid.input-has-value:not(.input-has-focus):not(.item-input-has-focus) .item-inner {
    border-bottom-color: #32db64;
    -webkit-box-shadow: inset 0 -1px 0 0 #32db64;
    box-shadow: inset 0 -1px 0 0 #32db64;
}

.list-md .item-input.ng-valid.item-input-has-value:not(.input-has-focus):not(.item-input-has-focus):last-child,
.list-md .item-input.ng-valid.input-has-value:not(.input-has-focus):not(.item-input-has-focus):last-child {
    border-bottom-color: #32db64;
    -webkit-box-shadow: inset 0 -1px 0 0 #32db64;
    box-shadow: inset 0 -1px 0 0 #32db64;
}

    .list-md .item-input.ng-valid.item-input-has-value:not(.input-has-focus):not(.item-input-has-focus):last-child .item-inner,
    .list-md .item-input.ng-valid.input-has-value:not(.input-has-focus):not(.item-input-has-focus):last-child .item-inner {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

.item-md.item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus) .item-inner {
    border-bottom-color: #f53d3d;
    -webkit-box-shadow: inset 0 -1px 0 0 #f53d3d;
    box-shadow: inset 0 -1px 0 0 #f53d3d;
}

.list-md .item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus):last-child {
    border-bottom-color: #f53d3d;
    -webkit-box-shadow: inset 0 -1px 0 0 #f53d3d;
    box-shadow: inset 0 -1px 0 0 #f53d3d;
}

    .list-md .item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus):last-child .item-inner {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

.item-label-stacked .text-input-md,
.item-label-floating .text-input-md {
    margin-left: 0;
    margin-top: 8px;
    margin-bottom: 8px;
    width: calc(100% - 8px);
}

.item-label-stacked .select-md,
.item-label-floating .select-md {
    padding-left: 0;
    padding-top: 8px;
    padding-bottom: 8px;
}

.input-md[clearInput] {
    position: relative;
}

    .input-md[clearInput] .text-input {
        padding-right: 30px;
    }

.input-md .text-input-clear-icon {
    right: 8px;
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><polygon%20fill='%235b5b5b'%20points='405,136.798%20375.202,107%20256,226.202%20136.798,107%20107,136.798%20226.202,256%20107,375.202%20136.798,405%20256,285.798%20375.202,405%20405,375.202%20285.798,256'/></svg>");
    width: 30px;
    background-size: 22px;
}

.text-input-wp {
    margin: 13px 8px;
    padding: 0 8px;
    width: calc(100% - 8px - 8px);
    border: 2px solid rgba(0, 0, 0, 0.5);
    line-height: 3rem;
}

.item-wp .inset-input {
    padding: 6.5px 8px;
    margin: 6.5px 16px;
}

.item-wp.item-input.item-input-has-focus .text-input,
.item-wp.item-input.input-has-focus .text-input {
    border-color: #488aff;
}

.item-wp.item-input.ng-valid.item-input-has-value:not(.input-has-focus):not(.item-input-has-focus) .text-input,
.item-wp.item-input.ng-valid.input-has-value:not(.input-has-focus):not(.item-input-has-focus) .text-input {
    border-color: #32db64;
}

.item-wp.item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus) .text-input {
    border-color: #f53d3d;
}

.item-label-stacked .text-input-wp,
.item-label-floating .text-input-wp,
.item-label-stacked .select-wp,
.item-label-floating .select-wp {
    margin-left: 0;
    margin-top: 8px;
    margin-bottom: 8px;
    width: calc(100% - 8px);
}

.item-wp.item-label-stacked [item-right],
.item-wp.item-label-floating [item-right],
.item-wp.item-label-stacked [item-end],
.item-wp.item-label-floating [item-end] {
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end;
}

.input-wp[clearInput] {
    position: relative;
}

    .input-wp[clearInput] .text-input {
        padding-right: 30px;
    }

.input-wp .text-input-clear-icon {
    right: 8px;
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><polygon%20fill='rgba(0,%200,%200,%200.5)'%20points='405,136.798%20375.202,107%20256,226.202%20136.798,107%20107,136.798%20226.202,256%20107,375.202%20136.798,405%20256,285.798%20375.202,405%20405,375.202%20285.798,256'/></svg>");
    width: 30px;
    background-size: 22px;
}

.item {
    contain: content;
}

.item-block {
    margin: 0;
    padding: 0;
    text-align: initial;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    min-height: 4.4rem;
    border: 0;
    font-weight: normal;
    line-height: normal;
    text-decoration: none;
    color: inherit;
}

.item-inner {
    margin: 0;
    padding: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-orient: inherit;
    -webkit-box-direction: inherit;
    -webkit-flex-direction: inherit;
    -ms-flex-direction: inherit;
    flex-direction: inherit;
    -webkit-box-align: inherit;
    -webkit-align-items: inherit;
    -ms-flex-align: inherit;
    align-items: inherit;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    min-height: inherit;
    border: 0;
}

.input-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-orient: inherit;
    -webkit-box-direction: inherit;
    -webkit-flex-direction: inherit;
    -ms-flex-direction: inherit;
    flex-direction: inherit;
    -webkit-box-align: inherit;
    -webkit-align-items: inherit;
    -ms-flex-align: inherit;
    align-items: inherit;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    text-overflow: ellipsis;
}

.item[no-lines],
.item.item[no-lines] .item-inner {
    border: 0;
}

ion-item-group {
    display: block;
}

ion-item-divider {
    margin: 0;
    padding: 0;
    z-index: 100;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    min-height: 30px;
}

    ion-item-divider[sticky] {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
    }

[vertical-align-top],
ion-input.item {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.item > ion-icon[small]:first-child,
.item-inner > ion-icon[small]:first-child {
    min-width: 18px;
}

.item > ion-icon:first-child,
.item-inner > ion-icon:first-child {
    text-align: center;
    min-width: 24px;
}

.item > ion-icon,
.item-inner > ion-icon {
    min-height: 2.8rem;
    font-size: 2.8rem;
    line-height: 1;
}

    .item > ion-icon[large],
    .item-inner > ion-icon[large] {
        min-height: 3.2rem;
        font-size: 3.2rem;
    }

    .item > ion-icon[small],
    .item-inner > ion-icon[small] {
        min-height: 1.8rem;
        font-size: 1.8rem;
    }

ion-avatar,
ion-thumbnail {
    display: block;
    line-height: 1;
}

    ion-avatar img,
    ion-thumbnail img {
        display: block;
    }

.item-cover {
    left: 0;
    top: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    background: transparent;
    cursor: pointer;
}

ion-reorder {
    -webkit-transform: translate3d(300%, 0, 0);
    transform: translate3d(300%, 0, 0);
    display: none;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    max-width: 40px;
    height: 100%;
    font-size: 1.7em;
    opacity: .25;
    -webkit-transition: -webkit-transform 140ms ease-in;
    transition: -webkit-transform 140ms ease-in;
    transition: transform 140ms ease-in;
    transition: transform 140ms ease-in, -webkit-transform 140ms ease-in;
    pointer-events: all;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
}

.reorder-side-start ion-reorder {
    -webkit-transform: translate3d(-300%, 0, 0);
    transform: translate3d(-300%, 0, 0);
    -webkit-box-ordinal-group: 0;
    -webkit-order: -1;
    -ms-flex-order: -1;
    order: -1;
}

ion-reorder ion-icon {
    pointer-events: none;
}

.reorder-enabled ion-reorder {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.reorder-visible ion-reorder {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.reorder-list-active .item,
.reorder-list-active .item-wrapper {
    -webkit-transition: -webkit-transform 300ms;
    transition: -webkit-transform 300ms;
    transition: transform 300ms;
    transition: transform 300ms, -webkit-transform 300ms;
    will-change: transform;
}

.reorder-list-active .item-inner {
    pointer-events: none;
}

.item-wrapper.reorder-active,
.item.reorder-active,
.reorder-active {
    z-index: 4;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
    opacity: .8;
    -webkit-transition: none;
    transition: none;
    pointer-events: none;
}

ion-item-sliding {
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
}

    ion-item-sliding .item {
        position: static;
    }

ion-item-options {
    position: absolute;
    z-index: 1;
    display: none;
    height: 100%;
    font-size: 14px;
    visibility: hidden;
    top: 0;
    right: 0;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

    ion-item-options[side=left] {
        right: auto;
        left: 0;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

    ion-item-options .button {
        margin: 0;
        padding: 0 0.7em;
        border-radius: 0;
        height: 100%;
        -webkit-box-shadow: none;
        box-shadow: none;
        -webkit-box-sizing: content-box;
        box-sizing: content-box;
    }

        ion-item-options .button:last-child {
            padding-right: 0.7em;
        }

@media screen and (orientation: landscape) {
    ion-item-options .button:last-child {
        padding-right: calc(constant(safe-area-inset-right) + 0.7em);
        padding-right: calc(env(safe-area-inset-right) + 0.7em);
    }
}

ion-item-options:not([icon-left]) .button:not([icon-only]) .button-inner,
ion-item-options:not([icon-start]) .button:not([icon-only]) .button-inner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

ion-item-options:not([icon-left]) .button:not([icon-only]) ion-icon,
ion-item-options:not([icon-start]) .button:not([icon-only]) ion-icon {
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0.3em;
}

ion-item-sliding.active-slide .item,
ion-item-sliding.active-slide .item.activated {
    position: relative;
    z-index: 2;
    opacity: 1;
    -webkit-transition: -webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);
    transition: -webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);
    transition: transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);
    transition: transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1), -webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);
    pointer-events: none;
    will-change: transform;
}

ion-item-sliding.active-slide ion-item-options {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

ion-item-sliding.active-slide.active-options-left ion-item-options[side=left],
ion-item-sliding.active-slide.active-options-right ion-item-options:not([side=left]) {
    width: 100%;
    visibility: visible;
}

button[expandable] {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-transition-duration: 0;
    transition-duration: 0;
    -webkit-transition-property: none;
    transition-property: none;
    -webkit-transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);
    transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);
}

ion-item-sliding.active-swipe-right button[expandable] {
    -webkit-transition-duration: .6s;
    transition-duration: .6s;
    -webkit-transition-property: padding-left;
    transition-property: padding-left;
    padding-left: 90%;
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
}

ion-item-sliding.active-swipe-left button[expandable] {
    -webkit-transition-duration: .6s;
    transition-duration: .6s;
    -webkit-transition-property: padding-right;
    transition-property: padding-right;
    padding-right: 90%;
    -webkit-box-ordinal-group: 0;
    -webkit-order: -1;
    -ms-flex-order: -1;
    order: -1;
}

.item-ios {
    padding-left: 16px;
    padding-left: 16px;
    border-radius: 0;
    position: relative;
    font-size: 1.7rem;
    color: #000;
    background-color: #fff;
    -webkit-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}

@media screen and (orientation: landscape) {
    .item-ios {
        padding-left: calc(constant(safe-area-inset-left) + 16px);
        padding-left: calc(env(safe-area-inset-left) + 16px);
    }
}

.item-ios.activated {
    background-color: #d9d9d9;
    -webkit-transition-duration: 0ms;
    transition-duration: 0ms;
}

.item-ios h1 {
    margin: 0 0 2px;
    font-size: 2.4rem;
    font-weight: normal;
}

.item-ios h2 {
    margin: 0 0 2px;
    font-size: 1.7rem;
    font-weight: normal;
}

.item-ios h3,
.item-ios h4,
.item-ios h5,
.item-ios h6 {
    margin: 0 0 3px;
    font-size: 1.4rem;
    font-weight: normal;
    line-height: normal;
}

.item-ios p {
    overflow: inherit;
    font-size: 1.4rem;
    line-height: normal;
    text-overflow: inherit;
    color: #8e9093;
    margin: 0 0 2px;
}

    .item-ios h2:last-child,
    .item-ios h3:last-child,
    .item-ios h4:last-child,
    .item-ios h5:last-child,
    .item-ios h6:last-child,
    .item-ios p:last-child {
        margin-bottom: 0;
    }

.item-ios.item-block .item-inner {
    padding-right: 8px;
    padding-right: 8px;
    border-bottom: 0.55px solid #c8c7cc;
}

@media screen and (orientation: landscape) {
    .item-ios.item-block .item-inner {
        padding-right: calc(constant(safe-area-inset-right) + 8px);
        padding-right: calc(env(safe-area-inset-right) + 8px);
    }
}

.item-ios [item-left],
.item-ios [item-start] {
    margin: 8px 16px 8px 0;
}

.item-ios [item-right],
.item-ios [item-end] {
    margin: 8px;
}

.item-ios ion-icon[item-left],
.item-ios ion-icon[item-right],
.item-ios ion-icon[item-start],
.item-ios ion-icon[item-end] {
    margin-left: 0;
    margin-top: 9px;
    margin-bottom: 8px;
}

.item-ios .item-button {
    padding: 0 0.5em;
    height: 24px;
    font-size: 1.3rem;
}

    .item-ios .item-button[icon-only] ion-icon,
    .item-ios .item-button[icon-only] {
        padding: 0 1px;
    }

.item-ios ion-avatar[item-left],
.item-ios ion-thumbnail[item-left],
.item-ios ion-avatar[item-start],
.item-ios ion-thumbnail[item-start] {
    margin: 8px 16px 8px 0;
}

.item-ios ion-avatar[item-right],
.item-ios ion-thumbnail[item-right],
.item-ios ion-avatar[item-end],
.item-ios ion-thumbnail[item-end] {
    margin: 8px;
}

.item-ios ion-avatar {
    min-width: 36px;
    min-height: 36px;
}

    .item-ios ion-avatar ion-img,
    .item-ios ion-avatar img {
        border-radius: 50%;
        overflow: hidden;
        width: 36px;
        height: 36px;
    }

.item-ios ion-thumbnail {
    min-width: 56px;
    min-height: 56px;
}

    .item-ios ion-thumbnail ion-img,
    .item-ios ion-thumbnail img {
        width: 56px;
        height: 56px;
    }

.item-ios[detail-push] .item-inner,
button.item-ios:not([detail-none]) .item-inner,
a.item-ios:not([detail-none]) .item-inner {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%2020'><path%20d='M2,20l-2-2l8-8L0,2l2-2l10,10L2,20z'%20fill='%23c8c7cc'/></svg>");
    padding-right: 32px;
    background-position: right 14px center;
    background-position: right calc(14px + constant(safe-area-inset-right)) center;
    background-position: right calc(14px + env(safe-area-inset-right)) center;
    background-repeat: no-repeat;
    background-size: 14px 14px;
}

ion-item-group .item-ios:first-child .item-inner {
    border-top-width: 0;
}

ion-item-group .item-ios:last-child .item-inner,
ion-item-group .item-wrapper:last-child .item-ios .item-inner {
    border: 0;
}

.item-divider-ios {
    padding-left: 16px;
    padding-left: 16px;
    color: #222;
    background-color: #f7f7f7;
}

@media screen and (orientation: landscape) {
    .item-divider-ios {
        padding-left: calc(constant(safe-area-inset-left) + 16px);
        padding-left: calc(env(safe-area-inset-left) + 16px);
    }
}

.item-ios .text-ios-primary {
    color: #488aff;
}

.item-ios-primary,
.item-divider-ios-primary {
    color: #fff;
    background-color: #488aff;
}

    .item-ios-primary p,
    .item-divider-ios-primary p {
        color: #fff;
    }

    .item-ios-primary.activated,
    .item-divider-ios-primary.activated {
        background-color: #427feb;
    }

.item-ios .text-ios-secondary {
    color: #32db64;
}

.item-ios-secondary,
.item-divider-ios-secondary {
    color: #fff;
    background-color: #32db64;
}

    .item-ios-secondary p,
    .item-divider-ios-secondary p {
        color: #fff;
    }

    .item-ios-secondary.activated,
    .item-divider-ios-secondary.activated {
        background-color: #2ec95c;
    }

.item-ios .text-ios-danger {
    color: #f53d3d;
}

.item-ios-danger,
.item-divider-ios-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .item-ios-danger p,
    .item-divider-ios-danger p {
        color: #fff;
    }

    .item-ios-danger.activated,
    .item-divider-ios-danger.activated {
        background-color: #e13838;
    }

.item-ios .text-ios-light {
    color: #f4f4f4;
}

.item-ios-light,
.item-divider-ios-light {
    color: #000;
    background-color: #f4f4f4;
}

    .item-ios-light p,
    .item-divider-ios-light p {
        color: #000;
    }

    .item-ios-light.activated,
    .item-divider-ios-light.activated {
        background-color: #e0e0e0;
    }

.item-ios .text-ios-dark {
    color: #222;
}

.item-ios-dark,
.item-divider-ios-dark {
    color: #fff;
    background-color: #222;
}

    .item-ios-dark p,
    .item-divider-ios-dark p {
        color: #fff;
    }

    .item-ios-dark.activated,
    .item-divider-ios-dark.activated {
        background-color: #343434;
    }

.list-ios ion-item-sliding {
    background-color: #fff;
}

.item-md {
    padding-left: 16px;
    padding-right: 0;
    position: relative;
    font-size: 1.6rem;
    font-weight: normal;
    text-transform: none;
    color: #000;
    background-color: #fff;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

    .item-md.activated {
        background-color: #f1f1f1;
    }

    .item-md[no-lines] {
        border-width: 0;
    }

    .item-md h1 {
        margin: 0 0 2px;
        font-size: 2.4rem;
        font-weight: normal;
    }

    .item-md h2 {
        margin: 2px 0;
        font-size: 1.6rem;
        font-weight: normal;
    }

    .item-md h3,
    .item-md h4,
    .item-md h5,
    .item-md h6 {
        margin: 2px 0;
        font-size: 1.4rem;
        font-weight: normal;
        line-height: normal;
    }

    .item-md p {
        margin: 0 0 2px;
        overflow: inherit;
        font-size: 1.4rem;
        line-height: normal;
        text-overflow: inherit;
        color: #666;
    }

    .item-md.item-block .item-inner {
        padding-right: 8px;
        border-bottom: 1px solid #dedede;
    }

    .item-md [item-left],
    .item-md [item-right],
    .item-md [item-start],
    .item-md [item-end] {
        margin: 9px 8px 9px 0;
    }

    .item-md ion-icon[item-left],
    .item-md ion-icon[item-right],
    .item-md ion-icon[item-start],
    .item-md ion-icon[item-end] {
        margin-left: 0;
        margin-top: 11px;
        margin-bottom: 10px;
    }

    .item-md .item-button {
        padding: 0 0.6em;
        height: 25px;
        font-size: 1.2rem;
    }

        .item-md .item-button[icon-only] ion-icon,
        .item-md .item-button[icon-only] {
            padding: 0 1px;
        }

    .item-md ion-icon[item-left] + .item-inner,
    .item-md ion-icon[item-left] + .item-input,
    .item-md ion-icon[item-start] + .item-inner,
    .item-md ion-icon[item-start] + .item-input {
        margin-left: 24px;
    }

    .item-md ion-avatar[item-left],
    .item-md ion-thumbnail[item-left],
    .item-md ion-avatar[item-start],
    .item-md ion-thumbnail[item-start] {
        margin: 8px 16px 8px 0;
    }

    .item-md ion-avatar[item-right],
    .item-md ion-thumbnail[item-right],
    .item-md ion-avatar[item-end],
    .item-md ion-thumbnail[item-end] {
        margin: 8px;
    }

    .item-md ion-avatar {
        min-width: 40px;
        min-height: 40px;
    }

        .item-md ion-avatar ion-img,
        .item-md ion-avatar img {
            border-radius: 50%;
            overflow: hidden;
            width: 40px;
            height: 40px;
        }

    .item-md ion-thumbnail {
        min-width: 80px;
        min-height: 80px;
    }

        .item-md ion-thumbnail ion-img,
        .item-md ion-thumbnail img {
            width: 80px;
            height: 80px;
        }

ion-item-group .item-md:first-child .item-inner {
    border-top-width: 0;
}

ion-item-group .item-md:last-child .item-inner,
ion-item-group .item-md .item-wrapper:last-child .item-inner {
    border: 0;
}

.item-divider-md {
    padding-left: 16px;
    border-bottom: 1px solid #dedede;
    font-size: 1.4rem;
    color: #858585;
    background-color: #fff;
}

.item-md .text-md-primary {
    color: #488aff;
}

.item-md-primary,
.item-divider-md-primary {
    color: #fff;
    background-color: #488aff;
}

    .item-md-primary p,
    .item-divider-md-primary p {
        color: #fff;
    }

    .item-md-primary.activated,
    .item-divider-md-primary.activated {
        background-color: #427feb;
    }

.item-md .text-md-secondary {
    color: #32db64;
}

.item-md-secondary,
.item-divider-md-secondary {
    color: #fff;
    background-color: #32db64;
}

    .item-md-secondary p,
    .item-divider-md-secondary p {
        color: #fff;
    }

    .item-md-secondary.activated,
    .item-divider-md-secondary.activated {
        background-color: #2ec95c;
    }

.item-md .text-md-danger {
    color: #f53d3d;
}

.item-md-danger,
.item-divider-md-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .item-md-danger p,
    .item-divider-md-danger p {
        color: #fff;
    }

    .item-md-danger.activated,
    .item-divider-md-danger.activated {
        background-color: #e13838;
    }

.item-md .text-md-light {
    color: #f4f4f4;
}

.item-md-light,
.item-divider-md-light {
    color: #000;
    background-color: #f4f4f4;
}

    .item-md-light p,
    .item-divider-md-light p {
        color: #000;
    }

    .item-md-light.activated,
    .item-divider-md-light.activated {
        background-color: #e0e0e0;
    }

.item-md .text-md-dark {
    color: #222;
}

.item-md-dark,
.item-divider-md-dark {
    color: #fff;
    background-color: #222;
}

    .item-md-dark p,
    .item-divider-md-dark p {
        color: #fff;
    }

    .item-md-dark.activated,
    .item-divider-md-dark.activated {
        background-color: #343434;
    }

.list-md ion-item-sliding {
    background-color: #fff;
}

.item-md ion-reorder {
    font-size: 1.5em;
    opacity: .3;
}

.item-wp {
    padding-left: 16px;
    padding-right: 0;
    position: relative;
    font-size: 1.6rem;
    font-weight: normal;
    text-transform: none;
    color: #000;
    background-color: #fff;
    -webkit-box-shadow: none;
    box-shadow: none;
}

    .item-wp.activated {
        background-color: #aaa;
    }

    .item-wp[no-lines] {
        border-width: 0;
    }

    .item-wp h1 {
        margin: 0 0 2px;
        font-size: 2.4rem;
        font-weight: normal;
    }

    .item-wp h2 {
        margin: 2px 0;
        font-size: 1.6rem;
        font-weight: normal;
    }

    .item-wp h3,
    .item-wp h4,
    .item-wp h5,
    .item-wp h6 {
        margin: 2px 0;
        font-size: 1.4rem;
        font-weight: normal;
        line-height: normal;
    }

    .item-wp p {
        margin: 0 0 2px;
        overflow: inherit;
        font-size: 1.4rem;
        line-height: normal;
        text-overflow: inherit;
        color: #666;
    }

    .item-wp.item-block .item-inner {
        padding-right: 8px;
        border-bottom: 1px solid transparent;
    }

    .item-wp [item-left],
    .item-wp [item-right],
    .item-wp [item-start],
    .item-wp [item-end] {
        margin: 9px 8px 9px 0;
    }

    .item-wp ion-icon[item-left],
    .item-wp ion-icon[item-right],
    .item-wp ion-icon[item-start],
    .item-wp ion-icon[item-end] {
        margin-left: 0;
        margin-top: 11px;
        margin-bottom: 10px;
    }

    .item-wp .item-button {
        padding: 0 0.6em;
        height: 25px;
        font-size: 1.2rem;
    }

        .item-wp .item-button[icon-only] ion-icon,
        .item-wp .item-button[icon-only] {
            padding: 0 1px;
        }

    .item-wp[text-wrap] ion-label {
        font-size: 1.4rem;
        line-height: 1.5;
    }

    .item-wp ion-icon[item-left] + .item-inner,
    .item-wp ion-icon[item-left] + .item-input,
    .item-wp ion-icon[item-start] + .item-inner,
    .item-wp ion-icon[item-start] + .item-input {
        margin-left: 8px;
    }

    .item-wp ion-avatar[item-left],
    .item-wp ion-thumbnail[item-left],
    .item-wp ion-avatar[item-start],
    .item-wp ion-thumbnail[item-start] {
        margin: 8px 16px 8px 0;
    }

    .item-wp ion-avatar[item-right],
    .item-wp ion-thumbnail[item-right],
    .item-wp ion-avatar[item-end],
    .item-wp ion-thumbnail[item-end] {
        margin: 8px;
    }

    .item-wp ion-avatar {
        min-width: 40px;
        min-height: 40px;
    }

        .item-wp ion-avatar ion-img,
        .item-wp ion-avatar img {
            border-radius: 50%;
            overflow: hidden;
            width: 40px;
            height: 40px;
        }

    .item-wp ion-thumbnail {
        min-width: 80px;
        min-height: 80px;
    }

        .item-wp ion-thumbnail ion-img,
        .item-wp ion-thumbnail img {
            width: 80px;
            height: 80px;
        }

.item-divider-wp {
    padding-left: 16px;
    border-bottom: 1px solid transparent;
    font-size: 2rem;
    color: #000;
    background-color: #fff;
}

.item-wp .text-wp-primary {
    color: #488aff;
}

.item-wp-primary,
.item-divider-wp-primary {
    color: #fff;
    background-color: #488aff;
}

    .item-wp-primary p,
    .item-divider-wp-primary p {
        color: #fff;
    }

    .item-wp-primary.activated,
    .item-divider-wp-primary.activated {
        background-color: #427feb;
    }

.item-wp .text-wp-secondary {
    color: #32db64;
}

.item-wp-secondary,
.item-divider-wp-secondary {
    color: #fff;
    background-color: #32db64;
}

    .item-wp-secondary p,
    .item-divider-wp-secondary p {
        color: #fff;
    }

    .item-wp-secondary.activated,
    .item-divider-wp-secondary.activated {
        background-color: #2ec95c;
    }

.item-wp .text-wp-danger {
    color: #f53d3d;
}

.item-wp-danger,
.item-divider-wp-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .item-wp-danger p,
    .item-divider-wp-danger p {
        color: #fff;
    }

    .item-wp-danger.activated,
    .item-divider-wp-danger.activated {
        background-color: #e13838;
    }

.item-wp .text-wp-light {
    color: #f4f4f4;
}

.item-wp-light,
.item-divider-wp-light {
    color: #000;
    background-color: #f4f4f4;
}

    .item-wp-light p,
    .item-divider-wp-light p {
        color: #000;
    }

    .item-wp-light.activated,
    .item-divider-wp-light.activated {
        background-color: #e0e0e0;
    }

.item-wp .text-wp-dark {
    color: #222;
}

.item-wp-dark,
.item-divider-wp-dark {
    color: #fff;
    background-color: #222;
}

    .item-wp-dark p,
    .item-divider-wp-dark p {
        color: #fff;
    }

    .item-wp-dark.activated,
    .item-divider-wp-dark.activated {
        background-color: #343434;
    }

.list-wp ion-item-sliding {
    background-color: #fff;
}

ion-label {
    margin: 0;
    display: block;
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-size: inherit;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.item-input ion-label {
    -webkit-box-flex: initial;
    -webkit-flex: initial;
    -ms-flex: initial;
    flex: initial;
    max-width: 200px;
    pointer-events: none;
}

[text-wrap] ion-label {
    white-space: normal;
}

ion-label[fixed] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100px;
    -ms-flex: 0 0 100px;
    flex: 0 0 100px;
    width: 100px;
    min-width: 100px;
    max-width: 200px;
}

.item-label-stacked ion-label,
.item-label-floating ion-label {
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    width: auto;
    max-width: 100%;
}

ion-label[stacked],
ion-label[floating] {
    margin-bottom: 0;
}

.item-label-stacked .input-wrapper,
.item-label-floating .input-wrapper {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

.item-label-stacked ion-select,
.item-label-floating ion-select {
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    max-width: 100%;
}

.label-ios {
    margin: 11px 8px 11px 0;
}

    .label-ios + ion-input .text-input,
    .label-ios + ion-textarea .text-input,
    .label-ios + .input + .cloned-input {
        margin-left: 16px;
        width: calc(100% - (16px / 2) - 16px);
    }

    .label-ios[stacked] {
        margin-bottom: 4px;
        font-size: 1.2rem;
    }

    .label-ios[floating] {
        margin-bottom: 0;
        -webkit-transform: translate3d(0, 27px, 0);
        transform: translate3d(0, 27px, 0);
        -webkit-transform-origin: left top;
        transform-origin: left top;
        -webkit-transition: -webkit-transform 150ms ease-in-out;
        transition: -webkit-transform 150ms ease-in-out;
        transition: transform 150ms ease-in-out;
        transition: transform 150ms ease-in-out, -webkit-transform 150ms ease-in-out;
    }

.item-input-has-focus .label-ios[floating],
.input-has-focus .label-ios[floating],
.item-input-has-value .label-ios[floating],
.input-has-value .label-ios[floating] {
    -webkit-transform: translate3d(0, 0, 0) scale(0.8);
    transform: translate3d(0, 0, 0) scale(0.8);
}

.item-ios.item-label-stacked [item-right],
.item-ios.item-label-floating [item-right],
.item-ios.item-label-stacked [item-end],
.item-ios.item-label-floating [item-end] {
    margin-top: 6px;
    margin-bottom: 6px;
}

.label-ios-primary,
.item-input .label-ios-primary,
.item-select .label-ios-primary,
.item-datetime .label-ios-primary {
    color: #488aff;
}

.label-ios-secondary,
.item-input .label-ios-secondary,
.item-select .label-ios-secondary,
.item-datetime .label-ios-secondary {
    color: #32db64;
}

.label-ios-danger,
.item-input .label-ios-danger,
.item-select .label-ios-danger,
.item-datetime .label-ios-danger {
    color: #f53d3d;
}

.label-ios-light,
.item-input .label-ios-light,
.item-select .label-ios-light,
.item-datetime .label-ios-light {
    color: #f4f4f4;
}

.label-ios-dark,
.item-input .label-ios-dark,
.item-select .label-ios-dark,
.item-datetime .label-ios-dark {
    color: #222;
}

.label-md {
    margin: 13px 8px 13px 0;
}

[text-wrap] .label-md {
    font-size: 1.4rem;
    line-height: 1.5;
}

.item-input .label-md,
.item-select .label-md,
.item-datetime .label-md {
    color: #999;
}

.label-md[stacked] {
    font-size: 1.2rem;
}

.label-md[floating] {
    -webkit-transform: translate3d(0, 27px, 0);
    transform: translate3d(0, 27px, 0);
    -webkit-transform-origin: left top;
    transform-origin: left top;
    -webkit-transition: -webkit-transform 150ms ease-in-out;
    transition: -webkit-transform 150ms ease-in-out;
    transition: transform 150ms ease-in-out;
    transition: transform 150ms ease-in-out, -webkit-transform 150ms ease-in-out;
}

.label-md[stacked],
.label-md[floating] {
    margin-left: 0;
    margin-bottom: 0;
}

.item-input-has-focus .label-md[stacked],
.input-has-focus .label-md[stacked],
.item-input-has-focus .label-md[floating],
.input-has-focus .label-md[floating] {
    color: #488aff;
}

.item-input-has-focus .label-md[floating],
.input-has-focus .label-md[floating],
.item-input-has-value .label-md[floating],
.input-has-value .label-md[floating] {
    -webkit-transform: translate3d(0, 0, 0) scale(0.8);
    transform: translate3d(0, 0, 0) scale(0.8);
}

.item-md.item-label-stacked [item-right],
.item-md.item-label-floating [item-right],
.item-md.item-label-stacked [item-end],
.item-md.item-label-floating [item-end] {
    margin-top: 7px;
    margin-bottom: 7px;
}

.label-md-primary,
.item-input .label-md-primary,
.item-select .label-md-primary,
.item-datetime .label-md-primary {
    color: #488aff;
}

.label-md-secondary,
.item-input .label-md-secondary,
.item-select .label-md-secondary,
.item-datetime .label-md-secondary {
    color: #32db64;
}

.label-md-danger,
.item-input .label-md-danger,
.item-select .label-md-danger,
.item-datetime .label-md-danger {
    color: #f53d3d;
}

.label-md-light,
.item-input .label-md-light,
.item-select .label-md-light,
.item-datetime .label-md-light {
    color: #f4f4f4;
}

.label-md-dark,
.item-input .label-md-dark,
.item-select .label-md-dark,
.item-datetime .label-md-dark {
    color: #222;
}

.label-wp {
    margin: 13px 8px 13px 0;
}

.item-input .label-wp,
.item-select .label-wp,
.item-datetime .label-wp {
    color: #999;
}

.label-wp[stacked] {
    font-size: 1.2rem;
}

.label-wp[floating] {
    -webkit-transform: translate3d(8px, 34px, 0);
    transform: translate3d(8px, 34px, 0);
    -webkit-transform-origin: left top;
    transform-origin: left top;
}

.label-wp[stacked],
.label-wp[floating] {
    margin-left: 0;
    margin-bottom: 0;
}

.item-input-has-focus .label-wp[stacked],
.input-has-focus .label-wp[stacked],
.item-input-has-focus .label-wp[floating],
.input-has-focus .label-wp[floating] {
    color: #488aff;
}

.item-input-has-focus .label-wp[floating],
.input-has-focus .label-wp[floating],
.item-input-has-value .label-wp[floating],
.input-has-value .label-wp[floating] {
    -webkit-transform: translate3d(0, 0, 0) scale(0.8);
    transform: translate3d(0, 0, 0) scale(0.8);
}

.item-wp.item-label-stacked [item-right],
.item-wp.item-label-floating [item-right],
.item-wp.item-label-stacked [item-end],
.item-wp.item-label-floating [item-end] {
    margin-top: 13px;
    margin-bottom: 13px;
}

.label-wp-primary,
.item-input .label-wp-primary,
.item-select .label-wp-primary,
.item-datetime .label-wp-primary {
    color: #488aff;
}

.label-wp-secondary,
.item-input .label-wp-secondary,
.item-select .label-wp-secondary,
.item-datetime .label-wp-secondary {
    color: #32db64;
}

.label-wp-danger,
.item-input .label-wp-danger,
.item-select .label-wp-danger,
.item-datetime .label-wp-danger {
    color: #f53d3d;
}

.label-wp-light,
.item-input .label-wp-light,
.item-select .label-wp-light,
.item-datetime .label-wp-light {
    color: #f4f4f4;
}

.label-wp-dark,
.item-input .label-wp-dark,
.item-select .label-wp-dark,
.item-datetime .label-wp-dark {
    color: #222;
}

ion-list-header {
    margin: 0;
    padding: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    min-height: 4rem;
}

ion-list {
    margin: 0;
    padding: 0;
    display: block;
    list-style-type: none;
}

    ion-list[inset] {
        overflow: hidden;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }

.list-ios {
    margin: -1px 0 32px;
}

    .list-ios > .item-block:first-child {
        border-top: 0.55px solid #c8c7cc;
    }

    .list-ios > .item-block:last-child,
    .list-ios > .item-wrapper:last-child .item-block {
        border-bottom: 0.55px solid #c8c7cc;
    }

        .list-ios > .item-block:last-child .item-inner,
        .list-ios > .item-wrapper:last-child .item-block .item-inner {
            border-bottom: 0;
        }

    .list-ios .item-block .item-inner {
        border-bottom: 0.55px solid #c8c7cc;
    }

    .list-ios .item[no-lines],
    .list-ios .item[no-lines] .item-inner {
        border-width: 0;
    }

    .list-ios ion-item-options {
        border-bottom: 0.55px solid #c8c7cc;
    }

        .list-ios ion-item-options .button {
            margin: 0;
            border-radius: 0;
            display: -webkit-inline-box;
            display: -webkit-inline-flex;
            display: -ms-inline-flexbox;
            display: inline-flex;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            height: 100%;
            min-height: 100%;
            border: 0;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }

            .list-ios ion-item-options .button::before {
                margin: 0 auto;
            }

    .list-ios:not([inset]) + .list-ios:not([inset]) ion-list-header {
        margin-top: -10px;
        padding-top: 0;
    }

    .list-ios[inset] {
        margin: 16px;
        border-radius: 4px;
    }

        .list-ios[inset] ion-list-header {
            background-color: #fff;
        }

        .list-ios[inset] .item {
            border-bottom: 1px solid #c8c7cc;
        }

        .list-ios[inset] .item-inner {
            border-bottom: 0;
        }

        .list-ios[inset] > .item:first-child,
        .list-ios[inset] > .item-wrapper:first-child .item {
            border-top: 0;
        }

        .list-ios[inset] > .item:last-child,
        .list-ios[inset] > .item-wrapper:last-child .item {
            border-bottom: 0;
        }

        .list-ios[inset] + ion-list[inset] {
            margin-top: 0;
        }

    .list-ios[no-lines] ion-list-header,
    .list-ios[no-lines] ion-item-options,
    .list-ios[no-lines] .item,
    .list-ios[no-lines] .item .item-inner {
        border-width: 0;
    }

.list-header-ios {
    padding-left: 16px;
    padding-left: 16px;
    position: relative;
    border-bottom: 0.55px solid #c8c7cc;
    font-size: 1.2rem;
    font-weight: 500;
    letter-spacing: 0.1rem;
    text-transform: uppercase;
    color: #333;
    background: transparent;
}

@media screen and (orientation: landscape) {
    .list-header-ios {
        padding-left: calc(constant(safe-area-inset-left) + 16px);
        padding-left: calc(env(safe-area-inset-left) + 16px);
    }
}

.list-header-ios-primary {
    color: #fff;
    background-color: #488aff;
}

.list-header-ios-secondary {
    color: #fff;
    background-color: #32db64;
}

.list-header-ios-danger {
    color: #fff;
    background-color: #f53d3d;
}

.list-header-ios-light {
    color: #000;
    background-color: #f4f4f4;
}

.list-header-ios-dark {
    color: #fff;
    background-color: #222;
}

.list-md {
    margin: -1px 0 16px;
}

    .list-md .item-block .item-inner {
        border-bottom: 1px solid #dedede;
    }

    .list-md > .item-block:last-child ion-label,
    .list-md > .item-block:last-child .item-inner,
    .list-md > .item-wrapper:last-child ion-label,
    .list-md > .item-wrapper:last-child .item-inner {
        border-bottom: 0;
    }

    .list-md > ion-input:last-child::after {
        left: 0;
    }

    .list-md ion-item-options {
        border-bottom: 1px solid #dedede;
    }

        .list-md ion-item-options .button {
            margin: 0;
            border-radius: 0;
            display: -webkit-inline-box;
            display: -webkit-inline-flex;
            display: -ms-inline-flexbox;
            display: inline-flex;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            height: 100%;
            border: 0;
            -webkit-box-shadow: none;
            box-shadow: none;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }

            .list-md ion-item-options .button::before {
                margin: 0 auto;
            }

    .list-md .item[no-lines],
    .list-md .item[no-lines] .item-inner {
        border-width: 0;
    }

    .list-md + ion-list ion-list-header {
        margin-top: -16px;
    }

    .list-md[inset] {
        margin: 16px;
        border-radius: 2px;
    }

        .list-md[inset] .item:first-child {
            border-top-left-radius: 2px;
            border-top-right-radius: 2px;
            border-top-width: 0;
        }

        .list-md[inset] .item:last-child {
            border-bottom-right-radius: 2px;
            border-bottom-left-radius: 2px;
            border-bottom-width: 0;
        }

        .list-md[inset] .item-input {
            padding-left: 0;
            padding-right: 0;
        }

        .list-md[inset] + ion-list[inset] {
            margin-top: 0;
        }

        .list-md[inset] ion-list-header {
            background-color: #fff;
        }

    .list-md[no-lines] .item-block,
    .list-md[no-lines] ion-item-options,
    .list-md[no-lines] .item .item-inner {
        border-width: 0;
    }

.list-header-md {
    padding-left: 16px;
    margin-bottom: 13px;
    min-height: 4.5rem;
    border-top: 1px solid #dedede;
    font-size: 1.4rem;
    color: #757575;
}

.list-header-md-primary {
    color: #fff;
    background-color: #488aff;
}

.list-header-md-secondary {
    color: #fff;
    background-color: #32db64;
}

.list-header-md-danger {
    color: #fff;
    background-color: #f53d3d;
}

.list-header-md-light {
    color: #000;
    background-color: #f4f4f4;
}

.list-header-md-dark {
    color: #fff;
    background-color: #222;
}

.list-md .item-input:last-child {
    border-bottom: 1px solid #dedede;
}

.list-wp {
    margin: 0 0 16px;
}

    .list-wp .item-block .item-inner {
        border-bottom: 1px solid transparent;
    }

    .list-wp > .item-block:first-child,
    .list-wp > .item-wrapper:first-child .item-block {
        border-top: 1px solid transparent;
    }

    .list-wp > .item-block:last-child,
    .list-wp > .item-wrapper:last-child .item-block {
        border-bottom: 1px solid transparent;
    }

        .list-wp > .item-block:last-child ion-label,
        .list-wp > .item-block:last-child .item-inner,
        .list-wp > .item-wrapper:last-child ion-label,
        .list-wp > .item-wrapper:last-child .item-inner {
            border-bottom: 0;
        }

    .list-wp > ion-input:last-child::after {
        left: 0;
    }

    .list-wp ion-item-options .button {
        margin: 1px 0;
        border-radius: 0;
        display: -webkit-inline-box;
        display: -webkit-inline-flex;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        height: calc(100% - 2px);
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

        .list-wp ion-item-options .button::before {
            margin: 0 auto;
        }

    .list-wp .item[no-lines],
    .list-wp .item[no-lines] .item-inner {
        border-width: 0;
    }

    .list-wp + ion-list ion-list-header {
        margin-top: -16px;
        padding-top: 0;
    }

    .list-wp[inset] {
        margin: 16px;
        border-radius: 2px;
    }

        .list-wp[inset] .item:first-child {
            border-top-left-radius: 2px;
            border-top-right-radius: 2px;
            border-top-width: 0;
        }

        .list-wp[inset] .item:last-child {
            border-bottom-right-radius: 2px;
            border-bottom-left-radius: 2px;
            border-bottom-width: 0;
        }

        .list-wp[inset] .item-input {
            padding-left: 0;
            padding-right: 0;
        }

        .list-wp[inset] + ion-list[inset] {
            margin-top: 0;
        }

        .list-wp[inset] ion-list-header {
            background-color: #fff;
        }

    .list-wp[no-lines] .item,
    .list-wp[no-lines] .item .item-inner {
        border-width: 0;
    }

.list-header-wp {
    padding-left: 16px;
    border-bottom: 1px solid transparent;
    font-size: 2rem;
    color: #000;
}

.list-header-wp-primary {
    color: #fff;
    background-color: #488aff;
}

.list-header-wp-secondary {
    color: #fff;
    background-color: #32db64;
}

.list-header-wp-danger {
    color: #fff;
    background-color: #f53d3d;
}

.list-header-wp-light {
    color: #000;
    background-color: #f4f4f4;
}

.list-header-wp-dark {
    color: #fff;
    background-color: #222;
}

ion-loading {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    z-index: 1000;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    contain: strict;
}

.loading-wrapper {
    z-index: 10;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    opacity: 0;
}

.loading-ios .loading-wrapper {
    border-radius: 8px;
    max-width: 270px;
    max-height: 90%;
    color: #000;
    background: #f8f8f8;
    padding: 24px 34px;
}

.loading-ios .loading-content {
    font-weight: bold;
}

.loading-ios .loading-spinner + .loading-content {
    margin-left: 16px;
}

.loading-ios .spinner-ios line,
.loading-ios .spinner-ios-small line {
    stroke: #69717d;
}

.loading-ios .spinner-bubbles circle {
    fill: #69717d;
}

.loading-ios .spinner-circles circle {
    fill: #69717d;
}

.loading-ios .spinner-crescent circle {
    stroke: #69717d;
}

.loading-ios .spinner-dots circle {
    fill: #69717d;
}

.loading-md .loading-wrapper {
    border-radius: 2px;
    max-width: 280px;
    max-height: 90%;
    color: rgba(0, 0, 0, 0.5);
    background: #fafafa;
    -webkit-box-shadow: 0 16px 20px rgba(0, 0, 0, 0.4);
    box-shadow: 0 16px 20px rgba(0, 0, 0, 0.4);
    padding: 24px;
}

.loading-md .loading-spinner + .loading-content {
    margin-left: 16px;
}

.loading-md .spinner-ios line,
.loading-md .spinner-ios-small line {
    stroke: #488aff;
}

.loading-md .spinner-bubbles circle {
    fill: #488aff;
}

.loading-md .spinner-circles circle {
    fill: #488aff;
}

.loading-md .spinner-crescent circle {
    stroke: #488aff;
}

.loading-md .spinner-dots circle {
    fill: #488aff;
}

.loading-wp .loading-wrapper {
    border-radius: 2px;
    max-width: 280px;
    max-height: 90%;
    color: #fff;
    background: #000;
    padding: 20px;
}

.loading-wp .loading-spinner + .loading-content {
    margin-left: 16px;
}

.loading-wp .spinner-ios line,
.loading-wp .spinner-ios-small line {
    stroke: #fff;
}

.loading-wp .spinner-bubbles circle {
    fill: #fff;
}

.loading-wp .spinner-circles circle {
    fill: #fff;
}

.loading-wp .spinner-crescent circle {
    stroke: #fff;
}

.loading-wp .spinner-dots circle {
    fill: #fff;
}

ion-menu {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    display: none;
    contain: strict;
}

    ion-menu.show-menu {
        display: block;
    }

.menu-inner {
    left: 0;
    right: auto;
    top: 0;
    bottom: 0;
    -webkit-transform: translate3d(-9999px, 0, 0);
    transform: translate3d(-9999px, 0, 0);
    position: absolute;
    display: block;
    width: 304px;
    height: 100%;
    contain: strict;
}

    .menu-inner > ion-header,
    .menu-inner > ion-content,
    .menu-inner > ion-footer {
        position: absolute;
    }

ion-menu[side=left] > .menu-inner {
    right: auto;
    left: 0;
}

ion-menu[side=right] > .menu-inner {
    right: 0;
    left: auto;
}

ion-menu[side=end] > .menu-inner {
    left: auto;
    right: 0;
}

ion-menu ion-backdrop {
    z-index: -1;
    display: none;
    opacity: .01;
}

.menu-content {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.menu-content-open {
    cursor: pointer;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
}

    .menu-content-open ion-pane,
    .menu-content-open ion-content,
    .menu-content-open .toolbar {
        pointer-events: none;
    }

@media (max-width: 340px) {
    .menu-inner {
        width: 264px;
    }
}

ion-menu[type=reveal] {
    z-index: 0;
}

    ion-menu[type=reveal].show-menu .menu-inner {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

ion-menu[type=overlay] {
    z-index: 80;
}

    ion-menu[type=overlay] .show-backdrop {
        display: block;
    }

.ios .menu-inner {
    background: #fff;
}

.ios .menu-content-reveal {
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.ios .menu-content-push {
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.ios ion-menu[type=overlay] .menu-inner {
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.md .menu-inner {
    background: #fff;
}

.md .menu-content-reveal {
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.md .menu-content-push {
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.md ion-menu[type=overlay] .menu-inner {
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.wp .menu-inner {
    background: #f2f2f2;
}

ion-modal {
    left: 0;
    top: 0;
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    contain: strict;
}

@media not all and (min-width: 768px) and (min-height: 600px) {
    ion-modal ion-backdrop {
        visibility: hidden;
    }
}

.modal-wrapper {
    z-index: 10;
    height: 100%;
    contain: strict;
}

@media only screen and (min-width: 768px) and (min-height: 600px) {
    .modal-wrapper {
        left: calc(50% - (600px/2));
        top: calc(50% - (500px/2));
        position: absolute;
        width: 600px;
        height: 500px;
    }
}

@media only screen and (min-width: 768px) and (min-height: 768px) {
    .modal-wrapper {
        left: calc(50% - (600px/2));
        top: calc(50% - (600px/2));
        position: absolute;
        width: 600px;
        height: 600px;
    }
}

.ios .modal-wrapper {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
}

@media only screen and (min-width: 768px) and (min-height: 600px) {
    .ios .modal-wrapper {
        border-radius: 10px;
        overflow: hidden;
    }
}

.md .modal-wrapper {
    -webkit-transform: translate3d(0, 40px, 0);
    transform: translate3d(0, 40px, 0);
    opacity: .01;
}

@media only screen and (min-width: 768px) and (min-height: 600px) {
    .md .modal-wrapper {
        border-radius: 2px;
        overflow: hidden;
        -webkit-box-shadow: 0 28px 48px rgba(0, 0, 0, 0.4);
        box-shadow: 0 28px 48px rgba(0, 0, 0, 0.4);
    }
}

.wp .modal-wrapper {
    -webkit-transform: translate3d(0, 40px, 0);
    transform: translate3d(0, 40px, 0);
    opacity: .01;
}

.note-ios {
    color: #aeacb4;
}

.note-ios-primary {
    color: #488aff;
}

.note-ios-secondary {
    color: #32db64;
}

.note-ios-danger {
    color: #f53d3d;
}

.note-ios-light {
    color: #f4f4f4;
}

.note-ios-dark {
    color: #222;
}

.note-md {
    color: #c5c5c5;
}

.note-md-primary {
    color: #488aff;
}

.note-md-secondary {
    color: #32db64;
}

.note-md-danger {
    color: #f53d3d;
}

.note-md-light {
    color: #f4f4f4;
}

.note-md-dark {
    color: #222;
}

.note-wp {
    color: rgba(0, 0, 0, 0.5);
}

.note-wp-primary {
    color: #488aff;
}

.note-wp-secondary {
    color: #32db64;
}

.note-wp-danger {
    color: #f53d3d;
}

.note-wp-light {
    color: #f4f4f4;
}

.note-wp-dark {
    color: #222;
}

ion-picker-cmp {
    left: 0;
    top: 0;
    position: absolute;
    z-index: 1000;
    display: block;
    width: 100%;
    height: 100%;
    contain: strict;
}

.picker-toolbar {
    z-index: 1;
    width: 100%;
    contain: strict;
}

.picker-wrapper {
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    position: absolute;
    z-index: 10;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    max-width: 500px;
    contain: strict;
}

.picker-columns {
    margin-bottom: constant(safe-area-inset-bottom);
    margin-bottom: env(safe-area-inset-bottom);
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    contain: strict;
}

.picker-col {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    contain: content;
}

.picker-opts {
    position: relative;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    max-width: 100%;
}

.picker-prefix {
    text-align: right;
    text-align: end;
    position: relative;
    -webkit-box-flex: 2;
    -webkit-flex: 2;
    -ms-flex: 2;
    flex: 2;
    min-width: 45%;
    max-width: 50%;
    white-space: nowrap;
}

.picker-suffix {
    text-align: left;
    text-align: start;
    position: relative;
    -webkit-box-flex: 2;
    -webkit-flex: 2;
    -ms-flex: 2;
    flex: 2;
    min-width: 45%;
    max-width: 50%;
    white-space: nowrap;
}

.picker-opt {
    left: 0;
    top: 0;
    text-align: center;
    position: absolute;
    display: block;
    overflow: hidden;
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    will-change: transform;
    contain: strict;
}

    .picker-opt.picker-opt-disabled {
        pointer-events: none;
    }

.picker-opt-disabled {
    opacity: 0;
}

.picker-opts-left {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.picker-opts-right {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.picker-above-highlight,
.picker-below-highlight {
    display: none;
    pointer-events: none;
}

.picker-ios .picker-wrapper {
    height: 260px;
    border-top: 1px solid #c8c7cc;
    background: #fff;
}

.picker-ios .picker-toolbar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 44px;
    border-bottom: 0.55px solid #c8c7cc;
    background: #fff;
}

.picker-ios .picker-toolbar-button {
    text-align: right;
    text-align: end;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

    .picker-ios .picker-toolbar-button:last-child .picker-button {
        font-weight: 600;
    }

.picker-ios .picker-toolbar-cancel {
    text-align: left;
    text-align: start;
    font-weight: normal;
}

.picker-ios .picker-button,
.picker-ios .picker-button.activated {
    margin: 0;
    height: 44px;
    color: #488aff;
    background: transparent;
}

.picker-columns {
    height: 215px;
    -webkit-perspective: 1000px;
    perspective: 1000px;
}

.picker-ios .picker-col {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    padding: 0 4px;
}

.picker-ios .picker-prefix,
.picker-ios .picker-suffix,
.picker-ios .picker-opts {
    top: 77px;
    font-size: 20px;
    line-height: 42px;
    color: #000;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    pointer-events: none;
}

.picker-ios .picker-opt {
    margin: 0;
    -webkit-transform-origin: center center;
    transform-origin: center center;
    height: 4.6rem;
    font-size: 20px;
    line-height: 42px;
    color: #000;
    background: transparent;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    pointer-events: auto;
    padding: 0;
}

.picker-ios .picker-above-highlight {
    left: 0;
    top: 0;
    -webkit-transform: translate3d(0, 0, 90px);
    transform: translate3d(0, 0, 90px);
    position: absolute;
    z-index: 10;
    display: block;
    width: 100%;
    height: 81px;
    border-bottom: 1px solid #c8c7cc;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, white), to(rgba(255, 255, 255, 0.7)));
    background: linear-gradient(to bottom, white 20%, rgba(255, 255, 255, 0.7) 100%);
}

.picker-ios .picker-below-highlight {
    left: 0;
    top: 115px;
    -webkit-transform: translate3d(0, 0, 90px);
    transform: translate3d(0, 0, 90px);
    position: absolute;
    z-index: 11;
    display: block;
    width: 100%;
    height: 119px;
    border-top: 1px solid #c8c7cc;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(30%, white), to(rgba(255, 255, 255, 0.7)));
    background: linear-gradient(to top, white 30%, rgba(255, 255, 255, 0.7) 100%);
}

.picker-md .picker-wrapper {
    height: 260px;
    border-top: 0.55px solid #dedede;
    background: #fff;
}

.picker-md .picker-toolbar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    height: 44px;
    background: #fff;
}

.picker-md .picker-button,
.picker-md .picker-button.activated {
    margin: 0;
    height: 44px;
    color: #488aff;
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.picker-md .picker-columns {
    height: 216px;
    -webkit-perspective: 1800px;
    perspective: 1800px;
}

.picker-md .picker-col {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    padding: 0 8px;
}

.picker-md .picker-prefix,
.picker-md .picker-suffix,
.picker-md .picker-opts {
    top: 77px;
    font-size: 22px;
    line-height: 42px;
    color: #000;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    pointer-events: none;
}

.picker-md .picker-opt {
    margin: 0;
    height: 4.3rem;
    font-size: 22px;
    line-height: 42px;
    color: #000;
    background: transparent;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    pointer-events: auto;
    padding: 0;
}

    .picker-md .picker-prefix,
    .picker-md .picker-suffix,
    .picker-md .picker-opt.picker-opt-selected {
        color: #488aff;
    }

.picker-md .picker-above-highlight {
    left: 0;
    top: 0;
    -webkit-transform: translate3d(0, 0, 90px);
    transform: translate3d(0, 0, 90px);
    position: absolute;
    z-index: 10;
    width: 100%;
    height: 81px;
    border-bottom: 1px solid #dedede;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, white), to(rgba(255, 255, 255, 0.7)));
    background: linear-gradient(to bottom, white 20%, rgba(255, 255, 255, 0.7) 100%);
}

.picker-md .picker-below-highlight {
    left: 0;
    top: 115px;
    -webkit-transform: translate3d(0, 0, 90px);
    transform: translate3d(0, 0, 90px);
    position: absolute;
    z-index: 11;
    width: 100%;
    height: 119px;
    border-top: 1px solid #dedede;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(30%, white), to(rgba(255, 255, 255, 0.7)));
    background: linear-gradient(to top, white 30%, rgba(255, 255, 255, 0.7) 100%);
}

.picker-wp .picker-wrapper {
    height: 260px;
    border-top: 0.55px solid transparent;
    background: #fff;
}

.picker-wp .picker-toolbar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    height: 44px;
    border-width: 0.55px;
    background: #fff;
}

.picker-wp .picker-toolbar-button {
    text-align: right;
    text-align: end;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.picker-wp .picker-toolbar-cancel {
    text-align: left;
    text-align: start;
    font-weight: normal;
}

.picker-wp .picker-button,
.picker-wp .picker-button.activated {
    margin: 0;
    height: 44px;
    color: #488aff;
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.picker-wp .picker-columns {
    height: 216px;
    -webkit-perspective: 1800px;
    perspective: 1800px;
}

.picker-wp .picker-col {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    padding: 0 4px;
}

.picker-wp .picker-prefix,
.picker-wp .picker-suffix,
.picker-wp .picker-opts {
    top: 77px;
    font-size: 22px;
    line-height: 42px;
    color: #000;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    pointer-events: none;
}

.picker-wp .picker-opt {
    margin: 0;
    height: 4.2rem;
    font-size: 22px;
    line-height: 42px;
    color: #000;
    background: transparent;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    pointer-events: auto;
    padding: 0;
}

.picker-wp .picker-prefix,
.picker-wp .picker-suffix,
.picker-wp .picker-opt-selected {
    color: #488aff;
}

.picker-wp .picker-above-highlight {
    left: 0;
    top: 0;
    -webkit-transform: translate3d(0, 0, 90px);
    transform: translate3d(0, 0, 90px);
    position: absolute;
    z-index: 10;
    width: 100%;
    height: 81px;
    border-bottom: 1px solid transparent;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, white), to(rgba(255, 255, 255, 0.7)));
    background: linear-gradient(to bottom, white 20%, rgba(255, 255, 255, 0.7) 100%);
}

.picker-wp .picker-below-highlight {
    left: 0;
    top: 115px;
    -webkit-transform: translate3d(0, 0, 90px);
    transform: translate3d(0, 0, 90px);
    position: absolute;
    z-index: 11;
    width: 100%;
    height: 119px;
    border-top: 1px solid transparent;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(30%, white), to(rgba(255, 255, 255, 0.7)));
    background: linear-gradient(to top, white 30%, rgba(255, 255, 255, 0.7) 100%);
}

ion-popover {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    z-index: 1000;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.popover-wrapper {
    z-index: 10;
    opacity: 0;
}

.popover-content {
    position: absolute;
    z-index: 10;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

    .popover-content ion-content,
    .popover-content .scroll-content {
        contain: none;
    }

    .popover-content .scroll-content {
        position: relative;
    }

.popover-ios .popover-content {
    border-radius: 10px;
    width: 200px;
    min-width: 0;
    min-height: 0;
    max-height: 90%;
    color: #000;
    background: #fff;
}

.popover-ios .popover-arrow {
    position: absolute;
    display: block;
    overflow: hidden;
    width: 20px;
    height: 10px;
}

    .popover-ios .popover-arrow::after {
        left: 3px;
        top: 3px;
        border-radius: 3px;
        position: absolute;
        z-index: 10;
        width: 14px;
        height: 14px;
        background-color: #fff;
        content: "";
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }

.popover-ios.popover-bottom .popover-arrow {
    top: auto;
    bottom: -10px;
}

    .popover-ios.popover-bottom .popover-arrow::after {
        top: -6px;
    }

.popover-ios .item-ios {
    padding-left: 16px;
}

    .popover-ios .item-ios[detail-push] .item-inner,
    .popover-ios button.item-ios:not([detail-none]) .item-inner,
    .popover-ios a.item-ios:not([detail-none]) .item-inner {
        background-position: right 14px center;
    }

.popover-md .popover-content {
    border-radius: 2px;
    -webkit-transform-origin: left top;
    transform-origin: left top;
    width: 250px;
    min-width: 0;
    min-height: 0;
    max-height: 90%;
    color: #000;
    background: #fff;
    -webkit-box-shadow: 0 3px 12px 2px rgba(0, 0, 0, 0.3);
    box-shadow: 0 3px 12px 2px rgba(0, 0, 0, 0.3);
}

.popover-md .popover-viewport {
    opacity: 0;
    -webkit-transition-delay: 100ms;
    transition-delay: 100ms;
}

.popover-wp .popover-content {
    border-radius: 0;
    -webkit-transform-origin: left top;
    transform-origin: left top;
    width: 200px;
    min-width: 0;
    min-height: 0;
    max-height: 90%;
    border: 2px solid #ccc;
    color: #000;
    background: #fff;
}

.popover-wp .popover-viewport {
    opacity: 0;
    -webkit-transition-delay: 100ms;
    transition-delay: 100ms;
}

.radio-ios {
    position: relative;
    display: inline-block;
}

    .radio-ios .radio-icon {
        position: relative;
        display: block;
        width: 16px;
        height: 21px;
    }

    .radio-ios .radio-checked .radio-inner {
        left: 7px;
        top: 4px;
        position: absolute;
        width: 5px;
        height: 12px;
        border-width: 2px;
        border-top-width: 0;
        border-left-width: 0;
        border-style: solid;
        border-color: #488aff;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    .radio-ios.radio-disabled,
    .item-ios.item-radio-disabled ion-label {
        opacity: 0.3;
        pointer-events: none;
    }

.item-ios .radio-ios {
    position: static;
    display: block;
    margin: 8px 11px 8px 8px;
}

    .item-ios .radio-ios[item-left], .item-ios .radio-ios[item-start] {
        margin: 8px 21px 8px 3px;
    }

.item-radio.item-ios ion-label {
    margin-left: 0;
}

.item-radio-checked.item-ios ion-label {
    color: #488aff;
}

.item-radio-ios-primary.item-radio-checked ion-label {
    color: #488aff;
}

.radio-ios-primary .radio-checked {
    color: #488aff;
}

    .radio-ios-primary .radio-checked .radio-inner {
        border-color: #488aff;
    }

.item-radio-ios-secondary.item-radio-checked ion-label {
    color: #32db64;
}

.radio-ios-secondary .radio-checked {
    color: #32db64;
}

    .radio-ios-secondary .radio-checked .radio-inner {
        border-color: #32db64;
    }

.item-radio-ios-danger.item-radio-checked ion-label {
    color: #f53d3d;
}

.radio-ios-danger .radio-checked {
    color: #f53d3d;
}

    .radio-ios-danger .radio-checked .radio-inner {
        border-color: #f53d3d;
    }

.item-radio-ios-light.item-radio-checked ion-label {
    color: #f4f4f4;
}

.radio-ios-light .radio-checked {
    color: #f4f4f4;
}

    .radio-ios-light .radio-checked .radio-inner {
        border-color: #f4f4f4;
    }

.item-radio-ios-dark.item-radio-checked ion-label {
    color: #222;
}

.radio-ios-dark .radio-checked {
    color: #222;
}

    .radio-ios-dark .radio-checked .radio-inner {
        border-color: #222;
    }

.radio-md {
    position: relative;
    display: inline-block;
}

    .radio-md .radio-icon {
        left: 0;
        top: 0;
        margin: 0;
        border-radius: 50%;
        position: relative;
        display: block;
        width: 16px;
        height: 16px;
        border-width: 2px;
        border-style: solid;
        border-color: #787878;
    }

    .radio-md .radio-inner {
        left: 2px;
        top: 2px;
        border-radius: 50%;
        position: absolute;
        width: 8px;
        height: 8px;
        background-color: #488aff;
        -webkit-transform: scale3d(0, 0, 0);
        transform: scale3d(0, 0, 0);
        -webkit-transition: -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
        transition: -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
        transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
        transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
    }

    .radio-md .radio-checked {
        border-color: #488aff;
    }

        .radio-md .radio-checked .radio-inner {
            -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
        }

    .radio-md.radio-disabled,
    .item-md.item-radio-disabled ion-label {
        opacity: 0.3;
        pointer-events: none;
    }

.item-md .radio-md {
    position: static;
    display: block;
    margin: 9px 10px 9px 0;
}

    .item-md .radio-md[item-left], .item-md .radio-md[item-start] {
        margin: 11px 36px 10px 4px;
    }

.item-radio.item-md ion-label {
    margin-left: 0;
}

.item-radio-checked.item-md ion-label {
    color: #488aff;
}

.item-radio-md-primary.item-radio-checked ion-label {
    color: #488aff;
}

.radio-md-primary .radio-checked {
    border-color: #488aff;
}

.radio-md-primary .radio-inner {
    background-color: #488aff;
}

.item-radio-md-secondary.item-radio-checked ion-label {
    color: #32db64;
}

.radio-md-secondary .radio-checked {
    border-color: #32db64;
}

.radio-md-secondary .radio-inner {
    background-color: #32db64;
}

.item-radio-md-danger.item-radio-checked ion-label {
    color: #f53d3d;
}

.radio-md-danger .radio-checked {
    border-color: #f53d3d;
}

.radio-md-danger .radio-inner {
    background-color: #f53d3d;
}

.item-radio-md-light.item-radio-checked ion-label {
    color: #f4f4f4;
}

.radio-md-light .radio-checked {
    border-color: #f4f4f4;
}

.radio-md-light .radio-inner {
    background-color: #f4f4f4;
}

.item-radio-md-dark.item-radio-checked ion-label {
    color: #222;
}

.radio-md-dark .radio-checked {
    border-color: #222;
}

.radio-md-dark .radio-inner {
    background-color: #222;
}

.radio-wp {
    position: relative;
    display: inline-block;
}

    .radio-wp .radio-icon {
        left: 0;
        top: 0;
        margin: 0;
        border-radius: 50%;
        position: relative;
        display: block;
        width: 16px;
        height: 16px;
        border-width: 2px;
        border-style: solid;
        border-color: #333;
    }

    .radio-wp .radio-inner {
        left: 2px;
        top: 2px;
        border-radius: 50%;
        position: absolute;
        display: none;
        width: 8px;
        height: 8px;
        background-color: #333;
    }

    .radio-wp .radio-checked {
        border-color: #488aff;
    }

        .radio-wp .radio-checked .radio-inner {
            display: block;
        }

    .radio-wp.radio-disabled,
    .item-wp.item-radio-disabled ion-label {
        opacity: 0.3;
        pointer-events: none;
    }

.item-wp .radio-wp {
    position: static;
    display: block;
    -webkit-box-ordinal-group: 0;
    -webkit-order: -1;
    -ms-flex-order: -1;
    order: -1;
    margin: 9px 20px 9px 4px;
}

    .item-wp .radio-wp[item-right], .item-wp .radio-wp[item-end] {
        -webkit-box-ordinal-group: 1;
        -webkit-order: 0;
        -ms-flex-order: 0;
        order: 0;
        margin: 11px 10px 10px 0;
    }

.item-radio.item-wp ion-label {
    margin-left: 0;
}

.radio-wp-primary .radio-checked {
    border-color: #488aff;
}

.radio-wp-secondary .radio-checked {
    border-color: #32db64;
}

.radio-wp-danger .radio-checked {
    border-color: #f53d3d;
}

.radio-wp-light .radio-checked {
    border-color: #f4f4f4;
}

.radio-wp-dark .radio-checked {
    border-color: #222;
}

.item-range .item-inner {
    overflow: visible;
    width: 100%;
}

.item-range .input-wrapper {
    overflow: visible;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
}

.item-range ion-range {
    width: 100%;
}

    .item-range ion-range ion-label {
        -webkit-align-self: center;
        -ms-flex-item-align: center;
        align-self: center;
    }

ion-range {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

    ion-range ion-label {
        -webkit-box-flex: initial;
        -webkit-flex: initial;
        -ms-flex: initial;
        flex: initial;
    }

    ion-range ion-icon {
        min-height: 2.4rem;
        font-size: 2.4rem;
        line-height: 1;
    }

.range-slider {
    position: relative;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    cursor: pointer;
}

.range-ios {
    padding: 8px 16px;
}

    .range-ios [range-left] {
        margin: 0 20px 0 0;
    }

    .range-ios [range-right] {
        margin: 0 0 0 20px;
    }

    .range-ios.range-has-pin {
        padding-top: 20px;
    }

    .range-ios .range-slider {
        height: 42px;
    }

    .range-ios .range-bar {
        left: 0;
        top: 21px;
        border-radius: 1px;
        position: absolute;
        width: 100%;
        height: 1px;
        background: #bdbdbd;
        pointer-events: none;
    }

    .range-ios.range-pressed .range-bar-active {
        will-change: left, right;
    }

    .range-ios.range-pressed .range-knob-handle {
        will-change: left;
    }

    .range-ios .range-bar-active {
        bottom: 0;
        width: auto;
        background: #488aff;
    }

    .range-ios .range-knob-handle {
        left: 0;
        top: 21px;
        margin-left: -21px;
        margin-top: -21px;
        text-align: center;
        position: absolute;
        width: 42px;
        height: 42px;
    }

    .range-ios .range-knob {
        left: 7px;
        top: 7px;
        border-radius: 50%;
        position: absolute;
        width: 28px;
        height: 28px;
        background: #fff;
        -webkit-box-shadow: 0 3px 1px rgba(0, 0, 0, 0.1), 0 4px 8px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(0, 0, 0, 0.02);
        box-shadow: 0 3px 1px rgba(0, 0, 0, 0.1), 0 4px 8px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(0, 0, 0, 0.02);
        pointer-events: none;
    }

    .range-ios .range-tick {
        margin-left: -0.5px;
        border-radius: 0;
        position: absolute;
        top: 17.5px;
        width: 1px;
        height: 8px;
        background: #bdbdbd;
        pointer-events: none;
    }

    .range-ios .range-tick-active {
        background: #488aff;
    }

    .range-ios .range-pin {
        text-align: center;
        border-radius: 50px;
        -webkit-transform: translate3d(0, 28px, 0) scale(0.01);
        transform: translate3d(0, 28px, 0) scale(0.01);
        position: relative;
        top: -20px;
        display: inline-block;
        min-width: 28px;
        font-size: 12px;
        color: #000;
        background: transparent;
        -webkit-transition: -webkit-transform 120ms ease;
        transition: -webkit-transform 120ms ease;
        transition: transform 120ms ease;
        transition: transform 120ms ease, -webkit-transform 120ms ease;
        padding: 8px;
    }

    .range-ios .range-knob-pressed .range-pin {
        -webkit-transform: translate3d(0, 0, 0) scale(1);
        transform: translate3d(0, 0, 0) scale(1);
    }

    .range-ios.range-disabled {
        opacity: .5;
    }

.range-ios-primary .range-bar-active,
.range-ios-primary .range-tick-active {
    background: #488aff;
}

.range-ios-secondary .range-bar-active,
.range-ios-secondary .range-tick-active {
    background: #32db64;
}

.range-ios-danger .range-bar-active,
.range-ios-danger .range-tick-active {
    background: #f53d3d;
}

.range-ios-light .range-bar-active,
.range-ios-light .range-tick-active {
    background: #f4f4f4;
}

.range-ios-dark .range-bar-active,
.range-ios-dark .range-tick-active {
    background: #222;
}

.range-md {
    padding: 8px;
}

    .range-md [range-left] {
        margin: 0 12px 0 0;
    }

    .range-md [range-right] {
        margin: 0 0 0 12px;
    }

    .range-md.range-has-pin {
        padding-top: 28px;
    }

    .range-md .range-slider {
        height: 42px;
    }

    .range-md .range-bar {
        left: 0;
        top: 21px;
        position: absolute;
        width: 100%;
        height: 2px;
        background: #bdbdbd;
        pointer-events: none;
    }

    .range-md.range-pressed .range-bar-active {
        will-change: left, right;
    }

    .range-md.range-pressed .range-knob-handle {
        will-change: left;
    }

    .range-md .range-bar-active {
        bottom: 0;
        width: auto;
        background: #488aff;
    }

    .range-md .range-knob-handle {
        left: 0;
        top: 21px;
        margin-left: -21px;
        margin-top: -21px;
        text-align: center;
        position: absolute;
        width: 42px;
        height: 42px;
    }

    .range-md .range-knob {
        left: 12px;
        top: 13px;
        border-radius: 50%;
        position: absolute;
        z-index: 2;
        width: 18px;
        height: 18px;
        background: #488aff;
        -webkit-transform: scale(0.67);
        transform: scale(0.67);
        -webkit-transition-duration: 120ms;
        transition-duration: 120ms;
        -webkit-transition-property: background-color, border, -webkit-transform;
        transition-property: background-color, border, -webkit-transform;
        transition-property: transform, background-color, border;
        transition-property: transform, background-color, border, -webkit-transform;
        -webkit-transition-timing-function: ease;
        transition-timing-function: ease;
        pointer-events: none;
    }

    .range-md .range-tick {
        margin-left: -1px;
        border-radius: 50%;
        position: absolute;
        top: 21px;
        z-index: 1;
        width: 2px;
        height: 2px;
        background: #000;
        pointer-events: none;
    }

    .range-md .range-tick-active {
        background: #000;
    }

    .range-md .range-pin {
        padding: 8px 0;
        text-align: center;
        border-radius: 50%;
        -webkit-transform: translate3d(0, 28px, 0) scale(0.01);
        transform: translate3d(0, 28px, 0) scale(0.01);
        position: relative;
        top: -20px;
        display: inline-block;
        min-width: 28px;
        height: 28px;
        font-size: 12px;
        color: #fff;
        background: #488aff;
        -webkit-transition: background-color 120ms ease, -webkit-transform 120ms ease;
        transition: background-color 120ms ease, -webkit-transform 120ms ease;
        transition: transform 120ms ease, background-color 120ms ease;
        transition: transform 120ms ease, background-color 120ms ease, -webkit-transform 120ms ease;
    }

        .range-md .range-pin::before {
            left: 50%;
            top: 3px;
            border-top-left-radius: 50%;
            border-top-right-radius: 50%;
            border-bottom-right-radius: 50%;
            border-bottom-left-radius: 0;
            margin-left: -13px;
            position: absolute;
            z-index: -1;
            width: 26px;
            height: 26px;
            background: #488aff;
            content: "";
            -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
            -webkit-transition: background-color 120ms ease;
            transition: background-color 120ms ease;
        }

    .range-md .range-knob-pressed .range-pin {
        -webkit-transform: translate3d(0, 0, 0) scale(1);
        transform: translate3d(0, 0, 0) scale(1);
    }

    .range-md:not(.range-has-pin) .range-knob-pressed .range-knob {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    .range-md .range-knob-min.range-knob-min .range-knob {
        border: 2px solid #bdbdbd;
        background: #fff;
    }

    .range-md .range-knob-min.range-knob-min .range-pin,
    .range-md .range-knob-min.range-knob-min .range-pin::before {
        color: #fff;
        background: #bdbdbd;
    }

    .range-md.range-disabled .range-bar-active {
        background-color: #bdbdbd;
    }

    .range-md.range-disabled .range-knob {
        outline: 5px solid #fff;
        background-color: #bdbdbd;
        -webkit-transform: scale(0.55);
        transform: scale(0.55);
    }

.range-md-primary .range-md .range-knob-min.range-knob-min .range-knob {
    border: 2px solid #bdbdbd;
    background: #fff;
}

.range-md-primary .range-md .range-knob-min.range-knob-min .range-pin,
.range-md-primary .range-md .range-knob-min.range-knob-min .range-pin::before {
    color: #fff;
    background: #bdbdbd;
}

.range-md-primary .range-bar-active,
.range-md-primary .range-knob,
.range-md-primary .range-pin,
.range-md-primary .range-pin::before {
    background: #488aff;
}

.range-md-secondary .range-md .range-knob-min.range-knob-min .range-knob {
    border: 2px solid #bdbdbd;
    background: #fff;
}

.range-md-secondary .range-md .range-knob-min.range-knob-min .range-pin,
.range-md-secondary .range-md .range-knob-min.range-knob-min .range-pin::before {
    color: #fff;
    background: #bdbdbd;
}

.range-md-secondary .range-bar-active,
.range-md-secondary .range-knob,
.range-md-secondary .range-pin,
.range-md-secondary .range-pin::before {
    background: #32db64;
}

.range-md-danger .range-md .range-knob-min.range-knob-min .range-knob {
    border: 2px solid #bdbdbd;
    background: #fff;
}

.range-md-danger .range-md .range-knob-min.range-knob-min .range-pin,
.range-md-danger .range-md .range-knob-min.range-knob-min .range-pin::before {
    color: #fff;
    background: #bdbdbd;
}

.range-md-danger .range-bar-active,
.range-md-danger .range-knob,
.range-md-danger .range-pin,
.range-md-danger .range-pin::before {
    background: #f53d3d;
}

.range-md-light .range-md .range-knob-min.range-knob-min .range-knob {
    border: 2px solid #bdbdbd;
    background: #fff;
}

.range-md-light .range-md .range-knob-min.range-knob-min .range-pin,
.range-md-light .range-md .range-knob-min.range-knob-min .range-pin::before {
    color: #fff;
    background: #bdbdbd;
}

.range-md-light .range-bar-active,
.range-md-light .range-knob,
.range-md-light .range-pin,
.range-md-light .range-pin::before {
    background: #f4f4f4;
}

.range-md-dark .range-md .range-knob-min.range-knob-min .range-knob {
    border: 2px solid #bdbdbd;
    background: #fff;
}

.range-md-dark .range-md .range-knob-min.range-knob-min .range-pin,
.range-md-dark .range-md .range-knob-min.range-knob-min .range-pin::before {
    color: #fff;
    background: #bdbdbd;
}

.range-md-dark .range-bar-active,
.range-md-dark .range-knob,
.range-md-dark .range-pin,
.range-md-dark .range-pin::before {
    background: #222;
}

.range-wp {
    padding: 8px;
}

    .range-wp [range-left] {
        margin: 0 12px 0 0;
    }

    .range-wp [range-right] {
        margin: 0 0 0 12px;
    }

    .range-wp.range-has-pin {
        padding-top: 28px;
    }

    .range-wp .range-slider {
        height: 42px;
    }

    .range-wp .range-bar {
        left: 0;
        top: 21px;
        position: absolute;
        width: 100%;
        height: 2px;
        background: #bdbdbd;
        pointer-events: none;
    }

    .range-wp.range-pressed .range-bar-active {
        will-change: left, right;
    }

    .range-wp.range-pressed .range-knob-handle {
        will-change: left;
    }

    .range-wp .range-bar-active {
        bottom: 0;
        width: auto;
        background: #488aff;
    }

    .range-wp .range-knob-handle {
        left: 0;
        top: 21px;
        margin-left: -21px;
        margin-top: -21px;
        text-align: center;
        position: absolute;
        width: 42px;
        height: 42px;
    }

    .range-wp .range-knob {
        left: 17px;
        top: 10px;
        border-radius: 4px;
        position: absolute;
        width: 8px;
        height: 24px;
        background: #488aff;
        pointer-events: none;
    }

    .range-wp .range-tick {
        margin-left: -1px;
        border-radius: 4px;
        position: absolute;
        top: 19px;
        width: 2px;
        height: 6px;
        background: #bdbdbd;
        pointer-events: none;
    }

    .range-wp .range-tick-active {
        background: #488aff;
    }

    .range-wp .range-pin {
        text-align: center;
        border-radius: 50px;
        -webkit-transform: translate3d(0, 28px, 0) scale(0.01);
        transform: translate3d(0, 28px, 0) scale(0.01);
        position: relative;
        top: -24px;
        display: inline-block;
        min-width: 28px;
        font-size: 12px;
        color: #fff;
        background: #488aff;
        -webkit-transition: -webkit-transform 120ms ease;
        transition: -webkit-transform 120ms ease;
        transition: transform 120ms ease;
        transition: transform 120ms ease, -webkit-transform 120ms ease;
        padding: 8px;
    }

    .range-wp .range-knob-pressed .range-pin {
        -webkit-transform: translate3d(0, 0, 0) scale(1);
        transform: translate3d(0, 0, 0) scale(1);
    }

    .range-wp.range-disabled {
        opacity: .5;
    }

.range-wp-primary .range-bar-active,
.range-wp-primary .range-tick-active,
.range-wp-primary .range-knob,
.range-wp-primary .range-pin {
    background: #488aff;
}

.range-wp-secondary .range-bar-active,
.range-wp-secondary .range-tick-active,
.range-wp-secondary .range-knob,
.range-wp-secondary .range-pin {
    background: #32db64;
}

.range-wp-danger .range-bar-active,
.range-wp-danger .range-tick-active,
.range-wp-danger .range-knob,
.range-wp-danger .range-pin {
    background: #f53d3d;
}

.range-wp-light .range-bar-active,
.range-wp-light .range-tick-active,
.range-wp-light .range-knob,
.range-wp-light .range-pin {
    background: #f4f4f4;
}

.range-wp-dark .range-bar-active,
.range-wp-dark .range-tick-active,
.range-wp-dark .range-knob,
.range-wp-dark .range-pin {
    background: #222;
}

ion-refresher {
    left: 0;
    top: 0;
    position: absolute;
    z-index: 0;
    display: none;
    width: 100%;
    height: 60px;
}

    ion-refresher.refresher-active {
        display: block;
    }

.has-refresher > .scroll-content {
    margin-top: -1px;
    border-top: 1px solid #ddd;
    -webkit-transition: -webkit-transform 320ms cubic-bezier(0.36, 0.66, 0.04, 1);
    transition: -webkit-transform 320ms cubic-bezier(0.36, 0.66, 0.04, 1);
    transition: transform 320ms cubic-bezier(0.36, 0.66, 0.04, 1);
    transition: transform 320ms cubic-bezier(0.36, 0.66, 0.04, 1), -webkit-transform 320ms cubic-bezier(0.36, 0.66, 0.04, 1);
}

ion-refresher-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%;
}

.refresher-pulling,
.refresher-refreshing {
    display: none;
    width: 100%;
}

.refresher-pulling-icon,
.refresher-refreshing-icon {
    text-align: center;
    -webkit-transform-origin: center;
    transform-origin: center;
    font-size: 30px;
    color: #000;
    -webkit-transition: 200ms;
    transition: 200ms;
}

.refresher-pulling-text,
.refresher-refreshing-text {
    text-align: center;
    font-size: 16px;
    color: #000;
}

.refresher-refreshing .spinner-ios line,
.refresher-refreshing .spinner-ios-small line,
.refresher-refreshing .spinner-crescent circle {
    stroke: #000;
}

.refresher-refreshing .spinner-bubbles circle,
.refresher-refreshing .spinner-circles circle,
.refresher-refreshing .spinner-dots circle {
    fill: #000;
}

ion-refresher-content[state=pulling] .refresher-pulling {
    display: block;
}

ion-refresher-content[state=ready] .refresher-pulling {
    display: block;
}

ion-refresher-content[state=ready] .refresher-pulling-icon {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

ion-refresher-content[state=refreshing] .refresher-refreshing {
    display: block;
}

ion-refresher-content[state=cancelling] .refresher-pulling {
    display: block;
}

ion-refresher-content[state=cancelling] .refresher-pulling-icon {
    -webkit-transform: scale(0);
    transform: scale(0);
}

ion-refresher-content[state=completing] .refresher-refreshing {
    display: block;
}

ion-refresher-content[state=completing] .refresher-refreshing-icon {
    -webkit-transform: scale(0);
    transform: scale(0);
}

ion-scroll {
    position: relative;
    display: block;
}

    ion-scroll.scroll-x .scroll-content {
        overflow-x: auto;
    }

    ion-scroll.scroll-y .scroll-content {
        overflow-y: auto;
    }

    ion-scroll[center] .scroll-content {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    ion-scroll .scroll-content {
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        position: absolute;
        overflow-y: hidden;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        will-change: scroll-position;
    }

ion-searchbar {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
}

.searchbar-icon {
    pointer-events: none;
}

.searchbar-input-container {
    position: relative;
    display: block;
    -webkit-flex-shrink: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1;
    width: 100%;
}

.searchbar-input {
    -moz-appearance: none;
    -ms-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    display: block;
    width: 100%;
    border: 0;
    font-family: inherit;
}

.searchbar-clear-icon {
    margin: 0;
    padding: 0;
    display: none;
    min-height: 0;
}

.searchbar-has-value.searchbar-has-focus .searchbar-clear-icon {
    display: block;
}

.searchbar-ios {
    padding: 0 8px;
    min-height: 44px;
    border-top: 0.55px solid transparent;
    border-bottom: 0.55px solid rgba(0, 0, 0, 0.05);
    background: rgba(0, 0, 0, 0.2);
}

    .searchbar-ios .searchbar-search-icon {
        left: 9px;
        top: 9px;
        background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2013%2013'><path%20fill='rgba(0,%200,%200,%200.5)'%20d='M5,1c2.2,0,4,1.8,4,4S7.2,9,5,9S1,7.2,1,5S2.8,1,5,1%20M5,0C2.2,0,0,2.2,0,5s2.2,5,5,5s5-2.2,5-5S7.8,0,5,0%20L5,0z'/><line%20stroke='rgba(0,%200,%200,%200.5)'%20stroke-miterlimit='10'%20x1='12.6'%20y1='12.6'%20x2='8.2'%20y2='8.2'/></svg>");
        margin-left: calc(50% - 60px);
        position: absolute;
        width: 14px;
        height: 14px;
        background-repeat: no-repeat;
        background-size: 13px;
    }

    .searchbar-ios .searchbar-input {
        padding: 0 28px;
        border-radius: 5px;
        height: 3rem;
        font-size: 1.4rem;
        font-weight: 400;
        color: #000;
        background-color: #fff;
    }

        .searchbar-ios .searchbar-input::-moz-placeholder {
            color: rgba(0, 0, 0, 0.5);
        }

        .searchbar-ios .searchbar-input:-ms-input-placeholder {
            color: rgba(0, 0, 0, 0.5);
        }

        .searchbar-ios .searchbar-input::-webkit-input-placeholder {
            text-indent: 0;
            color: rgba(0, 0, 0, 0.5);
        }

    .searchbar-ios .searchbar-clear-icon {
        right: 0;
        top: 0;
        background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(0,%200,%200,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
        background-position: center;
        position: absolute;
        width: 30px;
        height: 100%;
        background-repeat: no-repeat;
        background-size: 18px;
    }

    .searchbar-ios .searchbar-ios-cancel {
        padding: 0 0 0 8px;
        margin-left: 0;
        display: none;
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        height: 30px;
        cursor: pointer;
    }

    .searchbar-ios.searchbar-left-aligned .searchbar-search-icon {
        margin-left: 0;
    }

    .searchbar-ios.searchbar-left-aligned .searchbar-input {
        padding-left: 30px;
    }

    .searchbar-ios.searchbar-show-cancel.searchbar-has-focus .searchbar-ios-cancel {
        display: block;
    }

.toolbar .searchbar-ios {
    border-bottom-width: 0;
    background: transparent;
}

    .toolbar .searchbar-ios .searchbar-input {
        background: rgba(0, 0, 0, 0.08);
    }

    .toolbar .searchbar-ios .searchbar-ios-cancel {
        padding: 0;
    }

    .toolbar .searchbar-ios.searchbar-has-focus .searchbar-ios-cancel {
        padding-left: 8px;
    }

.searchbar-ios .searchbar-md-cancel {
    display: none;
}

.searchbar-ios-primary .searchbar-ios-cancel {
    color: #488aff;
}

    .searchbar-ios-primary .searchbar-ios-cancel:hover:not(.disable-hover) {
        color: #427feb;
    }

.toolbar-ios-primary .searchbar-ios .searchbar-search-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2013%2013'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M5,1c2.2,0,4,1.8,4,4S7.2,9,5,9S1,7.2,1,5S2.8,1,5,1%20M5,0C2.2,0,0,2.2,0,5s2.2,5,5,5s5-2.2,5-5S7.8,0,5,0%20L5,0z'/><line%20stroke='rgba(255,%20255,%20255,%200.5)'%20stroke-miterlimit='10'%20x1='12.6'%20y1='12.6'%20x2='8.2'%20y2='8.2'/></svg>");
}

.toolbar-ios-primary .searchbar-ios .searchbar-input {
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
}

    .toolbar-ios-primary .searchbar-ios .searchbar-input::-moz-placeholder {
        color: rgba(255, 255, 255, 0.5);
    }

    .toolbar-ios-primary .searchbar-ios .searchbar-input:-ms-input-placeholder {
        color: rgba(255, 255, 255, 0.5);
    }

    .toolbar-ios-primary .searchbar-ios .searchbar-input::-webkit-input-placeholder {
        text-indent: 0;
        color: rgba(255, 255, 255, 0.5);
    }

.toolbar-ios-primary .searchbar-ios .searchbar-clear-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
}

.toolbar-ios-primary .searchbar-ios .searchbar-ios-cancel {
    color: #fff;
}

.searchbar-ios-secondary .searchbar-ios-cancel {
    color: #32db64;
}

    .searchbar-ios-secondary .searchbar-ios-cancel:hover:not(.disable-hover) {
        color: #2ec95c;
    }

.toolbar-ios-secondary .searchbar-ios .searchbar-search-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2013%2013'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M5,1c2.2,0,4,1.8,4,4S7.2,9,5,9S1,7.2,1,5S2.8,1,5,1%20M5,0C2.2,0,0,2.2,0,5s2.2,5,5,5s5-2.2,5-5S7.8,0,5,0%20L5,0z'/><line%20stroke='rgba(255,%20255,%20255,%200.5)'%20stroke-miterlimit='10'%20x1='12.6'%20y1='12.6'%20x2='8.2'%20y2='8.2'/></svg>");
}

.toolbar-ios-secondary .searchbar-ios .searchbar-input {
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
}

    .toolbar-ios-secondary .searchbar-ios .searchbar-input::-moz-placeholder {
        color: rgba(255, 255, 255, 0.5);
    }

    .toolbar-ios-secondary .searchbar-ios .searchbar-input:-ms-input-placeholder {
        color: rgba(255, 255, 255, 0.5);
    }

    .toolbar-ios-secondary .searchbar-ios .searchbar-input::-webkit-input-placeholder {
        text-indent: 0;
        color: rgba(255, 255, 255, 0.5);
    }

.toolbar-ios-secondary .searchbar-ios .searchbar-clear-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
}

.toolbar-ios-secondary .searchbar-ios .searchbar-ios-cancel {
    color: #fff;
}

.searchbar-ios-danger .searchbar-ios-cancel {
    color: #f53d3d;
}

    .searchbar-ios-danger .searchbar-ios-cancel:hover:not(.disable-hover) {
        color: #e13838;
    }

.toolbar-ios-danger .searchbar-ios .searchbar-search-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2013%2013'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M5,1c2.2,0,4,1.8,4,4S7.2,9,5,9S1,7.2,1,5S2.8,1,5,1%20M5,0C2.2,0,0,2.2,0,5s2.2,5,5,5s5-2.2,5-5S7.8,0,5,0%20L5,0z'/><line%20stroke='rgba(255,%20255,%20255,%200.5)'%20stroke-miterlimit='10'%20x1='12.6'%20y1='12.6'%20x2='8.2'%20y2='8.2'/></svg>");
}

.toolbar-ios-danger .searchbar-ios .searchbar-input {
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
}

    .toolbar-ios-danger .searchbar-ios .searchbar-input::-moz-placeholder {
        color: rgba(255, 255, 255, 0.5);
    }

    .toolbar-ios-danger .searchbar-ios .searchbar-input:-ms-input-placeholder {
        color: rgba(255, 255, 255, 0.5);
    }

    .toolbar-ios-danger .searchbar-ios .searchbar-input::-webkit-input-placeholder {
        text-indent: 0;
        color: rgba(255, 255, 255, 0.5);
    }

.toolbar-ios-danger .searchbar-ios .searchbar-clear-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
}

.toolbar-ios-danger .searchbar-ios .searchbar-ios-cancel {
    color: #fff;
}

.searchbar-ios-light .searchbar-ios-cancel {
    color: #f4f4f4;
}

    .searchbar-ios-light .searchbar-ios-cancel:hover:not(.disable-hover) {
        color: #e0e0e0;
    }

.toolbar-ios-light .searchbar-ios .searchbar-search-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2013%2013'><path%20fill='rgba(0,%200,%200,%200.5)'%20d='M5,1c2.2,0,4,1.8,4,4S7.2,9,5,9S1,7.2,1,5S2.8,1,5,1%20M5,0C2.2,0,0,2.2,0,5s2.2,5,5,5s5-2.2,5-5S7.8,0,5,0%20L5,0z'/><line%20stroke='rgba(0,%200,%200,%200.5)'%20stroke-miterlimit='10'%20x1='12.6'%20y1='12.6'%20x2='8.2'%20y2='8.2'/></svg>");
}

.toolbar-ios-light .searchbar-ios .searchbar-input {
    color: #000;
    background: rgba(0, 0, 0, 0.08);
}

    .toolbar-ios-light .searchbar-ios .searchbar-input::-moz-placeholder {
        color: rgba(0, 0, 0, 0.5);
    }

    .toolbar-ios-light .searchbar-ios .searchbar-input:-ms-input-placeholder {
        color: rgba(0, 0, 0, 0.5);
    }

    .toolbar-ios-light .searchbar-ios .searchbar-input::-webkit-input-placeholder {
        text-indent: 0;
        color: rgba(0, 0, 0, 0.5);
    }

.toolbar-ios-light .searchbar-ios .searchbar-clear-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(0,%200,%200,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
}

.toolbar-ios-light .searchbar-ios .searchbar-ios-cancel {
    color: #488aff;
}

.searchbar-ios-dark .searchbar-ios-cancel {
    color: #222;
}

    .searchbar-ios-dark .searchbar-ios-cancel:hover:not(.disable-hover) {
        color: #343434;
    }

.toolbar-ios-dark .searchbar-ios .searchbar-search-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2013%2013'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M5,1c2.2,0,4,1.8,4,4S7.2,9,5,9S1,7.2,1,5S2.8,1,5,1%20M5,0C2.2,0,0,2.2,0,5s2.2,5,5,5s5-2.2,5-5S7.8,0,5,0%20L5,0z'/><line%20stroke='rgba(255,%20255,%20255,%200.5)'%20stroke-miterlimit='10'%20x1='12.6'%20y1='12.6'%20x2='8.2'%20y2='8.2'/></svg>");
}

.toolbar-ios-dark .searchbar-ios .searchbar-input {
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
}

    .toolbar-ios-dark .searchbar-ios .searchbar-input::-moz-placeholder {
        color: rgba(255, 255, 255, 0.5);
    }

    .toolbar-ios-dark .searchbar-ios .searchbar-input:-ms-input-placeholder {
        color: rgba(255, 255, 255, 0.5);
    }

    .toolbar-ios-dark .searchbar-ios .searchbar-input::-webkit-input-placeholder {
        text-indent: 0;
        color: rgba(255, 255, 255, 0.5);
    }

.toolbar-ios-dark .searchbar-ios .searchbar-clear-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
}

.toolbar-ios-dark .searchbar-ios .searchbar-ios-cancel {
    color: #fff;
}

.searchbar-ios.searchbar-animated.searchbar-show-cancel .searchbar-ios-cancel {
    display: block;
}

.searchbar-ios.searchbar-animated .searchbar-search-icon,
.searchbar-ios.searchbar-animated .searchbar-input {
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
}

.searchbar-animated.searchbar-has-focus .searchbar-ios-cancel {
    opacity: 1;
    pointer-events: auto;
}

.searchbar-animated .searchbar-ios-cancel {
    margin-right: -100%;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 0;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
    pointer-events: none;
}

.searchbar-md {
    background: inherit;
    padding: 8px;
}

    .searchbar-md .searchbar-search-icon {
        left: 16px;
        top: 11px;
        background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='%235b5b5b'%20d='M337.509,305.372h-17.501l-6.571-5.486c20.791-25.232,33.922-57.054,33.922-93.257C347.358,127.632,283.896,64,205.135,64C127.452,64,64,127.632,64,206.629s63.452,142.628,142.225,142.628c35.011,0,67.831-13.167,92.991-34.008l6.561,5.487v17.551L415.18,448L448,415.086L337.509,305.372z%20M206.225,305.372c-54.702,0-98.463-43.887-98.463-98.743c0-54.858,43.761-98.742,98.463-98.742c54.7,0,98.462,43.884,98.462,98.742C304.687,261.485,260.925,305.372,206.225,305.372z'/></svg>");
        width: 21px;
        height: 21px;
    }

    .searchbar-md .searchbar-md-cancel {
        left: 10px;
        top: 0;
        margin: 0;
        display: none;
        width: 21px;
        height: 100%;
    }

    .searchbar-md .searchbar-search-icon,
    .searchbar-md .searchbar-md-cancel {
        position: absolute;
        background-repeat: no-repeat;
        background-size: 20px;
    }

        .searchbar-md .searchbar-search-icon.activated,
        .searchbar-md .searchbar-md-cancel.activated {
            background-color: transparent;
        }

    .searchbar-md .searchbar-input {
        padding: 6px 55px;
        border-radius: 2px;
        background-position: left 8px center;
        height: auto;
        font-size: 1.6rem;
        font-weight: 400;
        line-height: 3rem;
        color: #141414;
        background-color: #fff;
        -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
    }

        .searchbar-md .searchbar-input::-moz-placeholder {
            color: #aeaeae;
        }

        .searchbar-md .searchbar-input:-ms-input-placeholder {
            color: #aeaeae;
        }

        .searchbar-md .searchbar-input::-webkit-input-placeholder {
            text-indent: 0;
            color: #aeaeae;
        }

    .searchbar-md .searchbar-clear-icon {
        right: 13px;
        top: 0;
        background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><polygon%20fill='%235b5b5b'%20points='405,136.798%20375.202,107%20256,226.202%20136.798,107%20107,136.798%20226.202,256%20107,375.202%20136.798,405%20256,285.798%20375.202,405%20405,375.202%20285.798,256'/></svg>");
        padding: 0;
        background-position: center;
        position: absolute;
        width: 22px;
        height: 100%;
        background-repeat: no-repeat;
        background-size: 22px;
    }

        .searchbar-md .searchbar-clear-icon.activated {
            background-color: transparent;
        }

    .searchbar-md.searchbar-has-focus.searchbar-show-cancel .searchbar-search-icon {
        display: none;
    }

    .searchbar-md.searchbar-has-focus.searchbar-show-cancel .searchbar-md-cancel {
        display: -webkit-inline-box;
        display: -webkit-inline-flex;
        display: -ms-inline-flexbox;
        display: inline-flex;
    }

.toolbar .searchbar-md {
    padding: 3px;
}

    .toolbar .searchbar-md .searchbar-md-cancel {
        left: 14px;
    }

.searchbar-md .searchbar-ios-cancel {
    display: none;
}

.searchbar-wp {
    background: transparent;
    padding: 8px;
}

    .searchbar-wp .searchbar-input-container {
        border: 2px solid rgba(0, 0, 0, 0.5);
    }

    .searchbar-wp .searchbar-search-icon {
        right: 8px;
        top: 5px;
        background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='%23858585'%20d='M337.509,305.372h-17.501l-6.571-5.486c20.791-25.232,33.922-57.054,33.922-93.257C347.358,127.632,283.896,64,205.135,64C127.452,64,64,127.632,64,206.629s63.452,142.628,142.225,142.628c35.011,0,67.831-13.167,92.991-34.008l6.561,5.487v17.551L415.18,448L448,415.086L337.509,305.372z%20M206.225,305.372c-54.702,0-98.463-43.887-98.463-98.743c0-54.858,43.761-98.742,98.463-98.742c54.7,0,98.462,43.884,98.462,98.742C304.687,261.485,260.925,305.372,206.225,305.372z'/></svg>");
        position: absolute;
        width: 21px;
        height: 21px;
        background-repeat: no-repeat;
        background-size: 20px;
    }

        .searchbar-wp .searchbar-search-icon.activated {
            background-color: transparent;
        }

    .searchbar-wp .searchbar-input {
        padding: 0 8px;
        border-radius: 0;
        background-position: left 8px center;
        height: auto;
        font-size: 1.4rem;
        font-weight: 400;
        line-height: 3rem;
        color: #141414;
        background-color: #fff;
    }

        .searchbar-wp .searchbar-input::-moz-placeholder {
            color: #858585;
        }

        .searchbar-wp .searchbar-input:-ms-input-placeholder {
            color: #858585;
        }

        .searchbar-wp .searchbar-input::-webkit-input-placeholder {
            text-indent: 0;
            color: #858585;
        }

    .searchbar-wp .searchbar-clear-icon {
        right: 8px;
        top: 0;
        background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><polygon%20fill='%23858585'%20points='405,136.798%20375.202,107%20256,226.202%20136.798,107%20107,136.798%20226.202,256%20107,375.202%20136.798,405%20256,285.798%20375.202,405%20405,375.202%20285.798,256'/></svg>");
        padding: 0;
        background-position: center;
        position: absolute;
        width: 22px;
        height: 100%;
        background-repeat: no-repeat;
        background-size: 22px;
    }

        .searchbar-wp .searchbar-clear-icon.activated {
            background-color: transparent;
        }

    .searchbar-wp.searchbar-has-focus .searchbar-input-container {
        border-color: #488aff;
    }

    .searchbar-wp.searchbar-has-value .searchbar-search-icon {
        display: none;
    }

    .searchbar-wp .searchbar-ios-cancel {
        display: none;
    }

    .searchbar-wp .searchbar-md-cancel {
        display: none;
    }

.toolbar .searchbar-wp {
    padding: 2px;
}

.searchbar-wp-primary.searchbar-has-focus .searchbar-input-container {
    border-color: #488aff;
}

.searchbar-wp-secondary.searchbar-has-focus .searchbar-input-container {
    border-color: #32db64;
}

.searchbar-wp-danger.searchbar-has-focus .searchbar-input-container {
    border-color: #f53d3d;
}

.searchbar-wp-light.searchbar-has-focus .searchbar-input-container {
    border-color: #f4f4f4;
}

.searchbar-wp-dark.searchbar-has-focus .searchbar-input-container {
    border-color: #222;
}

ion-segment {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
}

.segment-button {
    margin-left: 0;
    margin-right: 0;
    text-align: center;
    position: relative;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}

.segment-ios .segment-button {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 0;
    height: 3.2rem;
    border-width: 1px;
    border-style: solid;
    border-color: #488aff;
    font-size: 1.3rem;
    line-height: 3rem;
    color: #488aff;
    background-color: transparent;
}

    .segment-ios .segment-button ion-icon {
        font-size: 2.6rem;
        line-height: 2.8rem;
    }

    .segment-ios .segment-button.segment-activated {
        color: #fff;
        background-color: #488aff;
        opacity: 1;
        -webkit-transition: 100ms all linear;
        transition: 100ms all linear;
    }

    .segment-ios .segment-button:hover:not(.segment-activated) {
        background-color: rgba(72, 138, 255, 0.1);
        -webkit-transition: 100ms all linear;
        transition: 100ms all linear;
    }

    .segment-ios .segment-button:active:not(.segment-activated) {
        background-color: rgba(72, 138, 255, 0.16);
        -webkit-transition: 100ms all linear;
        transition: 100ms all linear;
    }

    .segment-ios .segment-button:first-of-type {
        border-top-left-radius: 4px;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 4px;
        margin-right: 0;
    }

    .segment-ios .segment-button:not(:first-of-type) {
        border-left-width: 0;
    }

    .segment-ios .segment-button:last-of-type {
        border-top-left-radius: 0;
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
        border-bottom-left-radius: 0;
        margin-left: 0;
        border-left-width: 0;
    }

[dir="rtl"] .segment-ios .segment-button:first-of-type {
    border-left-width: 0;
}

[dir="rtl"] .segment-ios .segment-button:last-of-type {
    border-left-width: 1px;
}

.segment-ios.segment-disabled {
    opacity: .4;
    pointer-events: none;
}

.segment-ios .segment-button-disabled {
    color: rgba(72, 138, 255, 0.3);
    pointer-events: none;
}

.toolbar-ios .segment-ios {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
}

.toolbar-ios .segment-button {
    max-width: 100px;
    height: 2.6rem;
    font-size: 1.2rem;
    line-height: 2.5rem;
}

    .toolbar-ios .segment-button ion-icon {
        font-size: 2.2rem;
        line-height: 2.4rem;
    }

.segment-ios-primary .segment-button {
    border-color: #488aff;
    color: #488aff;
}

    .segment-ios-primary .segment-button:hover:not(.segment-activated) {
        background-color: rgba(72, 138, 255, 0.1);
    }

    .segment-ios-primary .segment-button:active:not(.segment-activated) {
        background-color: rgba(72, 138, 255, 0.16);
    }

    .segment-ios-primary .segment-button.segment-activated {
        color: #fff;
        background-color: #488aff;
    }

.segment-ios-primary .segment-button-disabled {
    color: rgba(72, 138, 255, 0.3);
}

.toolbar-ios-primary .segment-ios .segment-button.segment-activated {
    color: #488aff;
}

.segment-ios-secondary .segment-button {
    border-color: #32db64;
    color: #32db64;
}

    .segment-ios-secondary .segment-button:hover:not(.segment-activated) {
        background-color: rgba(50, 219, 100, 0.1);
    }

    .segment-ios-secondary .segment-button:active:not(.segment-activated) {
        background-color: rgba(50, 219, 100, 0.16);
    }

    .segment-ios-secondary .segment-button.segment-activated {
        color: #fff;
        background-color: #32db64;
    }

.segment-ios-secondary .segment-button-disabled {
    color: rgba(50, 219, 100, 0.3);
}

.toolbar-ios-secondary .segment-ios .segment-button.segment-activated {
    color: #32db64;
}

.segment-ios-danger .segment-button {
    border-color: #f53d3d;
    color: #f53d3d;
}

    .segment-ios-danger .segment-button:hover:not(.segment-activated) {
        background-color: rgba(245, 61, 61, 0.1);
    }

    .segment-ios-danger .segment-button:active:not(.segment-activated) {
        background-color: rgba(245, 61, 61, 0.16);
    }

    .segment-ios-danger .segment-button.segment-activated {
        color: #fff;
        background-color: #f53d3d;
    }

.segment-ios-danger .segment-button-disabled {
    color: rgba(245, 61, 61, 0.3);
}

.toolbar-ios-danger .segment-ios .segment-button.segment-activated {
    color: #f53d3d;
}

.segment-ios-light .segment-button {
    border-color: #f4f4f4;
    color: #f4f4f4;
}

    .segment-ios-light .segment-button:hover:not(.segment-activated) {
        background-color: rgba(244, 244, 244, 0.1);
    }

    .segment-ios-light .segment-button:active:not(.segment-activated) {
        background-color: rgba(244, 244, 244, 0.16);
    }

    .segment-ios-light .segment-button.segment-activated {
        color: #000;
        background-color: #f4f4f4;
    }

.segment-ios-light .segment-button-disabled {
    color: rgba(244, 244, 244, 0.3);
}

.toolbar-ios-light .segment-ios .segment-button.segment-activated {
    color: #f4f4f4;
}

.segment-ios-dark .segment-button {
    border-color: #222;
    color: #222;
}

    .segment-ios-dark .segment-button:hover:not(.segment-activated) {
        background-color: rgba(34, 34, 34, 0.1);
    }

    .segment-ios-dark .segment-button:active:not(.segment-activated) {
        background-color: rgba(34, 34, 34, 0.16);
    }

    .segment-ios-dark .segment-button.segment-activated {
        color: #fff;
        background-color: #222;
    }

.segment-ios-dark .segment-button-disabled {
    color: rgba(34, 34, 34, 0.3);
}

.toolbar-ios-dark .segment-ios .segment-button.segment-activated {
    color: #222;
}

.segment-md .segment-button {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 0;
    height: 4.2rem;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: rgba(0, 0, 0, 0.1);
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 4rem;
    text-transform: uppercase;
    color: #488aff;
    background-color: transparent;
    opacity: 0.7;
    -webkit-transition: 100ms all linear;
    transition: 100ms all linear;
    padding: 0 6px;
}

    .segment-md .segment-button ion-icon {
        font-size: 2.6rem;
        line-height: 4rem;
    }

    .segment-md .segment-button.activated, .segment-md .segment-button.segment-activated {
        border-color: #488aff;
        opacity: 1;
    }

.segment-md.segment-disabled,
.segment-md .segment-button-disabled {
    opacity: 0.3;
    pointer-events: none;
}

.toolbar .segment-md {
    margin: 0 auto;
}

    .toolbar .segment-md .segment-button.activated,
    .toolbar .segment-md .segment-button.segment-activated {
        opacity: 1;
    }

.segment-md-primary .segment-button {
    color: #488aff;
}

    .segment-md-primary .segment-button.activated, .segment-md-primary .segment-button.segment-activated {
        border-color: #488aff;
        color: #488aff;
        opacity: 1;
    }

.segment-md-secondary .segment-button {
    color: #32db64;
}

    .segment-md-secondary .segment-button.activated, .segment-md-secondary .segment-button.segment-activated {
        border-color: #32db64;
        color: #32db64;
        opacity: 1;
    }

.segment-md-danger .segment-button {
    color: #f53d3d;
}

    .segment-md-danger .segment-button.activated, .segment-md-danger .segment-button.segment-activated {
        border-color: #f53d3d;
        color: #f53d3d;
        opacity: 1;
    }

.segment-md-light .segment-button {
    color: #f4f4f4;
}

    .segment-md-light .segment-button.activated, .segment-md-light .segment-button.segment-activated {
        border-color: #f4f4f4;
        color: #f4f4f4;
        opacity: 1;
    }

.segment-md-dark .segment-button {
    color: #222;
}

    .segment-md-dark .segment-button.activated, .segment-md-dark .segment-button.segment-activated {
        border-color: #222;
        color: #222;
        opacity: 1;
    }

.segment-wp {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

    .segment-wp .segment-button {
        height: 4rem;
        font-size: 1.3rem;
        font-weight: bold;
        line-height: 4rem;
        text-transform: uppercase;
        color: #000;
        background-color: transparent;
        opacity: 0.5;
        padding: 0 6px;
    }

        .segment-wp .segment-button.segment-activated {
            opacity: 1;
        }

        .segment-wp .segment-button ion-icon {
            font-size: 2.6rem;
            line-height: 4rem;
        }

    .segment-wp.segment-disabled,
    .segment-wp .segment-button-disabled {
        opacity: 0.3;
        pointer-events: none;
    }

.toolbar .segment-wp {
    margin: 0 auto;
}

.segment-wp-primary .segment-button {
    color: #488aff;
}

    .segment-wp-primary .segment-button.activated, .segment-wp-primary .segment-button.segment-activated {
        border-color: #488aff;
        color: #488aff;
        opacity: 1;
    }

.segment-wp-secondary .segment-button {
    color: #32db64;
}

    .segment-wp-secondary .segment-button.activated, .segment-wp-secondary .segment-button.segment-activated {
        border-color: #32db64;
        color: #32db64;
        opacity: 1;
    }

.segment-wp-danger .segment-button {
    color: #f53d3d;
}

    .segment-wp-danger .segment-button.activated, .segment-wp-danger .segment-button.segment-activated {
        border-color: #f53d3d;
        color: #f53d3d;
        opacity: 1;
    }

.segment-wp-light .segment-button {
    color: #f4f4f4;
}

    .segment-wp-light .segment-button.activated, .segment-wp-light .segment-button.segment-activated {
        border-color: #f4f4f4;
        color: #f4f4f4;
        opacity: 1;
    }

.segment-wp-dark .segment-button {
    color: #222;
}

    .segment-wp-dark .segment-button.activated, .segment-wp-dark .segment-button.segment-activated {
        border-color: #222;
        color: #222;
        opacity: 1;
    }

ion-select {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    max-width: 45%;
}

.select-text {
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 16px;
    font-size: inherit;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.item-multiple-inputs ion-select {
    position: relative;
}

.select-disabled,
.item-select-disabled ion-label {
    opacity: .4;
    pointer-events: none;
}

.select-popover ion-list {
    margin: -1px 0;
}

.select-ios {
    padding: 11px 8px 11px 16px;
}

    .select-ios .select-placeholder {
        color: #999;
    }

    .select-ios .select-icon {
        position: relative;
        width: 12px;
        height: 18px;
    }

        .select-ios .select-icon .select-icon-inner {
            left: 5px;
            top: 50%;
            margin-top: -2px;
            position: absolute;
            width: 0;
            height: 0;
            border-top: 5px solid;
            border-right: 5px solid transparent;
            border-left: 5px solid transparent;
            color: #999;
            pointer-events: none;
        }

.select-md {
    padding: 13px 8px 13px 16px;
}

    .select-md .select-placeholder {
        color: #999;
    }

    .select-md .item-select ion-label {
        margin-left: 0;
    }

    .select-md .select-icon {
        position: relative;
        width: 12px;
        height: 19px;
    }

        .select-md .select-icon .select-icon-inner {
            left: 5px;
            top: 50%;
            margin-top: -3px;
            position: absolute;
            width: 0;
            height: 0;
            border-top: 5px solid;
            border-right: 5px solid transparent;
            border-left: 5px solid transparent;
            color: #999;
            pointer-events: none;
        }

.select-wp {
    margin: 13px 8px;
    padding: 0 8px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    max-width: 100%;
    border: 2px solid rgba(0, 0, 0, 0.5);
    line-height: 3rem;
}

    .select-wp .select-placeholder {
        color: rgba(0, 0, 0, 0.5);
    }

.item-wp.item-select ion-label {
    margin-left: 0;
}

.select-wp .select-icon {
    position: relative;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    width: 18px;
    height: 18px;
}

    .select-wp .select-icon .select-icon-inner {
        left: 5px;
        top: 3px;
        position: absolute;
        display: block;
        width: 9px;
        height: 9px;
        border-top: 2px solid rgba(0, 0, 0, 0.5);
        border-right: 2px solid rgba(0, 0, 0, 0.5);
        -webkit-transform: rotate(135deg);
        transform: rotate(135deg);
        pointer-events: none;
    }

.select-wp .select-text {
    min-height: 3rem;
}

.hidden-show-when {
    display: none !important;
}

.hidden-hide-when {
    display: none !important;
}

.swiper-container {
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.swiper-container-no-flexbox .swiper-slide {
    float: left;
}

.swiper-container-vertical > .swiper-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

.swiper-wrapper {
    padding: 0;
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.swiper-container-multirow > .swiper-wrapper {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.swiper-container-free-mode > .swiper-wrapper {
    margin: 0 auto;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.swiper-slide {
    text-align: center;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 18px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
    height: auto;
}

    .swiper-container-autoheight .swiper-wrapper {
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-transition-property: height, -webkit-transform;
        transition-property: height, -webkit-transform;
        transition-property: transform, height;
        transition-property: transform, height, -webkit-transform;
    }

.swiper-container .swiper-notification {
    left: 0;
    top: 0;
    position: absolute;
    z-index: -1000;
    opacity: 0;
    pointer-events: none;
}

.swiper-wp8-horizontal {
    -ms-touch-action: pan-y;
    touch-action: pan-y;
}

.swiper-wp8-vertical {
    -ms-touch-action: pan-x;
    touch-action: pan-x;
}

.swiper-button-prev,
.swiper-button-next {
    top: 50%;
    margin-top: -22px;
    background-position: center;
    position: absolute;
    z-index: 10;
    width: 27px;
    height: 44px;
    background-repeat: no-repeat;
    background-size: 27px 44px;
    cursor: pointer;
}

    .swiper-button-prev.swiper-button-disabled,
    .swiper-button-next.swiper-button-disabled {
        cursor: auto;
        opacity: .35;
        pointer-events: none;
    }

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
    left: 10px;
    right: auto;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
}

    .swiper-button-prev.swiper-button-black,
    .swiper-container-rtl .swiper-button-next.swiper-button-black {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
    }

    .swiper-button-prev.swiper-button-white,
    .swiper-container-rtl .swiper-button-next.swiper-button-white {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
    }

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
    left: auto;
    right: 10px;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
}

    .swiper-button-next.swiper-button-black,
    .swiper-container-rtl .swiper-button-prev.swiper-button-black {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
    }

    .swiper-button-next.swiper-button-white,
    .swiper-container-rtl .swiper-button-prev.swiper-button-white {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
    }

.swiper-pagination {
    text-align: center;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    position: absolute;
    z-index: 10;
    -webkit-transition: 300ms;
    transition: 300ms;
    pointer-events: none;
}

    .swiper-pagination.swiper-pagination-hidden {
        opacity: 0;
    }

.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-container-horizontal > .swiper-pagination-bullets {
    left: 0;
    bottom: 10px;
    width: 100%;
}

.swiper-pagination-bullet {
    border-radius: 100%;
    display: inline-block;
    width: 8px;
    height: 8px;
    background: #000;
    opacity: .2;
    pointer-events: auto;
}

button.swiper-pagination-bullet {
    margin: 0;
    padding: 0;
    -moz-appearance: none;
    -ms-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer;
}

.swiper-pagination-white .swiper-pagination-bullet {
    background: #fff;
}

.swiper-pagination-bullet-active {
    background: #488aff;
    opacity: 1;
}

.swiper-pagination-white .swiper-pagination-bullet-active {
    background: #fff;
}

.swiper-pagination-black .swiper-pagination-bullet-active {
    background: #000;
}

.swiper-container-vertical > .swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
}

    .swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
        margin: 5px 0;
        display: block;
    }

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 5px;
}

.swiper-pagination-progress {
    position: absolute;
    background: rgba(0, 0, 0, 0.25);
}

    .swiper-pagination-progress .swiper-pagination-progressbar {
        left: 0;
        top: 0;
        -webkit-transform-origin: left top;
        transform-origin: left top;
        position: absolute;
        width: 100%;
        height: 100%;
        background: #488aff;
        -webkit-transform: scale(0);
        transform: scale(0);
    }

.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
    -webkit-transform-origin: right top;
    transform-origin: right top;
}

.swiper-container-horizontal > .swiper-pagination-progress {
    left: 0;
    top: 0;
    width: 100%;
    height: 4px;
}

.swiper-container-vertical > .swiper-pagination-progress {
    left: 0;
    top: 0;
    width: 4px;
    height: 100%;
}

.swiper-pagination-progress.swiper-pagination-white {
    background: rgba(255, 255, 255, 0.5);
}

    .swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
        background: #fff;
    }

.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
    background: #000;
}

.swiper-container-3d {
    -webkit-perspective: 1200px;
    perspective: 1200px;
}

    .swiper-container-3d .swiper-wrapper,
    .swiper-container-3d .swiper-slide,
    .swiper-container-3d .swiper-slide-shadow-left,
    .swiper-container-3d .swiper-slide-shadow-right,
    .swiper-container-3d .swiper-slide-shadow-top,
    .swiper-container-3d .swiper-slide-shadow-bottom,
    .swiper-container-3d .swiper-cube-shadow {
        -webkit-transform-style: preserve-3d;
        transform-style: preserve-3d;
    }

    .swiper-container-3d .swiper-slide-shadow-left,
    .swiper-container-3d .swiper-slide-shadow-right,
    .swiper-container-3d .swiper-slide-shadow-top,
    .swiper-container-3d .swiper-slide-shadow-bottom {
        left: 0;
        top: 0;
        position: absolute;
        z-index: 10;
        width: 100%;
        height: 100%;
        pointer-events: none;
    }

    .swiper-container-3d .swiper-slide-shadow-left {
        background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
        background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
    }

    .swiper-container-3d .swiper-slide-shadow-right {
        background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
        background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
    }

    .swiper-container-3d .swiper-slide-shadow-top {
        background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
        background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
    }

    .swiper-container-3d .swiper-slide-shadow-bottom {
        background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
        background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
    }

.swiper-container-coverflow .swiper-wrapper,
.swiper-container-flip .swiper-wrapper {
    -webkit-perspective: 1200px;
    perspective: 1200px;
}

.swiper-container-cube,
.swiper-container-flip {
    overflow: visible;
}

    .swiper-container-cube .swiper-slide,
    .swiper-container-flip .swiper-slide {
        z-index: 1;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        pointer-events: none;
    }

        .swiper-container-cube .swiper-slide .swiper-slide,
        .swiper-container-flip .swiper-slide .swiper-slide {
            pointer-events: none;
        }

    .swiper-container-cube .swiper-slide-active,
    .swiper-container-flip .swiper-slide-active,
    .swiper-container-cube .swiper-slide-active .swiper-slide-active,
    .swiper-container-flip .swiper-slide-active .swiper-slide-active {
        pointer-events: auto;
    }

    .swiper-container-cube .swiper-slide-shadow-top,
    .swiper-container-flip .swiper-slide-shadow-top,
    .swiper-container-cube .swiper-slide-shadow-bottom,
    .swiper-container-flip .swiper-slide-shadow-bottom,
    .swiper-container-cube .swiper-slide-shadow-left,
    .swiper-container-flip .swiper-slide-shadow-left,
    .swiper-container-cube .swiper-slide-shadow-right,
    .swiper-container-flip .swiper-slide-shadow-right {
        z-index: 0;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    .swiper-container-cube .swiper-slide {
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        width: 100%;
        height: 100%;
        visibility: hidden;
    }

    .swiper-container-cube.swiper-container-rtl .swiper-slide {
        -webkit-transform-origin: 100% 0;
        transform-origin: 100% 0;
    }

    .swiper-container-cube .swiper-slide-active,
    .swiper-container-cube .swiper-slide-next,
    .swiper-container-cube .swiper-slide-prev,
    .swiper-container-cube .swiper-slide-next + .swiper-slide {
        visibility: visible;
        pointer-events: auto;
    }

    .swiper-container-cube .swiper-cube-shadow {
        left: 0;
        bottom: 0;
        position: absolute;
        z-index: 0;
        width: 100%;
        height: 100%;
        background: #000;
        opacity: .6;
        -webkit-filter: blur(50px);
        filter: blur(50px);
    }

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.swiper-container-fade .swiper-slide {
    -webkit-transition-property: opacity;
    transition-property: opacity;
    pointer-events: none;
}

    .swiper-container-fade .swiper-slide .swiper-slide {
        pointer-events: none;
    }

.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto;
}

.swiper-zoom-container {
    text-align: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

    .swiper-zoom-container > img,
    .swiper-zoom-container > svg,
    .swiper-zoom-container > canvas {
        max-width: 100%;
        max-height: 100%;
        -o-object-fit: contain;
        object-fit: contain;
    }

.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    background: rgba(0, 0, 0, 0.1);
    -ms-touch-action: none;
    touch-action: none;
}

.swiper-container-horizontal > .swiper-scrollbar {
    left: 1%;
    bottom: 3px;
    position: absolute;
    z-index: 50;
    width: 98%;
    height: 5px;
}

.swiper-container-vertical > .swiper-scrollbar {
    right: 3px;
    top: 1%;
    position: absolute;
    z-index: 50;
    width: 5px;
    height: 98%;
}

.swiper-scrollbar-drag {
    left: 0;
    top: 0;
    border-radius: 10px;
    position: relative;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
}

.swiper-scrollbar-cursor-drag {
    cursor: move;
}

.swiper-lazy-preloader {
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    position: absolute;
    z-index: 10;
    width: 42px;
    height: 42px;
    -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
    animation: swiper-preloader-spin 1s steps(12, end) infinite;
}

    .swiper-lazy-preloader::after {
        background-position: 50%;
        display: block;
        width: 100%;
        height: 100%;
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
        background-repeat: no-repeat;
        background-size: 100%;
        content: "";
    }

.swiper-lazy-preloader-white::after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}

@-webkit-keyframes swiper-preloader-spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes swiper-preloader-spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

ion-slides {
    display: block;
    width: 100%;
    height: 100%;
}

.slide-zoom {
    text-align: center;
    display: block;
    width: 100%;
}

.swiper-slide img {
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 100%;
}

ion-spinner {
    position: relative;
    display: inline-block;
    width: 28px;
    height: 28px;
}

    ion-spinner svg {
        left: 0;
        top: 0;
        position: absolute;
        width: 100%;
        height: 100%;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }

    ion-spinner.spinner-paused svg {
        -webkit-animation-play-state: paused;
        animation-play-state: paused;
    }

.spinner-ios line,
.spinner-ios-small line {
    stroke-width: 4px;
    stroke-linecap: round;
}

.spinner-ios svg,
.spinner-ios-small svg {
    -webkit-animation: spinner-fade-out 1s linear infinite;
    animation: spinner-fade-out 1s linear infinite;
}

.spinner-bubbles svg {
    -webkit-animation: spinner-scale-out 1s linear infinite;
    animation: spinner-scale-out 1s linear infinite;
}

.spinner-circles svg {
    -webkit-animation: spinner-fade-out 1s linear infinite;
    animation: spinner-fade-out 1s linear infinite;
}

.spinner-crescent circle {
    fill: transparent;
    stroke-width: 4px;
    stroke-dasharray: 128px;
    stroke-dashoffset: 82px;
}

.spinner-crescent svg {
    -webkit-animation: spinner-rotate 1s linear infinite;
    animation: spinner-rotate 1s linear infinite;
}

.spinner-dots circle {
    stroke-width: 0;
}

.spinner-dots svg {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-animation: spinner-dots 1s linear infinite;
    animation: spinner-dots 1s linear infinite;
}

@-webkit-keyframes spinner-fade-out {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes spinner-fade-out {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-webkit-keyframes spinner-scale-out {
    0% {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }

    100% {
        -webkit-transform: scale(0, 0);
        transform: scale(0, 0);
    }
}

@keyframes spinner-scale-out {
    0% {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }

    100% {
        -webkit-transform: scale(0, 0);
        transform: scale(0, 0);
    }
}

@-webkit-keyframes spinner-rotate {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spinner-rotate {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes spinner-dots {
    0% {
        opacity: .9;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }

    50% {
        opacity: .3;
        -webkit-transform: scale(0.4, 0.4);
        transform: scale(0.4, 0.4);
    }

    100% {
        opacity: .9;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
}

@keyframes spinner-dots {
    0% {
        opacity: .9;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }

    50% {
        opacity: .3;
        -webkit-transform: scale(0.4, 0.4);
        transform: scale(0.4, 0.4);
    }

    100% {
        opacity: .9;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
}

.spinner-ios-ios line,
.spinner-ios-ios-small line {
    stroke: #69717d;
}

.spinner-ios-bubbles circle {
    fill: #000;
}

.spinner-ios-circles circle {
    fill: #69717d;
}

.spinner-ios-crescent circle {
    stroke: #000;
}

.spinner-ios-dots circle {
    fill: #444;
}

.spinner-ios-primary.spinner-ios line,
.spinner-ios-primary.spinner-ios-small line,
.spinner-ios-primary.spinner-crescent circle {
    stroke: #488aff;
}

.spinner-ios-primary.spinner-bubbles circle,
.spinner-ios-primary.spinner-circles circle,
.spinner-ios-primary.spinner-dots circle {
    fill: #488aff;
}

.spinner-ios-secondary.spinner-ios line,
.spinner-ios-secondary.spinner-ios-small line,
.spinner-ios-secondary.spinner-crescent circle {
    stroke: #32db64;
}

.spinner-ios-secondary.spinner-bubbles circle,
.spinner-ios-secondary.spinner-circles circle,
.spinner-ios-secondary.spinner-dots circle {
    fill: #32db64;
}

.spinner-ios-danger.spinner-ios line,
.spinner-ios-danger.spinner-ios-small line,
.spinner-ios-danger.spinner-crescent circle {
    stroke: #f53d3d;
}

.spinner-ios-danger.spinner-bubbles circle,
.spinner-ios-danger.spinner-circles circle,
.spinner-ios-danger.spinner-dots circle {
    fill: #f53d3d;
}

.spinner-ios-light.spinner-ios line,
.spinner-ios-light.spinner-ios-small line,
.spinner-ios-light.spinner-crescent circle {
    stroke: #f4f4f4;
}

.spinner-ios-light.spinner-bubbles circle,
.spinner-ios-light.spinner-circles circle,
.spinner-ios-light.spinner-dots circle {
    fill: #f4f4f4;
}

.spinner-ios-dark.spinner-ios line,
.spinner-ios-dark.spinner-ios-small line,
.spinner-ios-dark.spinner-crescent circle {
    stroke: #222;
}

.spinner-ios-dark.spinner-bubbles circle,
.spinner-ios-dark.spinner-circles circle,
.spinner-ios-dark.spinner-dots circle {
    fill: #222;
}

.spinner-md-ios line,
.spinner-md-ios-small line {
    stroke: #69717d;
}

.spinner-md-bubbles circle {
    fill: #000;
}

.spinner-md-circles circle {
    fill: #69717d;
}

.spinner-md-crescent circle {
    stroke: #000;
}

.spinner-md-dots circle {
    fill: #444;
}

.spinner-md-primary.spinner-ios line,
.spinner-md-primary.spinner-ios-small line,
.spinner-md-primary.spinner-crescent circle {
    stroke: #488aff;
}

.spinner-md-primary.spinner-bubbles circle,
.spinner-md-primary.spinner-circles circle,
.spinner-md-primary.spinner-dots circle {
    fill: #488aff;
}

.spinner-md-secondary.spinner-ios line,
.spinner-md-secondary.spinner-ios-small line,
.spinner-md-secondary.spinner-crescent circle {
    stroke: #32db64;
}

.spinner-md-secondary.spinner-bubbles circle,
.spinner-md-secondary.spinner-circles circle,
.spinner-md-secondary.spinner-dots circle {
    fill: #32db64;
}

.spinner-md-danger.spinner-ios line,
.spinner-md-danger.spinner-ios-small line,
.spinner-md-danger.spinner-crescent circle {
    stroke: #f53d3d;
}

.spinner-md-danger.spinner-bubbles circle,
.spinner-md-danger.spinner-circles circle,
.spinner-md-danger.spinner-dots circle {
    fill: #f53d3d;
}

.spinner-md-light.spinner-ios line,
.spinner-md-light.spinner-ios-small line,
.spinner-md-light.spinner-crescent circle {
    stroke: #f4f4f4;
}

.spinner-md-light.spinner-bubbles circle,
.spinner-md-light.spinner-circles circle,
.spinner-md-light.spinner-dots circle {
    fill: #f4f4f4;
}

.spinner-md-dark.spinner-ios line,
.spinner-md-dark.spinner-ios-small line,
.spinner-md-dark.spinner-crescent circle {
    stroke: #222;
}

.spinner-md-dark.spinner-bubbles circle,
.spinner-md-dark.spinner-circles circle,
.spinner-md-dark.spinner-dots circle {
    fill: #222;
}

.spinner-wp-ios line,
.spinner-wp-ios-small line {
    stroke: #69717d;
}

.spinner-wp-bubbles circle {
    fill: #000;
}

.spinner-wp-circles circle {
    fill: #69717d;
}

.spinner-wp-crescent circle {
    stroke: #000;
}

.spinner-wp-dots circle {
    fill: #444;
}

.spinner-wp-primary.spinner-ios line,
.spinner-wp-primary.spinner-ios-small line,
.spinner-wp-primary.spinner-crescent circle {
    stroke: #488aff;
}

.spinner-wp-primary.spinner-bubbles circle,
.spinner-wp-primary.spinner-circles circle,
.spinner-wp-primary.spinner-dots circle {
    fill: #488aff;
}

.spinner-wp-secondary.spinner-ios line,
.spinner-wp-secondary.spinner-ios-small line,
.spinner-wp-secondary.spinner-crescent circle {
    stroke: #32db64;
}

.spinner-wp-secondary.spinner-bubbles circle,
.spinner-wp-secondary.spinner-circles circle,
.spinner-wp-secondary.spinner-dots circle {
    fill: #32db64;
}

.spinner-wp-danger.spinner-ios line,
.spinner-wp-danger.spinner-ios-small line,
.spinner-wp-danger.spinner-crescent circle {
    stroke: #f53d3d;
}

.spinner-wp-danger.spinner-bubbles circle,
.spinner-wp-danger.spinner-circles circle,
.spinner-wp-danger.spinner-dots circle {
    fill: #f53d3d;
}

.spinner-wp-light.spinner-ios line,
.spinner-wp-light.spinner-ios-small line,
.spinner-wp-light.spinner-crescent circle {
    stroke: #f4f4f4;
}

.spinner-wp-light.spinner-bubbles circle,
.spinner-wp-light.spinner-circles circle,
.spinner-wp-light.spinner-dots circle {
    fill: #f4f4f4;
}

.spinner-wp-dark.spinner-ios line,
.spinner-wp-dark.spinner-ios-small line,
.spinner-wp-dark.spinner-crescent circle {
    stroke: #222;
}

.spinner-wp-dark.spinner-bubbles circle,
.spinner-wp-dark.spinner-circles circle,
.spinner-wp-dark.spinner-dots circle {
    fill: #222;
}

.split-pane {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    contain: strict;
}

.split-pane-side:not(ion-menu) {
    display: none;
}

.split-pane-visible > .split-pane-side,
.split-pane-visible > .split-pane-main {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: relative;
    z-index: 0;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.split-pane-visible > .split-pane-side {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-ordinal-group: 0;
    -webkit-order: -1;
    -ms-flex-order: -1;
    order: -1;
}

.split-pane-visible > .split-pane-main,
.split-pane-visible > ion-nav.split-pane-side,
.split-pane-visible > ion-tabs.split-pane-side,
.split-pane-visible > ion-menu.menu-enabled {
    display: block;
}

.split-pane-visible > ion-split-pane.split-pane-side,
.split-pane-visible > ion-split-pane.split-pane-main {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.split-pane-visible > ion-menu.menu-enabled > .menu-inner {
    left: 0;
    right: 0;
    width: auto;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    -webkit-transform: none !important;
    transform: none !important;
}

.split-pane-visible > ion-menu.menu-enabled > .ion-backdrop {
    display: hidden !important;
}

.split-pane-visible > .split-pane-side[side=start] {
    -webkit-box-ordinal-group: 0;
    -webkit-order: -1;
    -ms-flex-order: -1;
    order: -1;
}

.split-pane-visible > .split-pane-side[side=end] {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
}

.split-pane-visible > .split-pane-side[side=left] {
    -webkit-box-ordinal-group: 0;
    -webkit-order: -1;
    -ms-flex-order: -1;
    order: -1;
}

.split-pane-visible > .split-pane-side[side=right] {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
}

.split-pane-ios.split-pane-visible > .split-pane-side {
    min-width: 270px;
    max-width: 28%;
    border-right: 0.55px solid #c8c7cc;
    border-left: 0;
}

    .split-pane-ios.split-pane-visible > .split-pane-side[side=right] {
        border-right: 0;
        border-left: 0.55px solid #c8c7cc;
    }

.split-pane-md.split-pane-visible > .split-pane-side {
    min-width: 270px;
    max-width: 28%;
    border-right: 1px solid #dedede;
    border-left: 0;
}

    .split-pane-md.split-pane-visible > .split-pane-side[side=right] {
        border-right: 0;
        border-left: 1px solid #dedede;
    }

.split-pane-wp.split-pane-visible > .split-pane-side {
    min-width: 270px;
    max-width: 28%;
    border-right: 1px solid transparent;
    border-left: 0;
}

    .split-pane-wp.split-pane-visible > .split-pane-side[side=right] {
        border-right: 0;
        border-left: 1px solid transparent;
    }

.tabbar {
    left: 0;
    bottom: 0;
    position: absolute;
    z-index: 10;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    opacity: 0;
}

.tabbar-hidden .tabbar {
    display: none;
}

.tabbar.show-tabbar {
    opacity: 1;
}

[tabsPlacement=top] > .tabbar {
    top: 0;
    bottom: auto;
}

.tab-button {
    margin: 0;
    text-align: center;
    border-radius: 0;
    position: relative;
    z-index: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 0;
    text-decoration: none;
    background: none;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.tab-disabled {
    pointer-events: none;
}

    .tab-disabled ion-badge,
    .tab-disabled ion-icon,
    .tab-disabled span {
        opacity: .4;
    }

.tab-button-text {
    margin-top: 3px;
    margin-bottom: 2px;
}

.tab-button-text,
.tab-button-icon {
    display: none;
    overflow: hidden;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    min-width: 26px;
    max-width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.has-icon .tab-button-icon,
.has-title .tab-button-text {
    display: block;
}

.has-title-only .tab-button-text {
    white-space: normal;
}

[tabsLayout=icon-bottom] .tab-button .tab-button-icon {
    -webkit-box-ordinal-group: 11;
    -webkit-order: 10;
    -ms-flex-order: 10;
    order: 10;
}

[tabsLayout=icon-left] .tab-button,
[tabsLayout=icon-right] .tab-button,
[tabsLayout=icon-start] .tab-button,
[tabsLayout=icon-end] .tab-button {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}

    [tabsLayout=icon-left] .tab-button .tab-button-icon,
    [tabsLayout=icon-start] .tab-button .tab-button-icon {
        padding-right: 8px;
        text-align: right;
        text-align: end;
    }

    [tabsLayout=icon-right] .tab-button .tab-button-icon,
    [tabsLayout=icon-end] .tab-button .tab-button-icon {
        padding-left: 8px;
        text-align: left;
        text-align: start;
        -webkit-box-ordinal-group: 11;
        -webkit-order: 10;
        -ms-flex-order: 10;
        order: 10;
    }

.tab-hidden,
.tab-highlight,
[tabsLayout=icon-hide] .tab-button-icon,
[tabsLayout=title-hide] .tab-button-text {
    display: none;
}

.tab-badge {
    right: 4%;
    top: 6%;
    right: calc(50% - 50px);
    padding: 1px 6px;
    position: absolute;
    height: auto;
    font-size: 12px;
    line-height: 16px;
}

.has-icon .tab-badge {
    right: calc(50% - 30px);
}

[tabsLayout=icon-bottom] .tab-badge,
[tabsLayout=icon-left] .tab-badge,
[tabsLayout=icon-right] .tab-badge,
[tabsLayout=icon-start] .tab-badge,
[tabsLayout=icon-end] .tab-badge {
    right: calc(50% - 50px);
}

.tabs-ios .tabbar {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-top: 0.55px solid rgba(0, 0, 0, 0.3);
    background: #f8f8f8;
}

.tabs-ios[tabsPlacement=top] .tabbar {
    border-top: 0;
    border-bottom: 0.55px solid rgba(0, 0, 0, 0.3);
}

.tabs-ios .tab-button {
    max-width: 240px;
    min-height: 49px;
    font-size: 10px;
    font-weight: 500;
    color: #8c8c8c;
    padding: 0 2px;
}

    .tabs-ios .tab-button:hover:not(.disable-hover),
    .tabs-ios .tab-button[aria-selected=true] {
        color: #488aff;
    }

        .tabs-ios .tab-button[aria-selected=true] .tab-button-icon {
            color: #488aff;
        }

.tabs-ios .tab-button-text {
    margin-top: 0;
    margin-bottom: 1px;
    min-height: 11px;
}

.tabs-ios .has-title-only .tab-button-text {
    font-size: 12px;
}

.tabs-ios .tab-button-icon {
    margin-top: 4px;
    margin-bottom: 1px;
    min-width: 35px;
    height: 30px;
    font-size: 30px;
    color: #8c8c8c;
}

    .tabs-ios .tab-button-icon::before {
        vertical-align: top;
    }

.tabs-ios[tabsLayout=icon-right] .tab-button .tab-button-text,
.tabs-ios[tabsLayout=icon-left] .tab-button .tab-button-text,
.tabs-ios[tabsLayout=icon-end] .tab-button .tab-button-text,
.tabs-ios[tabsLayout=icon-start] .tab-button .tab-button-text {
    font-size: 1.4rem;
    line-height: 1.1;
}

.tabs-ios[tabsLayout=icon-right] .tab-button ion-icon,
.tabs-ios[tabsLayout=icon-left] .tab-button ion-icon,
.tabs-ios[tabsLayout=icon-end] .tab-button ion-icon,
.tabs-ios[tabsLayout=icon-start] .tab-button ion-icon {
    min-width: 24px;
    height: 26px;
    font-size: 24px;
}

.tabs-ios[tabsLayout=icon-hide] .tab-button,
.tabs-ios .tab-button.has-title-only {
    min-height: 41px;
}

    .tabs-ios[tabsLayout=icon-hide] .tab-button .tab-button-text,
    .tabs-ios .tab-button.has-title-only .tab-button-text {
        margin: 2px 0;
        font-size: 1.4rem;
        line-height: 1.1;
    }

.tabs-ios[tabsLayout=title-hide] .tab-button,
.tabs-ios .tab-button.icon-only {
    min-height: 41px;
}

.tabs-ios-primary .tabbar {
    border-color: #1569ff;
    background-color: #488aff;
}

.tabs-ios-primary .tab-button,
.tabs-ios-primary .tab-button-icon,
.tabs-ios-primary .tab-button:hover:not(.disable-hover),
.tabs-ios-primary .tab-button:hover:not(.disable-hover) .tab-button-icon {
    color: rgba(255, 255, 255, 0.7);
}

    .tabs-ios-primary .tab-button[aria-selected=true],
    .tabs-ios-primary .tab-button[aria-selected=true] .tab-button-icon {
        color: #fff;
    }

.tabs-ios-secondary .tabbar {
    border-color: #21b94e;
    background-color: #32db64;
}

.tabs-ios-secondary .tab-button,
.tabs-ios-secondary .tab-button-icon,
.tabs-ios-secondary .tab-button:hover:not(.disable-hover),
.tabs-ios-secondary .tab-button:hover:not(.disable-hover) .tab-button-icon {
    color: rgba(255, 255, 255, 0.7);
}

    .tabs-ios-secondary .tab-button[aria-selected=true],
    .tabs-ios-secondary .tab-button[aria-selected=true] .tab-button-icon {
        color: #fff;
    }

.tabs-ios-danger .tabbar {
    border-color: #f30d0d;
    background-color: #f53d3d;
}

.tabs-ios-danger .tab-button,
.tabs-ios-danger .tab-button-icon,
.tabs-ios-danger .tab-button:hover:not(.disable-hover),
.tabs-ios-danger .tab-button:hover:not(.disable-hover) .tab-button-icon {
    color: rgba(255, 255, 255, 0.7);
}

    .tabs-ios-danger .tab-button[aria-selected=true],
    .tabs-ios-danger .tab-button[aria-selected=true] .tab-button-icon {
        color: #fff;
    }

.tabs-ios-light .tabbar {
    border-color: #dbdbdb;
    background-color: #f4f4f4;
}

.tabs-ios-light .tab-button,
.tabs-ios-light .tab-button-icon,
.tabs-ios-light .tab-button:hover:not(.disable-hover),
.tabs-ios-light .tab-button:hover:not(.disable-hover) .tab-button-icon {
    color: rgba(0, 0, 0, 0.7);
}

    .tabs-ios-light .tab-button[aria-selected=true],
    .tabs-ios-light .tab-button[aria-selected=true] .tab-button-icon {
        color: #000;
    }

.tabs-ios-dark .tabbar {
    border-color: #090909;
    background-color: #222;
}

.tabs-ios-dark .tab-button,
.tabs-ios-dark .tab-button-icon,
.tabs-ios-dark .tab-button:hover:not(.disable-hover),
.tabs-ios-dark .tab-button:hover:not(.disable-hover) .tab-button-icon {
    color: rgba(255, 255, 255, 0.7);
}

    .tabs-ios-dark .tab-button[aria-selected=true],
    .tabs-ios-dark .tab-button[aria-selected=true] .tab-button-icon {
        color: #fff;
    }

.tabs-md .tabbar {
    background: #f8f8f8;
}

.tabs-md .tab-button {
    min-height: 5.6rem;
    font-weight: normal;
    color: rgba(60, 60, 60, 0.7);
    padding: 0;
}

    .tabs-md .tab-button[aria-selected=true] {
        color: #488aff;
        padding: 0;
    }

.tabs-md .tab-button-text {
    font-size: 1.2rem;
    text-transform: none;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    margin: 0;
    -webkit-transform-origin: 50% 80%;
    transform-origin: 50% 80%;
}

.tabs-md .tab-button[aria-selected=true] .tab-button-text {
    -webkit-transform: scale3d(1.16667, 1.16667, 1);
    transform: scale3d(1.16667, 1.16667, 1);
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}

.tabs-md[tabsLayout=icon-top] .has-icon .tab-button-text {
    margin-top: 4px;
    margin-bottom: 0;
}

.tabs-md[tabsLayout=icon-bottom] .tab-button .tab-button-text {
    margin-top: 0;
}

.tabs-md .tab-button-icon {
    margin-top: 1px;
    min-width: 2.4rem;
    font-size: 2.4rem;
    color: rgba(60, 60, 60, 0.7);
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform-origin: 50% 150%;
    transform-origin: 50% 150%;
}

.tabs-md .tab-button[aria-selected=true] .tab-button-icon {
    color: #488aff;
    -webkit-transform: translate3d(0, -2px, 0);
    transform: translate3d(0, -2px, 0);
}

.tabs-md[tabsLayout=icon-right] .tab-button[aria-selected=true] .tab-button-icon,
.tabs-md[tabsLayout=icon-end] .tab-button[aria-selected=true] .tab-button-icon {
    -webkit-transform: translate3d(2px, 0, 0);
    transform: translate3d(2px, 0, 0);
}

.tabs-md[tabsLayout=icon-bottom] .tab-button[aria-selected=true] .tab-button-icon {
    -webkit-transform: translate3d(0, 2px, 0);
    transform: translate3d(0, 2px, 0);
}

.tabs-md[tabsLayout=icon-left] .tab-button[aria-selected=true] .tab-button-icon,
.tabs-md[tabsLayout=icon-start] .tab-button[aria-selected=true] .tab-button-icon {
    -webkit-transform: translate3d(-2px, 0, 0);
    transform: translate3d(-2px, 0, 0);
}

.tabs-md[tabsLayout=icon-hide] .tab-button,
.tabs-md[tabsLayout=title-hide] .tab-button,
.tabs-md .tab-button.icon-only,
.tabs-md .tab-button.has-title-only {
    padding: 0 10px;
}

.tabs-md[tabsHighlight=true] .tab-highlight {
    left: 0;
    bottom: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    position: absolute;
    display: block;
    width: 1px;
    height: 2px;
    background: #488aff;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

    .tabs-md[tabsHighlight=true] .tab-highlight.animate {
        -webkit-transition-duration: 300ms;
        transition-duration: 300ms;
    }

.tabs-md[tabsHighlight=true][tabsPlacement=bottom] > .tabbar > .tab-highlight {
    top: 0;
}

.tabs-md-primary .tabbar {
    background-color: #488aff;
}

.tabs-md-primary .tab-button,
.tabs-md-primary .tab-button-icon {
    color: rgba(255, 255, 255, 0.7);
}

    .tabs-md-primary .tab-button:hover:not(.disable-hover),
    .tabs-md-primary .tab-button[aria-selected=true],
    .tabs-md-primary .tab-button[aria-selected=true] .tab-button-icon {
        color: #fff;
    }

.tabs-md-primary[tabsHighlight=true] .tab-highlight {
    background: #fff;
}

.tabs-md-secondary .tabbar {
    background-color: #32db64;
}

.tabs-md-secondary .tab-button,
.tabs-md-secondary .tab-button-icon {
    color: rgba(255, 255, 255, 0.7);
}

    .tabs-md-secondary .tab-button:hover:not(.disable-hover),
    .tabs-md-secondary .tab-button[aria-selected=true],
    .tabs-md-secondary .tab-button[aria-selected=true] .tab-button-icon {
        color: #fff;
    }

.tabs-md-secondary[tabsHighlight=true] .tab-highlight {
    background: #fff;
}

.tabs-md-danger .tabbar {
    background-color: #f53d3d;
}

.tabs-md-danger .tab-button,
.tabs-md-danger .tab-button-icon {
    color: rgba(255, 255, 255, 0.7);
}

    .tabs-md-danger .tab-button:hover:not(.disable-hover),
    .tabs-md-danger .tab-button[aria-selected=true],
    .tabs-md-danger .tab-button[aria-selected=true] .tab-button-icon {
        color: #fff;
    }

.tabs-md-danger[tabsHighlight=true] .tab-highlight {
    background: #fff;
}

.tabs-md-light .tabbar {
    background-color: #f4f4f4;
}

.tabs-md-light .tab-button,
.tabs-md-light .tab-button-icon {
    color: rgba(0, 0, 0, 0.7);
}

    .tabs-md-light .tab-button:hover:not(.disable-hover),
    .tabs-md-light .tab-button[aria-selected=true],
    .tabs-md-light .tab-button[aria-selected=true] .tab-button-icon {
        color: #000;
    }

.tabs-md-light[tabsHighlight=true] .tab-highlight {
    background: #000;
}

.tabs-md-dark .tabbar {
    background-color: #222;
}

.tabs-md-dark .tab-button,
.tabs-md-dark .tab-button-icon {
    color: rgba(255, 255, 255, 0.7);
}

    .tabs-md-dark .tab-button:hover:not(.disable-hover),
    .tabs-md-dark .tab-button[aria-selected=true],
    .tabs-md-dark .tab-button[aria-selected=true] .tab-button-icon {
        color: #fff;
    }

.tabs-md-dark[tabsHighlight=true] .tab-highlight {
    background: #fff;
}

.tabs-wp .tabbar {
    background: #f8f8f8;
}

.tabs-wp .tab-button {
    border-radius: 0;
    min-height: 4.8rem;
    border-bottom: 2px solid transparent;
    font-size: 1.2rem;
    font-weight: normal;
    color: rgba(140, 140, 140, 0.7);
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 12px 10px 5px;
}

    .tabs-wp .tab-button[aria-selected=true] {
        border-bottom-color: #488aff;
        color: #488aff;
    }

    .tabs-wp .tab-button.activated {
        background: rgba(0, 0, 0, 0.1);
    }

.tabs-wp[tabsPlacement=bottom] .tab-button {
    border-top: 2px solid transparent;
    border-bottom-width: 0;
}

    .tabs-wp[tabsPlacement=bottom] .tab-button[aria-selected=true] {
        border-top-color: #488aff;
    }

.tabs-wp .tab-button-text {
    margin-top: 5px;
    margin-bottom: 5px;
}

.tabs-wp .tab-button-icon {
    min-width: 2.4rem;
    font-size: 2.4rem;
    color: rgba(140, 140, 140, 0.7);
}

.tabs-wp .tab-button[aria-selected=true] .tab-button-icon {
    color: #488aff;
}

.tabs-wp[tabsLayout=icon-bottom] .tab-button {
    padding-top: 8px;
    padding-bottom: 8px;
}

.tabs-wp[tabsLayout=icon-right] .tab-button,
.tabs-wp[tabsLayout=icon-left] .tab-button,
.tabs-wp[tabsLayout=icon-end] .tab-button,
.tabs-wp[tabsLayout=icon-start] .tab-button {
    padding-bottom: 10px;
}

    .tabs-wp[tabsLayout=icon-right] .tab-button ion-icon,
    .tabs-wp[tabsLayout=icon-left] .tab-button ion-icon,
    .tabs-wp[tabsLayout=icon-end] .tab-button ion-icon,
    .tabs-wp[tabsLayout=icon-start] .tab-button ion-icon {
        min-width: 24px;
    }

.tabs-wp[tabsLayout=icon-hide] .tab-button,
.tabs-wp[tabsLayout=title-hide] .tab-button,
.tabs-wp .tab-button.icon-only,
.tabs-wp .tab-button.has-title-only {
    padding: 6px 10px;
}

.tabs-wp-primary .tabbar {
    background-color: #488aff;
}

.tabs-wp-primary .tab-button,
.tabs-wp-primary .tab-button-icon {
    color: rgba(255, 255, 255, 0.7);
}

    .tabs-wp-primary .tab-button:hover:not(.disable-hover),
    .tabs-wp-primary .tab-button:hover:not(.disable-hover) .tab-button-icon,
    .tabs-wp-primary .tab-button[aria-selected=true],
    .tabs-wp-primary .tab-button[aria-selected=true] .tab-button-icon {
        border-color: #fff;
        color: #fff;
    }

.tabs-wp-secondary .tabbar {
    background-color: #32db64;
}

.tabs-wp-secondary .tab-button,
.tabs-wp-secondary .tab-button-icon {
    color: rgba(255, 255, 255, 0.7);
}

    .tabs-wp-secondary .tab-button:hover:not(.disable-hover),
    .tabs-wp-secondary .tab-button:hover:not(.disable-hover) .tab-button-icon,
    .tabs-wp-secondary .tab-button[aria-selected=true],
    .tabs-wp-secondary .tab-button[aria-selected=true] .tab-button-icon {
        border-color: #fff;
        color: #fff;
    }

.tabs-wp-danger .tabbar {
    background-color: #f53d3d;
}

.tabs-wp-danger .tab-button,
.tabs-wp-danger .tab-button-icon {
    color: rgba(255, 255, 255, 0.7);
}

    .tabs-wp-danger .tab-button:hover:not(.disable-hover),
    .tabs-wp-danger .tab-button:hover:not(.disable-hover) .tab-button-icon,
    .tabs-wp-danger .tab-button[aria-selected=true],
    .tabs-wp-danger .tab-button[aria-selected=true] .tab-button-icon {
        border-color: #fff;
        color: #fff;
    }

.tabs-wp-light .tabbar {
    background-color: #f4f4f4;
}

.tabs-wp-light .tab-button,
.tabs-wp-light .tab-button-icon {
    color: rgba(0, 0, 0, 0.7);
}

    .tabs-wp-light .tab-button:hover:not(.disable-hover),
    .tabs-wp-light .tab-button:hover:not(.disable-hover) .tab-button-icon,
    .tabs-wp-light .tab-button[aria-selected=true],
    .tabs-wp-light .tab-button[aria-selected=true] .tab-button-icon {
        border-color: #000;
        color: #000;
    }

.tabs-wp-dark .tabbar {
    background-color: #222;
}

.tabs-wp-dark .tab-button,
.tabs-wp-dark .tab-button-icon {
    color: rgba(255, 255, 255, 0.7);
}

    .tabs-wp-dark .tab-button:hover:not(.disable-hover),
    .tabs-wp-dark .tab-button:hover:not(.disable-hover) .tab-button-icon,
    .tabs-wp-dark .tab-button[aria-selected=true],
    .tabs-wp-dark .tab-button[aria-selected=true] .tab-button-icon {
        border-color: #fff;
        color: #fff;
    }

ion-toast {
    left: 0;
    top: 0;
    position: absolute;
    z-index: 1000;
    display: block;
    width: 100%;
    height: 100%;
    pointer-events: none;
    contain: strict;
}

.toast-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    pointer-events: auto;
    contain: content;
}

.toast-button {
    padding: 19px 16px 17px;
    font-size: 1.5rem;
}

.toast-message {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.toast-ios .toast-wrapper {
    left: 10px;
    right: 10px;
    margin: auto;
    border-radius: 0.65rem;
    position: absolute;
    z-index: 10;
    display: block;
    max-width: 700px;
    background: rgba(0, 0, 0, 0.9);
}

    .toast-ios .toast-wrapper.toast-top {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        margin: constant(safe-area-inset-top) auto auto;
        margin: env(safe-area-inset-top) auto auto;
        top: 0;
    }

    .toast-ios .toast-wrapper.toast-bottom {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        margin: auto auto constant(safe-area-inset-bottom);
        margin: auto auto env(safe-area-inset-bottom);
        bottom: 0;
    }

    .toast-ios .toast-wrapper.toast-middle {
        opacity: .01;
    }

.toast-ios .toast-message {
    font-size: 1.4rem;
    color: #fff;
    padding: 1.5rem;
}

.toast-md .toast-wrapper {
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    z-index: 10;
    display: block;
    width: 100%;
    max-width: 700px;
    background: #333;
}

    .toast-md .toast-wrapper.toast-top {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        top: 0;
    }

    .toast-md .toast-wrapper.toast-bottom {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        bottom: 0;
    }

    .toast-md .toast-wrapper.toast-middle {
        opacity: .01;
    }

.toast-md .toast-message {
    font-size: 1.5rem;
    color: #fff;
    padding: 19px 16px 17px;
}

.toast-wp .toast-wrapper {
    left: 0;
    right: 0;
    margin: auto;
    border-radius: 0;
    position: absolute;
    z-index: 10;
    display: block;
    max-width: 700px;
    background: black;
}

    .toast-wp .toast-wrapper.toast-top {
        top: 0;
        opacity: .01;
    }

    .toast-wp .toast-wrapper.toast-bottom {
        bottom: 0;
        opacity: .01;
    }

    .toast-wp .toast-wrapper.toast-middle {
        opacity: .01;
    }

.toast-message {
    font-size: 1.4rem;
    color: #fff;
    padding: 1.5rem;
}

.toast-button {
    color: #fff;
}

.toggle-ios {
    position: relative;
    display: block;
    width: 51px;
    height: 32px;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    contain: strict;
}

    .toggle-ios .toggle-icon {
        border-radius: 16px;
        position: relative;
        display: block;
        width: 100%;
        height: 100%;
        background-color: #e6e6e6;
        -webkit-transition: background-color 300ms;
        transition: background-color 300ms;
        pointer-events: none;
    }

        .toggle-ios .toggle-icon::before {
            left: 2px;
            right: 2px;
            top: 2px;
            bottom: 2px;
            border-radius: 16px;
            position: absolute;
            background-color: #fff;
            content: "";
            -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
            -webkit-transition: -webkit-transform 300ms;
            transition: -webkit-transform 300ms;
            transition: transform 300ms;
            transition: transform 300ms, -webkit-transform 300ms;
        }

    .toggle-ios .toggle-inner {
        left: 2px;
        top: 2px;
        border-radius: 14px;
        position: absolute;
        width: 28px;
        height: 28px;
        background-color: #fff;
        -webkit-box-shadow: 0 3px 12px rgba(0, 0, 0, 0.16), 0 3px 1px rgba(0, 0, 0, 0.1);
        box-shadow: 0 3px 12px rgba(0, 0, 0, 0.16), 0 3px 1px rgba(0, 0, 0, 0.1);
        -webkit-transition: width 120ms ease-in-out 80ms, left 110ms ease-in-out 80ms, right 110ms ease-in-out 80ms, -webkit-transform 300ms;
        transition: width 120ms ease-in-out 80ms, left 110ms ease-in-out 80ms, right 110ms ease-in-out 80ms, -webkit-transform 300ms;
        transition: transform 300ms, width 120ms ease-in-out 80ms, left 110ms ease-in-out 80ms, right 110ms ease-in-out 80ms;
        transition: transform 300ms, width 120ms ease-in-out 80ms, left 110ms ease-in-out 80ms, right 110ms ease-in-out 80ms, -webkit-transform 300ms;
        will-change: transform;
        contain: strict;
    }

    .toggle-ios.toggle-checked .toggle-icon {
        background-color: #488aff;
    }

        .toggle-ios.toggle-activated .toggle-icon::before,
        .toggle-ios.toggle-checked .toggle-icon::before {
            -webkit-transform: scale3d(0, 0, 0);
            transform: scale3d(0, 0, 0);
        }

    .toggle-ios.toggle-checked .toggle-inner {
        -webkit-transform: translate3d(19px, 0, 0);
        transform: translate3d(19px, 0, 0);
    }

    .toggle-ios.toggle-activated.toggle-checked .toggle-inner::before {
        -webkit-transform: scale3d(0, 0, 0);
        transform: scale3d(0, 0, 0);
    }

    .toggle-ios.toggle-activated .toggle-inner {
        width: 34px;
    }

    .toggle-ios.toggle-activated.toggle-checked .toggle-inner {
        left: -4px;
    }

    .toggle-ios.toggle-disabled,
    .item-ios.item-toggle-disabled ion-label {
        opacity: 0.3;
        pointer-events: none;
    }

.item-ios .toggle-ios {
    margin: 0;
    padding: 6px 8px 5px 16px;
}

    .item-ios .toggle-ios[item-left],
    .item-ios .toggle-ios[item-start] {
        padding: 6px 16px 5px 0;
    }

.toggle-ios-primary.toggle-checked .toggle-icon {
    background-color: #488aff;
}

.toggle-ios-secondary.toggle-checked .toggle-icon {
    background-color: #32db64;
}

.toggle-ios-danger.toggle-checked .toggle-icon {
    background-color: #f53d3d;
}

.toggle-ios-light.toggle-checked .toggle-icon {
    background-color: #f4f4f4;
}

.toggle-ios-dark.toggle-checked .toggle-icon {
    background-color: #222;
}

.toggle-md {
    position: relative;
    display: block;
    width: 36px;
    height: 14px;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    contain: strict;
    padding: 12px;
}

    .toggle-md .toggle-icon {
        border-radius: 14px;
        position: relative;
        display: block;
        width: 100%;
        height: 100%;
        background-color: #dedede;
        -webkit-transition: background-color 300ms;
        transition: background-color 300ms;
        pointer-events: none;
    }

    .toggle-md .toggle-inner {
        left: 0;
        top: -3px;
        border-radius: 50%;
        position: absolute;
        width: 20px;
        height: 20px;
        background-color: #fff;
        -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
        -webkit-transition-duration: 300ms;
        transition-duration: 300ms;
        -webkit-transition-property: background-color, -webkit-transform;
        transition-property: background-color, -webkit-transform;
        transition-property: transform, background-color;
        transition-property: transform, background-color, -webkit-transform;
        will-change: transform, background-color;
        contain: strict;
    }

    .toggle-md.toggle-checked .toggle-icon {
        background-color: #c8dcff;
    }

    .toggle-md.toggle-checked .toggle-inner {
        -webkit-transform: translate3d(16px, 0, 0);
        transform: translate3d(16px, 0, 0);
        background-color: #488aff;
    }

    .toggle-md.toggle-disabled,
    .item-md.item-toggle-disabled ion-label {
        opacity: 0.3;
        pointer-events: none;
    }

        .toggle-md.toggle-disabled ion-radio {
            opacity: 0.3;
        }

.item-md .toggle-md {
    cursor: pointer;
    margin: 0;
    padding: 12px 8px 12px 16px;
}

    .item-md .toggle-md[item-left],
    .item-md .toggle-md[item-start] {
        padding: 12px 18px 12px 2px;
    }

.item-md.item-toggle ion-label {
    margin-left: 0;
}

.toggle-md-primary.toggle-checked .toggle-icon {
    background-color: #c8dcff;
}

.toggle-md-primary.toggle-checked .toggle-inner {
    background-color: #488aff;
}

.toggle-md-secondary.toggle-checked .toggle-icon {
    background-color: #9eeeb6;
}

.toggle-md-secondary.toggle-checked .toggle-inner {
    background-color: #32db64;
}

.toggle-md-danger.toggle-checked .toggle-icon {
    background-color: #fbb6b6;
}

.toggle-md-danger.toggle-checked .toggle-inner {
    background-color: #f53d3d;
}

.toggle-md-light.toggle-checked .toggle-icon {
    background-color: white;
}

.toggle-md-light.toggle-checked .toggle-inner {
    background-color: #f4f4f4;
}

.toggle-md-dark.toggle-checked .toggle-icon {
    background-color: #626262;
}

.toggle-md-dark.toggle-checked .toggle-inner {
    background-color: #222;
}

.toggle-wp {
    position: relative;
    display: block;
    width: 40px;
    height: 18px;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    contain: strict;
}

    .toggle-wp .toggle-icon {
        border-radius: 18px;
        position: relative;
        display: block;
        width: 100%;
        height: 100%;
        border: 2px solid #323232;
        background-color: transparent;
        pointer-events: none;
        contain: strict;
    }

    .toggle-wp .toggle-inner {
        left: 2px;
        top: 2px;
        border-radius: 50%;
        position: absolute;
        width: 10px;
        height: 10px;
        background-color: #323232;
        -webkit-transition-duration: 300ms;
        transition-duration: 300ms;
        -webkit-transition-property: background-color, -webkit-transform;
        transition-property: background-color, -webkit-transform;
        transition-property: transform, background-color;
        transition-property: transform, background-color, -webkit-transform;
        will-change: transform, background-color;
    }

    .toggle-wp.toggle-checked .toggle-icon {
        border-color: #488aff;
        background-color: #488aff;
    }

    .toggle-wp.toggle-checked .toggle-inner {
        -webkit-transform: translate3d(22px, 0, 0);
        transform: translate3d(22px, 0, 0);
        background-color: #fff;
    }

    .toggle-wp.toggle-disabled,
    .item-wp.item-toggle-disabled ion-label {
        opacity: 0.3;
        pointer-events: none;
    }

        .toggle-wp.toggle-disabled ion-radio {
            opacity: 0.3;
        }

.item-wp .toggle-wp {
    margin: 0;
    cursor: pointer;
    padding: 12px 8px 12px 16px;
}

    .item-wp .toggle-wp[item-left],
    .item-wp .toggle-wp[item-start] {
        padding: 12px 18px 12px 2px;
    }

.item-wp.item-toggle ion-label {
    margin-left: 0;
}

.toggle-wp-primary.toggle-checked .toggle-icon {
    border-color: #488aff;
    background-color: #488aff;
}

.toggle-wp-primary.toggle-checked .toggle-inner {
    background-color: #fff;
}

.toggle-wp-secondary.toggle-checked .toggle-icon {
    border-color: #32db64;
    background-color: #32db64;
}

.toggle-wp-secondary.toggle-checked .toggle-inner {
    background-color: #fff;
}

.toggle-wp-danger.toggle-checked .toggle-icon {
    border-color: #f53d3d;
    background-color: #f53d3d;
}

.toggle-wp-danger.toggle-checked .toggle-inner {
    background-color: #fff;
}

.toggle-wp-light.toggle-checked .toggle-icon {
    border-color: #f4f4f4;
    background-color: #f4f4f4;
}

.toggle-wp-light.toggle-checked .toggle-inner {
    background-color: #000;
}

.toggle-wp-dark.toggle-checked .toggle-icon {
    border-color: #222;
    background-color: #222;
}

.toggle-wp-dark.toggle-checked .toggle-inner {
    background-color: #fff;
}

ion-toolbar {
    position: relative;
    z-index: 10;
}

.toolbar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    contain: content;
}

.toolbar-background {
    left: 0;
    top: 0;
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    border: 0;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    pointer-events: none;
    contain: strict;
}

ion-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.toolbar-title {
    display: block;
    overflow: hidden;
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
}

ion-buttons {
    margin: 0 0.2rem;
    display: block;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    pointer-events: none;
}

    ion-buttons button,
    ion-buttons a,
    ion-buttons input,
    ion-buttons textarea,
    ion-buttons div {
        pointer-events: auto;
    }

.toolbar[transparent] .toolbar-background {
    border-color: transparent;
    background: transparent;
}

ion-buttons,
.bar-button-menutoggle {
    z-index: 99;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

ion-navbar.toolbar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.bar-button {
    margin: 0;
    padding: 0;
    text-align: center;
    -moz-appearance: none;
    -ms-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    position: relative;
    display: inline-block;
    line-height: 1;
    text-overflow: ellipsis;
    text-transform: none;
    white-space: nowrap;
    cursor: pointer;
    vertical-align: top;
    vertical-align: -webkit-baseline-middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .bar-button::after {
        left: -2px;
        right: -2px;
        top: -7px;
        bottom: -6px;
        position: absolute;
        content: "";
    }

.bar-button-menutoggle {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.back-button {
    display: none;
}

    .back-button.show-back-button {
        display: inline-block;
    }

.back-button-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.toolbar-ios {
    padding: 4px;
    padding-left: 4px;
    padding-right: 4px;
    min-height: 44px;
}

@media screen and (orientation: landscape) {
    .toolbar-ios {
        padding-left: calc(constant(safe-area-inset-left) + 4px);
        padding-right: calc(constant(safe-area-inset-right) + 4px);
        padding-left: calc(env(safe-area-inset-left) + 4px);
        padding-right: calc(env(safe-area-inset-right) + 4px);
    }
}

.toolbar-background-ios {
    background: #f8f8f8;
}

.header-ios .toolbar-background-ios,
.footer-ios .toolbar-background-ios {
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.3);
}

.header-ios .toolbar-ios:last-child .toolbar-background-ios {
    border-width: 0 0 0.55px;
}

.footer-ios .toolbar-ios:first-child .toolbar-background-ios {
    border-width: 0.55px 0 0;
}

.header-ios[no-border] .toolbar-ios:last-child .toolbar-background-ios {
    border-bottom-width: 0;
}

.footer-ios[no-border] .toolbar-ios:first-child .toolbar-background-ios {
    border-top-width: 0;
}

.toolbar-content-ios {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-ordinal-group: 5;
    -webkit-order: 4;
    -ms-flex-order: 4;
    order: 4;
    min-width: 0;
}

.toolbar-title-ios {
    text-align: center;
    font-size: 1.7rem;
    font-weight: 600;
    color: #000;
    pointer-events: auto;
}

.toolbar-ios ion-title {
    left: 0;
    top: 0;
    padding: 0 90px 1px;
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    pointer-events: none;
}

.bar-buttons-ios {
    -webkit-box-ordinal-group: 4;
    -webkit-order: 3;
    -ms-flex-order: 3;
    order: 3;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

    .bar-buttons-ios[left] {
        -webkit-box-ordinal-group: 3;
        -webkit-order: 2;
        -ms-flex-order: 2;
        order: 2;
    }

    .bar-buttons-ios[end] {
        text-align: right;
        text-align: end;
        -webkit-box-ordinal-group: 6;
        -webkit-order: 5;
        -ms-flex-order: 5;
        order: 5;
    }

    .bar-buttons-ios[right] {
        text-align: right;
        -webkit-box-ordinal-group: 7;
        -webkit-order: 6;
        -ms-flex-order: 6;
        order: 6;
    }

.bar-button-ios {
    padding: 0 4px;
    border-radius: 4px;
    height: 32px;
    border: 0;
    font-size: 1.7rem;
}

.bar-button-outline-ios {
    border-width: 1px;
    border-style: solid;
    border-color: #488aff;
    color: #488aff;
    background-color: transparent;
}

    .bar-button-outline-ios:hover:not(.disable-hover) {
        opacity: .4;
    }

    .bar-button-outline-ios.activated {
        color: #fff;
        background-color: #488aff;
    }

.bar-button-solid-ios {
    color: #fff;
    background-color: #488aff;
}

    .bar-button-solid-ios:hover:not(.disable-hover) {
        color: #fff;
        opacity: .4;
    }

    .bar-button-solid-ios.activated {
        color: #fff;
        background-color: #427feb;
        opacity: .4;
    }

.bar-button-ios.bar-button-icon-start ion-icon {
    padding-right: 0.3em;
    font-size: 1.4em;
    line-height: .67;
    pointer-events: none;
}

.bar-button-ios.bar-button-icon-end ion-icon {
    padding-left: 0.4em;
    font-size: 1.4em;
    line-height: .67;
    pointer-events: none;
}

.bar-button-ios[icon-only] {
    padding: 0;
    min-width: .9em;
}

    .bar-button-ios[icon-only] ion-icon {
        padding: 0 0.1em;
        font-size: 1.8em;
        line-height: .67;
        pointer-events: none;
    }

.back-button-ios {
    margin: 0;
    z-index: 99;
    overflow: visible;
    -webkit-box-ordinal-group: 1;
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    min-height: 3.2rem;
    line-height: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.back-button-icon-ios {
    margin: -1px 0 0;
    display: inherit;
    min-width: 18px;
    font-size: 3.4rem;
}

.back-button-text-ios {
    letter-spacing: -.01em;
}

.bar-button-menutoggle-ios {
    margin: 0 6px;
    padding: 0;
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
    min-width: 36px;
}

    .bar-button-menutoggle-ios ion-icon {
        padding: 0 6px;
        font-size: 2.8rem;
    }

    .bar-button-menutoggle-ios[end],
    .bar-button-menutoggle-ios[right] {
        -webkit-box-ordinal-group: 8;
        -webkit-order: 7;
        -ms-flex-order: 7;
        order: 7;
    }

.bar-button-default-ios,
.bar-button-default.bar-button-ios-default,
.bar-button-clear-ios-default {
    color: #488aff;
    background-color: transparent;
}

    .bar-button-default-ios:hover:not(.disable-hover),
    .bar-button-default.bar-button-ios-default:hover:not(.disable-hover),
    .bar-button-clear-ios-default:hover:not(.disable-hover) {
        color: #488aff;
    }

    .bar-button-default-ios.activated,
    .bar-button-default.bar-button-ios-default.activated,
    .bar-button-clear-ios-default.activated {
        opacity: .4;
    }

.bar-button-clear-ios,
.bar-button-default.bar-button-ios-clear,
.bar-button-clear-ios-clear {
    color: #488aff;
    background-color: transparent;
}

    .bar-button-clear-ios:hover:not(.disable-hover),
    .bar-button-default.bar-button-ios-clear:hover:not(.disable-hover),
    .bar-button-clear-ios-clear:hover:not(.disable-hover) {
        color: #488aff;
    }

    .bar-button-clear-ios.activated,
    .bar-button-default.bar-button-ios-clear.activated,
    .bar-button-clear-ios-clear.activated {
        opacity: .4;
    }

.toolbar-ios-primary .toolbar-background-ios {
    background: #488aff;
}

.toolbar-ios-primary .toolbar-title-ios,
.toolbar-ios-primary .bar-button-clear-ios,
.toolbar-ios-primary .bar-button-default-ios {
    color: #fff;
}

.toolbar-ios-primary .bar-button-primary-ios,
.toolbar-ios-primary .bar-button-default.bar-button-ios-primary,
.toolbar-ios-primary .bar-button-clear-ios-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-ios-primary .bar-button-primary-ios:hover:not(.disable-hover),
    .toolbar-ios-primary .bar-button-default.bar-button-ios-primary:hover:not(.disable-hover),
    .toolbar-ios-primary .bar-button-clear-ios-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

    .toolbar-ios-primary .bar-button-primary-ios.activated,
    .toolbar-ios-primary .bar-button-default.bar-button-ios-primary.activated,
    .toolbar-ios-primary .bar-button-clear-ios-primary.activated {
        opacity: .4;
    }

.toolbar-ios-primary .bar-button-outline-ios-primary {
    border-color: #488aff;
    color: #488aff;
    background-color: transparent;
}

    .toolbar-ios-primary .bar-button-outline-ios-primary.activated {
        color: #fff;
        background-color: #488aff;
    }

.toolbar-ios-primary .bar-button-solid-ios-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-ios-primary .bar-button-solid-ios-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-ios-primary .bar-button-secondary-ios,
.toolbar-ios-primary .bar-button-default.bar-button-ios-secondary,
.toolbar-ios-primary .bar-button-clear-ios-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-ios-primary .bar-button-secondary-ios:hover:not(.disable-hover),
    .toolbar-ios-primary .bar-button-default.bar-button-ios-secondary:hover:not(.disable-hover),
    .toolbar-ios-primary .bar-button-clear-ios-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

    .toolbar-ios-primary .bar-button-secondary-ios.activated,
    .toolbar-ios-primary .bar-button-default.bar-button-ios-secondary.activated,
    .toolbar-ios-primary .bar-button-clear-ios-secondary.activated {
        opacity: .4;
    }

.toolbar-ios-primary .bar-button-outline-ios-secondary {
    border-color: #32db64;
    color: #32db64;
    background-color: transparent;
}

    .toolbar-ios-primary .bar-button-outline-ios-secondary.activated {
        color: #fff;
        background-color: #32db64;
    }

.toolbar-ios-primary .bar-button-solid-ios-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-ios-primary .bar-button-solid-ios-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-ios-primary .bar-button-danger-ios,
.toolbar-ios-primary .bar-button-default.bar-button-ios-danger,
.toolbar-ios-primary .bar-button-clear-ios-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-ios-primary .bar-button-danger-ios:hover:not(.disable-hover),
    .toolbar-ios-primary .bar-button-default.bar-button-ios-danger:hover:not(.disable-hover),
    .toolbar-ios-primary .bar-button-clear-ios-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

    .toolbar-ios-primary .bar-button-danger-ios.activated,
    .toolbar-ios-primary .bar-button-default.bar-button-ios-danger.activated,
    .toolbar-ios-primary .bar-button-clear-ios-danger.activated {
        opacity: .4;
    }

.toolbar-ios-primary .bar-button-outline-ios-danger {
    border-color: #f53d3d;
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-ios-primary .bar-button-outline-ios-danger.activated {
        color: #fff;
        background-color: #f53d3d;
    }

.toolbar-ios-primary .bar-button-solid-ios-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-ios-primary .bar-button-solid-ios-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-ios-primary .bar-button-light-ios,
.toolbar-ios-primary .bar-button-default.bar-button-ios-light,
.toolbar-ios-primary .bar-button-clear-ios-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-ios-primary .bar-button-light-ios:hover:not(.disable-hover),
    .toolbar-ios-primary .bar-button-default.bar-button-ios-light:hover:not(.disable-hover),
    .toolbar-ios-primary .bar-button-clear-ios-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

    .toolbar-ios-primary .bar-button-light-ios.activated,
    .toolbar-ios-primary .bar-button-default.bar-button-ios-light.activated,
    .toolbar-ios-primary .bar-button-clear-ios-light.activated {
        opacity: .4;
    }

.toolbar-ios-primary .bar-button-outline-ios-light {
    border-color: #f4f4f4;
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-ios-primary .bar-button-outline-ios-light.activated {
        color: #000;
        background-color: #f4f4f4;
    }

.toolbar-ios-primary .bar-button-solid-ios-light {
    color: #000;
    background-color: #f4f4f4;
}

    .toolbar-ios-primary .bar-button-solid-ios-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-ios-primary .bar-button-dark-ios,
.toolbar-ios-primary .bar-button-default.bar-button-ios-dark,
.toolbar-ios-primary .bar-button-clear-ios-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-ios-primary .bar-button-dark-ios:hover:not(.disable-hover),
    .toolbar-ios-primary .bar-button-default.bar-button-ios-dark:hover:not(.disable-hover),
    .toolbar-ios-primary .bar-button-clear-ios-dark:hover:not(.disable-hover) {
        color: #222;
    }

    .toolbar-ios-primary .bar-button-dark-ios.activated,
    .toolbar-ios-primary .bar-button-default.bar-button-ios-dark.activated,
    .toolbar-ios-primary .bar-button-clear-ios-dark.activated {
        opacity: .4;
    }

.toolbar-ios-primary .bar-button-outline-ios-dark {
    border-color: #222;
    color: #222;
    background-color: transparent;
}

    .toolbar-ios-primary .bar-button-outline-ios-dark.activated {
        color: #fff;
        background-color: #222;
    }

.toolbar-ios-primary .bar-button-solid-ios-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-ios-primary .bar-button-solid-ios-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-primary-ios,
.bar-button-default.bar-button-ios-primary,
.bar-button-clear-ios-primary {
    color: #488aff;
    background-color: transparent;
}

    .bar-button-primary-ios:hover:not(.disable-hover),
    .bar-button-default.bar-button-ios-primary:hover:not(.disable-hover),
    .bar-button-clear-ios-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

    .bar-button-primary-ios.activated,
    .bar-button-default.bar-button-ios-primary.activated,
    .bar-button-clear-ios-primary.activated {
        opacity: .4;
    }

.bar-button-outline-ios-primary {
    border-color: #488aff;
    color: #488aff;
    background-color: transparent;
}

    .bar-button-outline-ios-primary.activated {
        color: #fff;
        background-color: #488aff;
    }

.bar-button-solid-ios-primary {
    color: #fff;
    background-color: #488aff;
}

    .bar-button-solid-ios-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-ios-secondary .toolbar-background-ios {
    background: #32db64;
}

.toolbar-ios-secondary .toolbar-title-ios,
.toolbar-ios-secondary .bar-button-clear-ios,
.toolbar-ios-secondary .bar-button-default-ios {
    color: #fff;
}

.toolbar-ios-secondary .bar-button-primary-ios,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-primary,
.toolbar-ios-secondary .bar-button-clear-ios-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-ios-secondary .bar-button-primary-ios:hover:not(.disable-hover),
    .toolbar-ios-secondary .bar-button-default.bar-button-ios-primary:hover:not(.disable-hover),
    .toolbar-ios-secondary .bar-button-clear-ios-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

    .toolbar-ios-secondary .bar-button-primary-ios.activated,
    .toolbar-ios-secondary .bar-button-default.bar-button-ios-primary.activated,
    .toolbar-ios-secondary .bar-button-clear-ios-primary.activated {
        opacity: .4;
    }

.toolbar-ios-secondary .bar-button-outline-ios-primary {
    border-color: #488aff;
    color: #488aff;
    background-color: transparent;
}

    .toolbar-ios-secondary .bar-button-outline-ios-primary.activated {
        color: #fff;
        background-color: #488aff;
    }

.toolbar-ios-secondary .bar-button-solid-ios-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-ios-secondary .bar-button-solid-ios-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-ios-secondary .bar-button-secondary-ios,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-secondary,
.toolbar-ios-secondary .bar-button-clear-ios-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-ios-secondary .bar-button-secondary-ios:hover:not(.disable-hover),
    .toolbar-ios-secondary .bar-button-default.bar-button-ios-secondary:hover:not(.disable-hover),
    .toolbar-ios-secondary .bar-button-clear-ios-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

    .toolbar-ios-secondary .bar-button-secondary-ios.activated,
    .toolbar-ios-secondary .bar-button-default.bar-button-ios-secondary.activated,
    .toolbar-ios-secondary .bar-button-clear-ios-secondary.activated {
        opacity: .4;
    }

.toolbar-ios-secondary .bar-button-outline-ios-secondary {
    border-color: #32db64;
    color: #32db64;
    background-color: transparent;
}

    .toolbar-ios-secondary .bar-button-outline-ios-secondary.activated {
        color: #fff;
        background-color: #32db64;
    }

.toolbar-ios-secondary .bar-button-solid-ios-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-ios-secondary .bar-button-solid-ios-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-ios-secondary .bar-button-danger-ios,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-danger,
.toolbar-ios-secondary .bar-button-clear-ios-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-ios-secondary .bar-button-danger-ios:hover:not(.disable-hover),
    .toolbar-ios-secondary .bar-button-default.bar-button-ios-danger:hover:not(.disable-hover),
    .toolbar-ios-secondary .bar-button-clear-ios-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

    .toolbar-ios-secondary .bar-button-danger-ios.activated,
    .toolbar-ios-secondary .bar-button-default.bar-button-ios-danger.activated,
    .toolbar-ios-secondary .bar-button-clear-ios-danger.activated {
        opacity: .4;
    }

.toolbar-ios-secondary .bar-button-outline-ios-danger {
    border-color: #f53d3d;
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-ios-secondary .bar-button-outline-ios-danger.activated {
        color: #fff;
        background-color: #f53d3d;
    }

.toolbar-ios-secondary .bar-button-solid-ios-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-ios-secondary .bar-button-solid-ios-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-ios-secondary .bar-button-light-ios,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-light,
.toolbar-ios-secondary .bar-button-clear-ios-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-ios-secondary .bar-button-light-ios:hover:not(.disable-hover),
    .toolbar-ios-secondary .bar-button-default.bar-button-ios-light:hover:not(.disable-hover),
    .toolbar-ios-secondary .bar-button-clear-ios-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

    .toolbar-ios-secondary .bar-button-light-ios.activated,
    .toolbar-ios-secondary .bar-button-default.bar-button-ios-light.activated,
    .toolbar-ios-secondary .bar-button-clear-ios-light.activated {
        opacity: .4;
    }

.toolbar-ios-secondary .bar-button-outline-ios-light {
    border-color: #f4f4f4;
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-ios-secondary .bar-button-outline-ios-light.activated {
        color: #000;
        background-color: #f4f4f4;
    }

.toolbar-ios-secondary .bar-button-solid-ios-light {
    color: #000;
    background-color: #f4f4f4;
}

    .toolbar-ios-secondary .bar-button-solid-ios-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-ios-secondary .bar-button-dark-ios,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-dark,
.toolbar-ios-secondary .bar-button-clear-ios-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-ios-secondary .bar-button-dark-ios:hover:not(.disable-hover),
    .toolbar-ios-secondary .bar-button-default.bar-button-ios-dark:hover:not(.disable-hover),
    .toolbar-ios-secondary .bar-button-clear-ios-dark:hover:not(.disable-hover) {
        color: #222;
    }

    .toolbar-ios-secondary .bar-button-dark-ios.activated,
    .toolbar-ios-secondary .bar-button-default.bar-button-ios-dark.activated,
    .toolbar-ios-secondary .bar-button-clear-ios-dark.activated {
        opacity: .4;
    }

.toolbar-ios-secondary .bar-button-outline-ios-dark {
    border-color: #222;
    color: #222;
    background-color: transparent;
}

    .toolbar-ios-secondary .bar-button-outline-ios-dark.activated {
        color: #fff;
        background-color: #222;
    }

.toolbar-ios-secondary .bar-button-solid-ios-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-ios-secondary .bar-button-solid-ios-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-secondary-ios,
.bar-button-default.bar-button-ios-secondary,
.bar-button-clear-ios-secondary {
    color: #32db64;
    background-color: transparent;
}

    .bar-button-secondary-ios:hover:not(.disable-hover),
    .bar-button-default.bar-button-ios-secondary:hover:not(.disable-hover),
    .bar-button-clear-ios-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

    .bar-button-secondary-ios.activated,
    .bar-button-default.bar-button-ios-secondary.activated,
    .bar-button-clear-ios-secondary.activated {
        opacity: .4;
    }

.bar-button-outline-ios-secondary {
    border-color: #32db64;
    color: #32db64;
    background-color: transparent;
}

    .bar-button-outline-ios-secondary.activated {
        color: #fff;
        background-color: #32db64;
    }

.bar-button-solid-ios-secondary {
    color: #fff;
    background-color: #32db64;
}

    .bar-button-solid-ios-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-ios-danger .toolbar-background-ios {
    background: #f53d3d;
}

.toolbar-ios-danger .toolbar-title-ios,
.toolbar-ios-danger .bar-button-clear-ios,
.toolbar-ios-danger .bar-button-default-ios {
    color: #fff;
}

.toolbar-ios-danger .bar-button-primary-ios,
.toolbar-ios-danger .bar-button-default.bar-button-ios-primary,
.toolbar-ios-danger .bar-button-clear-ios-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-ios-danger .bar-button-primary-ios:hover:not(.disable-hover),
    .toolbar-ios-danger .bar-button-default.bar-button-ios-primary:hover:not(.disable-hover),
    .toolbar-ios-danger .bar-button-clear-ios-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

    .toolbar-ios-danger .bar-button-primary-ios.activated,
    .toolbar-ios-danger .bar-button-default.bar-button-ios-primary.activated,
    .toolbar-ios-danger .bar-button-clear-ios-primary.activated {
        opacity: .4;
    }

.toolbar-ios-danger .bar-button-outline-ios-primary {
    border-color: #488aff;
    color: #488aff;
    background-color: transparent;
}

    .toolbar-ios-danger .bar-button-outline-ios-primary.activated {
        color: #fff;
        background-color: #488aff;
    }

.toolbar-ios-danger .bar-button-solid-ios-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-ios-danger .bar-button-solid-ios-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-ios-danger .bar-button-secondary-ios,
.toolbar-ios-danger .bar-button-default.bar-button-ios-secondary,
.toolbar-ios-danger .bar-button-clear-ios-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-ios-danger .bar-button-secondary-ios:hover:not(.disable-hover),
    .toolbar-ios-danger .bar-button-default.bar-button-ios-secondary:hover:not(.disable-hover),
    .toolbar-ios-danger .bar-button-clear-ios-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

    .toolbar-ios-danger .bar-button-secondary-ios.activated,
    .toolbar-ios-danger .bar-button-default.bar-button-ios-secondary.activated,
    .toolbar-ios-danger .bar-button-clear-ios-secondary.activated {
        opacity: .4;
    }

.toolbar-ios-danger .bar-button-outline-ios-secondary {
    border-color: #32db64;
    color: #32db64;
    background-color: transparent;
}

    .toolbar-ios-danger .bar-button-outline-ios-secondary.activated {
        color: #fff;
        background-color: #32db64;
    }

.toolbar-ios-danger .bar-button-solid-ios-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-ios-danger .bar-button-solid-ios-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-ios-danger .bar-button-danger-ios,
.toolbar-ios-danger .bar-button-default.bar-button-ios-danger,
.toolbar-ios-danger .bar-button-clear-ios-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-ios-danger .bar-button-danger-ios:hover:not(.disable-hover),
    .toolbar-ios-danger .bar-button-default.bar-button-ios-danger:hover:not(.disable-hover),
    .toolbar-ios-danger .bar-button-clear-ios-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

    .toolbar-ios-danger .bar-button-danger-ios.activated,
    .toolbar-ios-danger .bar-button-default.bar-button-ios-danger.activated,
    .toolbar-ios-danger .bar-button-clear-ios-danger.activated {
        opacity: .4;
    }

.toolbar-ios-danger .bar-button-outline-ios-danger {
    border-color: #f53d3d;
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-ios-danger .bar-button-outline-ios-danger.activated {
        color: #fff;
        background-color: #f53d3d;
    }

.toolbar-ios-danger .bar-button-solid-ios-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-ios-danger .bar-button-solid-ios-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-ios-danger .bar-button-light-ios,
.toolbar-ios-danger .bar-button-default.bar-button-ios-light,
.toolbar-ios-danger .bar-button-clear-ios-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-ios-danger .bar-button-light-ios:hover:not(.disable-hover),
    .toolbar-ios-danger .bar-button-default.bar-button-ios-light:hover:not(.disable-hover),
    .toolbar-ios-danger .bar-button-clear-ios-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

    .toolbar-ios-danger .bar-button-light-ios.activated,
    .toolbar-ios-danger .bar-button-default.bar-button-ios-light.activated,
    .toolbar-ios-danger .bar-button-clear-ios-light.activated {
        opacity: .4;
    }

.toolbar-ios-danger .bar-button-outline-ios-light {
    border-color: #f4f4f4;
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-ios-danger .bar-button-outline-ios-light.activated {
        color: #000;
        background-color: #f4f4f4;
    }

.toolbar-ios-danger .bar-button-solid-ios-light {
    color: #000;
    background-color: #f4f4f4;
}

    .toolbar-ios-danger .bar-button-solid-ios-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-ios-danger .bar-button-dark-ios,
.toolbar-ios-danger .bar-button-default.bar-button-ios-dark,
.toolbar-ios-danger .bar-button-clear-ios-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-ios-danger .bar-button-dark-ios:hover:not(.disable-hover),
    .toolbar-ios-danger .bar-button-default.bar-button-ios-dark:hover:not(.disable-hover),
    .toolbar-ios-danger .bar-button-clear-ios-dark:hover:not(.disable-hover) {
        color: #222;
    }

    .toolbar-ios-danger .bar-button-dark-ios.activated,
    .toolbar-ios-danger .bar-button-default.bar-button-ios-dark.activated,
    .toolbar-ios-danger .bar-button-clear-ios-dark.activated {
        opacity: .4;
    }

.toolbar-ios-danger .bar-button-outline-ios-dark {
    border-color: #222;
    color: #222;
    background-color: transparent;
}

    .toolbar-ios-danger .bar-button-outline-ios-dark.activated {
        color: #fff;
        background-color: #222;
    }

.toolbar-ios-danger .bar-button-solid-ios-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-ios-danger .bar-button-solid-ios-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-danger-ios,
.bar-button-default.bar-button-ios-danger,
.bar-button-clear-ios-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .bar-button-danger-ios:hover:not(.disable-hover),
    .bar-button-default.bar-button-ios-danger:hover:not(.disable-hover),
    .bar-button-clear-ios-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

    .bar-button-danger-ios.activated,
    .bar-button-default.bar-button-ios-danger.activated,
    .bar-button-clear-ios-danger.activated {
        opacity: .4;
    }

.bar-button-outline-ios-danger {
    border-color: #f53d3d;
    color: #f53d3d;
    background-color: transparent;
}

    .bar-button-outline-ios-danger.activated {
        color: #fff;
        background-color: #f53d3d;
    }

.bar-button-solid-ios-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .bar-button-solid-ios-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-ios-light .toolbar-background-ios {
    background: #f4f4f4;
}

.toolbar-ios-light .toolbar-title-ios,
.toolbar-ios-light .bar-button-clear-ios,
.toolbar-ios-light .bar-button-default-ios {
    color: #000;
}

.toolbar-ios-light .bar-button-primary-ios,
.toolbar-ios-light .bar-button-default.bar-button-ios-primary,
.toolbar-ios-light .bar-button-clear-ios-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-ios-light .bar-button-primary-ios:hover:not(.disable-hover),
    .toolbar-ios-light .bar-button-default.bar-button-ios-primary:hover:not(.disable-hover),
    .toolbar-ios-light .bar-button-clear-ios-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

    .toolbar-ios-light .bar-button-primary-ios.activated,
    .toolbar-ios-light .bar-button-default.bar-button-ios-primary.activated,
    .toolbar-ios-light .bar-button-clear-ios-primary.activated {
        opacity: .4;
    }

.toolbar-ios-light .bar-button-outline-ios-primary {
    border-color: #488aff;
    color: #488aff;
    background-color: transparent;
}

    .toolbar-ios-light .bar-button-outline-ios-primary.activated {
        color: #fff;
        background-color: #488aff;
    }

.toolbar-ios-light .bar-button-solid-ios-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-ios-light .bar-button-solid-ios-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-ios-light .bar-button-secondary-ios,
.toolbar-ios-light .bar-button-default.bar-button-ios-secondary,
.toolbar-ios-light .bar-button-clear-ios-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-ios-light .bar-button-secondary-ios:hover:not(.disable-hover),
    .toolbar-ios-light .bar-button-default.bar-button-ios-secondary:hover:not(.disable-hover),
    .toolbar-ios-light .bar-button-clear-ios-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

    .toolbar-ios-light .bar-button-secondary-ios.activated,
    .toolbar-ios-light .bar-button-default.bar-button-ios-secondary.activated,
    .toolbar-ios-light .bar-button-clear-ios-secondary.activated {
        opacity: .4;
    }

.toolbar-ios-light .bar-button-outline-ios-secondary {
    border-color: #32db64;
    color: #32db64;
    background-color: transparent;
}

    .toolbar-ios-light .bar-button-outline-ios-secondary.activated {
        color: #fff;
        background-color: #32db64;
    }

.toolbar-ios-light .bar-button-solid-ios-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-ios-light .bar-button-solid-ios-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-ios-light .bar-button-danger-ios,
.toolbar-ios-light .bar-button-default.bar-button-ios-danger,
.toolbar-ios-light .bar-button-clear-ios-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-ios-light .bar-button-danger-ios:hover:not(.disable-hover),
    .toolbar-ios-light .bar-button-default.bar-button-ios-danger:hover:not(.disable-hover),
    .toolbar-ios-light .bar-button-clear-ios-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

    .toolbar-ios-light .bar-button-danger-ios.activated,
    .toolbar-ios-light .bar-button-default.bar-button-ios-danger.activated,
    .toolbar-ios-light .bar-button-clear-ios-danger.activated {
        opacity: .4;
    }

.toolbar-ios-light .bar-button-outline-ios-danger {
    border-color: #f53d3d;
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-ios-light .bar-button-outline-ios-danger.activated {
        color: #fff;
        background-color: #f53d3d;
    }

.toolbar-ios-light .bar-button-solid-ios-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-ios-light .bar-button-solid-ios-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-ios-light .bar-button-light-ios,
.toolbar-ios-light .bar-button-default.bar-button-ios-light,
.toolbar-ios-light .bar-button-clear-ios-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-ios-light .bar-button-light-ios:hover:not(.disable-hover),
    .toolbar-ios-light .bar-button-default.bar-button-ios-light:hover:not(.disable-hover),
    .toolbar-ios-light .bar-button-clear-ios-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

    .toolbar-ios-light .bar-button-light-ios.activated,
    .toolbar-ios-light .bar-button-default.bar-button-ios-light.activated,
    .toolbar-ios-light .bar-button-clear-ios-light.activated {
        opacity: .4;
    }

.toolbar-ios-light .bar-button-outline-ios-light {
    border-color: #f4f4f4;
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-ios-light .bar-button-outline-ios-light.activated {
        color: #000;
        background-color: #f4f4f4;
    }

.toolbar-ios-light .bar-button-solid-ios-light {
    color: #000;
    background-color: #f4f4f4;
}

    .toolbar-ios-light .bar-button-solid-ios-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-ios-light .bar-button-dark-ios,
.toolbar-ios-light .bar-button-default.bar-button-ios-dark,
.toolbar-ios-light .bar-button-clear-ios-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-ios-light .bar-button-dark-ios:hover:not(.disable-hover),
    .toolbar-ios-light .bar-button-default.bar-button-ios-dark:hover:not(.disable-hover),
    .toolbar-ios-light .bar-button-clear-ios-dark:hover:not(.disable-hover) {
        color: #222;
    }

    .toolbar-ios-light .bar-button-dark-ios.activated,
    .toolbar-ios-light .bar-button-default.bar-button-ios-dark.activated,
    .toolbar-ios-light .bar-button-clear-ios-dark.activated {
        opacity: .4;
    }

.toolbar-ios-light .bar-button-outline-ios-dark {
    border-color: #222;
    color: #222;
    background-color: transparent;
}

    .toolbar-ios-light .bar-button-outline-ios-dark.activated {
        color: #fff;
        background-color: #222;
    }

.toolbar-ios-light .bar-button-solid-ios-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-ios-light .bar-button-solid-ios-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-light-ios,
.bar-button-default.bar-button-ios-light,
.bar-button-clear-ios-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .bar-button-light-ios:hover:not(.disable-hover),
    .bar-button-default.bar-button-ios-light:hover:not(.disable-hover),
    .bar-button-clear-ios-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

    .bar-button-light-ios.activated,
    .bar-button-default.bar-button-ios-light.activated,
    .bar-button-clear-ios-light.activated {
        opacity: .4;
    }

.bar-button-outline-ios-light {
    border-color: #f4f4f4;
    color: #f4f4f4;
    background-color: transparent;
}

    .bar-button-outline-ios-light.activated {
        color: #000;
        background-color: #f4f4f4;
    }

.bar-button-solid-ios-light {
    color: #000;
    background-color: #f4f4f4;
}

    .bar-button-solid-ios-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-ios-dark .toolbar-background-ios {
    background: #222;
}

.toolbar-ios-dark .toolbar-title-ios,
.toolbar-ios-dark .bar-button-clear-ios,
.toolbar-ios-dark .bar-button-default-ios {
    color: #fff;
}

.toolbar-ios-dark .bar-button-primary-ios,
.toolbar-ios-dark .bar-button-default.bar-button-ios-primary,
.toolbar-ios-dark .bar-button-clear-ios-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-ios-dark .bar-button-primary-ios:hover:not(.disable-hover),
    .toolbar-ios-dark .bar-button-default.bar-button-ios-primary:hover:not(.disable-hover),
    .toolbar-ios-dark .bar-button-clear-ios-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

    .toolbar-ios-dark .bar-button-primary-ios.activated,
    .toolbar-ios-dark .bar-button-default.bar-button-ios-primary.activated,
    .toolbar-ios-dark .bar-button-clear-ios-primary.activated {
        opacity: .4;
    }

.toolbar-ios-dark .bar-button-outline-ios-primary {
    border-color: #488aff;
    color: #488aff;
    background-color: transparent;
}

    .toolbar-ios-dark .bar-button-outline-ios-primary.activated {
        color: #fff;
        background-color: #488aff;
    }

.toolbar-ios-dark .bar-button-solid-ios-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-ios-dark .bar-button-solid-ios-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-ios-dark .bar-button-secondary-ios,
.toolbar-ios-dark .bar-button-default.bar-button-ios-secondary,
.toolbar-ios-dark .bar-button-clear-ios-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-ios-dark .bar-button-secondary-ios:hover:not(.disable-hover),
    .toolbar-ios-dark .bar-button-default.bar-button-ios-secondary:hover:not(.disable-hover),
    .toolbar-ios-dark .bar-button-clear-ios-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

    .toolbar-ios-dark .bar-button-secondary-ios.activated,
    .toolbar-ios-dark .bar-button-default.bar-button-ios-secondary.activated,
    .toolbar-ios-dark .bar-button-clear-ios-secondary.activated {
        opacity: .4;
    }

.toolbar-ios-dark .bar-button-outline-ios-secondary {
    border-color: #32db64;
    color: #32db64;
    background-color: transparent;
}

    .toolbar-ios-dark .bar-button-outline-ios-secondary.activated {
        color: #fff;
        background-color: #32db64;
    }

.toolbar-ios-dark .bar-button-solid-ios-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-ios-dark .bar-button-solid-ios-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-ios-dark .bar-button-danger-ios,
.toolbar-ios-dark .bar-button-default.bar-button-ios-danger,
.toolbar-ios-dark .bar-button-clear-ios-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-ios-dark .bar-button-danger-ios:hover:not(.disable-hover),
    .toolbar-ios-dark .bar-button-default.bar-button-ios-danger:hover:not(.disable-hover),
    .toolbar-ios-dark .bar-button-clear-ios-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

    .toolbar-ios-dark .bar-button-danger-ios.activated,
    .toolbar-ios-dark .bar-button-default.bar-button-ios-danger.activated,
    .toolbar-ios-dark .bar-button-clear-ios-danger.activated {
        opacity: .4;
    }

.toolbar-ios-dark .bar-button-outline-ios-danger {
    border-color: #f53d3d;
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-ios-dark .bar-button-outline-ios-danger.activated {
        color: #fff;
        background-color: #f53d3d;
    }

.toolbar-ios-dark .bar-button-solid-ios-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-ios-dark .bar-button-solid-ios-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-ios-dark .bar-button-light-ios,
.toolbar-ios-dark .bar-button-default.bar-button-ios-light,
.toolbar-ios-dark .bar-button-clear-ios-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-ios-dark .bar-button-light-ios:hover:not(.disable-hover),
    .toolbar-ios-dark .bar-button-default.bar-button-ios-light:hover:not(.disable-hover),
    .toolbar-ios-dark .bar-button-clear-ios-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

    .toolbar-ios-dark .bar-button-light-ios.activated,
    .toolbar-ios-dark .bar-button-default.bar-button-ios-light.activated,
    .toolbar-ios-dark .bar-button-clear-ios-light.activated {
        opacity: .4;
    }

.toolbar-ios-dark .bar-button-outline-ios-light {
    border-color: #f4f4f4;
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-ios-dark .bar-button-outline-ios-light.activated {
        color: #000;
        background-color: #f4f4f4;
    }

.toolbar-ios-dark .bar-button-solid-ios-light {
    color: #000;
    background-color: #f4f4f4;
}

    .toolbar-ios-dark .bar-button-solid-ios-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-ios-dark .bar-button-dark-ios,
.toolbar-ios-dark .bar-button-default.bar-button-ios-dark,
.toolbar-ios-dark .bar-button-clear-ios-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-ios-dark .bar-button-dark-ios:hover:not(.disable-hover),
    .toolbar-ios-dark .bar-button-default.bar-button-ios-dark:hover:not(.disable-hover),
    .toolbar-ios-dark .bar-button-clear-ios-dark:hover:not(.disable-hover) {
        color: #222;
    }

    .toolbar-ios-dark .bar-button-dark-ios.activated,
    .toolbar-ios-dark .bar-button-default.bar-button-ios-dark.activated,
    .toolbar-ios-dark .bar-button-clear-ios-dark.activated {
        opacity: .4;
    }

.toolbar-ios-dark .bar-button-outline-ios-dark {
    border-color: #222;
    color: #222;
    background-color: transparent;
}

    .toolbar-ios-dark .bar-button-outline-ios-dark.activated {
        color: #fff;
        background-color: #222;
    }

.toolbar-ios-dark .bar-button-solid-ios-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-ios-dark .bar-button-solid-ios-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-dark-ios,
.bar-button-default.bar-button-ios-dark,
.bar-button-clear-ios-dark {
    color: #222;
    background-color: transparent;
}

    .bar-button-dark-ios:hover:not(.disable-hover),
    .bar-button-default.bar-button-ios-dark:hover:not(.disable-hover),
    .bar-button-clear-ios-dark:hover:not(.disable-hover) {
        color: #222;
    }

    .bar-button-dark-ios.activated,
    .bar-button-default.bar-button-ios-dark.activated,
    .bar-button-clear-ios-dark.activated {
        opacity: .4;
    }

.bar-button-outline-ios-dark {
    border-color: #222;
    color: #222;
    background-color: transparent;
}

    .bar-button-outline-ios-dark.activated {
        color: #fff;
        background-color: #222;
    }

.bar-button-solid-ios-dark {
    color: #fff;
    background-color: #222;
}

    .bar-button-solid-ios-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-strong-ios {
    font-weight: 600;
}

.toolbar-md {
    padding: 4px;
    min-height: 56px;
}

.toolbar-background-md {
    border-color: #b2b2b2;
    background: #f8f8f8;
}

.header-md::after,
.tabs-md[tabsPlacement="top"] > .tabbar::after,
.footer-md::before,
.tabs-md[tabsPlacement="bottom"] > .tabbar::before {
    left: 0;
    bottom: -5px;
    background-position: left 0 top -2px;
    position: absolute;
    width: 100%;
    height: 5px;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAHBAMAAADzDtBxAAAAD1BMVEUAAAAAAAAAAAAAAAAAAABPDueNAAAABXRSTlMUCS0gBIh/TXEAAAAaSURBVAjXYxCEAgY4UIICBmMogMsgFLtAAQCNSwXZKOdPxgAAAABJRU5ErkJggg==);
    background-repeat: repeat-x;
    content: "";
}

.footer-md::before,
.tabs-md[tabsPlacement="bottom"] > .tabbar::before {
    top: -2px;
    bottom: auto;
    background-position: left 0 top 0;
    height: 2px;
}

.header-md[no-border]::after,
.footer-md[no-border]::before,
.tabs-md[tabsPlacement="top"][no-border] > .tabbar::after,
.tabs-md[tabsPlacement="bottom"][no-border] > .tabbar::before {
    display: none;
}

.toolbar-content-md {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-ordinal-group: 4;
    -webkit-order: 3;
    -ms-flex-order: 3;
    order: 3;
    min-width: 0;
    max-width: 100%;
}

.toolbar-title-md {
    padding: 0 12px;
    font-size: 2rem;
    font-weight: 500;
    color: #424242;
}

.bar-buttons-md {
    -webkit-box-ordinal-group: 5;
    -webkit-order: 4;
    -ms-flex-order: 4;
    order: 4;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

    .bar-buttons-md[left] {
        -webkit-box-ordinal-group: 3;
        -webkit-order: 2;
        -ms-flex-order: 2;
        order: 2;
    }

.bar-button-md:first-child {
    margin-left: 0;
}

.bar-buttons-md[end] {
    text-align: right;
    text-align: end;
    -webkit-box-ordinal-group: 6;
    -webkit-order: 5;
    -ms-flex-order: 5;
    order: 5;
}

.bar-buttons-md[right] {
    text-align: right;
    -webkit-box-ordinal-group: 7;
    -webkit-order: 6;
    -ms-flex-order: 6;
    order: 6;
}

.bar-button-md {
    margin: 0 0.2rem;
    padding: 0 5px;
    border-radius: 2px;
    height: 32px;
    border: 0;
    font-size: 1.4rem;
    font-weight: 500;
    text-transform: uppercase;
}

.bar-button-solid-md,
.bar-button-outline-md {
    overflow: hidden;
}

.bar-button-outline-md {
    border-width: 1px;
    border-style: solid;
    border-color: #424242;
    color: #424242;
    background-color: transparent;
}

    .bar-button-outline-md:hover:not(.disable-hover) {
        opacity: .4;
    }

    .bar-button-outline-md.activated {
        background-color: transparent;
    }

    .bar-button-outline-md .button-effect {
        background-color: #424242;
    }

.bar-button-solid-md {
    color: #fff;
    background-color: #424242;
}

    .bar-button-solid-md:hover:not(.disable-hover) {
        color: #fff;
    }

    .bar-button-solid-md.activated {
        color: #fff;
        background-color: #515151;
    }

.bar-button-md.bar-button-icon-start ion-icon {
    padding-right: 0.3em;
    font-size: 1.4em;
    line-height: .67;
    pointer-events: none;
}

.bar-button-md.bar-button-icon-end ion-icon {
    padding-left: 0.4em;
    font-size: 1.4em;
    line-height: .67;
    pointer-events: none;
}

.bar-button-md[icon-only] {
    padding: 0;
}

    .bar-button-md[icon-only] ion-icon {
        padding: 0 0.1em;
        min-width: 28px;
        font-size: 1.8em;
        line-height: .67;
        pointer-events: none;
    }

.back-button-md {
    margin: 0 6px;
    min-width: 44px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.back-button-icon-md {
    margin: 0;
    padding: 0 6px;
    text-align: left;
    text-align: start;
    font-size: 2.4rem;
    font-weight: normal;
}

.bar-button-menutoggle-md {
    margin: 0 6px;
    padding: 0 2px;
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
    min-width: 44px;
}

    .bar-button-menutoggle-md ion-icon {
        padding: 0 6px;
        font-size: 2.4rem;
    }

    .bar-button-menutoggle-md[end],
    .bar-button-menutoggle-md[right] {
        margin: 0 2px;
        -webkit-box-ordinal-group: 8;
        -webkit-order: 7;
        -ms-flex-order: 7;
        order: 7;
        min-width: 28px;
    }

.bar-button-default-md,
.bar-button-clear-md-default,
.bar-button-md-default {
    color: #424242;
    background-color: transparent;
}

    .bar-button-default-md:hover:not(.disable-hover),
    .bar-button-clear-md-default:hover:not(.disable-hover),
    .bar-button-md-default:hover:not(.disable-hover) {
        color: #424242;
    }

.bar-button-clear-md,
.bar-button-clear-md-clear,
.bar-button-md-clear {
    color: #424242;
    background-color: transparent;
}

    .bar-button-clear-md:hover:not(.disable-hover),
    .bar-button-clear-md-clear:hover:not(.disable-hover),
    .bar-button-md-clear:hover:not(.disable-hover) {
        color: #424242;
    }

.toolbar-md-primary .toolbar-background-md {
    background: #488aff;
}

.toolbar-md-primary .bar-button-clear-md,
.toolbar-md-primary .bar-button-default-md,
.toolbar-md-primary .bar-button-outline-md,
.toolbar-md-primary .toolbar-title-md {
    color: #fff;
}

    .toolbar-md-primary .bar-button-clear-md .button-effect,
    .toolbar-md-primary .bar-button-default-md .button-effect,
    .toolbar-md-primary .bar-button-outline-md .button-effect {
        background-color: #fff;
    }

.toolbar-md-primary .bar-button-outline-md {
    border-color: #fff;
}

.toolbar-md-primary .bar-button-primary-md,
.toolbar-md-primary .bar-button-clear-md-primary,
.toolbar-md-primary .bar-button-md-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-md-primary .bar-button-primary-md:hover:not(.disable-hover),
    .toolbar-md-primary .bar-button-clear-md-primary:hover:not(.disable-hover),
    .toolbar-md-primary .bar-button-md-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.toolbar-md-primary .bar-button-outline-md-primary {
    border-color: #427feb;
    color: #427feb;
    background-color: transparent;
}

    .toolbar-md-primary .bar-button-outline-md-primary.activated {
        background-color: transparent;
    }

    .toolbar-md-primary .bar-button-outline-md-primary .button-effect {
        background-color: #427feb;
    }

.toolbar-md-primary .bar-button-solid-md-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-md-primary .bar-button-solid-md-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-md-primary .bar-button-secondary-md,
.toolbar-md-primary .bar-button-clear-md-secondary,
.toolbar-md-primary .bar-button-md-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-md-primary .bar-button-secondary-md:hover:not(.disable-hover),
    .toolbar-md-primary .bar-button-clear-md-secondary:hover:not(.disable-hover),
    .toolbar-md-primary .bar-button-md-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.toolbar-md-primary .bar-button-outline-md-secondary {
    border-color: #2ec95c;
    color: #2ec95c;
    background-color: transparent;
}

    .toolbar-md-primary .bar-button-outline-md-secondary.activated {
        background-color: transparent;
    }

    .toolbar-md-primary .bar-button-outline-md-secondary .button-effect {
        background-color: #2ec95c;
    }

.toolbar-md-primary .bar-button-solid-md-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-md-primary .bar-button-solid-md-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-md-primary .bar-button-danger-md,
.toolbar-md-primary .bar-button-clear-md-danger,
.toolbar-md-primary .bar-button-md-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-md-primary .bar-button-danger-md:hover:not(.disable-hover),
    .toolbar-md-primary .bar-button-clear-md-danger:hover:not(.disable-hover),
    .toolbar-md-primary .bar-button-md-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.toolbar-md-primary .bar-button-outline-md-danger {
    border-color: #e13838;
    color: #e13838;
    background-color: transparent;
}

    .toolbar-md-primary .bar-button-outline-md-danger.activated {
        background-color: transparent;
    }

    .toolbar-md-primary .bar-button-outline-md-danger .button-effect {
        background-color: #e13838;
    }

.toolbar-md-primary .bar-button-solid-md-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-md-primary .bar-button-solid-md-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-md-primary .bar-button-light-md,
.toolbar-md-primary .bar-button-clear-md-light,
.toolbar-md-primary .bar-button-md-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-md-primary .bar-button-light-md:hover:not(.disable-hover),
    .toolbar-md-primary .bar-button-clear-md-light:hover:not(.disable-hover),
    .toolbar-md-primary .bar-button-md-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.toolbar-md-primary .bar-button-outline-md-light {
    border-color: #e0e0e0;
    color: #e0e0e0;
    background-color: transparent;
}

    .toolbar-md-primary .bar-button-outline-md-light.activated {
        background-color: transparent;
    }

    .toolbar-md-primary .bar-button-outline-md-light .button-effect {
        background-color: #e0e0e0;
    }

.toolbar-md-primary .bar-button-solid-md-light {
    color: #424242;
    background-color: #f4f4f4;
}

    .toolbar-md-primary .bar-button-solid-md-light.activated {
        color: #424242;
        background-color: #e0e0e0;
    }

.toolbar-md-primary .bar-button-dark-md,
.toolbar-md-primary .bar-button-clear-md-dark,
.toolbar-md-primary .bar-button-md-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-md-primary .bar-button-dark-md:hover:not(.disable-hover),
    .toolbar-md-primary .bar-button-clear-md-dark:hover:not(.disable-hover),
    .toolbar-md-primary .bar-button-md-dark:hover:not(.disable-hover) {
        color: #222;
    }

.toolbar-md-primary .bar-button-outline-md-dark {
    border-color: #343434;
    color: #343434;
    background-color: transparent;
}

    .toolbar-md-primary .bar-button-outline-md-dark.activated {
        background-color: transparent;
    }

    .toolbar-md-primary .bar-button-outline-md-dark .button-effect {
        background-color: #343434;
    }

.toolbar-md-primary .bar-button-solid-md-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-md-primary .bar-button-solid-md-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-primary-md,
.bar-button-clear-md-primary,
.bar-button-md-primary {
    color: #488aff;
    background-color: transparent;
}

    .bar-button-primary-md:hover:not(.disable-hover),
    .bar-button-clear-md-primary:hover:not(.disable-hover),
    .bar-button-md-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.bar-button-outline-md-primary {
    border-color: #427feb;
    color: #427feb;
    background-color: transparent;
}

    .bar-button-outline-md-primary.activated {
        background-color: transparent;
    }

    .bar-button-outline-md-primary .button-effect {
        background-color: #427feb;
    }

.bar-button-solid-md-primary {
    color: #fff;
    background-color: #488aff;
}

    .bar-button-solid-md-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-md-secondary .toolbar-background-md {
    background: #32db64;
}

.toolbar-md-secondary .bar-button-clear-md,
.toolbar-md-secondary .bar-button-default-md,
.toolbar-md-secondary .bar-button-outline-md,
.toolbar-md-secondary .toolbar-title-md {
    color: #fff;
}

    .toolbar-md-secondary .bar-button-clear-md .button-effect,
    .toolbar-md-secondary .bar-button-default-md .button-effect,
    .toolbar-md-secondary .bar-button-outline-md .button-effect {
        background-color: #fff;
    }

.toolbar-md-secondary .bar-button-outline-md {
    border-color: #fff;
}

.toolbar-md-secondary .bar-button-primary-md,
.toolbar-md-secondary .bar-button-clear-md-primary,
.toolbar-md-secondary .bar-button-md-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-md-secondary .bar-button-primary-md:hover:not(.disable-hover),
    .toolbar-md-secondary .bar-button-clear-md-primary:hover:not(.disable-hover),
    .toolbar-md-secondary .bar-button-md-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.toolbar-md-secondary .bar-button-outline-md-primary {
    border-color: #427feb;
    color: #427feb;
    background-color: transparent;
}

    .toolbar-md-secondary .bar-button-outline-md-primary.activated {
        background-color: transparent;
    }

    .toolbar-md-secondary .bar-button-outline-md-primary .button-effect {
        background-color: #427feb;
    }

.toolbar-md-secondary .bar-button-solid-md-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-md-secondary .bar-button-solid-md-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-md-secondary .bar-button-secondary-md,
.toolbar-md-secondary .bar-button-clear-md-secondary,
.toolbar-md-secondary .bar-button-md-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-md-secondary .bar-button-secondary-md:hover:not(.disable-hover),
    .toolbar-md-secondary .bar-button-clear-md-secondary:hover:not(.disable-hover),
    .toolbar-md-secondary .bar-button-md-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.toolbar-md-secondary .bar-button-outline-md-secondary {
    border-color: #2ec95c;
    color: #2ec95c;
    background-color: transparent;
}

    .toolbar-md-secondary .bar-button-outline-md-secondary.activated {
        background-color: transparent;
    }

    .toolbar-md-secondary .bar-button-outline-md-secondary .button-effect {
        background-color: #2ec95c;
    }

.toolbar-md-secondary .bar-button-solid-md-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-md-secondary .bar-button-solid-md-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-md-secondary .bar-button-danger-md,
.toolbar-md-secondary .bar-button-clear-md-danger,
.toolbar-md-secondary .bar-button-md-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-md-secondary .bar-button-danger-md:hover:not(.disable-hover),
    .toolbar-md-secondary .bar-button-clear-md-danger:hover:not(.disable-hover),
    .toolbar-md-secondary .bar-button-md-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.toolbar-md-secondary .bar-button-outline-md-danger {
    border-color: #e13838;
    color: #e13838;
    background-color: transparent;
}

    .toolbar-md-secondary .bar-button-outline-md-danger.activated {
        background-color: transparent;
    }

    .toolbar-md-secondary .bar-button-outline-md-danger .button-effect {
        background-color: #e13838;
    }

.toolbar-md-secondary .bar-button-solid-md-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-md-secondary .bar-button-solid-md-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-md-secondary .bar-button-light-md,
.toolbar-md-secondary .bar-button-clear-md-light,
.toolbar-md-secondary .bar-button-md-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-md-secondary .bar-button-light-md:hover:not(.disable-hover),
    .toolbar-md-secondary .bar-button-clear-md-light:hover:not(.disable-hover),
    .toolbar-md-secondary .bar-button-md-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.toolbar-md-secondary .bar-button-outline-md-light {
    border-color: #e0e0e0;
    color: #e0e0e0;
    background-color: transparent;
}

    .toolbar-md-secondary .bar-button-outline-md-light.activated {
        background-color: transparent;
    }

    .toolbar-md-secondary .bar-button-outline-md-light .button-effect {
        background-color: #e0e0e0;
    }

.toolbar-md-secondary .bar-button-solid-md-light {
    color: #424242;
    background-color: #f4f4f4;
}

    .toolbar-md-secondary .bar-button-solid-md-light.activated {
        color: #424242;
        background-color: #e0e0e0;
    }

.toolbar-md-secondary .bar-button-dark-md,
.toolbar-md-secondary .bar-button-clear-md-dark,
.toolbar-md-secondary .bar-button-md-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-md-secondary .bar-button-dark-md:hover:not(.disable-hover),
    .toolbar-md-secondary .bar-button-clear-md-dark:hover:not(.disable-hover),
    .toolbar-md-secondary .bar-button-md-dark:hover:not(.disable-hover) {
        color: #222;
    }

.toolbar-md-secondary .bar-button-outline-md-dark {
    border-color: #343434;
    color: #343434;
    background-color: transparent;
}

    .toolbar-md-secondary .bar-button-outline-md-dark.activated {
        background-color: transparent;
    }

    .toolbar-md-secondary .bar-button-outline-md-dark .button-effect {
        background-color: #343434;
    }

.toolbar-md-secondary .bar-button-solid-md-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-md-secondary .bar-button-solid-md-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-secondary-md,
.bar-button-clear-md-secondary,
.bar-button-md-secondary {
    color: #32db64;
    background-color: transparent;
}

    .bar-button-secondary-md:hover:not(.disable-hover),
    .bar-button-clear-md-secondary:hover:not(.disable-hover),
    .bar-button-md-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.bar-button-outline-md-secondary {
    border-color: #2ec95c;
    color: #2ec95c;
    background-color: transparent;
}

    .bar-button-outline-md-secondary.activated {
        background-color: transparent;
    }

    .bar-button-outline-md-secondary .button-effect {
        background-color: #2ec95c;
    }

.bar-button-solid-md-secondary {
    color: #fff;
    background-color: #32db64;
}

    .bar-button-solid-md-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-md-danger .toolbar-background-md {
    background: #f53d3d;
}

.toolbar-md-danger .bar-button-clear-md,
.toolbar-md-danger .bar-button-default-md,
.toolbar-md-danger .bar-button-outline-md,
.toolbar-md-danger .toolbar-title-md {
    color: #fff;
}

    .toolbar-md-danger .bar-button-clear-md .button-effect,
    .toolbar-md-danger .bar-button-default-md .button-effect,
    .toolbar-md-danger .bar-button-outline-md .button-effect {
        background-color: #fff;
    }

.toolbar-md-danger .bar-button-outline-md {
    border-color: #fff;
}

.toolbar-md-danger .bar-button-primary-md,
.toolbar-md-danger .bar-button-clear-md-primary,
.toolbar-md-danger .bar-button-md-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-md-danger .bar-button-primary-md:hover:not(.disable-hover),
    .toolbar-md-danger .bar-button-clear-md-primary:hover:not(.disable-hover),
    .toolbar-md-danger .bar-button-md-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.toolbar-md-danger .bar-button-outline-md-primary {
    border-color: #427feb;
    color: #427feb;
    background-color: transparent;
}

    .toolbar-md-danger .bar-button-outline-md-primary.activated {
        background-color: transparent;
    }

    .toolbar-md-danger .bar-button-outline-md-primary .button-effect {
        background-color: #427feb;
    }

.toolbar-md-danger .bar-button-solid-md-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-md-danger .bar-button-solid-md-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-md-danger .bar-button-secondary-md,
.toolbar-md-danger .bar-button-clear-md-secondary,
.toolbar-md-danger .bar-button-md-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-md-danger .bar-button-secondary-md:hover:not(.disable-hover),
    .toolbar-md-danger .bar-button-clear-md-secondary:hover:not(.disable-hover),
    .toolbar-md-danger .bar-button-md-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.toolbar-md-danger .bar-button-outline-md-secondary {
    border-color: #2ec95c;
    color: #2ec95c;
    background-color: transparent;
}

    .toolbar-md-danger .bar-button-outline-md-secondary.activated {
        background-color: transparent;
    }

    .toolbar-md-danger .bar-button-outline-md-secondary .button-effect {
        background-color: #2ec95c;
    }

.toolbar-md-danger .bar-button-solid-md-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-md-danger .bar-button-solid-md-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-md-danger .bar-button-danger-md,
.toolbar-md-danger .bar-button-clear-md-danger,
.toolbar-md-danger .bar-button-md-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-md-danger .bar-button-danger-md:hover:not(.disable-hover),
    .toolbar-md-danger .bar-button-clear-md-danger:hover:not(.disable-hover),
    .toolbar-md-danger .bar-button-md-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.toolbar-md-danger .bar-button-outline-md-danger {
    border-color: #e13838;
    color: #e13838;
    background-color: transparent;
}

    .toolbar-md-danger .bar-button-outline-md-danger.activated {
        background-color: transparent;
    }

    .toolbar-md-danger .bar-button-outline-md-danger .button-effect {
        background-color: #e13838;
    }

.toolbar-md-danger .bar-button-solid-md-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-md-danger .bar-button-solid-md-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-md-danger .bar-button-light-md,
.toolbar-md-danger .bar-button-clear-md-light,
.toolbar-md-danger .bar-button-md-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-md-danger .bar-button-light-md:hover:not(.disable-hover),
    .toolbar-md-danger .bar-button-clear-md-light:hover:not(.disable-hover),
    .toolbar-md-danger .bar-button-md-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.toolbar-md-danger .bar-button-outline-md-light {
    border-color: #e0e0e0;
    color: #e0e0e0;
    background-color: transparent;
}

    .toolbar-md-danger .bar-button-outline-md-light.activated {
        background-color: transparent;
    }

    .toolbar-md-danger .bar-button-outline-md-light .button-effect {
        background-color: #e0e0e0;
    }

.toolbar-md-danger .bar-button-solid-md-light {
    color: #424242;
    background-color: #f4f4f4;
}

    .toolbar-md-danger .bar-button-solid-md-light.activated {
        color: #424242;
        background-color: #e0e0e0;
    }

.toolbar-md-danger .bar-button-dark-md,
.toolbar-md-danger .bar-button-clear-md-dark,
.toolbar-md-danger .bar-button-md-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-md-danger .bar-button-dark-md:hover:not(.disable-hover),
    .toolbar-md-danger .bar-button-clear-md-dark:hover:not(.disable-hover),
    .toolbar-md-danger .bar-button-md-dark:hover:not(.disable-hover) {
        color: #222;
    }

.toolbar-md-danger .bar-button-outline-md-dark {
    border-color: #343434;
    color: #343434;
    background-color: transparent;
}

    .toolbar-md-danger .bar-button-outline-md-dark.activated {
        background-color: transparent;
    }

    .toolbar-md-danger .bar-button-outline-md-dark .button-effect {
        background-color: #343434;
    }

.toolbar-md-danger .bar-button-solid-md-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-md-danger .bar-button-solid-md-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-danger-md,
.bar-button-clear-md-danger,
.bar-button-md-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .bar-button-danger-md:hover:not(.disable-hover),
    .bar-button-clear-md-danger:hover:not(.disable-hover),
    .bar-button-md-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.bar-button-outline-md-danger {
    border-color: #e13838;
    color: #e13838;
    background-color: transparent;
}

    .bar-button-outline-md-danger.activated {
        background-color: transparent;
    }

    .bar-button-outline-md-danger .button-effect {
        background-color: #e13838;
    }

.bar-button-solid-md-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .bar-button-solid-md-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-md-light .toolbar-background-md {
    background: #f4f4f4;
}

.toolbar-md-light .bar-button-clear-md,
.toolbar-md-light .bar-button-default-md,
.toolbar-md-light .bar-button-outline-md,
.toolbar-md-light .toolbar-title-md {
    color: #424242;
}

    .toolbar-md-light .bar-button-clear-md .button-effect,
    .toolbar-md-light .bar-button-default-md .button-effect,
    .toolbar-md-light .bar-button-outline-md .button-effect {
        background-color: #424242;
    }

.toolbar-md-light .bar-button-outline-md {
    border-color: #424242;
}

.toolbar-md-light .bar-button-primary-md,
.toolbar-md-light .bar-button-clear-md-primary,
.toolbar-md-light .bar-button-md-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-md-light .bar-button-primary-md:hover:not(.disable-hover),
    .toolbar-md-light .bar-button-clear-md-primary:hover:not(.disable-hover),
    .toolbar-md-light .bar-button-md-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.toolbar-md-light .bar-button-outline-md-primary {
    border-color: #427feb;
    color: #427feb;
    background-color: transparent;
}

    .toolbar-md-light .bar-button-outline-md-primary.activated {
        background-color: transparent;
    }

    .toolbar-md-light .bar-button-outline-md-primary .button-effect {
        background-color: #427feb;
    }

.toolbar-md-light .bar-button-solid-md-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-md-light .bar-button-solid-md-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-md-light .bar-button-secondary-md,
.toolbar-md-light .bar-button-clear-md-secondary,
.toolbar-md-light .bar-button-md-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-md-light .bar-button-secondary-md:hover:not(.disable-hover),
    .toolbar-md-light .bar-button-clear-md-secondary:hover:not(.disable-hover),
    .toolbar-md-light .bar-button-md-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.toolbar-md-light .bar-button-outline-md-secondary {
    border-color: #2ec95c;
    color: #2ec95c;
    background-color: transparent;
}

    .toolbar-md-light .bar-button-outline-md-secondary.activated {
        background-color: transparent;
    }

    .toolbar-md-light .bar-button-outline-md-secondary .button-effect {
        background-color: #2ec95c;
    }

.toolbar-md-light .bar-button-solid-md-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-md-light .bar-button-solid-md-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-md-light .bar-button-danger-md,
.toolbar-md-light .bar-button-clear-md-danger,
.toolbar-md-light .bar-button-md-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-md-light .bar-button-danger-md:hover:not(.disable-hover),
    .toolbar-md-light .bar-button-clear-md-danger:hover:not(.disable-hover),
    .toolbar-md-light .bar-button-md-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.toolbar-md-light .bar-button-outline-md-danger {
    border-color: #e13838;
    color: #e13838;
    background-color: transparent;
}

    .toolbar-md-light .bar-button-outline-md-danger.activated {
        background-color: transparent;
    }

    .toolbar-md-light .bar-button-outline-md-danger .button-effect {
        background-color: #e13838;
    }

.toolbar-md-light .bar-button-solid-md-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-md-light .bar-button-solid-md-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-md-light .bar-button-light-md,
.toolbar-md-light .bar-button-clear-md-light,
.toolbar-md-light .bar-button-md-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-md-light .bar-button-light-md:hover:not(.disable-hover),
    .toolbar-md-light .bar-button-clear-md-light:hover:not(.disable-hover),
    .toolbar-md-light .bar-button-md-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.toolbar-md-light .bar-button-outline-md-light {
    border-color: #e0e0e0;
    color: #e0e0e0;
    background-color: transparent;
}

    .toolbar-md-light .bar-button-outline-md-light.activated {
        background-color: transparent;
    }

    .toolbar-md-light .bar-button-outline-md-light .button-effect {
        background-color: #e0e0e0;
    }

.toolbar-md-light .bar-button-solid-md-light {
    color: #424242;
    background-color: #f4f4f4;
}

    .toolbar-md-light .bar-button-solid-md-light.activated {
        color: #424242;
        background-color: #e0e0e0;
    }

.toolbar-md-light .bar-button-dark-md,
.toolbar-md-light .bar-button-clear-md-dark,
.toolbar-md-light .bar-button-md-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-md-light .bar-button-dark-md:hover:not(.disable-hover),
    .toolbar-md-light .bar-button-clear-md-dark:hover:not(.disable-hover),
    .toolbar-md-light .bar-button-md-dark:hover:not(.disable-hover) {
        color: #222;
    }

.toolbar-md-light .bar-button-outline-md-dark {
    border-color: #343434;
    color: #343434;
    background-color: transparent;
}

    .toolbar-md-light .bar-button-outline-md-dark.activated {
        background-color: transparent;
    }

    .toolbar-md-light .bar-button-outline-md-dark .button-effect {
        background-color: #343434;
    }

.toolbar-md-light .bar-button-solid-md-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-md-light .bar-button-solid-md-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-light-md,
.bar-button-clear-md-light,
.bar-button-md-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .bar-button-light-md:hover:not(.disable-hover),
    .bar-button-clear-md-light:hover:not(.disable-hover),
    .bar-button-md-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.bar-button-outline-md-light {
    border-color: #e0e0e0;
    color: #e0e0e0;
    background-color: transparent;
}

    .bar-button-outline-md-light.activated {
        background-color: transparent;
    }

    .bar-button-outline-md-light .button-effect {
        background-color: #e0e0e0;
    }

.bar-button-solid-md-light {
    color: #424242;
    background-color: #f4f4f4;
}

    .bar-button-solid-md-light.activated {
        color: #424242;
        background-color: #e0e0e0;
    }

.toolbar-md-dark .toolbar-background-md {
    background: #222;
}

.toolbar-md-dark .bar-button-clear-md,
.toolbar-md-dark .bar-button-default-md,
.toolbar-md-dark .bar-button-outline-md,
.toolbar-md-dark .toolbar-title-md {
    color: #fff;
}

    .toolbar-md-dark .bar-button-clear-md .button-effect,
    .toolbar-md-dark .bar-button-default-md .button-effect,
    .toolbar-md-dark .bar-button-outline-md .button-effect {
        background-color: #fff;
    }

.toolbar-md-dark .bar-button-outline-md {
    border-color: #fff;
}

.toolbar-md-dark .bar-button-primary-md,
.toolbar-md-dark .bar-button-clear-md-primary,
.toolbar-md-dark .bar-button-md-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-md-dark .bar-button-primary-md:hover:not(.disable-hover),
    .toolbar-md-dark .bar-button-clear-md-primary:hover:not(.disable-hover),
    .toolbar-md-dark .bar-button-md-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.toolbar-md-dark .bar-button-outline-md-primary {
    border-color: #427feb;
    color: #427feb;
    background-color: transparent;
}

    .toolbar-md-dark .bar-button-outline-md-primary.activated {
        background-color: transparent;
    }

    .toolbar-md-dark .bar-button-outline-md-primary .button-effect {
        background-color: #427feb;
    }

.toolbar-md-dark .bar-button-solid-md-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-md-dark .bar-button-solid-md-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-md-dark .bar-button-secondary-md,
.toolbar-md-dark .bar-button-clear-md-secondary,
.toolbar-md-dark .bar-button-md-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-md-dark .bar-button-secondary-md:hover:not(.disable-hover),
    .toolbar-md-dark .bar-button-clear-md-secondary:hover:not(.disable-hover),
    .toolbar-md-dark .bar-button-md-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.toolbar-md-dark .bar-button-outline-md-secondary {
    border-color: #2ec95c;
    color: #2ec95c;
    background-color: transparent;
}

    .toolbar-md-dark .bar-button-outline-md-secondary.activated {
        background-color: transparent;
    }

    .toolbar-md-dark .bar-button-outline-md-secondary .button-effect {
        background-color: #2ec95c;
    }

.toolbar-md-dark .bar-button-solid-md-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-md-dark .bar-button-solid-md-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-md-dark .bar-button-danger-md,
.toolbar-md-dark .bar-button-clear-md-danger,
.toolbar-md-dark .bar-button-md-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-md-dark .bar-button-danger-md:hover:not(.disable-hover),
    .toolbar-md-dark .bar-button-clear-md-danger:hover:not(.disable-hover),
    .toolbar-md-dark .bar-button-md-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.toolbar-md-dark .bar-button-outline-md-danger {
    border-color: #e13838;
    color: #e13838;
    background-color: transparent;
}

    .toolbar-md-dark .bar-button-outline-md-danger.activated {
        background-color: transparent;
    }

    .toolbar-md-dark .bar-button-outline-md-danger .button-effect {
        background-color: #e13838;
    }

.toolbar-md-dark .bar-button-solid-md-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-md-dark .bar-button-solid-md-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-md-dark .bar-button-light-md,
.toolbar-md-dark .bar-button-clear-md-light,
.toolbar-md-dark .bar-button-md-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-md-dark .bar-button-light-md:hover:not(.disable-hover),
    .toolbar-md-dark .bar-button-clear-md-light:hover:not(.disable-hover),
    .toolbar-md-dark .bar-button-md-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.toolbar-md-dark .bar-button-outline-md-light {
    border-color: #e0e0e0;
    color: #e0e0e0;
    background-color: transparent;
}

    .toolbar-md-dark .bar-button-outline-md-light.activated {
        background-color: transparent;
    }

    .toolbar-md-dark .bar-button-outline-md-light .button-effect {
        background-color: #e0e0e0;
    }

.toolbar-md-dark .bar-button-solid-md-light {
    color: #424242;
    background-color: #f4f4f4;
}

    .toolbar-md-dark .bar-button-solid-md-light.activated {
        color: #424242;
        background-color: #e0e0e0;
    }

.toolbar-md-dark .bar-button-dark-md,
.toolbar-md-dark .bar-button-clear-md-dark,
.toolbar-md-dark .bar-button-md-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-md-dark .bar-button-dark-md:hover:not(.disable-hover),
    .toolbar-md-dark .bar-button-clear-md-dark:hover:not(.disable-hover),
    .toolbar-md-dark .bar-button-md-dark:hover:not(.disable-hover) {
        color: #222;
    }

.toolbar-md-dark .bar-button-outline-md-dark {
    border-color: #343434;
    color: #343434;
    background-color: transparent;
}

    .toolbar-md-dark .bar-button-outline-md-dark.activated {
        background-color: transparent;
    }

    .toolbar-md-dark .bar-button-outline-md-dark .button-effect {
        background-color: #343434;
    }

.toolbar-md-dark .bar-button-solid-md-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-md-dark .bar-button-solid-md-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-dark-md,
.bar-button-clear-md-dark,
.bar-button-md-dark {
    color: #222;
    background-color: transparent;
}

    .bar-button-dark-md:hover:not(.disable-hover),
    .bar-button-clear-md-dark:hover:not(.disable-hover),
    .bar-button-md-dark:hover:not(.disable-hover) {
        color: #222;
    }

.bar-button-outline-md-dark {
    border-color: #343434;
    color: #343434;
    background-color: transparent;
}

    .bar-button-outline-md-dark.activated {
        background-color: transparent;
    }

    .bar-button-outline-md-dark .button-effect {
        background-color: #343434;
    }

.bar-button-solid-md-dark {
    color: #fff;
    background-color: #222;
}

    .bar-button-solid-md-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-strong-md {
    font-weight: bold;
}

.toolbar-wp {
    padding: 4px;
    min-height: 46px;
}

.toolbar-background-wp {
    border-color: #b2b2b2;
    background: #f8f8f8;
}

.toolbar-content-wp {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-ordinal-group: 4;
    -webkit-order: 3;
    -ms-flex-order: 3;
    order: 3;
    min-width: 0;
    max-width: 100%;
}

.toolbar-title-wp {
    font-size: 1.5rem;
    font-weight: bold;
    text-transform: uppercase;
    color: #000;
    padding: 0 6px;
}

.bar-buttons-wp {
    -webkit-box-ordinal-group: 5;
    -webkit-order: 4;
    -ms-flex-order: 4;
    order: 4;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

    .bar-buttons-wp[left] {
        -webkit-box-ordinal-group: 3;
        -webkit-order: 2;
        -ms-flex-order: 2;
        order: 2;
    }

        .bar-buttons-wp[left] .bar-button:first-child {
            margin-left: 0;
        }

    .bar-buttons-wp[end] {
        text-align: right;
        text-align: end;
        -webkit-box-ordinal-group: 6;
        -webkit-order: 5;
        -ms-flex-order: 5;
        order: 5;
    }

    .bar-buttons-wp[right] {
        text-align: right;
        -webkit-box-ordinal-group: 7;
        -webkit-order: 6;
        -ms-flex-order: 6;
        order: 6;
    }

.bar-button-wp {
    margin: 0 0.2rem;
    padding: 0 5px;
    border-radius: 2px;
    height: 32px;
    border: 0;
    font-size: 1.4rem;
    font-weight: 500;
    text-transform: uppercase;
}

.bar-button-solid-wp,
.bar-button-outline-wp {
    overflow: hidden;
}

.bar-button-outline-wp {
    border-width: 1px;
    border-style: solid;
    border-color: #000;
    color: #000;
    background-color: transparent;
}

    .bar-button-outline-wp:hover:not(.disable-hover) {
        opacity: .4;
    }

    .bar-button-outline-wp.activated {
        color: #fff;
        background-color: #000;
    }

.bar-button-solid-wp {
    color: #fff;
    background-color: #000;
}

    .bar-button-solid-wp:hover:not(.disable-hover) {
        color: #fff;
    }

    .bar-button-solid-wp.activated {
        color: #fff;
        background-color: #141414;
    }

.bar-button-wp.bar-button-icon-start ion-icon {
    padding-right: 0.3em;
    font-size: 1.4em;
    line-height: .67;
    pointer-events: none;
}

.bar-button-wp.bar-button-icon-end ion-icon {
    padding-left: 0.4em;
    font-size: 1.4em;
    line-height: .67;
    pointer-events: none;
}

.bar-button-wp[icon-only] {
    padding: 0;
}

    .bar-button-wp[icon-only] ion-icon {
        padding: 0 0.1em;
        min-width: 28px;
        font-size: 1.8em;
        line-height: .67;
        pointer-events: none;
    }

.back-button-wp {
    margin: 0 6px;
    min-width: 44px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.back-button-icon-wp {
    text-align: left;
    text-align: start;
    margin: 0;
    padding: 0 6px;
    font-size: 2.4rem;
    font-weight: normal;
}

.bar-button-menutoggle-wp {
    margin: 0 6px;
    padding: 0 2px;
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
    min-width: 44px;
}

    .bar-button-menutoggle-wp ion-icon {
        padding: 0 6px;
        font-size: 2.4rem;
    }

    .bar-button-menutoggle-wp[end],
    .bar-button-menutoggle-wp[right] {
        margin: 0 2px;
        -webkit-box-ordinal-group: 8;
        -webkit-order: 7;
        -ms-flex-order: 7;
        order: 7;
        min-width: 28px;
    }

.bar-button-default-wp,
.bar-button-clear-wp-default,
.bar-button-wp-default {
    color: #000;
    background-color: transparent;
}

    .bar-button-default-wp:hover:not(.disable-hover),
    .bar-button-clear-wp-default:hover:not(.disable-hover),
    .bar-button-wp-default:hover:not(.disable-hover) {
        color: #000;
    }

.bar-button-clear-wp,
.bar-button-clear-wp-clear,
.bar-button-wp-clear {
    color: #000;
    background-color: transparent;
}

    .bar-button-clear-wp:hover:not(.disable-hover),
    .bar-button-clear-wp-clear:hover:not(.disable-hover),
    .bar-button-wp-clear:hover:not(.disable-hover) {
        color: #000;
    }

.toolbar-wp-primary .toolbar-background-wp {
    background: #488aff;
}

.toolbar-wp-primary .bar-button-clear-wp,
.toolbar-wp-primary .bar-button-default-wp,
.toolbar-wp-primary .bar-button-outline-wp,
.toolbar-wp-primary .toolbar-title-wp {
    color: #fff;
}

.toolbar-wp-primary .bar-button-outline-wp {
    border-color: #fff;
}

.toolbar-wp-primary .bar-button-primary-wp,
.toolbar-wp-primary .bar-button-clear-wp-primary,
.toolbar-wp-primary .bar-button-wp-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-wp-primary .bar-button-primary-wp:hover:not(.disable-hover),
    .toolbar-wp-primary .bar-button-clear-wp-primary:hover:not(.disable-hover),
    .toolbar-wp-primary .bar-button-wp-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.toolbar-wp-primary .bar-button-outline-wp-primary {
    border-color: #427feb;
    color: #427feb;
    background-color: transparent;
}

    .toolbar-wp-primary .bar-button-outline-wp-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-wp-primary .bar-button-solid-wp-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-wp-primary .bar-button-solid-wp-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-wp-primary .bar-button-secondary-wp,
.toolbar-wp-primary .bar-button-clear-wp-secondary,
.toolbar-wp-primary .bar-button-wp-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-wp-primary .bar-button-secondary-wp:hover:not(.disable-hover),
    .toolbar-wp-primary .bar-button-clear-wp-secondary:hover:not(.disable-hover),
    .toolbar-wp-primary .bar-button-wp-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.toolbar-wp-primary .bar-button-outline-wp-secondary {
    border-color: #2ec95c;
    color: #2ec95c;
    background-color: transparent;
}

    .toolbar-wp-primary .bar-button-outline-wp-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-wp-primary .bar-button-solid-wp-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-wp-primary .bar-button-solid-wp-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-wp-primary .bar-button-danger-wp,
.toolbar-wp-primary .bar-button-clear-wp-danger,
.toolbar-wp-primary .bar-button-wp-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-wp-primary .bar-button-danger-wp:hover:not(.disable-hover),
    .toolbar-wp-primary .bar-button-clear-wp-danger:hover:not(.disable-hover),
    .toolbar-wp-primary .bar-button-wp-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.toolbar-wp-primary .bar-button-outline-wp-danger {
    border-color: #e13838;
    color: #e13838;
    background-color: transparent;
}

    .toolbar-wp-primary .bar-button-outline-wp-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-wp-primary .bar-button-solid-wp-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-wp-primary .bar-button-solid-wp-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-wp-primary .bar-button-light-wp,
.toolbar-wp-primary .bar-button-clear-wp-light,
.toolbar-wp-primary .bar-button-wp-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-wp-primary .bar-button-light-wp:hover:not(.disable-hover),
    .toolbar-wp-primary .bar-button-clear-wp-light:hover:not(.disable-hover),
    .toolbar-wp-primary .bar-button-wp-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.toolbar-wp-primary .bar-button-outline-wp-light {
    border-color: #e0e0e0;
    color: #e0e0e0;
    background-color: transparent;
}

    .toolbar-wp-primary .bar-button-outline-wp-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-wp-primary .bar-button-solid-wp-light {
    color: #000;
    background-color: #f4f4f4;
}

    .toolbar-wp-primary .bar-button-solid-wp-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-wp-primary .bar-button-dark-wp,
.toolbar-wp-primary .bar-button-clear-wp-dark,
.toolbar-wp-primary .bar-button-wp-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-wp-primary .bar-button-dark-wp:hover:not(.disable-hover),
    .toolbar-wp-primary .bar-button-clear-wp-dark:hover:not(.disable-hover),
    .toolbar-wp-primary .bar-button-wp-dark:hover:not(.disable-hover) {
        color: #222;
    }

.toolbar-wp-primary .bar-button-outline-wp-dark {
    border-color: #343434;
    color: #343434;
    background-color: transparent;
}

    .toolbar-wp-primary .bar-button-outline-wp-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.toolbar-wp-primary .bar-button-solid-wp-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-wp-primary .bar-button-solid-wp-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-primary-wp,
.bar-button-clear-wp-primary,
.bar-button-wp-primary {
    color: #488aff;
    background-color: transparent;
}

    .bar-button-primary-wp:hover:not(.disable-hover),
    .bar-button-clear-wp-primary:hover:not(.disable-hover),
    .bar-button-wp-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.bar-button-outline-wp-primary {
    border-color: #427feb;
    color: #427feb;
    background-color: transparent;
}

    .bar-button-outline-wp-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.bar-button-solid-wp-primary {
    color: #fff;
    background-color: #488aff;
}

    .bar-button-solid-wp-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-wp-secondary .toolbar-background-wp {
    background: #32db64;
}

.toolbar-wp-secondary .bar-button-clear-wp,
.toolbar-wp-secondary .bar-button-default-wp,
.toolbar-wp-secondary .bar-button-outline-wp,
.toolbar-wp-secondary .toolbar-title-wp {
    color: #fff;
}

.toolbar-wp-secondary .bar-button-outline-wp {
    border-color: #fff;
}

.toolbar-wp-secondary .bar-button-primary-wp,
.toolbar-wp-secondary .bar-button-clear-wp-primary,
.toolbar-wp-secondary .bar-button-wp-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-wp-secondary .bar-button-primary-wp:hover:not(.disable-hover),
    .toolbar-wp-secondary .bar-button-clear-wp-primary:hover:not(.disable-hover),
    .toolbar-wp-secondary .bar-button-wp-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.toolbar-wp-secondary .bar-button-outline-wp-primary {
    border-color: #427feb;
    color: #427feb;
    background-color: transparent;
}

    .toolbar-wp-secondary .bar-button-outline-wp-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-wp-secondary .bar-button-solid-wp-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-wp-secondary .bar-button-solid-wp-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-wp-secondary .bar-button-secondary-wp,
.toolbar-wp-secondary .bar-button-clear-wp-secondary,
.toolbar-wp-secondary .bar-button-wp-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-wp-secondary .bar-button-secondary-wp:hover:not(.disable-hover),
    .toolbar-wp-secondary .bar-button-clear-wp-secondary:hover:not(.disable-hover),
    .toolbar-wp-secondary .bar-button-wp-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.toolbar-wp-secondary .bar-button-outline-wp-secondary {
    border-color: #2ec95c;
    color: #2ec95c;
    background-color: transparent;
}

    .toolbar-wp-secondary .bar-button-outline-wp-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-wp-secondary .bar-button-solid-wp-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-wp-secondary .bar-button-solid-wp-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-wp-secondary .bar-button-danger-wp,
.toolbar-wp-secondary .bar-button-clear-wp-danger,
.toolbar-wp-secondary .bar-button-wp-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-wp-secondary .bar-button-danger-wp:hover:not(.disable-hover),
    .toolbar-wp-secondary .bar-button-clear-wp-danger:hover:not(.disable-hover),
    .toolbar-wp-secondary .bar-button-wp-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.toolbar-wp-secondary .bar-button-outline-wp-danger {
    border-color: #e13838;
    color: #e13838;
    background-color: transparent;
}

    .toolbar-wp-secondary .bar-button-outline-wp-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-wp-secondary .bar-button-solid-wp-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-wp-secondary .bar-button-solid-wp-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-wp-secondary .bar-button-light-wp,
.toolbar-wp-secondary .bar-button-clear-wp-light,
.toolbar-wp-secondary .bar-button-wp-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-wp-secondary .bar-button-light-wp:hover:not(.disable-hover),
    .toolbar-wp-secondary .bar-button-clear-wp-light:hover:not(.disable-hover),
    .toolbar-wp-secondary .bar-button-wp-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.toolbar-wp-secondary .bar-button-outline-wp-light {
    border-color: #e0e0e0;
    color: #e0e0e0;
    background-color: transparent;
}

    .toolbar-wp-secondary .bar-button-outline-wp-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-wp-secondary .bar-button-solid-wp-light {
    color: #000;
    background-color: #f4f4f4;
}

    .toolbar-wp-secondary .bar-button-solid-wp-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-wp-secondary .bar-button-dark-wp,
.toolbar-wp-secondary .bar-button-clear-wp-dark,
.toolbar-wp-secondary .bar-button-wp-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-wp-secondary .bar-button-dark-wp:hover:not(.disable-hover),
    .toolbar-wp-secondary .bar-button-clear-wp-dark:hover:not(.disable-hover),
    .toolbar-wp-secondary .bar-button-wp-dark:hover:not(.disable-hover) {
        color: #222;
    }

.toolbar-wp-secondary .bar-button-outline-wp-dark {
    border-color: #343434;
    color: #343434;
    background-color: transparent;
}

    .toolbar-wp-secondary .bar-button-outline-wp-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.toolbar-wp-secondary .bar-button-solid-wp-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-wp-secondary .bar-button-solid-wp-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-secondary-wp,
.bar-button-clear-wp-secondary,
.bar-button-wp-secondary {
    color: #32db64;
    background-color: transparent;
}

    .bar-button-secondary-wp:hover:not(.disable-hover),
    .bar-button-clear-wp-secondary:hover:not(.disable-hover),
    .bar-button-wp-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.bar-button-outline-wp-secondary {
    border-color: #2ec95c;
    color: #2ec95c;
    background-color: transparent;
}

    .bar-button-outline-wp-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.bar-button-solid-wp-secondary {
    color: #fff;
    background-color: #32db64;
}

    .bar-button-solid-wp-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-wp-danger .toolbar-background-wp {
    background: #f53d3d;
}

.toolbar-wp-danger .bar-button-clear-wp,
.toolbar-wp-danger .bar-button-default-wp,
.toolbar-wp-danger .bar-button-outline-wp,
.toolbar-wp-danger .toolbar-title-wp {
    color: #fff;
}

.toolbar-wp-danger .bar-button-outline-wp {
    border-color: #fff;
}

.toolbar-wp-danger .bar-button-primary-wp,
.toolbar-wp-danger .bar-button-clear-wp-primary,
.toolbar-wp-danger .bar-button-wp-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-wp-danger .bar-button-primary-wp:hover:not(.disable-hover),
    .toolbar-wp-danger .bar-button-clear-wp-primary:hover:not(.disable-hover),
    .toolbar-wp-danger .bar-button-wp-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.toolbar-wp-danger .bar-button-outline-wp-primary {
    border-color: #427feb;
    color: #427feb;
    background-color: transparent;
}

    .toolbar-wp-danger .bar-button-outline-wp-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-wp-danger .bar-button-solid-wp-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-wp-danger .bar-button-solid-wp-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-wp-danger .bar-button-secondary-wp,
.toolbar-wp-danger .bar-button-clear-wp-secondary,
.toolbar-wp-danger .bar-button-wp-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-wp-danger .bar-button-secondary-wp:hover:not(.disable-hover),
    .toolbar-wp-danger .bar-button-clear-wp-secondary:hover:not(.disable-hover),
    .toolbar-wp-danger .bar-button-wp-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.toolbar-wp-danger .bar-button-outline-wp-secondary {
    border-color: #2ec95c;
    color: #2ec95c;
    background-color: transparent;
}

    .toolbar-wp-danger .bar-button-outline-wp-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-wp-danger .bar-button-solid-wp-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-wp-danger .bar-button-solid-wp-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-wp-danger .bar-button-danger-wp,
.toolbar-wp-danger .bar-button-clear-wp-danger,
.toolbar-wp-danger .bar-button-wp-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-wp-danger .bar-button-danger-wp:hover:not(.disable-hover),
    .toolbar-wp-danger .bar-button-clear-wp-danger:hover:not(.disable-hover),
    .toolbar-wp-danger .bar-button-wp-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.toolbar-wp-danger .bar-button-outline-wp-danger {
    border-color: #e13838;
    color: #e13838;
    background-color: transparent;
}

    .toolbar-wp-danger .bar-button-outline-wp-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-wp-danger .bar-button-solid-wp-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-wp-danger .bar-button-solid-wp-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-wp-danger .bar-button-light-wp,
.toolbar-wp-danger .bar-button-clear-wp-light,
.toolbar-wp-danger .bar-button-wp-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-wp-danger .bar-button-light-wp:hover:not(.disable-hover),
    .toolbar-wp-danger .bar-button-clear-wp-light:hover:not(.disable-hover),
    .toolbar-wp-danger .bar-button-wp-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.toolbar-wp-danger .bar-button-outline-wp-light {
    border-color: #e0e0e0;
    color: #e0e0e0;
    background-color: transparent;
}

    .toolbar-wp-danger .bar-button-outline-wp-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-wp-danger .bar-button-solid-wp-light {
    color: #000;
    background-color: #f4f4f4;
}

    .toolbar-wp-danger .bar-button-solid-wp-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-wp-danger .bar-button-dark-wp,
.toolbar-wp-danger .bar-button-clear-wp-dark,
.toolbar-wp-danger .bar-button-wp-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-wp-danger .bar-button-dark-wp:hover:not(.disable-hover),
    .toolbar-wp-danger .bar-button-clear-wp-dark:hover:not(.disable-hover),
    .toolbar-wp-danger .bar-button-wp-dark:hover:not(.disable-hover) {
        color: #222;
    }

.toolbar-wp-danger .bar-button-outline-wp-dark {
    border-color: #343434;
    color: #343434;
    background-color: transparent;
}

    .toolbar-wp-danger .bar-button-outline-wp-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.toolbar-wp-danger .bar-button-solid-wp-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-wp-danger .bar-button-solid-wp-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-danger-wp,
.bar-button-clear-wp-danger,
.bar-button-wp-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .bar-button-danger-wp:hover:not(.disable-hover),
    .bar-button-clear-wp-danger:hover:not(.disable-hover),
    .bar-button-wp-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.bar-button-outline-wp-danger {
    border-color: #e13838;
    color: #e13838;
    background-color: transparent;
}

    .bar-button-outline-wp-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.bar-button-solid-wp-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .bar-button-solid-wp-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-wp-light .toolbar-background-wp {
    background: #f4f4f4;
}

.toolbar-wp-light .bar-button-clear-wp,
.toolbar-wp-light .bar-button-default-wp,
.toolbar-wp-light .bar-button-outline-wp,
.toolbar-wp-light .toolbar-title-wp {
    color: #000;
}

.toolbar-wp-light .bar-button-outline-wp {
    border-color: #000;
}

.toolbar-wp-light .bar-button-primary-wp,
.toolbar-wp-light .bar-button-clear-wp-primary,
.toolbar-wp-light .bar-button-wp-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-wp-light .bar-button-primary-wp:hover:not(.disable-hover),
    .toolbar-wp-light .bar-button-clear-wp-primary:hover:not(.disable-hover),
    .toolbar-wp-light .bar-button-wp-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.toolbar-wp-light .bar-button-outline-wp-primary {
    border-color: #427feb;
    color: #427feb;
    background-color: transparent;
}

    .toolbar-wp-light .bar-button-outline-wp-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-wp-light .bar-button-solid-wp-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-wp-light .bar-button-solid-wp-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-wp-light .bar-button-secondary-wp,
.toolbar-wp-light .bar-button-clear-wp-secondary,
.toolbar-wp-light .bar-button-wp-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-wp-light .bar-button-secondary-wp:hover:not(.disable-hover),
    .toolbar-wp-light .bar-button-clear-wp-secondary:hover:not(.disable-hover),
    .toolbar-wp-light .bar-button-wp-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.toolbar-wp-light .bar-button-outline-wp-secondary {
    border-color: #2ec95c;
    color: #2ec95c;
    background-color: transparent;
}

    .toolbar-wp-light .bar-button-outline-wp-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-wp-light .bar-button-solid-wp-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-wp-light .bar-button-solid-wp-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-wp-light .bar-button-danger-wp,
.toolbar-wp-light .bar-button-clear-wp-danger,
.toolbar-wp-light .bar-button-wp-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-wp-light .bar-button-danger-wp:hover:not(.disable-hover),
    .toolbar-wp-light .bar-button-clear-wp-danger:hover:not(.disable-hover),
    .toolbar-wp-light .bar-button-wp-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.toolbar-wp-light .bar-button-outline-wp-danger {
    border-color: #e13838;
    color: #e13838;
    background-color: transparent;
}

    .toolbar-wp-light .bar-button-outline-wp-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-wp-light .bar-button-solid-wp-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-wp-light .bar-button-solid-wp-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-wp-light .bar-button-light-wp,
.toolbar-wp-light .bar-button-clear-wp-light,
.toolbar-wp-light .bar-button-wp-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-wp-light .bar-button-light-wp:hover:not(.disable-hover),
    .toolbar-wp-light .bar-button-clear-wp-light:hover:not(.disable-hover),
    .toolbar-wp-light .bar-button-wp-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.toolbar-wp-light .bar-button-outline-wp-light {
    border-color: #e0e0e0;
    color: #e0e0e0;
    background-color: transparent;
}

    .toolbar-wp-light .bar-button-outline-wp-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-wp-light .bar-button-solid-wp-light {
    color: #000;
    background-color: #f4f4f4;
}

    .toolbar-wp-light .bar-button-solid-wp-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-wp-light .bar-button-dark-wp,
.toolbar-wp-light .bar-button-clear-wp-dark,
.toolbar-wp-light .bar-button-wp-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-wp-light .bar-button-dark-wp:hover:not(.disable-hover),
    .toolbar-wp-light .bar-button-clear-wp-dark:hover:not(.disable-hover),
    .toolbar-wp-light .bar-button-wp-dark:hover:not(.disable-hover) {
        color: #222;
    }

.toolbar-wp-light .bar-button-outline-wp-dark {
    border-color: #343434;
    color: #343434;
    background-color: transparent;
}

    .toolbar-wp-light .bar-button-outline-wp-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.toolbar-wp-light .bar-button-solid-wp-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-wp-light .bar-button-solid-wp-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-light-wp,
.bar-button-clear-wp-light,
.bar-button-wp-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .bar-button-light-wp:hover:not(.disable-hover),
    .bar-button-clear-wp-light:hover:not(.disable-hover),
    .bar-button-wp-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.bar-button-outline-wp-light {
    border-color: #e0e0e0;
    color: #e0e0e0;
    background-color: transparent;
}

    .bar-button-outline-wp-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.bar-button-solid-wp-light {
    color: #000;
    background-color: #f4f4f4;
}

    .bar-button-solid-wp-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-wp-dark .toolbar-background-wp {
    background: #222;
}

.toolbar-wp-dark .bar-button-clear-wp,
.toolbar-wp-dark .bar-button-default-wp,
.toolbar-wp-dark .bar-button-outline-wp,
.toolbar-wp-dark .toolbar-title-wp {
    color: #fff;
}

.toolbar-wp-dark .bar-button-outline-wp {
    border-color: #fff;
}

.toolbar-wp-dark .bar-button-primary-wp,
.toolbar-wp-dark .bar-button-clear-wp-primary,
.toolbar-wp-dark .bar-button-wp-primary {
    color: #488aff;
    background-color: transparent;
}

    .toolbar-wp-dark .bar-button-primary-wp:hover:not(.disable-hover),
    .toolbar-wp-dark .bar-button-clear-wp-primary:hover:not(.disable-hover),
    .toolbar-wp-dark .bar-button-wp-primary:hover:not(.disable-hover) {
        color: #488aff;
    }

.toolbar-wp-dark .bar-button-outline-wp-primary {
    border-color: #427feb;
    color: #427feb;
    background-color: transparent;
}

    .toolbar-wp-dark .bar-button-outline-wp-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-wp-dark .bar-button-solid-wp-primary {
    color: #fff;
    background-color: #488aff;
}

    .toolbar-wp-dark .bar-button-solid-wp-primary.activated {
        color: #fff;
        background-color: #427feb;
    }

.toolbar-wp-dark .bar-button-secondary-wp,
.toolbar-wp-dark .bar-button-clear-wp-secondary,
.toolbar-wp-dark .bar-button-wp-secondary {
    color: #32db64;
    background-color: transparent;
}

    .toolbar-wp-dark .bar-button-secondary-wp:hover:not(.disable-hover),
    .toolbar-wp-dark .bar-button-clear-wp-secondary:hover:not(.disable-hover),
    .toolbar-wp-dark .bar-button-wp-secondary:hover:not(.disable-hover) {
        color: #32db64;
    }

.toolbar-wp-dark .bar-button-outline-wp-secondary {
    border-color: #2ec95c;
    color: #2ec95c;
    background-color: transparent;
}

    .toolbar-wp-dark .bar-button-outline-wp-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-wp-dark .bar-button-solid-wp-secondary {
    color: #fff;
    background-color: #32db64;
}

    .toolbar-wp-dark .bar-button-solid-wp-secondary.activated {
        color: #fff;
        background-color: #2ec95c;
    }

.toolbar-wp-dark .bar-button-danger-wp,
.toolbar-wp-dark .bar-button-clear-wp-danger,
.toolbar-wp-dark .bar-button-wp-danger {
    color: #f53d3d;
    background-color: transparent;
}

    .toolbar-wp-dark .bar-button-danger-wp:hover:not(.disable-hover),
    .toolbar-wp-dark .bar-button-clear-wp-danger:hover:not(.disable-hover),
    .toolbar-wp-dark .bar-button-wp-danger:hover:not(.disable-hover) {
        color: #f53d3d;
    }

.toolbar-wp-dark .bar-button-outline-wp-danger {
    border-color: #e13838;
    color: #e13838;
    background-color: transparent;
}

    .toolbar-wp-dark .bar-button-outline-wp-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-wp-dark .bar-button-solid-wp-danger {
    color: #fff;
    background-color: #f53d3d;
}

    .toolbar-wp-dark .bar-button-solid-wp-danger.activated {
        color: #fff;
        background-color: #e13838;
    }

.toolbar-wp-dark .bar-button-light-wp,
.toolbar-wp-dark .bar-button-clear-wp-light,
.toolbar-wp-dark .bar-button-wp-light {
    color: #f4f4f4;
    background-color: transparent;
}

    .toolbar-wp-dark .bar-button-light-wp:hover:not(.disable-hover),
    .toolbar-wp-dark .bar-button-clear-wp-light:hover:not(.disable-hover),
    .toolbar-wp-dark .bar-button-wp-light:hover:not(.disable-hover) {
        color: #f4f4f4;
    }

.toolbar-wp-dark .bar-button-outline-wp-light {
    border-color: #e0e0e0;
    color: #e0e0e0;
    background-color: transparent;
}

    .toolbar-wp-dark .bar-button-outline-wp-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-wp-dark .bar-button-solid-wp-light {
    color: #000;
    background-color: #f4f4f4;
}

    .toolbar-wp-dark .bar-button-solid-wp-light.activated {
        color: #000;
        background-color: #e0e0e0;
    }

.toolbar-wp-dark .bar-button-dark-wp,
.toolbar-wp-dark .bar-button-clear-wp-dark,
.toolbar-wp-dark .bar-button-wp-dark {
    color: #222;
    background-color: transparent;
}

    .toolbar-wp-dark .bar-button-dark-wp:hover:not(.disable-hover),
    .toolbar-wp-dark .bar-button-clear-wp-dark:hover:not(.disable-hover),
    .toolbar-wp-dark .bar-button-wp-dark:hover:not(.disable-hover) {
        color: #222;
    }

.toolbar-wp-dark .bar-button-outline-wp-dark {
    border-color: #343434;
    color: #343434;
    background-color: transparent;
}

    .toolbar-wp-dark .bar-button-outline-wp-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.toolbar-wp-dark .bar-button-solid-wp-dark {
    color: #fff;
    background-color: #222;
}

    .toolbar-wp-dark .bar-button-solid-wp-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-dark-wp,
.bar-button-clear-wp-dark,
.bar-button-wp-dark {
    color: #222;
    background-color: transparent;
}

    .bar-button-dark-wp:hover:not(.disable-hover),
    .bar-button-clear-wp-dark:hover:not(.disable-hover),
    .bar-button-wp-dark:hover:not(.disable-hover) {
        color: #222;
    }

.bar-button-outline-wp-dark {
    border-color: #343434;
    color: #343434;
    background-color: transparent;
}

    .bar-button-outline-wp-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-solid-wp-dark {
    color: #fff;
    background-color: #222;
}

    .bar-button-solid-wp-dark.activated {
        color: #fff;
        background-color: #343434;
    }

.bar-button-strong-wp {
    font-weight: bold;
}

.text-ios-primary {
    color: #488aff;
}

.text-ios-secondary {
    color: #32db64;
}

.text-ios-danger {
    color: #f53d3d;
}

.text-ios-light {
    color: #f4f4f4;
}

.text-ios-dark {
    color: #222;
}

.text-md-primary {
    color: #488aff;
}

.text-md-secondary {
    color: #32db64;
}

.text-md-danger {
    color: #f53d3d;
}

.text-md-light {
    color: #f4f4f4;
}

.text-md-dark {
    color: #222;
}

.text-wp-primary {
    color: #488aff;
}

.text-wp-secondary {
    color: #32db64;
}

.text-wp-danger {
    color: #f53d3d;
}

.text-wp-light {
    color: #f4f4f4;
}

.text-wp-dark {
    color: #222;
}

.virtual-loading {
    opacity: 0;
}

.virtual-scroll {
    position: relative;
    contain: content;
}

    .virtual-scroll .virtual-position,
    .virtual-scroll .virtual-position.item {
        left: 0;
        top: 0;
        position: absolute;
        -webkit-transition-duration: 0ms;
        transition-duration: 0ms;
        contain: content;
    }

    .virtual-scroll .virtual-last {
        display: none;
    }

.ios ion-nav > .ion-page > .toolbar.statusbar-padding:first-child,
.ios ion-nav > .ion-page > ion-header > .toolbar.statusbar-padding:first-child,
.ios ion-tab > .ion-page > .toolbar.statusbar-padding:first-child,
.ios ion-tab > .ion-page > ion-header > .toolbar.statusbar-padding:first-child,
.ios ion-tabs > .ion-page.tab-subpage > ion-header > .toolbar.statusbar-padding:first-child,
.ios ion-menu > .menu-inner > .toolbar.statusbar-padding:first-child,
.ios ion-menu > .menu-inner > ion-header > .toolbar.statusbar-padding:first-child {
    padding-top: calc(20px + 4px);
    padding-top: calc(constant(safe-area-inset-top) + 4px);
    padding-top: calc(env(safe-area-inset-top) + 4px);
    min-height: calc(44px + 20px);
    min-height: calc(44px + constant(safe-area-inset-top));
    min-height: calc(44px + env(safe-area-inset-top));
}

.ios ion-nav > .ion-page > ion-content.statusbar-padding:first-child .scroll-content,
.ios ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.ios ion-tab > .ion-page > ion-content.statusbar-padding:first-child .scroll-content,
.ios ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.ios ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.ios ion-menu > .menu-inner > ion-content.statusbar-padding:first-child .scroll-content,
.ios ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child .scroll-content {
    padding-top: 20px;
    padding-top: constant(safe-area-inset-top);
    padding-top: env(safe-area-inset-top);
}

.ios ion-nav > .ion-page > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-nav > .ion-page > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.ios ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.ios ion-tab > .ion-page > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-tab > .ion-page > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.ios ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.ios ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.ios ion-menu > .menu-inner > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-menu > .menu-inner > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.ios ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content {
    padding-top: calc(16px + 20px);
    padding-top: constant(safe-area-inset-top);
    padding-top: env(safe-area-inset-top);
}

.ios ion-nav > .ion-page > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-nav > .ion-page > .toolbar.statusbar-padding:first-child ion-title,
.ios ion-nav > .ion-page > ion-header > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-nav > .ion-page > ion-header > .toolbar.statusbar-padding:first-child ion-title,
.ios ion-tab > .ion-page > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-tab > .ion-page > .toolbar.statusbar-padding:first-child ion-title,
.ios ion-tab > .ion-page > ion-header > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-tab > .ion-page > ion-header > .toolbar.statusbar-padding:first-child ion-title,
.ios ion-tabs > .ion-page.tab-subpage > ion-header > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-tabs > .ion-page.tab-subpage > ion-header > .toolbar.statusbar-padding:first-child ion-title,
.ios ion-menu > .menu-inner > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-menu > .menu-inner > .toolbar.statusbar-padding:first-child ion-title,
.ios ion-menu > .menu-inner > ion-header > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-menu > .menu-inner > ion-header > .toolbar.statusbar-padding:first-child ion-title {
    padding-top: 20px;
    padding-top: constant(safe-area-inset-top);
    padding-top: env(safe-area-inset-top);
    height: calc(44px + 20px);
    height: calc(44px + constant(safe-area-inset-top));
    height: calc(44px + env(safe-area-inset-top));
    min-height: calc(44px + 20px);
    min-height: calc(44px + constant(safe-area-inset-top));
    min-height: calc(44px + env(safe-area-inset-top));
}

@media only screen and (max-width: 767px) {
    .ios .modal-wrapper > .ion-page > ion-header > .toolbar.statusbar-padding:first-child {
        padding-top: calc(20px + 4px);
        padding-top: calc(constant(safe-area-inset-top) + 4px);
        padding-top: calc(env(safe-area-inset-top) + 4px);
        min-height: calc(44px + 20px);
        min-height: calc(44px + constant(safe-area-inset-top));
        min-height: calc(44px + env(safe-area-inset-top));
    }

    .ios .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content {
        padding-top: 20px;
        padding-top: constant(safe-area-inset-top);
        padding-top: env(safe-area-inset-top);
    }

    .ios .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
    .ios .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content {
        padding-top: calc(16px + 20px);
        padding-top: constant(safe-area-inset-top);
        padding-top: env(safe-area-inset-top);
    }

    .ios .modal-wrapper > .ion-page > ion-header > .toolbar.statusbar-padding:first-child ion-segment,
    .ios .modal-wrapper > .ion-page > ion-header > .toolbar.statusbar-padding:first-child ion-title {
        padding-top: 20px;
        padding-top: constant(safe-area-inset-top);
        padding-top: env(safe-area-inset-top);
        height: calc(44px + 20px);
        height: calc(44px + constant(safe-area-inset-top));
        height: calc(44px + env(safe-area-inset-top));
        min-height: calc(44px + 20px);
        min-height: calc(44px + constant(safe-area-inset-top));
        min-height: calc(44px + env(safe-area-inset-top));
    }
}

.ios .tabs:not(.tabs-ios[tabsPlacement=top]) .tabbar {
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom);
}

.ios ion-footer .toolbar:last-child {
    padding-bottom: calc(constant(safe-area-inset-bottom) + 4px);
    padding-bottom: calc(env(safe-area-inset-bottom) + 4px);
    min-height: calc(44px + constant(safe-area-inset-bottom));
    min-height: calc(44px + env(safe-area-inset-bottom));
}

.ios .tabs:not(.tabs-ios[tabsPlacement='top']) ion-footer .toolbar:last-child {
    padding-bottom: 4px;
    min-height: 44px;
}

.md ion-nav > .ion-page > .toolbar.statusbar-padding:first-child,
.md ion-nav > .ion-page > ion-header > .toolbar.statusbar-padding:first-child,
.md ion-tab > .ion-page > .toolbar.statusbar-padding:first-child,
.md ion-tab > .ion-page > ion-header > .toolbar.statusbar-padding:first-child,
.md ion-tabs > .ion-page.tab-subpage > ion-header > .toolbar.statusbar-padding:first-child,
.md ion-menu > .menu-inner > .toolbar.statusbar-padding:first-child,
.md ion-menu > .menu-inner > ion-header > .toolbar.statusbar-padding:first-child {
    padding-top: calc(20px + 4px);
    padding-top: calc(constant(safe-area-inset-top) + 4px);
    padding-top: calc(env(safe-area-inset-top) + 4px);
    min-height: calc(56px + 20px);
    min-height: calc(56px + constant(safe-area-inset-top));
    min-height: calc(56px + env(safe-area-inset-top));
}

.md ion-nav > .ion-page > ion-content.statusbar-padding:first-child .scroll-content,
.md ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.md ion-tab > .ion-page > ion-content.statusbar-padding:first-child .scroll-content,
.md ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.md ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.md ion-menu > .menu-inner > ion-content.statusbar-padding:first-child .scroll-content,
.md ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child .scroll-content {
    padding-top: 20px;
    padding-top: constant(safe-area-inset-top);
    padding-top: env(safe-area-inset-top);
}

.md ion-nav > .ion-page > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-nav > .ion-page > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.md ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.md ion-tab > .ion-page > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-tab > .ion-page > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.md ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.md ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.md ion-menu > .menu-inner > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-menu > .menu-inner > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.md ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content {
    padding-top: calc(16px + 20px);
    padding-top: constant(safe-area-inset-top);
    padding-top: env(safe-area-inset-top);
}

@media only screen and (max-width: 767px) {
    .md .modal-wrapper > .ion-page > ion-header > .toolbar.statusbar-padding:first-child {
        padding-top: calc(20px + 4px);
        padding-top: calc(constant(safe-area-inset-top) + 4px);
        padding-top: calc(env(safe-area-inset-top) + 4px);
        min-height: calc(56px + 20px);
        min-height: calc(56px + constant(safe-area-inset-top));
        min-height: calc(56px + env(safe-area-inset-top));
    }

    .md .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content {
        padding-top: 20px;
        padding-top: constant(safe-area-inset-top);
        padding-top: env(safe-area-inset-top);
    }

    .md .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
    .md .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content {
        padding-top: calc(16px + 20px);
        padding-top: constant(safe-area-inset-top);
        padding-top: env(safe-area-inset-top);
    }
}

.md .tabs:not(.tabs-ios[tabsPlacement=top]) .tabbar {
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom);
}

.md ion-footer .toolbar:last-child {
    padding-bottom: calc(constant(safe-area-inset-bottom) + 4px);
    padding-bottom: calc(env(safe-area-inset-bottom) + 4px);
    min-height: calc(56px + constant(safe-area-inset-bottom));
    min-height: calc(56px + env(safe-area-inset-bottom));
}

.md .tabs:not(.tabs-ios[tabsPlacement='top']) ion-footer .toolbar:last-child {
    padding-bottom: 4px;
    min-height: 56px;
}

.wp ion-nav > .ion-page > .toolbar.statusbar-padding:first-child,
.wp ion-nav > .ion-page > ion-header > .toolbar.statusbar-padding:first-child,
.wp ion-tab > .ion-page > .toolbar.statusbar-padding:first-child,
.wp ion-tab > .ion-page > ion-header > .toolbar.statusbar-padding:first-child,
.wp ion-tabs > .ion-page.tab-subpage > ion-header > .toolbar.statusbar-padding:first-child,
.wp ion-menu > .menu-inner > .toolbar.statusbar-padding:first-child,
.wp ion-menu > .menu-inner > ion-header > .toolbar.statusbar-padding:first-child {
    padding-top: calc(20px + 4px);
    padding-top: calc(constant(safe-area-inset-top) + 4px);
    padding-top: calc(env(safe-area-inset-top) + 4px);
    min-height: calc(46px + 20px);
    min-height: calc(46px + constant(safe-area-inset-top));
    min-height: calc(46px + env(safe-area-inset-top));
}

.wp ion-nav > .ion-page > ion-content.statusbar-padding:first-child .scroll-content,
.wp ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.wp ion-tab > .ion-page > ion-content.statusbar-padding:first-child .scroll-content,
.wp ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.wp ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.wp ion-menu > .menu-inner > ion-content.statusbar-padding:first-child .scroll-content,
.wp ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child .scroll-content {
    padding-top: 20px;
    padding-top: constant(safe-area-inset-top);
    padding-top: env(safe-area-inset-top);
}

.wp ion-nav > .ion-page > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-nav > .ion-page > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.wp ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.wp ion-tab > .ion-page > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-tab > .ion-page > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.wp ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.wp ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.wp ion-menu > .menu-inner > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-menu > .menu-inner > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.wp ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content {
    padding-top: calc(16px + 20px);
    padding-top: constant(safe-area-inset-top);
    padding-top: env(safe-area-inset-top);
}

@media only screen and (max-width: 767px) {
    .wp .modal-wrapper > .ion-page > ion-header > .toolbar.statusbar-padding:first-child {
        padding-top: calc(20px + 4px);
        padding-top: calc(constant(safe-area-inset-top) + 4px);
        padding-top: calc(env(safe-area-inset-top) + 4px);
        min-height: calc(46px + 20px);
        min-height: calc(46px + constant(safe-area-inset-top));
        min-height: calc(46px + env(safe-area-inset-top));
    }

    .wp .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content {
        padding-top: 20px;
        padding-top: constant(safe-area-inset-top);
        padding-top: env(safe-area-inset-top);
    }

    .wp .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
    .wp .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content {
        padding-top: calc(16px + 20px);
        padding-top: constant(safe-area-inset-top);
        padding-top: env(safe-area-inset-top);
    }
}

.wp .tabs:not(.tabs-ios[tabsPlacement=top]) .tabbar {
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom);
}

.wp ion-footer .toolbar:last-child {
    padding-bottom: calc(constant(safe-area-inset-bottom) + 4px);
    padding-bottom: calc(env(safe-area-inset-bottom) + 4px);
    min-height: calc(46px + constant(safe-area-inset-bottom));
    min-height: calc(46px + env(safe-area-inset-bottom));
}

.wp .tabs:not(.tabs-ios[tabsPlacement='top']) ion-footer .toolbar:last-child {
    padding-bottom: 4px;
    min-height: 46px;
}

html,
body {
    height: 100%;
    margin: 0;
    padding: 0;
    font-size: 10px;
}

body {
    margin: 0;
    padding: 0;
    color: #212121;
    font-size: 10px;
}

ion-app .ion-page > .header {
    height: 70px !important;
}

    ion-app .ion-page > .header + .content .fixed-content,
    ion-app .ion-page > .header + .content .scroll-content {
        margin: 70px 0 0 !important;
    }

@media (max-width: 767px) {
    ion-app .ion-page > .header + .content .fixed-content,
    ion-app .ion-page > .header + .content .scroll-content {
        margin-bottom: 0 !important;
    }
}

ion-app .ion-page > .content > .fixed-content,
ion-app .ion-page > .content > .scroll-content {
    overflow-y: hidden;
}

    ion-app .ion-page > .content > .fixed-content .page-wrapper,
    ion-app .ion-page > .content > .scroll-content .page-wrapper {
        height: 100%;
    }

        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-header .title,
        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-header .title {
            line-height: 1.5;
        }

        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container,
        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container {
            padding: 2rem 0;
        }

            ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item,
            ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item {
                -webkit-box-shadow: none;
                box-shadow: none;
                border-radius: 1rem;
            }

                ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .product-photo,
                ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .product-photo {
                    width: 100%;
                    height: 0;
                    padding-top: 66%;
                    background: -webkit-gradient(linear, left top, right bottom, from(#00d45a), to(#28b52e));
                    background: linear-gradient(to bottom right, #00d45a, #28b52e);
                    background-size: contain;
                    background-position: center;
                    background-repeat: no-repeat;
                    border-radius: 1rem;
                    position: relative;
                    -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
                    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
                }

                    ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .product-photo .no-photo-placeholder,
                    ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .product-photo .no-photo-placeholder {
                        position: absolute;
                        top: 0;
                        right: 0;
                        bottom: 0;
                        left: 0;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-orient: vertical;
                        -webkit-box-direction: normal;
                        -webkit-flex-direction: column;
                        -ms-flex-direction: column;
                        flex-direction: column;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        padding: 4rem;
                    }

                        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .product-photo .no-photo-placeholder .store-logo,
                        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .product-photo .no-photo-placeholder .store-logo {
                            background-size: contain;
                            background-position: center;
                            background-repeat: no-repeat;
                            position: absolute;
                            bottom: 1rem;
                            right: 1rem;
                            left: 1rem;
                            top: 1rem;
                        }

                            ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .product-photo .no-photo-placeholder .store-logo:not(.service),
                            ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .product-photo .no-photo-placeholder .store-logo:not(.service) {
                                -webkit-filter: grayscale(1);
                                filter: grayscale(1);
                                opacity: 0.1;
                            }

                        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .product-photo .no-photo-placeholder span,
                        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .product-photo .no-photo-placeholder span {
                            color: #757575;
                            font-size: 15px;
                            font-weight: 800;
                            text-align: center;
                            position: relative;
                            line-height: 1.2;
                            z-index: 2;
                        }

                    ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .product-photo .price-container,
                    ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .product-photo .price-container {
                        position: absolute;
                        bottom: 0;
                        left: 0;
                        padding: 1rem;
                        background-color: rgba(255, 255, 255, 0.9);
                        border-radius: 0 1rem 0 1rem;
                    }

                        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .product-photo .price-container .price,
                        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .product-photo .price-container .price {
                            margin: 0;
                            font-size: 18px;
                            font-weight: 800;
                        }

                    ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .product-photo .info-container,
                    ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .product-photo .info-container {
                        width: 34px;
                        height: 34px;
                        position: absolute;
                        top: 0;
                        right: 0;
                        padding: 0.75rem;
                        border-radius: 0 1rem 0 1rem;
                        color: #00d45a;
                        -webkit-transform: background-color 0.3s ease;
                        transform: background-color 0.3s ease;
                    }

                        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .product-photo .info-container i,
                        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .product-photo .info-container i {
                            color: white;
                            font-size: 18px;
                        }

                        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .product-photo .info-container:hover,
                        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .product-photo .info-container:hover {
                            background-color: rgba(255, 255, 255, 0.25);
                        }

                ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .card-body,
                ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .card-body {
                    padding: 2rem 1rem 2rem;
                    border-radius: 0 0 1rem 1rem;
                    position: relative;
                    height: 115px;
                }

                    ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .card-body .product-name,
                    ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .card-body .product-name {
                        margin: 0 0 0.5rem;
                        overflow: hidden;
                        color: #212121;
                        font-size: 15px;
                        font-weight: 800;
                        max-height: 38px;
                        display: -webkit-box;
                        -webkit-line-clamp: 2;
                        -webkit-box-orient: vertical;
                    }

                    ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .card-body .info-item,
                    ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .card-body .info-item {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        padding-right: 4rem;
                        font-size: 12px;
                        font-weight: 600;
                        color: #212121;
                    }

                        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .card-body .info-item label,
                        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .card-body .info-item label {
                            color: #757575;
                            margin: 0 0.5rem 0 0;
                        }

                    ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .card-body .btn-add-product,
                    ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .card-body .btn-add-product {
                        width: 40px;
                        height: 40px;
                        position: absolute;
                        bottom: 0;
                        right: 0;
                        padding: 0.75rem;
                        background-color: #00d45a;
                        border-radius: 1rem 0 1rem 0;
                        color: white;
                        font-size: 24px;
                    }

                        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .card-body .btn-add-product i,
                        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .card-body .btn-add-product i {
                            -webkit-transition: -webkit-transform 0.3s ease-out;
                            transition: -webkit-transform 0.3s ease-out;
                            transition: transform 0.3s ease-out;
                            transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
                        }

                        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container .product-item .card-body .btn-add-product:hover i,
                        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container .product-item .card-body .btn-add-product:hover i {
                            -webkit-transform: rotate(90deg);
                            transform: rotate(90deg);
                        }

            ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item,
            ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item {
                color: white;
                height: 232px;
                background: -webkit-gradient(linear, left top, right bottom, from(#00d45a), to(#00be51));
                background: linear-gradient(to bottom right, #00d45a, #00be51);
                position: relative;
            }

                ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item:after,
                ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item:after {
                    content: '';
                    position: absolute;
                    bottom: 0;
                    right: 0;
                    background-image: url(./../../assets/imgs/logo.png);
                    background-position: 1rem 1rem;
                    background-size: contain;
                    background-repeat: no-repeat;
                    width: 120px;
                    height: 120px;
                    -webkit-filter: brightness(0);
                    filter: brightness(0);
                    opacity: 0.05;
                    border-bottom-right-radius: 8rem;
                    z-index: 0;
                }

                ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .product-name-container,
                ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .product-name-container {
                    padding: 2rem;
                    position: relative;
                    z-index: 1;
                }

                    ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .product-name-container .product-name,
                    ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .product-name-container .product-name {
                        margin: 0;
                        padding-right: 2rem;
                        font-weight: 800;
                        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
                    }

@media screen and (max-width: 1599px) {
    ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .product-name-container .product-name,
    ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .product-name-container .product-name {
        font-size: 16px;
    }
}

ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .product-name-container .info-container,
ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .product-name-container .info-container {
    width: 34px;
    height: 34px;
    position: absolute;
    top: 0;
    right: 0;
    padding: 0.75rem;
    border-radius: 0 1rem 0 1rem;
    color: white;
    -webkit-transform: background-color 0.3s ease;
    transform: background-color 0.3s ease;
}

    ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .product-name-container .info-container i,
    ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .product-name-container .info-container i {
        font-size: 18px;
    }

    ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .product-name-container .info-container:hover,
    ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .product-name-container .info-container:hover {
        background-color: rgba(255, 255, 255, 0.25);
    }

ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body,
ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body {
    padding: 0 2rem 2rem;
    position: relative;
    z-index: 1;
}

    ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .info-item,
    ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .info-item {
        color: white;
        padding: 0;
        font-weight: 700;
    }

        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .info-item label,
        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .info-item label {
            color: white;
            font-weight: 500;
        }

    ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .price-container,
    ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .price-container {
        height: 48px;
        position: absolute;
        bottom: 0;
        left: 0;
        padding: 1rem 2rem;
        background-color: rgba(0, 0, 0, 0.05);
        border-radius: 0 1rem 0 1rem;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .price-container .price,
        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .price-container .price {
            margin: 0;
            font-size: 22px;
            font-weight: 800;
        }

    ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .btn-add-product,
    ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .btn-add-product {
        width: 48px;
        height: 48px;
        background-color: #ffa000;
        border-radius: 1rem 0 1rem 0;
        font-size: 28px;
    }

        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .btn-add-product i,
        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .btn-add-product i {
            -webkit-transition: -webkit-transform 0.3s ease-out;
            transition: -webkit-transform 0.3s ease-out;
            transition: transform 0.3s ease-out;
            transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
        }

        ion-app .ion-page > .content > .fixed-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .btn-add-product:hover i,
        ion-app .ion-page > .content > .scroll-content .page-wrapper .col-productos .products-container.laboratory .product-item .card-body .btn-add-product:hover i {
            -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
        }

@media (max-width: 767px) {
    ion-app .ion-page > .footer {
        display: none !important;
    }
}

ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

::-webkit-scrollbar-track {
    border-radius: 0;
    background-color: transparent;
}

::-webkit-scrollbar {
    height: 4px;
    width: 10px !important;
    background-color: rgba(0, 0, 0, 0.05);
}

::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.1);
    -webkit-transition: background-color 0.3s ease;
    transition: background-color 0.3s ease;
}

    ::-webkit-scrollbar-thumb:hover {
        background-color: rgba(0, 0, 0, 0.15);
    }

modal-cashout-history .page-wrapper {
    height: 100%;
    overflow-y: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

    modal-cashout-history .page-wrapper .page-body {
        padding: 1rem;
        height: calc(100% - 46px);
        overflow-y: auto;
        background-color: #eaf0f3;
    }

        modal-cashout-history .page-wrapper .page-body .cashout-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-flex-wrap: nowrap;
            -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
            margin-bottom: 1rem;
        }

            modal-cashout-history .page-wrapper .page-body .cashout-container .header {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-flex: 1;
                -webkit-flex: 1 1 100%;
                -ms-flex: 1 1 100%;
                flex: 1 1 100%;
                border-bottom: 1px solid #e0e0e0;
            }

                modal-cashout-history .page-wrapper .page-body .cashout-container .header .cashout-info {
                    width: 100%;
                    padding: 2rem 2rem 1.5rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-direction: column;
                    -ms-flex-direction: column;
                    flex-direction: column;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                }

                    modal-cashout-history .page-wrapper .page-body .cashout-container .header .cashout-info h5 {
                        font-size: 16px;
                        margin: 0 0 0.5rem;
                    }

                        modal-cashout-history .page-wrapper .page-body .cashout-container .header .cashout-info h5 strong {
                            width: 100px;
                            display: inline-block;
                        }

                modal-cashout-history .page-wrapper .page-body .cashout-container .header .cashout-actions {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    padding: 1rem;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 auto;
                    -ms-flex: 0 0 auto;
                    flex: 0 0 auto;
                }

                    modal-cashout-history .page-wrapper .page-body .cashout-container .header .cashout-actions .btn {
                        margin-left: 1rem;
                    }

            modal-cashout-history .page-wrapper .page-body .cashout-container .cashout-totals {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-flex-wrap: wrap;
                -ms-flex-wrap: wrap;
                flex-wrap: wrap;
                padding: 1rem;
                -webkit-box-pack: start;
                -webkit-justify-content: flex-start;
                -ms-flex-pack: start;
                justify-content: flex-start;
            }

                modal-cashout-history .page-wrapper .page-body .cashout-container .cashout-totals .total-container {
                    padding: 1rem;
                    width: 33.333333%;
                }

                    modal-cashout-history .page-wrapper .page-body .cashout-container .cashout-totals .total-container label {
                        color: #00be51;
                    }

                        modal-cashout-history .page-wrapper .page-body .cashout-container .cashout-totals .total-container label::first-letter {
                            text-transform: uppercase;
                        }

                    modal-cashout-history .page-wrapper .page-body .cashout-container .cashout-totals .total-container h2 {
                        margin: 0;
                        font-weight: 600;
                    }

                        modal-cashout-history .page-wrapper .page-body .cashout-container .cashout-totals .total-container h2 small {
                            font-size: 50%;
                            color: #00be51;
                        }

modal-change-quantity .quantity-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

    modal-change-quantity .quantity-container .reference {
        max-width: calc(100% - 140px);
    }

        modal-change-quantity .quantity-container .reference h4 {
            margin: 0;
            color: white;
            font-size: 24px;
            font-weight: 800;
        }

            modal-change-quantity .quantity-container .reference h4 span {
                font-size: 28px;
                color: #00d45a;
                display: block;
            }

    modal-change-quantity .quantity-container .quantity {
        padding-left: 2rem;
    }

        modal-change-quantity .quantity-container .quantity .form-control {
            width: 120px;
            height: 100px;
            border-radius: 2rem;
            font-size: 40px;
            text-align: center;
            font-weight: 700;
            color: #212121;
            padding: 0;
        }

modal-change-quantity input[type=number]::-webkit-inner-spin-button,
modal-change-quantity input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.modal-quantity ion-backdrop {
    opacity: 0.95 !important;
    background-color: #333;
}

.modal-quantity .modal-wrapper {
    height: 120px;
    top: calc(50% - (120px/2));
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
}

modal-client-add .page-wrapper {
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

modal-client-add .page-body {
    height: calc(100% - 46px);
    position: relative;
}

    modal-client-add .page-body form {
        height: 100%;
    }

    modal-client-add .page-body .slides .swiper-slide {
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

        modal-client-add .page-body .slides .swiper-slide .slide-zoom {
            text-align: center;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            width: 100%;
            height: 100%;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
            -webkit-box-pack: start;
            -webkit-justify-content: flex-start;
            -ms-flex-pack: start;
            justify-content: flex-start;
            overflow-y: auto;
        }

            modal-client-add .page-body .slides .swiper-slide .slide-zoom .slide-title h4 {
                font-size: 16px;
                font-weight: 600;
                color: #525252;
            }

            modal-client-add .page-body .slides .swiper-slide .slide-zoom .toggle-container {
                text-align: left;
                padding: 1rem;
            }

                modal-client-add .page-body .slides .swiper-slide .slide-zoom .toggle-container .mat-slide-toggle {
                    width: 100%;
                }

                    modal-client-add .page-body .slides .swiper-slide .slide-zoom .toggle-container .mat-slide-toggle .mat-slide-toggle-label {
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-orient: horizontal;
                        -webkit-box-direction: reverse;
                        -webkit-flex-direction: row-reverse;
                        -ms-flex-direction: row-reverse;
                        flex-direction: row-reverse;
                    }

                        modal-client-add .page-body .slides .swiper-slide .slide-zoom .toggle-container .mat-slide-toggle .mat-slide-toggle-label .mat-slide-toggle-bar {
                            margin-right: 0;
                            margin-left: 1rem;
                        }

            modal-client-add .page-body .slides .swiper-slide .slide-zoom .form-group {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                padding: 0;
                margin: 0;
            }

                modal-client-add .page-body .slides .swiper-slide .slide-zoom .form-group .mat-form-control {
                    -webkit-box-flex: 1;
                    -webkit-flex: 1;
                    -ms-flex: 1;
                    flex: 1;
                    margin: 0 1rem -1rem;
                }

            modal-client-add .page-body .slides .swiper-slide .slide-zoom #map {
                width: 100%;
                height: 200px;
            }

                modal-client-add .page-body .slides .swiper-slide .slide-zoom #map .leaflet-marker-icon {
                    margin-top: -24px !important;
                }

                    modal-client-add .page-body .slides .swiper-slide .slide-zoom #map .leaflet-marker-icon .marker {
                        width: 36px;
                        height: 36px;
                        border-radius: 50% 50% 50% 0;
                        background: linear-gradient(170deg, #757575, #333);
                        position: absolute;
                        -webkit-transform: rotate(-45deg);
                        transform: rotate(-45deg);
                        left: 50%;
                        top: 50%;
                        margin: -24px 0 0 -18px;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        modal-client-add .page-body .slides .swiper-slide .slide-zoom #map .leaflet-marker-icon .marker .marker-inner {
                            font-size: 20px;
                            -webkit-transform: rotate(45deg);
                            transform: rotate(45deg);
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-pack: center;
                            -webkit-justify-content: center;
                            -ms-flex-pack: center;
                            justify-content: center;
                            -webkit-box-align: center;
                            -webkit-align-items: center;
                            -ms-flex-align: center;
                            align-items: center;
                            width: 26px;
                            height: 26px;
                            border-radius: 50%;
                        }

                            modal-client-add .page-body .slides .swiper-slide .slide-zoom #map .leaflet-marker-icon .marker .marker-inner img {
                                width: 80%;
                            }

                            modal-client-add .page-body .slides .swiper-slide .slide-zoom #map .leaflet-marker-icon .marker .marker-inner .fas {
                                color: white;
                            }

                    modal-client-add .page-body .slides .swiper-slide .slide-zoom #map .leaflet-marker-icon.store-marker .marker {
                        background: linear-gradient(170deg, #08e465, #00be51);
                    }

                        modal-client-add .page-body .slides .swiper-slide .slide-zoom #map .leaflet-marker-icon.store-marker .marker .marker-inner {
                            width: 18px;
                            height: 18px;
                        }

                            modal-client-add .page-body .slides .swiper-slide .slide-zoom #map .leaflet-marker-icon.store-marker .marker .marker-inner i {
                                font-size: 16px;
                            }

            modal-client-add .page-body .slides .swiper-slide .slide-zoom .wizard-buttons {
                margin-top: auto;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 46px;
                -ms-flex: 0 0 46px;
                flex: 0 0 46px;
            }

                modal-client-add .page-body .slides .swiper-slide .slide-zoom .wizard-buttons .btn {
                    margin: 0;
                    border-radius: 0;
                    font-size: 18px;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    height: 46px;
                }

                    modal-client-add .page-body .slides .swiper-slide .slide-zoom .wizard-buttons .btn.btn-default {
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 46px;
                        -ms-flex: 0 0 46px;
                        flex: 0 0 46px;
                        background-color: #eaf0f3 !important;
                        color: #333 !important;
                    }

                    modal-client-add .page-body .slides .swiper-slide .slide-zoom .wizard-buttons .btn i {
                        font-size: 20px;
                    }

                    modal-client-add .page-body .slides .swiper-slide .slide-zoom .wizard-buttons .btn span + i {
                        position: absolute;
                        right: 1rem;
                    }

                        modal-client-add .page-body .slides .swiper-slide .slide-zoom .wizard-buttons .btn span + i.lg {
                            font-size: 24px;
                        }

    modal-client-add .page-body .slides.sololectura .swiper-slide .slide-zoom .mat-form-control .mat-input-element {
        color: initial !important;
    }

modal-client-add .page-footer .btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

    modal-client-add .page-footer .btn i {
        position: absolute;
        right: 1rem;
        display: none;
    }

modal-clients .page-wrapper {
    height: 100%;
    overflow-y: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

    modal-clients .page-wrapper .page-body {
        padding: 0;
        height: calc(100% - 92px);
        background-color: white;
    }

        modal-clients .page-wrapper .page-body .container-fluid {
            height: 100%;
        }

            modal-clients .page-wrapper .page-body .container-fluid .row {
                height: 100%;
            }

        modal-clients .page-wrapper .page-body .col-clients,
        modal-clients .page-wrapper .page-body .col-client-info {
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
            padding: 0;
            height: 100%;
        }

            modal-clients .page-wrapper .page-body .col-clients .col-header,
            modal-clients .page-wrapper .page-body .col-client-info .col-header {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 46px;
                -ms-flex: 0 0 46px;
                flex: 0 0 46px;
                height: 46px;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

                modal-clients .page-wrapper .page-body .col-clients .col-header .title,
                modal-clients .page-wrapper .page-body .col-client-info .col-header .title {
                    font-size: 12px;
                    text-transform: uppercase;
                    margin: 0;
                    padding: 1rem;
                    white-space: nowrap;
                    overflow: hidden;
                    text-overflow: ellipsis;
                }

                modal-clients .page-wrapper .page-body .col-clients .col-header .toolbar,
                modal-clients .page-wrapper .page-body .col-client-info .col-header .toolbar {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: end;
                    -webkit-justify-content: flex-end;
                    -ms-flex-pack: end;
                    justify-content: flex-end;
                    padding: 0 0.5rem;
                }

                    modal-clients .page-wrapper .page-body .col-clients .col-header .toolbar .btn,
                    modal-clients .page-wrapper .page-body .col-client-info .col-header .toolbar .btn {
                        padding: 0.25rem 0.5rem;
                        font-size: 14px;
                    }

                        modal-clients .page-wrapper .page-body .col-clients .col-header .toolbar .btn i,
                        modal-clients .page-wrapper .page-body .col-client-info .col-header .toolbar .btn i {
                            font-size: 16px;
                        }

                    modal-clients .page-wrapper .page-body .col-clients .col-header .toolbar .item,
                    modal-clients .page-wrapper .page-body .col-client-info .col-header .toolbar .item {
                        width: auto;
                        min-height: 0;
                        display: -webkit-inline-box;
                        display: -webkit-inline-flex;
                        display: -ms-inline-flexbox;
                        display: inline-flex;
                        background-color: transparent;
                        font-size: 14px;
                    }

                        modal-clients .page-wrapper .page-body .col-clients .col-header .toolbar .item .item-inner,
                        modal-clients .page-wrapper .page-body .col-client-info .col-header .toolbar .item .item-inner {
                            padding-right: 0;
                            border: 0;
                        }

                            modal-clients .page-wrapper .page-body .col-clients .col-header .toolbar .item .item-inner .label,
                            modal-clients .page-wrapper .page-body .col-client-info .col-header .toolbar .item .item-inner .label {
                                margin-right: 0;
                            }

            modal-clients .page-wrapper .page-body .col-clients .col-body,
            modal-clients .page-wrapper .page-body .col-client-info .col-body {
                height: calc(100% - 46px);
                overflow-y: auto;
            }

            modal-clients .page-wrapper .page-body .col-clients .col-body {
                height: 100%;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-flow: column;
                -ms-flex-flow: column;
                flex-flow: column;
            }

                modal-clients .page-wrapper .page-body .col-clients .col-body .filter-container {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    z-index: 9;
                    position: relative;
                    border-bottom: 1px solid #eaf0f3;
                }

                    modal-clients .page-wrapper .page-body .col-clients .col-body .filter-container .search-icon {
                        position: absolute;
                        top: 0;
                        left: 0;
                        z-index: 1;
                        width: 46px;
                        height: 46px;
                        display: -webkit-inline-box;
                        display: -webkit-inline-flex;
                        display: -ms-inline-flexbox;
                        display: inline-flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        font-size: 16px;
                        opacity: 0.6;
                    }

                    modal-clients .page-wrapper .page-body .col-clients .col-body .filter-container .form-control {
                        height: 46px;
                        border: transparent;
                        border-radius: 0;
                        padding-left: 46px;
                        font-size: 16px;
                    }

                        modal-clients .page-wrapper .page-body .col-clients .col-body .filter-container .form-control::-webkit-input-placeholder {
                            font-style: italic;
                        }

                        modal-clients .page-wrapper .page-body .col-clients .col-body .filter-container .form-control::-moz-placeholder {
                            font-style: italic;
                        }

                        modal-clients .page-wrapper .page-body .col-clients .col-body .filter-container .form-control::-ms-input-placeholder {
                            font-style: italic;
                        }

                        modal-clients .page-wrapper .page-body .col-clients .col-body .filter-container .form-control::placeholder {
                            font-style: italic;
                        }

                        modal-clients .page-wrapper .page-body .col-clients .col-body .filter-container .form-control:focus {
                            outline: none;
                            -webkit-box-shadow: none;
                            box-shadow: none;
                        }

                    modal-clients .page-wrapper .page-body .col-clients .col-body .filter-container .btn {
                        width: 36px;
                        height: 36px;
                        margin-right: 0.5rem;
                        padding: 0;
                        -webkit-box-shadow: none;
                        box-shadow: none;
                        font-size: 15px;
                        -webkit-transition: background-color 0.3s ease;
                        transition: background-color 0.3s ease;
                    }

                        modal-clients .page-wrapper .page-body .col-clients .col-body .filter-container .btn i {
                            font-size: 20px;
                        }

                            modal-clients .page-wrapper .page-body .col-clients .col-body .filter-container .btn i.lg {
                                font-size: 24px;
                            }

                modal-clients .page-wrapper .page-body .col-clients .col-body .clients-container {
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                }

                    modal-clients .page-wrapper .page-body .col-clients .col-body .clients-container .content .scroll-content {
                        overflow: hidden;
                    }

                    modal-clients .page-wrapper .page-body .col-clients .col-body .clients-container virtual-scroller {
                        height: 100%;
                        margin-bottom: 0;
                        overflow-y: auto;
                    }

                        modal-clients .page-wrapper .page-body .col-clients .col-body .clients-container virtual-scroller .item {
                            padding: 1rem;
                            border-bottom: 1px solid #e0e0e0;
                        }

                            modal-clients .page-wrapper .page-body .col-clients .col-body .clients-container virtual-scroller .item .name {
                                font-size: 14px;
                                font-weight: 700;
                                white-space: normal;
                                margin: 0 0 5px;
                                text-transform: capitalize;
                            }

                            modal-clients .page-wrapper .page-body .col-clients .col-body .clients-container virtual-scroller .item .phone,
                            modal-clients .page-wrapper .page-body .col-clients .col-body .clients-container virtual-scroller .item .address {
                                display: block;
                                font-size: 12px;
                                color: #757575;
                                text-transform: capitalize;
                            }

                                modal-clients .page-wrapper .page-body .col-clients .col-body .clients-container virtual-scroller .item .phone label,
                                modal-clients .page-wrapper .page-body .col-clients .col-body .clients-container virtual-scroller .item .address label {
                                    color: #333;
                                    font-weight: 600;
                                    margin: 0;
                                }

            modal-clients .page-wrapper .page-body .col-client-info .col-header {
                background-color: rgba(0, 0, 0, 0.03);
            }

                modal-clients .page-wrapper .page-body .col-client-info .col-header .toolbar {
                    width: auto;
                    height: 46px;
                    -webkit-flex-shrink: 0;
                    -ms-flex-negative: 0;
                    flex-shrink: 0;
                    display: -webkit-inline-box;
                    display: -webkit-inline-flex;
                    display: -ms-inline-flexbox;
                    display: inline-flex;
                    -webkit-box-pack: end;
                    -webkit-justify-content: flex-end;
                    -ms-flex-pack: end;
                    justify-content: flex-end;
                    padding: 0 0.5rem;
                }

                    modal-clients .page-wrapper .page-body .col-client-info .col-header .toolbar .btn {
                        width: 36px;
                        height: 36px;
                        padding: 0;
                        font-size: 15px;
                    }

                        modal-clients .page-wrapper .page-body .col-client-info .col-header .toolbar .btn i {
                            font-size: 20px;
                        }

                            modal-clients .page-wrapper .page-body .col-client-info .col-header .toolbar .btn i.lg {
                                font-size: 24px;
                            }

            modal-clients .page-wrapper .page-body .col-client-info .col-body {
                padding: 2rem 0;
            }

                modal-clients .page-wrapper .page-body .col-client-info .col-body form .row {
                    margin: 0;
                }

                    modal-clients .page-wrapper .page-body .col-client-info .col-body form .row .col-12 {
                        padding: 0;
                    }

                modal-clients .page-wrapper .page-body .col-client-info .col-body form .form-group {
                    padding: 4px 1rem;
                    margin: 0;
                    position: relative;
                }

                    modal-clients .page-wrapper .page-body .col-client-info .col-body form .form-group .mat-form-control .mat-form-field-wrapper .mat-form-field-flex {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        border-radius: 1rem;
                        padding: 0 1rem;
                    }

                modal-clients .page-wrapper .page-body .col-client-info .col-body form .item.item-input {
                    padding: 4px 1rem;
                    margin-bottom: 0.5rem;
                    font-size: 14px;
                    min-height: 0;
                    height: 52px;
                }

                    modal-clients .page-wrapper .page-body .col-client-info .col-body form .item.item-input .item-inner {
                        height: 46px;
                        border: 1px solid #e0e0e0;
                        border-radius: 1rem;
                        padding: 0.75rem 1.5rem;
                        -webkit-transition: background-color 0.3s ease;
                        transition: background-color 0.3s ease;
                    }

                        modal-clients .page-wrapper .page-body .col-client-info .col-body form .item.item-input .item-inner .input-wrapper .label {
                            position: absolute;
                            top: 0;
                            margin: 0;
                            -webkit-transform: translate3d(0, 17px, 0);
                            transform: translate3d(0, 17px, 0);
                            background-color: white;
                            padding: 0 0.5rem;
                        }

                    modal-clients .page-wrapper .page-body .col-client-info .col-body form .item.item-input.item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus) .item-inner {
                        border-color: #e02626;
                        -webkit-box-shadow: 0 0 0 0.2rem rgba(224, 38, 38, 0.25);
                        box-shadow: 0 0 0 0.2rem rgba(224, 38, 38, 0.25);
                    }

                    modal-clients .page-wrapper .page-body .col-client-info .col-body form .item.item-input.item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus) .label[floating] {
                        color: #e02626;
                    }

                    modal-clients .page-wrapper .page-body .col-client-info .col-body form .item.item-input.input-has-focus .item-inner {
                        border-color: #00d45a;
                        -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                        box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                    }

                    modal-clients .page-wrapper .page-body .col-client-info .col-body form .item.item-input.input-has-focus .label[floating] {
                        height: 14px;
                        line-height: 14px;
                        -webkit-transform: translate3d(0, -1px, 0) scale(0.8);
                        transform: translate3d(0, -1px, 0) scale(0.8);
                        color: #00d45a;
                    }

                    modal-clients .page-wrapper .page-body .col-client-info .col-body form .item.item-input.input-has-value .item-inner {
                        -webkit-box-shadow: none;
                        box-shadow: none;
                    }

                    modal-clients .page-wrapper .page-body .col-client-info .col-body form .item.item-input.input-has-value .label[floating] {
                        height: 14px;
                        line-height: 14px;
                        -webkit-transform: translate3d(0, -1px, 0) scale(0.8);
                        transform: translate3d(0, -1px, 0) scale(0.8);
                    }

                    modal-clients .page-wrapper .page-body .col-client-info .col-body form .item.item-input.item-input-disabled .item-inner {
                        background-color: #eee;
                    }

                        modal-clients .page-wrapper .page-body .col-client-info .col-body form .item.item-input.item-input-disabled .item-inner .label[floating] {
                            background-color: #eee;
                        }

                    modal-clients .page-wrapper .page-body .col-client-info .col-body form .item.item-input:last-child {
                        border-bottom: none;
                        -webkit-box-shadow: none;
                        box-shadow: none;
                    }

                modal-clients .page-wrapper .page-body .col-client-info .col-body .warning {
                    position: absolute;
                    bottom: 0;
                    left: 1rem;
                    right: 1rem;
                    text-align: center;
                    border-radius: 1rem;
                }

    modal-clients .page-wrapper .page-footer .btn {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

        modal-clients .page-wrapper .page-footer .btn i {
            display: none;
            position: absolute;
            right: 1rem;
        }

            modal-clients .page-wrapper .page-footer .btn i.lg {
                font-size: 24px;
            }

modal-denom-caja .page-wrapper {
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

    modal-denom-caja .page-wrapper .page-body {
        padding: 0;
        height: calc(100% - 92px);
        overflow-y: auto;
        background-color: white;
    }

        modal-denom-caja .page-wrapper .page-body .alert-container {
            padding: 1rem 1.5rem 0;
        }

            modal-denom-caja .page-wrapper .page-body .alert-container .alert {
                display: block;
                margin-bottom: 0;
            }

        modal-denom-caja .page-wrapper .page-body .denominaciones {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            padding: 0 2rem 0 1rem;
        }

            modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-flow: column;
                -ms-flex-flow: column;
                flex-flow: column;
                width: 100%;
                height: 100%;
                background-color: #FFF;
            }

                modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .row {
                    position: relative;
                    overflow: hidden;
                }

                    modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .row .bg {
                        position: absolute;
                        bottom: -72px;
                        left: -20px;
                        font-size: 120px;
                        color: #e0e0e0;
                        opacity: 0.5;
                    }

                modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .row-monedas {
                    padding: 1rem 0;
                    border-bottom: 1px dashed #e0e0e0;
                }

                modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .row-billetes {
                    padding: 1rem 0;
                }

                modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .denom-item {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: column;
                    -ms-flex-flow: column;
                    flex-flow: column;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    padding: 0.5rem;
                    position: relative;
                    overflow: hidden;
                }

                    modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .denom-item .top {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        z-index: 1;
                        position: relative;
                    }

                        modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .denom-item .top .desc {
                            -webkit-box-flex: 0;
                            -webkit-flex: 0 0 60px;
                            -ms-flex: 0 0 60px;
                            flex: 0 0 60px;
                            font-weight: 800;
                            font-size: 18px;
                            text-align: right;
                            padding-right: 1rem;
                        }

                            modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .denom-item .top .desc small {
                                font-size: 50%;
                            }

                        modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .denom-item .top .input-container {
                            -webkit-box-flex: 1;
                            -webkit-flex-grow: 1;
                            -ms-flex-positive: 1;
                            flex-grow: 1;
                        }

                            modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .denom-item .top .input-container .form-control {
                                height: 40px;
                                border-width: 1px;
                                border-color: #e0e0e0;
                                border-radius: 1rem;
                            }

                                modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .denom-item .top .input-container .form-control:focus {
                                    border-color: #00d45a;
                                    -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                                    box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                                }

                    modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .denom-item .bottom {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        -webkit-box-pack: end;
                        -webkit-justify-content: flex-end;
                        -ms-flex-pack: end;
                        justify-content: flex-end;
                        margin-top: 0.25rem;
                        position: relative;
                    }

                        modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .denom-item .bottom .total {
                            color: #00d45a;
                        }

                            modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .denom-item .bottom .total small {
                                font-size: 14px;
                                color: #525252;
                                margin-right: 0.5rem;
                                font-weight: 700;
                            }

                            modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .denom-item .bottom .total strong small {
                                color: #212121;
                                font-weight: 500;
                                font-size: 50%;
                                margin: 0 0.25rem;
                            }

                modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .total-container {
                    margin: 1rem 0 0;
                    padding: 2rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: end;
                    -webkit-align-items: flex-end;
                    -ms-flex-align: end;
                    align-items: flex-end;
                    -webkit-box-pack: end;
                    -webkit-justify-content: flex-end;
                    -ms-flex-pack: end;
                    justify-content: flex-end;
                }

                    modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .total-container label {
                        font-size: 22px;
                        font-weight: 700;
                        margin-right: 1rem;
                        margin-bottom: 0;
                    }

                    modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .total-container .total {
                        font-size: 32px;
                        font-weight: 800;
                        margin: 0;
                        color: #00be51;
                    }

                        modal-denom-caja .page-wrapper .page-body .denominaciones .denominaciones-container .total-container .total small {
                            font-size: 50%;
                            font-weight: 800;
                        }

        modal-denom-caja .page-wrapper .page-body .payment-type {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            padding-bottom: 1rem;
        }

            modal-denom-caja .page-wrapper .page-body .payment-type .type-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-flow: column;
                -ms-flex-flow: column;
                flex-flow: column;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                margin: 0 15px;
            }

                modal-denom-caja .page-wrapper .page-body .payment-type .type-container input {
                    position: absolute;
                    top: 0;
                    left: 0;
                    display: none;
                }

                modal-denom-caja .page-wrapper .page-body .payment-type .type-container .type-item {
                    width: 160px;
                    position: relative;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: column;
                    -ms-flex-flow: column;
                    flex-flow: column;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    border: 1px solid #e0e0e0;
                    border-radius: 1rem;
                    padding: 1rem;
                    cursor: pointer;
                    -webkit-transition: border-color 0.15s ease;
                    transition: border-color 0.15s ease;
                }

                    modal-denom-caja .page-wrapper .page-body .payment-type .type-container .type-item .icon i {
                        font-size: 56px;
                        font-weight: 300;
                        color: #525252;
                        -webkit-transition: color 0.15s ease;
                        transition: color 0.15s ease;
                    }

                    modal-denom-caja .page-wrapper .page-body .payment-type .type-container .type-item .text span {
                        color: #525252;
                        margin-top: -0.25rem;
                        display: block;
                        font-size: 16px;
                        font-weight: 700;
                        letter-spacing: 0.5px;
                        text-transform: uppercase;
                        -webkit-transition: color 0.15s ease;
                        transition: color 0.15s ease;
                    }

                modal-denom-caja .page-wrapper .page-body .payment-type .type-container input:checked + .type-item {
                    border-color: #00d45a;
                }

                    modal-denom-caja .page-wrapper .page-body .payment-type .type-container input:checked + .type-item .icon i {
                        color: #00d45a;
                    }

                    modal-denom-caja .page-wrapper .page-body .payment-type .type-container input:checked + .type-item .text span {
                        color: #00d45a;
                    }

            modal-denom-caja .page-wrapper .page-body .payment-type:last-child {
                border-bottom: 1px solid #e0e0e0;
            }

        modal-denom-caja .page-wrapper .page-body .client-container,
        modal-denom-caja .page-wrapper .page-body .payment-money {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            padding: 2rem 1rem;
            border-bottom: 1px solid #e0e0e0;
        }

            modal-denom-caja .page-wrapper .page-body .client-container .mensaje,
            modal-denom-caja .page-wrapper .page-body .payment-money .mensaje {
                max-width: 60%;
                font-size: 14px;
                padding-right: 2rem;
                height: 100%;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

            modal-denom-caja .page-wrapper .page-body .client-container .form-container,
            modal-denom-caja .page-wrapper .page-body .payment-money .form-container {
                width: 100%;
            }

                modal-denom-caja .page-wrapper .page-body .client-container .form-container .control-label,
                modal-denom-caja .page-wrapper .page-body .payment-money .form-container .control-label {
                    font-size: 15px;
                    font-weight: 700;
                    letter-spacing: 0.5px;
                    text-transform: uppercase;
                    margin-bottom: 0.25rem;
                    text-align: right;
                }

        modal-denom-caja .page-wrapper .page-body .payment-money {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
            -webkit-flex-direction: row;
            -ms-flex-direction: row;
            flex-direction: row;
            -webkit-box-pack: end;
            -webkit-justify-content: flex-end;
            -ms-flex-pack: end;
            justify-content: flex-end;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            border-bottom: none;
        }

            modal-denom-caja .page-wrapper .page-body .payment-money span {
                font-size: 18px;
                font-weight: 600;
                margin-right: 1.5rem;
            }

            modal-denom-caja .page-wrapper .page-body .payment-money .form-control {
                width: 120px;
            }

    modal-denom-caja .page-wrapper .page-footer .btn {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

        modal-denom-caja .page-wrapper .page-footer .btn i {
            display: none;
            position: absolute;
            right: 1rem;
        }

            modal-denom-caja .page-wrapper .page-footer .btn i.lg {
                font-size: 24px;
            }

.modal-denomCaja .modal-wrapper {
    width: 600px;
    height: 750px;
    left: calc(50% - (600px/2));
    top: calc(50% - (750px/2));
}

@media only screen and (max-width: 480px) {
    .modal-denomCaja .modal-wrapper {
        top: 5%;
        left: 5%;
        width: 95%;
        height: 95%;
    }
}

modal-discount .page-wrapper {
    height: 100%;
    overflow-y: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

    modal-discount .page-wrapper .page-body {
        padding: 1rem;
        position: relative;
        height: calc(100% - 92px);
        background-color: white;
    }

        modal-discount .page-wrapper .page-body .client-container,
        modal-discount .page-wrapper .page-body .discount-money {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
            -webkit-box-align: stretch;
            -webkit-align-items: stretch;
            -ms-flex-align: stretch;
            align-items: stretch;
            padding: 2rem 1rem 0;
        }

            modal-discount .page-wrapper .page-body .client-container .form-container,
            modal-discount .page-wrapper .page-body .discount-money .form-container {
                width: 100%;
                margin-bottom: 2rem;
            }

                modal-discount .page-wrapper .page-body .client-container .form-container .control-label,
                modal-discount .page-wrapper .page-body .discount-money .form-container .control-label {
                    font-size: 16px;
                    font-weight: 700;
                    letter-spacing: 0.5px;
                    text-transform: uppercase;
                    margin-bottom: 0.25rem;
                }

                modal-discount .page-wrapper .page-body .client-container .form-container .btn-group,
                modal-discount .page-wrapper .page-body .discount-money .form-container .btn-group {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                }

                    modal-discount .page-wrapper .page-body .client-container .form-container .btn-group .btn,
                    modal-discount .page-wrapper .page-body .discount-money .form-container .btn-group .btn {
                        -webkit-box-flex: 1;
                        -webkit-flex-grow: 1;
                        -ms-flex-positive: 1;
                        flex-grow: 1;
                    }

                        modal-discount .page-wrapper .page-body .client-container .form-container .btn-group .btn.active,
                        modal-discount .page-wrapper .page-body .discount-money .form-container .btn-group .btn.active {
                            background-color: #1976d2;
                        }

                modal-discount .page-wrapper .page-body .client-container .form-container .form-control,
                modal-discount .page-wrapper .page-body .discount-money .form-container .form-control {
                    border: 1px solid #e0e0e0;
                    border-radius: 1rem;
                    padding: 0.75rem;
                    font-size: 16px;
                    font-weight: 700;
                }

                    modal-discount .page-wrapper .page-body .client-container .form-container .form-control:focus,
                    modal-discount .page-wrapper .page-body .discount-money .form-container .form-control:focus {
                        border-color: #00d45a;
                        -webkit-box-shadow: none;
                        box-shadow: none;
                    }

        modal-discount .page-wrapper .page-body .discount-money {
            border-bottom: none;
        }

        modal-discount .page-wrapper .page-body .discount-results {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
        }

            modal-discount .page-wrapper .page-body .discount-results .discount-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: end;
                -webkit-justify-content: flex-end;
                -ms-flex-pack: end;
                justify-content: flex-end;
                -webkit-box-align: end;
                -webkit-align-items: flex-end;
                -ms-flex-align: end;
                align-items: flex-end;
            }

                modal-discount .page-wrapper .page-body .discount-results .discount-container label {
                    margin: 0 0 2px;
                    font-size: 16px;
                    font-weight: 700;
                    letter-spacing: 0.5px;
                    text-transform: uppercase;
                }

                modal-discount .page-wrapper .page-body .discount-results .discount-container h4 {
                    padding: 0.5rem 1rem 0;
                    margin: 0;
                    min-width: 200px;
                    font-size: 24px;
                    font-weight: 800;
                    text-align: right;
                }

                    modal-discount .page-wrapper .page-body .discount-results .discount-container h4 small {
                        font-size: 50%;
                    }

        modal-discount .page-wrapper .page-body .warning {
            position: absolute;
            bottom: 0;
            left: 1rem;
            right: 1rem;
            border-radius: 1rem;
        }

    modal-discount .page-wrapper .page-footer .btn {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

        modal-discount .page-wrapper .page-footer .btn i {
            display: none;
            position: absolute;
            right: 1rem;
        }

            modal-discount .page-wrapper .page-footer .btn i.lg {
                font-size: 24px;
            }

modal-invoicing .page-wrapper {
    height: 100%;
    overflow-y: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

    modal-invoicing .page-wrapper .page-body {
        width: 100%;
        height: 100% !important;
        padding: 1rem 2rem 2rem;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

        modal-invoicing .page-wrapper .page-body .invoice-info {
            padding-bottom: 1rem;
        }

            modal-invoicing .page-wrapper .page-body .invoice-info .item-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: start;
                -webkit-justify-content: flex-start;
                -ms-flex-pack: start;
                justify-content: flex-start;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

                modal-invoicing .page-wrapper .page-body .invoice-info .item-container label {
                    font-weight: 500;
                    margin: 0;
                    color: #bdbdbd;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 60px;
                    -ms-flex: 0 0 60px;
                    flex: 0 0 60px;
                    margin-right: 0.5rem;
                }

                modal-invoicing .page-wrapper .page-body .invoice-info .item-container small {
                    color: #bdbdbd;
                    margin-left: 0.5rem;
                    font-weight: 700;
                }

                modal-invoicing .page-wrapper .page-body .invoice-info .item-container span {
                    display: inline-block;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    max-width: 100%;
                    font-weight: 600;
                    -webkit-box-align: baseline;
                    -webkit-align-items: baseline;
                    -ms-flex-align: baseline;
                    align-items: baseline;
                }

        modal-invoicing .page-wrapper .page-body .invoice-company-container {
            text-align: center;
            padding-bottom: 1rem;
        }

            modal-invoicing .page-wrapper .page-body .invoice-company-container h4 {
                color: #bdbdbd;
                font-size: 16px;
                font-weight: 600;
                margin: 1rem;
            }

            modal-invoicing .page-wrapper .page-body .invoice-company-container .options {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: space-evenly;
                -webkit-justify-content: space-evenly;
                -ms-flex-pack: space-evenly;
                justify-content: space-evenly;
            }

                modal-invoicing .page-wrapper .page-body .invoice-company-container .options .btn {
                    height: auto;
                    padding: 1rem 2rem;
                    border: 1px solid #e0e0e0;
                }

                    modal-invoicing .page-wrapper .page-body .invoice-company-container .options .btn .img-container {
                        width: 42px;
                        height: 42px;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        modal-invoicing .page-wrapper .page-body .invoice-company-container .options .btn .img-container img {
                            width: 100%;
                            height: auto;
                            -webkit-filter: grayscale(1);
                            filter: grayscale(1);
                            opacity: 0.4;
                            -webkit-transition: -webkit-filter 0.3s ease;
                            transition: -webkit-filter 0.3s ease;
                            transition: filter 0.3s ease;
                            transition: filter 0.3s ease, -webkit-filter 0.3s ease;
                        }

                    modal-invoicing .page-wrapper .page-body .invoice-company-container .options .btn span {
                        display: inline-block;
                        font-size: 20px;
                        width: 90px;
                        text-align: center;
                    }

                    modal-invoicing .page-wrapper .page-body .invoice-company-container .options .btn.active {
                        border-color: #00d45a;
                        -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                        box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                    }

                        modal-invoicing .page-wrapper .page-body .invoice-company-container .options .btn.active .img-container img {
                            -webkit-filter: none;
                            filter: none;
                            opacity: 1;
                        }

    modal-invoicing .page-wrapper .page-footer .btn {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

        modal-invoicing .page-wrapper .page-footer .btn i {
            display: none;
            position: absolute;
            right: 1rem;
        }

            modal-invoicing .page-wrapper .page-footer .btn i.lg {
                font-size: 24px;
            }

        modal-invoicing .page-wrapper .page-footer .btn + .btn {
            margin-left: 2rem;
        }

.modal-invoicing .modal-wrapper {
    width: 480px;
    height: 460px;
    left: calc(50% - (480px/2));
    top: calc(50% - (460px/2));
}

@media only screen and (max-width: 480px) {
    .modal-invoicing .modal-wrapper {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 0;
    }
}

.modal-invoicing.with-company .modal-wrapper {
    height: 600px;
    top: calc(50% - (600px/2));
}

@media only screen and (max-width: 480px) {
    .modal-invoicing.with-company .modal-wrapper {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 0;
    }
}

modal-invoicingv2 .page-wrapper {
    height: 100%;
    overflow-y: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

    modal-invoicingv2 .page-wrapper .page-body {
        width: 100%;
        height: 100% !important;
        padding: 1rem 2rem 2rem;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

        modal-invoicingv2 .page-wrapper .page-body .invoice-info {
            padding-bottom: 1rem;
        }

            modal-invoicingv2 .page-wrapper .page-body .invoice-info .item-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: start;
                -webkit-justify-content: flex-start;
                -ms-flex-pack: start;
                justify-content: flex-start;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

                modal-invoicingv2 .page-wrapper .page-body .invoice-info .item-container label {
                    font-weight: 500;
                    margin: 0;
                    color: #bdbdbd;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 60px;
                    -ms-flex: 0 0 60px;
                    flex: 0 0 60px;
                    margin-right: 0.5rem;
                }

                modal-invoicingv2 .page-wrapper .page-body .invoice-info .item-container small {
                    color: #bdbdbd;
                    margin-left: 0.5rem;
                    font-weight: 700;
                }

                modal-invoicingv2 .page-wrapper .page-body .invoice-info .item-container span {
                    display: inline-block;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    max-width: 100%;
                    font-weight: 600;
                    -webkit-box-align: baseline;
                    -webkit-align-items: baseline;
                    -ms-flex-align: baseline;
                    align-items: baseline;
                }

        modal-invoicingv2 .page-wrapper .page-body .invoice-company-container {
            text-align: center;
            padding-bottom: 1rem;
        }

            modal-invoicingv2 .page-wrapper .page-body .invoice-company-container h4 {
                color: #bdbdbd;
                font-size: 16px;
                font-weight: 600;
                margin: 1rem;
            }

            modal-invoicingv2 .page-wrapper .page-body .invoice-company-container .options {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: space-evenly;
                -webkit-justify-content: space-evenly;
                -ms-flex-pack: space-evenly;
                justify-content: space-evenly;
            }

                modal-invoicingv2 .page-wrapper .page-body .invoice-company-container .options .btn {
                    height: auto;
                    padding: 1rem 2rem;
                    border: 1px solid #e0e0e0;
                }

                    modal-invoicingv2 .page-wrapper .page-body .invoice-company-container .options .btn .img-container {
                        width: 42px;
                        height: 42px;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        modal-invoicingv2 .page-wrapper .page-body .invoice-company-container .options .btn .img-container img {
                            width: 100%;
                            height: auto;
                            -webkit-filter: grayscale(1);
                            filter: grayscale(1);
                            opacity: 0.4;
                            -webkit-transition: -webkit-filter 0.3s ease;
                            transition: -webkit-filter 0.3s ease;
                            transition: filter 0.3s ease;
                            transition: filter 0.3s ease, -webkit-filter 0.3s ease;
                        }

                    modal-invoicingv2 .page-wrapper .page-body .invoice-company-container .options .btn span {
                        display: inline-block;
                        font-size: 20px;
                        width: 90px;
                        text-align: center;
                    }

                    modal-invoicingv2 .page-wrapper .page-body .invoice-company-container .options .btn.active {
                        border-color: #00d45a;
                        -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                        box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                    }

                        modal-invoicingv2 .page-wrapper .page-body .invoice-company-container .options .btn.active .img-container img {
                            -webkit-filter: none;
                            filter: none;
                            opacity: 1;
                        }

    modal-invoicingv2 .page-wrapper .page-footer .btn {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

        modal-invoicingv2 .page-wrapper .page-footer .btn i {
            display: none;
            position: absolute;
            right: 1rem;
        }

            modal-invoicingv2 .page-wrapper .page-footer .btn i.lg {
                font-size: 24px;
            }

        modal-invoicingv2 .page-wrapper .page-footer .btn + .btn {
            margin-left: 2rem;
        }

.modal-invoicingv2 .modal-wrapper {
    width: 480px;
    height: 460px;
    left: calc(50% - (480px/2));
    top: calc(50% - (460px/2));
}

@media only screen and (max-width: 480px) {
    .modal-invoicingv2 .modal-wrapper {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 0;
    }
}

.modal-invoicingv2.with-company .modal-wrapper {
    height: 600px;
    top: calc(50% - (600px/2));
}

@media only screen and (max-width: 480px) {
    .modal-invoicingv2.with-company .modal-wrapper {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 0;
    }
}

modal-payment .page-wrapper {
    height: 100%;
    overflow-y: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

    modal-payment .page-wrapper .page-body {
        height: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        position: relative;
        overflow-y: auto;
    }

        modal-payment .page-wrapper .page-body .payment-type {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 300px;
            -ms-flex: 0 0 300px;
            flex: 0 0 300px;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-pack: start;
            -webkit-justify-content: flex-start;
            -ms-flex-pack: start;
            justify-content: flex-start;
            padding: 1rem;
            overflow-y: auto;
        }

            modal-payment .page-wrapper .page-body .payment-type .type-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-flow: column;
                -ms-flex-flow: column;
                flex-flow: column;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                margin: 0 0 1rem;
            }

                modal-payment .page-wrapper .page-body .payment-type .type-container input {
                    position: absolute;
                    top: 0;
                    left: 0;
                    display: none;
                }

                modal-payment .page-wrapper .page-body .payment-type .type-container .type-item {
                    width: 100%;
                    height: 74px;
                    position: relative;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: start;
                    -webkit-justify-content: flex-start;
                    -ms-flex-pack: start;
                    justify-content: flex-start;
                    -webkit-box-align: end;
                    -webkit-align-items: flex-end;
                    -ms-flex-align: end;
                    align-items: flex-end;
                    border: 1px solid #e0e0e0;
                    border-radius: 1rem;
                    padding: 1rem;
                    padding-right: 2rem;
                    cursor: pointer;
                    -webkit-transition: border-color 0.15s ease;
                    transition: border-color 0.15s ease;
                    overflow: hidden;
                }

                    modal-payment .page-wrapper .page-body .payment-type .type-container .type-item .icon {
                        position: absolute;
                        bottom: -2rem;
                        right: -2rem;
                    }

                        modal-payment .page-wrapper .page-body .payment-type .type-container .type-item .icon i {
                            font-size: 48px;
                            color: #525252;
                            -webkit-transition: color 0.15s ease;
                            transition: color 0.15s ease;
                        }

                        modal-payment .page-wrapper .page-body .payment-type .type-container .type-item .icon img {
                            height: 64px;
                            margin-bottom: -10px;
                            -webkit-filter: saturate(0);
                            filter: saturate(0);
                            opacity: 0.6;
                        }

                        modal-payment .page-wrapper .page-body .payment-type .type-container .type-item .icon .img {
                            width: 80px;
                            height: 80px;
                            -webkit-filter: grayscale(1);
                            filter: grayscale(1);
                            opacity: 0.25;
                            background-size: contain;
                            background-position: left top;
                            background-repeat: no-repeat;
                            background-image: url(https://webapp.crol.mx/pos/assets/imgs/svg/payment-methods/003-credit-card-2.svg);
                        }

                    modal-payment .page-wrapper .page-body .payment-type .type-container .type-item .text span {
                        color: #525252;
                        margin-top: 0.75rem;
                        display: block;
                        font-size: 16px;
                        font-weight: 800;
                        text-transform: uppercase;
                        -webkit-transition: color 0.15s ease;
                        transition: color 0.15s ease;
                    }

                modal-payment .page-wrapper .page-body .payment-type .type-container input:checked + .type-item {
                    border-color: #00be51;
                    background: -webkit-gradient(linear, left top, right bottom, from(#00d45a), to(#00be51));
                    background: linear-gradient(to bottom right, #00d45a, #00be51);
                    -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                    box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                }

                    modal-payment .page-wrapper .page-body .payment-type .type-container input:checked + .type-item .icon i {
                        color: #00d45a;
                    }

                    modal-payment .page-wrapper .page-body .payment-type .type-container input:checked + .type-item .icon img {
                        -webkit-filter: saturate(1);
                        filter: saturate(1);
                        opacity: 1;
                    }

                    modal-payment .page-wrapper .page-body .payment-type .type-container input:checked + .type-item .icon .img {
                        -webkit-filter: saturate(1);
                        filter: saturate(1);
                        opacity: 1;
                    }

                    modal-payment .page-wrapper .page-body .payment-type .type-container input:checked + .type-item .text {
                        position: relative;
                    }

                        modal-payment .page-wrapper .page-body .payment-type .type-container input:checked + .type-item .text span {
                            color: white;
                            text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
                        }

                modal-payment .page-wrapper .page-body .payment-type .type-container.disabled .type-item {
                    cursor: not-allowed;
                    opacity: 0.4;
                }

                modal-payment .page-wrapper .page-body .payment-type .type-container.method-1 .type-item .icon .img {
                    background-image: url(https://webapp.crol.mx/pos/assets/imgs/svg/payment-methods/001-money.svg);
                }

                modal-payment .page-wrapper .page-body .payment-type .type-container.method-2 .type-item .icon .img {
                    background-image: url(https://webapp.crol.mx/pos/assets/imgs/svg/payment-methods/check.svg);
                }

                modal-payment .page-wrapper .page-body .payment-type .type-container.method-3 .type-item .icon .img {
                    background-image: url(https://webapp.crol.mx/pos/assets/imgs/svg/payment-methods/002-master-card.svg);
                }

                modal-payment .page-wrapper .page-body .payment-type .type-container.method-4 .type-item .icon .img {
                    background-image: url(https://webapp.crol.mx/pos/assets/imgs/svg/payment-methods/003-credit-card-2.svg);
                }

                modal-payment .page-wrapper .page-body .payment-type .type-container.method-5 .type-item .icon .img {
                    background-image: url(https://webapp.crol.mx/pos/assets/imgs/svg/payment-methods/002-master-card.svg);
                }

                modal-payment .page-wrapper .page-body .payment-type .type-container.method-6 .type-item .icon .img {
                    background-image: url(https://webapp.crol.mx/pos/assets/imgs/svg/payment-methods/013-cash.svg);
                }

                modal-payment .page-wrapper .page-body .payment-type .type-container.method-7 .type-item .icon .img {
                    background-image: url(https://webapp.crol.mx/pos/assets/imgs/svg/payment-methods/009-gift-card.svg);
                }

                modal-payment .page-wrapper .page-body .payment-type .type-container.method-16 .type-item .icon .img {
                    background-image: url(https://webapp.crol.mx/pos/assets/imgs/svg/payment-methods/010-bill.svg);
                }

                modal-payment .page-wrapper .page-body .payment-type .type-container.method-38 .type-item .icon .img {
                    background-image: url(https://webapp.crol.mx/pos/assets/imgs/svg/payment-methods/009-gift-card.svg);
                }

            modal-payment .page-wrapper .page-body .payment-type:last-child {
                border-bottom: 1px solid #e0e0e0;
            }

        modal-payment .page-wrapper .page-body .client-container,
        modal-payment .page-wrapper .page-body .payment-money {
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-pack: start;
            -webkit-justify-content: flex-start;
            -ms-flex-pack: start;
            justify-content: flex-start;
            -webkit-box-align: start;
            -webkit-align-items: flex-start;
            -ms-flex-align: start;
            align-items: flex-start;
            padding: 2rem;
        }

            modal-payment .page-wrapper .page-body .client-container .form-group,
            modal-payment .page-wrapper .page-body .payment-money .form-group {
                width: 100%;
            }

        modal-payment .page-wrapper .page-body .payment-money {
            border-bottom: none;
        }

            modal-payment .page-wrapper .page-body .payment-money .form-container {
                width: 48%;
            }

            modal-payment .page-wrapper .page-body .payment-money .form-group {
                margin: 0;
                text-align: right;
            }

                modal-payment .page-wrapper .page-body .payment-money .form-group > label {
                    font-size: 12px;
                    margin: -4px 0 0;
                    display: block;
                    position: relative;
                }

                modal-payment .page-wrapper .page-body .payment-money .form-group h4 {
                    margin: 5px 0 0;
                    font-size: 24px;
                    font-weight: 700;
                }

                    modal-payment .page-wrapper .page-body .payment-money .form-group h4 small {
                        font-size: 65%;
                        color: #00d45a;
                    }

modal-payment .page-footer .btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

    modal-payment .page-footer .btn i {
        display: none;
        position: absolute;
        right: 1rem;
    }

        modal-payment .page-footer .btn i.lg {
            font-size: 24px;
        }

.modal-payments .modal-wrapper {
    position: absolute;
    width: 650px;
    height: 550px;
    top: calc(50% - (550px/2));
    left: calc(50% - (650px/2));
}

@media only screen and (max-width: 480px) {
    .modal-payments .modal-wrapper {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 0;
    }
}

modal-product-detail .page-wrapper {
    width: 100%;
    height: 100%;
    margin: 0 auto;
    overflow-y: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    background-color: #eaf0f3;
    border-radius: 1rem;
}

@media screen and (max-width: 480px) {
    modal-product-detail .page-wrapper {
        border-radius: 0;
    }
}

modal-product-detail .page-wrapper .product-image {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    border-radius: 1rem 0 0 1rem;
    position: relative;
}

    modal-product-detail .page-wrapper .product-image .image {
        position: absolute;
        top: 0;
        right: -1rem;
        bottom: 0;
        left: 0;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

modal-product-detail .page-wrapper .product-content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    background-color: white;
    padding: 6rem 0 0;
    border-radius: 1rem;
    -webkit-box-shadow: 0 12px 48px rgba(0, 0, 0, 0.25);
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.25);
}

@media screen and (max-width: 480px) {
    modal-product-detail .page-wrapper .product-content {
        padding: 5rem 0 0;
        border-radius: 0;
    }
}

modal-product-detail .page-wrapper .product-content .btn-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 54px;
    height: 54px;
    padding: 0;
    background-color: white;
}

    modal-product-detail .page-wrapper .product-content .btn-close i {
        font-size: 24px;
    }

modal-product-detail .page-wrapper .product-content .page-header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding: 0 2rem;
}

    modal-product-detail .page-wrapper .product-content .page-header .category {
        margin: 0 0 0.25rem;
        font-size: 14px;
        font-weight: 700;
        text-transform: uppercase;
        color: #00d45a;
    }

    modal-product-detail .page-wrapper .product-content .page-header .product-name {
        font-weight: 800;
        margin: 0 0 2rem;
    }

modal-product-detail .page-wrapper .product-content .page-body {
    padding: 0;
    -webkit-flex-shrink: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1;
    position: relative;
    overflow-y: auto;
    background-color: white;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

    modal-product-detail .page-wrapper .product-content .page-body .product-description {
        padding: 0 2rem;
        margin: 0 0 2rem;
    }

        modal-product-detail .page-wrapper .product-content .page-body .product-description p {
            font-size: 15px;
            font-style: italic;
            opacity: 0.75;
            margin: 0;
        }

    modal-product-detail .page-wrapper .product-content .page-body .detail-container {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

        modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-header {
            background-color: #f6f8fc;
        }

            modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-header .container-header {
                font-size: 15px;
                font-weight: 700;
                margin-bottom: 0.5rem;
            }

            modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-header .mat-expansion-panel-header-description {
                -webkit-box-pack: end;
                -webkit-justify-content: flex-end;
                -ms-flex-pack: end;
                justify-content: flex-end;
                font-style: italic;
                font-size: 13px;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

        modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body {
            padding: 1rem 2rem;
        }

            modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls .mat-radio-group {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                -ms-flex-direction: column;
                flex-direction: column;
            }

                modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls .mat-radio-group .mat-radio-button {
                    padding: 1rem 0;
                    border-bottom: 1px solid #e0e0e0;
                }

                    modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls .mat-radio-group .mat-radio-button .mat-radio-label {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-orient: horizontal;
                        -webkit-box-direction: reverse;
                        -webkit-flex-direction: row-reverse;
                        -ms-flex-direction: row-reverse;
                        flex-direction: row-reverse;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        padding: 0 2rem;
                    }

                        modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls .mat-radio-group .mat-radio-button .mat-radio-label .mat-radio-label-content::first-letter {
                            text-transform: uppercase;
                        }

                    modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls .mat-radio-group .mat-radio-button:last-child {
                        border-bottom: none;
                    }

            modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul {
                padding: 0;
                margin: 0;
                list-style: none;
            }

                modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: horizontal;
                    -webkit-box-direction: reverse;
                    -webkit-flex-direction: row-reverse;
                    -ms-flex-direction: row-reverse;
                    flex-direction: row-reverse;
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    padding: 1rem 1.5rem;
                    border-bottom: 1px solid #e0e0e0;
                }

                    modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout .mat-checkbox-inner-container {
                        margin: 0;
                    }

                    modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout .mat-checkbox-label {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        -webkit-box-flex: 1;
                        -webkit-flex-grow: 1;
                        -ms-flex-positive: 1;
                        flex-grow: 1;
                    }

                        modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout .mat-checkbox-label span {
                            display: block;
                        }

@media only screen and (max-width: 480px) {
    modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout .mat-checkbox-label span {
        white-space: normal;
    }
}

modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout .mat-checkbox-label span::first-letter {
    text-transform: uppercase;
}

modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout .mat-checkbox-label small {
    margin: 0 1rem;
}

modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li:last-child .mat-checkbox .mat-checkbox-layout {
    border-bottom: none;
}

modal-product-detail .page-wrapper .product-content .page-body p,
modal-product-detail .page-wrapper .product-content .page-body ul {
    font-size: 15px;
    font-weight: 600;
}

    modal-product-detail .page-wrapper .product-content .page-body p:last-of-type,
    modal-product-detail .page-wrapper .product-content .page-body ul:last-of-type {
        margin-bottom: 3px;
    }

    modal-product-detail .page-wrapper .product-content .page-body p strong,
    modal-product-detail .page-wrapper .product-content .page-body ul strong {
        color: #00d45a;
    }

modal-product-detail .page-wrapper .product-content .discount-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    background-color: #f6f8fc;
    padding: 1rem 2rem;
}

    modal-product-detail .page-wrapper .product-content .discount-container span {
        font-size: 16px;
        line-height: 1.2;
        text-align: right;
        margin-right: 1.5rem;
    }

        modal-product-detail .page-wrapper .product-content .discount-container span small {
            display: block;
        }

    modal-product-detail .page-wrapper .product-content .discount-container .mat-form-control .form-control {
        max-width: 120px;
        background-color: white;
    }

modal-product-detail .page-wrapper .product-content .page-footer {
    padding: 1rem;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background-color: #eaf0f3;
}

@media screen and (max-width: 480px) {
    modal-product-detail .page-wrapper .product-content .page-footer {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 1.5rem 3.5rem;
    }
}

modal-product-detail .page-wrapper .product-content .page-footer .button-container {
    padding: 0 1rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

@media screen and (max-width: 480px) {
    modal-product-detail .page-wrapper .product-content .page-footer .button-container {
        margin-bottom: 1rem;
    }
}

modal-product-detail .page-wrapper .product-content .page-footer .button-container span {
    padding: 0 1rem;
    font-size: 16px;
}

    modal-product-detail .page-wrapper .product-content .page-footer .button-container span:first-child {
        padding-left: 0;
    }

modal-product-detail .page-wrapper .product-content .page-footer .button-container button {
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 50%;
    background-color: white;
}

    modal-product-detail .page-wrapper .product-content .page-footer .button-container button i {
        font-size: 20px;
    }

modal-product-detail .page-wrapper .product-content .page-footer .button-container .quantity {
    width: 40px;
    margin: 0;
    text-align: center;
    font-size: 20px;
}

modal-product-detail .page-wrapper .product-content .page-footer .add-container .btn {
    border-radius: 1rem;
    padding: 1rem 2.25rem;
    font-size: 18px;
}

    modal-product-detail .page-wrapper .product-content .page-footer .add-container .btn span:first-child {
        margin-right: 1rem;
    }

.modal-product-detail .modal-wrapper {
    left: calc(50% - (500px / 2));
    position: absolute;
    width: 500px;
    background-color: transparent !important;
}

@media only screen and (max-width: 767px) and (max-height: 767px) {
    .modal-product-detail .modal-wrapper {
        border-radius: 0 !important;
        width: 100%;
        left: 0;
    }
}

.modal-product-detail .modal-wrapper .page-wrapper .product-image {
    display: none;
}

.modal-product-detail-image .modal-wrapper {
    left: calc(50% - (1000px / 2));
    position: absolute;
    width: 1000px;
    background-color: transparent !important;
}

@media only screen and (max-width: 767px) and (max-height: 767px) {
    .modal-product-detail-image .modal-wrapper {
        border-radius: 0 !important;
        width: 100%;
        left: 0;
    }
}

.modal-product-detail-image .modal-wrapper .page-wrapper {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}

modal-product-detail .page-wrapper {
    width: 100%;
    height: 100%;
    margin: 0 auto;
    overflow-y: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    background-color: #eaf0f3;
    border-radius: 1rem;
}

@media screen and (max-width: 480px) {
    modal-product-detail .page-wrapper {
        border-radius: 0;
    }
}

modal-product-detail .page-wrapper .product-image {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    border-radius: 1rem 0 0 1rem;
    position: relative;
}

    modal-product-detail .page-wrapper .product-image .image {
        position: absolute;
        top: 0;
        right: -1rem;
        bottom: 0;
        left: 0;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

modal-product-detail .page-wrapper .product-content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    background-color: white;
    padding: 6rem 0 0;
    border-radius: 1rem;
    -webkit-box-shadow: 0 12px 48px rgba(0, 0, 0, 0.25);
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.25);
}

@media screen and (max-width: 480px) {
    modal-product-detail .page-wrapper .product-content {
        padding: 5rem 0 0;
        border-radius: 0;
    }
}

modal-product-detail .page-wrapper .product-content .btn-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 54px;
    height: 54px;
    padding: 0;
    background-color: white;
}

    modal-product-detail .page-wrapper .product-content .btn-close i {
        font-size: 24px;
    }

modal-product-detail .page-wrapper .product-content .page-header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding: 0 2rem;
}

    modal-product-detail .page-wrapper .product-content .page-header .category {
        margin: 0 0 0.25rem;
        font-size: 14px;
        font-weight: 700;
        text-transform: uppercase;
        color: #00d45a;
    }

    modal-product-detail .page-wrapper .product-content .page-header .product-name {
        font-weight: 800;
        margin: 0 0 2rem;
    }

modal-product-detail .page-wrapper .product-content .page-body {
    padding: 0;
    -webkit-flex-shrink: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1;
    position: relative;
    overflow-y: auto;
    background-color: white;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

    modal-product-detail .page-wrapper .product-content .page-body .product-description {
        padding: 0 2rem;
        margin: 0 0 2rem;
    }

        modal-product-detail .page-wrapper .product-content .page-body .product-description p {
            font-size: 15px;
            font-style: italic;
            opacity: 0.75;
            margin: 0;
        }

    modal-product-detail .page-wrapper .product-content .page-body .detail-container {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

        modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-header {
            background-color: #f6f8fc;
        }

            modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-header .container-header {
                font-size: 15px;
                font-weight: 700;
                margin-bottom: 0.5rem;
            }

            modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-header .mat-expansion-panel-header-description {
                -webkit-box-pack: end;
                -webkit-justify-content: flex-end;
                -ms-flex-pack: end;
                justify-content: flex-end;
                font-style: italic;
                font-size: 13px;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

        modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body {
            padding: 1rem 2rem;
        }

            modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls .mat-radio-group {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                -ms-flex-direction: column;
                flex-direction: column;
            }

                modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls .mat-radio-group .mat-radio-button {
                    padding: 1rem 0;
                    border-bottom: 1px solid #e0e0e0;
                }

                    modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls .mat-radio-group .mat-radio-button .mat-radio-label {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-orient: horizontal;
                        -webkit-box-direction: reverse;
                        -webkit-flex-direction: row-reverse;
                        -ms-flex-direction: row-reverse;
                        flex-direction: row-reverse;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        padding: 0 2rem;
                    }

                        modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls .mat-radio-group .mat-radio-button .mat-radio-label .mat-radio-label-content::first-letter {
                            text-transform: uppercase;
                        }

                    modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls .mat-radio-group .mat-radio-button:last-child {
                        border-bottom: none;
                    }

            modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul {
                padding: 0;
                margin: 0;
                list-style: none;
            }

                modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: horizontal;
                    -webkit-box-direction: reverse;
                    -webkit-flex-direction: row-reverse;
                    -ms-flex-direction: row-reverse;
                    flex-direction: row-reverse;
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    padding: 1rem 1.5rem;
                    border-bottom: 1px solid #e0e0e0;
                }

                    modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout .mat-checkbox-inner-container {
                        margin: 0;
                    }

                    modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout .mat-checkbox-label {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        -webkit-box-flex: 1;
                        -webkit-flex-grow: 1;
                        -ms-flex-positive: 1;
                        flex-grow: 1;
                    }

                        modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout .mat-checkbox-label span {
                            display: block;
                        }

@media only screen and (max-width: 480px) {
    modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout .mat-checkbox-label span {
        white-space: normal;
    }
}

modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout .mat-checkbox-label span::first-letter {
    text-transform: uppercase;
}

modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li .mat-checkbox .mat-checkbox-layout .mat-checkbox-label small {
    margin: 0 1rem;
}

modal-product-detail .page-wrapper .product-content .page-body .detail-container .mat-expansion-panel-body .container-controls ul li:last-child .mat-checkbox .mat-checkbox-layout {
    border-bottom: none;
}

modal-product-detail .page-wrapper .product-content .page-body p,
modal-product-detail .page-wrapper .product-content .page-body ul {
    font-size: 15px;
    font-weight: 600;
}

    modal-product-detail .page-wrapper .product-content .page-body p:last-of-type,
    modal-product-detail .page-wrapper .product-content .page-body ul:last-of-type {
        margin-bottom: 3px;
    }

    modal-product-detail .page-wrapper .product-content .page-body p strong,
    modal-product-detail .page-wrapper .product-content .page-body ul strong {
        color: #00d45a;
    }

modal-product-detail .page-wrapper .product-content .discount-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    background-color: #f6f8fc;
    padding: 1rem 2rem;
}

    modal-product-detail .page-wrapper .product-content .discount-container span {
        font-size: 16px;
        line-height: 1.2;
        text-align: right;
        margin-right: 1.5rem;
    }

        modal-product-detail .page-wrapper .product-content .discount-container span small {
            display: block;
        }

    modal-product-detail .page-wrapper .product-content .discount-container .mat-form-control .form-control {
        max-width: 120px;
        background-color: white;
    }

modal-product-detail .page-wrapper .product-content .page-footer {
    padding: 1rem;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background-color: #eaf0f3;
}

@media screen and (max-width: 480px) {
    modal-product-detail .page-wrapper .product-content .page-footer {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 1.5rem 3.5rem;
    }
}

modal-product-detail .page-wrapper .product-content .page-footer .button-container {
    padding: 0 1rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

@media screen and (max-width: 480px) {
    modal-product-detail .page-wrapper .product-content .page-footer .button-container {
        margin-bottom: 1rem;
    }
}

modal-product-detail .page-wrapper .product-content .page-footer .button-container span {
    padding: 0 1rem;
    font-size: 16px;
}

    modal-product-detail .page-wrapper .product-content .page-footer .button-container span:first-child {
        padding-left: 0;
    }

modal-product-detail .page-wrapper .product-content .page-footer .button-container button {
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 50%;
    background-color: white;
}

    modal-product-detail .page-wrapper .product-content .page-footer .button-container button i {
        font-size: 20px;
    }

modal-product-detail .page-wrapper .product-content .page-footer .button-container .quantity {
    width: 40px;
    margin: 0;
    text-align: center;
    font-size: 20px;
}

modal-product-detail .page-wrapper .product-content .page-footer .add-container .btn {
    border-radius: 1rem;
    padding: 1rem 2.25rem;
    font-size: 18px;
}

    modal-product-detail .page-wrapper .product-content .page-footer .add-container .btn span:first-child {
        margin-right: 1rem;
    }

.modal-product-detail .modal-wrapper {
    left: calc(50% - (500px / 2));
    position: absolute;
    width: 500px;
    background-color: transparent !important;
}

@media only screen and (max-width: 767px) and (max-height: 767px) {
    .modal-product-detail .modal-wrapper {
        border-radius: 0 !important;
        width: 100%;
        left: 0;
    }
}

.modal-product-detail .modal-wrapper .page-wrapper .product-image {
    display: none;
}

.modal-product-detail-image .modal-wrapper {
    left: calc(50% - (1000px / 2));
    position: absolute;
    width: 1000px;
    background-color: transparent !important;
}

@media only screen and (max-width: 767px) and (max-height: 767px) {
    .modal-product-detail-image .modal-wrapper {
        border-radius: 0 !important;
        width: 100%;
        left: 0;
    }
}

.modal-product-detail-image .modal-wrapper .page-wrapper {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}

modal-return-items .page-wrapper {
    height: 100%;
    overflow-y: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

    modal-return-items .page-wrapper .page-body {
        padding: 3rem 2rem;
        position: relative;
        height: calc(100% - 122px);
        background-color: white;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

        modal-return-items .page-wrapper .page-body .products-container {
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
        }

            modal-return-items .page-wrapper .page-body .products-container h4 {
                font-size: 16px;
                margin: 0 0 1rem;
            }

            modal-return-items .page-wrapper .page-body .products-container .products-list {
                height: calc(100% - 46px - 3rem);
                overflow-y: auto;
            }

                modal-return-items .page-wrapper .page-body .products-container .products-list .product-item {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    padding: 0.5rem 0;
                    border-top: 1px solid #e0e0e0;
                }

                    modal-return-items .page-wrapper .page-body .products-container .products-list .product-item .item {
                        padding-left: 0;
                        min-height: 0;
                    }

                        modal-return-items .page-wrapper .page-body .products-container .products-list .product-item .item .checkbox {
                            margin: 0 1rem 0 0;
                        }

                        modal-return-items .page-wrapper .page-body .products-container .products-list .product-item .item .item-inner {
                            padding-right: 0;
                            border-bottom: 0;
                        }

                            modal-return-items .page-wrapper .page-body .products-container .products-list .product-item .item .item-inner .label {
                                font-size: 14px;
                            }

                    modal-return-items .page-wrapper .page-body .products-container .products-list .product-item .quantity-container {
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 60px;
                        -ms-flex: 0 0 60px;
                        flex: 0 0 60px;
                        padding-left: 1rem;
                    }

                        modal-return-items .page-wrapper .page-body .products-container .products-list .product-item .quantity-container input {
                            border: 1px solid #e0e0e0;
                            border-radius: 2px;
                            height: 36px;
                            padding: 0 1rem;
                        }

                    modal-return-items .page-wrapper .page-body .products-container .products-list .product-item .price {
                        padding: 0 1rem;
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 80px;
                        -ms-flex: 0 0 80px;
                        flex: 0 0 80px;
                        font-size: 18px;
                        font-weight: 600;
                        text-align: right;
                    }

                        modal-return-items .page-wrapper .page-body .products-container .products-list .product-item .price small {
                            font-size: 60%;
                        }

        modal-return-items .page-wrapper .page-body .sale-type {
            margin-top: auto;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            padding: 0rem 0rem 3rem;
        }

            modal-return-items .page-wrapper .page-body .sale-type .type-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-flow: column;
                -ms-flex-flow: column;
                flex-flow: column;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                margin: 0;
                padding-bottom: 2rem;
            }

                modal-return-items .page-wrapper .page-body .sale-type .type-container input {
                    position: absolute;
                    top: 0;
                    left: 0;
                    display: none;
                }

                modal-return-items .page-wrapper .page-body .sale-type .type-container .type-item {
                    width: 100%;
                    height: 120px;
                    position: relative;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: column;
                    -ms-flex-flow: column;
                    flex-flow: column;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    border: 1px solid #e0e0e0;
                    border-radius: 1rem;
                    padding: 1rem 2rem;
                    cursor: pointer;
                    -webkit-transition: border-color 0.15s ease;
                    transition: border-color 0.15s ease;
                }

                    modal-return-items .page-wrapper .page-body .sale-type .type-container .type-item .icon {
                        width: 100%;
                        height: 100%;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        modal-return-items .page-wrapper .page-body .sale-type .type-container .type-item .icon i {
                            font-size: 36px;
                            margin: 0 auto;
                            opacity: 0.6;
                        }

                    modal-return-items .page-wrapper .page-body .sale-type .type-container .type-item .text span {
                        color: #525252;
                        margin-top: 1rem;
                        display: block;
                        font-size: 14px;
                        font-weight: 700;
                        text-transform: uppercase;
                        text-align: center;
                        -webkit-transition: color 0.15s ease;
                        transition: color 0.15s ease;
                    }

                modal-return-items .page-wrapper .page-body .sale-type .type-container input:checked + .type-item {
                    border-color: #00d45a;
                    -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                    box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                }

                    modal-return-items .page-wrapper .page-body .sale-type .type-container input:checked + .type-item .icon i {
                        opacity: 1;
                    }

                    modal-return-items .page-wrapper .page-body .sale-type .type-container input:checked + .type-item .text span {
                        color: #00d45a;
                    }

                modal-return-items .page-wrapper .page-body .sale-type .type-container.disabled .type-item {
                    cursor: not-allowed;
                    opacity: 0.4;
                }

            modal-return-items .page-wrapper .page-body .sale-type:last-child {
                border-bottom: 1px solid #e0e0e0;
            }

modal-return-items .page-footer {
    padding: 0 4rem 3rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

    modal-return-items .page-footer .btn {
        width: 200px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

modal-sale-type .page-wrapper {
    height: 100%;
    overflow-y: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
    padding: 3rem 2rem;
}

    modal-sale-type .page-wrapper .page-body {
        position: relative;
    }

        modal-sale-type .page-wrapper .page-body .sale-type {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            padding: 0rem 0rem 2rem;
        }

            modal-sale-type .page-wrapper .page-body .sale-type .type-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-flow: column;
                -ms-flex-flow: column;
                flex-flow: column;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                margin: 0 15px;
                padding-bottom: 2rem;
            }

                modal-sale-type .page-wrapper .page-body .sale-type .type-container input {
                    position: absolute;
                    top: 0;
                    left: 0;
                    display: none;
                }

                modal-sale-type .page-wrapper .page-body .sale-type .type-container .type-item {
                    width: 160px;
                    height: 120px;
                    position: relative;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: column;
                    -ms-flex-flow: column;
                    flex-flow: column;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    border: 1px solid #e0e0e0;
                    border-radius: 1rem;
                    padding: 1rem;
                    cursor: pointer;
                    -webkit-transition: border-color 0.15s ease;
                    transition: border-color 0.15s ease;
                }

                    modal-sale-type .page-wrapper .page-body .sale-type .type-container .type-item .icon {
                        width: 100%;
                        height: 100%;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        modal-sale-type .page-wrapper .page-body .sale-type .type-container .type-item .icon .logo {
                            display: block;
                            width: 100%;
                            max-width: 80%;
                            height: 80%;
                            margin: 0 auto;
                            background-size: contain;
                            background-position: center;
                            background-repeat: no-repeat;
                            -webkit-filter: saturate(0);
                            filter: saturate(0);
                            opacity: 0.6;
                        }

                    modal-sale-type .page-wrapper .page-body .sale-type .type-container .type-item .text span {
                        color: #525252;
                        margin-top: 1rem;
                        display: block;
                        font-size: 14px;
                        font-weight: 700;
                        text-transform: uppercase;
                        -webkit-transition: color 0.15s ease;
                        transition: color 0.15s ease;
                    }

                modal-sale-type .page-wrapper .page-body .sale-type .type-container input:checked + .type-item {
                    border-color: #00d45a;
                    -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                    box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                }

                    modal-sale-type .page-wrapper .page-body .sale-type .type-container input:checked + .type-item .icon .logo {
                        -webkit-filter: none;
                        filter: none;
                        opacity: 1;
                    }

                    modal-sale-type .page-wrapper .page-body .sale-type .type-container input:checked + .type-item .text span {
                        color: #00d45a;
                    }

                modal-sale-type .page-wrapper .page-body .sale-type .type-container.disabled .type-item {
                    cursor: not-allowed;
                    opacity: 0.4;
                }

            modal-sale-type .page-wrapper .page-body .sale-type:last-child {
                border-bottom: 1px solid #e0e0e0;
            }

modal-sale-type .page-footer {
    padding: 3rem 4rem 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

    modal-sale-type .page-footer .btn {
        width: 200px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

modal-version-viewer .page-wrapper {
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

    modal-version-viewer .page-wrapper .page-body {
        height: calc(100% - 46px);
        overflow-y: auto;
        position: relative;
    }

        modal-version-viewer .page-wrapper .page-body .table td,
        modal-version-viewer .page-wrapper .page-body .table th {
            font-size: 12px;
        }

            modal-version-viewer .page-wrapper .page-body .table td:first-child {
                text-align: center;
            }

.navbar {
    padding: 0.5rem;
    height: 70px;
    background: white;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

    .navbar .navbar-brand {
        width: 180px;
        position: relative;
        z-index: 1;
        margin: 0;
        padding: 0;
    }

    .navbar .buttons-left,
    .navbar .buttons-right {
        width: calc(50% - 70px);
        display: -webkit-inline-box;
        display: -webkit-inline-flex;
        display: -ms-inline-flexbox;
        display: inline-flex;
    }

        .navbar .buttons-left > .navbar-nav,
        .navbar .buttons-right > .navbar-nav {
            display: -webkit-inline-box;
            display: -webkit-inline-flex;
            display: -ms-inline-flexbox;
            display: inline-flex;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
            -webkit-flex-flow: row;
            -ms-flex-flow: row;
            flex-flow: row;
        }

            .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link,
            .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler,
            .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container,
            .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link,
            .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler,
            .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container {
                font-size: 14px;
                font-weight: 400;
                padding: 5px 10px;
                text-transform: uppercase;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-transition: background-color 0.3s ease;
                transition: background-color 0.3s ease;
                border-radius: 1rem;
                position: relative;
                background-color: transparent;
                border: none;
                cursor: pointer;
            }

                .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .user-image,
                .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .user-image,
                .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .user-image,
                .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .user-image,
                .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .user-image,
                .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .user-image {
                    width: 38px;
                    height: 38px;
                    border-radius: 1rem;
                    background-position: center;
                    background-size: contain;
                    background-color: #eaf0f3;
                }

                    .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .user-image.no-photo,
                    .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .user-image.no-photo,
                    .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .user-image.no-photo,
                    .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .user-image.no-photo,
                    .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .user-image.no-photo,
                    .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .user-image.no-photo {
                        background: -webkit-gradient(linear, left top, right bottom, from(#00d45a), to(#28b52e));
                        background: linear-gradient(to bottom right, #00d45a, #28b52e);
                        border-radius: 0.5rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                    }

                        .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .user-image.no-photo span,
                        .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .user-image.no-photo span,
                        .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .user-image.no-photo span,
                        .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .user-image.no-photo span,
                        .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .user-image.no-photo span,
                        .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .user-image.no-photo span {
                            color: white;
                            font-size: 18px;
                            font-weight: 700;
                            text-transform: uppercase;
                            text-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
                        }

                .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .user-info,
                .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .user-info,
                .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .user-info,
                .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .user-info,
                .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .user-info,
                .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .user-info {
                    display: -webkit-inline-box;
                    display: -webkit-inline-flex;
                    display: -ms-inline-flexbox;
                    display: inline-flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: column;
                    -ms-flex-flow: column;
                    flex-flow: column;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: end;
                    -webkit-align-items: flex-end;
                    -ms-flex-align: end;
                    align-items: flex-end;
                    margin-right: 1rem;
                }

                    .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .user-info small,
                    .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .user-info span,
                    .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .user-info small,
                    .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .user-info span,
                    .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .user-info small,
                    .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .user-info span,
                    .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .user-info small,
                    .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .user-info span,
                    .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .user-info small,
                    .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .user-info span,
                    .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .user-info small,
                    .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .user-info span {
                        font-size: 15px;
                        white-space: nowrap;
                        color: #212121;
                        margin: 0;
                        text-transform: capitalize;
                    }

                    .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .user-info small,
                    .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .user-info small,
                    .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .user-info small,
                    .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .user-info small,
                    .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .user-info small,
                    .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .user-info small {
                        font-size: 12px;
                        display: none;
                    }

                .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .store-logo,
                .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .store-logo,
                .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .store-logo,
                .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .store-logo,
                .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .store-logo,
                .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .store-logo {
                    width: 80px;
                    height: 48px;
                    background-position: center;
                    background-size: contain;
                    background-repeat: no-repeat;
                }

                .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .store-info,
                .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .store-info,
                .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .store-info,
                .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .store-info,
                .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .store-info,
                .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .store-info {
                    display: -webkit-inline-box;
                    display: -webkit-inline-flex;
                    display: -ms-inline-flexbox;
                    display: inline-flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: column;
                    -ms-flex-flow: column;
                    flex-flow: column;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: start;
                    -webkit-align-items: flex-start;
                    -ms-flex-align: start;
                    align-items: flex-start;
                    margin-left: 1rem;
                }

                    .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .store-info h5,
                    .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .store-info h5,
                    .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .store-info h5,
                    .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .store-info h5,
                    .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .store-info h5,
                    .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .store-info h5 {
                        font-size: 14px;
                        font-weight: 800;
                        color: #212121;
                        text-align: left;
                        width: 260px;
                        margin: 0;
                    }

                    .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .store-info h3,
                    .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .store-info h3,
                    .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .store-info h3,
                    .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .store-info h3,
                    .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .store-info h3,
                    .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .store-info h3 {
                        font-size: 20px;
                        font-weight: 700;
                        color: #212121;
                        white-space: nowrap;
                        margin: 0;
                    }

                        .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .store-info h3 i,
                        .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .store-info h3 i,
                        .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .store-info h3 i,
                        .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .store-info h3 i,
                        .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .store-info h3 i,
                        .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .store-info h3 i {
                            margin-left: 1rem;
                            font-size: 14px;
                            opacity: 0.6;
                        }

                    .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .store-info small,
                    .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .store-info small,
                    .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .store-info small,
                    .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .store-info small,
                    .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .store-info small,
                    .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .store-info small {
                        text-transform: none;
                        letter-spacing: 0.5px;
                        margin-top: 0.25rem;
                    }

                .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link:hover,
                .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler:hover,
                .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container:hover,
                .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link:hover,
                .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler:hover,
                .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container:hover {
                    color: black;
                    background-color: rgba(0, 0, 0, 0.05);
                }

                .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .overlay,
                .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .overlay,
                .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .overlay,
                .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .overlay,
                .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .overlay,
                .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .overlay {
                    position: fixed;
                    top: 0;
                    bottom: 100%;
                    z-index: 5;
                    overflow: hidden;
                    background: transparent;
                }

                    .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .overlay .overlay__ripple,
                    .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .overlay .overlay__ripple,
                    .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .overlay .overlay__ripple,
                    .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .overlay .overlay__ripple,
                    .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .overlay .overlay__ripple,
                    .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .overlay .overlay__ripple {
                        cursor: default;
                        position: absolute;
                        top: 0;
                        width: 38px;
                        height: 38px;
                        border-radius: 38px;
                        background: black;
                        opacity: 0;
                        -webkit-transform-origin: 0 0;
                        transform-origin: 0 0;
                        -webkit-backface-visibility: hidden;
                        backface-visibility: hidden;
                        -webkit-transform: scale(0) translate(-50%, -50%);
                        transform: scale(0) translate(-50%, -50%);
                        -webkit-transition: opacity 0.6s ease-in-out, -webkit-transform 0.6s cubic-bezier(0.7, 0, 0.6, 0.8);
                        transition: opacity 0.6s ease-in-out, -webkit-transform 0.6s cubic-bezier(0.7, 0, 0.6, 0.8);
                        transition: transform 0.6s cubic-bezier(0.7, 0, 0.6, 0.8), opacity 0.6s ease-in-out;
                        transition: transform 0.6s cubic-bezier(0.7, 0, 0.6, 0.8), opacity 0.6s ease-in-out, -webkit-transform 0.6s cubic-bezier(0.7, 0, 0.6, 0.8);
                    }

                    .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .overlay.sbOpen,
                    .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .overlay.sbOpen,
                    .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .overlay.sbOpen,
                    .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .overlay.sbOpen,
                    .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .overlay.sbOpen,
                    .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .overlay.sbOpen {
                        bottom: 0;
                    }

                        .navbar .buttons-left > .navbar-nav > .nav-item > .nav-link .overlay.sbOpen .overlay__ripple,
                        .navbar .buttons-left > .navbar-nav > .nav-item .navbar-toggler .overlay.sbOpen .overlay__ripple,
                        .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container .overlay.sbOpen .overlay__ripple,
                        .navbar .buttons-right > .navbar-nav > .nav-item > .nav-link .overlay.sbOpen .overlay__ripple,
                        .navbar .buttons-right > .navbar-nav > .nav-item .navbar-toggler .overlay.sbOpen .overlay__ripple,
                        .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container .overlay.sbOpen .overlay__ripple {
                            opacity: 0.25;
                            -webkit-transform: scale(200) translate(-50%, -50%);
                            transform: scale(200) translate(-50%, -50%);
                        }

            .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container,
            .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container {
                cursor: default;
            }

                .navbar .buttons-left > .navbar-nav > .nav-item .nav-item-container:hover,
                .navbar .buttons-right > .navbar-nav > .nav-item .nav-item-container:hover {
                    color: black;
                    background-color: transparent;
                }

            .navbar .buttons-left > .navbar-nav > .nav-item .button-cuentas,
            .navbar .buttons-right > .navbar-nav > .nav-item .button-cuentas {
                width: auto;
                padding: 0.5rem 1rem !important;
            }

            .navbar .buttons-left > .navbar-nav > .nav-item .button-user,
            .navbar .buttons-right > .navbar-nav > .nav-item .button-user {
                padding: 0.5rem 0.5rem 0.5rem 1rem !important;
            }

        .navbar .buttons-left .navbar-nav .nav-item .nav-link .overlay,
        .navbar .buttons-left .navbar-nav .nav-item .navbar-toggler .overlay {
            left: 0;
        }

            .navbar .buttons-left .navbar-nav .nav-item .nav-link .overlay .overlay__ripple,
            .navbar .buttons-left .navbar-nav .nav-item .navbar-toggler .overlay .overlay__ripple {
                left: 0;
            }

        .navbar .buttons-left .navbar-nav .nav-item .nav-link:not(.collapsed) .overlay,
        .navbar .buttons-left .navbar-nav .nav-item .navbar-toggler:not(.collapsed) .overlay {
            right: 0;
        }

    .navbar .buttons-right {
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }

        .navbar .buttons-right .navbar-nav .nav-item .nav-link .overlay,
        .navbar .buttons-right .navbar-nav .nav-item .navbar-toggler .overlay {
            right: 0;
        }

            .navbar .buttons-right .navbar-nav .nav-item .nav-link .overlay .overlay__ripple,
            .navbar .buttons-right .navbar-nav .nav-item .navbar-toggler .overlay .overlay__ripple {
                right: 0;
            }

        .navbar .buttons-right .navbar-nav .nav-item .nav-link:not(.collapsed) .overlay,
        .navbar .buttons-right .navbar-nav .nav-item .navbar-toggler:not(.collapsed) .overlay {
            left: 0;
        }

        .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container {
            margin-right: 1rem;
        }

            .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .message, .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .done {
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                border-radius: 1rem;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                font-size: 18px;
                font-weight: 500;
                height: 46px;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                line-height: 1;
                padding: 0 1.5rem;
                width: 240px;
            }

                .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .message span, .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .done span {
                    font-weight: 700;
                    text-align: left;
                }

                    .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .message span small, .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .done span small {
                        display: block;
                        font-size: 12px;
                        margin-top: 2px;
                        opacity: 0.8;
                    }

                .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .message .icon-container .mat-spinner, .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .done .icon-container .mat-spinner {
                    width: 26px !important;
                    height: 26px !important;
                }

                    .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .message .icon-container .mat-spinner svg, .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .done .icon-container .mat-spinner svg {
                        width: 26px !important;
                        height: 26px !important;
                    }

                        .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .message .icon-container .mat-spinner svg *, .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .done .icon-container .mat-spinner svg * {
                            stroke: #bdbdbd !important;
                        }

                .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .message.error {
                    background-color: #e02626;
                    color: white;
                }

            .navbar .buttons-right .navbar-nav .nav-item .invoice-action-container .done {
                background-color: #2196f3;
                color: white;
            }

    .navbar.navbar-dark {
        background: -webkit-gradient(linear, left bottom, right top, from(#212121), color-stop(40%, #333));
        background: linear-gradient(to top right, #212121, #333 40%);
    }

        .navbar.navbar-dark .navbar-brand {
            width: 160px;
            position: relative;
            z-index: 1;
            margin: 0;
        }

        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item > .nav-link .user-image,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .navbar-toggler .user-image,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .nav-item-container .user-image,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item > .nav-link .user-image,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .navbar-toggler .user-image,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .nav-item-container .user-image {
            background-color: #212121;
        }

        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item > .nav-link .user-info small,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item > .nav-link .user-info span,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .navbar-toggler .user-info small,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .navbar-toggler .user-info span,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .nav-item-container .user-info small,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .nav-item-container .user-info span,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item > .nav-link .user-info small,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item > .nav-link .user-info span,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .navbar-toggler .user-info small,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .navbar-toggler .user-info span,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .nav-item-container .user-info small,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .nav-item-container .user-info span {
            color: white;
        }

        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item > .nav-link .store-logo,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .navbar-toggler .store-logo,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .nav-item-container .store-logo,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item > .nav-link .store-logo,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .navbar-toggler .store-logo,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .nav-item-container .store-logo {
            -webkit-filter: brightness(0) invert(1);
            filter: brightness(0) invert(1);
        }

        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item > .nav-link .store-info h5,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .navbar-toggler .store-info h5,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .nav-item-container .store-info h5,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item > .nav-link .store-info h5,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .navbar-toggler .store-info h5,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .nav-item-container .store-info h5 {
            color: rgba(255, 255, 255, 0.75);
        }

        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item > .nav-link .store-info h3,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .navbar-toggler .store-info h3,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .nav-item-container .store-info h3,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item > .nav-link .store-info h3,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .navbar-toggler .store-info h3,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .nav-item-container .store-info h3 {
            color: #FFF;
        }

        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item > .nav-link:hover,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .navbar-toggler:hover,
        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .nav-item-container:hover,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item > .nav-link:hover,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .navbar-toggler:hover,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .nav-item-container:hover {
            color: white;
            background-color: rgba(0, 0, 0, 0.15);
        }

        .navbar.navbar-dark .buttons-left > .navbar-nav > .nav-item .nav-item-container:hover,
        .navbar.navbar-dark .buttons-right > .navbar-nav > .nav-item .nav-item-container:hover {
            color: white;
        }

.header::after {
    display: none;
}

print-wrapper .invoice-POS {
    -webkit-box-shadow: 0 0 1in -0.25in rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 1in -0.25in rgba(0, 0, 0, 0.5);
    padding: 2mm;
    margin: 0 auto;
    width: 44mm;
    background: #fff;
}

    print-wrapper .invoice-POS ::-moz-selection {
        background: #f6f8fc;
        color: #fff;
    }

    print-wrapper .invoice-POS ::selection {
        background: #f6f8fc;
        color: #fff;
    }

    print-wrapper .invoice-POS ::moz-selection {
        background: #f6f8fc;
        color: #fff;
    }

    print-wrapper .invoice-POS h1 {
        font-size: 1.5em;
        color: 0.222;
    }

    print-wrapper .invoice-POS h2 {
        font-size: 0.9em;
    }

    print-wrapper .invoice-POS h3 {
        font-size: 1.2em;
        font-weight: 300;
        line-height: 2em;
    }

    print-wrapper .invoice-POS p {
        font-size: 0.7em;
        color: 0.666;
        line-height: 1.2em;
    }

    print-wrapper .invoice-POS .top,
    print-wrapper .invoice-POS .mid,
    print-wrapper .invoice-POS .bot {
        /* Targets all id with 'col-' */
        border-bottom: 1px solid #f6f8fc;
    }

    print-wrapper .invoice-POS .top {
        min-height: 100px;
    }

    print-wrapper .invoice-POS .mid {
        min-height: 80px;
    }

    print-wrapper .invoice-POS .bot {
        min-height: 50px;
    }

    print-wrapper .invoice-POS .top .logo {
        height: 60px;
        width: 60px;
        background: url(http://michaeltruong.ca/images/logo1.png) no-repeat;
        background-size: 60px 60px;
    }

    print-wrapper .invoice-POS .clientlogo {
        float: left;
        height: 60px;
        width: 60px;
        background: url(http://michaeltruong.ca/images/client.jpg) no-repeat;
        background-size: 60px 60px;
        border-radius: 50px;
    }

    print-wrapper .invoice-POS .info {
        display: block;
        margin-left: 0;
    }

    print-wrapper .invoice-POS .title {
        float: right;
    }

        print-wrapper .invoice-POS .title p {
            text-align: right;
        }

    print-wrapper .invoice-POS table {
        width: 100%;
        border-collapse: collapse;
    }

    print-wrapper .invoice-POS .table-title {
        font-size: 0.5em;
        background: #eee;
    }

    print-wrapper .invoice-POS .service {
        border-bottom: 1px solid #eee;
    }

    print-wrapper .invoice-POS .item {
        width: 24mm;
    }

    print-wrapper .invoice-POS .item-text {
        font-size: 0.5em;
    }

    print-wrapper .invoice-POS .legal-copy {
        margin-top: 5mm;
    }

sidebar-user {
    width: 300px;
    height: 100% !important;
    padding: 0;
    background: -webkit-gradient(linear, left top, left bottom, from(white), to(#f6f8fc));
    background: linear-gradient(to bottom, white, #f6f8fc);
    display: -webkit-box !important;
    display: -webkit-flex !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    position: fixed;
    bottom: 0;
    top: 0;
    right: -300px;
    z-index: 9999;
    -webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
    transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
    transition: transform 0.3s ease, opacity 0.3s ease;
    transition: transform 0.3s ease, opacity 0.3s ease, -webkit-transform 0.3s ease;
}

    sidebar-user .close-menu {
        position: absolute;
        top: 0.5rem;
        right: 0.5rem;
        width: 46px;
        height: 46px;
        padding: 0;
        font-size: 28px;
        color: initial;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        border-radius: 0.25rem;
        z-index: 6;
        -webkit-box-shadow: none;
        box-shadow: none;
        -webkit-transition: -webkit-box-shadow 0.3s ease;
        transition: -webkit-box-shadow 0.3s ease;
        transition: box-shadow 0.3s ease;
        transition: box-shadow 0.3s ease, -webkit-box-shadow 0.3s ease;
    }

        sidebar-user .close-menu:hover {
            -webkit-box-shadow: 1px 0 30px rgba(0, 0, 0, 0.1) !important;
            box-shadow: 1px 0 30px rgba(0, 0, 0, 0.1) !important;
        }

    sidebar-user .header {
        padding: 6rem 4rem 2rem;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

        sidebar-user .header .store-logo-container {
            margin-bottom: 2rem;
        }

        sidebar-user .header h2 {
            text-transform: none;
            white-space: nowrap;
            font-size: 20px;
            font-weight: 500;
            margin: 0;
        }

            sidebar-user .header h2 .name {
                display: inline-block;
                font-weight: 700;
                text-transform: capitalize !important;
            }

    sidebar-user .body {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        overflow-y: auto;
        overflow-x: hidden;
    }

        sidebar-user .body.main-menu {
            width: 100%;
            position: relative;
            z-index: 6;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
            list-style: none;
            padding: 0 3rem 1rem;
            overflow-x: hidden;
        }

            sidebar-user .body.main-menu .nav-item {
                position: relative;
            }

                sidebar-user .body.main-menu .nav-item .nav-link {
                    font-size: 18px;
                    color: #333;
                    font-weight: 500;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    position: relative;
                    -webkit-box-orient: horizontal;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: row;
                    -ms-flex-flow: row;
                    flex-flow: row;
                    padding: 1rem 0;
                    opacity: 0;
                    -webkit-transform: translateX(300px);
                    transform: translateX(300px);
                    -webkit-transition: opacity 1.5s, -webkit-transform 0.3s;
                    transition: opacity 1.5s, -webkit-transform 0.3s;
                    transition: opacity 1.5s, transform 0.3s;
                    transition: opacity 1.5s, transform 0.3s, -webkit-transform 0.3s;
                }

                    sidebar-user .body.main-menu .nav-item .nav-link .link-icon {
                        width: 36px;
                        height: 36px;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 36px;
                        -ms-flex: 0 0 36px;
                        flex: 0 0 36px;
                        padding: 0;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        margin-right: 1rem;
                        background-color: white;
                        border-radius: 50%;
                        font-size: 28px;
                    }

                        sidebar-user .body.main-menu .nav-item .nav-link .link-icon i {
                            opacity: 0.8;
                            -webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
                            transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
                            transition: transform 0.3s ease, opacity 0.3s ease;
                            transition: transform 0.3s ease, opacity 0.3s ease, -webkit-transform 0.3s ease;
                        }

                        sidebar-user .body.main-menu .nav-item .nav-link .link-icon img {
                            width: 30px;
                            height: auto;
                            -webkit-filter: invert(59%) sepia(22%) saturate(5038%) hue-rotate(104deg) brightness(112%) contrast(94%);
                            filter: invert(59%) sepia(22%) saturate(5038%) hue-rotate(104deg) brightness(112%) contrast(94%);
                            -webkit-transition: -webkit-transform 0.3s ease;
                            transition: -webkit-transform 0.3s ease;
                            transition: transform 0.3s ease;
                            transition: transform 0.3s ease, -webkit-transform 0.3s ease;
                        }

                    sidebar-user .body.main-menu .nav-item .nav-link .link-text {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        -webkit-box-flex: 1;
                        -webkit-flex-grow: 1;
                        -ms-flex-positive: 1;
                        flex-grow: 1;
                        -webkit-transition: padding 0.3s ease;
                        transition: padding 0.3s ease;
                        text-transform: none;
                        font-size: 18px;
                        font-weight: 600;
                        text-align: left;
                        color: #333;
                    }

                        sidebar-user .body.main-menu .nav-item .nav-link .link-text .badge {
                            position: relative;
                            top: -5px;
                            margin-left: 8px;
                            -webkit-box-shadow: none;
                            box-shadow: none;
                            font-weight: 600;
                            border-radius: 0.25rem;
                        }

                            sidebar-user .body.main-menu .nav-item .nav-link .link-text .badge small {
                                margin-left: 2px;
                            }

                sidebar-user .body.main-menu .nav-item:nth-child(1) .nav-link {
                    -webkit-transition-delay: 0.2s;
                    transition-delay: 0.2s;
                }

                sidebar-user .body.main-menu .nav-item:nth-child(2) .nav-link {
                    -webkit-transition-delay: 0.24s;
                    transition-delay: 0.24s;
                }

                sidebar-user .body.main-menu .nav-item:nth-child(3) .nav-link {
                    -webkit-transition-delay: 0.28s;
                    transition-delay: 0.28s;
                }

                sidebar-user .body.main-menu .nav-item:nth-child(4) .nav-link {
                    -webkit-transition-delay: 0.32s;
                    transition-delay: 0.32s;
                }

                sidebar-user .body.main-menu .nav-item:nth-child(5) .nav-link {
                    -webkit-transition-delay: 0.36s;
                    transition-delay: 0.36s;
                }

                sidebar-user .body.main-menu .nav-item:nth-child(6) .nav-link {
                    -webkit-transition-delay: 0.4s;
                    transition-delay: 0.4s;
                }

                sidebar-user .body.main-menu .nav-item:nth-child(7) .nav-link {
                    -webkit-transition-delay: 0.44s;
                    transition-delay: 0.44s;
                }

                sidebar-user .body.main-menu .nav-item:nth-child(8) .nav-link {
                    -webkit-transition-delay: 0.48s;
                    transition-delay: 0.48s;
                }

                sidebar-user .body.main-menu .nav-item:nth-child(9) .nav-link {
                    -webkit-transition-delay: 0.52s;
                    transition-delay: 0.52s;
                }

                sidebar-user .body.main-menu .nav-item:nth-child(10) .nav-link {
                    -webkit-transition-delay: 0.56s;
                    transition-delay: 0.56s;
                }

                sidebar-user .body.main-menu .nav-item:nth-child(11) .nav-link {
                    -webkit-transition-delay: 0.52s;
                    transition-delay: 0.52s;
                }

                sidebar-user .body.main-menu .nav-item:nth-child(12) .nav-link {
                    -webkit-transition-delay: 0.56s;
                    transition-delay: 0.56s;
                }

                sidebar-user .body.main-menu .nav-item:nth-child(13) .nav-link {
                    -webkit-transition-delay: 0.6s;
                    transition-delay: 0.6s;
                }

                sidebar-user .body.main-menu .nav-item:nth-child(14) .nav-link {
                    -webkit-transition-delay: 0.64s;
                    transition-delay: 0.64s;
                }

                sidebar-user .body.main-menu .nav-item:hover .nav-link .link-text {
                    padding-left: 0.5rem;
                }

                sidebar-user .body.main-menu .nav-item:hover .nav-link .link-icon img {
                    -webkit-transform: scale(1.1);
                    transform: scale(1.1);
                }

                sidebar-user .body.main-menu .nav-item:hover .nav-link .link-icon i {
                    opacity: 1;
                    -webkit-transform: scale(1.1);
                    transform: scale(1.1);
                }

                sidebar-user .body.main-menu .nav-item:hover:last-child .nav-link .link-icon i {
                    color: #ffc107;
                }

                sidebar-user .body.main-menu .nav-item .fast-mode-toggle {
                    padding: 1.5rem 0 1rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                }

                    sidebar-user .body.main-menu .nav-item .fast-mode-toggle .mat-slide-toggle {
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 42px;
                        -ms-flex: 0 0 42px;
                        flex: 0 0 42px;
                        margin-right: 6px;
                    }

                    sidebar-user .body.main-menu .nav-item .fast-mode-toggle .label {
                        padding-left: 1rem;
                    }

                        sidebar-user .body.main-menu .nav-item .fast-mode-toggle .label h4 {
                            text-transform: none;
                            font-size: 16px;
                            font-weight: 600;
                            color: #525252;
                            margin-bottom: 0.25rem;
                        }

                        sidebar-user .body.main-menu .nav-item .fast-mode-toggle .label p {
                            font-size: 12px;
                            margin: 0;
                            line-height: 1.5;
                        }

                sidebar-user .body.main-menu .nav-item.active .nav-link .link-icon {
                    background-color: #00d45a;
                }

                    sidebar-user .body.main-menu .nav-item.active .nav-link .link-icon img {
                        -webkit-filter: brightness(0) invert(1);
                        filter: brightness(0) invert(1);
                    }

        sidebar-user .body .version {
            padding: 1rem;
            text-align: right;
            font-size: 12px;
            z-index: 8;
        }

    sidebar-user .footer {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

        sidebar-user .footer .user-info {
            width: 100%;
            padding: 2rem 2rem 1rem;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
        }

            sidebar-user .footer .user-info .photo {
                width: 66px;
                height: 66px;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 66px;
                -ms-flex: 0 0 66px;
                flex: 0 0 66px;
                background-color: #eaf0f3;
                background-position: center;
                background-size: cover;
                border-radius: 0.5rem;
                -webkit-box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
                box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
            }

            sidebar-user .footer .user-info .no-photo {
                width: 66px;
                height: 66px;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 66px;
                -ms-flex: 0 0 66px;
                flex: 0 0 66px;
                background: -webkit-gradient(linear, left top, right bottom, from(#00d45a), to(#28b52e));
                background: linear-gradient(to bottom right, #00d45a, #28b52e);
                border-radius: 0.5rem;
                -webkit-box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
                box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
            }

                sidebar-user .footer .user-info .no-photo span {
                    color: white;
                    font-size: 26px;
                    font-weight: 700;
                    text-transform: uppercase;
                    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
                }

            sidebar-user .footer .user-info .info-container {
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                overflow: hidden;
                padding-left: 1rem;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                -ms-flex-direction: column;
                flex-direction: column;
                -webkit-box-pack: end;
                -webkit-justify-content: flex-end;
                -ms-flex-pack: end;
                justify-content: flex-end;
            }

                sidebar-user .footer .user-info .info-container .name {
                    font-size: 18px;
                    font-weight: 700;
                    margin-top: 1rem;
                    letter-spacing: -0.5px;
                    margin: 0;
                    color: #212121;
                    text-transform: capitalize;
                }

                sidebar-user .footer .user-info .info-container .email,
                sidebar-user .footer .user-info .info-container .perfil {
                    display: block;
                    font-size: 12px;
                    font-weight: 400;
                    color: #525252;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    overflow: hidden;
                }

                sidebar-user .footer .user-info .info-container .perfil {
                    font-size: 12px;
                    white-space: pre-wrap;
                }

                    sidebar-user .footer .user-info .info-container .perfil span {
                        color: #00d45a;
                        font-weight: 700;
                        text-transform: uppercase;
                    }

        sidebar-user .footer .buttons-container {
            padding: 0 1rem 2rem;
        }

            sidebar-user .footer .buttons-container .mat-slide-toggle {
                z-index: 8;
                margin-top: 0.5rem;
                height: 46px;
            }

                sidebar-user .footer .buttons-container .mat-slide-toggle .mat-slide-toggle-label {
                    -webkit-box-orient: horizontal;
                    -webkit-box-direction: normal;
                    -webkit-flex-direction: row;
                    -ms-flex-direction: row;
                    flex-direction: row;
                    padding: 0 1.5rem;
                }

                    sidebar-user .footer .buttons-container .mat-slide-toggle .mat-slide-toggle-label .mat-slide-toggle-bar {
                        width: 36px;
                        margin-left: 0;
                        margin-right: 1rem;
                    }

                    sidebar-user .footer .buttons-container .mat-slide-toggle .mat-slide-toggle-label .mat-slide-toggle-content {
                        font-size: 18px;
                        font-weight: 600;
                    }

            sidebar-user .footer .buttons-container .btn {
                z-index: 8;
                margin-top: 0.5rem;
                font-weight: 600;
            }

                sidebar-user .footer .buttons-container .btn .icon {
                    width: 36px;
                    height: 36px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    margin: 0;
                    margin-right: 1rem;
                    padding: 0;
                    text-transform: none;
                    -webkit-box-shadow: none;
                    box-shadow: none;
                    border-radius: 50%;
                    cursor: pointer;
                    background-color: rgba(255, 255, 255, 0.1);
                    -webkit-transition: all 0.3s ease;
                    transition: all 0.3s ease;
                    font-size: 28px;
                }

                sidebar-user .footer .buttons-container .btn span {
                    color: #333;
                }

                sidebar-user .footer .buttons-container .btn:hover .icon {
                    font-size: 24px;
                }

                    sidebar-user .footer .buttons-container .btn:hover .icon i {
                        color: white !important;
                    }

                sidebar-user .footer .buttons-container .btn.btn-password .icon i {
                    color: #ffa000;
                }

                sidebar-user .footer .buttons-container .btn.btn-password:hover .icon {
                    background-color: #ffa000;
                }

                sidebar-user .footer .buttons-container .btn.btn-logout .icon i {
                    color: #e02626;
                }

                sidebar-user .footer .buttons-container .btn.btn-logout:hover .icon {
                    background-color: #e02626;
                }

        sidebar-user .footer .copy {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
            -webkit-box-align: end;
            -webkit-align-items: flex-end;
            -ms-flex-align: end;
            align-items: flex-end;
            padding: 1rem 2rem;
            background-color: #eaf0f3;
        }

            sidebar-user .footer .copy a {
                color: #00d45a;
                font-weight: 600;
            }

            sidebar-user .footer .copy .version {
                font-size: 12px;
            }

    sidebar-user.open {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        -webkit-box-shadow: 1px 0 30px rgba(0, 0, 0, 0.1);
        box-shadow: 1px 0 30px rgba(0, 0, 0, 0.1);
    }

        sidebar-user.open .main-menu .nav-item .nav-link {
            opacity: 1;
            -webkit-transform: translateX(0);
            transform: translateX(0);
        }

        sidebar-user.open .overlay {
            display: block;
            opacity: 0.8;
            -webkit-transform: scale(1) translate3d(-50%, -50%, 0);
            transform: scale(1) translate3d(-50%, -50%, 0);
        }

 .page-wrapper {
    overflow: hidden;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0;
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: normal !important;
    -webkit-flex-direction: row !important;
    -ms-flex-direction: row !important;
    flex-direction: row !important;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

     .page-wrapper .form {
        position: relative;
        width: 33.3333%;
        height: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        background-color: white;
    }

@media screen and (max-width: 1024px) {
     .page-wrapper .form {
        width: 50%;
    }
}

@media screen and (max-width: 480px) {
     .page-wrapper .form {
        width: 100%;
    }
}

 .page-wrapper .form .form-container {
    width: 100%;
    max-width: 560px;
    margin: 0 auto;
    padding: 5rem 6rem 6rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 1;
    overflow: hidden;
}

@media screen and (min-width: 1025px) and (max-width: 1366px) {
     .page-wrapper .form .form-container {
        padding: 2.5rem 2rem;
    }
}

@media screen and (max-width: 480px) {
     .page-wrapper .form .form-container {
        padding: 2.5rem 2rem;
    }
}

 .page-wrapper .form .form-container .version {
    position: fixed;
    top: 1rem;
    right: 1rem;
    font-size: 14px;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.15);
}

 .page-wrapper .form .form-container .blob-container {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 220px;
    z-index: -1;
    overflow: hidden;
}

@media screen and (min-width: 1025px) and (max-width: 1366px) {
     .page-wrapper .form .form-container .blob-container {
        height: 120px;
    }
}

@media screen and (max-width: 1024px) {
     .page-wrapper .form .form-container .blob-container {
        height: 180px;
    }
}

@media screen and (max-width: 480px) {
     .page-wrapper .form .form-container .blob-container {
        height: 120px;
    }
}

 .page-wrapper .form .form-container .blob-container .blob {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin: 0 auto;
    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
    -webkit-animation: morph 6s linear infinite alternate;
    animation: morph 6s linear infinite alternate;
    position: absolute;
    top: 0;
    left: -25%;
    width: 200%;
    height: 300px;
    background: -webkit-gradient(linear, left top, left bottom, from(#08e465), to(#00be51));
    background: linear-gradient(to bottom, #08e465, #00be51);
}

@media screen and (max-width: 480px) {
     .page-wrapper .form .form-container .blob-container .blob {
        left: -15%;
        width: 150%;
        height: 200px;
    }
}

@-webkit-keyframes morph {
    0% {
        border-radius: 40% 60% 60% 40% / 70% 30% 70% 30%;
    }

    100% {
        border-radius: 40% 60%;
    }
}

@keyframes morph {
    0% {
        border-radius: 40% 60% 60% 40% / 70% 30% 70% 30%;
    }

    100% {
        border-radius: 40% 60%;
    }
}

 .page-wrapper .form .form-container .crol-logo {
    width: 280px;
    margin: auto auto 4rem;
    position: relative;
}

     .page-wrapper .form .form-container .crol-logo img {
        max-width: 100%;
    }

     .page-wrapper .form .form-container .crol-logo span {
        font-weight: 800;
        color: #00d45a;
        position: absolute;
        right: -10px;
        bottom: -39px;
        font-size: 46px;
        -webkit-transform: skew(-17deg, -6deg);
        transform: skew(-17deg, -6deg);
        z-index: -1;
        letter-spacing: -3px;
    }

 .page-wrapper .form .form-container h2 {
    width: 100%;
    font-size: 30px;
    font-weight: 700;
    text-align: center;
}

 .page-wrapper .form .form-container .subtitle {
    color: #757575;
    font-size: 20px;
    font-weight: 600;
    padding: 0 1rem;
    margin: 1rem auto 0.5rem;
}

@media screen and (max-width: 480px) {
     .page-wrapper .form .form-container .subtitle {
        display: none;
    }
}

 .page-wrapper .form .form-container .content {
    max-width: 600px;
    min-width: 100%;
    margin: 0 auto;
    padding: 0 2rem;
    border: 0;
}

     .page-wrapper .form .form-container .content .social-button-group {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

         .page-wrapper .form .form-container .content .social-button-group .btn-social {
            width: 54px;
            height: 54px;
            padding: 0;
            margin: 0.5rem 1rem;
        }

     .page-wrapper .form .form-container .content .form-group {
        margin: 0.5rem 0 1rem;
    }

         .page-wrapper .form .form-container .content .form-group .mat-form-field.d-none {
            display: none !important;
        }

         .page-wrapper .form .form-container .content .form-group .last-user-container {
            width: 100%;
            border: 1px solid #e0e0e0;
            border-radius: 1rem;
            position: relative;
            height: 46px;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-transition: border-color 0.15s ease, -webkit-box-shadow 0.3s ease;
            transition: border-color 0.15s ease, -webkit-box-shadow 0.3s ease;
            transition: border-color 0.15s ease, box-shadow 0.3s ease;
            transition: border-color 0.15s ease, box-shadow 0.3s ease, -webkit-box-shadow 0.3s ease;
            padding: 0.5rem;
        }

             .page-wrapper .form .form-container .content .form-group .last-user-container .user-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 auto;
                -ms-flex: 0 0 auto;
                flex: 0 0 auto;
            }

                 .page-wrapper .form .form-container .content .form-group .last-user-container .user-container .photo {
                    width: calc(46px - 1rem);
                    height: calc(46px - 1rem);
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 calc(46px - 1rem);
                    -ms-flex: 0 0 calc(46px - 1rem);
                    flex: 0 0 calc(46px - 1rem);
                    background-color: #eaf0f3;
                    background-position: center;
                    background-size: cover;
                    border-radius: 0.5rem;
                    -webkit-box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
                    box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
                }

                 .page-wrapper .form .form-container .content .form-group .last-user-container .user-container .no-photo {
                    width: calc(46px - 1rem);
                    height: calc(46px - 1rem);
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 calc(46px - 1rem);
                    -ms-flex: 0 0 calc(46px - 1rem);
                    flex: 0 0 calc(46px - 1rem);
                    background: -webkit-gradient(linear, left top, right bottom, from(#00d45a), to(#28b52e));
                    background: linear-gradient(to bottom right, #00d45a, #28b52e);
                    border-radius: 0.5rem;
                    -webkit-box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
                    box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                }

                     .page-wrapper .form .form-container .content .form-group .last-user-container .user-container .no-photo span {
                        color: white;
                        font-size: 18px;
                        font-weight: 700;
                        text-transform: uppercase;
                        text-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
                    }

                 .page-wrapper .form .form-container .content .form-group .last-user-container .user-container .username {
                    margin-left: 1rem;
                    font-size: 16px;
                    text-transform: capitalize;
                }

                     .page-wrapper .form .form-container .content .form-group .last-user-container .user-container .username small {
                        font-style: italic;
                        margin-left: 0.5rem;
                        text-transform: lowercase;
                    }

             .page-wrapper .form .form-container .content .form-group .last-user-container .btn {
                cursor: pointer;
                margin-left: auto;
                width: calc(46px - 1rem);
                height: calc(46px - 1rem);
            }

                 .page-wrapper .form .form-container .content .form-group .last-user-container .btn:hover {
                    background-color: rgba(0, 0, 0, 0.1);
                }

         .page-wrapper .form .form-container .content .form-group .control-label {
            font-weight: 600;
            padding-left: 1rem;
            margin-bottom: 0;
        }

         .page-wrapper .form .form-container .content .form-group .mat-form-control .mat-input-element {
            text-align: left !important;
        }

         .page-wrapper .form .form-container .content .form-group.remember {
            padding: 0 1rem;
            margin-bottom: 2rem;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
            font-size: 16px;
            font-weight: 400;
            color: #525252;
        }

@media screen and (max-width: 480px) {
     .page-wrapper .form .form-container .content .form-group.remember {
        padding: 0;
        font-size: 14px;
    }
}

 .page-wrapper .form .form-container .content .btn.btn-social {
    color: white;
}

     .page-wrapper .form .form-container .content .btn.btn-social img {
        max-width: 22px;
        max-height: 22px;
        -webkit-filter: brightness(0) invert(1);
        filter: brightness(0) invert(1);
        position: absolute;
        left: 1rem;
    }

     .page-wrapper .form .form-container .content .btn.btn-social span {
        display: inline-block;
        text-align: center;
    }

 .page-wrapper .form .form-container .error-label {
    margin: 3rem auto 0;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    display: block;
}

 .page-wrapper .form .form-container .change-form-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-top: 2rem;
    margin-top: auto;
}

     .page-wrapper .form .form-container .change-form-container span {
        text-align: center;
        color: white;
        font-size: 18px;
        font-weight: 600;
    }

         .page-wrapper .form .form-container .change-form-container span a {
            color: white;
        }

@media screen and (max-width: 480px) {
     .page-wrapper .form .form-container .change-form-container span a {
        font-size: 15px;
    }
}

 .page-wrapper .form .form-container .change-form-container .btn {
    padding: 0;
    height: 32px;
}

 .page-wrapper .sub-container {
    width: 66.6666%;
    height: 100%;
    background: #fff;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    position: relative;
}

@media screen and (max-width: 1024px) {
     .page-wrapper .sub-container {
        width: 50%;
    }
}

@media screen and (max-width: 480px) {
     .page-wrapper .sub-container {
        display: none;
    }
}

 .page-wrapper .sub-container .img {
    overflow: hidden;
    z-index: 2;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

    .page-wrapper .sub-container .img:before {
        content: '';
        position: absolute;
        right: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-image: url('/webapp2/assets/images/bg-login.png');
        /*background-image: url("https://webapp.crol.mx/pos/assets/imgs/backgrounds/bg-login.png");*/
        background-size: cover;
        background-position: center bottom;
        -webkit-transition: background-position 0.3s ease-in-out;
        transition: background-position 0.3s ease-in-out;
    }

        .page-wrapper .sub-container .img:before .recuperarContrasena {
            content: '';
            position: absolute;
            right: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-image: url('/webapp2/assets/images/Contrasena.png');
            /*background-image: url("https://webapp.crol.mx/pos/assets/imgs/backgrounds/Contrasena.png");*/
            background-size: cover;
            background-position: center bottom;
            -webkit-transition: background-position 0.3s ease-in-out;
            transition: background-position 0.3s ease-in-out;
        }

     .page-wrapper .sub-container .img:after {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.3)), to(rgba(0, 0, 0, 0.5)));
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.5));
        opacity: 0.85;
        outline: 6px solid #00d45a;
        outline-offset: -1.25rem;
    }

     .page-wrapper .sub-container .img .info-container {
        width: 100%;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        padding: 7rem 5rem;
        z-index: 2;
        -webkit-transition: -webkit-transform 0.3s ease-in-out;
        transition: -webkit-transform 0.3s ease-in-out;
        transition: transform 0.3s ease-in-out;
        transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    }

         .page-wrapper .sub-container .img .info-container .text {
            text-align: left;
            color: #fff;
            -webkit-transition: -webkit-transform 0.3s ease-in-out;
            transition: -webkit-transform 0.3s ease-in-out;
            transition: transform 0.3s ease-in-out;
            transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
        }

            .page-wrapper .sub-container .img .info-container .text h2 {
                font-size: 40px;
                font-weight: 800;
                color: white;
                line-height: 60px;
                margin: 0;
                text-shadow: 0 3px 18px rgba(0, 0, 0, 0.75);
                letter-spacing: -1px;
                text-transform: initial;
            }

                .page-wrapper .sub-container .img .info-container .text h2 strong {
                    display: block;
                    font-size: 78px;
                    font-weight: 800;
                    color: #00d45a;
                    text-transform: initial;
                }

         .page-wrapper .sub-container .img .info-container .button-container {
            z-index: 2;
            position: relative;
            text-align: center;
        }

         .page-wrapper .sub-container .img .info-container.sign-in {
            -webkit-transform: translateX(0);
            transform: translateX(0);
        }

         .page-wrapper .sub-container .img .info-container.with-keypad {
            -webkit-transform: translateX(0);
            transform: translateX(0);
        }

             .page-wrapper .sub-container .img .info-container.with-keypad .text {
                text-align: left !important;
            }

@media screen and (max-width: 1024px) {
     .page-wrapper .sub-container .img .info-container {
        padding: 5rem 3rem;
    }

         .page-wrapper .sub-container .img .info-container .text h2 {
            font-size: 24px;
            line-height: 36px;
        }

             .page-wrapper .sub-container .img .info-container .text h2 strong {
                font-size: 42px;
            }
}

page-cash-operations .page-wrapper .panel-cuentas {
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

    page-cash-operations .page-wrapper .panel-cuentas .row {
        height: 100%;
    }

    page-cash-operations .page-wrapper .panel-cuentas .col-header {
        background-color: #00d45a;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 46px;
        -ms-flex: 0 0 46px;
        flex: 0 0 46px;
        height: 46px;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

        page-cash-operations .page-wrapper .panel-cuentas .col-header .title {
            font-size: 18px;
            color: #FFF;
            margin: 0;
            padding: 1rem;
            padding-right: 0.3rem;
            white-space: nowrap;
        }

            page-cash-operations .page-wrapper .panel-cuentas .col-header .title i {
                font-size: 16px;
            }

        page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: end;
            -webkit-justify-content: flex-end;
            -ms-flex-pack: end;
            justify-content: flex-end;
            padding: 0 0.5rem;
            position: relative;
        }

            page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar i {
                color: #FFF;
            }

            page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar .btn {
                height: 36px;
                padding: 0 0.5rem;
                background-color: transparent !important;
                border-color: transparent !important;
                font-size: 15px;
                -webkit-transition: background-color 0.3s ease;
                transition: background-color 0.3s ease;
            }

                page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar .btn:hover {
                    background-color: rgba(0, 0, 0, 0.05) !important;
                }

                page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar .btn i {
                    font-size: 20px;
                }

                    page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar .btn i.lg {
                        font-size: 24px;
                    }

                page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar .btn span {
                    margin-left: 0.5rem;
                }

            page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar h4 {
                color: #FFF;
                margin: 0;
                font-size: 18px;
            }

            page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar .form-control {
                width: auto;
                display: -webkit-inline-box;
                display: -webkit-inline-flex;
                display: -ms-inline-flexbox;
                display: inline-flex;
                background-color: transparent;
                border: none;
                font-size: 15px;
                color: #FFF;
                -webkit-box-shadow: none;
                box-shadow: none;
                text-align: right;
                cursor: pointer;
            }

                page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar .form-control .item-inner {
                    padding-right: 0;
                }

                    page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar .form-control .item-inner .label {
                        margin-right: 0;
                    }

            page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar .datepicker-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                width: 100%;
            }

                page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar .datepicker-container .form-control {
                    width: calc(100% - 40px);
                    padding-right: 0;
                }

                page-cash-operations .page-wrapper .panel-cuentas .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button {
                    color: white;
                    line-height: 46px;
                }

    page-cash-operations .page-wrapper .panel-cuentas .scroll-pagos {
        max-height: calc(100vh - 148px);
        overflow-y: auto;
    }

    page-cash-operations .page-wrapper .panel-cuentas .scroll-desgloces {
        height: calc(100% - 46px);
        overflow-y: auto;
    }

    page-cash-operations .page-wrapper .panel-cuentas .col-body {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        padding: 1rem;
        height: calc(100% - 46px);
        overflow-y: auto;
    }

        page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
            position: relative;
            height: 100%;
        }

            page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                -ms-flex-direction: column;
                flex-direction: column;
            }

                page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .cashout-time {
                    font-size: 14px;
                    font-weight: 600;
                    text-align: right;
                    padding: 0.75rem 1rem;
                    margin: 1rem 0;
                    background-color: #f6f8fc;
                }

                    page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .cashout-time.uncashed {
                        background-color: #1e88e5;
                        color: white;
                    }

                page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout:first-child .cashout-time {
                    margin-top: 0;
                }

                page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item {
                    -webkit-box-orient: horizontal;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: row;
                    -ms-flex-flow: row;
                    flex-flow: row;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    margin-bottom: 1rem;
                }

                    page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-header {
                        padding: 1rem;
                        padding-right: 0;
                        border: none;
                        background-color: transparent;
                    }

                        page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-header .icon {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-orient: vertical;
                            -webkit-box-direction: normal;
                            -webkit-flex-flow: column;
                            -ms-flex-flow: column;
                            flex-flow: column;
                            color: #757575;
                            padding-right: 1rem;
                        }

                            page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-header .icon i {
                                font-size: 50px;
                            }

                            page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-header .icon span {
                                font-size: 8px;
                                font-weight: 800;
                                color: #bdbdbd;
                                letter-spacing: 1px;
                                text-align: center;
                                margin-top: -0.5rem;
                                text-transform: uppercase;
                                white-space: nowrap;
                            }

                    page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body {
                        padding: 0.5rem 1rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                    }

                        page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-orient: vertical;
                            -webkit-box-direction: normal;
                            -webkit-flex-flow: column;
                            -ms-flex-flow: column;
                            flex-flow: column;
                            -webkit-box-pack: start;
                            -webkit-justify-content: flex-start;
                            -ms-flex-pack: start;
                            justify-content: flex-start;
                            margin-left: 1rem;
                            padding-left: 2rem;
                            border-left: 1px solid rgba(0, 0, 0, 0.15);
                        }

                            page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info h4 {
                                color: #757575;
                                font-size: 20px;
                                font-weight: 700;
                                margin: 0;
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-align: center;
                                -webkit-align-items: center;
                                -ms-flex-align: center;
                                align-items: center;
                                padding-right: 1rem;
                            }

                            page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info .id-container,
                            page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info .time-container {
                                font-size: 10px;
                                color: #757575;
                                font-weight: 700;
                                text-transform: uppercase;
                                padding-right: 1rem;
                                line-height: 1.2;
                            }

                                page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info .id-container strong,
                                page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info .time-container strong {
                                    text-transform: none;
                                    display: block;
                                    font-size: 14px;
                                    color: #1e88e5;
                                }

                            page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info .id-container {
                                margin-bottom: 0.5rem;
                            }

                                page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info .id-container strong {
                                    font-size: 12px;
                                }

                        page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .inputs {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-pack: start;
                            -webkit-justify-content: flex-start;
                            -ms-flex-pack: start;
                            justify-content: flex-start;
                            -webkit-box-flex: 1;
                            -webkit-flex-grow: 1;
                            -ms-flex-positive: 1;
                            flex-grow: 1;
                        }

                            page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .inputs .form-container {
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-orient: vertical;
                                -webkit-box-direction: normal;
                                -webkit-flex-flow: column;
                                -ms-flex-flow: column;
                                flex-flow: column;
                                -webkit-box-pack: center;
                                -webkit-justify-content: center;
                                -ms-flex-pack: center;
                                justify-content: center;
                                padding-right: 1rem;
                            }

                                page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .inputs .form-container .control-label {
                                    font-size: 10px;
                                    color: #757575;
                                    font-weight: 700;
                                    text-transform: uppercase;
                                    margin-bottom: 0;
                                }

                                page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .inputs .form-container h4 {
                                    margin: 0;
                                    font-size: 26px;
                                    font-weight: 700;
                                }

                                    page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .inputs .form-container h4 small {
                                        font-size: 50%;
                                    }

                    page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-footer {
                        padding: 1rem;
                        padding-left: 0;
                        border: none;
                        background-color: transparent;
                    }

                        page-cash-operations .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-footer .btn {
                            width: 36px;
                            height: 36px;
                            font-size: 20px;
                            background-color: #eaf0f3;
                            border-radius: 50%;
                        }

        page-cash-operations .page-wrapper .panel-cuentas .col-body .reportes-container .reporte-item {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            position: relative;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
            border-bottom: 4px solid #eaf0f3;
            padding: 0.15rem 0;
            margin-bottom: 1rem;
            font-size: 16px;
        }

            page-cash-operations .page-wrapper .panel-cuentas .col-body .reportes-container .reporte-item .desc::first-letter {
                text-transform: uppercase;
            }

            page-cash-operations .page-wrapper .panel-cuentas .col-body .reportes-container .reporte-item .total {
                font-weight: 600;
            }

            page-cash-operations .page-wrapper .panel-cuentas .col-body .reportes-container .reporte-item .bar {
                width: 2px;
                height: 4px;
                border-top-right-radius: 500px;
                border-bottom-right-radius: 500px;
                background-color: #00d45a;
                background-color: #2196f3;
                position: absolute;
                bottom: -4px;
                left: 0;
                -webkit-transition: width 0.6s ease-in-out;
                transition: width 0.6s ease-in-out;
            }

    page-cash-operations .page-wrapper .panel-cuentas .col-new-operation,
    page-cash-operations .page-wrapper .panel-cuentas .col-operations,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail {
        padding: 0;
        height: 100%;
    }

        page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body {
            background-color: #f6f8fc;
            height: calc(100% - 46px);
            padding: 0;
        }

            page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .operation-type-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-justify-content: space-around;
                -ms-flex-pack: distribute;
                justify-content: space-around;
                z-index: 2;
                position: relative;
            }

                page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .operation-type-container .operation-type {
                    -webkit-box-flex: 1;
                    -webkit-flex: 1;
                    -ms-flex: 1;
                    flex: 1;
                    background-color: rgba(0, 0, 0, 0.05);
                    border-top: 4px solid transparent;
                    color: #757575;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    border-radius: 0;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    cursor: pointer;
                    position: relative;
                    height: 46px;
                }

                    page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .operation-type-container .operation-type .icon {
                        padding: 1.5rem;
                        position: absolute;
                        left: 0;
                        top: 0;
                        right: 0;
                        width: 46px;
                        height: 46px;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        display: none;
                    }

                        page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .operation-type-container .operation-type .icon i {
                            font-size: 24px;
                            -webkit-transform: rotate(180deg);
                            transform: rotate(180deg);
                        }

                    page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .operation-type-container .operation-type .text {
                        -webkit-box-flex: 1;
                        -webkit-flex-grow: 1;
                        -ms-flex-positive: 1;
                        flex-grow: 1;
                    }

                        page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .operation-type-container .operation-type .text h4 {
                            font-size: 18px;
                            font-weight: 700;
                            letter-spacing: 0.5px;
                            margin: 0;
                            text-align: center;
                        }

                    page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .operation-type-container .operation-type.active {
                        background-color: white;
                    }

                        page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .operation-type-container .operation-type.active .text h4 {
                            color: #333;
                        }

                        page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .operation-type-container .operation-type.active:first-child {
                            border-color: #ffa000;
                        }

                        page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .operation-type-container .operation-type.active:last-child {
                            border-color: #1e88e5;
                        }

            page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .form-container {
                background-color: white;
                background: -webkit-gradient(linear, left top, left bottom, from(white), to(#f6f8fc));
                background: linear-gradient(to bottom, white, #f6f8fc);
                border-radius: 0;
                -webkit-box-shadow: none;
                box-shadow: none;
                padding: 2rem 2rem 3rem;
                margin: 0;
            }

                page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .form-container .form-group.available {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    margin-bottom: 3rem;
                }

                    page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .form-container .form-group.available .form-control {
                        max-width: 50%;
                    }

                    page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .form-container .form-group.available .available-container label {
                        font-size: 12px;
                        margin: 0;
                        display: block;
                        position: relative;
                    }

                    page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .form-container .form-group.available .available-container h4 {
                        margin: 0;
                        font-size: 28px;
                        font-weight: 700;
                    }

                        page-cash-operations .page-wrapper .panel-cuentas .col-new-operation .col-body .form-container .form-group.available .available-container h4 small {
                            font-size: 12px;
                        }

    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail {
        background-color: #eaf0f3;
    }

        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-header {
            background-color: #00be51;
        }

        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
            -ms-flex-direction: column;
            flex-direction: column;
            height: 100%;
        }

            page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-wrapper {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                height: 100%;
            }

            page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container {
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                height: 100%;
                margin: 0 auto;
                max-width: 640px;
                overflow: auto;
                padding: 0 2rem;
                width: 100%;
            }

@media screen and (max-width: 1080px) {
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container {
        padding: 0 1.5rem 0 0.5rem;
    }
}

page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation {
    border-top: 4px solid #08e465;
    border-radius: 4px 4px 0 0;
    padding: calc(2rem + 15px);
    background-color: white;
    position: relative;
    -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info .cancelled,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products .cancelled,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments .cancelled {
        position: absolute;
        top: 0;
        right: 0;
    }

        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info .cancelled span,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products .cancelled span,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments .cancelled span {
            color: #e02626;
            text-transform: uppercase;
            font-weight: 700;
            font-size: 18px;
        }

    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info .operation-title .logo,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products .operation-title .logo,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments .operation-title .logo {
        width: 200px;
        height: 80px;
        margin-bottom: 3rem;
        background-size: contain;
        background-position: left top;
        background-repeat: no-repeat;
    }

    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info .operation-title h1,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products .operation-title h1,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments .operation-title h1 {
        font-size: 32px;
        font-weight: 700;
        color: #525252;
    }

    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info .operation-title h4,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products .operation-title h4,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments .operation-title h4 {
        font-size: 20px;
        font-weight: 700;
        color: #333;
        padding: 0 0 1.5rem;
    }

    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info ul,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products ul,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments ul {
        padding-bottom: 2rem;
    }

        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info ul li label,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products ul li label,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments ul li label {
            width: 100px;
            color: #757575;
            font-weight: 700;
        }

    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info table,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products table,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments table {
        border: none;
    }

        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info table th,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info table td,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products table th,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products table td,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments table th,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments table td {
            vertical-align: middle;
        }

        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info table td,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products table td,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments table td {
            font-weight: 700;
        }

        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info table th,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products table th,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments table th {
            font-weight: 500;
        }

        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info table tfoot th,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products table tfoot th,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments table tfoot th {
            font-weight: 700;
        }

        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info table tfoot td,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products table tfoot td,
        page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments table tfoot td {
            color: #00d45a;
            font-size: 30px;
            font-weight: 700;
            letter-spacing: -1px;
        }

            page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info table tfoot td small,
            page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products table tfoot td small,
            page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments table tfoot td small {
                color: #333;
                font-size: 50%;
            }

@media (min-width: 1200px) {
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-info,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-products,
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments {
        padding-right: 1rem;
    }
}

page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments {
    padding-top: 2rem;
    border-top: 1px dashed #e0e0e0;
}

    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments ul:last-child {
        border-bottom: none;
    }

@media (min-width: 1200px) {
    page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .operation-payments {
        padding-top: 0;
        padding-left: 3rem;
        border-left: 1px dashed #e0e0e0;
        border-top: none;
    }
}

page-cash-operations .page-wrapper .panel-cuentas .col-operation-detail .col-body .operation-container .operation .cutout {
    position: absolute;
    bottom: -6px;
    left: 0;
    width: 100%;
    height: 6px;
    background-size: auto 6px;
    background-position: center top;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
}

page-cash-operations .page-wrapper .panel-cuentas .col-operations {
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
    background-color: #f6f8fc;
}

    page-cash-operations .page-wrapper .panel-cuentas .col-operations .col-body {
        padding: 0;
        overflow: hidden;
    }

    page-cash-operations .page-wrapper .panel-cuentas .col-operations .filter-container {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 46px;
        -ms-flex: 0 0 46px;
        flex: 0 0 46px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        z-index: 9;
        position: relative;
        border-bottom: 1px solid #eaf0f3;
    }

        page-cash-operations .page-wrapper .panel-cuentas .col-operations .filter-container .search-icon {
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
            width: 46px;
            height: 46px;
            display: -webkit-inline-box;
            display: -webkit-inline-flex;
            display: -ms-inline-flexbox;
            display: inline-flex;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            font-size: 16px;
            opacity: 0.6;
        }

        page-cash-operations .page-wrapper .panel-cuentas .col-operations .filter-container .form-control {
            height: 46px;
            border: transparent;
            border-radius: 0;
            padding-left: 46px;
            font-size: 16px;
        }

            page-cash-operations .page-wrapper .panel-cuentas .col-operations .filter-container .form-control::-webkit-input-placeholder {
                font-style: italic;
            }

            page-cash-operations .page-wrapper .panel-cuentas .col-operations .filter-container .form-control::-moz-placeholder {
                font-style: italic;
            }

            page-cash-operations .page-wrapper .panel-cuentas .col-operations .filter-container .form-control::-ms-input-placeholder {
                font-style: italic;
            }

            page-cash-operations .page-wrapper .panel-cuentas .col-operations .filter-container .form-control::placeholder {
                font-style: italic;
            }

            page-cash-operations .page-wrapper .panel-cuentas .col-operations .filter-container .form-control:focus {
                outline: none;
                -webkit-box-shadow: none;
                box-shadow: none;
            }

        page-cash-operations .page-wrapper .panel-cuentas .col-operations .filter-container .btn {
            height: 52px;
            border-radius: 0;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 52px;
            -ms-flex: 0 0 52px;
            flex: 0 0 52px;
            padding: 0;
        }

            page-cash-operations .page-wrapper .panel-cuentas .col-operations .filter-container .btn i {
                margin-right: 0;
                margin-left: 0;
                font-size: 18px;
            }

    page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        height: calc(100% - 46px);
        overflow-y: auto;
    }

        page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul {
            padding: 0;
            list-style: none;
        }

            page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul li .operation-item {
                background-color: rgba(255, 255, 255, 0.5);
                border-bottom: 1px solid rgba(0, 0, 0, 0.05);
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                cursor: pointer;
                position: relative;
            }

                page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul li .operation-item .info {
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    padding: 1.5rem 2rem;
                }

                    page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul li .operation-item .info h2 {
                        font-size: 16px;
                        margin: 0 0 0.25rem;
                    }

                        page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul li .operation-item .info h2 strong {
                            display: inline-block;
                            width: 72px;
                        }

                    page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul li .operation-item .info p {
                        font-style: italic;
                        font-weight: 400;
                        margin: 0;
                    }

                        page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul li .operation-item .info p strong {
                            display: inline-block;
                            font-weight: 400;
                            width: 72px;
                        }

                page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul li .operation-item .status {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 18px;
                    -ms-flex: 0 0 18px;
                    flex: 0 0 18px;
                }

                page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul li .operation-item .status-item {
                    position: absolute;
                    right: 0;
                    top: 0;
                    height: 100%;
                    width: 18px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul li .operation-item .status-item span {
                        -webkit-transform: rotate(-90deg);
                        transform: rotate(-90deg);
                        display: block;
                        color: white;
                        font-size: 8px;
                        font-weight: 700;
                        text-transform: uppercase;
                    }

                    page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul li .operation-item .status-item.withdrawal {
                        background-color: #ffa000;
                    }

                    page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul li .operation-item .status-item.deposit {
                        background-color: #1e88e5;
                    }

            page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul li.active {
                -webkit-box-shadow: 0 0 16px -8px rgba(0, 0, 0, 0.5);
                box-shadow: 0 0 16px -8px rgba(0, 0, 0, 0.5);
            }

                page-cash-operations .page-wrapper .panel-cuentas .col-operations .operations-container ul li.active .item {
                    background-color: white;
                    border-color: #00d45a;
                }

page-cashier-history .page-wrapper .panel-cuentas {
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

    page-cashier-history .page-wrapper .panel-cuentas .row {
        height: 100%;
    }

    page-cashier-history .page-wrapper .panel-cuentas .col-header {
        background-color: #00d45a;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 46px;
        -ms-flex: 0 0 46px;
        flex: 0 0 46px;
        height: 46px;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

        page-cashier-history .page-wrapper .panel-cuentas .col-header .title {
            font-size: 18px;
            color: #FFF;
            margin: 0;
            padding: 1rem;
            padding-right: 0.3rem;
            white-space: nowrap;
        }

            page-cashier-history .page-wrapper .panel-cuentas .col-header .title i {
                font-size: 16px;
            }

        page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: end;
            -webkit-justify-content: flex-end;
            -ms-flex-pack: end;
            justify-content: flex-end;
            padding: 0 0.5rem;
            position: relative;
        }

            page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar i {
                color: #FFF;
            }

            page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar .btn {
                height: 36px;
                padding: 0 1rem;
                background-color: transparent !important;
                border-color: transparent !important;
                font-size: 15px;
                -webkit-transition: background-color 0.3s ease;
                transition: background-color 0.3s ease;
            }

                page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar .btn:hover {
                    background-color: rgba(0, 0, 0, 0.05) !important;
                }

                page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar .btn i {
                    font-size: 20px;
                }

                    page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar .btn i.lg {
                        font-size: 24px;
                    }

                page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar .btn span {
                    margin-left: 0.5rem;
                }

            page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar h4 {
                color: #FFF;
                margin: 0;
                font-size: 18px;
            }

            page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar .form-control {
                width: auto;
                display: -webkit-inline-box;
                display: -webkit-inline-flex;
                display: -ms-inline-flexbox;
                display: inline-flex;
                background-color: transparent;
                border: none;
                font-size: 15px;
                color: #FFF;
                -webkit-box-shadow: none;
                box-shadow: none;
                text-align: right;
                cursor: pointer;
            }

                page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar .form-control .item-inner {
                    padding-right: 0;
                }

                    page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar .form-control .item-inner .label {
                        margin-right: 0;
                    }

            page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar .datepicker-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                width: 100%;
            }

                page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar .datepicker-container .form-control {
                    width: calc(100% - 40px);
                    padding-right: 0;
                }

                page-cashier-history .page-wrapper .panel-cuentas .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button {
                    color: white;
                    line-height: 46px;
                }

    page-cashier-history .page-wrapper .panel-cuentas .scroll-pagos {
        max-height: calc(100vh - 148px);
        overflow-y: auto;
    }

    page-cashier-history .page-wrapper .panel-cuentas .scroll-desgloces {
        height: calc(100% - 46px);
        overflow-y: auto;
    }

    page-cashier-history .page-wrapper .panel-cuentas .col-body {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        padding: 1rem;
        height: calc(100% - 46px);
        overflow-y: auto;
    }

        page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
            position: relative;
            height: 100%;
        }

            page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                -ms-flex-direction: column;
                flex-direction: column;
            }

                page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .cashout-time {
                    font-size: 14px;
                    font-weight: 600;
                    text-align: right;
                    padding: 0.75rem 1rem;
                    margin: 1rem 0;
                    background-color: #f6f8fc;
                }

                    page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .cashout-time.uncashed {
                        background-color: #1e88e5;
                        color: white;
                    }

                page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout:first-child .cashout-time {
                    margin-top: 0;
                }

                page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item {
                    -webkit-box-orient: horizontal;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: row;
                    -ms-flex-flow: row;
                    flex-flow: row;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    margin-bottom: 1rem;
                }

                    page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-header {
                        padding: 1rem;
                        padding-right: 0;
                        border: none;
                        background-color: transparent;
                    }

                        page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-header .icon {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-orient: vertical;
                            -webkit-box-direction: normal;
                            -webkit-flex-flow: column;
                            -ms-flex-flow: column;
                            flex-flow: column;
                            color: #757575;
                            padding-right: 1rem;
                        }

                            page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-header .icon i {
                                font-size: 50px;
                            }

                            page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-header .icon span {
                                font-size: 8px;
                                font-weight: 800;
                                color: #bdbdbd;
                                letter-spacing: 1px;
                                text-align: center;
                                margin-top: -0.5rem;
                                text-transform: uppercase;
                                white-space: nowrap;
                            }

                    page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body {
                        padding: 0.5rem 1rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                    }

                        page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-orient: vertical;
                            -webkit-box-direction: normal;
                            -webkit-flex-flow: column;
                            -ms-flex-flow: column;
                            flex-flow: column;
                            -webkit-box-pack: start;
                            -webkit-justify-content: flex-start;
                            -ms-flex-pack: start;
                            justify-content: flex-start;
                            margin-left: 1rem;
                            padding-left: 2rem;
                            border-left: 1px solid rgba(0, 0, 0, 0.15);
                        }

                            page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info h4 {
                                color: #757575;
                                font-size: 20px;
                                font-weight: 700;
                                margin: 0;
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-align: center;
                                -webkit-align-items: center;
                                -ms-flex-align: center;
                                align-items: center;
                                padding-right: 1rem;
                            }

                            page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info .id-container,
                            page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info .time-container {
                                font-size: 10px;
                                color: #757575;
                                font-weight: 700;
                                text-transform: uppercase;
                                padding-right: 1rem;
                                line-height: 1.2;
                            }

                                page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info .id-container strong,
                                page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info .time-container strong {
                                    text-transform: none;
                                    display: block;
                                    font-size: 14px;
                                    color: #1e88e5;
                                }

                            page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info .id-container {
                                margin-bottom: 0.5rem;
                            }

                                page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .info .id-container strong {
                                    font-size: 12px;
                                }

                        page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .inputs {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-pack: start;
                            -webkit-justify-content: flex-start;
                            -ms-flex-pack: start;
                            justify-content: flex-start;
                            -webkit-box-flex: 1;
                            -webkit-flex-grow: 1;
                            -ms-flex-positive: 1;
                            flex-grow: 1;
                        }

                            page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .inputs .form-container {
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-orient: vertical;
                                -webkit-box-direction: normal;
                                -webkit-flex-flow: column;
                                -ms-flex-flow: column;
                                flex-flow: column;
                                -webkit-box-pack: center;
                                -webkit-justify-content: center;
                                -ms-flex-pack: center;
                                justify-content: center;
                                padding-right: 1rem;
                            }

                                page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .inputs .form-container .control-label {
                                    font-size: 10px;
                                    color: #757575;
                                    font-weight: 700;
                                    text-transform: uppercase;
                                    margin-bottom: 0;
                                }

                                page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .inputs .form-container h4 {
                                    margin: 0;
                                    font-size: 26px;
                                    font-weight: 700;
                                }

                                    page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-body .inputs .form-container h4 small {
                                        font-size: 50%;
                                    }

                    page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-footer {
                        padding: 1rem;
                        padding-left: 0;
                        border: none;
                        background-color: transparent;
                    }

                        page-cashier-history .page-wrapper .panel-cuentas .col-body .payments-container .cashout .payment-item .card-footer .btn {
                            width: 36px;
                            height: 36px;
                            font-size: 20px;
                            background-color: #eaf0f3;
                            border-radius: 50%;
                        }

    page-cashier-history .page-wrapper .panel-cuentas .col-breakdown,
    page-cashier-history .page-wrapper .panel-cuentas .col-orders,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail {
        padding: 0;
        height: 100%;
    }

    page-cashier-history .page-wrapper .panel-cuentas .col-orders {
        background-color: #f6f8fc;
        height: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-flow: column;
        -ms-flex-flow: column;
        flex-flow: column;
    }

        page-cashier-history .page-wrapper .panel-cuentas .col-orders .col-body {
            padding: 0;
            overflow: hidden;
        }

        page-cashier-history .page-wrapper .panel-cuentas .col-orders .filter-container {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 46px;
            -ms-flex: 0 0 46px;
            flex: 0 0 46px;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            z-index: 9;
            position: relative;
            border-bottom: 1px solid #eaf0f3;
        }

            page-cashier-history .page-wrapper .panel-cuentas .col-orders .filter-container .search-icon {
                position: absolute;
                top: 0;
                left: 0;
                z-index: 1;
                width: 46px;
                height: 46px;
                display: -webkit-inline-box;
                display: -webkit-inline-flex;
                display: -ms-inline-flexbox;
                display: inline-flex;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                font-size: 16px;
                opacity: 0.6;
            }

            page-cashier-history .page-wrapper .panel-cuentas .col-orders .filter-container .form-control {
                height: 46px;
                border: transparent;
                border-radius: 0;
                padding-left: 46px;
                font-size: 16px;
            }

                page-cashier-history .page-wrapper .panel-cuentas .col-orders .filter-container .form-control::-webkit-input-placeholder {
                    font-style: italic;
                }

                page-cashier-history .page-wrapper .panel-cuentas .col-orders .filter-container .form-control::-moz-placeholder {
                    font-style: italic;
                }

                page-cashier-history .page-wrapper .panel-cuentas .col-orders .filter-container .form-control::-ms-input-placeholder {
                    font-style: italic;
                }

                page-cashier-history .page-wrapper .panel-cuentas .col-orders .filter-container .form-control::placeholder {
                    font-style: italic;
                }

                page-cashier-history .page-wrapper .panel-cuentas .col-orders .filter-container .form-control:focus {
                    outline: none;
                    -webkit-box-shadow: none;
                    box-shadow: none;
                }

            page-cashier-history .page-wrapper .panel-cuentas .col-orders .filter-container .btn {
                height: 52px;
                border-radius: 0;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 52px;
                -ms-flex: 0 0 52px;
                flex: 0 0 52px;
                padding: 0;
            }

                page-cashier-history .page-wrapper .panel-cuentas .col-orders .filter-container .btn i {
                    margin-right: 0;
                    margin-left: 0;
                    font-size: 18px;
                }

        page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container {
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
            height: calc(100% - 46px);
            overflow-y: auto;
        }

            page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container .order-item .item {
                background-color: #f6f8fc;
                border-bottom: 2px solid #e0e0e0;
                cursor: pointer;
            }

                page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container .order-item .item .item-inner {
                    border-bottom: none;
                }

                page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container .order-item .item .info {
                    width: 100%;
                }

                    page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container .order-item .item .info h2 {
                        font-size: 14px;
                        text-overflow: ellipsis;
                        overflow: hidden;
                    }

                        page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container .order-item .item .info h2 small {
                            font-size: 60%;
                            margin-left: 0.5rem;
                            opacity: 0.8;
                        }

                    page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container .order-item .item .info p {
                        font-size: 12px;
                        text-overflow: ellipsis;
                        overflow: hidden;
                    }

                page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container .order-item .item .status {
                    position: absolute;
                    right: 0;
                    top: 0;
                    height: 100%;
                    width: 18px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container .order-item .item .status span {
                        -webkit-transform: rotate(-90deg);
                        transform: rotate(-90deg);
                        display: block;
                        color: white;
                        font-size: 8px;
                        font-weight: 700;
                        text-transform: uppercase;
                    }

                    page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container .order-item .item .status.cancelled {
                        background: -webkit-gradient(linear, left top, left bottom, from(#f44336), to(#e02626));
                        background: linear-gradient(to bottom, #f44336, #e02626);
                    }

                    page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container .order-item .item .status.returned {
                        background: -webkit-gradient(linear, left top, left bottom, from(#2196f3), to(#1e88e5));
                        background: linear-gradient(to bottom, #2196f3, #1e88e5);
                    }

                    page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container .order-item .item .status.pending {
                        background: -webkit-gradient(linear, left top, left bottom, from(#ffc107), to(#ffa000));
                        background: linear-gradient(to bottom, #ffc107, #ffa000);
                    }

            page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container .order-item.active {
                -webkit-box-shadow: 0 0 16px -8px rgba(0, 0, 0, 0.5);
                box-shadow: 0 0 16px -8px rgba(0, 0, 0, 0.5);
            }

                page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container .order-item.active .item {
                    background-color: white;
                    border-color: #00d45a;
                }

            page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul {
                padding: 0;
                list-style: none;
            }

                page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item {
                    background-color: rgba(255, 255, 255, 0.5);
                    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    cursor: pointer;
                    position: relative;
                }

                    page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .info {
                        -webkit-box-flex: 1;
                        -webkit-flex-grow: 1;
                        -ms-flex-positive: 1;
                        flex-grow: 1;
                        padding: 1.5rem 2rem;
                    }

                        page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .info h2 {
                            font-size: 16px;
                            font-weight: 700;
                            margin: 0 0 0.25rem;
                        }

                            page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .info h2 strong {
                                display: inline-block;
                                font-weight: 400;
                                width: 52px;
                            }

                        page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .info p {
                            font-style: italic;
                            font-weight: 400;
                            margin: 0;
                        }

                            page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .info p strong {
                                display: inline-block;
                                font-weight: 400;
                                width: 52px;
                            }

                    page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions {
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 auto;
                        -ms-flex: 0 0 auto;
                        flex: 0 0 auto;
                        padding: 0 1rem;
                    }

                        page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button {
                            -webkit-box-shadow: none;
                            box-shadow: none;
                            -webkit-box-orient: vertical;
                            -webkit-box-direction: normal;
                            -webkit-flex-direction: column;
                            -ms-flex-direction: column;
                            flex-direction: column;
                            height: 54px;
                            margin-right: 0.5rem;
                            padding: 0;
                            width: 68px;
                            opacity: 0;
                            -webkit-transition: all 0.3s ease;
                            transition: all 0.3s ease;
                            margin-right: 0.5rem;
                        }

                            page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button i {
                                font-size: 28px;
                            }

                            page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button span {
                                color: #525252;
                                font-size: 8px;
                                font-weight: 700;
                                text-transform: uppercase;
                            }

                            page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button.btn-primary {
                                background-color: rgba(0, 0, 0, 0.05) !important;
                            }

                                page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button.btn-primary i {
                                    color: #1e88e5;
                                }

                            page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button.btn-danger {
                                background-color: rgba(0, 0, 0, 0.05) !important;
                            }

                                page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button.btn-danger i {
                                    color: #e02626;
                                }

                            page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button:hover.btn-primary {
                                background-color: #1e88e5 !important;
                            }

                                page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button:hover.btn-primary i, page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button:hover.btn-primary span {
                                    color: white;
                                }

                            page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button:hover.btn-danger {
                                background-color: #e02626 !important;
                            }

                                page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button:hover.btn-danger i, page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button:hover.btn-danger span {
                                    color: white;
                                }

                            page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .actions button:last-child {
                                margin-right: 0;
                            }

                    page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .status {
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 18px;
                        -ms-flex: 0 0 18px;
                        flex: 0 0 18px;
                    }

                    page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .status-item {
                        position: absolute;
                        right: 0;
                        top: 0;
                        height: 100%;
                        width: 18px;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .status-item span {
                            -webkit-transform: rotate(-90deg);
                            transform: rotate(-90deg);
                            display: block;
                            color: white;
                            font-size: 8px;
                            font-weight: 700;
                            text-transform: uppercase;
                        }

                        page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .status-item.cancelled {
                            background: -webkit-gradient(linear, left top, left bottom, from(#f44336), to(#e02626));
                            background: linear-gradient(to bottom, #f44336, #e02626);
                        }

                        page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .status-item.returned {
                            background: -webkit-gradient(linear, left top, left bottom, from(#2196f3), to(#1e88e5));
                            background: linear-gradient(to bottom, #2196f3, #1e88e5);
                        }

                        page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li .sale-item .status-item.pending {
                            background: -webkit-gradient(linear, left top, left bottom, from(#ffc107), to(#ffa000));
                            background: linear-gradient(to bottom, #ffc107, #ffa000);
                        }

                page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li.active .sale-item {
                    background-color: white;
                    border-left: 6px solid #00d45a;
                }

                    page-cashier-history .page-wrapper .panel-cuentas .col-orders .orders-container ul li.active .sale-item .actions button {
                        visibility: visible;
                        opacity: 1;
                    }

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail {
        background-color: #eaf0f3;
    }

        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-header {
            background-color: #00be51;
        }

        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
        }

            page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-wrapper {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                height: 100%;
            }

            page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container {
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                height: 100%;
                margin: 0 auto;
                max-width: 640px;
                overflow: auto;
                padding: 0 2rem;
                width: 100%;
            }

@media screen and (max-width: 1080px) {
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container {
        padding: 0 1.5rem 0 0.5rem;
    }
}

page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order {
    border-top: 4px solid #08e465;
    border-radius: 4px 4px 0 0;
    padding: calc(2rem + 15px);
    background-color: white;
    position: relative;
    -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

@media screen and (max-width: 1080px) {
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order {
        padding: 0.5rem;
    }
}

page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info,
page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products,
page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments {
    padding-bottom: 2rem;
}

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info .cancelled,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products .cancelled,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments .cancelled {
        position: absolute;
        top: 0;
        right: 0;
    }

        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info .cancelled span,
        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products .cancelled span,
        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments .cancelled span {
            color: #e02626;
            text-transform: uppercase;
            font-weight: 700;
            font-size: 18px;
        }

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info .order-title .logo,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products .order-title .logo,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments .order-title .logo {
        width: 200px;
        height: 80px;
        margin-bottom: 3rem;
        background-size: contain;
        background-position: left top;
        background-repeat: no-repeat;
    }

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info .order-title h1,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products .order-title h1,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments .order-title h1 {
        font-size: 32px;
        font-weight: 700;
        color: #525252;
    }

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info .order-title h4,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products .order-title h4,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments .order-title h4 {
        font-size: 20px;
        font-weight: 700;
        color: #333;
        padding: 0 0 1.5rem;
    }

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info ul,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products ul,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments ul {
        border-bottom: 1px dashed #e0e0e0;
        padding-bottom: 2rem;
    }

        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info ul li label,
        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products ul li label,
        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments ul li label {
            width: 100px;
            color: #757575;
            font-weight: 700;
        }

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info table th,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info table td,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products table th,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products table td,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments table th,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments table td {
        vertical-align: middle;
    }

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info table td,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products table td,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments table td {
        font-weight: 700;
    }

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info table th,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products table th,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments table th {
        font-weight: 500;
    }

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info table tfoot th,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products table tfoot th,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments table tfoot th {
        font-weight: 700;
    }

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info table tfoot td,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products table tfoot td,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments table tfoot td {
        color: #00d45a;
        font-size: 30px;
        font-weight: 700;
        letter-spacing: -1px;
    }

        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info table tfoot td small,
        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products table tfoot td small,
        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments table tfoot td small {
            color: #333;
            font-size: 50%;
        }

@media (min-width: 1200px) {
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-info,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-products,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments {
        padding-right: 1rem;
    }
}

page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments,
page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-returns {
    padding-top: 2rem;
    border-top: 1px dashed #e0e0e0;
}

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments ul:last-child,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-returns ul:last-child {
        border-bottom: none;
    }

@media (min-width: 1200px) {
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-payments,
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .order-container .order .order-returns {
        padding-top: 0;
        padding-left: 3rem;
        border-left: 1px dashed #e0e0e0;
        border-top: none;
    }
}

page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .statistics {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 350px;
    -ms-flex: 0 0 350px;
    flex: 0 0 350px;
    height: 100%;
    padding-right: 2rem;
    overflow-y: auto;
}

@media screen and (max-width: 1080px) {
    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .statistics {
        padding-right: 0;
    }
}

page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .statistics .top-container {
    background-color: white;
    border-radius: 1rem;
    -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    margin-bottom: 1.5rem;
    min-height: 210px;
    padding: 1rem;
}

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .statistics .top-container .col-header {
        background-color: transparent;
    }

        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .statistics .top-container .col-header .title {
            color: #212121;
            font-weight: 700;
        }

    page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .statistics .top-container .reportes-container .reporte-item {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        position: relative;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        border-bottom: 6px solid #eaf0f3;
        padding: 0 0 0.5rem;
        margin-bottom: 1rem;
        font-size: 16px;
    }

        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .statistics .top-container .reportes-container .reporte-item .desc::first-letter {
            text-transform: uppercase;
        }

        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .statistics .top-container .reportes-container .reporte-item .total {
            font-weight: 600;
        }

        page-cashier-history .page-wrapper .panel-cuentas .col-order-detail .col-body .statistics .top-container .reportes-container .reporte-item .bar {
            width: 2px;
            height: 6px;
            border-top-right-radius: 500px;
            border-bottom-right-radius: 500px;
            background-color: #00d45a;
            background-color: #2196f3;
            position: absolute;
            bottom: -6px;
            left: 0;
            -webkit-transition: width 0.6s ease-in-out;
            transition: width 0.6s ease-in-out;
        }

page-cashier-report .module-title-container {
    background: -webkit-gradient(linear, left top, right top, from(#333), to(#525252));
    background: linear-gradient(to right, #333, #525252);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 46px;
    -ms-flex: 0 0 46px;
    flex: 0 0 46px;
    height: 46px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: normal;
}

    page-cashier-report .module-title-container .title {
        font-size: 18px;
        font-weight: 800;
        color: #FFF;
        margin: 0;
        padding: 1rem;
        white-space: nowrap;
        display: -webkit-inline-box;
        display: -webkit-inline-flex;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        text-transform: uppercase;
    }

        page-cashier-report .module-title-container .title i + span,
        page-cashier-report .module-title-container .title span + i {
            margin-left: 0.5rem;
        }

    page-cashier-report .module-title-container .toolbar {
        width: auto;
        display: -webkit-inline-box;
        display: -webkit-inline-flex;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        padding: 0 0.5rem;
        position: absolute;
    }

        page-cashier-report .module-title-container .toolbar > span {
            color: #ffa000;
        }

        page-cashier-report .module-title-container .toolbar .form-control {
            width: auto;
            display: -webkit-inline-box;
            display: -webkit-inline-flex;
            display: -ms-inline-flexbox;
            display: inline-flex;
            background-color: transparent;
            border: none;
            font-size: 15px;
            color: #FFF;
            -webkit-box-shadow: none;
            box-shadow: none;
            text-align: right;
            cursor: pointer;
        }

            page-cashier-report .module-title-container .toolbar .form-control .item-inner {
                padding-right: 0;
            }

                page-cashier-report .module-title-container .toolbar .form-control .item-inner .label {
                    margin-right: 0;
                }

        page-cashier-report .module-title-container .toolbar .folio-container {
            padding-left: 1rem;
        }

            page-cashier-report .module-title-container .toolbar .folio-container .mat-input-wrapper {
                margin: 0;
                padding-bottom: 0;
            }

                page-cashier-report .module-title-container .toolbar .folio-container .mat-input-wrapper .mat-form-field-flex {
                    border: none;
                    width: 100px;
                    height: 36px;
                }

                    page-cashier-report .module-title-container .toolbar .folio-container .mat-input-wrapper .mat-form-field-flex .mat-form-field-infix {
                        top: 0;
                        margin: 0;
                        padding: 2px 0 0;
                    }

                        page-cashier-report .module-title-container .toolbar .folio-container .mat-input-wrapper .mat-form-field-flex .mat-form-field-infix .mat-select .mat-select-value {
                            color: white;
                        }

                        page-cashier-report .module-title-container .toolbar .folio-container .mat-input-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
                            color: #00d45a;
                        }

                page-cashier-report .module-title-container .toolbar .folio-container .mat-input-wrapper .mat-form-field-underline {
                    display: none;
                }

        page-cashier-report .module-title-container .toolbar .datepicker-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
        }

            page-cashier-report .module-title-container .toolbar .datepicker-container .form-control {
                max-width: 100px;
                padding-right: 0;
            }

            page-cashier-report .module-title-container .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button {
                color: white;
                line-height: 0;
            }

        page-cashier-report .module-title-container .toolbar .option-item {
            color: white;
            padding: 0 1rem;
        }

            page-cashier-report .module-title-container .toolbar .option-item span {
                font-size: 15px;
                margin-right: 1rem;
            }

        page-cashier-report .module-title-container .toolbar.left {
            left: 0;
        }

        page-cashier-report .module-title-container .toolbar.right {
            right: 0;
        }

page-cashier-report .page-wrapper {
    width: 100%;
    height: calc(100% - 46px) !important;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}

    page-cashier-report .page-wrapper .col-sales,
    page-cashier-report .page-wrapper .col-sale-detail,
    page-cashier-report .page-wrapper .col-denom-breakdown,
    page-cashier-report .page-wrapper .col-daily-breakdown {
        padding: 0;
        height: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

        page-cashier-report .page-wrapper .col-sales .col-header,
        page-cashier-report .page-wrapper .col-sale-detail .col-header,
        page-cashier-report .page-wrapper .col-denom-breakdown .col-header,
        page-cashier-report .page-wrapper .col-daily-breakdown .col-header {
            background-color: #00d45a;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 46px;
            -ms-flex: 0 0 46px;
            flex: 0 0 46px;
            height: 46px;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
            line-height: normal;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
        }

            page-cashier-report .page-wrapper .col-sales .col-header .title,
            page-cashier-report .page-wrapper .col-sale-detail .col-header .title,
            page-cashier-report .page-wrapper .col-denom-breakdown .col-header .title,
            page-cashier-report .page-wrapper .col-daily-breakdown .col-header .title {
                font-size: 18px;
                color: #FFF;
                margin: 0;
                padding: 1rem;
                padding-right: 0.3rem;
                white-space: nowrap;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

                page-cashier-report .page-wrapper .col-sales .col-header .title i + span,
                page-cashier-report .page-wrapper .col-sales .col-header .title span + i,
                page-cashier-report .page-wrapper .col-sale-detail .col-header .title i + span,
                page-cashier-report .page-wrapper .col-sale-detail .col-header .title span + i,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-header .title i + span,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-header .title span + i,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-header .title i + span,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-header .title span + i {
                    margin-left: 0.5rem;
                }

            page-cashier-report .page-wrapper .col-sales .col-header .toolbar,
            page-cashier-report .page-wrapper .col-sale-detail .col-header .toolbar,
            page-cashier-report .page-wrapper .col-denom-breakdown .col-header .toolbar,
            page-cashier-report .page-wrapper .col-daily-breakdown .col-header .toolbar {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: end;
                -webkit-justify-content: flex-end;
                -ms-flex-pack: end;
                justify-content: flex-end;
                padding: 0 0.5rem;
                position: relative;
            }

                page-cashier-report .page-wrapper .col-sales .col-header .toolbar i,
                page-cashier-report .page-wrapper .col-sale-detail .col-header .toolbar i,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-header .toolbar i,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-header .toolbar i {
                    color: #FFF;
                }

                page-cashier-report .page-wrapper .col-sales .col-header .toolbar .btn,
                page-cashier-report .page-wrapper .col-sale-detail .col-header .toolbar .btn,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-header .toolbar .btn,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-header .toolbar .btn {
                    height: 36px;
                    padding: 0 0.5rem;
                    background-color: transparent !important;
                    border-color: transparent !important;
                    font-size: 15px;
                    -webkit-transition: background-color 0.3s ease;
                    transition: background-color 0.3s ease;
                }

                    page-cashier-report .page-wrapper .col-sales .col-header .toolbar .btn:hover,
                    page-cashier-report .page-wrapper .col-sale-detail .col-header .toolbar .btn:hover,
                    page-cashier-report .page-wrapper .col-denom-breakdown .col-header .toolbar .btn:hover,
                    page-cashier-report .page-wrapper .col-daily-breakdown .col-header .toolbar .btn:hover {
                        background-color: rgba(0, 0, 0, 0.05) !important;
                    }

                    page-cashier-report .page-wrapper .col-sales .col-header .toolbar .btn i,
                    page-cashier-report .page-wrapper .col-sale-detail .col-header .toolbar .btn i,
                    page-cashier-report .page-wrapper .col-denom-breakdown .col-header .toolbar .btn i,
                    page-cashier-report .page-wrapper .col-daily-breakdown .col-header .toolbar .btn i {
                        font-size: 16px;
                    }

                    page-cashier-report .page-wrapper .col-sales .col-header .toolbar .btn span,
                    page-cashier-report .page-wrapper .col-sale-detail .col-header .toolbar .btn span,
                    page-cashier-report .page-wrapper .col-denom-breakdown .col-header .toolbar .btn span,
                    page-cashier-report .page-wrapper .col-daily-breakdown .col-header .toolbar .btn span {
                        margin: 0 0.5rem;
                    }

                page-cashier-report .page-wrapper .col-sales .col-header .toolbar h4,
                page-cashier-report .page-wrapper .col-sale-detail .col-header .toolbar h4,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-header .toolbar h4,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-header .toolbar h4 {
                    color: #FFF;
                    margin: 0;
                    font-size: 18px;
                }

                page-cashier-report .page-wrapper .col-sales .col-header .toolbar .form-control,
                page-cashier-report .page-wrapper .col-sale-detail .col-header .toolbar .form-control,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-header .toolbar .form-control,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-header .toolbar .form-control {
                    width: auto;
                    display: -webkit-inline-box;
                    display: -webkit-inline-flex;
                    display: -ms-inline-flexbox;
                    display: inline-flex;
                    background-color: transparent;
                    border: none;
                    font-size: 15px;
                    color: #FFF;
                    -webkit-box-shadow: none;
                    box-shadow: none;
                    text-align: right;
                    cursor: pointer;
                }

                    page-cashier-report .page-wrapper .col-sales .col-header .toolbar .form-control .item-inner,
                    page-cashier-report .page-wrapper .col-sale-detail .col-header .toolbar .form-control .item-inner,
                    page-cashier-report .page-wrapper .col-denom-breakdown .col-header .toolbar .form-control .item-inner,
                    page-cashier-report .page-wrapper .col-daily-breakdown .col-header .toolbar .form-control .item-inner {
                        padding-right: 0;
                    }

                        page-cashier-report .page-wrapper .col-sales .col-header .toolbar .form-control .item-inner .label,
                        page-cashier-report .page-wrapper .col-sale-detail .col-header .toolbar .form-control .item-inner .label,
                        page-cashier-report .page-wrapper .col-denom-breakdown .col-header .toolbar .form-control .item-inner .label,
                        page-cashier-report .page-wrapper .col-daily-breakdown .col-header .toolbar .form-control .item-inner .label {
                            margin-right: 0;
                        }

                page-cashier-report .page-wrapper .col-sales .col-header .toolbar .datepicker-container,
                page-cashier-report .page-wrapper .col-sale-detail .col-header .toolbar .datepicker-container,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-header .toolbar .datepicker-container,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-header .toolbar .datepicker-container {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    width: 100%;
                }

                    page-cashier-report .page-wrapper .col-sales .col-header .toolbar .datepicker-container .form-control,
                    page-cashier-report .page-wrapper .col-sale-detail .col-header .toolbar .datepicker-container .form-control,
                    page-cashier-report .page-wrapper .col-denom-breakdown .col-header .toolbar .datepicker-container .form-control,
                    page-cashier-report .page-wrapper .col-daily-breakdown .col-header .toolbar .datepicker-container .form-control {
                        width: calc(100% - 40px);
                        padding-right: 0;
                    }

                    page-cashier-report .page-wrapper .col-sales .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button,
                    page-cashier-report .page-wrapper .col-sale-detail .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button,
                    page-cashier-report .page-wrapper .col-denom-breakdown .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button,
                    page-cashier-report .page-wrapper .col-daily-breakdown .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button {
                        color: white;
                        line-height: 46px;
                    }

        page-cashier-report .page-wrapper .col-sales .col-body,
        page-cashier-report .page-wrapper .col-sale-detail .col-body,
        page-cashier-report .page-wrapper .col-denom-breakdown .col-body,
        page-cashier-report .page-wrapper .col-daily-breakdown .col-body {
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
            padding: 1rem;
            height: calc(100% - 46px);
            overflow-y: auto;
        }

        page-cashier-report .page-wrapper .col-sales .col-footer .options-container,
        page-cashier-report .page-wrapper .col-sale-detail .col-footer .options-container,
        page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .options-container,
        page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .options-container {
            background-color: #333;
        }

            page-cashier-report .page-wrapper .col-sales .col-footer .options-container .option-item,
            page-cashier-report .page-wrapper .col-sale-detail .col-footer .options-container .option-item,
            page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .options-container .option-item,
            page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .options-container .option-item {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                font-size: 16px;
                color: #FFF;
                padding: 0.7rem 1rem;
                height: 46px;
            }

                page-cashier-report .page-wrapper .col-sales .col-footer .options-container .option-item .label,
                page-cashier-report .page-wrapper .col-sale-detail .col-footer .options-container .option-item .label,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .options-container .option-item .label,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .options-container .option-item .label {
                    margin-bottom: 0;
                    white-space: nowrap;
                }

                page-cashier-report .page-wrapper .col-sales .col-footer .options-container .option-item .control,
                page-cashier-report .page-wrapper .col-sale-detail .col-footer .options-container .option-item .control,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .options-container .option-item .control,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .options-container .option-item .control {
                    margin-bottom: 0;
                    max-width: 160px;
                    padding: 2px 6px 1px;
                    border-radius: 0;
                    position: relative;
                }

                    page-cashier-report .page-wrapper .col-sales .col-footer .options-container .option-item .control.input,
                    page-cashier-report .page-wrapper .col-sale-detail .col-footer .options-container .option-item .control.input,
                    page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .options-container .option-item .control.input,
                    page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .options-container .option-item .control.input {
                        background-color: #333;
                        border-color: #333;
                    }

                        page-cashier-report .page-wrapper .col-sales .col-footer .options-container .option-item .control.input .text-input,
                        page-cashier-report .page-wrapper .col-sale-detail .col-footer .options-container .option-item .control.input .text-input,
                        page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .options-container .option-item .control.input .text-input,
                        page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .options-container .option-item .control.input .text-input {
                            width: 100%;
                            margin: 4px 0 3px;
                            text-align: right;
                            color: #FFF;
                        }

                page-cashier-report .page-wrapper .col-sales .col-footer .options-container .option-item select.control,
                page-cashier-report .page-wrapper .col-sale-detail .col-footer .options-container .option-item select.control,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .options-container .option-item select.control,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .options-container .option-item select.control {
                    border-radius: 0.25rem;
                    color: #212121;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    cursor: pointer;
                    flex-grow: 1;
                    max-width: 60%;
                }

            page-cashier-report .page-wrapper .col-sales .col-footer .options-container .totals,
            page-cashier-report .page-wrapper .col-sale-detail .col-footer .options-container .totals,
            page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .options-container .totals,
            page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .options-container .totals {
                background-color: #FFF;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-flow: column;
                -ms-flex-flow: column;
                flex-flow: column;
            }

                page-cashier-report .page-wrapper .col-sales .col-footer .options-container .totals .option-item,
                page-cashier-report .page-wrapper .col-sale-detail .col-footer .options-container .totals .option-item,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .options-container .totals .option-item,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .options-container .totals .option-item {
                    color: #212121;
                    max-height: none;
                    height: 46px;
                    position: relative;
                    border-bottom: 1px solid #eaf0f3;
                }

                    page-cashier-report .page-wrapper .col-sales .col-footer .options-container .totals .option-item .label,
                    page-cashier-report .page-wrapper .col-sale-detail .col-footer .options-container .totals .option-item .label,
                    page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .options-container .totals .option-item .label,
                    page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .options-container .totals .option-item .label {
                        margin-bottom: 0;
                        color: #525252;
                        font-weight: 600;
                    }

                    page-cashier-report .page-wrapper .col-sales .col-footer .options-container .totals .option-item h4,
                    page-cashier-report .page-wrapper .col-sale-detail .col-footer .options-container .totals .option-item h4,
                    page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .options-container .totals .option-item h4,
                    page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .options-container .totals .option-item h4 {
                        margin: 0;
                        font-weight: 700;
                    }

                        page-cashier-report .page-wrapper .col-sales .col-footer .options-container .totals .option-item h4 small,
                        page-cashier-report .page-wrapper .col-sale-detail .col-footer .options-container .totals .option-item h4 small,
                        page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .options-container .totals .option-item h4 small,
                        page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .options-container .totals .option-item h4 small {
                            font-size: 50%;
                        }

        page-cashier-report .page-wrapper .col-sales .col-footer .action-container,
        page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container,
        page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container,
        page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
        }

            page-cashier-report .page-wrapper .col-sales .col-footer .action-container .btn,
            page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .btn,
            page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .btn,
            page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .btn {
                padding: 0.5rem 1rem;
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                border-radius: 0;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                font-size: 20px;
                height: 46px;
            }

                page-cashier-report .page-wrapper .col-sales .col-footer .action-container .btn:not(.btn-icon),
                page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .btn:not(.btn-icon),
                page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .btn:not(.btn-icon),
                page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .btn:not(.btn-icon) {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    border-radius: 0;
                    height: 46px;
                }

                    page-cashier-report .page-wrapper .col-sales .col-footer .action-container .btn:not(.btn-icon) i,
                    page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .btn:not(.btn-icon) i,
                    page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .btn:not(.btn-icon) i,
                    page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .btn:not(.btn-icon) i {
                        position: absolute;
                        right: 1rem;
                        margin: 0;
                    }

                page-cashier-report .page-wrapper .col-sales .col-footer .action-container .btn.btn-icon,
                page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .btn.btn-icon,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .btn.btn-icon,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .btn.btn-icon {
                    width: 46px;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                }

            page-cashier-report .page-wrapper .col-sales .col-footer .action-container .discount-container,
            page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .discount-container,
            page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .discount-container,
            page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .discount-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: horizontal;
                -webkit-box-direction: normal;
                -webkit-flex-flow: row;
                -ms-flex-flow: row;
                flex-flow: row;
                background-color: #1e88e5;
                -webkit-box-shadow: none;
                box-shadow: none;
                cursor: pointer;
                color: #FFF;
                border-radius: 0;
                -webkit-transition: all 0.5s ease;
                transition: all 0.5s ease;
                width: 100%;
                height: 46px;
                margin-bottom: 0;
            }

                page-cashier-report .page-wrapper .col-sales .col-footer .action-container .discount-container .info,
                page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .discount-container .info,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .discount-container .info,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .discount-container .info {
                    width: 100%;
                    max-width: calc(100% - 40px);
                    padding: 1rem 0.5rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-cashier-report .page-wrapper .col-sales .col-footer .action-container .discount-container .info .label,
                    page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .discount-container .info .label,
                    page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .discount-container .info .label,
                    page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .discount-container .info .label {
                        width: calc(100% - 0.5rem);
                        padding-left: 0.5rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-cashier-report .page-wrapper .col-sales .col-footer .action-container .discount-container .info .label h4,
                        page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .discount-container .info .label h4,
                        page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .discount-container .info .label h4,
                        page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .discount-container .info .label h4 {
                            white-space: nowrap;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            font-size: 16px;
                            font-weight: 500;
                            margin: 0;
                        }

                        page-cashier-report .page-wrapper .col-sales .col-footer .action-container .discount-container .info .label h3,
                        page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .discount-container .info .label h3,
                        page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .discount-container .info .label h3,
                        page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .discount-container .info .label h3 {
                            font-size: 26px;
                            margin: 0;
                        }

                            page-cashier-report .page-wrapper .col-sales .col-footer .action-container .discount-container .info .label h3 small,
                            page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .discount-container .info .label h3 small,
                            page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .discount-container .info .label h3 small,
                            page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .discount-container .info .label h3 small {
                                font-size: 50%;
                                margin: 0 0.25rem;
                            }

                page-cashier-report .page-wrapper .col-sales .col-footer .action-container .discount-container .action,
                page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .discount-container .action,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .discount-container .action,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .discount-container .action {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    padding: 1rem 0.5rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: column;
                    -ms-flex-flow: column;
                    flex-flow: column;
                    -webkit-justify-content: space-around;
                    -ms-flex-pack: distribute;
                    justify-content: space-around;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-cashier-report .page-wrapper .col-sales .col-footer .action-container .discount-container .action .btn,
                    page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .discount-container .action .btn,
                    page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .discount-container .action .btn,
                    page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .discount-container .action .btn {
                        color: #FFF;
                        width: 32px;
                        height: 32px;
                        font-size: 26px;
                        padding: 0;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                page-cashier-report .page-wrapper .col-sales .col-footer .action-container .discount-container.selected,
                page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .discount-container.selected,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .discount-container.selected,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .discount-container.selected {
                    background-color: #00d45a;
                    color: #fff;
                }

                page-cashier-report .page-wrapper .col-sales .col-footer .action-container .discount-container:hover,
                page-cashier-report .page-wrapper .col-sale-detail .col-footer .action-container .discount-container:hover,
                page-cashier-report .page-wrapper .col-denom-breakdown .col-footer .action-container .discount-container:hover,
                page-cashier-report .page-wrapper .col-daily-breakdown .col-footer .action-container .discount-container:hover {
                    -webkit-transform: none;
                    transform: none;
                }

        page-cashier-report .page-wrapper .col-sales.col-sales,
        page-cashier-report .page-wrapper .col-sale-detail.col-sales,
        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales,
        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 25%;
            -ms-flex: 0 0 25%;
            flex: 0 0 25%;
            max-width: 320px;
        }

            page-cashier-report .page-wrapper .col-sales.col-sales .col-body,
            page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                -ms-flex-direction: column;
                flex-direction: column;
                padding: 0;
                background-color: white;
            }

                page-cashier-report .page-wrapper .col-sales.col-sales .col-body .folio-container,
                page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .folio-container,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .folio-container,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .folio-container {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    padding: 0 1rem 1rem;
                    border-bottom: 1px solid #e0e0e0;
                }

                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .folio-container .mat-input-underline,
                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .folio-container .mat-input-underline,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .folio-container .mat-input-underline,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .folio-container .mat-input-underline {
                        display: none;
                    }

                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .folio-container .mat-input-wrapper,
                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .folio-container .mat-input-wrapper,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .folio-container .mat-input-wrapper,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .folio-container .mat-input-wrapper {
                        width: 100%;
                        padding-bottom: 0;
                    }

                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .folio-container .mat-input-infix,
                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .folio-container .mat-input-infix,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .folio-container .mat-input-infix,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .folio-container .mat-input-infix {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .folio-container span.pr-3,
                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .folio-container span.pr-3,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .folio-container span.pr-3,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .folio-container span.pr-3 {
                        white-space: nowrap;
                    }

                page-cashier-report .page-wrapper .col-sales.col-sales .col-body .filter-container,
                page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .filter-container,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .filter-container,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .filter-container {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    z-index: 9;
                    position: relative;
                    border-bottom: 1px solid #eaf0f3;
                }

                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .filter-container .search-icon,
                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .filter-container .search-icon,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .filter-container .search-icon,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .filter-container .search-icon {
                        position: absolute;
                        top: 0;
                        left: 0;
                        z-index: 1;
                        width: 46px;
                        height: 46px;
                        display: -webkit-inline-box;
                        display: -webkit-inline-flex;
                        display: -ms-inline-flexbox;
                        display: inline-flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        font-size: 16px;
                        opacity: 0.6;
                    }

                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .filter-container .form-control,
                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .filter-container .form-control,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .filter-container .form-control,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .filter-container .form-control {
                        height: 46px;
                        border: transparent;
                        border-radius: 0;
                        padding-left: 46px;
                        font-size: 16px;
                    }

                        page-cashier-report .page-wrapper .col-sales.col-sales .col-body .filter-container .form-control::-webkit-input-placeholder,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .filter-container .form-control::-webkit-input-placeholder,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .filter-container .form-control::-webkit-input-placeholder,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .filter-container .form-control::-webkit-input-placeholder {
                            font-style: italic;
                        }

                        page-cashier-report .page-wrapper .col-sales.col-sales .col-body .filter-container .form-control::-moz-placeholder,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .filter-container .form-control::-moz-placeholder,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .filter-container .form-control::-moz-placeholder,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .filter-container .form-control::-moz-placeholder {
                            font-style: italic;
                        }

                        page-cashier-report .page-wrapper .col-sales.col-sales .col-body .filter-container .form-control::-ms-input-placeholder,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .filter-container .form-control::-ms-input-placeholder,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .filter-container .form-control::-ms-input-placeholder,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .filter-container .form-control::-ms-input-placeholder {
                            font-style: italic;
                        }

                        page-cashier-report .page-wrapper .col-sales.col-sales .col-body .filter-container .form-control::placeholder,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .filter-container .form-control::placeholder,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .filter-container .form-control::placeholder,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .filter-container .form-control::placeholder {
                            font-style: italic;
                        }

                        page-cashier-report .page-wrapper .col-sales.col-sales .col-body .filter-container .form-control:focus,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .filter-container .form-control:focus,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .filter-container .form-control:focus,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .filter-container .form-control:focus {
                            outline: none;
                            -webkit-box-shadow: none;
                            box-shadow: none;
                        }

                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .filter-container .btn,
                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .filter-container .btn,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .filter-container .btn,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .filter-container .btn {
                        height: 52px;
                        border-radius: 0;
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 52px;
                        -ms-flex: 0 0 52px;
                        flex: 0 0 52px;
                        padding: 0;
                    }

                        page-cashier-report .page-wrapper .col-sales.col-sales .col-body .filter-container .btn i,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .filter-container .btn i,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .filter-container .btn i,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .filter-container .btn i {
                            margin-right: 0;
                            margin-left: 0;
                            font-size: 18px;
                        }

                page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container,
                page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container {
                    background-color: #f6f8fc;
                    height: 100%;
                }

                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul,
                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul {
                        padding: 0;
                        list-style: none;
                    }

                        page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item {
                            background-color: rgba(255, 255, 255, 0.5);
                            border-bottom: 1px solid rgba(0, 0, 0, 0.05);
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-align: center;
                            -webkit-align-items: center;
                            -ms-flex-align: center;
                            align-items: center;
                            cursor: pointer;
                            position: relative;
                        }

                            page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .info,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .info,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .info,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .info {
                                -webkit-box-flex: 1;
                                -webkit-flex-grow: 1;
                                -ms-flex-positive: 1;
                                flex-grow: 1;
                                padding: 1.5rem 2rem;
                            }

                                page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .info h2,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .info h2,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .info h2,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .info h2 {
                                    font-size: 16px;
                                    font-weight: 700;
                                    margin: 0 0 0.25rem;
                                }

                                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .info h2 strong,
                                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .info h2 strong,
                                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .info h2 strong,
                                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .info h2 strong {
                                        display: inline-block;
                                        font-weight: 400;
                                        width: 60px;
                                    }

                                page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .info p,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .info p,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .info p,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .info p {
                                    font-style: italic;
                                    font-weight: 400;
                                    margin: 0;
                                }

                                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .info p strong,
                                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .info p strong,
                                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .info p strong,
                                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .info p strong {
                                        display: inline-block;
                                        font-weight: 400;
                                        width: 60px;
                                    }

                            page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions {
                                -webkit-box-flex: 0;
                                -webkit-flex: 0 0 auto;
                                -ms-flex: 0 0 auto;
                                flex: 0 0 auto;
                                padding: 0 1rem;
                            }

                                page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button {
                                    -webkit-box-shadow: none;
                                    box-shadow: none;
                                    -webkit-box-orient: vertical;
                                    -webkit-box-direction: normal;
                                    -webkit-flex-direction: column;
                                    -ms-flex-direction: column;
                                    flex-direction: column;
                                    height: 42px;
                                    margin-right: 0.5rem;
                                    padding: 0;
                                    width: 42px;
                                    opacity: 0;
                                    -webkit-transition: all 0.3s ease;
                                    transition: all 0.3s ease;
                                    margin-right: 0.5rem;
                                }

                                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button i,
                                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button i,
                                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button i,
                                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button i {
                                        font-size: 24px;
                                    }

                                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button span,
                                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button span,
                                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button span,
                                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button span {
                                        color: #525252;
                                        font-size: 8px;
                                        font-weight: 700;
                                        text-transform: uppercase;
                                        display: none;
                                    }

                                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-primary,
                                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-primary,
                                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-primary,
                                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-primary {
                                        background-color: rgba(0, 0, 0, 0.05) !important;
                                    }

                                        page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-primary i,
                                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-primary i,
                                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-primary i,
                                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-primary i {
                                            color: #1e88e5;
                                        }

                                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-danger,
                                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-danger,
                                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-danger,
                                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-danger {
                                        background-color: rgba(0, 0, 0, 0.05) !important;
                                    }

                                        page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-danger i,
                                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-danger i,
                                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-danger i,
                                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button.btn-danger i {
                                            color: #e02626;
                                        }

                                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-primary,
                                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-primary,
                                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-primary,
                                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-primary {
                                        background-color: #1e88e5 !important;
                                    }

                                        page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-primary i, page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-primary span,
                                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-primary i,
                                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-primary span,
                                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-primary i,
                                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-primary span,
                                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-primary i,
                                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-primary span {
                                            color: white;
                                        }

                                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-danger,
                                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-danger,
                                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-danger,
                                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-danger {
                                        background-color: #e02626 !important;
                                    }

                                        page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-danger i, page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-danger span,
                                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-danger i,
                                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-danger span,
                                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-danger i,
                                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-danger span,
                                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-danger i,
                                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:hover.btn-danger span {
                                            color: white;
                                        }

                                    page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .actions button:last-child,
                                    page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .actions button:last-child,
                                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:last-child,
                                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .actions button:last-child {
                                        margin-right: 0;
                                    }

                            page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .status,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .status,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .status,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .status {
                                -webkit-box-flex: 0;
                                -webkit-flex: 0 0 18px;
                                -ms-flex: 0 0 18px;
                                flex: 0 0 18px;
                            }

                            page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .status-item,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .status-item,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .status-item,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .status-item {
                                position: absolute;
                                right: 0;
                                top: 0;
                                height: 100%;
                                width: 18px;
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-pack: center;
                                -webkit-justify-content: center;
                                -ms-flex-pack: center;
                                justify-content: center;
                                -webkit-box-align: center;
                                -webkit-align-items: center;
                                -ms-flex-align: center;
                                align-items: center;
                            }

                                page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .status-item span,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .status-item span,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .status-item span,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .status-item span {
                                    -webkit-transform: rotate(-90deg);
                                    transform: rotate(-90deg);
                                    display: block;
                                    color: white;
                                    font-size: 8px;
                                    font-weight: 700;
                                    text-transform: uppercase;
                                }

                                page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .status-item.cancelled,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .status-item.cancelled,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .status-item.cancelled,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .status-item.cancelled {
                                    background: -webkit-gradient(linear, left top, left bottom, from(#f44336), to(#e02626));
                                    background: linear-gradient(to bottom, #f44336, #e02626);
                                }

                                page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .status-item.returned,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .status-item.returned,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .status-item.returned,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .status-item.returned {
                                    background: -webkit-gradient(linear, left top, left bottom, from(#2196f3), to(#1e88e5));
                                    background: linear-gradient(to bottom, #2196f3, #1e88e5);
                                }

                                page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li .sale-item .status-item.pending,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li .sale-item .status-item.pending,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li .sale-item .status-item.pending,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li .sale-item .status-item.pending {
                                    background: -webkit-gradient(linear, left top, left bottom, from(#ffc107), to(#ffa000));
                                    background: linear-gradient(to bottom, #ffc107, #ffa000);
                                }

                        page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li.active .sale-item,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li.active .sale-item,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li.active .sale-item,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li.active .sale-item {
                            background-color: white;
                            border-left: 6px solid #00d45a;
                        }

                            page-cashier-report .page-wrapper .col-sales.col-sales .col-body .sales-container ul li.active .sale-item .actions button,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .sales-container ul li.active .sale-item .actions button,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .sales-container ul li.active .sale-item .actions button,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .sales-container ul li.active .sale-item .actions button {
                                visibility: visible;
                                opacity: 1;
                            }

                page-cashier-report .page-wrapper .col-sales.col-sales .col-body .action-container,
                page-cashier-report .page-wrapper .col-sale-detail.col-sales .col-body .action-container,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-sales .col-body .action-container,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-sales .col-body .action-container {
                    margin-top: auto;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                }

        page-cashier-report .page-wrapper .col-sales.col-sale-detail,
        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail,
        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail,
        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail {
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
        }

            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-header,
            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-header,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-header,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-header {
                background-color: #525252;
            }

                page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-header .toolbar .btn small,
                page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-header .toolbar .btn small,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-header .toolbar .btn small,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-header .toolbar .btn small {
                    color: white;
                    padding: 0 1rem;
                }

                    page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-header .toolbar .btn small strong,
                    page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-header .toolbar .btn small strong,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-header .toolbar .btn small strong,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-header .toolbar .btn small strong {
                        color: white;
                    }

            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body,
            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body {
                background-color: #eaf0f3;
                position: relative;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                -ms-flex-direction: column;
                flex-direction: column;
                height: 100%;
            }

                page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .no-operation h4,
                page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .no-operation h4,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .no-operation h4,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .no-operation h4 {
                    font-size: 20px;
                    font-weight: 700;
                    text-align: center;
                    padding: 2rem;
                    color: #525252;
                }

                page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container,
                page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container {
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    height: 100%;
                    margin: 0 auto;
                    max-width: 640px;
                    overflow: auto;
                    padding: 0 2rem;
                    width: 100%;
                }

                    page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation,
                    page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation {
                        border-top: 4px solid #08e465;
                        max-width: 420px;
                        margin: 1rem auto;
                        border-top: 4px solid #08e465;
                        border-radius: 4px 4px 0 0;
                        padding: calc(2rem + 15px);
                        background-color: white;
                        position: relative;
                        -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
                        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
                    }

                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .cancelled,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .cancelled,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .cancelled,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .cancelled,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .cancelled,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .cancelled,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .cancelled,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .cancelled,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .cancelled,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .cancelled,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .cancelled,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .cancelled {
                            position: absolute;
                            top: 0;
                            right: 0;
                        }

                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .cancelled span,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .cancelled span,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .cancelled span,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .cancelled span,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .cancelled span,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .cancelled span,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .cancelled span,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .cancelled span,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .cancelled span,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .cancelled span,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .cancelled span,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .cancelled span {
                                color: #e02626;
                                text-transform: uppercase;
                                font-weight: 700;
                                font-size: 18px;
                            }

                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .operation-title .logo,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .operation-title .logo,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .operation-title .logo,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .operation-title .logo,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .operation-title .logo,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .operation-title .logo,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .operation-title .logo,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .operation-title .logo,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .operation-title .logo,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .operation-title .logo,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .operation-title .logo,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .operation-title .logo {
                            width: 200px;
                            height: 80px;
                            margin-bottom: 3rem;
                            background-size: contain;
                            background-position: left top;
                            background-repeat: no-repeat;
                        }

                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .operation-title h1,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .operation-title h1,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .operation-title h1,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .operation-title h1,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .operation-title h1,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .operation-title h1,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .operation-title h1,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .operation-title h1,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .operation-title h1,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .operation-title h1,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .operation-title h1,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .operation-title h1 {
                            font-size: 32px;
                            font-weight: 700;
                            color: #525252;
                        }

                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .operation-title h4,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .operation-title h4,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .operation-title h4,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .operation-title h4,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .operation-title h4,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .operation-title h4,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .operation-title h4,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .operation-title h4,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .operation-title h4,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .operation-title h4,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .operation-title h4,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .operation-title h4 {
                            font-size: 20px;
                            font-weight: 700;
                            color: #333;
                            padding: 0 0 1.5rem;
                        }

                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info ul,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products ul,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments ul,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info ul,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products ul,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments ul,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info ul,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products ul,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments ul,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info ul,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products ul,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments ul {
                            padding-bottom: 2rem;
                        }

                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info ul li label,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products ul li label,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments ul li label,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info ul li label,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products ul li label,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments ul li label,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info ul li label,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products ul li label,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments ul li label,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info ul li label,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products ul li label,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments ul li label {
                                width: 100px;
                                color: #757575;
                                font-weight: 700;
                            }

                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table {
                            border: none;
                        }

                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table tr th:first-child, page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table tr td:first-child,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table tr th:first-child,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table tr td:first-child,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr th:first-child,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr td:first-child,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table tr th:first-child,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table tr td:first-child,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table tr th:first-child,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table tr td:first-child,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr th:first-child,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr td:first-child,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tr th:first-child,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tr td:first-child,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tr th:first-child,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tr td:first-child,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr th:first-child,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr td:first-child,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tr th:first-child,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tr td:first-child,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tr th:first-child,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tr td:first-child,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr th:first-child,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr td:first-child {
                                width: calc(100% - 120px);
                            }

                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table tr th:nth-child(2), page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table tr th:nth-child(3), page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table tr td:nth-child(2), page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table tr td:nth-child(3),
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table tr th:nth-child(2),
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table tr th:nth-child(3),
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table tr td:nth-child(2),
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table tr td:nth-child(3),
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr th:nth-child(2),
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr th:nth-child(3),
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr td:nth-child(2),
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr td:nth-child(3),
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table tr th:nth-child(2),
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table tr th:nth-child(3),
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table tr td:nth-child(2),
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table tr td:nth-child(3),
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table tr th:nth-child(2),
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table tr th:nth-child(3),
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table tr td:nth-child(2),
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table tr td:nth-child(3),
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr th:nth-child(2),
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr th:nth-child(3),
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr td:nth-child(2),
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr td:nth-child(3),
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tr th:nth-child(2),
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tr th:nth-child(3),
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tr td:nth-child(2),
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tr td:nth-child(3),
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tr th:nth-child(2),
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tr th:nth-child(3),
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tr td:nth-child(2),
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tr td:nth-child(3),
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr th:nth-child(2),
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr th:nth-child(3),
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr td:nth-child(2),
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr td:nth-child(3),
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tr th:nth-child(2),
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tr th:nth-child(3),
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tr td:nth-child(2),
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tr td:nth-child(3),
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tr th:nth-child(2),
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tr th:nth-child(3),
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tr td:nth-child(2),
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tr td:nth-child(3),
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr th:nth-child(2),
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr th:nth-child(3),
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr td:nth-child(2),
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tr td:nth-child(3) {
                                width: 60px;
                            }

                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table th,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table td,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table th,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table td,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table th,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table td,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table th,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table td,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table th,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table td,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table th,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table td,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table th,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table td,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table th,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table td,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table th,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table td,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table th,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table td,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table th,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table td,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table th,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table td {
                                vertical-align: middle;
                                font-size: 12px;
                            }

                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table td,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table td,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table td,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table td,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table td,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table td,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table td,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table td,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table td,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table td,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table td,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table td {
                                font-weight: 700;
                            }

                                page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table td:first-child,
                                page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table td:first-child,
                                page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table td:first-child,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table td:first-child,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table td:first-child,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table td:first-child,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table td:first-child,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table td:first-child,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table td:first-child,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table td:first-child,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table td:first-child,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table td:first-child {
                                    width: 50%;
                                    white-space: pre-line;
                                }

                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table th,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table th,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table th,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table th,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table th,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table th,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table th,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table th,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table th,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table th,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table th,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table th {
                                font-size: 10px;
                                font-weight: 500;
                                text-align: center;
                            }

                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table tfoot th,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table tfoot th,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table tfoot th,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table tfoot th,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table tfoot th,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table tfoot th,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tfoot th,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tfoot th,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tfoot th,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tfoot th,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tfoot th,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tfoot th {
                                font-size: 20px;
                                font-weight: 700;
                            }

                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table tfoot td,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table tfoot td,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table tfoot td,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table tfoot td,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table tfoot td,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table tfoot td,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tfoot td,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tfoot td,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tfoot td,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tfoot td,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tfoot td,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tfoot td {
                                color: #00d45a;
                                font-size: 30px;
                                font-weight: 700;
                                letter-spacing: -1px;
                            }

                                page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .table tfoot td small,
                                page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .table tfoot td small,
                                page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .table tfoot td small,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .table tfoot td small,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .table tfoot td small,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .table tfoot td small,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tfoot td small,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tfoot td small,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tfoot td small,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .table tfoot td small,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .table tfoot td small,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .table tfoot td small {
                                    color: #333;
                                    font-size: 50%;
                                }

                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .total-container,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .total-container,
                        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .total-container,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .total-container,
                        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .total-container,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .total-container,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .total-container,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .total-container,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-pack: end;
                            -webkit-justify-content: flex-end;
                            -ms-flex-pack: end;
                            justify-content: flex-end;
                            -webkit-box-align: end;
                            -webkit-align-items: flex-end;
                            -ms-flex-align: end;
                            align-items: flex-end;
                        }

                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .total-container span,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .total-container span,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container span,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .total-container span,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .total-container span,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container span,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .total-container span,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .total-container span,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container span,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .total-container span,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .total-container span,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container span {
                                font-size: 20px;
                                font-weight: 700;
                            }

                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .total-container h4,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .total-container h4,
                            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container h4,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .total-container h4,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .total-container h4,
                            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container h4,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .total-container h4,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .total-container h4,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container h4,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .total-container h4,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .total-container h4,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container h4 {
                                color: #00d45a;
                                font-size: 30px;
                                font-weight: 700;
                                letter-spacing: -1px;
                                margin: 0 0 0 1rem;
                            }

                                page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info .total-container h4 small,
                                page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products .total-container h4 small,
                                page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container h4 small,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info .total-container h4 small,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products .total-container h4 small,
                                page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container h4 small,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .total-container h4 small,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .total-container h4 small,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container h4 small,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info .total-container h4 small,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products .total-container h4 small,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments .total-container h4 small {
                                    color: #333;
                                    font-size: 50%;
                                }

@media (min-width: 1200px) {
    page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-info,
    page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-products,
    page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments,
    page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-info,
    page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-products,
    page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-info,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-products,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments {
        padding-right: 1rem;
    }
}

page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments,
page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments,
page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments,
page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments {
    padding-top: 2rem;
    border-top: 1px dashed #e0e0e0;
}

    page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments ul:last-child,
    page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments ul:last-child,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments ul:last-child,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments ul:last-child {
        border-bottom: none;
    }

@media (min-width: 1200px) {
    page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .operation-payments,
    page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .operation-payments,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .operation-payments {
        padding-top: 0;
        padding-left: 3rem;
        border-left: 1px dashed #e0e0e0;
        border-top: none;
    }
}

page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-body .operation-container .operation .cutout,
page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-body .operation-container .operation .cutout,
page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-body .operation-container .operation .cutout,
page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-body .operation-container .operation .cutout {
    position: absolute;
    bottom: -6px;
    left: 0;
    width: 100%;
    height: 6px;
    background-size: auto 6px;
    background-position: center top;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
}

page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-footer,
page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-footer,
page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-footer,
page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-footer {
    background-color: #eaf0f3;
    padding: 1rem;
    padding-top: 0;
}

    page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-footer .appointment-detail-container,
    page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-footer .appointment-detail-container,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-footer .appointment-detail-container,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-footer .appointment-detail-container {
        border-radius: 1rem;
        -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    }

        page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-footer .appointment-detail-container .appointment-detail,
        page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-footer .appointment-detail-container .appointment-detail,
        page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-footer .appointment-detail-container .appointment-detail,
        page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-footer .appointment-detail-container .appointment-detail {
            background-color: white;
            padding: 1.5rem 0.5rem 0.5rem 1.5rem;
            border-radius: 1rem;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-flex-wrap: wrap;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        }

            page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item,
            page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item {
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 calc(50% - 1rem);
                -ms-flex: 0 0 calc(50% - 1rem);
                flex: 0 0 calc(50% - 1rem);
                margin: 0 1rem 1rem 0;
            }

@media screen and (min-width: 1600px) {
    page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item,
    page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 calc(25% - 1rem);
        -ms-flex: 0 0 calc(25% - 1rem);
        flex: 0 0 calc(25% - 1rem);
    }
}

page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item label,
page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item label,
page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item label,
page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item label {
    font-size: 12px;
    font-weight: 600;
    margin: 0;
}

page-cashier-report .page-wrapper .col-sales.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item .form-control,
page-cashier-report .page-wrapper .col-sale-detail.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item .form-control,
page-cashier-report .page-wrapper .col-denom-breakdown.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item .form-control,
page-cashier-report .page-wrapper .col-daily-breakdown.col-sale-detail .col-footer .appointment-detail-container .appointment-detail .detail-item .form-control {
    border-width: 1px;
    padding: 0.75rem 1rem;
    height: unset;
    border-radius: 1rem;
    font-size: 14px;
}

page-cashier-report .page-wrapper .col-sales.col-denom-breakdown,
page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown,
page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown,
page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 320px;
}

    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-header .title,
    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-header .title,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-header .title,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-header .title {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-header .toolbar .btn,
    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-header .toolbar .btn,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-header .toolbar .btn,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-header .toolbar .btn {
        display: none;
    }

@media screen and (max-width: 1599px) {
    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-header .toolbar .btn,
    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-header .toolbar .btn,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-header .toolbar .btn,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-header .toolbar .btn {
        display: -webkit-inline-box;
        display: -webkit-inline-flex;
        display: -ms-inline-flexbox;
        display: inline-flex;
        width: 36px;
    }
}

page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body,
page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body,
page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body,
page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body {
    background-color: #f6f8fc;
    height: unset;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 0.5rem;
}

    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container h4,
    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container h4,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container h4,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container h4 {
        font-size: 16px;
        font-weight: 700;
        padding: 0 1rem;
    }

    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method,
    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method {
        margin-bottom: 0.5rem;
        -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        background-color: white;
    }

        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container,
        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container,
        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container,
        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            border-radius: 1rem;
            position: relative;
            padding: 0 1rem;
        }

            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .icon-container,
            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .icon-container,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .icon-container,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .icon-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 52px;
                -ms-flex: 0 0 52px;
                flex: 0 0 52px;
                height: 80px;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                padding: 0.5rem;
            }

            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container,
            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container {
                -webkit-box-flex: 1;
                -webkit-flex: 1;
                -ms-flex: 1;
                flex: 1;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
            }

                page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .detail,
                page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .detail,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .detail,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .detail {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-direction: column;
                    -ms-flex-direction: column;
                    flex-direction: column;
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    padding: 0.5rem;
                }

                    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .detail .name,
                    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .detail .name,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .detail .name,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .detail .name {
                        padding-top: 0.5rem;
                        font-weight: 700;
                    }

                    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .detail small,
                    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .detail small,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .detail small,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .detail small {
                        display: none;
                    }

                page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs,
                page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs {
                    padding: 0.5rem;
                    padding-left: 1rem;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 110px;
                    -ms-flex: 0 0 110px;
                    flex: 0 0 110px;
                    border-left: 1px solid rgba(0, 0, 0, 0.1);
                }

                    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group,
                    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group {
                        margin: 0;
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 calc(50% - 1rem);
                        -ms-flex: 0 0 calc(50% - 1rem);
                        flex: 0 0 calc(50% - 1rem);
                        -webkit-box-orient: vertical;
                        -webkit-box-direction: normal;
                        -webkit-flex-direction: column;
                        -ms-flex-direction: column;
                        flex-direction: column;
                        -webkit-box-align: start;
                        -webkit-align-items: flex-start;
                        -ms-flex-align: start;
                        align-items: flex-start;
                    }

                        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group label,
                        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group label,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group label,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group label {
                            font-size: 12px;
                            font-weight: 600;
                            margin: 0;
                        }

                        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group .form-control,
                        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group .form-control,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group .form-control,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group .form-control {
                            border-width: 1px;
                            text-align: right;
                            border-radius: 1rem;
                            font-size: 14px;
                            height: 28px;
                            padding: 0 0.75rem;
                        }

                            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group .form-control.fake-input,
                            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group .form-control.fake-input,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group .form-control.fake-input,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group .form-control.fake-input {
                                background-color: #e9ecef;
                                opacity: 1;
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-align: center;
                                -webkit-align-items: center;
                                -ms-flex-align: center;
                                align-items: center;
                                -webkit-box-pack: end;
                                -webkit-justify-content: flex-end;
                                -ms-flex-pack: end;
                                justify-content: flex-end;
                            }

                        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group h4,
                        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group h4,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group h4,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group h4 {
                            font-weight: 700;
                            margin: 0.25rem 0 0;
                        }

                            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group h4 small,
                            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group h4 small,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group h4 small,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .info-container .inputs .form-group h4 small {
                                font-weight: 500;
                                font-size: 50%;
                                color: #00be51;
                            }

            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .btn-denoms,
            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .btn-denoms,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .btn-denoms,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .method-container .btn-denoms {
                position: absolute;
                top: 0;
                right: 0;
                font-size: 10px;
                height: 16px;
                padding: 0 1rem;
                border-radius: 0 0.25rem 0 1rem;
                -webkit-box-shadow: none;
                box-shadow: none;
            }

        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container,
        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container,
        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container,
        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container {
            border-top: 1px solid #e0e0e0;
        }

            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container,
            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container,
            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-flex-wrap: wrap;
                -ms-flex-wrap: wrap;
                flex-wrap: wrap;
                background-color: white;
            }

                page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item,
                page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item,
                page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 50%;
                    -ms-flex: 0 0 50%;
                    flex: 0 0 50%;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-direction: column;
                    -ms-flex-direction: column;
                    flex-direction: column;
                    padding: 0.5rem 1rem;
                    border-bottom: 1px solid #e0e0e0;
                    position: relative;
                    overflow: hidden;
                }

                    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top,
                    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top,
                    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        z-index: 1;
                        position: relative;
                    }

                        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .desc, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .desc,
                        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .desc,
                        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .desc,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .desc,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .desc,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .desc,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .desc {
                            -webkit-box-flex: 0;
                            -webkit-flex: 0 0 50px;
                            -ms-flex: 0 0 50px;
                            flex: 0 0 50px;
                            font-weight: 700;
                            font-size: 16px;
                        }

                            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .desc small, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .desc small,
                            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .desc small,
                            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .desc small,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .desc small,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .desc small,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .desc small,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .desc small {
                                font-size: 50%;
                            }

                        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .input-container, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .input-container,
                        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .input-container,
                        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .input-container,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .input-container,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .input-container,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .input-container,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .input-container {
                            -webkit-box-flex: 1;
                            -webkit-flex-grow: 1;
                            -ms-flex-positive: 1;
                            flex-grow: 1;
                        }

                            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .input-container .form-control, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .input-container .form-control,
                            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .input-container .form-control,
                            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .input-container .form-control,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .input-container .form-control,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .input-container .form-control,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .input-container .form-control,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .input-container .form-control {
                                border-width: 1px;
                                border-color: #e0e0e0;
                                border-radius: 1rem;
                                padding: 0 0.75rem;
                                height: 28px;
                            }

                                page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .input-container .form-control:focus, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .input-container .form-control:focus,
                                page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .input-container .form-control:focus,
                                page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .input-container .form-control:focus,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .input-container .form-control:focus,
                                page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .input-container .form-control:focus,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .top .input-container .form-control:focus,
                                page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .top .input-container .form-control:focus {
                                    border-color: #00d45a;
                                    -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                                    box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                                }

                    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom,
                    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom,
                    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        -webkit-box-pack: end;
                        -webkit-justify-content: flex-end;
                        -ms-flex-pack: end;
                        justify-content: flex-end;
                        margin-top: 0.25rem;
                        position: relative;
                    }

                        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom .total, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom .total,
                        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom .total,
                        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom .total,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom .total,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom .total,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom .total,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom .total {
                            color: #00d45a;
                        }

                            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom .total small, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom .total small,
                            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom .total small,
                            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom .total small,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom .total small,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom .total small,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom .total small,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom .total small {
                                font-size: 14px;
                                color: #525252;
                                margin-right: 0.5rem;
                                font-weight: 700;
                            }

                            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom .total strong small, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom .total strong small,
                            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom .total strong small,
                            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom .total strong small,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom .total strong small,
                            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom .total strong small,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bottom .total strong small,
                            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bottom .total strong small {
                                color: #212121;
                                font-weight: 500;
                                font-size: 50%;
                                margin: 0 0.25rem;
                            }

                    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bg, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bg,
                    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bg,
                    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bg,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bg,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bg,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bg,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bg {
                        position: absolute;
                        bottom: -20px;
                        left: -15px;
                        color: #e0e0e0;
                        opacity: 0.8;
                    }

                        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bg:before, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bg:before,
                        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bg:before,
                        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bg:before,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bg:before,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bg:before,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item .bg:before,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item .bg:before {
                            font-size: 40px;
                        }

                    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item:last-child, page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item:last-child,
                    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item:last-child,
                    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item:last-child,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item:last-child,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item:last-child,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .coins-container .denom-item:last-child,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .paymentmethods-container .payment-method .denoms-container .bills-container .denom-item:last-child {
                        border-bottom: none;
                    }

    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report,
    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        border-top: 4px solid #f6f8fc;
    }

        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report .header,
        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report .header,
        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report .header,
        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report .header {
            width: 100%;
            margin: 0;
            text-transform: uppercase;
            font-size: 12px;
            font-weight: 600;
            padding: 0.5rem 0.5rem;
            background-color: #f6f8fc;
            color: white;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
            -webkit-flex-direction: row;
            -ms-flex-direction: row;
            flex-direction: row;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
        }

        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report .subcontainer,
        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report .subcontainer,
        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer,
        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
            -ms-flex-direction: column;
            flex-direction: column;
            width: 100%;
            background-color: white;
        }

            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report .subcontainer.grand-total,
            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report .subcontainer.grand-total,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer.grand-total,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer.grand-total {
                background: -webkit-gradient(linear, left top, right top, from(#eaf0f3), to(#f6f8fc));
                background: linear-gradient(to right, #eaf0f3, #f6f8fc);
            }

                page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total,
                page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total {
                    padding: 0 1.5rem;
                }

                    page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total .item,
                    page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total .item,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total .item,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total .item {
                        padding: 0.75rem 0;
                    }

        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report .item,
        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report .item,
        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report .item,
        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report .item {
            padding: 0.75rem 1.5rem;
            border-top: 1px solid rgba(0, 0, 0, 0.15);
            position: relative;
            color: #212121;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: end;
            -webkit-justify-content: flex-end;
            -ms-flex-pack: end;
            justify-content: flex-end;
        }

            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report .item .label,
            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report .item .label,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report .item .label,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report .item .label {
                white-space: nowrap;
                font-weight: 500;
                font-size: 14px;
                overflow: hidden;
                text-overflow: ellipsis;
                margin: 0;
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
            }

                page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report .item .label:first-letter,
                page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report .item .label:first-letter,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report .item .label:first-letter,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report .item .label:first-letter {
                    text-transform: capitalize;
                }

            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report .item .total,
            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report .item .total,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report .item .total,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report .item .total {
                font-weight: 700;
            }

        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report .subcontainer-total,
        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report .subcontainer-total,
        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer-total,
        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer-total {
            background-color: rgba(255, 255, 255, 0.15);
            color: white;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: end;
            -webkit-justify-content: flex-end;
            -ms-flex-pack: end;
            justify-content: flex-end;
            padding: 0.25rem 1.5rem;
            font-size: 14px;
            font-weight: 500;
            color: #FFF;
        }

            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report .subcontainer-total .label strong,
            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report .subcontainer-total .label strong,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer-total .label strong,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer-total .label strong {
                font-weight: 500;
            }

            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report .subcontainer-total .total,
            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report .subcontainer-total .total,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer-total .total,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer-total .total {
                margin-left: 1rem;
                font-size: 15px;
            }

                page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report .subcontainer-total .total small,
                page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report .subcontainer-total .total small,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer-total .total small,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report .subcontainer-total .total small {
                    color: rgba(255, 255, 255, 0.75);
                }

        page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report.differences,
        page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report.differences,
        page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report.differences,
        page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report.differences {
            border-left: 4px solid #ff9800;
        }

            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report.differences .header,
            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report.differences .header,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report.differences .header,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report.differences .header {
                background: -webkit-gradient(linear, left top, right top, from(#ff9800), to(#e91e63));
                background: linear-gradient(to right, #ff9800, #e91e63);
            }

            page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-body .reports-container .report.differences .grand-total .subcontainer-total .item .total small,
            page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-body .reports-container .report.differences .grand-total .subcontainer-total .item .total small,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-body .reports-container .report.differences .grand-total .subcontainer-total .item .total small,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-body .reports-container .report.differences .grand-total .subcontainer-total .item .total small {
                color: #f57c00;
            }

page-cashier-report .page-wrapper .col-sales.col-denom-breakdown .col-footer,
page-cashier-report .page-wrapper .col-sale-detail.col-denom-breakdown .col-footer,
page-cashier-report .page-wrapper .col-denom-breakdown.col-denom-breakdown .col-footer,
page-cashier-report .page-wrapper .col-daily-breakdown.col-denom-breakdown .col-footer {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 46px;
    -ms-flex: 0 0 46px;
    flex: 0 0 46px;
}

page-cashier-report .page-wrapper .col-sales.col-daily-breakdown,
page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown,
page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown,
page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 320px;
    z-index: 2;
    background: -webkit-gradient(linear, left top, left bottom, from(#525252), to(#333));
    background: linear-gradient(to bottom, #525252, #333);
}

    page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-header,
    page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-header,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-header,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-header {
        background-color: #525252;
    }

        page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-header .toolbar .btn small,
        page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-header .toolbar .btn small,
        page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-header .toolbar .btn small,
        page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-header .toolbar .btn small {
            color: white;
            padding: 0 1rem;
        }

            page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-header .toolbar .btn small strong,
            page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-header .toolbar .btn small strong,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-header .toolbar .btn small strong,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-header .toolbar .btn small strong {
                color: #00d45a;
            }

    page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body,
    page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body {
        background-color: transparent;
        height: unset;
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        padding: 0;
    }

        page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report,
        page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report,
        page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report,
        page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            border-top: 4px solid #333;
        }

            page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .header,
            page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .header,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .header,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .header {
                width: 100%;
                margin: 0;
                text-transform: uppercase;
                font-size: 12px;
                font-weight: 600;
                padding: 0.5rem 0.5rem;
                background-color: #333;
                color: white;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: horizontal;
                -webkit-box-direction: normal;
                -webkit-flex-direction: row;
                -ms-flex-direction: row;
                flex-direction: row;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
            }

            page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .subheader,
            page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .subheader,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .subheader,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .subheader {
                width: 100%;
                margin: 0;
                padding: 0.25rem 1.5rem;
                font-weight: 600;
                font-size: 12px;
                color: white;
            }

            page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .subcontainer,
            page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .subcontainer,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                -ms-flex-direction: column;
                flex-direction: column;
                width: 100%;
            }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .subcontainer.grand-total,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .subcontainer.grand-total,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer.grand-total,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer.grand-total {
                    background: -webkit-gradient(linear, left top, right top, from(#212121), to(#212121));
                    background: linear-gradient(to right, #212121, #212121);
                }

                    page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total,
                    page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total {
                        padding: 0 1.5rem;
                    }

                        page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total .item,
                        page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total .item,
                        page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total .item,
                        page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer.grand-total .subcontainer-total .item {
                            padding: 0.75rem 0;
                        }

            page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .item,
            page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .item,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .item,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .item {
                padding: 0.75rem 1.5rem;
                border-top: 1px solid rgba(255, 255, 255, 0.05);
                position: relative;
                color: white;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: end;
                -webkit-justify-content: flex-end;
                -ms-flex-pack: end;
                justify-content: flex-end;
            }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .item .label,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .item .label,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .item .label,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .item .label {
                    white-space: nowrap;
                    font-weight: 300;
                    font-size: 14px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    margin: 0;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                }

                    page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .item .label:first-letter,
                    page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .item .label:first-letter,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .item .label:first-letter,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .item .label:first-letter {
                        text-transform: capitalize;
                    }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .item .total,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .item .total,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .item .total,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .item .total {
                    font-size: 14px;
                    font-weight: 600;
                    margin-bottom: 0;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    text-align: right;
                }

                    page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .item .total small,
                    page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .item .total small,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .item .total small,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .item .total small {
                        color: #00d45a;
                        margin-right: 0.25rem;
                    }

                    page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .item .total.text-danger small,
                    page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .item .total.text-danger small,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .item .total.text-danger small,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .item .total.text-danger small {
                        color: #f44336;
                    }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .item .percentage,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .item .percentage,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .item .percentage,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .item .percentage {
                    position: absolute;
                    height: 2px;
                    bottom: 0;
                    left: 0;
                    background: -webkit-gradient(linear, left top, right top, from(#ffa000), to(#ffc107));
                    background: linear-gradient(to right, #ffa000, #ffc107);
                }

            page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .subcontainer-total,
            page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .subcontainer-total,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer-total,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer-total {
                background-color: rgba(255, 255, 255, 0.15);
                color: white;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: end;
                -webkit-justify-content: flex-end;
                -ms-flex-pack: end;
                justify-content: flex-end;
                padding: 0.25rem 1.5rem;
                font-size: 14px;
                font-weight: 500;
                color: #FFF;
            }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .subcontainer-total .label strong,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .subcontainer-total .label strong,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer-total .label strong,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer-total .label strong {
                    font-weight: 500;
                }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .subcontainer-total .total,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .subcontainer-total .total,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer-total .total,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer-total .total {
                    margin-left: 1rem;
                    font-size: 15px;
                }

                    page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report .subcontainer-total .total small,
                    page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report .subcontainer-total .total small,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer-total .total small,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report .subcontainer-total .total small {
                        color: rgba(255, 255, 255, 0.75);
                    }

            page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report.incomes,
            page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report.incomes,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report.incomes,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report.incomes {
                border-left: 4px solid #1e88e5;
            }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report.incomes .header,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report.incomes .header,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report.incomes .header,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report.incomes .header {
                    background: -webkit-gradient(linear, left top, right top, from(#1e88e5), to(#2196f3));
                    background: linear-gradient(to right, #1e88e5, #2196f3);
                }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report.incomes .grand-total .subcontainer-total .item .total small,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report.incomes .grand-total .subcontainer-total .item .total small,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report.incomes .grand-total .subcontainer-total .item .total small,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report.incomes .grand-total .subcontainer-total .item .total small {
                    color: #2196f3;
                }

            page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report.outcomes,
            page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report.outcomes,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report.outcomes,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report.outcomes {
                border-left: 4px solid #ffa000;
            }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report.outcomes .header,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report.outcomes .header,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report.outcomes .header,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report.outcomes .header {
                    background: -webkit-gradient(linear, left top, right top, from(#ffa000), to(#ffc107));
                    background: linear-gradient(to right, #ffa000, #ffc107);
                }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report.outcomes .grand-total .subcontainer-total .item .total small,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report.outcomes .grand-total .subcontainer-total .item .total small,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report.outcomes .grand-total .subcontainer-total .item .total small,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report.outcomes .grand-total .subcontainer-total .item .total small {
                    color: #ffc107;
                }

            page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report.totals,
            page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report.totals,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report.totals,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report.totals {
                border-left: 4px solid #00d45a;
            }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report.totals .header,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report.totals .header,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report.totals .header,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report.totals .header {
                    background: -webkit-gradient(linear, left top, right top, from(#00d45a), to(#08e465));
                    background: linear-gradient(to right, #00d45a, #08e465);
                }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report.totals .subcontainer .item .label, page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-body .reports-container .report.totals .subcontainer .item .total,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report.totals .subcontainer .item .label,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-body .reports-container .report.totals .subcontainer .item .total,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report.totals .subcontainer .item .label,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-body .reports-container .report.totals .subcontainer .item .total,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report.totals .subcontainer .item .label,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-body .reports-container .report.totals .subcontainer .item .total {
                    font-size: 16px;
                }

    page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-footer,
    page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-footer,
    page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-footer,
    page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-footer {
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-flow: column;
        -ms-flex-flow: column;
        flex-flow: column;
        background-color: transparent;
    }

        page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-footer .total-container,
        page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-footer .total-container,
        page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-footer .total-container,
        page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-footer .total-container {
            background-color: transparent;
        }

            page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-footer .total-container .header,
            page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-footer .total-container .header,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-footer .total-container .header,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-footer .total-container .header {
                padding: 0.25rem 1.5rem;
                text-transform: uppercase;
                font-size: 12px;
                background-color: rgba(255, 255, 255, 0.15);
            }

            page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-footer .total-container .item,
            page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-footer .total-container .item,
            page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-footer .total-container .item,
            page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-footer .total-container .item {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                font-size: 16px;
                color: #FFF;
                padding: 0.5rem 1.5rem;
                height: 46px;
                border-top: 1px solid rgba(255, 255, 255, 0.05);
            }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-footer .total-container .item .label,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-footer .total-container .item .label,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-footer .total-container .item .label,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-footer .total-container .item .label {
                    margin-bottom: 0;
                    white-space: nowrap;
                    font-weight: 300;
                    font-size: 15px;
                }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-footer .total-container .item .total,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-footer .total-container .item .total,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-footer .total-container .item .total,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-footer .total-container .item .total {
                    font-size: 18px;
                    font-weight: 700;
                    margin-bottom: 0;
                }

                    page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-footer .total-container .item .total small,
                    page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-footer .total-container .item .total small,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-footer .total-container .item .total small,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-footer .total-container .item .total small {
                        color: #00d45a;
                        margin-right: 0.25rem;
                    }

                    page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-footer .total-container .item .total.text-danger small,
                    page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-footer .total-container .item .total.text-danger small,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-footer .total-container .item .total.text-danger small,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-footer .total-container .item .total.text-danger small {
                        color: #f44336;
                    }

                page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-footer .total-container .item .control,
                page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-footer .total-container .item .control,
                page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-footer .total-container .item .control,
                page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-footer .total-container .item .control {
                    margin-bottom: 0;
                    max-width: 160px;
                    padding: 2px 6px 1px;
                    border-radius: 0;
                    position: relative;
                    text-align: right;
                }

                    page-cashier-report .page-wrapper .col-sales.col-daily-breakdown .col-footer .total-container .item .control .mat-select-value,
                    page-cashier-report .page-wrapper .col-sale-detail.col-daily-breakdown .col-footer .total-container .item .control .mat-select-value,
                    page-cashier-report .page-wrapper .col-denom-breakdown.col-daily-breakdown .col-footer .total-container .item .control .mat-select-value,
                    page-cashier-report .page-wrapper .col-daily-breakdown.col-daily-breakdown .col-footer .total-container .item .control .mat-select-value {
                        color: white;
                        padding-right: 0.5rem;
                    }

.autocomplete-table {
    font-size: 14px;
}

    .autocomplete-table tr td {
        padding-right: 1rem;
    }

        .autocomplete-table tr td:nth-child(1) {
            width: 64px;
        }

        .autocomplete-table tr td:nth-child(2) {
            width: 140px;
        }

        .autocomplete-table tr td:nth-child(3) {
            width: 160px;
        }

        .autocomplete-table tr td:nth-child(4) {
            width: calc(100% - 64px - 140px - 160px - 70px);
        }

            .autocomplete-table tr td:nth-child(4) div {
                width: 280px;
                overflow: hidden;
                text-overflow: ellipsis;
            }

        .autocomplete-table tr td:nth-child(5) {
            width: 70px;
            border-radius: 0;
        }

.referenceAutocomplete {
    width: 750px;
}

page-pos-appointments .page-wrapper .panel-cuentas {
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

    page-pos-appointments .page-wrapper .panel-cuentas .row {
        height: 100%;
    }

    page-pos-appointments .page-wrapper .panel-cuentas .col-month,
    page-pos-appointments .page-wrapper .panel-cuentas .col-day {
        padding: 0;
        height: 100%;
    }

        page-pos-appointments .page-wrapper .panel-cuentas .col-month .col-body {
            background-color: #eaf0f3;
        }

            page-pos-appointments .page-wrapper .panel-cuentas .col-month .col-body calendar monthview > div .event-detail-container {
                display: none;
            }

        page-pos-appointments .page-wrapper .panel-cuentas .col-day calendar monthview > div .slides {
            display: none;
        }

    page-pos-appointments .page-wrapper .panel-cuentas .col-header {
        background-color: #00d45a;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 46px;
        -ms-flex: 0 0 46px;
        flex: 0 0 46px;
        height: 46px;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

        page-pos-appointments .page-wrapper .panel-cuentas .col-header .title {
            font-size: 18px;
            color: #FFF;
            margin: 0;
            padding: 1rem;
            padding-right: 0.3rem;
            white-space: nowrap;
        }

            page-pos-appointments .page-wrapper .panel-cuentas .col-header .title button {
                color: rgba(255, 255, 255, 0.35);
                -webkit-transition: color 0.3s ease;
                transition: color 0.3s ease;
            }

                page-pos-appointments .page-wrapper .panel-cuentas .col-header .title button i {
                    font-size: 16px;
                }

                page-pos-appointments .page-wrapper .panel-cuentas .col-header .title button:hover {
                    color: white;
                }

            page-pos-appointments .page-wrapper .panel-cuentas .col-header .title span {
                text-transform: uppercase;
                width: 175px;
                display: -webkit-inline-box;
                display: -webkit-inline-flex;
                display: -ms-inline-flexbox;
                display: inline-flex;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
            }

        page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: end;
            -webkit-justify-content: flex-end;
            -ms-flex-pack: end;
            justify-content: flex-end;
            padding: 0 0.5rem;
            position: relative;
        }

            page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar i {
                color: #FFF;
            }

            page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar .btn {
                height: 36px;
                padding: 0 0.5rem;
                background-color: transparent !important;
                border-color: transparent !important;
                font-size: 15px;
                -webkit-transition: background-color 0.3s ease;
                transition: background-color 0.3s ease;
            }

                page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar .btn:hover {
                    background-color: rgba(0, 0, 0, 0.05) !important;
                }

                page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar .btn i {
                    font-size: 20px;
                }

                    page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar .btn i.lg {
                        font-size: 24px;
                    }

                page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar .btn span {
                    margin-left: 0.5rem;
                }

            page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar h4 {
                color: #FFF;
                margin: 0;
                font-size: 18px;
            }

            page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar .form-control {
                width: auto;
                display: -webkit-inline-box;
                display: -webkit-inline-flex;
                display: -ms-inline-flexbox;
                display: inline-flex;
                background-color: transparent;
                border: none;
                font-size: 15px;
                color: #FFF;
                -webkit-box-shadow: none;
                box-shadow: none;
                text-align: right;
                cursor: pointer;
            }

                page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar .form-control .item-inner {
                    padding-right: 0;
                }

                    page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar .form-control .item-inner .label {
                        margin-right: 0;
                    }

            page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar .datepicker-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                width: 100%;
            }

                page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar .datepicker-container .form-control {
                    width: calc(100% - 40px);
                    padding-right: 0;
                }

                page-pos-appointments .page-wrapper .panel-cuentas .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button {
                    color: white;
                    line-height: 46px;
                }

    page-pos-appointments .page-wrapper .panel-cuentas .scroll-pagos {
        max-height: calc(100vh - 148px);
        overflow-y: auto;
    }

    page-pos-appointments .page-wrapper .panel-cuentas .scroll-desgloces {
        height: calc(100% - 46px);
        overflow-y: auto;
    }

    page-pos-appointments .page-wrapper .panel-cuentas .col-body {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        padding: 1rem;
        height: calc(100% - 46px);
        overflow-y: auto;
    }

        page-pos-appointments .page-wrapper .panel-cuentas .col-body calendar monthview > div > .slides .swiper-slide {
            border-right: 1px solid #eaf0f3;
        }

        page-pos-appointments .page-wrapper .panel-cuentas .col-body calendar monthview > div > .slides .table {
            margin-bottom: 0;
        }

            page-pos-appointments .page-wrapper .panel-cuentas .col-body calendar monthview > div > .slides .table > thead > tr > th {
                text-transform: uppercase;
                background-color: white;
            }

                page-pos-appointments .page-wrapper .panel-cuentas .col-body calendar monthview > div > .slides .table > thead > tr > th small {
                    font-size: 12px;
                    font-weight: 700;
                }

            page-pos-appointments .page-wrapper .panel-cuentas .col-body calendar monthview > div > .slides .table > tbody > tr > td {
                background-color: white;
            }

@media (min-width: 1024px) {
    page-pos-appointments .page-wrapper .panel-cuentas .col-body calendar monthview > div > .slides .table > tbody > tr > td {
        line-height: unset !important;
        height: 100px;
        text-align: left;
    }
}

page-pos-appointments .page-wrapper .panel-cuentas .col-body calendar monthview > div > .slides .table > tbody > tr > td.text-muted {
    background-color: #f6f8fc;
    color: #bdbdbd !important;
}

page-pos-appointments .page-wrapper .panel-cuentas .col-body calendar monthview > div > .slides .table > tbody > tr > td.monthview-primary-with-event {
    background-color: #1e88e5;
}

page-pos-appointments .page-wrapper .panel-cuentas .col-body calendar monthview > div > .slides .table > tbody > tr > td.monthview-current {
    font-weight: 700;
}

page-pos-appointments .page-wrapper .panel-cuentas .col-body calendar monthview > div > .slides .table > tbody > tr > td.monthview-selected {
    background-color: #00d45a;
}

page-pos-cashier .page-wrapper .panel-cashier {
    height: 100%;
}

    page-pos-cashier .page-wrapper .panel-cashier .row {
        height: 100%;
    }

        page-pos-cashier .page-wrapper .panel-cashier .row .col-12 {
            padding: 0;
            height: 100%;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
            z-index: 2;
        }

            page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header {
                background-color: #00d45a;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 46px;
                -ms-flex: 0 0 46px;
                flex: 0 0 46px;
                height: 46px;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
            }

                page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .title {
                    font-size: 18px;
                    color: #FFF;
                    margin: 0;
                    padding: 1rem;
                    padding-right: 0.3rem;
                    white-space: nowrap;
                }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .title i {
                        font-size: 16px;
                    }

                page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: end;
                    -webkit-justify-content: flex-end;
                    -ms-flex-pack: end;
                    justify-content: flex-end;
                    padding: 0 0.5rem;
                    position: relative;
                }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar i {
                        color: #FFF;
                    }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar .btn {
                        height: 36px;
                        padding: 0 0.5rem;
                        background-color: transparent !important;
                        border-color: transparent !important;
                        font-size: 15px;
                        -webkit-transition: background-color 0.3s ease;
                        transition: background-color 0.3s ease;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar .btn:hover {
                            background-color: rgba(0, 0, 0, 0.05) !important;
                        }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar .btn i {
                            font-size: 20px;
                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar .btn i.fas {
                                font-size: 16px;
                            }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar .btn span {
                            margin-left: 0.5rem;
                        }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar h4 {
                        color: #FFF;
                        margin: 0;
                        font-size: 18px;
                    }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar .form-control {
                        width: auto;
                        display: -webkit-inline-box;
                        display: -webkit-inline-flex;
                        display: -ms-inline-flexbox;
                        display: inline-flex;
                        background-color: transparent;
                        border: none;
                        font-size: 15px;
                        color: #FFF;
                        -webkit-box-shadow: none;
                        box-shadow: none;
                        text-align: right;
                        cursor: pointer;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar .form-control .item-inner {
                            padding-right: 0;
                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar .form-control .item-inner .label {
                                margin-right: 0;
                            }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar .datepicker-container {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        width: 100%;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar .datepicker-container .form-control {
                            width: calc(100% - 40px);
                            padding-right: 0;
                        }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button {
                            color: white;
                            line-height: 46px;
                        }

            page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-body {
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                padding: 1rem;
                height: calc(100% - 46px);
                overflow-y: auto;
            }

            page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .options-container {
                background-color: #212121;
            }

                page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .options-container .option-item {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    font-size: 16px;
                    color: #FFF;
                    padding: 0.7rem 1rem;
                    max-height: 49px;
                }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .options-container .option-item .label {
                        margin-bottom: 0;
                        white-space: nowrap;
                    }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .options-container .option-item .control {
                        margin-bottom: 0;
                        max-width: 160px;
                        padding: 2px 6px 1px;
                        border-radius: 0;
                        position: relative;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .options-container .option-item .control.input {
                            background-color: #333;
                            border-color: #333;
                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .options-container .option-item .control.input .text-input {
                                width: 100%;
                                margin: 4px 0 3px;
                                text-align: right;
                                color: #FFF;
                            }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .options-container .option-item select.control {
                        border-radius: 0.25rem;
                        color: #212121;
                        -webkit-box-flex: 1;
                        -webkit-flex-grow: 1;
                        -ms-flex-positive: 1;
                        flex-grow: 1;
                        cursor: pointer;
                        flex-grow: 1;
                        max-width: 60%;
                    }

                page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .options-container .totals {
                    background-color: #FFF;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: column;
                    -ms-flex-flow: column;
                    flex-flow: column;
                }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .options-container .totals .option-item {
                        color: #212121;
                        max-height: none;
                        height: 46px;
                        position: relative;
                        border-bottom: 1px solid #eaf0f3;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .options-container .totals .option-item .label {
                            margin-bottom: 0;
                            color: #525252;
                            font-weight: 600;
                        }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .options-container .totals .option-item h4 {
                            margin: 0;
                            font-weight: 700;
                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .options-container .totals .option-item h4 small {
                                font-size: 50%;
                            }

            page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
            }

                page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .btn {
                    padding: 0.5rem 1rem;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    border-radius: 0;
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    font-size: 18px;
                    height: 46px;
                }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .btn:not(.btn-icon) {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-flex: 1;
                        -webkit-flex-grow: 1;
                        -ms-flex-positive: 1;
                        flex-grow: 1;
                        border-radius: 0;
                        height: 46px;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .btn:not(.btn-icon) i {
                            position: absolute;
                            right: 1rem;
                            margin: 0;
                        }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .btn.btn-icon {
                        width: 46px;
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 46px;
                        -ms-flex: 0 0 46px;
                        flex: 0 0 46px;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                    }

                page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .discount-container {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: horizontal;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: row;
                    -ms-flex-flow: row;
                    flex-flow: row;
                    background-color: #1e88e5;
                    -webkit-box-shadow: none;
                    box-shadow: none;
                    cursor: pointer;
                    color: #FFF;
                    border-radius: 0;
                    -webkit-transition: all 0.5s ease;
                    transition: all 0.5s ease;
                    width: 100%;
                    height: 46px;
                    margin-bottom: 0;
                }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .discount-container .info {
                        width: 100%;
                        max-width: calc(100% - 40px);
                        padding: 1rem 0.5rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .discount-container .info .label {
                            width: calc(100% - 0.5rem);
                            padding-left: 0.5rem;
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-pack: justify;
                            -webkit-justify-content: space-between;
                            -ms-flex-pack: justify;
                            justify-content: space-between;
                            -webkit-box-align: center;
                            -webkit-align-items: center;
                            -ms-flex-align: center;
                            align-items: center;
                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .discount-container .info .label h4 {
                                white-space: nowrap;
                                overflow: hidden;
                                text-overflow: ellipsis;
                                font-size: 16px;
                                font-weight: 500;
                                margin: 0;
                                text-transform: capitalize;
                            }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .discount-container .info .label h3 {
                                font-size: 26px;
                                margin: 0;
                            }

                                page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .discount-container .info .label h3 small {
                                    font-size: 50%;
                                    margin: 0 0.25rem;
                                }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .discount-container .action {
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 46px;
                        -ms-flex: 0 0 46px;
                        flex: 0 0 46px;
                        padding: 1rem 0.5rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-orient: vertical;
                        -webkit-box-direction: normal;
                        -webkit-flex-flow: column;
                        -ms-flex-flow: column;
                        flex-flow: column;
                        -webkit-justify-content: space-around;
                        -ms-flex-pack: distribute;
                        justify-content: space-around;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .discount-container .action .btn {
                            color: #FFF;
                            width: 32px;
                            height: 32px;
                            font-size: 26px;
                            padding: 0;
                            -webkit-box-pack: center;
                            -webkit-justify-content: center;
                            -ms-flex-pack: center;
                            justify-content: center;
                            -webkit-box-align: center;
                            -webkit-align-items: center;
                            -ms-flex-align: center;
                            align-items: center;
                        }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .discount-container.selected {
                        background-color: #00d45a;
                        color: #fff;
                    }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-12 .col-footer .action-container .discount-container:hover {
                        -webkit-transform: none;
                        transform: none;
                    }

        page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas {
            background-color: #f6f8fc;
            height: 100%;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
        }

            page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .col-body {
                padding: 0;
                overflow: hidden;
            }

            page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container {
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                height: calc(100% - 46px);
                margin: 0;
                overflow-y: auto;
            }

                page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item {
                    cursor: pointer;
                    background-color: #f6f8fc;
                    border-bottom: 2px solid #e0e0e0;
                }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .item {
                        background-color: #f6f8fc;
                        border-bottom: none;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .item .item-inner {
                            border-bottom: none;
                        }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info {
                        padding-left: 1rem;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-align: center;
                            -webkit-align-items: center;
                            -ms-flex-align: center;
                            align-items: center;
                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .item-image {
                                width: 48px;
                                height: 48px;
                                margin-right: 1.5rem;
                                background-size: contain;
                                background-repeat: no-repeat;
                                background-position: center;
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-align: center;
                                -webkit-align-items: center;
                                -ms-flex-align: center;
                                align-items: center;
                                -webkit-box-pack: center;
                                -webkit-justify-content: center;
                                -ms-flex-pack: center;
                                justify-content: center;
                                border-radius: 1rem;
                            }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .alias {
                                font-size: 15px;
                                text-overflow: ellipsis;
                                overflow: hidden;
                            }

                                page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .alias::first-letter {
                                    text-transform: uppercase;
                                }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .info {
                                font-size: 12px;
                                margin-top: 0.25rem;
                                margin-bottom: 0.5rem;
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-orient: vertical;
                                -webkit-box-direction: normal;
                                -webkit-flex-flow: column;
                                -ms-flex-flow: column;
                                flex-flow: column;
                            }

                                page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .info .area,
                                page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .info .folio,
                                page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .info .creada {
                                    font-size: 12px;
                                    text-overflow: ellipsis;
                                    overflow: hidden;
                                    white-space: nowrap;
                                }

                                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .info .area::first-letter,
                                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .info .folio::first-letter,
                                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .info .creada::first-letter {
                                        text-transform: uppercase;
                                    }

                                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .info .area strong,
                                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .info .folio strong,
                                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .info .creada strong {
                                        font-weight: 700;
                                    }

                                        page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .info .area strong::first-letter,
                                        page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .info .folio strong::first-letter,
                                        page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .detail .info .creada strong::first-letter {
                                            text-transform: uppercase;
                                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .action {
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-orient: vertical;
                                -webkit-box-direction: normal;
                                -webkit-flex-flow: column;
                                -ms-flex-flow: column;
                                flex-flow: column;
                                -webkit-box-pack: center;
                                -webkit-justify-content: center;
                                -ms-flex-pack: center;
                                justify-content: center;
                            }

                                page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .action .btn {
                                    padding: 0;
                                    border-radius: 50%;
                                    -webkit-transition: -webkit-transform 0.15s ease;
                                    transition: -webkit-transform 0.15s ease;
                                    transition: transform 0.15s ease;
                                    transition: transform 0.15s ease, -webkit-transform 0.15s ease;
                                    font-size: 30px;
                                }

                                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .body .action .btn:hover {
                                        -webkit-transform: translateX(2px);
                                        transform: translateX(2px);
                                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .cuenta-info .footer {
                            font-size: 11px;
                            font-weight: 500;
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-pack: justify;
                            -webkit-justify-content: space-between;
                            -ms-flex-pack: justify;
                            justify-content: space-between;
                        }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .item-options-left,
                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .item-options-right {
                        width: auto;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .item-options-left .btn,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .item-options-right .btn {
                            padding: 0.25rem;
                            width: 70px;
                            border-radius: 0;
                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .item-options-left .btn i,
                            page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .item-options-right .btn i {
                                color: #FFF;
                                margin-right: 0;
                            }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .item-options-left .btn span,
                            page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item .item-options-right .btn span {
                                font-size: 12px;
                                white-space: normal;
                            }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item.selected {
                        background-color: white;
                        -webkit-box-shadow: 0 0 16px -8px rgba(0, 0, 0, 0.5);
                        box-shadow: 0 0 16px -8px rgba(0, 0, 0, 0.5);
                        border-bottom: 2px solid #00d45a;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item.selected .cuenta-info {
                            background-color: white;
                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuentas-container .cuenta-item.selected .cuenta-info .alias {
                                opacity: 1 !important;
                            }

            page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuenta-footer {
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 46px;
                -ms-flex: 0 0 46px;
                flex: 0 0 46px;
            }

                page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuenta-footer .total-container .count-item,
                page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuenta-footer .total-container .total-item {
                    height: 46px;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    background-color: #333;
                    font-size: 18px;
                    color: #FFF;
                    padding: 0.5rem 1rem;
                }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuenta-footer .total-container .count-item p,
                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuenta-footer .total-container .total-item p {
                        margin-bottom: 0;
                    }

                page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuenta-footer .total-container .total-item {
                    font-size: 18px;
                    background-color: #212121;
                }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuenta-footer .total-container .total-item .total {
                        color: #00d45a;
                        font-weight: 700;
                    }

                page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuenta-footer .action-container {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuenta-footer .action-container .btn {
                        padding: 0.5rem 1rem;
                        -webkit-box-flex: 1;
                        -webkit-flex-grow: 1;
                        -ms-flex-positive: 1;
                        flex-grow: 1;
                        border-radius: 0;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        font-size: 18px;
                        height: 46px;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-cuentas .cuenta-footer .action-container .btn i {
                            margin: 0;
                        }

        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments {
            background-color: #eaf0f3;
        }

            page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-header {
                background-color: #00be51;
            }

            page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body {
                height: 100%;
                overflow-y: auto;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                -ms-flex-direction: column;
                flex-direction: column;
            }

                page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order {
                    border-top: 4px solid #08e465;
                    border-radius: 4px 4px 0 0;
                    padding: 2rem calc(2rem + 15px);
                    background-color: white;
                    position: relative;
                    -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
                    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
                }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-info,
                    page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-products,
                    page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments {
                        padding-bottom: 1rem;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-info .order-title h1,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-products .order-title h1,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments .order-title h1 {
                            font-size: 24px;
                            font-weight: 700;
                            color: #333;
                            padding: 1rem 0 0;
                            margin: 0;
                        }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-info .order-title h4,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-products .order-title h4,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments .order-title h4 {
                            font-size: 18px;
                            font-weight: 700;
                            color: #333;
                            padding: 0 0 1rem;
                        }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-info ul,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-products ul,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments ul {
                            border-bottom: 1px dashed #e0e0e0;
                            padding-bottom: 2rem;
                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-info ul li label,
                            page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-products ul li label,
                            page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments ul li label {
                                width: 100px;
                                color: #757575;
                                font-weight: 700;
                            }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-info table th,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-info table td,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-products table th,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-products table td,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments table th,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments table td {
                            vertical-align: middle;
                        }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-info table td,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-products table td,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments table td {
                            font-weight: 700;
                        }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-info table th,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-products table th,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments table th {
                            font-weight: 500;
                        }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-info table tfoot th,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-products table tfoot th,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments table tfoot th {
                            font-weight: 700;
                            text-align: right;
                        }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-info table tfoot td,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-products table tfoot td,
                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments table tfoot td {
                            color: #00d45a;
                            font-size: 24px;
                            font-weight: 700;
                            letter-spacing: -1px;
                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-info table tfoot td small,
                            page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-products table tfoot td small,
                            page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments table tfoot td small {
                                color: #333;
                                font-size: 50%;
                            }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments {
                        padding-top: 2rem;
                        border-top: 1px dashed #e0e0e0;
                    }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments .order-title {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-pack: justify;
                            -webkit-justify-content: space-between;
                            -ms-flex-pack: justify;
                            justify-content: space-between;
                            -webkit-box-align: center;
                            -webkit-align-items: center;
                            -ms-flex-align: center;
                            align-items: center;
                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments .order-title .btn {
                                border-width: 1px !important;
                                font-size: 14px;
                                padding: 0 1.5rem;
                                height: 36px;
                            }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments .client-container .header {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-pack: justify;
                            -webkit-justify-content: space-between;
                            -ms-flex-pack: justify;
                            justify-content: space-between;
                            -webkit-box-align: center;
                            -webkit-align-items: center;
                            -ms-flex-align: center;
                            align-items: center;
                            background: -webkit-gradient(linear, left top, right top, from(#00d45a), to(#00be51));
                            background: linear-gradient(to right, #00d45a, #00be51);
                            padding: 0 1rem;
                            margin: 0 -1rem;
                            width: calc(100% + 2rem);
                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments .client-container .header h4 {
                                color: white;
                                font-size: 12px;
                                font-weight: 700;
                                letter-spacing: 1px;
                                margin: 0;
                                text-transform: uppercase;
                            }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments .client-container .header .btn {
                                border-radius: 0;
                                font-size: 14px;
                                padding: 0 1rem;
                                height: 36px;
                            }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments .client-container .table td:first-child {
                            font-size: 14px;
                            white-space: nowrap;
                        }

                            page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments .client-container .table td:first-child::first-letter {
                                text-transform: uppercase;
                            }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments .client-container .table td .label {
                            margin: 0;
                            font-size: 14px;
                        }

                        page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .order-payments .client-container .table td .btn {
                            width: 32px;
                            height: 32px;
                        }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-payments .col-body .order-container .order .cutout {
                        position: absolute;
                        bottom: -6px;
                        left: 0;
                        width: 100%;
                        height: 6px;
                        background-size: auto 6px;
                        background-position: center top;
                        -webkit-transform: rotate(180deg);
                        transform: rotate(180deg);
                        -webkit-filter: brightness(0) invert(1);
                        filter: brightness(0) invert(1);
                    }

        page-pos-cashier .page-wrapper .panel-cashier .row .col-tab-info .col-body {
            background-color: #f6f8fc;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
        }

            page-pos-cashier .page-wrapper .panel-cashier .row .col-tab-info .col-body .store-logo {
                margin: auto;
                padding: 1rem;
            }

                page-pos-cashier .page-wrapper .panel-cashier .row .col-tab-info .col-body .store-logo .logo-container {
                    width: auto;
                    height: 100%;
                    max-width: 300px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    margin: 0 auto;
                }

                    page-pos-cashier .page-wrapper .panel-cashier .row .col-tab-info .col-body .store-logo .logo-container img {
                        -webkit-filter: brightness(0);
                        filter: brightness(0);
                        opacity: 0.15;
                    }

        page-pos-cashier .page-wrapper .panel-cashier .row .col-tab-info .col-footer {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 100px;
            -ms-flex: 0 0 100px;
            flex: 0 0 100px;
        }

            page-pos-cashier .page-wrapper .panel-cashier .row .col-tab-info .col-footer .bg-carbonDK {
                background-color: #212121;
            }

page-pos-delivery .page-wrapper {
    width: calc(200% - 300px);
    height: 100%;
    overflow-x: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    background-color: #eaf0f3;
}

    page-pos-delivery .page-wrapper .panel-tab {
        width: 100vw;
        height: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

        page-pos-delivery .page-wrapper .panel-tab .col-productos {
            width: calc(100% - 300px);
            height: 100%;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
        }

            page-pos-delivery .page-wrapper .panel-tab .col-productos .categories-container {
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 50px;
                -ms-flex: 0 0 50px;
                flex: 0 0 50px;
                z-index: 1;
                -webkit-box-shadow: 0 2px 6px 0px rgba(0, 0, 0, 0.1);
                box-shadow: 0 2px 6px 0px rgba(0, 0, 0, 0.1);
            }

                page-pos-delivery .page-wrapper .panel-tab .col-productos .categories-container .categories {
                    height: 50px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    background-color: #00d45a;
                    padding: 0.5rem;
                    margin: 0;
                    overflow-y: hidden;
                    overflow-x: auto;
                }

                    page-pos-delivery .page-wrapper .panel-tab .col-productos .categories-container .categories .category-item {
                        padding: 0.5rem 1rem;
                        margin-right: 0.5rem;
                        border-radius: 1rem;
                        font-size: 16px;
                        cursor: pointer;
                        -webkit-transition: all 0.3s ease;
                        transition: all 0.3s ease;
                        white-space: nowrap;
                        color: #FFF;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-delivery .page-wrapper .panel-tab .col-productos .categories-container .categories .category-item.active, page-pos-delivery .page-wrapper .panel-tab .col-productos .categories-container .categories .category-item:hover {
                            color: #212121;
                            background-color: #FFF;
                            -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
                            box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
                        }

            page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container {
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 46px;
                -ms-flex: 0 0 46px;
                flex: 0 0 46px;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                z-index: 9;
                position: relative;
                background-color: white;
            }

                page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .search-icon {
                    position: absolute;
                    top: 0;
                    left: 0;
                    z-index: 1;
                    width: 46px;
                    height: 46px;
                    display: -webkit-inline-box;
                    display: -webkit-inline-flex;
                    display: -ms-inline-flexbox;
                    display: inline-flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    font-size: 20px;
                    opacity: 0.6;
                }

                page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .form-control {
                    height: 46px;
                    border: transparent;
                    border-radius: 0;
                    text-indent: 34px;
                    font-size: 16px;
                    font-weight: 500;
                    background-color: rgba(0, 0, 0, 0.03);
                }

                    page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .form-control::-webkit-input-placeholder {
                        font-style: italic;
                    }

                    page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .form-control::-moz-placeholder {
                        font-style: italic;
                    }

                    page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .form-control::-ms-input-placeholder {
                        font-style: italic;
                    }

                    page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .form-control::placeholder {
                        font-style: italic;
                    }

                    page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .form-control:focus {
                        outline: none;
                        -webkit-box-shadow: none;
                        box-shadow: none;
                    }

                page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .btn {
                    width: 36px;
                    height: 36px;
                    margin-right: 0.5rem;
                    padding: 0;
                    -webkit-box-shadow: none;
                    box-shadow: none;
                    font-size: 15px;
                    -webkit-transition: background-color 0.3s ease;
                    transition: background-color 0.3s ease;
                }

                    page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .btn i {
                        font-size: 20px;
                    }

                        page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .btn i.lg {
                            font-size: 24px;
                        }

                page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .price-lists-container {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 320px;
                    -ms-flex: 0 0 320px;
                    flex: 0 0 320px;
                    padding: 0 0.5rem;
                    height: 46px;
                    padding-left: 1.5rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    background-color: #eaf0f3;
                }

                    page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .price-lists-container .mat-form-control {
                        -webkit-box-flex: 1;
                        -webkit-flex: 1;
                        -ms-flex: 1;
                        flex: 1;
                        font-weight: 700;
                    }

                        page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex {
                            margin: 1px 0 -1px;
                            border-color: transparent !important;
                            -webkit-box-shadow: none !important;
                            box-shadow: none !important;
                        }

                            page-pos-delivery .page-wrapper .panel-tab .col-productos .filter-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
                                background-color: #eaf0f3;
                            }

            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container {
                height: calc(100% - 92px);
                overflow-y: auto;
                padding: 0 2rem 2rem;
                z-index: 0;
            }

@media (min-width: 1680px) {
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .col-xl-3 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 16.666667%;
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }
}

page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item {
    margin: 16px auto 0;
    border-radius: 1rem;
}

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-photo {
        width: 100%;
        padding-top: 50%;
        max-height: 380px;
        position: relative;
        border-radius: 1rem;
        background-color: white;
        -webkit-box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.35);
        box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.35);
        background: -webkit-gradient(linear, left top, right bottom, from(#bdbdbd), to(#9a9a9a));
        background: linear-gradient(to bottom right, #bdbdbd, #9a9a9a);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        z-index: 99;
    }

        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-photo span {
            padding-top: 4px;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            text-transform: uppercase;
            color: #FFF;
            text-align: center;
            font-weight: 700;
            font-size: 16px;
            line-height: 20px;
            letter-spacing: 1px;
            border-top-left-radius: 0.5rem;
            border-top-right-radius: 0.5rem;
            z-index: 1;
        }

@media (min-width: 1650px) {
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-photo span {
        font-size: 18px;
        line-height: 22px;
    }
}

page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-photo .store-logo {
    width: 80px;
    height: 80px;
    position: absolute;
    bottom: -10px;
    right: -10px;
    background-image: url("https://webapp.crol.mx/pos/assets/imgs/logo.png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.1;
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
    z-index: 0;
}

page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info {
    padding: 1rem;
    position: relative;
    background-color: #FFF;
    border-radius: 0 0 0.5rem 0.5rem;
}

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .name,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .category,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .price {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        font-size: 16px;
        font-weight: 600;
        margin: 0;
    }

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .name {
        height: 40px;
        margin-bottom: 5px;
        overflow: hidden;
    }

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .category {
        font-size: 13px;
        font-style: italic;
        opacity: 0.45;
        padding-right: 2.5rem;
    }

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .price {
        font-size: 24px;
        font-weight: 800;
        margin-top: 0.5rem;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        color: #212121;
    }

        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .price small {
            color: #00be51;
            font-size: 60%;
            font-weight: 700;
            margin: 0.35rem 0.25rem 0 0;
        }

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .btn {
        width: 40px;
        height: 40px;
        position: absolute;
        bottom: 0.5rem;
        right: 0.5rem;
        padding: 0;
    }

        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .btn:hover {
            -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
        }

page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle,
page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras,
page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment {
    max-height: 298px;
    overflow-y: auto;
    -webkit-transition: height 0.15s linear;
    transition: height 0.15s linear;
}

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle.collapse,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras.collapse,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment.collapse {
        height: 0;
        display: block;
        overflow: hidden;
    }

        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle.collapse .list,
        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle.collapse .item-input,
        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras.collapse .list,
        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras.collapse .item-input,
        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment.collapse .list,
        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment.collapse .item-input {
            opacity: 0;
            -webkit-transition: opacity 0.15s ease;
            transition: opacity 0.15s ease;
        }

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list {
        margin: 0;
        border-top: 1px solid #e0e0e0;
        opacity: 1;
    }

        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item,
        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item,
        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item {
            padding-left: 0.5rem;
            min-height: 0;
        }

            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item:first-child, page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item:last-child,
            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item:first-child,
            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item:last-child,
            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item:first-child,
            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item:last-child {
                border: none;
            }

            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item .item-inner,
            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item .item-inner,
            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item .item-inner {
                padding-right: 0;
                border-color: #e0e0e0;
            }

                page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item .item-inner .input-wrapper .label,
                page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item .item-inner .input-wrapper .label,
                page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item .item-inner .input-wrapper .label {
                    font-size: 12px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                }

                    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item .item-inner .input-wrapper .label .name,
                    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item .item-inner .input-wrapper .label .name,
                    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item .item-inner .input-wrapper .label .name {
                        font-weight: 600;
                    }

            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item .checkbox,
            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item .checkbox,
            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item .checkbox {
                margin-right: 0.5rem;
            }

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .item-input,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .item-input,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .item-input {
        opacity: 1;
    }

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .text-input,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .text-input,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .text-input {
        width: 100%;
        font-size: 14px;
        margin: 0;
        padding: 0.5rem;
        border-radius: 0;
        border: 0 solid #e0e0e0;
        background-color: #f6f8fc;
        border-bottom: 1px solid #e0e0e0;
    }

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list-header,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list-header,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list-header {
        padding-left: 0 !important;
        margin-top: 0;
        margin-bottom: 0;
    }

        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list-header .item-inner .input-wrapper .label,
        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list-header .item-inner .input-wrapper .label,
        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list-header .item-inner .input-wrapper .label {
            margin: 0;
            padding: 0.5rem;
            background-color: #eaf0f3;
            color: #000;
            font-size: 10px !important;
            font-weight: 800;
            letter-spacing: 2px;
            text-transform: uppercase !important;
            border-bottom: 1px solid #e0e0e0;
        }

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .extras-filter .text-input,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .extras-filter .text-input,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .extras-filter .text-input {
        border-width: 0 0 1px 0;
    }

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .item-textarea,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .item-textarea,
    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .item-textarea {
        padding-left: 0 !important;
    }

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .text-input {
        border-bottom: none;
        height: 150px;
        resize: none;
    }

page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    border-radius: 0 0 0.5rem 0.5rem;
}

    page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn {
        height: unset;
        border-radius: 0;
        width: 100%;
        -webkit-box-flex: 1 1 100%;
        -webkit-flex-grow: 1 1 100%;
        -ms-flex-positive: 1 1 100%;
        flex-grow: 1 1 100%;
        padding: 0.75rem 1rem;
        border-top: 1px solid #e0e0e0;
        border-right: 1px solid #e0e0e0;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn > i {
            font-size: 22px;
            margin-right: 0;
            -webkit-transition: color 0.6s ease;
            transition: color 0.6s ease;
        }

        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn > span {
            display: none;
        }

        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn.btn-default {
            background-color: transparent !important;
            border-color: #e0e0e0 !important;
            color: #333 !important;
        }

            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn.btn-default:focus, page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn.btn-default:hover, page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn.btn-default:active {
                color: initial !important;
            }

            page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn.btn-default.active {
                color: initial !important;
                border-top-color: transparent !important;
                border-bottom-left-radius: 0.5rem;
                border-bottom-right-radius: 0.5rem;
            }

                page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn.btn-default.active i {
                    color: #00d45a;
                }

        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn:first-child {
            border-bottom-left-radius: 0.5rem;
        }

        page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn:last-child {
            border-right: none;
            border-bottom-right-radius: 0.5rem;
        }

page-pos-delivery .page-wrapper .panel-tab .col-productos .products-container .product-item:hover {
    -webkit-transform: none;
    transform: none;
    -webkit-box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);
}

page-pos-delivery .page-wrapper .panel-tab .col-tab {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 300px;
    -ms-flex: 0 0 300px;
    flex: 0 0 300px;
    max-width: 300px;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
    z-index: 10;
}

    page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-header {
        background-color: white;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 46px;
        -ms-flex: 0 0 46px;
        flex: 0 0 46px;
    }

        page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-header .client-container {
            height: 46px;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
            -webkit-flex-flow: row;
            -ms-flex-flow: row;
            flex-flow: row;
            background-color: #1e88e5;
            cursor: pointer;
            color: #FFF;
            -webkit-transition: all 0.5s ease;
            transition: all 0.5s ease;
        }

            page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-header .client-container .info {
                width: 100%;
                max-width: calc(100% - 40px);
                padding: 0 0.5rem;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

                page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-header .client-container .info .photo {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 32px;
                    -ms-flex: 0 0 32px;
                    flex: 0 0 32px;
                    height: 32px;
                    background-size: cover;
                    background-position: center;
                    background-color: rgba(0, 0, 0, 0.15);
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    border-radius: 50%;
                    font-size: 26px;
                    display: none;
                }

                page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-header .client-container .info .name {
                    width: calc(100% - 0.5rem);
                    padding-left: 0.5rem;
                }

                    page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-header .client-container .info .name h4 {
                        width: 100%;
                        white-space: nowrap;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        font-size: 16px;
                        font-weight: 500;
                        margin: 0;
                    }

                    page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-header .client-container .info .name .phone {
                        font-size: 12px;
                        color: rgba(255, 255, 255, 0.85);
                        display: block;
                        margin-top: -3px;
                    }

            page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-header .client-container .action {
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 46px;
                -ms-flex: 0 0 46px;
                flex: 0 0 46px;
                padding: 0 0.5rem;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-flow: column;
                -ms-flex-flow: column;
                flex-flow: column;
                -webkit-justify-content: space-around;
                -ms-flex-pack: distribute;
                justify-content: space-around;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

                page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-header .client-container .action .btn {
                    color: #FFF;
                    width: 32px;
                    height: 32px;
                    font-size: 26px;
                }

            page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-header .client-container.selected {
                background-color: #00be51;
                color: #fff;
            }

    page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        background-color: #FFF;
        margin: 0;
        max-height: calc(100% - 138px);
        overflow-y: auto;
    }

        page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .name {
            font-size: 16px;
            font-weight: 700;
            white-space: normal;
            margin: 0 0 1rem;
            padding-right: 1rem;
        }

        page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .discount-icon {
            position: absolute;
            top: 1rem;
            right: 1rem;
            color: #ffa000;
        }

        page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .info {
            font-size: 12px;
            margin-top: 0.25rem;
            margin-bottom: 0.5rem;
        }

            page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .info label {
                font-weight: 600;
                display: block;
                margin-bottom: 2px;
            }

            page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .info .extras {
                display: block;
                line-height: 14px;
                white-space: normal;
                margin-bottom: 0.25rem;
            }

                page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .info .extras span {
                    display: inline-block;
                    margin-right: 10px;
                }

            page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .info .comment {
                display: block;
                line-height: 14px;
                white-space: normal;
            }

                page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .info .comment span {
                    display: inline-block;
                }

        page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .footer {
            font-size: 14px;
            font-weight: 500;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
        }

        page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-left,
        page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-right {
            width: auto;
        }

            page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-left .btn,
            page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-right .btn {
                padding: 0.25rem;
                width: 70px;
                border-radius: 0;
            }

                page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-left .btn i,
                page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-right .btn i {
                    color: #FFF;
                    margin-right: 0;
                }

                page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-left .btn span,
                page-pos-delivery .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-right .btn span {
                    font-size: 12px;
                    white-space: normal;
                }

    page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-footer {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 130px;
        -ms-flex: 0 0 130px;
        flex: 0 0 130px;
    }

        page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-footer .total-container .count-item,
        page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-footer .total-container .total-item {
            height: 42px;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 42px;
            -ms-flex: 0 0 42px;
            flex: 0 0 42px;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            background-color: #333;
            font-size: 18px;
            color: #FFF;
            padding: 0.5rem 2rem;
        }

            page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-footer .total-container .count-item p,
            page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-footer .total-container .total-item p {
                margin-bottom: 0;
            }

        page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-footer .total-container .total-item {
            font-size: 22px;
            background-color: #212121;
        }

            page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-footer .total-container .total-item .total {
                color: #00d45a;
                font-weight: 700;
            }

        page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-footer .action-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 46px;
            -ms-flex: 0 0 46px;
            flex: 0 0 46px;
        }

            page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-footer .action-container .btn {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                border-radius: 0;
                font-size: 18px;
                height: 46px;
            }

                page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-footer .action-container .btn i {
                    position: absolute;
                    right: 1rem;
                }

                page-pos-delivery .page-wrapper .panel-tab .col-tab .tab-footer .action-container .btn.btn-magenta {
                    background: -webkit-gradient(linear, right top, left bottom, color-stop(45%, #FD6C59), to(#e91e63));
                    background: linear-gradient(to bottom left, #FD6C59 45%, #e91e63);
                }

page-pos-delivery .page-wrapper .panel-pago {
    width: calc(100vw - 300px);
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

    page-pos-delivery .page-wrapper .panel-pago .col-tab-info,
    page-pos-delivery .page-wrapper .panel-pago .col-payments {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-flow: column;
        -ms-flex-flow: column;
        flex-flow: column;
        padding: 0;
    }

        page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-header,
        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-header {
            background-color: #00be51;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 46px;
            -ms-flex: 0 0 46px;
            flex: 0 0 46px;
            height: 46px;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
        }

            page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-header .title,
            page-pos-delivery .page-wrapper .panel-pago .col-payments .col-header .title {
                width: 100%;
                font-size: 18px;
                font-weight: 700;
                letter-spacing: -0.5px;
                color: white;
                margin: 0;
                padding: 1rem;
                white-space: nowrap;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

            page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-header .toolbar,
            page-pos-delivery .page-wrapper .panel-pago .col-payments .col-header .toolbar {
                width: auto;
                -webkit-flex-shrink: 0;
                -ms-flex-negative: 0;
                flex-shrink: 0;
                display: -webkit-inline-box;
                display: -webkit-inline-flex;
                display: -ms-inline-flexbox;
                display: inline-flex;
                -webkit-box-pack: end;
                -webkit-justify-content: flex-end;
                -ms-flex-pack: end;
                justify-content: flex-end;
                padding: 0 0.5rem;
                background-color: #00d45a;
            }

                page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn,
                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn {
                    height: 36px;
                    padding: 0 0.5rem;
                    background-color: transparent !important;
                    border-color: transparent !important;
                    font-size: 15px;
                    -webkit-transition: background-color 0.3s ease;
                    transition: background-color 0.3s ease;
                }

                    page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn:hover,
                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn:hover {
                        background-color: rgba(0, 0, 0, 0.05) !important;
                    }

                    page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn i,
                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn i {
                        font-size: 20px;
                    }

                        page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn i.lg,
                        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn i.lg {
                            font-size: 24px;
                        }

                    page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn span,
                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn span {
                        margin-left: 0.5rem;
                    }

                page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .item,
                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-header .toolbar .item {
                    width: auto;
                    display: -webkit-inline-box;
                    display: -webkit-inline-flex;
                    display: -ms-inline-flexbox;
                    display: inline-flex;
                    background-color: transparent;
                    font-size: 14px;
                    color: #FFF;
                }

                    page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .item .item-inner,
                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-header .toolbar .item .item-inner {
                        padding-right: 0;
                    }

                        page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .item .item-inner .label,
                        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-header .toolbar .item .item-inner .label {
                            margin-right: 0;
                        }

        page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-body,
        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body {
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
            background-color: #eaf0f3;
        }

        page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .options-container,
        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .options-container {
            background-color: #212121;
        }

            page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item,
            page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                font-size: 16px;
                color: #FFF;
                padding: 0.7rem 1rem;
                height: 46px;
            }

                page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item .label,
                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item .label {
                    margin-bottom: 0;
                    white-space: nowrap;
                }

                page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item .control,
                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item .control {
                    margin-bottom: 0;
                    max-width: 160px;
                    padding: 2px 6px 1px;
                    border-radius: 0;
                    position: relative;
                }

                    page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item .control.input,
                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item .control.input {
                        background-color: #333;
                        border-color: #333;
                    }

                        page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item .control.input .text-input,
                        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item .control.input .text-input {
                            width: 100%;
                            margin: 4px 0 3px;
                            text-align: right;
                            color: #FFF;
                        }

                page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item select.control,
                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item select.control {
                    border-radius: 0.25rem;
                    color: #212121;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    cursor: pointer;
                    flex-grow: 1;
                    max-width: 60%;
                }

            page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals,
            page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals {
                background-color: #FFF;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-flow: column;
                -ms-flex-flow: column;
                flex-flow: column;
            }

                page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals .option-item,
                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals .option-item {
                    color: #212121;
                    max-height: none;
                    height: 46px;
                    position: relative;
                    border-bottom: 1px solid #eaf0f3;
                }

                    page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals .option-item .label,
                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals .option-item .label {
                        margin-bottom: 0;
                        color: #525252;
                        font-weight: 600;
                    }

                    page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals .option-item h4,
                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals .option-item h4 {
                        margin: 0;
                        font-weight: 700;
                    }

                        page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals .option-item h4 small,
                        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals .option-item h4 small {
                            font-size: 50%;
                        }

        page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container,
        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
        }

            page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .btn,
            page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .btn {
                padding: 0.5rem 1rem;
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                border-radius: 0;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                font-size: 18px;
                height: 46px;
            }

                page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .btn:not(.btn-icon),
                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .btn:not(.btn-icon) {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    border-radius: 0;
                    height: 46px;
                }

                    page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .btn:not(.btn-icon) i,
                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .btn:not(.btn-icon) i {
                        position: absolute;
                        right: 1rem;
                        margin: 0;
                    }

                page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .btn.btn-icon,
                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .btn.btn-icon {
                    width: 46px;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                }

            page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container,
            page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: horizontal;
                -webkit-box-direction: normal;
                -webkit-flex-flow: row;
                -ms-flex-flow: row;
                flex-flow: row;
                background-color: #1e88e5;
                -webkit-box-shadow: none;
                box-shadow: none;
                cursor: pointer;
                color: #FFF;
                border-radius: 0;
                -webkit-transition: all 0.5s ease;
                transition: all 0.5s ease;
                width: 100%;
                height: 46px;
                margin-bottom: 0;
            }

                page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info,
                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info {
                    width: 100%;
                    max-width: calc(100% - 40px);
                    padding: 1rem 0.5rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info .label,
                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info .label {
                        width: calc(100% - 0.5rem);
                        padding-left: 0.5rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info .label h4,
                        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info .label h4 {
                            white-space: nowrap;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            font-size: 16px;
                            font-weight: 500;
                            margin: 0;
                        }

                        page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info .label h3,
                        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info .label h3 {
                            font-size: 26px;
                            margin: 0;
                        }

                            page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info .label h3 small,
                            page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info .label h3 small {
                                font-size: 50%;
                                margin: 0 0.25rem;
                            }

                page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .action,
                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .action {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    padding: 1rem 0.5rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: column;
                    -ms-flex-flow: column;
                    flex-flow: column;
                    -webkit-justify-content: space-around;
                    -ms-flex-pack: distribute;
                    justify-content: space-around;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .action .btn,
                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .action .btn {
                        color: #FFF;
                        width: 32px;
                        height: 32px;
                        font-size: 26px;
                        padding: 0;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container.selected,
                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container.selected {
                    background-color: #00d45a;
                    color: #fff;
                }

                page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container:hover,
                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container:hover {
                    -webkit-transform: none;
                    transform: none;
                }

        page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-body {
            background-color: #FFF;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
        }

            page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-body .store-logo {
                margin: auto;
                padding: 1rem;
            }

                page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-body .store-logo .logo-container {
                    width: auto;
                    height: 100%;
                    max-width: 100%;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    margin: 0 auto;
                }

                    page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-body .store-logo .logo-container img {
                        -webkit-filter: brightness(0);
                        filter: brightness(0);
                        opacity: 0.15;
                        max-width: 90%;
                        margin: 0 auto;
                    }

        page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 97px;
            -ms-flex: 0 0 97px;
            flex: 0 0 97px;
        }

            page-pos-delivery .page-wrapper .panel-pago .col-tab-info .col-footer .bg-carbonDK {
                background-color: #212121;
            }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-header {
            background-color: #00d45a;
        }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body {
            background-color: #f6f8fc;
            height: 100%;
            overflow-y: auto;
        }

            page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .client-container {
                max-height: 50px;
                text-align: right;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 50px;
                -ms-flex: 0 0 50px;
                flex: 0 0 50px;
            }

                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .client-container h4 {
                    margin: 0;
                    font-size: 22px;
                    padding: 2rem 2rem 0.5rem 2rem;
                    border-bottom: 1px solid #e0e0e0;
                    display: inline-block;
                    position: relative;
                }

                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .client-container h4 strong {
                        font-weight: 700;
                    }

                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .client-container h4:after {
                        content: '';
                        position: absolute;
                        bottom: -1px;
                        left: 0;
                        width: 100%;
                        height: 2px;
                        background: -webkit-gradient(linear, left top, right top, from(#00d45a), to(#00be51));
                        background: linear-gradient(to right, #00d45a, #00be51);
                    }

            page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container {
                padding: 1rem;
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                height: calc(100% - 50px);
                overflow-y: auto;
                position: relative;
            }

                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .placeholder {
                    position: absolute;
                    top: 0;
                    right: 0;
                    bottom: 0;
                    left: 0;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .placeholder .item {
                        color: rgba(0, 0, 0, 0.5);
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .placeholder .item .icon {
                            font-size: 48px;
                        }

                        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .placeholder .item span {
                            max-width: 150px;
                            margin-left: 0.5rem;
                            font-size: 16px;
                            font-weight: 700;
                        }

                page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item {
                    -webkit-box-orient: horizontal;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: row;
                    -ms-flex-flow: row;
                    flex-flow: row;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    margin-bottom: 1rem;
                }

                    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body {
                        padding: 0.75rem 1rem 0.5rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                    }

@media (max-width: 1440px) {
    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-flow: column;
        -ms-flex-flow: column;
        flex-flow: column;
    }
}

page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .info .icon {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-flow: column;
        -ms-flex-flow: column;
        flex-flow: column;
        color: #757575;
        padding-right: 1rem;
    }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .info .icon i {
            font-size: 44px;
        }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .info .icon img {
            height: 64px;
            margin-bottom: -10px;
            -webkit-filter: saturate(0);
            filter: saturate(0);
            opacity: 0.6;
        }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .info .icon span {
            font-size: 8px;
            font-weight: 800;
            color: #bdbdbd;
            letter-spacing: 1px;
            text-align: center;
        }

    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .info h4 {
        color: #757575;
        font-size: 20px;
        font-weight: 700;
        margin: 0;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        padding-right: 1rem;
    }

page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .form-container {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-flow: column;
        -ms-flex-flow: column;
        flex-flow: column;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding-left: 1rem;
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
        -ms-flex-align: end;
        align-items: flex-end;
        min-width: 180px;
    }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .form-container h4 {
            margin: 0;
            font-weight: 700;
        }

            page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .form-container h4 small {
                font-size: 50%;
            }

    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input {
        padding: 4px 1rem;
        margin-bottom: 0.5rem;
        font-size: 14px;
        min-height: 0;
        height: 52px;
    }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input .item-inner {
            height: 46px;
            border: 1px solid #e0e0e0;
            border-radius: 1rem;
            padding: 0.75rem 1.5rem;
            -webkit-transition: background-color 0.3s ease;
            transition: background-color 0.3s ease;
        }

            page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input .item-inner .input-wrapper .label {
                position: absolute;
                top: 0;
                margin: 0;
                -webkit-transform: translate3d(0, 17px, 0);
                transform: translate3d(0, 17px, 0);
                background-color: white;
                padding: 0 0.5rem;
            }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus) .item-inner {
            border-color: #e02626;
            -webkit-box-shadow: 0 0 0 0.2rem rgba(224, 38, 38, 0.25);
            box-shadow: 0 0 0 0.2rem rgba(224, 38, 38, 0.25);
        }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus) .label[floating] {
            color: #e02626;
        }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.input-has-focus .item-inner {
            border-color: #00d45a;
            -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
            box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
        }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.input-has-focus .label[floating] {
            height: 14px;
            line-height: 14px;
            -webkit-transform: translate3d(0, -1px, 0) scale(0.8);
            transform: translate3d(0, -1px, 0) scale(0.8);
            color: #00d45a;
        }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.input-has-value .item-inner {
            -webkit-box-shadow: none;
            box-shadow: none;
        }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.input-has-value .label[floating] {
            height: 14px;
            line-height: 14px;
            -webkit-transform: translate3d(0, -1px, 0) scale(0.8);
            transform: translate3d(0, -1px, 0) scale(0.8);
        }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.item-input-disabled .item-inner {
            background-color: #eee;
        }

            page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.item-input-disabled .item-inner .label[floating] {
                background-color: #eee;
            }

        page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input:last-child {
            border-bottom: none;
            -webkit-box-shadow: none;
            box-shadow: none;
        }

page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-footer {
    padding: 1rem;
    padding-left: 0;
    border: none;
    background-color: transparent;
}

    page-pos-delivery .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-footer .btn {
        width: 32px;
        height: 32px;
        font-size: 28px;
    }

page-pos-delivery .page-wrapper.viewPagos {
    -webkit-transform: translate(calc(-50% + 150px), 0);
    transform: translate(calc(-50% + 150px), 0);
}

.select-popover .popover-content .list {
    margin: 0;
}

    .select-popover .popover-content .list .item {
        min-height: 50px;
    }

        .select-popover .popover-content .list .item .item-inner .input-wrapper .label {
            font-size: 16px;
            color: initial !important;
        }

        .select-popover .popover-content .list .item .item-inner .radio {
            opacity: 0;
        }

page-pos-laboratory .page-wrapper {
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}

    page-pos-laboratory .page-wrapper .col-appointments,
    page-pos-laboratory .page-wrapper .col-main,
    page-pos-laboratory .page-wrapper .col-tab,
    page-pos-laboratory .page-wrapper .col-payments {
        padding: 0;
        height: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

        page-pos-laboratory .page-wrapper .col-appointments .col-header,
        page-pos-laboratory .page-wrapper .col-main .col-header,
        page-pos-laboratory .page-wrapper .col-tab .col-header,
        page-pos-laboratory .page-wrapper .col-payments .col-header {
            background-color: #00d45a;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 46px;
            -ms-flex: 0 0 46px;
            flex: 0 0 46px;
            height: 46px;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
        }

            page-pos-laboratory .page-wrapper .col-appointments .col-header .title,
            page-pos-laboratory .page-wrapper .col-main .col-header .title,
            page-pos-laboratory .page-wrapper .col-tab .col-header .title,
            page-pos-laboratory .page-wrapper .col-payments .col-header .title {
                font-size: 18px;
                color: #FFF;
                margin: 0;
                padding: 1rem;
                padding-right: 0.3rem;
                white-space: nowrap;
            }

                page-pos-laboratory .page-wrapper .col-appointments .col-header .title i + span,
                page-pos-laboratory .page-wrapper .col-appointments .col-header .title span + i,
                page-pos-laboratory .page-wrapper .col-main .col-header .title i + span,
                page-pos-laboratory .page-wrapper .col-main .col-header .title span + i,
                page-pos-laboratory .page-wrapper .col-tab .col-header .title i + span,
                page-pos-laboratory .page-wrapper .col-tab .col-header .title span + i,
                page-pos-laboratory .page-wrapper .col-payments .col-header .title i + span,
                page-pos-laboratory .page-wrapper .col-payments .col-header .title span + i {
                    margin-left: 0.5rem;
                }

            page-pos-laboratory .page-wrapper .col-appointments .col-header .toolbar,
            page-pos-laboratory .page-wrapper .col-main .col-header .toolbar,
            page-pos-laboratory .page-wrapper .col-tab .col-header .toolbar,
            page-pos-laboratory .page-wrapper .col-payments .col-header .toolbar {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: end;
                -webkit-justify-content: flex-end;
                -ms-flex-pack: end;
                justify-content: flex-end;
                padding: 0 0.5rem;
                position: relative;
            }

                page-pos-laboratory .page-wrapper .col-appointments .col-header .toolbar i,
                page-pos-laboratory .page-wrapper .col-main .col-header .toolbar i,
                page-pos-laboratory .page-wrapper .col-tab .col-header .toolbar i,
                page-pos-laboratory .page-wrapper .col-payments .col-header .toolbar i {
                    color: #FFF;
                }

                page-pos-laboratory .page-wrapper .col-appointments .col-header .toolbar .btn,
                page-pos-laboratory .page-wrapper .col-main .col-header .toolbar .btn,
                page-pos-laboratory .page-wrapper .col-tab .col-header .toolbar .btn,
                page-pos-laboratory .page-wrapper .col-payments .col-header .toolbar .btn {
                    height: 36px;
                    padding: 0 0.5rem;
                    background-color: transparent !important;
                    border-color: transparent !important;
                    font-size: 15px;
                    -webkit-transition: background-color 0.3s ease;
                    transition: background-color 0.3s ease;
                }

                    page-pos-laboratory .page-wrapper .col-appointments .col-header .toolbar .btn:hover,
                    page-pos-laboratory .page-wrapper .col-main .col-header .toolbar .btn:hover,
                    page-pos-laboratory .page-wrapper .col-tab .col-header .toolbar .btn:hover,
                    page-pos-laboratory .page-wrapper .col-payments .col-header .toolbar .btn:hover {
                        background-color: rgba(0, 0, 0, 0.05) !important;
                    }

                    page-pos-laboratory .page-wrapper .col-appointments .col-header .toolbar .btn i,
                    page-pos-laboratory .page-wrapper .col-main .col-header .toolbar .btn i,
                    page-pos-laboratory .page-wrapper .col-tab .col-header .toolbar .btn i,
                    page-pos-laboratory .page-wrapper .col-payments .col-header .toolbar .btn i {
                        font-size: 16px;
                    }

                    page-pos-laboratory .page-wrapper .col-appointments .col-header .toolbar .btn span,
                    page-pos-laboratory .page-wrapper .col-main .col-header .toolbar .btn span,
                    page-pos-laboratory .page-wrapper .col-tab .col-header .toolbar .btn span,
                    page-pos-laboratory .page-wrapper .col-payments .col-header .toolbar .btn span {
                        margin: 0 0.5rem;
                    }

                page-pos-laboratory .page-wrapper .col-appointments .col-header .toolbar h4,
                page-pos-laboratory .page-wrapper .col-main .col-header .toolbar h4,
                page-pos-laboratory .page-wrapper .col-tab .col-header .toolbar h4,
                page-pos-laboratory .page-wrapper .col-payments .col-header .toolbar h4 {
                    color: #FFF;
                    margin: 0;
                    font-size: 18px;
                }

                page-pos-laboratory .page-wrapper .col-appointments .col-header .toolbar .form-control,
                page-pos-laboratory .page-wrapper .col-main .col-header .toolbar .form-control,
                page-pos-laboratory .page-wrapper .col-tab .col-header .toolbar .form-control,
                page-pos-laboratory .page-wrapper .col-payments .col-header .toolbar .form-control {
                    width: auto;
                    display: -webkit-inline-box;
                    display: -webkit-inline-flex;
                    display: -ms-inline-flexbox;
                    display: inline-flex;
                    background-color: transparent;
                    border: none;
                    font-size: 15px;
                    color: #FFF;
                    -webkit-box-shadow: none;
                    box-shadow: none;
                    text-align: right;
                    cursor: pointer;
                }

                    page-pos-laboratory .page-wrapper .col-appointments .col-header .toolbar .form-control .item-inner,
                    page-pos-laboratory .page-wrapper .col-main .col-header .toolbar .form-control .item-inner,
                    page-pos-laboratory .page-wrapper .col-tab .col-header .toolbar .form-control .item-inner,
                    page-pos-laboratory .page-wrapper .col-payments .col-header .toolbar .form-control .item-inner {
                        padding-right: 0;
                    }

                        page-pos-laboratory .page-wrapper .col-appointments .col-header .toolbar .form-control .item-inner .label,
                        page-pos-laboratory .page-wrapper .col-main .col-header .toolbar .form-control .item-inner .label,
                        page-pos-laboratory .page-wrapper .col-tab .col-header .toolbar .form-control .item-inner .label,
                        page-pos-laboratory .page-wrapper .col-payments .col-header .toolbar .form-control .item-inner .label {
                            margin-right: 0;
                        }

                page-pos-laboratory .page-wrapper .col-appointments .col-header .toolbar .datepicker-container,
                page-pos-laboratory .page-wrapper .col-main .col-header .toolbar .datepicker-container,
                page-pos-laboratory .page-wrapper .col-tab .col-header .toolbar .datepicker-container,
                page-pos-laboratory .page-wrapper .col-payments .col-header .toolbar .datepicker-container {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    width: 100%;
                }

                    page-pos-laboratory .page-wrapper .col-appointments .col-header .toolbar .datepicker-container .form-control,
                    page-pos-laboratory .page-wrapper .col-main .col-header .toolbar .datepicker-container .form-control,
                    page-pos-laboratory .page-wrapper .col-tab .col-header .toolbar .datepicker-container .form-control,
                    page-pos-laboratory .page-wrapper .col-payments .col-header .toolbar .datepicker-container .form-control {
                        width: calc(100% - 40px);
                        padding-right: 0;
                    }

                    page-pos-laboratory .page-wrapper .col-appointments .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button,
                    page-pos-laboratory .page-wrapper .col-main .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button,
                    page-pos-laboratory .page-wrapper .col-tab .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button,
                    page-pos-laboratory .page-wrapper .col-payments .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button {
                        color: white;
                        line-height: 46px;
                    }

        page-pos-laboratory .page-wrapper .col-appointments .col-body,
        page-pos-laboratory .page-wrapper .col-main .col-body,
        page-pos-laboratory .page-wrapper .col-tab .col-body,
        page-pos-laboratory .page-wrapper .col-payments .col-body {
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
            padding: 1rem;
            height: calc(100% - 46px);
            overflow-y: auto;
        }

        page-pos-laboratory .page-wrapper .col-appointments .col-footer .options-container,
        page-pos-laboratory .page-wrapper .col-main .col-footer .options-container,
        page-pos-laboratory .page-wrapper .col-tab .col-footer .options-container,
        page-pos-laboratory .page-wrapper .col-payments .col-footer .options-container {
            background-color: #333;
        }

            page-pos-laboratory .page-wrapper .col-appointments .col-footer .options-container .option-item,
            page-pos-laboratory .page-wrapper .col-main .col-footer .options-container .option-item,
            page-pos-laboratory .page-wrapper .col-tab .col-footer .options-container .option-item,
            page-pos-laboratory .page-wrapper .col-payments .col-footer .options-container .option-item {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                font-size: 16px;
                color: #FFF;
                padding: 0.7rem 1rem;
                height: 46px;
            }

                page-pos-laboratory .page-wrapper .col-appointments .col-footer .options-container .option-item .label,
                page-pos-laboratory .page-wrapper .col-main .col-footer .options-container .option-item .label,
                page-pos-laboratory .page-wrapper .col-tab .col-footer .options-container .option-item .label,
                page-pos-laboratory .page-wrapper .col-payments .col-footer .options-container .option-item .label {
                    margin-bottom: 0;
                    white-space: nowrap;
                }

                page-pos-laboratory .page-wrapper .col-appointments .col-footer .options-container .option-item .control,
                page-pos-laboratory .page-wrapper .col-main .col-footer .options-container .option-item .control,
                page-pos-laboratory .page-wrapper .col-tab .col-footer .options-container .option-item .control,
                page-pos-laboratory .page-wrapper .col-payments .col-footer .options-container .option-item .control {
                    margin-bottom: 0;
                    max-width: 160px;
                    padding: 2px 6px 1px;
                    border-radius: 0;
                    position: relative;
                }

                    page-pos-laboratory .page-wrapper .col-appointments .col-footer .options-container .option-item .control.input,
                    page-pos-laboratory .page-wrapper .col-main .col-footer .options-container .option-item .control.input,
                    page-pos-laboratory .page-wrapper .col-tab .col-footer .options-container .option-item .control.input,
                    page-pos-laboratory .page-wrapper .col-payments .col-footer .options-container .option-item .control.input {
                        background-color: #333;
                        border-color: #333;
                    }

                        page-pos-laboratory .page-wrapper .col-appointments .col-footer .options-container .option-item .control.input .text-input,
                        page-pos-laboratory .page-wrapper .col-main .col-footer .options-container .option-item .control.input .text-input,
                        page-pos-laboratory .page-wrapper .col-tab .col-footer .options-container .option-item .control.input .text-input,
                        page-pos-laboratory .page-wrapper .col-payments .col-footer .options-container .option-item .control.input .text-input {
                            width: 100%;
                            margin: 4px 0 3px;
                            text-align: right;
                            color: #FFF;
                        }

                page-pos-laboratory .page-wrapper .col-appointments .col-footer .options-container .option-item select.control,
                page-pos-laboratory .page-wrapper .col-main .col-footer .options-container .option-item select.control,
                page-pos-laboratory .page-wrapper .col-tab .col-footer .options-container .option-item select.control,
                page-pos-laboratory .page-wrapper .col-payments .col-footer .options-container .option-item select.control {
                    border-radius: 0.25rem;
                    color: #212121;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    cursor: pointer;
                    flex-grow: 1;
                    max-width: 60%;
                }

            page-pos-laboratory .page-wrapper .col-appointments .col-footer .options-container .totals,
            page-pos-laboratory .page-wrapper .col-main .col-footer .options-container .totals,
            page-pos-laboratory .page-wrapper .col-tab .col-footer .options-container .totals,
            page-pos-laboratory .page-wrapper .col-payments .col-footer .options-container .totals {
                background-color: #FFF;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-flow: column;
                -ms-flex-flow: column;
                flex-flow: column;
            }

                page-pos-laboratory .page-wrapper .col-appointments .col-footer .options-container .totals .option-item,
                page-pos-laboratory .page-wrapper .col-main .col-footer .options-container .totals .option-item,
                page-pos-laboratory .page-wrapper .col-tab .col-footer .options-container .totals .option-item,
                page-pos-laboratory .page-wrapper .col-payments .col-footer .options-container .totals .option-item {
                    color: #212121;
                    max-height: none;
                    height: 46px;
                    position: relative;
                    border-bottom: 1px solid #eaf0f3;
                }

                    page-pos-laboratory .page-wrapper .col-appointments .col-footer .options-container .totals .option-item .label,
                    page-pos-laboratory .page-wrapper .col-main .col-footer .options-container .totals .option-item .label,
                    page-pos-laboratory .page-wrapper .col-tab .col-footer .options-container .totals .option-item .label,
                    page-pos-laboratory .page-wrapper .col-payments .col-footer .options-container .totals .option-item .label {
                        margin-bottom: 0;
                        color: #525252;
                        font-weight: 600;
                    }

                    page-pos-laboratory .page-wrapper .col-appointments .col-footer .options-container .totals .option-item h4,
                    page-pos-laboratory .page-wrapper .col-main .col-footer .options-container .totals .option-item h4,
                    page-pos-laboratory .page-wrapper .col-tab .col-footer .options-container .totals .option-item h4,
                    page-pos-laboratory .page-wrapper .col-payments .col-footer .options-container .totals .option-item h4 {
                        margin: 0;
                        font-weight: 700;
                    }

                        page-pos-laboratory .page-wrapper .col-appointments .col-footer .options-container .totals .option-item h4 small,
                        page-pos-laboratory .page-wrapper .col-main .col-footer .options-container .totals .option-item h4 small,
                        page-pos-laboratory .page-wrapper .col-tab .col-footer .options-container .totals .option-item h4 small,
                        page-pos-laboratory .page-wrapper .col-payments .col-footer .options-container .totals .option-item h4 small {
                            font-size: 50%;
                        }

        page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container,
        page-pos-laboratory .page-wrapper .col-main .col-footer .action-container,
        page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container,
        page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
        }

            page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .btn,
            page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .btn,
            page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .btn,
            page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .btn {
                padding: 0.5rem 1rem;
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                border-radius: 0;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                font-size: 20px;
                height: 46px;
            }

                page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .btn:not(.btn-icon),
                page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .btn:not(.btn-icon),
                page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .btn:not(.btn-icon),
                page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .btn:not(.btn-icon) {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    border-radius: 0;
                    height: 46px;
                }

                    page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .btn:not(.btn-icon) i,
                    page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .btn:not(.btn-icon) i,
                    page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .btn:not(.btn-icon) i,
                    page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .btn:not(.btn-icon) i {
                        position: absolute;
                        right: 1rem;
                        margin: 0;
                    }

                page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .btn.btn-icon,
                page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .btn.btn-icon,
                page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .btn.btn-icon,
                page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .btn.btn-icon {
                    width: 46px;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                }

            page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .discount-container,
            page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .discount-container,
            page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .discount-container,
            page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .discount-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: horizontal;
                -webkit-box-direction: normal;
                -webkit-flex-flow: row;
                -ms-flex-flow: row;
                flex-flow: row;
                background-color: #1e88e5;
                -webkit-box-shadow: none;
                box-shadow: none;
                cursor: pointer;
                color: #FFF;
                border-radius: 0;
                -webkit-transition: all 0.5s ease;
                transition: all 0.5s ease;
                width: 100%;
                height: 46px;
                margin-bottom: 0;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

                page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .discount-container .info,
                page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .discount-container .info,
                page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .discount-container .info,
                page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .discount-container .info {
                    width: 100%;
                    max-width: calc(100% - 40px);
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .discount-container .info .label,
                    page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .discount-container .info .label,
                    page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .discount-container .info .label,
                    page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .discount-container .info .label {
                        width: calc(100% - 0.5rem);
                        padding-left: 0.5rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .discount-container .info .label h4,
                        page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .discount-container .info .label h4,
                        page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .discount-container .info .label h4,
                        page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .discount-container .info .label h4 {
                            white-space: nowrap;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            font-size: 16px;
                            font-weight: 500;
                            margin: 0;
                        }

                        page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .discount-container .info .label h3,
                        page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .discount-container .info .label h3,
                        page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .discount-container .info .label h3,
                        page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .discount-container .info .label h3 {
                            font-size: 26px;
                            margin: 0;
                        }

                            page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .discount-container .info .label h3 small,
                            page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .discount-container .info .label h3 small,
                            page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .discount-container .info .label h3 small,
                            page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .discount-container .info .label h3 small {
                                font-size: 50%;
                                margin: 0 0.25rem;
                            }

                page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .discount-container .action,
                page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .discount-container .action,
                page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .discount-container .action,
                page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .discount-container .action {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    height: 46px;
                    padding: 1rem 0.5rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: column;
                    -ms-flex-flow: column;
                    flex-flow: column;
                    -webkit-justify-content: space-around;
                    -ms-flex-pack: distribute;
                    justify-content: space-around;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .discount-container .action .btn,
                    page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .discount-container .action .btn,
                    page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .discount-container .action .btn,
                    page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .discount-container .action .btn {
                        color: #FFF;
                        width: 32px;
                        height: 32px;
                        font-size: 26px;
                        padding: 0;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .discount-container.selected,
                page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .discount-container.selected,
                page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .discount-container.selected,
                page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .discount-container.selected {
                    background-color: #00d45a;
                    color: #fff;
                }

                page-pos-laboratory .page-wrapper .col-appointments .col-footer .action-container .discount-container:hover,
                page-pos-laboratory .page-wrapper .col-main .col-footer .action-container .discount-container:hover,
                page-pos-laboratory .page-wrapper .col-tab .col-footer .action-container .discount-container:hover,
                page-pos-laboratory .page-wrapper .col-payments .col-footer .action-container .discount-container:hover {
                    -webkit-transform: none;
                    transform: none;
                }

        page-pos-laboratory .page-wrapper .col-appointments.col-appointments,
        page-pos-laboratory .page-wrapper .col-main.col-appointments,
        page-pos-laboratory .page-wrapper .col-tab.col-appointments,
        page-pos-laboratory .page-wrapper .col-payments.col-appointments {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 25%;
            -ms-flex: 0 0 25%;
            flex: 0 0 25%;
            max-width: 320px;
        }

            page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-header .title,
            page-pos-laboratory .page-wrapper .col-main.col-appointments .col-header .title,
            page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-header .title,
            page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-header .title {
                padding: 0 1rem;
            }

                page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-header .title .datepicker-container,
                page-pos-laboratory .page-wrapper .col-main.col-appointments .col-header .title .datepicker-container,
                page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-header .title .datepicker-container,
                page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-header .title .datepicker-container {
                    height: 46px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-header .title .datepicker-container span,
                    page-pos-laboratory .page-wrapper .col-main.col-appointments .col-header .title .datepicker-container span,
                    page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-header .title .datepicker-container span,
                    page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-header .title .datepicker-container span {
                        margin-right: 0.5rem;
                    }

                    page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-header .title .datepicker-container .form-control,
                    page-pos-laboratory .page-wrapper .col-main.col-appointments .col-header .title .datepicker-container .form-control,
                    page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-header .title .datepicker-container .form-control,
                    page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-header .title .datepicker-container .form-control {
                        display: -webkit-inline-box;
                        display: -webkit-inline-flex;
                        display: -ms-inline-flexbox;
                        display: inline-flex;
                        height: unset;
                        padding: 0;
                        background-color: transparent;
                        border: none;
                        color: white;
                    }

            page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body,
            page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body,
            page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body,
            page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                -ms-flex-direction: column;
                flex-direction: column;
                padding: 0;
                background-color: white;
            }

                page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .filter-container,
                page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .filter-container,
                page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .filter-container,
                page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .filter-container {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    z-index: 9;
                    position: relative;
                    border-bottom: 1px solid #eaf0f3;
                }

                    page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .filter-container .search-icon,
                    page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .filter-container .search-icon,
                    page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .filter-container .search-icon,
                    page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .filter-container .search-icon {
                        position: absolute;
                        top: 0;
                        left: 0;
                        z-index: 1;
                        width: 46px;
                        height: 46px;
                        display: -webkit-inline-box;
                        display: -webkit-inline-flex;
                        display: -ms-inline-flexbox;
                        display: inline-flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        font-size: 16px;
                        opacity: 0.6;
                    }

                    page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .filter-container .form-control,
                    page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .filter-container .form-control,
                    page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .filter-container .form-control,
                    page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .filter-container .form-control {
                        height: 46px;
                        border: transparent;
                        border-radius: 0;
                        padding-left: 46px;
                        font-size: 16px;
                    }

                        page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .filter-container .form-control::-webkit-input-placeholder,
                        page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .filter-container .form-control::-webkit-input-placeholder,
                        page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .filter-container .form-control::-webkit-input-placeholder,
                        page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .filter-container .form-control::-webkit-input-placeholder {
                            font-style: italic;
                        }

                        page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .filter-container .form-control::-moz-placeholder,
                        page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .filter-container .form-control::-moz-placeholder,
                        page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .filter-container .form-control::-moz-placeholder,
                        page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .filter-container .form-control::-moz-placeholder {
                            font-style: italic;
                        }

                        page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .filter-container .form-control::-ms-input-placeholder,
                        page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .filter-container .form-control::-ms-input-placeholder,
                        page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .filter-container .form-control::-ms-input-placeholder,
                        page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .filter-container .form-control::-ms-input-placeholder {
                            font-style: italic;
                        }

                        page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .filter-container .form-control::placeholder,
                        page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .filter-container .form-control::placeholder,
                        page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .filter-container .form-control::placeholder,
                        page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .filter-container .form-control::placeholder {
                            font-style: italic;
                        }

                        page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .filter-container .form-control:focus,
                        page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .filter-container .form-control:focus,
                        page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .filter-container .form-control:focus,
                        page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .filter-container .form-control:focus {
                            outline: none;
                            -webkit-box-shadow: none;
                            box-shadow: none;
                        }

                    page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .filter-container .btn,
                    page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .filter-container .btn,
                    page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .filter-container .btn,
                    page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .filter-container .btn {
                        height: 52px;
                        border-radius: 0;
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 52px;
                        -ms-flex: 0 0 52px;
                        flex: 0 0 52px;
                        padding: 0;
                    }

                        page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .filter-container .btn i,
                        page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .filter-container .btn i,
                        page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .filter-container .btn i,
                        page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .filter-container .btn i {
                            margin-right: 0;
                            margin-left: 0;
                            font-size: 18px;
                        }

                page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .appointments-container .appointment-item .info h2,
                page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .appointments-container .appointment-item .info h2,
                page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .appointments-container .appointment-item .info h2,
                page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .appointments-container .appointment-item .info h2 {
                    margin: 0 0 0.25rem;
                    font-size: 14px;
                    white-space: nowrap;
                }

                    page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .appointments-container .appointment-item .info h2 strong,
                    page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .appointments-container .appointment-item .info h2 strong,
                    page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .appointments-container .appointment-item .info h2 strong,
                    page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .appointments-container .appointment-item .info h2 strong {
                        width: 56px;
                        display: inline-block;
                    }

                    page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .appointments-container .appointment-item .info h2 .text-muted,
                    page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .appointments-container .appointment-item .info h2 .text-muted,
                    page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .appointments-container .appointment-item .info h2 .text-muted,
                    page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .appointments-container .appointment-item .info h2 .text-muted {
                        font-style: italic;
                    }

                page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .appointments-container .appointment-item .status,
                page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .appointments-container .appointment-item .status,
                page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .appointments-container .appointment-item .status,
                page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .appointments-container .appointment-item .status {
                    position: absolute;
                    right: 0;
                    top: 0;
                    height: 100%;
                    width: 18px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .appointments-container .appointment-item .status span,
                    page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .appointments-container .appointment-item .status span,
                    page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .appointments-container .appointment-item .status span,
                    page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .appointments-container .appointment-item .status span {
                        -webkit-transform: rotate(-90deg);
                        transform: rotate(-90deg);
                        display: block;
                        color: white;
                        font-size: 8px;
                        font-weight: 700;
                        text-transform: uppercase;
                    }

                    page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .appointments-container .appointment-item .status.cancelled,
                    page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .appointments-container .appointment-item .status.cancelled,
                    page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .appointments-container .appointment-item .status.cancelled,
                    page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .appointments-container .appointment-item .status.cancelled {
                        background: -webkit-gradient(linear, left top, left bottom, from(#f44336), to(#e02626));
                        background: linear-gradient(to bottom, #f44336, #e02626);
                    }

                    page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .appointments-container .appointment-item .status.current,
                    page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .appointments-container .appointment-item .status.current,
                    page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .appointments-container .appointment-item .status.current,
                    page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .appointments-container .appointment-item .status.current {
                        background: -webkit-gradient(linear, left top, left bottom, from(#66bb6a), to(#28b52e));
                        background: linear-gradient(to bottom, #66bb6a, #28b52e);
                    }

                    page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .appointments-container .appointment-item .status.completed,
                    page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .appointments-container .appointment-item .status.completed,
                    page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .appointments-container .appointment-item .status.completed,
                    page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .appointments-container .appointment-item .status.completed {
                        background: -webkit-gradient(linear, left top, left bottom, from(#2196f3), to(#1e88e5));
                        background: linear-gradient(to bottom, #2196f3, #1e88e5);
                    }

                page-pos-laboratory .page-wrapper .col-appointments.col-appointments .col-body .action-container,
                page-pos-laboratory .page-wrapper .col-main.col-appointments .col-body .action-container,
                page-pos-laboratory .page-wrapper .col-tab.col-appointments .col-body .action-container,
                page-pos-laboratory .page-wrapper .col-payments.col-appointments .col-body .action-container {
                    margin-top: auto;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                }

        page-pos-laboratory .page-wrapper .col-appointments.col-main,
        page-pos-laboratory .page-wrapper .col-main.col-main,
        page-pos-laboratory .page-wrapper .col-tab.col-main,
        page-pos-laboratory .page-wrapper .col-payments.col-main {
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
        }

            page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header,
            page-pos-laboratory .page-wrapper .col-main.col-main .col-header,
            page-pos-laboratory .page-wrapper .col-tab.col-main .col-header,
            page-pos-laboratory .page-wrapper .col-payments.col-main .col-header {
                width: 100%;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                -ms-flex-direction: column;
                flex-direction: column;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 92px;
                -ms-flex: 0 0 92px;
                flex: 0 0 92px;
                background-color: white;
            }

                page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container,
                page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container,
                page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container,
                page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    position: relative;
                }

                    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .search-icon i,
                    page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .search-icon i,
                    page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .search-icon i,
                    page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .search-icon i {
                        position: absolute;
                        top: 0;
                        left: 0;
                        color: rgba(0, 0, 0, 0.35);
                        width: 46px;
                        height: 46px;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .form-control,
                    page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .form-control,
                    page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .form-control,
                    page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .form-control {
                        border: none;
                        border-radius: 0;
                        background-color: rgba(0, 0, 0, 0.03);
                        height: 46px;
                        padding-left: 46px;
                        font-size: 16px;
                    }

                        page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .form-control::-webkit-input-placeholder,
                        page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .form-control::-webkit-input-placeholder,
                        page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .form-control::-webkit-input-placeholder,
                        page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .form-control::-webkit-input-placeholder {
                            font-style: italic;
                        }

                        page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .form-control::-moz-placeholder,
                        page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .form-control::-moz-placeholder,
                        page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .form-control::-moz-placeholder,
                        page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .form-control::-moz-placeholder {
                            font-style: italic;
                        }

                        page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .form-control::-ms-input-placeholder,
                        page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .form-control::-ms-input-placeholder,
                        page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .form-control::-ms-input-placeholder,
                        page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .form-control::-ms-input-placeholder {
                            font-style: italic;
                        }

                        page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .form-control::placeholder,
                        page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .form-control::placeholder,
                        page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .form-control::placeholder,
                        page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .form-control::placeholder {
                            font-style: italic;
                        }

                        page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .form-control:focus,
                        page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .form-control:focus,
                        page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .form-control:focus,
                        page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .form-control:focus {
                            -webkit-box-shadow: none;
                            box-shadow: none;
                        }

                    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .price-lists-container,
                    page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .price-lists-container,
                    page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .price-lists-container,
                    page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .price-lists-container {
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 320px;
                        -ms-flex: 0 0 320px;
                        flex: 0 0 320px;
                        padding: 0 0.5rem;
                        height: 46px;
                        padding-left: 1.5rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        background-color: #eaf0f3;
                    }

                        page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .price-lists-container .mat-form-control,
                        page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .price-lists-container .mat-form-control,
                        page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .price-lists-container .mat-form-control,
                        page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .price-lists-container .mat-form-control {
                            -webkit-box-flex: 1;
                            -webkit-flex: 1;
                            -ms-flex: 1;
                            flex: 1;
                            font-weight: 700;
                        }

                            page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex,
                            page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex,
                            page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex,
                            page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex {
                                margin: 1px 0 -1px;
                                border-color: transparent !important;
                                -webkit-box-shadow: none !important;
                                box-shadow: none !important;
                            }

                                page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label,
                                page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label,
                                page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label,
                                page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
                                    background-color: #eaf0f3;
                                }

                    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .update-products-container,
                    page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .update-products-container,
                    page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .update-products-container,
                    page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .update-products-container {
                        background-color: #00be51;
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 46px;
                        -ms-flex: 0 0 46px;
                        flex: 0 0 46px;
                        padding: 0.5rem;
                    }

                        page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .update-products-container .btn,
                        page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .update-products-container .btn,
                        page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .update-products-container .btn,
                        page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .update-products-container .btn {
                            padding: 0;
                            width: calc(46px - 1rem);
                            height: calc(46px - 1rem);
                            -webkit-box-shadow: 0 3px 5px #e59000;
                            box-shadow: 0 3px 5px #e59000;
                        }

                            page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .update-products-container .btn i,
                            page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .update-products-container .btn i,
                            page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .update-products-container .btn i,
                            page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .update-products-container .btn i {
                                -webkit-transition: -webkit-transform 6s;
                                transition: -webkit-transform 6s;
                                transition: transform 6s;
                                transition: transform 6s, -webkit-transform 6s;
                            }

                            page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .update-products-container .btn:hover,
                            page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .update-products-container .btn:hover,
                            page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .update-products-container .btn:hover,
                            page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .update-products-container .btn:hover {
                                background-color: #ffa000 !important;
                            }

                                page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .search-container .update-products-container .btn:hover i,
                                page-pos-laboratory .page-wrapper .col-main.col-main .col-header .search-container .update-products-container .btn:hover i,
                                page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .search-container .update-products-container .btn:hover i,
                                page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .search-container .update-products-container .btn:hover i {
                                    -webkit-transform: rotate(1080deg);
                                    transform: rotate(1080deg);
                                }

                page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .categories-container,
                page-pos-laboratory .page-wrapper .col-main.col-main .col-header .categories-container,
                page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .categories-container,
                page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .categories-container {
                    -webkit-box-flex: 1;
                    -webkit-flex: 1;
                    -ms-flex: 1;
                    flex: 1;
                    position: relative;
                    background-color: #00d45a;
                }

                    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .categories-container .categories,
                    page-pos-laboratory .page-wrapper .col-main.col-main .col-header .categories-container .categories,
                    page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .categories-container .categories,
                    page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .categories-container .categories {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        position: absolute;
                        top: 0.5rem;
                        bottom: 0;
                        left: 0.5rem;
                        right: 0.5rem;
                        overflow-x: auto;
                    }

                        page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .categories-container .categories li,
                        page-pos-laboratory .page-wrapper .col-main.col-main .col-header .categories-container .categories li,
                        page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .categories-container .categories li,
                        page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .categories-container .categories li {
                            margin-right: 0.5rem;
                        }

                            page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .categories-container .categories li button,
                            page-pos-laboratory .page-wrapper .col-main.col-main .col-header .categories-container .categories li button,
                            page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .categories-container .categories li button,
                            page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .categories-container .categories li button {
                                -webkit-box-shadow: none;
                                box-shadow: none;
                                font-size: 14px;
                                height: calc(46px - 1.25rem);
                            }

                                page-pos-laboratory .page-wrapper .col-appointments.col-main .col-header .categories-container .categories li button.active,
                                page-pos-laboratory .page-wrapper .col-main.col-main .col-header .categories-container .categories li button.active,
                                page-pos-laboratory .page-wrapper .col-tab.col-main .col-header .categories-container .categories li button.active,
                                page-pos-laboratory .page-wrapper .col-payments.col-main .col-header .categories-container .categories li button.active {
                                    color: #00d45a !important;
                                    background-color: white !important;
                                }

            page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body,
            page-pos-laboratory .page-wrapper .col-main.col-main .col-body,
            page-pos-laboratory .page-wrapper .col-tab.col-main .col-body,
            page-pos-laboratory .page-wrapper .col-payments.col-main .col-body {
                background-color: #eaf0f3;
                position: relative;
            }

@media screen and (min-width: 1600px) {
    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .col-xl-4,
    page-pos-laboratory .page-wrapper .col-main.col-main .col-body .col-xl-4,
    page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .col-xl-4,
    page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .col-xl-4 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 25%;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
}

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container,
page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container,
page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container,
page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container {
    color: white;
    padding: 2rem 1.5rem 1.5rem;
    margin-bottom: 1rem;
    background: -webkit-gradient(linear, left top, right bottom, from(#00d45a), to(#00be51));
    background: linear-gradient(to bottom right, #00d45a, #00be51);
    border-radius: 1.5rem;
    border-bottom-right-radius: 8rem;
    position: relative;
}

    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container:after,
    page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container:after,
    page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container:after,
    page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container:after {
        content: '';
        position: absolute;
        bottom: 0;
        right: 0;
        background-image: url(./../../assets/imgs/logo.png);
        background-position: 1rem 1rem;
        background-size: contain;
        background-repeat: no-repeat;
        width: 120px;
        height: 120px;
        -webkit-filter: brightness(0);
        filter: brightness(0);
        opacity: 0.05;
        border-bottom-right-radius: 8rem;
    }

    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container > *,
    page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container > *,
    page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container > *,
    page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container > * {
        position: relative;
        z-index: 1;
    }

    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .product-header,
    page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .product-header,
    page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .product-header,
    page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .product-header {
        min-height: 150px;
        margin-bottom: 1rem;
        padding-right: 1rem;
    }

@media screen and (max-width: 1599px) {
    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .product-header,
    page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .product-header,
    page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .product-header,
    page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .product-header {
        min-height: 120px;
    }
}

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .product-header .name,
page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .product-header .name,
page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .product-header .name,
page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .product-header .name {
    margin: 0;
    padding-right: 2rem;
    font-weight: 800;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}

@media screen and (max-width: 1599px) {
    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .product-header .name,
    page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .product-header .name,
    page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .product-header .name,
    page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .product-header .name {
        font-size: 16px;
    }
}

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .product-header .category,
page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .product-header .category,
page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .product-header .category,
page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .product-header .category {
    font-size: 12px;
    text-transform: uppercase;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .product-body .details,
page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .product-body .details,
page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .product-body .details,
page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .product-body .details {
    z-index: 1;
    display: none;
}

    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .product-body .details li,
    page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .product-body .details li,
    page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .product-body .details li,
    page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .product-body .details li {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        margin-bottom: 2px;
    }

        page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .product-body .details li label,
        page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .product-body .details li label,
        page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .product-body .details li label,
        page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .product-body .details li label {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 90px;
            -ms-flex: 0 0 90px;
            flex: 0 0 90px;
            display: block;
            margin: 3px 0 0;
            font-size: 12px;
            font-weight: 600;
            text-transform: uppercase;
        }

        page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .product-body .details li span,
        page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .product-body .details li span,
        page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .product-body .details li span,
        page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .product-body .details li span {
            color: rgba(255, 255, 255, 0.85);
            display: block;
            padding-left: 0.25rem;
        }

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .product-body .price,
page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .product-body .price,
page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .product-body .price,
page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .product-body .price {
    z-index: 1;
    margin: 1rem 0 0;
    padding-right: 4rem;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    font-size: 28px;
    font-weight: 800;
}

    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .product-body .price small,
    page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .product-body .price small,
    page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .product-body .price small,
    page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .product-body .price small {
        font-size: 50%;
        font-weight: 500;
    }

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .btn-info,
page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .btn-info,
page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .btn-info,
page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .btn-info {
    font-size: 12px;
    padding: 0;
    height: 24px;
    width: 24px;
    border-radius: 50%;
    background-color: transparent;
    border: 1px solid white;
    position: absolute;
    top: 1rem;
    right: 1rem;
    -webkit-transition: background-color 0.15s ease, -webkit-box-shadow 0.15s ease;
    transition: background-color 0.15s ease, -webkit-box-shadow 0.15s ease;
    transition: box-shadow 0.15s ease, background-color 0.15s ease;
    transition: box-shadow 0.15s ease, background-color 0.15s ease, -webkit-box-shadow 0.15s ease;
}

    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .btn-info:hover,
    page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .btn-info:hover,
    page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .btn-info:hover,
    page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .btn-info:hover {
        background-color: rgba(0, 0, 0, 0.05);
        -webkit-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
        box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    }

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .btn-add-product,
page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .btn-add-product,
page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .btn-add-product,
page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .btn-add-product {
    width: 56px;
    height: 56px;
    position: absolute;
    bottom: 0;
    right: 0;
    border-radius: 50%;
    font-size: 22px;
    -webkit-transition: -webkit-transform 0.6s ease, -webkit-box-shadow 0.15s ease;
    transition: -webkit-transform 0.6s ease, -webkit-box-shadow 0.15s ease;
    transition: transform 0.6s ease, box-shadow 0.15s ease;
    transition: transform 0.6s ease, box-shadow 0.15s ease, -webkit-transform 0.6s ease, -webkit-box-shadow 0.15s ease;
}

    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-body .product-container .btn-add-product:hover,
    page-pos-laboratory .page-wrapper .col-main.col-main .col-body .product-container .btn-add-product:hover,
    page-pos-laboratory .page-wrapper .col-tab.col-main .col-body .product-container .btn-add-product:hover,
    page-pos-laboratory .page-wrapper .col-payments.col-main .col-body .product-container .btn-add-product:hover {
        background-color: #ffa000 !important;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        -webkit-box-shadow: 0;
        box-shadow: 0;
    }

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-footer,
page-pos-laboratory .page-wrapper .col-main.col-main .col-footer,
page-pos-laboratory .page-wrapper .col-tab.col-main .col-footer,
page-pos-laboratory .page-wrapper .col-payments.col-main .col-footer {
    background-color: #eaf0f3;
    padding: 0;
}

    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-footer .appointment-detail-container,
    page-pos-laboratory .page-wrapper .col-main.col-main .col-footer .appointment-detail-container,
    page-pos-laboratory .page-wrapper .col-tab.col-main .col-footer .appointment-detail-container,
    page-pos-laboratory .page-wrapper .col-payments.col-main .col-footer .appointment-detail-container {
        border-radius: 0;
    }

        page-pos-laboratory .page-wrapper .col-appointments.col-main .col-footer .appointment-detail-container .appointment-detail,
        page-pos-laboratory .page-wrapper .col-main.col-main .col-footer .appointment-detail-container .appointment-detail,
        page-pos-laboratory .page-wrapper .col-tab.col-main .col-footer .appointment-detail-container .appointment-detail,
        page-pos-laboratory .page-wrapper .col-payments.col-main .col-footer .appointment-detail-container .appointment-detail {
            background-color: white;
            padding: 2rem 1rem 1rem 2rem;
            border-radius: 0;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-flex-wrap: wrap;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            -webkit-box-shadow: inset -6px 0px 18px -12px rgba(0, 0, 0, 0.2);
            box-shadow: inset -6px 0px 18px -12px rgba(0, 0, 0, 0.2);
        }

            page-pos-laboratory .page-wrapper .col-appointments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item,
            page-pos-laboratory .page-wrapper .col-main.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item,
            page-pos-laboratory .page-wrapper .col-tab.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item,
            page-pos-laboratory .page-wrapper .col-payments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item {
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 calc(50% - 1rem);
                -ms-flex: 0 0 calc(50% - 1rem);
                flex: 0 0 calc(50% - 1rem);
                margin: 0 1rem 1rem 0;
            }

@media screen and (min-width: 1600px) {
    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item,
    page-pos-laboratory .page-wrapper .col-main.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item,
    page-pos-laboratory .page-wrapper .col-tab.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item,
    page-pos-laboratory .page-wrapper .col-payments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 calc(25% - 1rem);
        -ms-flex: 0 0 calc(25% - 1rem);
        flex: 0 0 calc(25% - 1rem);
    }
}

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item label,
page-pos-laboratory .page-wrapper .col-main.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item label,
page-pos-laboratory .page-wrapper .col-tab.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item label,
page-pos-laboratory .page-wrapper .col-payments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item label {
    font-size: 12px;
    font-weight: 600;
    margin: 0;
    margin-left: 0.5rem;
}

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .form-control,
page-pos-laboratory .page-wrapper .col-main.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .form-control,
page-pos-laboratory .page-wrapper .col-tab.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .form-control,
page-pos-laboratory .page-wrapper .col-payments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .form-control {
    border: 1px solid #e0e0e0;
    padding: 0.75rem 1rem;
    height: unset;
    font-size: 14px;
}

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .btn-default,
page-pos-laboratory .page-wrapper .col-main.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .btn-default,
page-pos-laboratory .page-wrapper .col-tab.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .btn-default,
page-pos-laboratory .page-wrapper .col-payments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .btn-default {
    color: #525252 !important;
    background-color: #e0e0e0 !important;
}

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .mat-form-control .mat-input-flex,
page-pos-laboratory .page-wrapper .col-main.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .mat-form-control .mat-input-flex,
page-pos-laboratory .page-wrapper .col-tab.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .mat-form-control .mat-input-flex,
page-pos-laboratory .page-wrapper .col-payments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .mat-form-control .mat-input-flex {
    height: 40px;
    border-radius: 1rem;
}

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .input-group .input-group-append .btn[disabled],
page-pos-laboratory .page-wrapper .col-main.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .input-group .input-group-append .btn[disabled],
page-pos-laboratory .page-wrapper .col-tab.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .input-group .input-group-append .btn[disabled],
page-pos-laboratory .page-wrapper .col-payments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .input-group .input-group-append .btn[disabled] {
    opacity: 0.6 !important;
}

    page-pos-laboratory .page-wrapper .col-appointments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .input-group .input-group-append .btn[disabled] i,
    page-pos-laboratory .page-wrapper .col-main.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .input-group .input-group-append .btn[disabled] i,
    page-pos-laboratory .page-wrapper .col-tab.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .input-group .input-group-append .btn[disabled] i,
    page-pos-laboratory .page-wrapper .col-payments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .input-group .input-group-append .btn[disabled] i {
        color: #525252 !important;
    }

page-pos-laboratory .page-wrapper .col-appointments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .input-group .input-group-append .btn:not:first-child,
page-pos-laboratory .page-wrapper .col-main.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .input-group .input-group-append .btn:not:first-child,
page-pos-laboratory .page-wrapper .col-tab.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .input-group .input-group-append .btn:not:first-child,
page-pos-laboratory .page-wrapper .col-payments.col-main .col-footer .appointment-detail-container .appointment-detail .detail-item .input-group .input-group-append .btn:not:first-child {
    border-left: 1px solid rgba(0, 0, 0, 0.1);
}

page-pos-laboratory .page-wrapper .col-appointments.col-tab,
page-pos-laboratory .page-wrapper .col-main.col-tab,
page-pos-laboratory .page-wrapper .col-tab.col-tab,
page-pos-laboratory .page-wrapper .col-payments.col-tab {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 320px;
}

@media screen and (max-width: 1599px) {
    page-pos-laboratory .page-wrapper .col-appointments.col-tab,
    page-pos-laboratory .page-wrapper .col-main.col-tab,
    page-pos-laboratory .page-wrapper .col-tab.col-tab,
    page-pos-laboratory .page-wrapper .col-payments.col-tab {
        position: absolute;
        width: 300px;
        right: -300px;
        z-index: 999;
        -webkit-transform: translateX(0);
        transform: translateX(0);
        -webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.15s ease;
        transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.15s ease;
        transition: transform 0.3s ease, box-shadow 0.15s ease;
        transition: transform 0.3s ease, box-shadow 0.15s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.15s ease;
    }

        page-pos-laboratory .page-wrapper .col-appointments.col-tab.open,
        page-pos-laboratory .page-wrapper .col-main.col-tab.open,
        page-pos-laboratory .page-wrapper .col-tab.col-tab.open,
        page-pos-laboratory .page-wrapper .col-payments.col-tab.open {
            -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
            -webkit-box-shadow: 1px 0 24px rgba(0, 0, 0, 0.25);
            box-shadow: 1px 0 24px rgba(0, 0, 0, 0.25);
        }
}

page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-header,
page-pos-laboratory .page-wrapper .col-main.col-tab .col-header,
page-pos-laboratory .page-wrapper .col-tab.col-tab .col-header,
page-pos-laboratory .page-wrapper .col-payments.col-tab .col-header {
    background-color: #1e88e5 !important;
}

    page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-header .title,
    page-pos-laboratory .page-wrapper .col-main.col-tab .col-header .title,
    page-pos-laboratory .page-wrapper .col-tab.col-tab .col-header .title,
    page-pos-laboratory .page-wrapper .col-payments.col-tab .col-header .title {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-header .toolbar .btn,
    page-pos-laboratory .page-wrapper .col-main.col-tab .col-header .toolbar .btn,
    page-pos-laboratory .page-wrapper .col-tab.col-tab .col-header .toolbar .btn,
    page-pos-laboratory .page-wrapper .col-payments.col-tab .col-header .toolbar .btn {
        display: none;
    }

@media screen and (max-width: 1599px) {
    page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-header .toolbar .btn,
    page-pos-laboratory .page-wrapper .col-main.col-tab .col-header .toolbar .btn,
    page-pos-laboratory .page-wrapper .col-tab.col-tab .col-header .toolbar .btn,
    page-pos-laboratory .page-wrapper .col-payments.col-tab .col-header .toolbar .btn {
        display: -webkit-inline-box;
        display: -webkit-inline-flex;
        display: -ms-inline-flexbox;
        display: inline-flex;
        width: 36px;
    }
}

page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body,
page-pos-laboratory .page-wrapper .col-main.col-tab .col-body,
page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body,
page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body {
    background-color: #f6f8fc;
    height: unset;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 0;
}

    page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item,
    page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item,
    page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item,
    page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item {
        overflow: hidden;
    }

        page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .product-info,
        page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .product-info,
        page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .product-info,
        page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .product-info {
            border-bottom: 1px solid rgba(0, 0, 0, 0.1);
            -webkit-box-shadow: inset -6px 0px 18px -12px rgba(0, 0, 0, 0.15);
            box-shadow: inset -6px 0px 18px -12px rgba(0, 0, 0, 0.15);
            position: relative;
        }

            page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .product-info .item-inner,
            page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .product-info .item-inner,
            page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .product-info .item-inner,
            page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .product-info .item-inner {
                border-bottom: 0;
            }

            page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .product-info .name,
            page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .product-info .name,
            page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .product-info .name,
            page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .product-info .name {
                font-size: 16px;
                font-weight: 700;
                white-space: normal;
                margin: 0 0 1rem;
            }

            page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .product-info .discount-icon,
            page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .product-info .discount-icon,
            page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .product-info .discount-icon,
            page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .product-info .discount-icon {
                position: absolute;
                top: 1rem;
                right: 1rem;
                color: #ffa000;
            }

            page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .product-info .info,
            page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .product-info .info,
            page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .product-info .info,
            page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .product-info .info {
                font-size: 12px;
                margin-top: 0.25rem;
                margin-bottom: 0.5rem;
            }

                page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .product-info .info label,
                page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .product-info .info label,
                page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .product-info .info label,
                page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .product-info .info label {
                    font-weight: 600;
                    display: block;
                    margin-bottom: 2px;
                }

                page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .product-info .info .extras,
                page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .product-info .info .extras,
                page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .product-info .info .extras,
                page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .product-info .info .extras {
                    display: block;
                    line-height: 14px;
                    white-space: normal;
                    margin-bottom: 0.25rem;
                }

                    page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .product-info .info .extras span,
                    page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .product-info .info .extras span,
                    page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .product-info .info .extras span,
                    page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .product-info .info .extras span {
                        display: inline-block;
                        margin-right: 10px;
                    }

                page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .product-info .info .comment,
                page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .product-info .info .comment,
                page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .product-info .info .comment,
                page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .product-info .info .comment {
                    display: block;
                    line-height: 14px;
                    white-space: normal;
                }

                    page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .product-info .info .comment span,
                    page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .product-info .info .comment span,
                    page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .product-info .info .comment span,
                    page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .product-info .info .comment span {
                        display: inline-block;
                    }

            page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .product-info .footer,
            page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .product-info .footer,
            page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .product-info .footer,
            page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .product-info .footer {
                font-size: 14px;
                font-weight: 500;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
            }

        page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .item-options-left,
        page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .item-options-right,
        page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .item-options-left,
        page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .item-options-right,
        page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .item-options-left,
        page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .item-options-right,
        page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .item-options-left,
        page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .item-options-right {
            width: auto;
        }

            page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .item-options-left .btn,
            page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .item-options-right .btn,
            page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .item-options-left .btn,
            page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .item-options-right .btn,
            page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .item-options-left .btn,
            page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .item-options-right .btn,
            page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .item-options-left .btn,
            page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .item-options-right .btn {
                padding: 0.25rem;
                width: 70px;
                border-radius: 0;
            }

                page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .item-options-left .btn i,
                page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .item-options-right .btn i,
                page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .item-options-left .btn i,
                page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .item-options-right .btn i,
                page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .item-options-left .btn i,
                page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .item-options-right .btn i,
                page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .item-options-left .btn i,
                page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .item-options-right .btn i {
                    color: #FFF;
                    margin-right: 0;
                }

                page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .item-options-left .btn span,
                page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-body .products-container .product-item .item-options-right .btn span,
                page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .item-options-left .btn span,
                page-pos-laboratory .page-wrapper .col-main.col-tab .col-body .products-container .product-item .item-options-right .btn span,
                page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .item-options-left .btn span,
                page-pos-laboratory .page-wrapper .col-tab.col-tab .col-body .products-container .product-item .item-options-right .btn span,
                page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .item-options-left .btn span,
                page-pos-laboratory .page-wrapper .col-payments.col-tab .col-body .products-container .product-item .item-options-right .btn span {
                    font-size: 12px;
                    white-space: normal;
                }

page-pos-laboratory .page-wrapper .col-appointments.col-tab .col-footer,
page-pos-laboratory .page-wrapper .col-main.col-tab .col-footer,
page-pos-laboratory .page-wrapper .col-tab.col-tab .col-footer,
page-pos-laboratory .page-wrapper .col-payments.col-tab .col-footer {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 46px;
    -ms-flex: 0 0 46px;
    flex: 0 0 46px;
}

page-pos-laboratory .page-wrapper .col-appointments.col-payments,
page-pos-laboratory .page-wrapper .col-main.col-payments,
page-pos-laboratory .page-wrapper .col-tab.col-payments,
page-pos-laboratory .page-wrapper .col-payments.col-payments {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 320px;
    z-index: 2;
}

    page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-header .toolbar,
    page-pos-laboratory .page-wrapper .col-main.col-payments .col-header .toolbar,
    page-pos-laboratory .page-wrapper .col-tab.col-payments .col-header .toolbar,
    page-pos-laboratory .page-wrapper .col-payments.col-payments .col-header .toolbar {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

@media screen and (min-width: 1600px) {
    page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-header .toolbar .btn:first-child,
    page-pos-laboratory .page-wrapper .col-main.col-payments .col-header .toolbar .btn:first-child,
    page-pos-laboratory .page-wrapper .col-tab.col-payments .col-header .toolbar .btn:first-child,
    page-pos-laboratory .page-wrapper .col-payments.col-payments .col-header .toolbar .btn:first-child {
        display: none;
    }
}

page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-header .toolbar .btn .tab-counter,
page-pos-laboratory .page-wrapper .col-main.col-payments .col-header .toolbar .btn .tab-counter,
page-pos-laboratory .page-wrapper .col-tab.col-payments .col-header .toolbar .btn .tab-counter,
page-pos-laboratory .page-wrapper .col-payments.col-payments .col-header .toolbar .btn .tab-counter {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background-color: #ffa000;
    font-weight: 600;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.15);
    box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.15);
}

page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-body,
page-pos-laboratory .page-wrapper .col-main.col-payments .col-body,
page-pos-laboratory .page-wrapper .col-tab.col-payments .col-body,
page-pos-laboratory .page-wrapper .col-payments.col-payments .col-body {
    background-color: white;
    height: unset;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 0;
}

    page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-body .payments-container .payments .payment-item,
    page-pos-laboratory .page-wrapper .col-main.col-payments .col-body .payments-container .payments .payment-item,
    page-pos-laboratory .page-wrapper .col-tab.col-payments .col-body .payments-container .payments .payment-item,
    page-pos-laboratory .page-wrapper .col-payments.col-payments .col-body .payments-container .payments .payment-item {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        background-color: white;
        border-radius: 0;
        -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        margin-bottom: 0.5rem;
    }

        page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-body .payments-container .payments .payment-item .icon-container,
        page-pos-laboratory .page-wrapper .col-main.col-payments .col-body .payments-container .payments .payment-item .icon-container,
        page-pos-laboratory .page-wrapper .col-tab.col-payments .col-body .payments-container .payments .payment-item .icon-container,
        page-pos-laboratory .page-wrapper .col-payments.col-payments .col-body .payments-container .payments .payment-item .icon-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 52px;
            -ms-flex: 0 0 52px;
            flex: 0 0 52px;
            height: 80px;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: start;
            -webkit-align-items: flex-start;
            -ms-flex-align: start;
            align-items: flex-start;
            padding: 0.5rem;
        }

        page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-body .payments-container .payments .payment-item .info-container .detail,
        page-pos-laboratory .page-wrapper .col-main.col-payments .col-body .payments-container .payments .payment-item .info-container .detail,
        page-pos-laboratory .page-wrapper .col-tab.col-payments .col-body .payments-container .payments .payment-item .info-container .detail,
        page-pos-laboratory .page-wrapper .col-payments.col-payments .col-body .payments-container .payments .payment-item .info-container .detail {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
            padding: 1rem 0.5rem 0.5rem;
            border-bottom: 1px solid rgba(0, 0, 0, 0.1);
        }

            page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-body .payments-container .payments .payment-item .info-container .detail .name,
            page-pos-laboratory .page-wrapper .col-main.col-payments .col-body .payments-container .payments .payment-item .info-container .detail .name,
            page-pos-laboratory .page-wrapper .col-tab.col-payments .col-body .payments-container .payments .payment-item .info-container .detail .name,
            page-pos-laboratory .page-wrapper .col-payments.col-payments .col-body .payments-container .payments .payment-item .info-container .detail .name {
                font-weight: 700;
            }

            page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-body .payments-container .payments .payment-item .info-container .detail .btn-delete,
            page-pos-laboratory .page-wrapper .col-main.col-payments .col-body .payments-container .payments .payment-item .info-container .detail .btn-delete,
            page-pos-laboratory .page-wrapper .col-tab.col-payments .col-body .payments-container .payments .payment-item .info-container .detail .btn-delete,
            page-pos-laboratory .page-wrapper .col-payments.col-payments .col-body .payments-container .payments .payment-item .info-container .detail .btn-delete {
                color: #bdbdbd;
                width: 20px;
                height: 20px;
                padding: 0;
                border-radius: 50%;
            }

                page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-body .payments-container .payments .payment-item .info-container .detail .btn-delete:hover,
                page-pos-laboratory .page-wrapper .col-main.col-payments .col-body .payments-container .payments .payment-item .info-container .detail .btn-delete:hover,
                page-pos-laboratory .page-wrapper .col-tab.col-payments .col-body .payments-container .payments .payment-item .info-container .detail .btn-delete:hover,
                page-pos-laboratory .page-wrapper .col-payments.col-payments .col-body .payments-container .payments .payment-item .info-container .detail .btn-delete:hover {
                    color: #e02626;
                }

        page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs,
        page-pos-laboratory .page-wrapper .col-main.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs,
        page-pos-laboratory .page-wrapper .col-tab.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs,
        page-pos-laboratory .page-wrapper .col-payments.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: reverse;
            -webkit-flex-direction: row-reverse;
            -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
            padding: 0.5rem;
        }

            page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group,
            page-pos-laboratory .page-wrapper .col-main.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group,
            page-pos-laboratory .page-wrapper .col-tab.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group,
            page-pos-laboratory .page-wrapper .col-payments.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group {
                margin: 0;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 calc(50% - 1rem);
                -ms-flex: 0 0 calc(50% - 1rem);
                flex: 0 0 calc(50% - 1rem);
            }

                page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group label,
                page-pos-laboratory .page-wrapper .col-main.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group label,
                page-pos-laboratory .page-wrapper .col-tab.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group label,
                page-pos-laboratory .page-wrapper .col-payments.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group label {
                    font-size: 12px;
                    font-weight: 600;
                    margin: 0;
                }

                page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group .form-control,
                page-pos-laboratory .page-wrapper .col-main.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group .form-control,
                page-pos-laboratory .page-wrapper .col-tab.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group .form-control,
                page-pos-laboratory .page-wrapper .col-payments.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group .form-control {
                    border-width: 1px;
                    border-radius: 1rem;
                    font-size: 14px;
                    height: 28px;
                    padding: 0 0.75rem;
                }

                page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group h4,
                page-pos-laboratory .page-wrapper .col-main.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group h4,
                page-pos-laboratory .page-wrapper .col-tab.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group h4,
                page-pos-laboratory .page-wrapper .col-payments.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group h4 {
                    font-weight: 700;
                    margin: 0.25rem 0 0;
                }

                    page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group h4 small,
                    page-pos-laboratory .page-wrapper .col-main.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group h4 small,
                    page-pos-laboratory .page-wrapper .col-tab.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group h4 small,
                    page-pos-laboratory .page-wrapper .col-payments.col-payments .col-body .payments-container .payments .payment-item .info-container .inputs .form-group h4 small {
                        font-weight: 500;
                        font-size: 50%;
                        color: #00be51;
                    }

page-pos-laboratory .page-wrapper .col-appointments.col-payments .col-footer,
page-pos-laboratory .page-wrapper .col-main.col-payments .col-footer,
page-pos-laboratory .page-wrapper .col-tab.col-payments .col-footer,
page-pos-laboratory .page-wrapper .col-payments.col-payments .col-footer {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 276px;
    -ms-flex: 0 0 276px;
    flex: 0 0 276px;
}

.autocomplete-table {
    font-size: 14px;
}

    .autocomplete-table tr td {
        padding-right: 1rem;
    }

        .autocomplete-table tr td:nth-child(1) {
            width: 64px;
        }

        .autocomplete-table tr td:nth-child(2) {
            width: 140px;
        }

        .autocomplete-table tr td:nth-child(3) {
            width: 160px;
        }

        .autocomplete-table tr td:nth-child(4) {
            width: calc(100% - 64px - 140px - 160px - 70px);
        }

            .autocomplete-table tr td:nth-child(4) div {
                width: 280px;
                overflow: hidden;
                text-overflow: ellipsis;
            }

        .autocomplete-table tr td:nth-child(5) {
            width: 70px;
            border-radius: 0;
        }

.referenceAutocomplete {
    width: 750px;
}

page-pos-retail .page-wrapper {
    width: calc(200% - 300px);
    height: 100%;
    overflow-x: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    background-color: #eaf0f3;
}

    page-pos-retail .page-wrapper .panel-tab {
        width: 100vw;
        height: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

        page-pos-retail .page-wrapper .panel-tab .col-productos {
            width: calc(100% - 300px);
            height: 100%;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
        }

            page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container {
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 46px;
                -ms-flex: 0 0 46px;
                flex: 0 0 46px;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                z-index: 9;
                position: relative;
                background-color: white;
            }

                page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .search-icon {
                    position: absolute;
                    top: 0;
                    left: 0;
                    z-index: 1;
                    width: 46px;
                    height: 46px;
                    display: -webkit-inline-box;
                    display: -webkit-inline-flex;
                    display: -ms-inline-flexbox;
                    display: inline-flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    font-size: 20px;
                    opacity: 0.6;
                }

                page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .form-control {
                    height: 46px;
                    border: transparent;
                    border-radius: 0;
                    text-indent: 34px;
                    font-size: 16px;
                    font-weight: 500;
                    background-color: rgba(0, 0, 0, 0.03);
                }

                    page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .form-control::-webkit-input-placeholder {
                        font-style: italic;
                    }

                    page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .form-control::-moz-placeholder {
                        font-style: italic;
                    }

                    page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .form-control::-ms-input-placeholder {
                        font-style: italic;
                    }

                    page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .form-control::placeholder {
                        font-style: italic;
                    }

                    page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .form-control:focus {
                        outline: none;
                        -webkit-box-shadow: none;
                        box-shadow: none;
                    }

                page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .btn {
                    width: 36px;
                    height: 36px;
                    margin-right: 0.5rem;
                    padding: 0;
                    -webkit-box-shadow: none;
                    box-shadow: none;
                    font-size: 15px;
                    -webkit-transition: background-color 0.3s ease;
                    transition: background-color 0.3s ease;
                }

                    page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .btn i {
                        font-size: 20px;
                    }

                        page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .btn i.lg {
                            font-size: 24px;
                        }

                page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .price-lists-container {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 320px;
                    -ms-flex: 0 0 320px;
                    flex: 0 0 320px;
                    padding: 0 0.5rem;
                    height: 46px;
                    padding-left: 1.5rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    background-color: #eaf0f3;
                }

                    page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .price-lists-container .mat-form-control {
                        -webkit-box-flex: 1;
                        -webkit-flex: 1;
                        -ms-flex: 1;
                        flex: 1;
                        font-weight: 700;
                    }

                        page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex {
                            margin: 1px 0 -1px;
                            border-color: transparent !important;
                            -webkit-box-shadow: none !important;
                            box-shadow: none !important;
                        }

                            page-pos-retail .page-wrapper .panel-tab .col-productos .filter-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
                                background-color: #eaf0f3;
                            }

            page-pos-retail .page-wrapper .panel-tab .col-productos .categories-container {
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 50px;
                -ms-flex: 0 0 50px;
                flex: 0 0 50px;
                z-index: 1;
                -webkit-box-shadow: 0 2px 6px 0px rgba(0, 0, 0, 0.1);
                box-shadow: 0 2px 6px 0px rgba(0, 0, 0, 0.1);
            }

                page-pos-retail .page-wrapper .panel-tab .col-productos .categories-container .categories {
                    height: 50px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    background-color: #00d45a;
                    padding: 0.5rem;
                    margin: 0;
                    overflow-y: hidden;
                    overflow-x: auto;
                }

                    page-pos-retail .page-wrapper .panel-tab .col-productos .categories-container .categories .category-item {
                        padding: 0.5rem 1rem;
                        margin-right: 0.5rem;
                        border-radius: 1rem;
                        font-size: 16px;
                        cursor: pointer;
                        -webkit-transition: all 0.3s ease;
                        transition: all 0.3s ease;
                        white-space: nowrap;
                        color: #FFF;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-retail .page-wrapper .panel-tab .col-productos .categories-container .categories .category-item.active, page-pos-retail .page-wrapper .panel-tab .col-productos .categories-container .categories .category-item:hover {
                            color: #212121;
                            background-color: #FFF;
                            -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
                            box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
                        }

            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container {
                height: calc(100% - 92px);
                overflow-y: auto;
                padding: 0 2rem 2rem;
                z-index: 0;
            }

@media (min-width: 1680px) {
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .col-xl-3 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 16.666667%;
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }
}

page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item {
    margin: 16px auto 0;
    border-radius: 1rem;
}

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-photo {
        width: 100%;
        padding-top: 50%;
        max-height: 380px;
        position: relative;
        border-radius: 1rem;
        z-index: 99;
        height: 0;
        padding-top: 66%;
        background: -webkit-gradient(linear, left top, right bottom, from(#00d45a), to(#28b52e));
        background: linear-gradient(to bottom right, #00d45a, #28b52e);
        background-size: contain;
        background-position: center;
        -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    }

        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-photo span {
            padding-top: 4px;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            text-transform: uppercase;
            color: #FFF;
            text-align: center;
            font-weight: 700;
            font-size: 16px;
            line-height: 20px;
            letter-spacing: 1px;
            border-top-left-radius: 0.5rem;
            border-top-right-radius: 0.5rem;
            z-index: 1;
        }

@media (min-width: 1650px) {
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-photo span {
        font-size: 18px;
        line-height: 22px;
    }
}

page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-photo .store-logo {
    width: 80px;
    height: 80px;
    position: absolute;
    bottom: -10px;
    right: -10px;
    background-image: url("https://webapp.crol.mx/pos/assets/imgs/logo.png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.1;
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
    z-index: 0;
}

page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info {
    padding: 1rem;
    position: relative;
    background-color: #FFF;
    border-radius: 0 0 0.5rem 0.5rem;
}

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .name,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .category,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .price {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        font-size: 16px;
        font-weight: 600;
        margin: 0;
    }

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .name {
        height: 40px;
        margin-bottom: 5px;
        overflow: hidden;
    }

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .category {
        font-size: 13px;
        font-style: italic;
        color: #757575;
        padding-right: 2.5rem;
        margin-bottom: 0.5rem;
    }

        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .category strong {
            font-style: normal;
            color: #212121;
            font-weight: normal;
            margin-right: 0.5rem;
        }

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .price {
        font-size: 24px;
        font-weight: 800;
        margin-top: 0.75rem;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        color: #333;
    }

        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .price small {
            color: #00be51;
            font-size: 60%;
            font-weight: 700;
            margin: 0.35rem 0.25rem 0 0;
        }

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .btn {
        width: 40px;
        height: 40px;
        position: absolute;
        bottom: 0.5rem;
        right: 0.5rem;
        padding: 0;
    }

        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-info .btn:hover {
            -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
        }

page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle,
page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras,
page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment {
    max-height: 298px;
    overflow-y: auto;
    -webkit-transition: height 0.15s linear;
    transition: height 0.15s linear;
}

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle.collapse,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras.collapse,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment.collapse {
        height: 0;
        display: block;
        overflow: hidden;
    }

        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle.collapse .list,
        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle.collapse .item-input,
        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras.collapse .list,
        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras.collapse .item-input,
        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment.collapse .list,
        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment.collapse .item-input {
            opacity: 0;
            -webkit-transition: opacity 0.15s ease;
            transition: opacity 0.15s ease;
        }

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list {
        margin: 0;
        border-top: 1px solid #e0e0e0;
        opacity: 1;
    }

        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item,
        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item,
        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item {
            padding-left: 0.5rem;
            min-height: 0;
        }

            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item:first-child, page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item:last-child,
            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item:first-child,
            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item:last-child,
            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item:first-child,
            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item:last-child {
                border: none;
            }

            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item .item-inner,
            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item .item-inner,
            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item .item-inner {
                padding-right: 0;
                border-color: #e0e0e0;
            }

                page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item .item-inner .input-wrapper .label,
                page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item .item-inner .input-wrapper .label,
                page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item .item-inner .input-wrapper .label {
                    font-size: 12px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                }

                    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item .item-inner .input-wrapper .label .name,
                    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item .item-inner .input-wrapper .label .name,
                    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item .item-inner .input-wrapper .label .name {
                        font-weight: 600;
                    }

            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list .item .checkbox,
            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list .item .checkbox,
            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list .item .checkbox {
                margin-right: 0.5rem;
            }

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .item-input,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .item-input,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .item-input {
        opacity: 1;
    }

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .text-input,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .text-input,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .text-input {
        width: 100%;
        font-size: 14px;
        margin: 0;
        padding: 0.5rem;
        border-radius: 0;
        border: 0 solid #e0e0e0;
        background-color: #f6f8fc;
        border-bottom: 1px solid #e0e0e0;
    }

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list-header,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list-header,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list-header {
        padding-left: 0 !important;
        margin-top: 0;
        margin-bottom: 0;
    }

        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .list-header .item-inner .input-wrapper .label,
        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .list-header .item-inner .input-wrapper .label,
        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .list-header .item-inner .input-wrapper .label {
            margin: 0;
            padding: 0.5rem;
            background-color: #eaf0f3;
            color: #000;
            font-size: 10px !important;
            font-weight: 800;
            letter-spacing: 2px;
            text-transform: uppercase !important;
            border-bottom: 1px solid #e0e0e0;
        }

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .extras-filter .text-input,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .extras-filter .text-input,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .extras-filter .text-input {
        border-width: 0 0 1px 0;
    }

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-detalle .item-textarea,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-extras .item-textarea,
    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .item-textarea {
        padding-left: 0 !important;
    }

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .text-input {
        border-bottom: none;
        height: 150px;
        resize: none;
    }

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .description {
        overflow: visible;
        white-space: normal;
        font-size: 12px;
    }

        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-comment .description .text-input {
            height: auto;
        }

page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    border-radius: 0 0 0.5rem 0.5rem;
}

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn {
        height: unset;
        border-radius: 0;
        width: 100%;
        -webkit-box-flex: 1 1 100%;
        -webkit-flex-grow: 1 1 100%;
        -ms-flex-positive: 1 1 100%;
        flex-grow: 1 1 100%;
        padding: 0.75rem 1rem;
        border-top: 1px solid #e0e0e0;
        border-right: 1px solid #e0e0e0;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn > i {
            font-size: 22px;
            margin-right: 0;
            -webkit-transition: color 0.6s ease;
            transition: color 0.6s ease;
        }

        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn > span {
            display: none;
        }

        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn.btn-default {
            background-color: transparent !important;
            border-color: #e0e0e0 !important;
            color: #333 !important;
        }

            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn.btn-default:focus, page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn.btn-default:hover, page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn.btn-default:active {
                color: initial !important;
            }

            page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn.btn-default.active {
                color: initial !important;
                border-top-color: transparent !important;
                border-bottom-left-radius: 0.5rem;
                border-bottom-right-radius: 0.5rem;
            }

                page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn.btn-default.active i {
                    color: #00d45a;
                }

        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn:first-child {
            border-bottom-left-radius: 0.5rem;
        }

        page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item .product-buttons .btn:last-child {
            border-right: none;
            border-bottom-right-radius: 0.5rem;
        }

page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item:hover {
    -webkit-transform: none;
    transform: none;
    -webkit-box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);
}

page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item.is-retail .invisible-button {
    position: absolute;
    z-index: 99;
    width: 100%;
    top: 0;
    bottom: 37px;
    left: 0;
    right: 0;
    padding: 0;
    background-color: transparent !important;
}

page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item.is-retail .product-info {
    height: 130px;
}

    page-pos-retail .page-wrapper .panel-tab .col-productos .products-container .product-item.is-retail .product-info .price {
        position: absolute;
        bottom: 1rem;
        right: 1rem;
    }

page-pos-retail .page-wrapper .panel-tab .col-tab {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 300px;
    -ms-flex: 0 0 300px;
    flex: 0 0 300px;
    max-width: 300px;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
    z-index: 10;
}

    page-pos-retail .page-wrapper .panel-tab .col-tab .tab-header {
        background-color: white;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 46px;
        -ms-flex: 0 0 46px;
        flex: 0 0 46px;
    }

        page-pos-retail .page-wrapper .panel-tab .col-tab .tab-header .client-container {
            height: 46px;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
            -webkit-flex-flow: row;
            -ms-flex-flow: row;
            flex-flow: row;
            background-color: #1e88e5;
            cursor: pointer;
            color: #FFF;
            -webkit-transition: all 0.5s ease;
            transition: all 0.5s ease;
        }

            page-pos-retail .page-wrapper .panel-tab .col-tab .tab-header .client-container .info {
                width: 100%;
                max-width: calc(100% - 40px);
                padding: 0 0.5rem;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

                page-pos-retail .page-wrapper .panel-tab .col-tab .tab-header .client-container .info .photo {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 32px;
                    -ms-flex: 0 0 32px;
                    flex: 0 0 32px;
                    height: 32px;
                    background-size: cover;
                    background-position: center;
                    background-color: rgba(0, 0, 0, 0.15);
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    border-radius: 50%;
                    font-size: 26px;
                    display: none;
                }

                page-pos-retail .page-wrapper .panel-tab .col-tab .tab-header .client-container .info .name {
                    width: calc(100% - 0.5rem);
                    padding-left: 0.5rem;
                }

                    page-pos-retail .page-wrapper .panel-tab .col-tab .tab-header .client-container .info .name h4 {
                        width: 100%;
                        white-space: nowrap;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        font-size: 16px;
                        font-weight: 500;
                        margin: 0;
                    }

                    page-pos-retail .page-wrapper .panel-tab .col-tab .tab-header .client-container .info .name .phone {
                        font-size: 12px;
                        color: rgba(255, 255, 255, 0.85);
                        display: block;
                        margin-top: -3px;
                    }

            page-pos-retail .page-wrapper .panel-tab .col-tab .tab-header .client-container .action {
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 46px;
                -ms-flex: 0 0 46px;
                flex: 0 0 46px;
                padding: 0 0.5rem;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-flow: column;
                -ms-flex-flow: column;
                flex-flow: column;
                -webkit-justify-content: space-around;
                -ms-flex-pack: distribute;
                justify-content: space-around;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

                page-pos-retail .page-wrapper .panel-tab .col-tab .tab-header .client-container .action .btn {
                    color: #FFF;
                    width: 32px;
                    height: 32px;
                    font-size: 26px;
                }

            page-pos-retail .page-wrapper .panel-tab .col-tab .tab-header .client-container.selected {
                background-color: #00be51;
                color: #fff;
            }

    page-pos-retail .page-wrapper .panel-tab .col-tab .products-container {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        background-color: #FFF;
        margin: 0;
        max-height: calc(100% - 138px);
        overflow-y: auto;
    }

        page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .name {
            font-size: 16px;
            font-weight: 700;
            white-space: normal;
            margin: 0 0 1rem;
            padding-right: 1rem;
        }

        page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .discount-icon {
            position: absolute;
            top: 1rem;
            right: 1rem;
            color: #ffa000;
        }

        page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .info {
            font-size: 12px;
            margin-top: 0.25rem;
            margin-bottom: 0.5rem;
        }

            page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .info label {
                font-weight: 600;
                display: block;
                margin-bottom: 2px;
            }

            page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .info .extras {
                display: block;
                line-height: 14px;
                white-space: normal;
                margin-bottom: 0.25rem;
            }

                page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .info .extras span {
                    display: inline-block;
                    margin-right: 10px;
                }

            page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .info .comment {
                display: block;
                line-height: 14px;
                white-space: normal;
            }

                page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .info .comment span {
                    display: inline-block;
                }

        page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .product-info .footer {
            font-size: 14px;
            font-weight: 500;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
        }

        page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-left,
        page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-right {
            width: auto;
        }

            page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-left .btn,
            page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-right .btn {
                padding: 0.25rem;
                width: 70px;
                border-radius: 0;
            }

                page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-left .btn i,
                page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-right .btn i {
                    color: #FFF;
                    margin-right: 0;
                }

                page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-left .btn span,
                page-pos-retail .page-wrapper .panel-tab .col-tab .products-container .product-item .item-options-right .btn span {
                    font-size: 12px;
                    white-space: normal;
                }

    page-pos-retail .page-wrapper .panel-tab .col-tab .tab-footer {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 130px;
        -ms-flex: 0 0 130px;
        flex: 0 0 130px;
    }

        page-pos-retail .page-wrapper .panel-tab .col-tab .tab-footer .total-container .count-item,
        page-pos-retail .page-wrapper .panel-tab .col-tab .tab-footer .total-container .total-item {
            height: 42px;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 42px;
            -ms-flex: 0 0 42px;
            flex: 0 0 42px;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            background-color: #333;
            font-size: 18px;
            color: #FFF;
            padding: 0.5rem 2rem;
        }

            page-pos-retail .page-wrapper .panel-tab .col-tab .tab-footer .total-container .count-item p,
            page-pos-retail .page-wrapper .panel-tab .col-tab .tab-footer .total-container .total-item p {
                margin-bottom: 0;
            }

        page-pos-retail .page-wrapper .panel-tab .col-tab .tab-footer .total-container .total-item {
            font-size: 22px;
            background-color: #212121;
        }

            page-pos-retail .page-wrapper .panel-tab .col-tab .tab-footer .total-container .total-item .total {
                color: #00d45a;
                font-weight: 700;
            }

        page-pos-retail .page-wrapper .panel-tab .col-tab .tab-footer .action-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 46px;
            -ms-flex: 0 0 46px;
            flex: 0 0 46px;
        }

            page-pos-retail .page-wrapper .panel-tab .col-tab .tab-footer .action-container .btn {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                border-radius: 0;
                font-size: 18px;
                height: 46px;
            }

                page-pos-retail .page-wrapper .panel-tab .col-tab .tab-footer .action-container .btn i {
                    position: absolute;
                    right: 1rem;
                }

                page-pos-retail .page-wrapper .panel-tab .col-tab .tab-footer .action-container .btn.btn-magenta {
                    background: -webkit-gradient(linear, right top, left bottom, color-stop(45%, #FD6C59), to(#e91e63));
                    background: linear-gradient(to bottom left, #FD6C59 45%, #e91e63);
                }

page-pos-retail .page-wrapper .panel-pago {
    width: calc(100vw - 300px);
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

    page-pos-retail .page-wrapper .panel-pago .col-tab-info,
    page-pos-retail .page-wrapper .panel-pago .col-payments {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-flow: column;
        -ms-flex-flow: column;
        flex-flow: column;
        padding: 0;
    }

        page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-header,
        page-pos-retail .page-wrapper .panel-pago .col-payments .col-header {
            background-color: #00be51;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 46px;
            -ms-flex: 0 0 46px;
            flex: 0 0 46px;
            height: 46px;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
        }

            page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-header .title,
            page-pos-retail .page-wrapper .panel-pago .col-payments .col-header .title {
                width: 100%;
                font-size: 18px;
                font-weight: 700;
                letter-spacing: -0.5px;
                color: white;
                margin: 0;
                padding: 1rem;
                white-space: nowrap;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

            page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-header .toolbar,
            page-pos-retail .page-wrapper .panel-pago .col-payments .col-header .toolbar {
                width: auto;
                -webkit-flex-shrink: 0;
                -ms-flex-negative: 0;
                flex-shrink: 0;
                display: -webkit-inline-box;
                display: -webkit-inline-flex;
                display: -ms-inline-flexbox;
                display: inline-flex;
                -webkit-box-pack: end;
                -webkit-justify-content: flex-end;
                -ms-flex-pack: end;
                justify-content: flex-end;
                padding: 0 0.5rem;
                background-color: #00d45a;
            }

                page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn,
                page-pos-retail .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn {
                    height: 36px;
                    padding: 0 0.5rem;
                    background-color: transparent !important;
                    border-color: transparent !important;
                    font-size: 15px;
                    -webkit-transition: background-color 0.3s ease;
                    transition: background-color 0.3s ease;
                }

                    page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn:hover,
                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn:hover {
                        background-color: rgba(0, 0, 0, 0.05) !important;
                    }

                    page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn i,
                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn i {
                        font-size: 20px;
                    }

                        page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn i.lg,
                        page-pos-retail .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn i.lg {
                            font-size: 24px;
                        }

                    page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn span,
                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn span {
                        margin-left: 0.5rem;
                    }

                page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .item,
                page-pos-retail .page-wrapper .panel-pago .col-payments .col-header .toolbar .item {
                    width: auto;
                    display: -webkit-inline-box;
                    display: -webkit-inline-flex;
                    display: -ms-inline-flexbox;
                    display: inline-flex;
                    background-color: transparent;
                    font-size: 14px;
                    color: #FFF;
                }

                    page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .item .item-inner,
                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-header .toolbar .item .item-inner {
                        padding-right: 0;
                    }

                        page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .item .item-inner .label,
                        page-pos-retail .page-wrapper .panel-pago .col-payments .col-header .toolbar .item .item-inner .label {
                            margin-right: 0;
                        }

        page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-body,
        page-pos-retail .page-wrapper .panel-pago .col-payments .col-body {
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
            background-color: #eaf0f3;
        }

        page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .options-container,
        page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .options-container {
            background-color: #212121;
        }

            page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item,
            page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                font-size: 16px;
                color: #FFF;
                padding: 0.7rem 1rem;
                height: 46px;
            }

                page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item .label,
                page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item .label {
                    margin-bottom: 0;
                    white-space: nowrap;
                }

                page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item .control,
                page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item .control {
                    margin-bottom: 0;
                    max-width: 160px;
                    padding: 2px 6px 1px;
                    border-radius: 0;
                    position: relative;
                }

                    page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item .control.input,
                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item .control.input {
                        background-color: #333;
                        border-color: #333;
                    }

                        page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item .control.input .text-input,
                        page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item .control.input .text-input {
                            width: 100%;
                            margin: 4px 0 3px;
                            text-align: right;
                            color: #FFF;
                        }

                page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item select.control,
                page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item select.control {
                    border-radius: 0.25rem;
                    color: #212121;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    cursor: pointer;
                    flex-grow: 1;
                    max-width: 60%;
                }

            page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals,
            page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals {
                background-color: #FFF;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-flow: column;
                -ms-flex-flow: column;
                flex-flow: column;
            }

                page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals .option-item,
                page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals .option-item {
                    color: #212121;
                    max-height: none;
                    height: 46px;
                    position: relative;
                    border-bottom: 1px solid #eaf0f3;
                }

                    page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals .option-item .label,
                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals .option-item .label {
                        margin-bottom: 0;
                        color: #525252;
                        font-weight: 600;
                    }

                    page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals .option-item h4,
                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals .option-item h4 {
                        margin: 0;
                        font-weight: 700;
                    }

                        page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals .option-item h4 small,
                        page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals .option-item h4 small {
                            font-size: 50%;
                        }

        page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container,
        page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
        }

            page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .btn,
            page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .btn {
                padding: 0.5rem 1rem;
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                border-radius: 0;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                font-size: 18px;
                height: 46px;
            }

                page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .btn:not(.btn-icon),
                page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .btn:not(.btn-icon) {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    border-radius: 0;
                    height: 46px;
                }

                    page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .btn:not(.btn-icon) i,
                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .btn:not(.btn-icon) i {
                        position: absolute;
                        right: 1rem;
                        margin: 0;
                    }

                page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .btn.btn-icon,
                page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .btn.btn-icon {
                    width: 46px;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                }

            page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container,
            page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: horizontal;
                -webkit-box-direction: normal;
                -webkit-flex-flow: row;
                -ms-flex-flow: row;
                flex-flow: row;
                background-color: #1e88e5;
                -webkit-box-shadow: none;
                box-shadow: none;
                cursor: pointer;
                color: #FFF;
                border-radius: 0;
                -webkit-transition: all 0.5s ease;
                transition: all 0.5s ease;
                width: 100%;
                height: 46px;
                margin-bottom: 0;
            }

                page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info,
                page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info {
                    width: 100%;
                    max-width: calc(100% - 40px);
                    padding: 1rem 0.5rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info .label,
                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info .label {
                        width: calc(100% - 0.5rem);
                        padding-left: 0.5rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info .label h4,
                        page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info .label h4 {
                            white-space: nowrap;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            font-size: 16px;
                            font-weight: 500;
                            margin: 0;
                        }

                        page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info .label h3,
                        page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info .label h3 {
                            font-size: 26px;
                            margin: 0;
                        }

                            page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info .label h3 small,
                            page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info .label h3 small {
                                font-size: 50%;
                                margin: 0 0.25rem;
                            }

                page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .action,
                page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .action {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    padding: 1rem 0.5rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: column;
                    -ms-flex-flow: column;
                    flex-flow: column;
                    -webkit-justify-content: space-around;
                    -ms-flex-pack: distribute;
                    justify-content: space-around;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .action .btn,
                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .action .btn {
                        color: #FFF;
                        width: 32px;
                        height: 32px;
                        font-size: 26px;
                        padding: 0;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container.selected,
                page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container.selected {
                    background-color: #00d45a;
                    color: #fff;
                }

                page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container:hover,
                page-pos-retail .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container:hover {
                    -webkit-transform: none;
                    transform: none;
                }

        page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-body {
            background-color: #FFF;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
        }

            page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-body .store-logo {
                margin: auto;
                padding: 1rem;
            }

                page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-body .store-logo .logo-container {
                    width: auto;
                    height: 100%;
                    max-width: 100%;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    margin: 0 auto;
                }

                    page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-body .store-logo .logo-container img {
                        -webkit-filter: brightness(0);
                        filter: brightness(0);
                        opacity: 0.15;
                        max-width: 90%;
                        margin: 0 auto;
                    }

        page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 97px;
            -ms-flex: 0 0 97px;
            flex: 0 0 97px;
        }

            page-pos-retail .page-wrapper .panel-pago .col-tab-info .col-footer .bg-carbonDK {
                background-color: #212121;
            }

        page-pos-retail .page-wrapper .panel-pago .col-payments .col-header {
            background-color: #00d45a;
        }

        page-pos-retail .page-wrapper .panel-pago .col-payments .col-body {
            background-color: #f6f8fc;
            height: 100%;
            overflow-y: auto;
        }

            page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .client-container {
                max-height: 50px;
                text-align: right;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 50px;
                -ms-flex: 0 0 50px;
                flex: 0 0 50px;
            }

                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .client-container h4 {
                    margin: 0;
                    font-size: 22px;
                    padding: 2rem 2rem 0.5rem 2rem;
                    border-bottom: 1px solid #e0e0e0;
                    display: inline-block;
                    position: relative;
                }

                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .client-container h4 strong {
                        font-weight: 700;
                    }

                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .client-container h4:after {
                        content: '';
                        position: absolute;
                        bottom: -1px;
                        left: 0;
                        width: 100%;
                        height: 2px;
                        background: -webkit-gradient(linear, left top, right top, from(#00d45a), to(#00be51));
                        background: linear-gradient(to right, #00d45a, #00be51);
                    }

            page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container {
                padding: 1rem;
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                height: calc(100% - 50px);
                overflow-y: auto;
                position: relative;
            }

                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .placeholder {
                    position: absolute;
                    top: 0;
                    right: 0;
                    bottom: 0;
                    left: 0;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .placeholder .item {
                        color: rgba(0, 0, 0, 0.5);
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .placeholder .item .icon {
                            font-size: 48px;
                        }

                        page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .placeholder .item span {
                            max-width: 150px;
                            margin-left: 0.5rem;
                            font-size: 16px;
                            font-weight: 700;
                        }

                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item {
                    -webkit-box-orient: horizontal;
                    -webkit-box-direction: normal;
                    -webkit-flex-direction: row;
                    -ms-flex-direction: row;
                    flex-direction: row;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    margin-bottom: 1rem;
                }

                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body {
                        padding: 0.75rem 1rem 0.5rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                    }

                        page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .info {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                        }

                            page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .info .icon {
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-orient: vertical;
                                -webkit-box-direction: normal;
                                -webkit-flex-flow: column;
                                -ms-flex-flow: column;
                                flex-flow: column;
                                color: #757575;
                                padding-right: 1rem;
                            }

                                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .info .icon i {
                                    font-size: 44px;
                                }

                                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .info .icon img {
                                    height: 48px;
                                    margin-bottom: -4px;
                                }

                                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .info .icon span {
                                    font-size: 8px;
                                    font-weight: 800;
                                    color: #bdbdbd;
                                    letter-spacing: 1px;
                                    text-align: center;
                                }

                            page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .info h4 {
                                color: #757575;
                                font-size: 20px;
                                font-weight: 700;
                                margin: 0;
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-align: center;
                                -webkit-align-items: center;
                                -ms-flex-align: center;
                                align-items: center;
                                padding-right: 1rem;
                            }

                        page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-pack: end;
                            -webkit-justify-content: flex-end;
                            -ms-flex-pack: end;
                            justify-content: flex-end;
                            -webkit-box-flex: 1;
                            -webkit-flex-grow: 1;
                            -ms-flex-positive: 1;
                            flex-grow: 1;
                        }

                            page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .form-container {
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-orient: vertical;
                                -webkit-box-direction: normal;
                                -webkit-flex-flow: column;
                                -ms-flex-flow: column;
                                flex-flow: column;
                                -webkit-box-pack: center;
                                -webkit-justify-content: center;
                                -ms-flex-pack: center;
                                justify-content: center;
                                padding-left: 1rem;
                                -webkit-box-align: end;
                                -webkit-align-items: flex-end;
                                -ms-flex-align: end;
                                align-items: flex-end;
                                min-width: 180px;
                            }

                                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .form-container h4 {
                                    margin: 0;
                                    font-weight: 700;
                                }

                                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .form-container h4 small {
                                        font-size: 50%;
                                    }

                            page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input {
                                padding: 4px 1rem;
                                margin-bottom: 0.5rem;
                                font-size: 14px;
                                min-height: 0;
                                height: 52px;
                            }

                                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input .item-inner {
                                    height: 46px;
                                    border: 1px solid #e0e0e0;
                                    border-radius: 1rem;
                                    padding: 0.75rem 1.5rem;
                                    -webkit-transition: background-color 0.3s ease;
                                    transition: background-color 0.3s ease;
                                }

                                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input .item-inner .input-wrapper .label {
                                        position: absolute;
                                        top: 0;
                                        margin: 0;
                                        -webkit-transform: translate3d(0, 17px, 0);
                                        transform: translate3d(0, 17px, 0);
                                        background-color: white;
                                        padding: 0 0.5rem;
                                    }

                                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus) .item-inner {
                                    border-color: #e02626;
                                    -webkit-box-shadow: 0 0 0 0.2rem rgba(224, 38, 38, 0.25);
                                    box-shadow: 0 0 0 0.2rem rgba(224, 38, 38, 0.25);
                                }

                                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus) .label[floating] {
                                    color: #e02626;
                                }

                                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.input-has-focus .item-inner {
                                    border-color: #00d45a;
                                    -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                                    box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                                }

                                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.input-has-focus .label[floating] {
                                    height: 14px;
                                    line-height: 14px;
                                    -webkit-transform: translate3d(0, -1px, 0) scale(0.8);
                                    transform: translate3d(0, -1px, 0) scale(0.8);
                                    color: #00d45a;
                                }

                                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.input-has-value .item-inner {
                                    -webkit-box-shadow: none;
                                    box-shadow: none;
                                }

                                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.input-has-value .label[floating] {
                                    height: 14px;
                                    line-height: 14px;
                                    -webkit-transform: translate3d(0, -1px, 0) scale(0.8);
                                    transform: translate3d(0, -1px, 0) scale(0.8);
                                }

                                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.item-input-disabled .item-inner {
                                    background-color: #eee;
                                }

                                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input.item-input-disabled .item-inner .label[floating] {
                                        background-color: #eee;
                                    }

                                page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-body .inputs .item.item-input:last-child {
                                    border-bottom: none;
                                    -webkit-box-shadow: none;
                                    box-shadow: none;
                                }

                    page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-footer {
                        padding: 1rem;
                        padding-left: 0;
                        border: none;
                        background-color: transparent;
                    }

                        page-pos-retail .page-wrapper .panel-pago .col-payments .col-body .payments-container .payment-item .card-footer .btn {
                            width: 32px;
                            height: 32px;
                            font-size: 28px;
                        }

page-pos-retail .page-wrapper.viewPagos {
    -webkit-transform: translate(calc(-50% + 150px), 0);
    transform: translate(calc(-50% + 150px), 0);
}

.select-popover .popover-content .list {
    margin: 0;
}

    .select-popover .popover-content .list .item {
        min-height: 50px;
    }

        .select-popover .popover-content .list .item .item-inner .input-wrapper .label {
            font-size: 16px;
            color: initial !important;
        }

        .select-popover .popover-content .list .item .item-inner .radio {
            opacity: 0;
        }

page-pos-waiter .page-wrapper {
    width: calc(300% - 300px) !important;
    overflow-x: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    background-color: #eaf0f3;
}

    page-pos-waiter .page-wrapper .panel-orders {
        width: 100vw;
        height: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }

        page-pos-waiter .page-wrapper .panel-orders .col-tables {
            width: calc(100% - 300px);
            height: 100%;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
            position: relative;
        }

            page-pos-waiter .page-wrapper .panel-orders .col-tables .areas-container {
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 50px;
                -ms-flex: 0 0 50px;
                flex: 0 0 50px;
                background-color: #00d45a;
                z-index: 1;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-shadow: 0 2px 6px 0px rgba(0, 0, 0, 0.1);
                box-shadow: 0 2px 6px 0px rgba(0, 0, 0, 0.1);
                overflow-y: hidden;
                overflow-x: scroll;
            }

                page-pos-waiter .page-wrapper .panel-orders .col-tables .areas-container .areas {
                    width: 100%;
                    height: 46px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    background-color: #00d45a;
                    padding: 0.5rem;
                    margin: 0;
                }

                    page-pos-waiter .page-wrapper .panel-orders .col-tables .areas-container .areas .area-item {
                        padding: 0.5rem 1rem;
                        margin-right: 0.5rem;
                        border-radius: 1rem;
                        font-size: 16px;
                        text-transform: capitalize;
                        cursor: pointer;
                        -webkit-transition: all 0.3s ease;
                        transition: all 0.3s ease;
                        white-space: nowrap;
                        color: #FFF;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tables .areas-container .areas .area-item.active, page-pos-waiter .page-wrapper .panel-orders .col-tables .areas-container .areas .area-item:hover {
                            color: #212121;
                            background-color: #FFF;
                            -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
                            box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
                        }

                page-pos-waiter .page-wrapper .panel-orders .col-tables .areas-container .btn {
                    width: 36px;
                    height: 36px;
                    margin-right: 0.5rem;
                    padding: 0;
                    -webkit-box-shadow: none;
                    box-shadow: none;
                    font-size: 15px;
                    -webkit-transition: background-color 0.3s ease;
                    transition: background-color 0.3s ease;
                }

                    page-pos-waiter .page-wrapper .panel-orders .col-tables .areas-container .btn i {
                        font-size: 20px;
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tables .areas-container .btn i.lg {
                            font-size: 24px;
                        }

            page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container {
                height: calc(100% - 94px);
                overflow-y: auto;
                padding: 0 23px 2rem;
                z-index: 0;
            }

                page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item {
                    margin: calc(2rem + 12px) auto 0;
                    padding: 0.5rem;
                    cursor: pointer;
                    border-radius: 1rem;
                }

                    page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-header {
                        padding: 1rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                        background-color: #FFF;
                        border-bottom: none;
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-header .id {
                            width: 48px;
                            height: 48px;
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-align: center;
                            -webkit-align-items: center;
                            -ms-flex-align: center;
                            align-items: center;
                            -webkit-box-pack: center;
                            -webkit-justify-content: center;
                            -ms-flex-pack: center;
                            justify-content: center;
                            border-radius: 50%;
                            position: absolute;
                            top: -12px;
                            left: 2rem;
                            -webkit-box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
                            box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
                            background-color: white;
                        }

                            page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-header .id span {
                                font-size: 24px;
                                font-weight: 800;
                            }

                        page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-header .group {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-align: center;
                            -webkit-align-items: center;
                            -ms-flex-align: center;
                            align-items: center;
                            color: #757575;
                        }

                    page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-body {
                        padding: 1rem 2rem;
                        padding-top: 5rem;
                        background-color: white;
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-body .item-info .card-title {
                            font-size: 24px;
                            font-weight: 800;
                            margin: 0;
                        }

                            page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-body .item-info .card-title::first-letter {
                                text-transform: uppercase;
                            }

                        page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-body .item-info .card-subtitle {
                            font-size: 12px;
                            font-weight: 600;
                            opacity: 0.8;
                            text-transform: uppercase;
                            margin: 0 0 0.5rem;
                        }

                    page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-footer {
                        padding: 1rem;
                        background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.03)), to(rgba(0, 0, 0, 0.1)));
                        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.03), rgba(0, 0, 0, 0.1));
                        border-radius: 0 0 1rem 1rem;
                        border: none;
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-footer .table-waiter {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-pack: justify;
                            -webkit-justify-content: space-between;
                            -ms-flex-pack: justify;
                            justify-content: space-between;
                            -webkit-box-align: center;
                            -webkit-align-items: center;
                            -ms-flex-align: center;
                            align-items: center;
                            height: 36px;
                        }

                            page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-footer .table-waiter .name {
                                padding-left: 1rem;
                                font-size: 14px;
                                color: #333;
                                text-transform: capitalize;
                            }

                            page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-footer .table-waiter .img {
                                width: 36px;
                                height: 36px;
                                background-size: cover;
                                background-position: center;
                                background-color: rgba(0, 0, 0, 0.1);
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-align: center;
                                -webkit-align-items: center;
                                -ms-flex-align: center;
                                align-items: center;
                                -webkit-box-pack: center;
                                -webkit-justify-content: center;
                                -ms-flex-pack: center;
                                justify-content: center;
                                border-radius: 1rem;
                                font-size: 30px;
                            }

                                page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-footer .table-waiter .img.no-photo {
                                    background: -webkit-gradient(linear, left top, right bottom, from(#ffa000), to(#f57c00));
                                    background: linear-gradient(to bottom right, #ffa000, #f57c00);
                                    border-radius: 0.5rem;
                                    -webkit-box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
                                    box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
                                    display: -webkit-box;
                                    display: -webkit-flex;
                                    display: -ms-flexbox;
                                    display: flex;
                                    -webkit-box-align: center;
                                    -webkit-align-items: center;
                                    -ms-flex-align: center;
                                    align-items: center;
                                    -webkit-box-pack: center;
                                    -webkit-justify-content: center;
                                    -ms-flex-pack: center;
                                    justify-content: center;
                                }

                                    page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item .card-footer .table-waiter .img.no-photo span {
                                        color: white;
                                        font-size: 18px;
                                        font-weight: 700;
                                        text-transform: uppercase;
                                        text-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
                                    }

                    page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item.selected {
                        background: -webkit-gradient(linear, left top, left bottom, from(#08e465), to(#00be51));
                        background: linear-gradient(to bottom, #08e465, #00be51);
                    }

                    page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item.disabled {
                        background: -webkit-gradient(linear, left top, left bottom, from(#08e465), to(#00be51));
                        background: linear-gradient(to bottom, #08e465, #00be51);
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item.disabled .card-header {
                            background-color: transparent;
                        }

                        page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item.disabled .card-body {
                            background-color: transparent;
                        }

                            page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item.disabled .card-body .item-info .card-subtitle,
                            page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item.disabled .card-body .item-info .card-title {
                                opacity: 1;
                                color: #FFF;
                                text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
                            }

                        page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item.disabled .card-footer {
                            background-color: transparent;
                        }

                            page-pos-waiter .page-wrapper .panel-orders .col-tables .tables-container .table-item.disabled .card-footer .name {
                                color: #FFF;
                            }

            page-pos-waiter .page-wrapper .panel-orders .col-tables .buttons-container {
                position: absolute;
                bottom: 16px;
                right: 16px;
            }

                page-pos-waiter .page-wrapper .panel-orders .col-tables .buttons-container .btn {
                    padding: 1rem 4rem;
                    margin-left: 0.75rem;
                }

                    page-pos-waiter .page-wrapper .panel-orders .col-tables .buttons-container .btn i {
                        margin-right: 1.65rem;
                    }

        page-pos-waiter .page-wrapper .panel-orders .col-tabs {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 300px;
            -ms-flex: 0 0 300px;
            flex: 0 0 300px;
            max-width: 300px;
            background-color: #f6f8fc;
            height: 100%;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
            z-index: 2;
        }

            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header {
                background-color: #1e88e5;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 46px;
                -ms-flex: 0 0 46px;
                flex: 0 0 46px;
                height: 46px;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
            }

                page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .title {
                    font-size: 18px;
                    color: #FFF;
                    margin: 0;
                    padding: 1rem;
                    padding-right: 0.3rem;
                    white-space: nowrap;
                    width: 100%;
                }

                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .title i {
                        font-size: 16px;
                    }

                page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: end;
                    -webkit-justify-content: flex-end;
                    -ms-flex-pack: end;
                    justify-content: flex-end;
                    padding: 0 0.5rem;
                    position: relative;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 auto;
                    -ms-flex: 0 0 auto;
                    flex: 0 0 auto;
                    width: auto;
                }

                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar i {
                        color: #FFF;
                    }

                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar .btn {
                        height: 36px;
                        padding: 0 0.5rem;
                        background-color: transparent !important;
                        border-color: transparent !important;
                        font-size: 15px;
                        -webkit-transition: background-color 0.3s ease;
                        transition: background-color 0.3s ease;
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar .btn:hover {
                            background-color: rgba(0, 0, 0, 0.05) !important;
                        }

                        page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar .btn i {
                            font-size: 20px;
                        }

                            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar .btn i.fas {
                                font-size: 16px;
                            }

                        page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar .btn span {
                            margin-left: 0.5rem;
                        }

                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar h4 {
                        color: #FFF;
                        margin: 0;
                        font-size: 18px;
                    }

                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar .form-control {
                        width: auto;
                        display: -webkit-inline-box;
                        display: -webkit-inline-flex;
                        display: -ms-inline-flexbox;
                        display: inline-flex;
                        background-color: transparent;
                        border: none;
                        font-size: 15px;
                        color: #FFF;
                        -webkit-box-shadow: none;
                        box-shadow: none;
                        text-align: right;
                        cursor: pointer;
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar .form-control .item-inner {
                            padding-right: 0;
                        }

                            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar .form-control .item-inner .label {
                                margin-right: 0;
                            }

                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar .datepicker-container {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        width: 100%;
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar .datepicker-container .form-control {
                            width: calc(100% - 40px);
                            padding-right: 0;
                        }

                        page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button {
                            color: white;
                            line-height: 46px;
                        }

            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body {
                padding: 0;
                overflow-y: auto;
                height: calc(100% - 46px);
            }

                page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item {
                    cursor: pointer;
                    background-color: #f6f8fc;
                    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
                }

                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .item {
                        background-color: #f6f8fc;
                        border-bottom: none;
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .item .item-inner {
                            border-bottom: none;
                        }

                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info {
                        padding-left: 1rem;
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-align: center;
                            -webkit-align-items: center;
                            -ms-flex-align: center;
                            align-items: center;
                        }

                            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .item-image {
                                width: 48px;
                                height: 48px;
                                margin-right: 1.5rem;
                                background-size: contain;
                                background-repeat: no-repeat;
                                background-position: center;
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-align: center;
                                -webkit-align-items: center;
                                -ms-flex-align: center;
                                align-items: center;
                                -webkit-box-pack: center;
                                -webkit-justify-content: center;
                                -ms-flex-pack: center;
                                justify-content: center;
                                border-radius: 1rem;
                            }

                            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .detail .alias {
                                font-size: 18px;
                                font-weight: 800;
                                text-overflow: ellipsis;
                                margin: 0;
                                overflow: hidden;
                            }

                                page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .detail .alias::first-letter {
                                    text-transform: uppercase;
                                }

                            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .detail .info {
                                font-size: 12px;
                                margin-top: 0;
                                margin-bottom: 0.5rem;
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-orient: vertical;
                                -webkit-box-direction: normal;
                                -webkit-flex-flow: column;
                                -ms-flex-flow: column;
                                flex-flow: column;
                            }

                                page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .detail .info .area,
                                page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .detail .info .folio,
                                page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .detail .info .creada {
                                    font-size: 12px;
                                    text-overflow: ellipsis;
                                    overflow: hidden;
                                    white-space: nowrap;
                                }

                                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .detail .info .area::first-letter,
                                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .detail .info .folio::first-letter,
                                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .detail .info .creada::first-letter {
                                        text-transform: uppercase;
                                    }

                                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .detail .info .area strong,
                                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .detail .info .folio strong,
                                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .detail .info .creada strong {
                                        font-weight: 600;
                                        text-transform: uppercase;
                                        opacity: 0.8;
                                    }

                            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .action {
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-orient: vertical;
                                -webkit-box-direction: normal;
                                -webkit-flex-flow: column;
                                -ms-flex-flow: column;
                                flex-flow: column;
                                -webkit-box-pack: center;
                                -webkit-justify-content: center;
                                -ms-flex-pack: center;
                                justify-content: center;
                            }

                                page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .action .btn {
                                    padding: 0;
                                    border-radius: 50%;
                                    -webkit-transition: -webkit-transform 0.15s ease;
                                    transition: -webkit-transform 0.15s ease;
                                    transition: transform 0.15s ease;
                                    transition: transform 0.15s ease, -webkit-transform 0.15s ease;
                                    font-size: 30px;
                                }

                                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .body .action .btn:hover {
                                        -webkit-transform: translateX(2px);
                                        transform: translateX(2px);
                                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .tab-info .footer {
                            font-size: 11px;
                            font-weight: 500;
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-pack: justify;
                            -webkit-justify-content: space-between;
                            -ms-flex-pack: justify;
                            justify-content: space-between;
                        }

                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .item-options-left,
                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .item-options-right {
                        width: auto;
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .item-options-left .btn,
                        page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .item-options-right .btn {
                            padding: 0.25rem;
                            width: 70px;
                            border-radius: 0;
                        }

                            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .item-options-left .btn i,
                            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .item-options-right .btn i {
                                color: #FFF;
                                margin-right: 0;
                            }

                            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .item-options-left .btn span,
                            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item .item-options-right .btn span {
                                font-size: 12px;
                                white-space: normal;
                            }

                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item.selected {
                        background: -webkit-gradient(linear, left top, right top, from(#00d45a), to(#00be51)) !important;
                        background: linear-gradient(to right, #00d45a, #00be51) !important;
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item.selected .tab-info {
                            background: transparent;
                        }

                            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item.selected .tab-info .body .item-image {
                                -webkit-filter: brightness(0.1) invert(1);
                                filter: brightness(0.1) invert(1);
                            }

                            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item.selected .tab-info .body .detail .alias {
                                color: white;
                                text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
                            }

                            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-body .tabs-container .tab-item.selected .tab-info .body .detail .info {
                                color: white;
                            }

            page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-footer {
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 46px;
                -ms-flex: 0 0 46px;
                flex: 0 0 46px;
            }

                page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-footer .total-container .count-item,
                page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-footer .total-container .total-item {
                    height: 46px;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    background-color: #333;
                    font-size: 18px;
                    color: #FFF;
                    padding: 0.5rem 1rem;
                }

                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-footer .total-container .count-item p,
                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-footer .total-container .total-item p {
                        margin-bottom: 0;
                    }

                page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-footer .total-container .total-item {
                    font-size: 18px;
                    background-color: #212121;
                }

                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-footer .total-container .total-item .total {
                        color: #00d45a;
                        font-weight: 700;
                    }

                page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-footer .action-container {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                }

                    page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-footer .action-container .btn {
                        padding: 0.5rem 1rem;
                        -webkit-box-flex: 1;
                        -webkit-flex-grow: 1;
                        -ms-flex-positive: 1;
                        flex-grow: 1;
                        border-radius: 0;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        font-size: 18px;
                        height: 46px;
                    }

                        page-pos-waiter .page-wrapper .panel-orders .col-tabs .col-footer .action-container .btn i {
                            margin: 0;
                            width: 18px;
                        }

    page-pos-waiter .page-wrapper .panel-products {
        width: 100vw;
        height: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        position: relative;
    }

        page-pos-waiter .page-wrapper .panel-products > .overlay {
            z-index: 10;
            position: absolute;
            background: rgba(51, 51, 51, 0.35);
            display: none;
        }

        page-pos-waiter .page-wrapper .panel-products .col-productos {
            width: calc(100% - 300px);
            height: 100%;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
        }

            page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container {
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 46px;
                -ms-flex: 0 0 46px;
                flex: 0 0 46px;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                z-index: 9;
                position: relative;
                background-color: white;
            }

                page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .search-icon {
                    position: absolute;
                    top: 0;
                    left: calc(143px + 1rem);
                    z-index: 1;
                    width: 46px;
                    height: 46px;
                    display: -webkit-inline-box;
                    display: -webkit-inline-flex;
                    display: -ms-inline-flexbox;
                    display: inline-flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    font-size: 20px;
                    opacity: 0.6;
                }

                page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .form-control {
                    height: 46px;
                    border: transparent;
                    border-radius: 0;
                    text-indent: 34px;
                    font-size: 16px;
                    font-weight: 500;
                    background-color: rgba(0, 0, 0, 0.03);
                }

                    page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .form-control::-webkit-input-placeholder {
                        font-style: italic;
                    }

                    page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .form-control::-moz-placeholder {
                        font-style: italic;
                    }

                    page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .form-control::-ms-input-placeholder {
                        font-style: italic;
                    }

                    page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .form-control::placeholder {
                        font-style: italic;
                    }

                    page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .form-control:focus {
                        outline: none;
                        -webkit-box-shadow: none;
                        box-shadow: none;
                    }

                page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .btn {
                    height: 36px;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 auto;
                    -ms-flex: 0 0 auto;
                    flex: 0 0 auto;
                    margin: 0 0.5rem;
                    padding: 0;
                    -webkit-box-shadow: none;
                    box-shadow: none;
                    font-size: 15px;
                    -webkit-transition: background-color 0.3s ease;
                    transition: background-color 0.3s ease;
                }

                    page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .btn i {
                        font-size: 20px;
                    }

                        page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .btn i.lg {
                            font-size: 24px;
                        }

                    page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .btn.btn-cuentas {
                        color: white;
                        height: 46px;
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 auto;
                        -ms-flex: 0 0 auto;
                        flex: 0 0 auto;
                        margin: 0;
                        padding: 0;
                        border-radius: 0;
                        padding: 0 1rem;
                        -webkit-box-shadow: none;
                        box-shadow: none;
                        font-size: 15px;
                        background-color: #ffa000;
                        -webkit-transition: background-color 0.3s ease;
                        transition: background-color 0.3s ease;
                    }

                        page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .btn.btn-cuentas i {
                            margin-left: 0.5rem;
                        }

                page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .price-lists-container {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 320px;
                    -ms-flex: 0 0 320px;
                    flex: 0 0 320px;
                    padding: 0 0.5rem;
                    height: 46px;
                    padding-left: 1.5rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    background-color: #eaf0f3;
                }

                    page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .price-lists-container .mat-form-control {
                        -webkit-box-flex: 1;
                        -webkit-flex: 1;
                        -ms-flex: 1;
                        flex: 1;
                        font-weight: 700;
                    }

                        page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex {
                            margin: 1px 0 -1px;
                            border-color: transparent !important;
                            -webkit-box-shadow: none !important;
                            box-shadow: none !important;
                        }

                            page-pos-waiter .page-wrapper .panel-products .col-productos .filter-container .price-lists-container .mat-form-control .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-infix .mat-form-field-label-wrapper .mat-form-field-label {
                                background-color: #eaf0f3;
                            }

            page-pos-waiter .page-wrapper .panel-products .col-productos .categories-container {
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 50px;
                -ms-flex: 0 0 50px;
                flex: 0 0 50px;
                z-index: 1;
                -webkit-box-shadow: 0 2px 6px 0px rgba(0, 0, 0, 0.1);
                box-shadow: 0 2px 6px 0px rgba(0, 0, 0, 0.1);
            }

                page-pos-waiter .page-wrapper .panel-products .col-productos .categories-container .categories {
                    height: 50px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    background-color: #00d45a;
                    padding: 0.5rem;
                    margin: 0;
                    overflow-y: hidden;
                    overflow-x: auto;
                }

                    page-pos-waiter .page-wrapper .panel-products .col-productos .categories-container .categories .category-item {
                        padding: 0.5rem 1rem;
                        margin-right: 0.5rem;
                        border-radius: 1rem;
                        font-size: 16px;
                        text-transform: capitalize;
                        cursor: pointer;
                        -webkit-transition: all 0.3s ease;
                        transition: all 0.3s ease;
                        white-space: nowrap;
                        color: #FFF;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-waiter .page-wrapper .panel-products .col-productos .categories-container .categories .category-item.active, page-pos-waiter .page-wrapper .panel-products .col-productos .categories-container .categories .category-item:hover {
                            color: #212121;
                            background-color: #FFF;
                            -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
                            box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
                        }

            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container {
                height: calc(100% - 92px);
                overflow-y: auto;
                padding: 0 2rem 2rem;
                z-index: 0;
            }

@media (min-width: 1680px) {
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .col-xl-3 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 16.666667%;
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }
}

page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item {
    margin: 16px auto 0;
    border-radius: 1rem;
}

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-photo {
        width: 100%;
        padding-top: 50%;
        max-height: 380px;
        position: relative;
        border-radius: 1rem;
        background-color: white;
        -webkit-box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.35);
        box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.35);
        background: -webkit-gradient(linear, left top, right bottom, from(#bdbdbd), to(#9a9a9a));
        background: linear-gradient(to bottom right, #bdbdbd, #9a9a9a);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        z-index: 99;
    }

        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-photo span {
            padding-top: 4px;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            text-transform: uppercase;
            color: #FFF;
            text-align: center;
            font-weight: 700;
            font-size: 16px;
            line-height: 20px;
            letter-spacing: 1px;
            text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.5);
            border-top-left-radius: 0.5rem;
            border-top-right-radius: 0.5rem;
            z-index: 1;
        }

@media (min-width: 1650px) {
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-photo span {
        font-size: 18px;
        line-height: 22px;
    }
}

page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-photo .store-logo {
    width: 80px;
    height: 80px;
    position: absolute;
    bottom: -10px;
    right: -10px;
    background-image: url("https://webapp.crol.mx/pos/assets/imgs/logo.png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.1;
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
    z-index: 0;
}

page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-info {
    padding: 1rem;
    position: relative;
    background-color: #FFF;
    border-radius: 0 0 0.5rem 0.5rem;
}

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-info .name,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-info .category,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-info .price {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        font-size: 16px;
        font-weight: 600;
        margin: 0;
        text-transform: capitalize;
    }

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-info .name {
        height: 40px;
        margin-bottom: 5px;
        overflow: hidden;
    }

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-info .category {
        font-size: 13px;
        font-style: italic;
        opacity: 0.45;
        padding-right: 2.5rem;
    }

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-info .price {
        font-size: 24px;
        font-weight: 800;
        margin-top: 0.5rem;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        color: #212121;
    }

        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-info .price small {
            color: #00be51;
            font-size: 60%;
            font-weight: 700;
            margin: 0.35rem 0.25rem 0 0;
        }

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-info .btn {
        width: 40px;
        height: 40px;
        position: absolute;
        bottom: 0.5rem;
        right: 0.5rem;
        padding: 0;
    }

        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-info .btn:hover {
            -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
        }

page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle,
page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras,
page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment {
    max-height: 298px;
    overflow-y: auto;
    -webkit-transition: height 0.15s linear;
    transition: height 0.15s linear;
}

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle.collapse,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras.collapse,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment.collapse {
        height: 0;
        display: block;
        overflow: hidden;
    }

        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle.collapse .list,
        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle.collapse .item-input,
        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras.collapse .list,
        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras.collapse .item-input,
        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment.collapse .list,
        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment.collapse .item-input {
            opacity: 0;
            -webkit-transition: opacity 0.15s ease;
            transition: opacity 0.15s ease;
        }

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .list,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .list,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .list {
        margin: 0;
        border-top: 1px solid #e0e0e0;
        opacity: 1;
    }

        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .list .item,
        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .list .item,
        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .list .item {
            padding-left: 0.5rem;
            min-height: 0;
        }

            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .list .item:first-child, page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .list .item:last-child,
            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .list .item:first-child,
            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .list .item:last-child,
            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .list .item:first-child,
            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .list .item:last-child {
                border: none;
            }

            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .list .item .item-inner,
            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .list .item .item-inner,
            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .list .item .item-inner {
                padding-right: 0;
                border-color: #e0e0e0;
            }

                page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .list .item .item-inner .input-wrapper .label,
                page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .list .item .item-inner .input-wrapper .label,
                page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .list .item .item-inner .input-wrapper .label {
                    font-size: 12px;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    text-transform: capitalize;
                }

                    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .list .item .item-inner .input-wrapper .label .name,
                    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .list .item .item-inner .input-wrapper .label .name,
                    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .list .item .item-inner .input-wrapper .label .name {
                        font-weight: 600;
                    }

            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .list .item .checkbox,
            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .list .item .checkbox,
            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .list .item .checkbox {
                margin-right: 0.5rem;
            }

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .item-input,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .item-input,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .item-input {
        opacity: 1;
    }

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .text-input,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .text-input,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .text-input {
        width: 100%;
        font-size: 14px;
        margin: 0;
        padding: 0.5rem;
        border-radius: 0;
        border: 0 solid #e0e0e0;
        background-color: #f6f8fc;
        border-bottom: 1px solid #e0e0e0;
    }

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .list-header,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .list-header,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .list-header {
        padding-left: 0 !important;
        margin-top: 0;
        margin-bottom: 0;
    }

        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .list-header .item-inner .input-wrapper .label,
        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .list-header .item-inner .input-wrapper .label,
        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .list-header .item-inner .input-wrapper .label {
            margin: 0;
            padding: 0.5rem;
            background-color: #eaf0f3;
            color: #000;
            font-size: 10px !important;
            font-weight: 800;
            letter-spacing: 2px;
            text-transform: uppercase !important;
            border-bottom: 1px solid #e0e0e0;
        }

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .extras-filter .text-input,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .extras-filter .text-input,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .extras-filter .text-input {
        border-width: 0 0 1px 0;
    }

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-detalle .item-textarea,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-extras .item-textarea,
    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .item-textarea {
        padding-left: 0 !important;
    }

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-comment .text-input {
        border-bottom: none;
        height: 150px;
        resize: none;
    }

page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    border-radius: 0 0 0.5rem 0.5rem;
}

    page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-buttons .btn {
        height: unset;
        border-radius: 0;
        width: 100%;
        -webkit-box-flex: 1 1 100%;
        -webkit-flex-grow: 1 1 100%;
        -ms-flex-positive: 1 1 100%;
        flex-grow: 1 1 100%;
        padding: 0.75rem 1rem;
        border-top: 1px solid #e0e0e0;
        border-right: 1px solid #e0e0e0;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-buttons .btn > i {
            font-size: 22px;
            margin-right: 0;
            -webkit-transition: color 0.6s ease;
            transition: color 0.6s ease;
        }

        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-buttons .btn > span {
            display: none;
        }

        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-buttons .btn.btn-default {
            background-color: transparent !important;
            border-color: #e0e0e0 !important;
            color: #333 !important;
        }

            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-buttons .btn.btn-default:focus, page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-buttons .btn.btn-default:hover, page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-buttons .btn.btn-default:active {
                color: initial !important;
            }

            page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-buttons .btn.btn-default.active {
                color: initial !important;
                border-top-color: transparent !important;
                border-bottom-left-radius: 0.5rem;
                border-bottom-right-radius: 0.5rem;
            }

                page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-buttons .btn.btn-default.active i {
                    color: #00d45a;
                }

        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-buttons .btn:first-child {
            border-bottom-left-radius: 0.5rem;
        }

        page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item .product-buttons .btn:last-child {
            border-right: none;
            border-bottom-right-radius: 0.5rem;
        }

page-pos-waiter .page-wrapper .panel-products .col-productos .products-container .product-item:hover {
    -webkit-transform: none;
    transform: none;
    -webkit-box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);
}

page-pos-waiter .page-wrapper .panel-products .col-tab {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 300px;
    -ms-flex: 0 0 300px;
    flex: 0 0 300px;
    max-width: 300px;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
    z-index: 2;
}

    page-pos-waiter .page-wrapper .panel-products .col-tab .col-header {
        background-color: #00d45a;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 46px;
        -ms-flex: 0 0 46px;
        flex: 0 0 46px;
        height: 46px;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

        page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .title {
            font-size: 18px;
            color: #FFF;
            margin: 0;
            padding: 1rem;
            padding-right: 0.3rem;
            white-space: nowrap;
            width: 100%;
        }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .title i {
                font-size: 16px;
            }

        page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: end;
            -webkit-justify-content: flex-end;
            -ms-flex-pack: end;
            justify-content: flex-end;
            padding: 0 0.5rem;
            position: relative;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 auto;
            -ms-flex: 0 0 auto;
            flex: 0 0 auto;
            width: auto;
        }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar i {
                color: #FFF;
            }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar .btn {
                height: 36px;
                padding: 0 0.5rem;
                background-color: transparent !important;
                border-color: transparent !important;
                font-size: 15px;
                -webkit-transition: background-color 0.3s ease;
                transition: background-color 0.3s ease;
            }

                page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar .btn:hover {
                    background-color: rgba(0, 0, 0, 0.05) !important;
                }

                page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar .btn i {
                    font-size: 20px;
                }

                    page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar .btn i.fas {
                        font-size: 16px;
                    }

                page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar .btn span {
                    margin-left: 0.5rem;
                }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar h4 {
                color: #FFF;
                margin: 0;
                font-size: 18px;
            }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar .form-control {
                width: auto;
                display: -webkit-inline-box;
                display: -webkit-inline-flex;
                display: -ms-inline-flexbox;
                display: inline-flex;
                background-color: transparent;
                border: none;
                font-size: 15px;
                color: #FFF;
                -webkit-box-shadow: none;
                box-shadow: none;
                text-align: right;
                cursor: pointer;
            }

                page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar .form-control .item-inner {
                    padding-right: 0;
                }

                    page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar .form-control .item-inner .label {
                        margin-right: 0;
                    }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar .datepicker-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                width: 100%;
            }

                page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar .datepicker-container .form-control {
                    width: calc(100% - 40px);
                    padding-right: 0;
                }

                page-pos-waiter .page-wrapper .panel-products .col-tab .col-header .toolbar .datepicker-container .mat-datepicker-toggle .mat-icon-button {
                    color: white;
                    line-height: 46px;
                }

    page-pos-waiter .page-wrapper .panel-products .col-tab .col-body {
        padding: 0;
        overflow-y: auto;
        height: calc(100% - 46px);
        background-color: #FFF;
    }

        page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container {
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
            margin: 0;
        }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .product-info .name {
                font-size: 16px;
                font-weight: 700;
                white-space: normal;
                margin: 0 0 1rem;
                padding-right: 1rem;
            }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .product-info .discount-icon {
                position: absolute;
                top: 1rem;
                right: 1rem;
                color: #ffa000;
            }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .product-info .info {
                font-size: 12px;
                margin-top: 0.25rem;
                margin-bottom: 0.5rem;
            }

                page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .product-info .info label {
                    font-weight: 600;
                    display: block;
                    margin-bottom: 2px;
                }

                page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .product-info .info .extras {
                    display: block;
                    line-height: 14px;
                    white-space: normal;
                    margin-bottom: 0.25rem;
                }

                    page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .product-info .info .extras span {
                        display: inline-block;
                        margin-right: 10px;
                        text-transform: capitalize;
                    }

                page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .product-info .info .comment {
                    display: block;
                    line-height: 14px;
                    white-space: normal;
                }

                    page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .product-info .info .comment span {
                        display: inline-block;
                    }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .product-info .footer {
                font-size: 14px;
                font-weight: 500;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
            }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .item-options-left,
            page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .item-options-right {
                width: auto;
            }

                page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .item-options-left .btn,
                page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .item-options-right .btn {
                    padding: 0.25rem;
                    width: 70px;
                    border-radius: 0;
                }

                    page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .item-options-left .btn i,
                    page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .item-options-right .btn i {
                        color: #FFF;
                        margin-right: 0;
                    }

                    page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .item-options-left .btn span,
                    page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item .item-options-right .btn span {
                        font-size: 12px;
                        white-space: normal;
                    }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item.disabled {
                -webkit-user-select: none;
                -moz-user-select: none;
                -ms-user-select: none;
                user-select: none;
                pointer-events: none;
            }

                page-pos-waiter .page-wrapper .panel-products .col-tab .col-body .products-container .product-item.disabled::after {
                    content: '';
                    position: absolute;
                    top: 0;
                    right: 0;
                    bottom: 0;
                    left: 0;
                    z-index: 99;
                    background-color: rgba(240, 240, 240, 0.75);
                }

    page-pos-waiter .page-wrapper .panel-products .col-tab .col-footer {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 46px;
        -ms-flex: 0 0 46px;
        flex: 0 0 46px;
    }

        page-pos-waiter .page-wrapper .panel-products .col-tab .col-footer .total-container .count-item,
        page-pos-waiter .page-wrapper .panel-products .col-tab .col-footer .total-container .total-item {
            height: 46px;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 46px;
            -ms-flex: 0 0 46px;
            flex: 0 0 46px;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            background-color: #333;
            font-size: 18px;
            color: #FFF;
            padding: 0.5rem 1rem;
        }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-footer .total-container .count-item p,
            page-pos-waiter .page-wrapper .panel-products .col-tab .col-footer .total-container .total-item p {
                margin-bottom: 0;
            }

        page-pos-waiter .page-wrapper .panel-products .col-tab .col-footer .total-container .total-item {
            font-size: 18px;
            background-color: #212121;
        }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-footer .total-container .total-item .total {
                color: #00d45a;
                font-weight: 700;
            }

        page-pos-waiter .page-wrapper .panel-products .col-tab .col-footer .action-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
        }

            page-pos-waiter .page-wrapper .panel-products .col-tab .col-footer .action-container .btn {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                border-radius: 0;
                font-size: 18px;
                height: 46px;
            }

                page-pos-waiter .page-wrapper .panel-products .col-tab .col-footer .action-container .btn i {
                    position: absolute;
                    right: 1rem;
                    width: 18px;
                }

page-pos-waiter .page-wrapper .panel-pago {
    width: calc(100vw - 300px);
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

    page-pos-waiter .page-wrapper .panel-pago .col-tab-info,
    page-pos-waiter .page-wrapper .panel-pago .col-payments {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-flow: column;
        -ms-flex-flow: column;
        flex-flow: column;
        padding: 0;
    }

        page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-header,
        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-header {
            background-color: #00be51;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 46px;
            -ms-flex: 0 0 46px;
            flex: 0 0 46px;
            height: 46px;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
            justify-content: space-between;
        }

            page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-header .title,
            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-header .title {
                width: 100%;
                font-size: 18px;
                font-weight: 700;
                letter-spacing: -0.5px;
                color: white;
                margin: 0;
                padding: 1rem;
                white-space: nowrap;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
            }

            page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-header .toolbar,
            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-header .toolbar {
                width: auto;
                -webkit-flex-shrink: 0;
                -ms-flex-negative: 0;
                flex-shrink: 0;
                display: -webkit-inline-box;
                display: -webkit-inline-flex;
                display: -ms-inline-flexbox;
                display: inline-flex;
                -webkit-box-pack: end;
                -webkit-justify-content: flex-end;
                -ms-flex-pack: end;
                justify-content: flex-end;
                padding: 0 0.5rem;
                background-color: #00d45a;
            }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn,
                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn {
                    height: 36px;
                    padding: 0 0.5rem;
                    background-color: transparent !important;
                    border-color: transparent !important;
                    font-size: 15px;
                    -webkit-transition: background-color 0.3s ease;
                    transition: background-color 0.3s ease;
                }

                    page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn:hover,
                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn:hover {
                        background-color: rgba(0, 0, 0, 0.05) !important;
                    }

                    page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn i,
                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn i {
                        font-size: 15px;
                        margin-right: 1rem;
                    }

                        page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn i.lg,
                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn i.lg {
                            font-size: 24px;
                        }

                    page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .btn span,
                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-header .toolbar .btn span {
                        margin-left: 0.5rem;
                    }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .item,
                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-header .toolbar .item {
                    width: auto;
                    display: -webkit-inline-box;
                    display: -webkit-inline-flex;
                    display: -ms-inline-flexbox;
                    display: inline-flex;
                    background-color: transparent;
                    font-size: 14px;
                    color: #FFF;
                }

                    page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .item .item-inner,
                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-header .toolbar .item .item-inner {
                        padding-right: 0;
                    }

                        page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-header .toolbar .item .item-inner .label,
                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-header .toolbar .item .item-inner .label {
                            margin-right: 0;
                        }

        page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-body,
        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body {
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
            background-color: #eaf0f3;
        }

        page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .options-container,
        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .options-container {
            background-color: #212121;
        }

            page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item,
            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -webkit-align-items: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                font-size: 16px;
                color: #FFF;
                padding: 0.7rem 1rem;
                max-height: 46px;
            }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item .label,
                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item .label {
                    margin-bottom: 0;
                    white-space: nowrap;
                }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item .control,
                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item .control {
                    margin-bottom: 0;
                    max-width: 160px;
                    padding: 2px 6px 1px;
                    border-radius: 0;
                    position: relative;
                }

                    page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item .control.input,
                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item .control.input {
                        background-color: #333;
                        border-color: #333;
                    }

                        page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item .control.input .text-input,
                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item .control.input .text-input {
                            width: 100%;
                            margin: 4px 0 3px;
                            text-align: right;
                            color: #FFF;
                        }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .option-item select.control,
                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .options-container .option-item select.control {
                    border-radius: 0.25rem;
                    color: #212121;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    cursor: pointer;
                    flex-grow: 1;
                    max-width: 60%;
                }

            page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals,
            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals {
                background-color: #FFF;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-flow: column;
                -ms-flex-flow: column;
                flex-flow: column;
            }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals .option-item,
                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals .option-item {
                    color: #212121;
                    max-height: none;
                    height: 46px;
                    position: relative;
                    border-bottom: 1px solid #eaf0f3;
                }

                    page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals .option-item .label,
                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals .option-item .label {
                        margin-bottom: 0;
                        color: #525252;
                        font-weight: 600;
                    }

                    page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals .option-item h4,
                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals .option-item h4 {
                        margin: 0;
                        font-weight: 700;
                    }

                        page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .options-container .totals .option-item h4 small,
                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .options-container .totals .option-item h4 small {
                            font-size: 50%;
                        }

        page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container,
        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container {
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
        }

            page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .btn,
            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .btn {
                padding: 0.5rem 1rem;
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                border-radius: 0;
                -webkit-box-pack: justify;
                -webkit-justify-content: space-between;
                -ms-flex-pack: justify;
                justify-content: space-between;
                font-size: 18px;
                height: 46px;
            }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .btn:not(.btn-icon),
                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .btn:not(.btn-icon) {
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    border-radius: 0;
                    height: 46px;
                }

                    page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .btn:not(.btn-icon) i,
                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .btn:not(.btn-icon) i {
                        position: absolute;
                        right: 1rem;
                        margin: 0;
                        width: 18px;
                    }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .btn.btn-icon,
                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .btn.btn-icon {
                    width: 46px;
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                }

            page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container,
            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: horizontal;
                -webkit-box-direction: normal;
                -webkit-flex-flow: row;
                -ms-flex-flow: row;
                flex-flow: row;
                background-color: #1e88e5;
                -webkit-box-shadow: none;
                box-shadow: none;
                cursor: pointer;
                color: #FFF;
                border-radius: 0;
                -webkit-transition: all 0.5s ease;
                transition: all 0.5s ease;
                width: 100%;
                height: 46px;
                margin-bottom: 0;
            }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info,
                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info {
                    width: 100%;
                    max-width: calc(100% - 40px);
                    padding: 1rem 0.5rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info .label,
                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info .label {
                        width: calc(100% - 0.5rem);
                        padding-left: 0.5rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: justify;
                        -webkit-justify-content: space-between;
                        -ms-flex-pack: justify;
                        justify-content: space-between;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info .label h4,
                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info .label h4 {
                            white-space: nowrap;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            font-size: 16px;
                            font-weight: 500;
                            margin: 0;
                            text-transform: capitalize;
                        }

                        page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info .label h3,
                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info .label h3 {
                            font-size: 26px;
                            margin: 0;
                        }

                            page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .info .label h3 small,
                            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .info .label h3 small {
                                font-size: 50%;
                                margin: 0 0.25rem;
                            }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .action,
                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .action {
                    -webkit-box-flex: 0;
                    -webkit-flex: 0 0 46px;
                    -ms-flex: 0 0 46px;
                    flex: 0 0 46px;
                    padding: 1rem 0.5rem;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: column;
                    -ms-flex-flow: column;
                    flex-flow: column;
                    -webkit-justify-content: space-around;
                    -ms-flex-pack: distribute;
                    justify-content: space-around;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container .action .btn,
                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container .action .btn {
                        color: #FFF;
                        width: 32px;
                        height: 32px;
                        font-size: 26px;
                        padding: 0;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container.selected,
                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container.selected {
                    background-color: #00d45a;
                    color: #fff;
                }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .action-container .discount-container:hover,
                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-footer .action-container .discount-container:hover {
                    -webkit-transform: none;
                    transform: none;
                }

        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-header {
            background-color: #00d45a;
        }

        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body {
            background-color: #f6f8fc;
            height: 100%;
            overflow-y: auto;
        }

            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .client-container {
                max-height: 50px;
                text-align: right;
                -webkit-box-flex: 0;
                -webkit-flex: 0 0 50px;
                -ms-flex: 0 0 50px;
                flex: 0 0 50px;
            }

                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .client-container h4 {
                    margin: 0;
                    font-size: 22px;
                    padding: 1rem 1rem 0.5rem 2rem;
                    border-bottom: 1px solid #e0e0e0;
                    display: inline-block;
                    text-transform: capitalize;
                }

                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .client-container h4 strong {
                        font-weight: 700;
                    }

            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container {
                padding: 1rem;
                -webkit-box-flex: 1;
                -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                height: calc(100% - 50px);
                overflow-y: auto;
                position: relative;
            }

                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .placeholder {
                    position: absolute;
                    top: 0;
                    right: 0;
                    bottom: 0;
                    left: 0;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                }

                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .placeholder .item {
                        color: rgba(0, 0, 0, 0.5);
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .placeholder .item .icon {
                            font-size: 48px;
                        }

                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .placeholder .item span {
                            max-width: 150px;
                            margin-left: 0.5rem;
                            font-size: 16px;
                            font-weight: 700;
                        }

                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item {
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -webkit-flex-flow: column;
                    -ms-flex-flow: column;
                    flex-flow: column;
                    margin-bottom: 1rem;
                }

                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .info {
                        padding: 1rem;
                        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
                        position: relative;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: start;
                        -webkit-justify-content: flex-start;
                        -ms-flex-pack: start;
                        justify-content: flex-start;
                        -webkit-box-align: center;
                        -webkit-align-items: center;
                        -ms-flex-align: center;
                        align-items: center;
                    }

                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .info h4 {
                            font-size: 22px;
                            font-weight: 700;
                            text-transform: capitalize;
                            margin: 0 1rem 0 0;
                        }

                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .info span {
                            font-size: 16px;
                            color: #757575;
                        }

                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .info .btn {
                            padding: 0.15rem 0.75rem;
                            margin-left: auto;
                        }

                            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .info .btn:hover {
                                color: #00be51;
                            }

                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item {
                        padding: 1rem;
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
                    }

                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .icon {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-orient: vertical;
                            -webkit-box-direction: normal;
                            -webkit-flex-flow: column;
                            -ms-flex-flow: column;
                            flex-flow: column;
                            color: #757575;
                            padding-right: 1rem;
                        }

                            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .icon i {
                                font-size: 44px;
                            }

                            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .icon span {
                                font-size: 8px;
                                font-weight: 800;
                                color: #757575;
                                letter-spacing: 1px;
                                text-align: center;
                                margin-top: -0.25rem;
                                text-transform: uppercase;
                            }

                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item > h4 {
                            color: #757575;
                            font-size: 20px;
                            font-weight: 700;
                            margin: 0;
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-align: center;
                            -webkit-align-items: center;
                            -ms-flex-align: center;
                            align-items: center;
                            padding-right: 1rem;
                        }

                            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item > h4 small {
                                font-size: 50%;
                            }

                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs {
                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            -webkit-box-pack: end;
                            -webkit-justify-content: flex-end;
                            -ms-flex-pack: end;
                            justify-content: flex-end;
                            -webkit-box-flex: 1;
                            -webkit-flex-grow: 1;
                            -ms-flex-positive: 1;
                            flex-grow: 1;
                        }

                            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .form-container {
                                display: -webkit-box;
                                display: -webkit-flex;
                                display: -ms-flexbox;
                                display: flex;
                                -webkit-box-orient: vertical;
                                -webkit-box-direction: normal;
                                -webkit-flex-flow: column;
                                -ms-flex-flow: column;
                                flex-flow: column;
                                -webkit-box-pack: center;
                                -webkit-justify-content: center;
                                -ms-flex-pack: center;
                                justify-content: center;
                                padding-left: 1rem;
                                -webkit-box-align: end;
                                -webkit-align-items: flex-end;
                                -ms-flex-align: end;
                                align-items: flex-end;
                                min-width: 180px;
                            }

                                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .form-container h4 {
                                    margin: 0;
                                    font-weight: 700;
                                }

                                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .form-container h4 small {
                                        font-size: 50%;
                                    }

                            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .item.item-input {
                                padding: 4px 1rem;
                                margin-bottom: 0.5rem;
                                font-size: 14px;
                                min-height: 0;
                                height: 52px;
                            }

                                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .item.item-input .item-inner {
                                    height: 46px;
                                    border: 1px solid #e0e0e0;
                                    border-radius: 1rem;
                                    padding: 0.75rem 1.5rem;
                                    -webkit-transition: background-color 0.3s ease;
                                    transition: background-color 0.3s ease;
                                }

                                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .item.item-input .item-inner .input-wrapper .label {
                                        position: absolute;
                                        top: 0;
                                        margin: 0;
                                        -webkit-transform: translate3d(0, 17px, 0);
                                        transform: translate3d(0, 17px, 0);
                                        background-color: white;
                                        padding: 0 0.5rem;
                                    }

                                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .item.item-input.item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus) .item-inner {
                                    border-color: #e02626;
                                    -webkit-box-shadow: 0 0 0 0.2rem rgba(224, 38, 38, 0.25);
                                    box-shadow: 0 0 0 0.2rem rgba(224, 38, 38, 0.25);
                                }

                                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .item.item-input.item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus) .label[floating] {
                                    color: #e02626;
                                }

                                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .item.item-input.input-has-focus .item-inner {
                                    border-color: #00d45a;
                                    -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                                    box-shadow: 0 0 0 0.2rem rgba(0, 212, 90, 0.25);
                                }

                                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .item.item-input.input-has-focus .label[floating] {
                                    height: 14px;
                                    line-height: 14px;
                                    -webkit-transform: translate3d(0, -1px, 0) scale(0.8);
                                    transform: translate3d(0, -1px, 0) scale(0.8);
                                    color: #00d45a;
                                }

                                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .item.item-input.input-has-value .item-inner {
                                    -webkit-box-shadow: none;
                                    box-shadow: none;
                                }

                                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .item.item-input.input-has-value .label[floating] {
                                    height: 14px;
                                    line-height: 14px;
                                    -webkit-transform: translate3d(0, -1px, 0) scale(0.8);
                                    transform: translate3d(0, -1px, 0) scale(0.8);
                                }

                                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .item.item-input.item-input-disabled .item-inner {
                                    background-color: #eee;
                                }

                                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .item.item-input.item-input-disabled .item-inner .label[floating] {
                                        background-color: #eee;
                                    }

                                page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .inputs .item.item-input:last-child {
                                    border-bottom: none;
                                    -webkit-box-shadow: none;
                                    box-shadow: none;
                                }

                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .card-footer {
                            padding: 1rem;
                            padding-left: 0;
                            border: none;
                            background-color: transparent;
                        }

                            page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item .card-footer .btn {
                                width: 32px;
                                height: 32px;
                                font-size: 28px;
                            }

                        page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item .payment-list .payment-item:first-child {
                            border-top: none;
                        }

                    page-pos-waiter .page-wrapper .panel-pago .col-payments .col-body .payments-container .client-item:hover {
                        -webkit-transform: none;
                        transform: none;
                    }

        page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-body {
            background-color: #FFF;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-flow: column;
            -ms-flex-flow: column;
            flex-flow: column;
        }

            page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-body .store-logo {
                margin: auto;
                padding: 1rem;
            }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-body .store-logo .logo-container {
                    width: auto;
                    height: 100%;
                    max-width: 100%;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -webkit-align-items: center;
                    -ms-flex-align: center;
                    align-items: center;
                    margin: 0 auto;
                }

                    page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-body .store-logo .logo-container img {
                        -webkit-filter: brightness(0);
                        filter: brightness(0);
                        opacity: 0.15;
                        max-width: 90%;
                        margin: 0 auto;
                    }

        page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 46px;
            -ms-flex: 0 0 46px;
            flex: 0 0 46px;
        }

            page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .bg-carbonDK {
                background-color: #212121;
            }

                page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .bg-carbonDK .btn {
                    padding: 0.5rem 1rem;
                    -webkit-box-flex: 1;
                    -webkit-flex-grow: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    border-radius: 0;
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                    -ms-flex-pack: justify;
                    justify-content: space-between;
                    font-size: 20px;
                    height: 46px;
                }

                    page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .bg-carbonDK .btn:not(.btn-icon) {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        -webkit-box-flex: 1;
                        -webkit-flex-grow: 1;
                        -ms-flex-positive: 1;
                        flex-grow: 1;
                        border-radius: 0;
                        height: 46px;
                    }

                        page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .bg-carbonDK .btn:not(.btn-icon) i {
                            position: absolute;
                            right: 1rem;
                            margin: 0;
                        }

                    page-pos-waiter .page-wrapper .panel-pago .col-tab-info .col-footer .bg-carbonDK .btn.btn-icon {
                        width: 46px;
                        -webkit-box-flex: 0;
                        -webkit-flex: 0 0 46px;
                        -ms-flex: 0 0 46px;
                        flex: 0 0 46px;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                    }

page-pos-waiter .page-wrapper.viewTabs {
    -webkit-transform: translateX(calc(-33.33333333% + 200px));
    transform: translateX(calc(-33.33333333% + 200px));
}

    page-pos-waiter .page-wrapper.viewTabs .panel-comanda > .overlay {
        display: block;
    }

page-pos-waiter .page-wrapper.viewProducts {
    -webkit-transform: translateX(calc(-33.33333333% - 100px));
    transform: translateX(calc(-33.33333333% - 100px));
}

page-pos-waiter .page-wrapper.viewPayments {
    -webkit-transform: translateX(calc(-66.66666666% + 100px));
    transform: translateX(calc(-66.66666666% + 100px));
}

.select-popover .popover-content .list {
    margin: 0;
}

    .select-popover .popover-content .list .item {
        min-height: 50px;
    }

        .select-popover .popover-content .list .item .item-inner .input-wrapper .label {
            font-size: 16px;
        }

page-welcome .page-wrapper {
    overflow-x: hidden;
    overflow-y: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    position: relative;
    background: -webkit-gradient(linear, left top, left bottom, from(white), to(#f6f8fc)) !important;
    background: linear-gradient(to bottom, white, #f6f8fc) !important;
    -webkit-flex-direction: row !important;
    -ms-flex-direction: row !important;
    flex-direction: row !important;
}

@media screen and (max-width: 1024px) {
    page-welcome .page-wrapper {
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: normal !important;
        -webkit-flex-direction: column !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
    }
}

page-welcome .page-wrapper .secondary-container {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 300px;
    -ms-flex: 0 0 300px;
    flex: 0 0 300px;
    height: 100%;
    padding: 2rem 1rem;
    background-color: #eaf0f3;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow-y: auto;
}

@media screen and (max-width: 1024px) {
    page-welcome .page-wrapper .secondary-container {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        height: auto;
    }
}

page-welcome .page-wrapper .secondary-container .header {
    padding: 3rem 2rem 2rem;
}

@media screen and (max-width: 1024px) {
    page-welcome .page-wrapper .secondary-container .header {
        display: none;
    }
}

page-welcome .page-wrapper .secondary-container .header .store-logo-container {
    margin: 0;
}

@media screen and (max-width: 1024px) {
    page-welcome .page-wrapper .secondary-container .header .store-logo-container {
        max-width: 240px;
    }
}

page-welcome .page-wrapper .secondary-container .header h2 {
    text-transform: none;
    white-space: nowrap;
    font-size: 20px;
    font-weight: 600;
    margin: 0 0 2rem;
}

    page-welcome .page-wrapper .secondary-container .header h2 .name {
        display: inline-block;
        font-weight: 800;
        text-transform: capitalize !important;
    }

@media screen and (max-width: 480px) {
    page-welcome .page-wrapper .secondary-container .header {
        display: none;
    }
}

page-welcome .page-wrapper .secondary-container .body {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 0 1.5rem;
}

    page-welcome .page-wrapper .secondary-container .body .print-mockups {
        display: none;
    }

@media screen and (max-width: 1024px) {
    page-welcome .page-wrapper .secondary-container .footer {
        margin-top: 0 !important;
    }
}

page-welcome .page-wrapper .secondary-container .footer .user-info {
    width: 100%;
    padding: 2rem 1.5rem 1rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

    page-welcome .page-wrapper .secondary-container .footer .user-info .photo {
        width: 66px;
        height: 66px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 66px;
        -ms-flex: 0 0 66px;
        flex: 0 0 66px;
        background-color: #eaf0f3;
        background-position: center;
        background-size: cover;
        border-radius: 0.5rem;
        -webkit-box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
    }

    page-welcome .page-wrapper .secondary-container .footer .user-info .no-photo {
        width: 66px;
        height: 66px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 66px;
        -ms-flex: 0 0 66px;
        flex: 0 0 66px;
        background: -webkit-gradient(linear, left top, right bottom, from(#00d45a), to(#28b52e));
        background: linear-gradient(to bottom right, #00d45a, #28b52e);
        border-radius: 0.5rem;
        -webkit-box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
        box-shadow: 0 6px 12px -6px rgba(0, 0, 0, 0.5);
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

        page-welcome .page-wrapper .secondary-container .footer .user-info .no-photo span {
            color: white;
            font-size: 36px;
            font-weight: 700;
            text-transform: uppercase;
            text-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
        }

    page-welcome .page-wrapper .secondary-container .footer .user-info .info-container {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        overflow: hidden;
        padding-left: 1rem;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }

        page-welcome .page-wrapper .secondary-container .footer .user-info .info-container .name {
            font-size: 18px;
            font-weight: 700;
            margin-top: 1rem;
            letter-spacing: -0.5px;
            margin: 0;
            color: #212121;
            text-transform: capitalize;
        }

        page-welcome .page-wrapper .secondary-container .footer .user-info .info-container .email,
        page-welcome .page-wrapper .secondary-container .footer .user-info .info-container .perfil {
            display: block;
            font-size: 12px;
            font-weight: 400;
            color: #525252;
        }

        page-welcome .page-wrapper .secondary-container .footer .user-info .info-container .perfil {
            font-size: 12px;
        }

            page-welcome .page-wrapper .secondary-container .footer .user-info .info-container .perfil span {
                color: #00d45a;
                font-weight: 700;
                text-transform: uppercase;
            }

page-welcome .page-wrapper .secondary-container .footer .buttons-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

    page-welcome .page-wrapper .secondary-container .footer .buttons-container .mat-slide-toggle {
        z-index: 8;
        margin-top: 0.5rem;
        height: 46px;
    }

        page-welcome .page-wrapper .secondary-container .footer .buttons-container .mat-slide-toggle .mat-slide-toggle-label {
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
            -webkit-flex-direction: row;
            -ms-flex-direction: row;
            flex-direction: row;
            padding: 0 1.5rem;
        }

            page-welcome .page-wrapper .secondary-container .footer .buttons-container .mat-slide-toggle .mat-slide-toggle-label .mat-slide-toggle-bar {
                width: 36px;
                margin-left: 0;
                margin-right: 1rem;
            }

            page-welcome .page-wrapper .secondary-container .footer .buttons-container .mat-slide-toggle .mat-slide-toggle-label .mat-slide-toggle-content {
                font-size: 18px;
                font-weight: 600;
            }

    page-welcome .page-wrapper .secondary-container .footer .buttons-container .btn {
        z-index: 8;
        margin-top: 0.5rem;
        font-weight: 600;
    }

        page-welcome .page-wrapper .secondary-container .footer .buttons-container .btn .icon {
            width: 36px;
            height: 36px;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
            margin: 0;
            margin-right: 1rem;
            padding: 0;
            text-transform: none;
            -webkit-box-shadow: none;
            box-shadow: none;
            border-radius: 50%;
            cursor: pointer;
            background-color: rgba(255, 255, 255, 0.1);
            -webkit-transition: all 0.3s ease;
            transition: all 0.3s ease;
            font-size: 28px;
        }

        page-welcome .page-wrapper .secondary-container .footer .buttons-container .btn:hover .icon {
            font-size: 24px;
        }

            page-welcome .page-wrapper .secondary-container .footer .buttons-container .btn:hover .icon i {
                color: white !important;
            }

        page-welcome .page-wrapper .secondary-container .footer .buttons-container .btn.btn-password .icon i {
            color: #ffa000;
        }

        page-welcome .page-wrapper .secondary-container .footer .buttons-container .btn.btn-password:hover .icon {
            background-color: #ffa000;
        }

        page-welcome .page-wrapper .secondary-container .footer .buttons-container .btn.btn-logout .icon i {
            color: #e02626;
        }

        page-welcome .page-wrapper .secondary-container .footer .buttons-container .btn.btn-logout:hover .icon {
            background-color: #e02626;
        }

page-welcome .page-wrapper .main-container {
    padding: 2rem;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 calc(100% - 300px);
    -ms-flex: 0 0 calc(100% - 300px);
    flex: 0 0 calc(100% - 300px);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

@media screen and (max-width: 480px) {
    page-welcome .page-wrapper .main-container {
        padding: 2rem 1rem;
        border-radius: 0 0 2rem 2rem;
        -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
        z-index: 1;
    }
}

page-welcome .page-wrapper .main-container .container {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

    page-welcome .page-wrapper .main-container .container:nth-child(2) {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

        page-welcome .page-wrapper .main-container .container:nth-child(2) .row {
            height: 100%;
        }

            page-welcome .page-wrapper .main-container .container:nth-child(2) .row .col-12 {
                height: 100%;
            }

page-welcome .page-wrapper .main-container .header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2rem 0;
}

@media screen and (max-width: 480px) {
    page-welcome .page-wrapper .main-container .header {
        padding: 3rem 0;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }
}

page-welcome .page-wrapper .main-container .header .crol-logo {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}

    page-welcome .page-wrapper .main-container .header .crol-logo img {
        max-width: 240px;
        height: auto;
    }

page-welcome .page-wrapper .main-container .container-title {
    padding: 1rem;
    margin: 0 0 0.5rem;
    text-align: left;
    font-size: 18px;
    text-transform: none;
    color: #525252;
}

@media (max-width: 767px) {
    page-welcome .page-wrapper .main-container .container-title {
        font-size: 16px;
    }
}

page-welcome .page-wrapper .main-container .hero {
    width: 100%;
    height: calc(100% - 4rem);
    min-height: 200px;
    border-radius: 1rem;
    margin-bottom: 4rem;
    padding: 4rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

@media screen and (max-width: 480px) {
    page-welcome .page-wrapper .main-container .hero {
        display: none;
    }
}

@media screen and (min-width: 481px) and (max-width: 1024px) {
    page-welcome .page-wrapper .main-container .hero {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }
}

page-welcome .page-wrapper .main-container .hero .title-container {
    position: absolute;
    left: 0;
    bottom: 0;
    line-height: 120%;
    text-decoration: none;
    text-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
    background: -webkit-gradient(linear, left top, right top, from(rgba(51, 51, 51, 0.5)), color-stop(rgba(51, 51, 51, 0.35)), to(transparent));
    background: linear-gradient(to right, rgba(51, 51, 51, 0.5), rgba(51, 51, 51, 0.35), transparent);
    top: 0;
    width: auto;
    border-radius: 1rem 0 0 1rem;
    padding: 3rem 21rem 3rem 3rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

    page-welcome .page-wrapper .main-container .hero .title-container span {
        color: white;
        font-size: 21px;
        font-weight: 500;
        padding-top: 1rem;
        display: block;
    }

@media screen and (min-width: 481px) and (max-width: 1024px) {
    page-welcome .page-wrapper .main-container .hero .title-container span {
        display: none;
    }
}

page-welcome .page-wrapper .main-container .hero .title-container h4 {
    font-size: 48px;
    font-weight: 800;
    text-transform: none;
    margin: 0 0 0 !important;
    color: white;
}

@media screen and (min-width: 481px) and (max-width: 1024px) {
    page-welcome .page-wrapper .main-container .hero .title-container h4 {
        line-height: 1;
    }
}

page-welcome .page-wrapper .main-container .hero .title-container:hover {
    opacity: 1;
}

page-welcome .page-wrapper .main-container .hero:before {
    content: "";
    border-radius: 1rem;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f6f8fc;
    background-size: cover;
    z-index: 0;
}

page-welcome .page-wrapper .main-container .hero.retail:before {
    background-image: url(./../../../assets/imgs/backgrounds/8c.jpg);
    background-position: center top;
}

page-welcome .page-wrapper .main-container .hero.restaurant:before {
    background-image: url(./../../../assets/imgs/backgrounds/7.jpg);
    background-position: center 30%;
}

page-welcome .page-wrapper .main-container .hero.laboratory:before {
    background-image: url(./../../../assets/imgs/backgrounds/9.jpg);
    background-position: center 30%;
}

page-welcome .page-wrapper .main-container .links-container {
    min-height: 50%;
}

@media screen and (max-width: 480px) {
    page-welcome .page-wrapper .main-container .link {
        padding: 0 0.5rem;
    }
}

page-welcome .page-wrapper .main-container .nav-link {
    border-radius: 1rem;
    padding: 2.5rem 2rem;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    min-height: 160px;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    background-color: white;
    position: relative;
    border: 1px solid transparent;
    -webkit-transition: border-color 0.15s, -webkit-box-shadow 0.3s;
    transition: border-color 0.15s, -webkit-box-shadow 0.3s;
    transition: border-color 0.15s, box-shadow 0.3s;
    transition: border-color 0.15s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
}

    page-welcome .page-wrapper .main-container .nav-link i {
        font-size: 52px;
        color: #00d45a;
        -webkit-transition: -webkit-transform 0.3s ease;
        transition: -webkit-transform 0.3s ease;
        transition: transform 0.3s ease;
        transition: transform 0.3s ease, -webkit-transform 0.3s ease;
        position: absolute;
        bottom: 0.5rem;
        right: 2rem;
    }

    page-welcome .page-wrapper .main-container .nav-link img {
        width: auto;
        height: 60px;
        margin: 0 0 0 auto;
        -webkit-transition: -webkit-transform 0.3s ease;
        transition: -webkit-transform 0.3s ease;
        transition: transform 0.3s ease;
        transition: transform 0.3s ease, -webkit-transform 0.3s ease;
        position: absolute;
        bottom: 2rem;
        right: 2rem;
    }

    page-welcome .page-wrapper .main-container .nav-link .module-name {
        font-size: 22px;
        font-weight: 800;
        text-align: left;
        color: #212121;
        max-width: 85%;
    }

        page-welcome .page-wrapper .main-container .nav-link .module-name span {
            display: block;
            font-size: 24px;
            line-height: 24px;
        }

@media (max-width: 1280px) {
    page-welcome .page-wrapper .main-container .nav-link {
        min-height: 155px;
        padding-bottom: calc(2rem + 64px);
    }

        page-welcome .page-wrapper .main-container .nav-link .module-name {
            font-size: 20px;
            max-width: 100%;
        }
}

@media (max-width: 767px) {
    page-welcome .page-wrapper .main-container .nav-link {
        padding: 2rem 2rem 1rem;
    }
}

@media screen and (max-width: 480px) {
    page-welcome .page-wrapper .main-container .nav-link {
        min-height: 140px;
    }

        page-welcome .page-wrapper .main-container .nav-link .module-name {
            font-size: 18px;
        }

            page-welcome .page-wrapper .main-container .nav-link .module-name span {
                line-height: 22px;
            }
}

@media (max-width: 480px) {
    page-welcome .page-wrapper .main-container .nav-link {
        padding: 1.5rem 1rem 1rem;
    }

        page-welcome .page-wrapper .main-container .nav-link img {
            height: 42px;
            bottom: 1.5rem;
        }
}

@media screen and (max-width: 320px) {
    page-welcome .page-wrapper .main-container .nav-link {
        min-height: 140px;
    }

        page-welcome .page-wrapper .main-container .nav-link .module-name {
            font-size: 14px;
        }

            page-welcome .page-wrapper .main-container .nav-link .module-name span {
                line-height: 18px;
            }
}

page-welcome .page-wrapper .main-container .nav-link.disabled {
    opacity: 0.4;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
}

page-welcome .page-wrapper .main-container .nav-link:not(.disabled):hover {
    opacity: 1 !important;
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
    -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

    page-welcome .page-wrapper .main-container .nav-link:not(.disabled):hover i {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

page-welcome .page-wrapper .main-container .welcome-store-logo {
    position: fixed;
    bottom: 3rem;
    right: 3rem;
    height: 240px;
}

    page-welcome .page-wrapper .main-container .welcome-store-logo .logo-container {
        width: 240px;
        height: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
        -ms-flex-align: end;
        align-items: flex-end;
        margin: 0 auto;
    }

        page-welcome .page-wrapper .main-container .welcome-store-logo .logo-container img {
            -webkit-filter: brightness(0);
            filter: brightness(0);
            opacity: 0.15;
            max-height: 90%;
        }

page-welcome .page-wrapper .main-container .form-group .mat-checkbox .mat-checkbox-layout .mat-checkbox-label {
    font-size: 16px;
    font-weight: 600;
    line-height: 18px;
}

    page-welcome .page-wrapper .main-container .form-group .mat-checkbox .mat-checkbox-layout .mat-checkbox-label small {
        display: block;
        white-space: normal;
    }