@import url(https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300;400;500;600&display=swap);

html, body {
    --shadow-1: rgba(0, 0, 0, 0.1);
    --shadow-2: rgba(0, 0, 0, 0.2);
    --shadow-5: rgba(0, 0, 0, 0.5);
    --shadow-8: rgba(0, 0, 0, 0.8);
    --color-brown-1: rgb(234, 221, 202);
    --color-brown-2: rgb(225, 193, 110);
    --color-brown-3: rgb(205, 127, 50);
    --color-brown-4: rgb(165, 42, 42);
    --color-brown-5: rgb(218, 160, 109);
    --color-brown-6: rgb(128, 0, 32);
    --color-brown-7: rgb(233, 116, 81);
    --color-brown-8: rgb(110, 38, 14);
    --color-brown-9: rgb(193, 154, 107);
    --color-brown-10: rgb(149, 69, 53);
    --color-brown-11: rgb(123, 63, 0);
    --color-brown-12: rgb(210, 125, 45);
    --color-brown-13: rgb(111, 78, 55);
    --color-brown-14: rgb(131, 67, 51);
    --color-brown-15: rgb(184, 115, 51);
    --color-brown-16: rgb(129, 65, 65);
    --color-brown-17: rgb(92, 64, 51);
    --color-brown-18: rgb(139, 0, 0);
    --color-brown-19: rgb(152, 133, 88);
    --color-brown-20: rgb(194, 178, 128);
    --color-brown-21: rgb(193, 154, 107);
    --color-brown-22: rgb(229, 170, 112);
    --color-brown-23: rgb(154, 42, 42);
    --color-brown-24: rgb(150, 105, 25);
    --color-brown-25: rgb(240, 230, 140);
    --color-brown-26: rgb(196, 164, 132);
    --color-brown-27: rgb(192, 64, 0);
    --color-brown-28: rgb(128, 0, 0);
    --color-brown-29: rgb(150, 121, 105);
    --color-brown-30: rgb(242, 210, 189);
    --color-brown-31: rgb(204, 119, 34);
    --color-brown-32: rgb(128, 128, 0);
    --color-brown-33: rgb(74, 4, 4);
    --color-brown-34: rgb(169, 92, 104);
    --color-brown-35: rgb(165, 42, 42);
    --color-brown-36: rgb(145, 56, 49);
    --color-brown-37: rgb(128, 70, 27);
    --color-brown-38: rgb(139, 69, 19);
    --color-brown-39: rgb(194, 178, 128);
    --color-brown-40: rgb(160, 82, 45);
    --color-brown-41: rgb(210, 180, 140);
    --color-brown-42: rgb(72, 60, 50);
    --color-brown-43: rgb(124, 48, 48);
    --color-brown-44: rgb(245, 222, 179);
    --color-brown-45: rgb(114, 47, 55);
    --color-orange-1: rgb(255, 191, 0);
    --color-orange-2: rgb(251, 206, 177);
    --color-orange-3: rgb(242, 210, 189);
    --color-orange-4: rgb(255, 172, 28);
    --color-orange-5: rgb(205, 127, 50);
    --color-orange-6: rgb(218, 160, 109);
    --color-orange-7: rgb(204, 85, 0);
    --color-orange-8: rgb(233, 116, 81);
    --color-orange-9: rgb(227, 150, 62);
    --color-orange-10: rgb(242, 140, 40);
    --color-orange-11: rgb(210, 125, 45);
    --color-orange-12: rgb(184, 115, 51);
    --color-orange-13: rgb(255, 127, 80);
    --color-orange-14: rgb(248, 131, 121);
    --color-orange-15: rgb(139, 64, 0);
    --color-orange-16: rgb(250, 213, 165);
    --color-orange-17: rgb(228, 155, 15);
    --color-orange-18: rgb(255, 192, 0);
    --color-orange-19: rgb(218, 165, 32);
    --color-orange-20: rgb(255, 213, 128);
    --color-orange-21: rgb(192, 64, 0);
    --color-orange-22: rgb(244, 187, 68);
    --color-orange-23: rgb(255, 222, 173);
    --color-orange-24: rgb(255, 95, 31);
    --color-orange-25: rgb(204, 119, 34);
    --color-orange-26: rgb(255, 165, 0);
    --color-orange-27: rgb(250, 200, 152);
    --color-orange-28: rgb(255, 229, 180);
    --color-orange-29: rgb(236, 88, 0);
    --color-orange-30: rgb(248, 152, 128);
    --color-orange-31: rgb(227, 83, 53);
    --color-orange-32: rgb(255, 117, 24);
    --color-orange-33: rgb(255, 68, 51);
    --color-orange-34: rgb(255, 95, 21);
    --color-orange-35: rgb(250, 128, 114);
    --color-orange-36: rgb(255, 245, 238);
    --color-orange-37: rgb(160, 82, 45);
    --color-orange-38: rgb(250, 95, 85);
    --color-orange-39: rgb(240, 128, 0);
    --color-orange-40: rgb(227, 115, 94);
    --color-orange-41: rgb(255, 170, 51);
    --color-red-1: rgb(136, 8, 8);
    --color-red-2: rgb(170, 74, 68);
    --color-red-3: rgb(238, 75, 43);
    --color-red-4: rgb(165, 42, 42);
    --color-red-5: rgb(128, 0, 32);
    --color-red-6: rgb(110, 38, 14);
    --color-red-7: rgb(204, 85, 0);
    --color-red-8: rgb(233, 116, 81);
    --color-red-9: rgb(112, 41, 99);
    --color-red-10: rgb(210, 43, 43);
    --color-red-11: rgb(196, 30, 58);
    --color-red-12: rgb(215, 0, 64);
    --color-red-13: rgb(222, 49, 99);
    --color-red-14: rgb(210, 4, 45);
    --color-red-15: rgb(149, 69, 53);
    --color-red-16: rgb(129, 19, 49);
    --color-red-17: rgb(248, 131, 121);
    --color-red-18: rgb(129, 65, 65);
    --color-red-19: rgb(220, 20, 60);
    --color-red-20: rgb(139, 0, 0);
    --color-red-21: rgb(123, 24, 24);
    --color-red-22: rgb(154, 42, 42);
    --color-red-23: rgb(192, 64, 0);
    --color-red-24: rgb(128, 0, 0);
    --color-red-25: rgb(152, 104, 104);
    --color-red-26: rgb(119, 7, 55);
    --color-red-27: rgb(255, 49, 49);
    --color-red-28: rgb(74, 4, 4);
    --color-red-29: rgb(250, 160, 160);
    --color-red-30: rgb(236, 88, 0);
    --color-red-31: rgb(227, 83, 53);
    --color-red-32: rgb(169, 92, 104);
    --color-red-33: rgb(227, 11, 92);
    --color-red-34: rgb(255, 0, 0);
    --color-red-35: rgb(165, 42, 42);
    --color-red-36: rgb(145, 56, 49);
    --color-red-37: rgb(255, 68, 51);
    --color-red-38: rgb(149, 53, 83);
    --color-red-39: rgb(194, 30, 86);
    --color-red-40: rgb(224, 17, 95);
    --color-red-41: rgb(128, 70, 27);
    --color-red-42: rgb(250, 128, 114);
    --color-red-43: rgb(255, 36, 0);
    --color-red-44: rgb(250, 95, 85);
    --color-red-45: rgb(227, 115, 94);
    --color-red-46: rgb(124, 48, 48);
    --color-red-47: rgb(99, 3, 48);
    --color-red-48: rgb(164, 42, 4);
    --color-red-49: rgb(227, 66, 52);
    --color-red-50: rgb(114, 47, 55);
    overscroll-behavior: none;
    /*font-family: MogulR !important;*/
}

@font-face {
    font-family: 'MogulR';
    src: url("../fonts/Mogul-Rotonda.woff") format('woff');
}

@font-face {
    font-family: "MogulR";
    src: url("../fonts/Mogul-Rotonda-Bold.woff") format('woff');
    font-weight: bold;
}

@font-face {
    font-family: "MogulR";
    src: url("../fonts/Mogul-Rotonda-Bold-Italic.woff") format('woff');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: "MogulR";
    src: url("../fonts/Mogul-Rotonda-Italic.woff") format('woff');
    font-style: italic;
}

@font-face {
    font-family: 'MogulF';
    src: url("../fonts/Mogul-Freeset.woff") format('woff');
}

@font-face {
    font-family: "MogulF";
    src: url("../fonts/Mogul-Freeset-Bold.woff") format('woff');
    font-weight: bold;
}

@font-face {
    font-family: "MogulF";
    src: url("../fonts/Mogul-Freeset-Bold-Italic.woff") format('woff');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: "MogulF";
    src: url("../fonts/Mogul-Freeset-Italic.woff") format('woff');
    font-style: italic;
}

.ww-font-mogulr {
    font-family: MogulR;
}

.ww-font-mogulf {
    font-family: MogulF;
}

h1:focus {
    outline: none;
}

a, .btn-link {
    color: #0071c1;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.content {
    padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-thumb {
    background-color: rgba(47, 128, 237,0.2);
    border-radius: 10rem;
    border: 1px solid transparent;
}


::-webkit-scrollbar-track-piece:start {
    background: transparent;
}

::-webkit-scrollbar-track-piece:end {
    background: transparent;
}

.ww-layout-1 {
    display: flex;
    flex-wrap: wrap;
}

.ww-model-1 {
    background-color: #fff;
    padding: 1rem;
    padding-bottom: .3rem;
    border-radius: 5px;
    border: 1px solid var(--bs-border-color);
    border-left: 3px solid var(--bs-indigo);
    color: var(--bs-gray-600);
    position: relative;
}

    .ww-model-1.active {
        background: rgba(81, 86, 190, .1);
        border-color: transparent;
        border-left: 3px solid var(--bs-purple);
    }

.ww-title-1 {
    color: var(--bs-gray-600);
    font-size: 1.1rem;
    font-weight: 500;
}

.ww-title-2 {
    color: var(--bs-gray-700);
    font-size: 1rem;
    font-weight: 500;
}

.ww-btn-model {
    position: absolute;
    border-radius: 3px;
    /*border-top-left-radius: 5px;
    border-bottom-right-radius: 5px;*/
    transition: all 0.3s ease 0s;
    bottom: 3px;
    right: 3px;
    background-color: rgb(255, 255, 255, 0.7);
}

    .ww-btn-model .btn {
        color: #5156be;
    }

.btn.ww-btn-circle {
    color: var(--bs-gray-700);
    font-weight: 500;
    border-radius: 50px;
    background-color: var(--bs-gray-200);
    margin: 1rem;
    cursor: pointer;
}

.btn-soft-primary {
    /*background-color: #fff;
    color: black;*/
    color: #5156be;
    /*color: #313132;*/
    /*color: #1EBAD6;*/
    background-color: rgba(81, 86, 190, .1);
    border-color: transparent
}

    .btn-soft-primary:active,
    .btn-soft-primary:focus,
    .btn-soft-primary:hover {
        color: #fff;
        background-color: #5156be
    }

    .btn-soft-primary:focus {
        -webkit-box-shadow: 0 0 0 .15rem rgba(81, 86, 190, .5);
        box-shadow: 0 0 0 .15rem rgba(81, 86, 190, .5)
    }

.btn-soft-success {
    color: #2ab57d;
    background-color: rgba(42, 181, 125, .1);
    border-color: transparent
}

    .btn-soft-success:active,
    .btn-soft-success:focus,
    .btn-soft-success:hover {
        color: #fff;
        background-color: #2ab57d
    }

    .btn-soft-success:focus {
        -webkit-box-shadow: 0 0 0 .15rem rgba(42, 181, 125, .5);
        box-shadow: 0 0 0 .15rem rgba(42, 181, 125, .5)
    }

.waves-effect {
    position: relative;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent
}

    .waves-effect .waves-ripple {
        position: absolute;
        border-radius: 50%;
        width: 100px;
        height: 100px;
        margin-top: -50px;
        margin-left: -50px;
        opacity: 0;
        background: rgba(0, 0, 0, .2);
        background: radial-gradient(rgba(0, 0, 0, .2) 0, rgba(0, 0, 0, .3) 40%, rgba(0, 0, 0, .4) 50%, rgba(0, 0, 0, .5) 60%, rgba(255, 255, 255, 0) 70%);
        -webkit-transition: all .5s ease-out;
        transition: all .5s ease-out;
        -webkit-transition-property: -webkit-transform, opacity;
        -webkit-transition-property: opacity, -webkit-transform;
        transition-property: opacity, -webkit-transform;
        transition-property: transform, opacity;
        transition-property: transform, opacity, -webkit-transform;
        -webkit-transform: scale(0) translate(0, 0);
        transform: scale(0) translate(0, 0);
        pointer-events: none
    }

    .waves-effect.waves-light .waves-ripple {
        background: rgba(255, 255, 255, .4);
        background: radial-gradient(rgba(255, 255, 255, .2) 0, rgba(255, 255, 255, .3) 40%, rgba(255, 255, 255, .4) 50%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0) 70%)
    }

    .waves-effect.waves-classic .waves-ripple {
        background: rgba(0, 0, 0, .2)
    }

    .waves-effect.waves-classic.waves-light .waves-ripple {
        background: rgba(255, 255, 255, .4)
    }

.waves-notransition {
    -webkit-transition: none !important;
    transition: none !important
}

.waves-button,
.waves-circle {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-mask-image: -webkit-radial-gradient(circle, #fff 100%, #000 100%)
}

    .waves-button,
    .waves-button-input,
    .waves-button:hover,
    .waves-button:visited {
        white-space: nowrap;
        vertical-align: middle;
        cursor: pointer;
        border: none;
        outline: 0;
        color: inherit;
        background-color: rgba(0, 0, 0, 0);
        font-size: 1em;
        line-height: 1em;
        text-align: center;
        text-decoration: none;
        z-index: 1
    }

.waves-button {
    padding: .85em 1.1em;
    border-radius: .2em
}

.waves-button-input {
    margin: 0;
    padding: .85em 1.1em
}

.waves-input-wrapper {
    border-radius: .2em;
    vertical-align: bottom
}

    .waves-input-wrapper.waves-button {
        padding: 0
    }

    .waves-input-wrapper .waves-button-input {
        position: relative;
        top: 0;
        left: 0;
        z-index: 1
    }

.waves-circle {
    text-align: center;
    width: 2.5em;
    height: 2.5em;
    line-height: 2.5em;
    border-radius: 50%
}

.waves-float {
    -webkit-mask-image: none;
    -webkit-box-shadow: 0 1px 1.5px 1px rgba(0, 0, 0, .12);
    box-shadow: 0 1px 1.5px 1px rgba(0, 0, 0, .12);
    -webkit-transition: all .3s;
    transition: all .3s
}

    .waves-float:active {
        -webkit-box-shadow: 0 8px 20px 1px rgba(0, 0, 0, .3);
        box-shadow: 0 8px 20px 1px rgba(0, 0, 0, .3)
    }

.waves-block {
    display: block
}

.waves-effect.waves-light .waves-ripple {
    background-color: rgba(255, 255, 255, .4)
}

.waves-effect.waves-primary .waves-ripple {
    background-color: rgba(81, 86, 190, .4)
}

.waves-effect.waves-success .waves-ripple {
    background-color: rgba(42, 181, 125, .4)
}

.waves-effect.waves-info .waves-ripple {
    background-color: rgba(75, 166, 239, .4)
}

.waves-effect.waves-warning .waves-ripple {
    background-color: rgba(255, 191, 83, .4)
}

.waves-effect.waves-danger .waves-ripple {
    background-color: rgba(253, 98, 94, .4)
}

.btn-label {
    position: relative;
    padding-left: 44px;
    border: none
}

    .btn-label .label-icon {
        position: absolute;
        width: 32px;
        height: 100%;
        left: 0;
        top: 0;
        background-color: rgba(255, 255, 255, .15);
        font-size: 16px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    .btn-label.btn-light .label-icon {
        background-color: rgba(52, 58, 64, .1)
    }

    .btn-label.btn-soft-light .label-icon {
        background-color: rgba(52, 58, 64, .05)
    }

.form-label.inputmaxlength {
    font-size: .7rem;
}

.redstar {
    color: var(--bs-pink);
}

.card-header {
    background-color: #fff;
}

.bsoftsvg-loader {
    margin-top: 2.5em;
    display: flex;
    position: relative;
    align-content: space-around;
    justify-content: center;
}

.bsoftloader-svg {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    fill: none;
    stroke-width: 4px;
    stroke-linecap: round;
    stroke: #5156be;
}

    .bsoftloader-svg.bg {
        stroke-width: 4px;
        stroke: rgba(81, 86, 190, .1);
    }

.bsoftanimate {
    stroke-dasharray: 242.6;
    animation: bsoftfill-animation 1.5s cubic-bezier(1,1,1,1) 0s infinite;
}

@keyframes bsoftfill-animation {
    0% {
        stroke-dasharray: 40 242.6;
        stroke-dashoffset: 282.6;
    }

    50% {
        stroke-dasharray: 141.3;
        stroke-dashoffset: 141.3;
    }

    100% {
        stroke-dasharray: 40 242.6;
        stroke-dashoffset: 0;
    }
}

.container {
    text-align: center;
}

.progress-container {
    display: flex;
    justify-content: space-between;
    position: relative;
    max-width: 100%;
    width: 100%;
    /*width: 350px;*/
}

    .progress-container::before {
        content: '';
        background-color: var(--bs-gray-800);
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        height: 4px;
        width: 100%;
        z-index: -1;
    }

.progress {
    /*background-color: #eeeef9;*/
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    transform: translateY(-50%);
    height: 2px !important;
    z-index: 0;
    transition: 0.4s ease;
    padding-right: 20px;
    padding-left: 20px;
}

.circle {
    background-color: #fff;
    color: #494dab;
    border-radius: 50%;
    height: 40px;
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(81,86,190,.2);
    transition: 0.4s ease;
    z-index: 0;
    font-size: 1.2rem;
    font-weight: 500;
    position: relative;
}

    .circle.active {
        background-color: #eeeef9;
        color: #494dab;
    }

    .circle.current {
        background-color: #494dab;
        color: #eeeef9;
    }

.ww-wizard-hdr {
    font-size: 1.3rem;
    font-weight: 500;
    color: #fff;
    background-color: #494dab;
    position: absolute;
    right: 2rem;
    top: 43px;
    width: auto !important;
    border-radius: 5px;
    padding: 0 10px;
    z-index: 10;
}

/* Grid control*/

.bstable {
}

    .bstable th {
        color: var(--bs-gray-600);
    }

    .bstable tfoot th {
        color: var(--bs-gray-500);
        /*font-size: .9rem;*/
    }

        .bstable tfoot th:hover {
            color: var(--bs-gray-600);
        }

    /*.bstable table tbody {
        display: block;
        max-height: 300px;
        overflow-y: scroll;
    }

        .bstable table thead, .bstable table tbody tr {
            display: table;
            width: 100%;
            table-layout: fixed;
        }

        .bstable table thead, .bstable table tbody tr {
            display: table;
            width: 100%;
            table-layout: fixed;
        }*/

    .bstable thead {
        background-color: #fbfaff;
    }

    .bstable tfoot {
        background-color: #fbfaff;
    }

    .bstable td {
        height: 1px;
        white-space: nowrap;
    }

/* TREE VIEW */
.bstreeviewtable {
    display: table;
    margin: 0px;
    padding: 0px;
    width: 100%;
    border-style: solid;
    border-width: 0;
    border-color: #e9e9ef;
    border-width: 1px;
}

.bstreeviewhdr {
    color: var(--bs-gray-600);
    display: table-row;
    white-space: nowrap;
    background-color: var(--bs-gray-100);
}

    .bstreeviewhdr > span {
        list-style: none;
        display: table-cell;
        padding: 0.75rem 1rem;
        cursor: pointer;
        position: relative;
        box-sizing: content-box;
        font-weight: 700;
        border-style: solid;
        border-width: 0;
        border-color: #e9e9ef;
        border-bottom-width: 1px;
    }

.bstreeviewtable .bsselectedrow {
    background-color: rgba(81, 86, 190, .1);
}

.bstreeviewftr {
    display: table-row;
    background-color: var(--bs-gray-100);
}

    .bstreeviewftr > span {
        list-style: none;
        display: table-cell;
        color: var(--bs-gray-500);
        letter-spacing: 0.05rem;
        font-size: 0.7rem;
        padding: 0.75rem 1rem;
        cursor: pointer;
        position: relative;
        box-sizing: content-box;
        font-weight: 700;
    }

        .bstreeviewftr > span:hover {
            color: var(--bs-gray-600);
        }

.bstreeviewbody {
    display: table-row-group;
}

.bstreeviewrow {
    display: table-row;
}

    .bstreeviewrow span.blborder {
        list-style: none;
        display: table-cell;
        padding: 0.75rem 0.75rem;
        vertical-align: inherit;
        white-space: nowrap;
        border-style: solid;
        border-width: 0;
        border-color: #e9e9ef;
        border-left-width: 1px;
        border-bottom-width: 1px;
    }

    .bstreeviewrow span.bborder {
        list-style: none;
        display: table-cell;
        padding: 0.75rem 0;
        vertical-align: inherit;
        white-space: nowrap;
        border-style: solid;
        border-width: 0;
        border-color: #e9e9ef;
        border-bottom-width: 1px;
    }

    .bstreeviewrow span.lborder {
        list-style: none;
        display: table-cell;
        padding: 0.75rem 0.75rem;
        display: table-cell;
        border-style: solid;
        border-width: 0;
        border-color: #e9e9ef;
    }

    .bstreeviewrow span.treecol {
        list-style: none;
        vertical-align: inherit;
        white-space: nowrap;
        /*border-style: solid;
        border-width: 0;
        border-color: #e9e9ef;
        border-bottom-width: 1px;*/
    }

    .bstreeviewrow label {
        margin-bottom: 0;
    }

.bstreenodespace {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.bstreenodeicon {
    min-width: 1rem;
    text-align: center;
    font-weight: bold;
    color: var(--bs-brandcolor);
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

/* BSTEXTBOX*/

#bstextbox {
    margin-top: 0.4em;
    max-width: 100%;
    min-width: 150px;
}

    #bstextbox input, select {
        width: 100%;
        border: 1px solid var(--bs-gray-200);
        border-left: 1px solid var(--bs-brandcolor);
        border-radius: 1px;
        outline: none;
        background-color: var(--bs-gray-100);
        color: var(--bs-gray-700);
        padding: 3px 7px;
    }

    #bstextbox label.tstextboxplaceholder {
        float: left;
        font-size: 0.7em;
        font-weight: 700;
        text-transform: uppercase;
        color: var(--bs-gray-500);
        letter-spacing: 0.05rem;
        margin-left: 7px;
    }

    #bstextbox:focus-within input,
    #bstextbox:focus-within select,
    #bstextbox:focus-within label.tstextboxplaceholder,
    #bstextbox:hover input,
    #bstextbox:hover select,
    #bstextbox:hover label {
        border-color: var(--bs-brandcolor);
    }

    #bstextbox:focus-within label.tstextboxplaceholder,
    #bstextbox:hover:not(:focus) label.tstextboxplaceholder {
        color: var(--bs-brandcolor);
        text-shadow: 0px 0px 2px var(--bs-gray-400);
    }

    #bstextbox input:focus,
    #bstextbox input:not( :placeholder-shown),
    #bstextbox input:-webkit-autofill {
        background-color: transparent;
    }

    #bstextbox:focus-within input,
    #bstextbox:focus-within select {
        box-shadow: 0px 0px 1px 1px var(--bs-gray-400);
    }

    #bstextbox span.redstar {
        color: var(--bs-pink);
    }

    #bstextbox label.inputmaxlength {
        color: transparent;
        font-size: 0.7em;
        pointer-events: none;
        float: right;
    }

    #bstextbox:focus-within label.inputmaxlength {
        color: var(--bs-gray-600);
    }

    #bstextbox input.bsnumber {
        text-align: right;
    }

    #bstextbox option.bscombo-option-null {
        color: var(--bs-gray-500);
    }

    #bstextbox option {
        background: #fff;
        border: 0px;
        line-height: 50px;
        outline: none;
        -webkit-box-shadow: 0 0 3px 1px #c00;
        -moz-box-shadow: 0 0 3px 1px #c00;
        box-shadow: 0 0 3px 1px #c00;
    }

#bswidth {
    max-width: 150px;
}

/* BsCheckBox*/

.bsCheckbox {
    position: center;
    margin-top: 7px;
    width: 100%;
}

.bscheckboxlabel {
    display: block;
    position: relative;
    padding-left: 25px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: var(--bs-gray-700);
}

    /* Hide the browser's default checkbox */
    .bscheckboxlabel input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #eee;
    border: 1px solid var(--bs-brandcolor);
    border-radius: 3px;
}

/* On mouse-over, add a grey background color */
.bscheckboxlabel:focus-within input ~ .checkmark,
.bscheckboxlabel:hover input ~ .checkmark {
    background-color: var(--bs-gray-300);
    box-shadow: 0px 0px 1px 1px var(--bs-gray-500);
}

.bscheckboxlabel:focus-within,
.bscheckboxlabel:hover {
    font-weight: 600;
}

/* When the checkbox is checked, add a blue background */
.bscheckboxlabel input:checked ~ .checkmark {
    background-color: var(--bs-brandcolor);
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.bscheckboxlabel input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.bscheckboxlabel .checkmark:after {
    left: 6px;
    top: 2px;
    width: 6px;
    height: 12px;
    border: solid white;
    border-width: 0 3px 3px 0;
    border-radius: 1px;
    -webkit-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    transform: rotate(50deg);
}

.bsdatepicker-redstar {
    color: #ea4335;
}


/* New Component Style Minia */

label.bsinputlabel {
    color: var(--bs-gray-600);
}

    label.bsinputlabel span.redstar {
        color: var(--bs-pink);
    }

#bsinput label.inputmaxlength {
    color: transparent;
    font-size: 0.7em;
    pointer-events: none;
    float: right;
    margin-bottom: 0;
    margin-top: 6px;
}

#bsinput input.bsinputnumber {
    text-align: right;
    max-width: 210px;
}

#bsinput input.bsinputDate {
    max-width: 210px;
}

#bsinput:focus-within label.inputmaxlength {
    color: var(--bs-gray-600);
}

#bscodeedit input.cdeinputid {
    max-width: 210px;
    min-width: 150px;
}

#bscodeedit input.cdeinputname {
    min-width: 100px;
}

option.bscombo-option-null {
    color: var(--bs-gray-500);
}

#bscodeeditrepository {
    min-width: 180px;
    margin: -1px;
    margin-right: 0px;
    margin-left: 0px;
}

    #bscodeeditrepository .cdeinput {
        padding: 0.75rem 0.75rem;
        border-radius: 0;
        background-color: transparent;
        border-color: transparent;
        border-width: 1px;
    }

    #bscodeeditrepository:focus-within input.cdeinput {
        background-color: white;
        border-color: var(--bs-input-focus-border);
    }

    #bscodeeditrepository .cdebtn {
        padding-left: 3px;
        padding-right: 3px;
    }

.btngridremove {
    height: 100%;
    padding-left: 3px;
    padding-right: 3px;
}
/* BSDynamicInput */
#bsdynamicinput {
    min-width: 100px;
    margin: -1px;
    margin-right: 0px;
    margin-left: 0px;
    display: flex;
}

    #bsdynamicinput .bs-input-text {
        padding: 0.75rem 0.75rem;
        border-radius: 0;
        background-color: transparent;
        border-color: transparent;
        border-width: 1px;
    }

        #bsdynamicinput .bs-input-text:focus {
            background-color: white;
            border-color: var(--bs-input-focus-border);
        }

    #bsdynamicinput .bs-input-check {
        margin: auto;
        margin-top: 1rem;
    }

    #bsdynamicinput .bsrigth {
        text-align: right;
    }

.bsdisable:disabled {
    background-color: var(--bs-gray-100) !important;
}


.ww-basic-container {
    overflow-x: auto;
}

.ww-basic-modal {
    height: 40px;
    min-width: 100px;
    border: 1px solid var(--bs-gray-600);
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--bs-gray-600);
    padding-right: 5px;
    padding-left: 5px;
    background-color: var(--bs-gray-100);
}

    .ww-basic-modal.searchbtn {
        min-width: 50px;
    }

    .ww-basic-modal.lbz {
        border-left: 0;
    }

    .ww-basic-modal.tbz {
        border-top: 0;
    }

.ww-basic-container-item {
    max-height: calc(100vh - 120px);
    overflow: auto;
    display: flex;
    flex-wrap: wrap;
}

.ww-basic-modal-item {
    height: 180px;
    width: 140px;
    margin: 5px;
    background-repeat: no-repeat;
    background-color: var(--bs-gray-100);
    background-position: top;
    background-size: cover;
    position: relative;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 2px 0px;
    /*box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px, rgb(209, 213, 219) 0px 0px 0px 1px inset;*/
    transition: transform .2s;
}

    .ww-basic-modal-item .ww-basic-modal-item-img_layout {
        height: 140px;
        width: 140px;
    }

    .ww-basic-modal-item .ww-basic-modal-item-img {
        height: 100%;
        width: 100%;
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
    }

    .ww-basic-modal-item .ww-basic-modal-item-name-container {
        width: 100%;
        background-color: rgba(255, 255, 255, 0.4);
        position: absolute;
        bottom: 0;
    }

    .ww-basic-modal-item .ww-basic-modal-item-id {
        font-weight: 400;
        color: var(--bs-gray-700);
        padding: 0 1rem;
        text-align: center;
    }

    .ww-basic-modal-item .ww-basic-modal-item-name {
        color: var(--bs-gray-800);
        font-weight: 400;
        padding: 0 .5rem;
        text-align: center;
    }

    .ww-basic-modal-item.active {
        box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;
        /*box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;*/
        border: 1px solid var(--bs-gray-400);
        transform: scale(1.05);
    }

.ww-basic-container-footer {
    width: 100%;
    padding: .5rem;
    border-top: 1px solid #E4E6EB;
}

.card.ww-card {
    box-shadow: 0 1px 2px var(--shadow-2) !important;
    border: 0 !important;
    border-radius: 10px;
}

.row-divider {
    width: 100%;
    border-top: 1px solid #E4E6EB;
    margin-top: .5rem;
    margin-bottom: .8rem;
}

.ww-basic-table {
    font-size: .8rem;
}

    .ww-basic-table table {
        border-spacing: 5px;
    }

    .ww-basic-table thead {
        background-color: var(--bs-header-bg);
    }

    .ww-basic-table th,
    .ww-basic-table td {
        padding: .25rem !important;
    }


.ww-card-title {
    position: absolute;
    left: 1rem;
    top: -.9rem;
    background-color: var(--bs-modal-bg);
    padding: 0 .5rem;
    font-size: 1rem;
    font-weight: 500;
    color: var(--bs-gray-500);
}

.ww-order-page {
    /*background-color: #f7f0da !important;*/
    background-image: url('https://serverapp.wiseworks.mn/Images/NewYearImages/backgreen.png');
    font-family: MogulR;
    font-weight: 700;
    padding-bottom: 300px;
}

    .ww-order-page .ww-order-page-hdr {
        width: 100%;
        background-color: #009844;
        padding: 1rem;
    }

        .ww-order-page .ww-order-page-hdr .ww-order-page-hdr-img img {
            width: 100%;
        }

    .ww-order-page .btn {
        font-weight: 700;
        text-transform: uppercase;
    }

        .ww-order-page .btn.btn-danger {
            background-color: #E6002E;
        }

    .ww-order-page .ww-hdr-sub-img {
        display: none;
    }

    .ww-order-page .swal2-popup {
        /*background: rgba(255, 255, 255, .8);*/
        /*background: url('https://serverapp.wiseworks.mn/Images/NewYearImages/bg-1.png') repeat-x center 0;*/
        /*opacity: .2;*/
    }

.ww-order {
    margin: .5rem;
    padding-bottom: 2rem;
}

    .ww-order .ww-card {
        padding: .4rem;
        width: 100%;
        position: relative;
    }

        .ww-order .ww-card .card {
            margin-bottom: 0;
            background-color: var(--bs-gray-100);
            transition: all .3s ease-in-out;
            border: 4px double #f1e6b2;
            border-radius: 1rem;
            height: 100%;
            /*box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;*/
        }

    .ww-order .ww-product-name {
        font-size: 1.3rem;
        text-transform: uppercase;
        color: #188649;
        text-align: center;
        transition: all .2s ease-in-out;
        min-height: 60px;
    }

    .ww-order .ww-card .ww-product-border-line {
        border: 1px solid #f1e6b2;
        border-right: none;
        border-left: none;
        padding-top: 1px;
    }

.ww-product-border-bakery {
    text-align: center;
    background: url(https://cdn.greensoft.mn/uploads/users/45/images/ildvvr.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.ww-order .ww-card .ww-product-price {
    font-size: 1.3rem;
    text-transform: uppercase;
    color: #EC7063;
    text-align: center;
    transition: all .2s ease-in-out;
    margin-top: 1rem;
}

.ww-order-product-note {
    text-align: center;
}

.ww-order .ww-card .ww-product-balance {
    padding: 6px;
    border: 1px solid;
}

.ww-order .ww-card:hover .card {
    /*transform: scale(1.01);*/
    /*background-color: var(--bs-gray-100);*/
    /*box-shadow: rgba(13, 70, 51, 0.15) 0px 2px 4px 0px, rgba(13, 70, 51, 0.32) 0px 2px 16px 0px;*/
}

.ww-order .ww-card .ww-card-border-circle {
    content: "";
    position: absolute;
    border: 1px solid #f1e6b2;
    background: #f7f0da;
    /*background: #F0F2F5;*/
    height: 20px;
    width: 20px;
}

    .ww-order .ww-card .ww-card-border-circle.ww-card-border-circle-left-top {
        top: .4rem;
        left: .4rem;
        border-top: none;
        border-left: none;
        border-radius: 0 0 20px 0;
    }

    .ww-order .ww-card .ww-card-border-circle.ww-card-border-circle-rigth-top {
        top: .4rem;
        right: .4rem;
        border-top: none;
        border-right: none;
        border-radius: 0 0 0 20px;
    }

    .ww-order .ww-card .ww-card-border-circle.ww-card-border-circle-left-bottom {
        bottom: 0px;
        left: .4rem;
        border-bottom: none;
        border-left: none;
        border-radius: 0 20px 0 0;
    }

    .ww-order .ww-card .ww-card-border-circle.ww-card-border-circle-rigth-bottom {
        bottom: 0px;
        right: .4rem;
        border-bottom: none;
        border-right: none;
        border-radius: 20px 0 0 0;
    }

.ww-order .ww-card .card img {
    transition: 0.2s transform ease-in-out;
}

.ww-order .ww-card .card:hover {
    cursor: pointer;
}

    .ww-order .ww-card .card:hover img.card-img-top {
        transform: scale(1.05);
    }

.ww-order-dialog {
}

    .ww-order-dialog .modal-content {
        opacity: 0;
        animation: showMeToUp .3s forwards;
        text-transform: uppercase;
        background-color: #f9f4e9;
    }

    /*.ww-order-dialog .ww-order-right-area > :first-child:after {
        content: "";
        display: block;
        position: absolute;
        top: 5%;
        left: 485px;
        width: 1px;
        height: 90%;
        background-color: #ebe7e0;
    }*/

    .ww-order-dialog .ww-order-right-area .ww-order-product-title {
        font-size: 1.3rem;
        text-transform: uppercase;
        color: #188649;
        text-align: center;
        transition: all .2s ease-in-out;
    }

.ww-order .ww-card .ww-order-product-price {
    text-align: center;
    color: #E6002E;
    font-size: 2rem;
}

.ww-order-dialog .ww-order-right-area .ww-order-product-price-name {
    text-align: right;
    color: var(--bs-gray-600);
    padding-right: 1rem;
    padding-top: .6rem;
}

.ww-order-dialog .ww-order-right-area .ww-order-product-price {
    color: #E6002E;
    font-size: 1.5rem;
}

.ww-order-dialog .ww-order-right-area .ww-order-product-info tbody tr td {
    border-bottom: 1px solid #ccc;
    text-align: right;
    padding: 10px 0;
    font-size: 12px;
}

@media (min-width:576px) {
    .ww-order .ww-card {
        width: 50%;
    }
}

@media (min-width:768px) {
    .ww-order .ww-card {
        width: 33.33%;
    }

    .ww-order-page .ww-hdr-sub-img {
        display: block;
    }
}

/*@media (min-width:992px) {
    .ww-order .ww-card {
        width: 25%;
    }
}*/

@media (min-width:1200px) {
    .ww-order {
        margin: 1rem 10rem;
    }
}

@media (min-width:1450px) {
    .ww-order {
        margin: 1rem auto;
        width: 1400px;
    }

        .ww-order .ww-card {
            width: 25%;
        }
}

.ww-basket-fix {
    position: fixed;
    right: 2rem;
    bottom: 2rem;
    height: 3rem;
    width: 3rem;
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0 2px 10px rgba(0,0,0,.3);
    cursor: pointer;
    z-index: 99;
    justify-content: center;
    display: flex;
    align-items: center;
}

.ww-order-customer-fix {
    height: 4rem;
    width: 4rem;
    min-height: 4rem;
    min-width: 4rem;
    border-radius: 50%;
    box-shadow: 0 2px 10px rgba(0,0,0,.3);
    color: rgba(0,0,0,.2);
    cursor: pointer;
    justify-content: center;
    display: flex;
    align-items: center;
    transition: all .3s ease-in-out;
    margin-left: 1rem;
}

    .ww-order-customer-fix:hover {
        color: rgba(0,0,0,.5);
        transform: scale(1.05);
        background-color: rgba(0,0,0,.1);
    }

.ww-basket-fix .bf_icon {
}

.ww-basket-fix .bf_count {
    color: #fff;
    font-size: 12px;
    text-align: center;
    position: absolute;
    content: "";
    top: -5px;
    right: -5px;
    padding: 0 5px;
    height: 20px;
    min-width: 20px;
    background-color: #e4002b;
    border-radius: 50%;
}

.snowflake {
    color: #fff;
    font-size: 1em;
    font-family: Arial;
    text-shadow: 0 0 1px #000;
}

@-webkit-keyframes snowflakes-fall {
    0% {
        top: -10%
    }

    100% {
        top: 100%
    }
}

@-webkit-keyframes snowflakes-shake {
    0% {
        -webkit-transform: translateX(0px);
        transform: translateX(0px)
    }

    50% {
        -webkit-transform: translateX(80px);
        transform: translateX(80px)
    }

    100% {
        -webkit-transform: translateX(0px);
        transform: translateX(0px)
    }
}

@keyframes snowflakes-fall {
    0% {
        top: -10%
    }

    100% {
        top: 100%
    }
}

@keyframes snowflakes-shake {
    0% {
        transform: translateX(0px)
    }

    50% {
        transform: translateX(80px)
    }

    100% {
        transform: translateX(0px)
    }
}

.snowflake {
    position: fixed;
    top: -10%;
    z-index: 9999;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: default;
    -webkit-animation-name: snowflakes-fall,snowflakes-shake;
    -webkit-animation-duration: 10s,3s;
    -webkit-animation-timing-function: linear,ease-in-out;
    -webkit-animation-iteration-count: infinite,infinite;
    -webkit-animation-play-state: running,running;
    animation-name: snowflakes-fall,snowflakes-shake;
    animation-duration: 10s,3s;
    animation-timing-function: linear,ease-in-out;
    animation-iteration-count: infinite,infinite;
    animation-play-state: running,running;
}

    .snowflake:nth-of-type(0) {
        left: 1%;
        -webkit-animation-delay: 0s,0s;
        animation-delay: 0s,0s
    }

    .snowflake:nth-of-type(1) {
        left: 10%;
        -webkit-animation-delay: 1s,1s;
        animation-delay: 1s,1s
    }

    .snowflake:nth-of-type(2) {
        left: 20%;
        -webkit-animation-delay: 6s,.5s;
        animation-delay: 6s,.5s
    }

    .snowflake:nth-of-type(3) {
        left: 30%;
        -webkit-animation-delay: 4s,2s;
        animation-delay: 4s,2s
    }

    .snowflake:nth-of-type(4) {
        left: 40%;
        -webkit-animation-delay: 2s,2s;
        animation-delay: 2s,2s
    }

    .snowflake:nth-of-type(5) {
        left: 50%;
        -webkit-animation-delay: 8s,3s;
        animation-delay: 8s,3s
    }

    .snowflake:nth-of-type(6) {
        left: 60%;
        -webkit-animation-delay: 6s,2s;
        animation-delay: 6s,2s
    }

    .snowflake:nth-of-type(7) {
        left: 70%;
        -webkit-animation-delay: 2.5s,1s;
        animation-delay: 2.5s,1s
    }

    .snowflake:nth-of-type(8) {
        left: 80%;
        -webkit-animation-delay: 1s,0s;
        animation-delay: 1s,0s
    }

    .snowflake:nth-of-type(9) {
        left: 90%;
        -webkit-animation-delay: 3s,1.5s;
        animation-delay: 3s,1.5s
    }
/* Demo Purpose Only*/

@keyframes showMeToUp {
    0% {
        opacity: 0;
        transform: translateY(200px) scale(0.5);
    }

    80% {
        transform: translateY(0);
        transform: scale(1.03);
    }

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


.ww-document-card {
    padding: .5rem .5rem;
    /*background-color: var(--bs-gray-100) !important;*/
    border: 0px !important;
    box-shadow: rgba(81, 86, 190, 0.27) 0px 0px 0.25em, rgba(81, 86, 190, 0.05) 0px 0.25em 1em;
    transition: transform .2s;
}

    .ww-document-card.ww-document-card-selected {
        transform: scale(1.01);
        box-shadow: rgba(81, 86, 190, 0.3) 0px 1px 2px 0px, rgba(81, 86, 190, 0.15) 0px 2px 6px 2px;
    }

.ww-order-comming-soon-time-background-1 {
    width: 100%;
    /*height: fit-content;*/
    margin: 0 !important;
    background: url('https://serverapp.wiseworks.mn/Images/NewYearImages/bg-11.png') repeat-x center 0;
    padding: 1rem;
}

    .ww-order-comming-soon-time-background-1 img {
        max-height: 450px;
        max-width: 450px;
        width: -webkit-fill-available;
    }

.ww-order-comming-soon-time-background-11 {
    width: 100%;
    /*height: fit-content;*/
    margin: 0 !important;
    background: url('https://serverapp.wiseworks.mn/Images/NewYearImages/bg-11.png') repeat-x center 0;
    padding: 1rem;
}

    .ww-order-comming-soon-time-background-11 img {
        max-height: 450px;
        max-width: 450px;
        width: -webkit-fill-available;
    }

.ww-order-comming-soon-time-background-2 {
    background: url('https://serverapp.wiseworks.mn/Images/NewYearImages/bg-22.png') repeat-x center 0;
    position: relative;
    margin-top: -10px !important;
    height: 994px;
}

.ww-order-comming-soon-time-background-3 {
    background: url('https://serverapp.wiseworks.mn/Images/NewYearImages/bg-3.png') repeat-x center 0;
    position: relative;
    margin-top: -10px !important;
    height: 400px;
}

.ww-order-input input:invalid {
    background-color: lightcoral;
}

.ww-order-page .nav-tabs-custom .nav-item .nav-link {
    font-weight: bold;
}

    .ww-order-page .nav-tabs-custom .nav-item .nav-link.active {
        color: #2ab57d;
    }

.ww-order-page .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    background-color: rgba(42, 181, 125, .1) !important;
}

.ww-order-ebarimt-bill-type {
    width: 100%;
    min-height: 150px;
    display: flex;
    align-items: center;
    font-size: 1.3rem;
    background-color: white;
    border: 1px solid #f1e6b2;
    border-radius: 1rem;
    transition: all .2s ease-in-out;
}

    .ww-order-ebarimt-bill-type.active {
        background-color: rgba(20, 143, 119, .2);
    }




.cs-toast {
    display: none;
    padding: 1.5rem;
    color: #fff;
    z-index: 9999;
    position: absolute;
    width: 25rem;
    top: 2rem;
    border-radius: 1rem;
    right: 2rem;
}

.cs-toast-icon {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 1rem;
    font-size: 2.5rem;
}

.cs-toast-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding-left: 1rem;
}

    .cs-toast-body p {
        margin-bottom: 0;
    }

.cs-toast-visible {
    display: flex;
    flex-direction: row;
    animation: fadein 1.5s;
}

@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}