/* Minification failed. Returning unminified contents.
(2,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(67,28): run-time error CSS1039: Token not allowed after unary operator: '-black-lippo'
(285,35): run-time error CSS1046: Expect comma, found '252'
(285,43): run-time error CSS1046: Expect comma, found '/'
(546,17): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(552,32): run-time error CSS1039: Token not allowed after unary operator: '-primary'
 */
:root {
    --black-lippo: #030102;
}

body {
    /*background-color: rgba(224, 255, 255, 0.50) !important;*/
    /*font-family: 'Segoe UI', Segoe, Tahoma, Helvetica, Arial, sans-serif;
    font-size: 26px;*/
}

.badge-styles {
    color: #fff;
    background-color: #c11c56;
}

a.badge-primary:focus,
a.badge-styles:hover {
    color: #fff;
    background-color: #b41950
}

a.badge-styles.focus,
a.badge-styles:focus {
    outline: 0;
    box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .5)
}

.dbody {
    background-image: url("img/LippoMalls_bg.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-color: red;
}

.imgbody {
    /*background-image: url(Img/LippoMalls_bg.jpg) !important;*/
    background-repeat: no-repeat;
    background-size: cover;
    background-color: transparent;
}

.bg-dark-20 {
    background-color: rgba(0, 0, 0, .2) !important
}

.bg-dark-50 {
    background-color: rgba(0, 0, 0, .5) !important
}

.bg-lightblue {
    background-color: rgba(0,123,255,.1) !important;
}

.bg-lightcyan {
    background-color: lightcyan !important;
}

.bg-lightgray {
    background-color: lightgray !important;
}

.bg-lightgrey {
    background-color: lightgrey !important;
}

.bg-lippo {
    background-color: var(--black-lippo);
}

.bg-disable {
    background-color: #e9ecef !important;
}

.bg-b {
    background-color: #d9ecff !important;
}

.bg-gainsboro {
    background-color: gainsboro !important;
}

.bg-transparent {
    background-color: transparent !important;
}

.bg-white {
    background-color: white !important;
}

.bg-whitesmoke {
    background-color: whitesmoke !important;
}

.bg-lightcoral {
    background-color: lightcoral !important;
}

.bg-blue-hover {
    background-color: #798efd !important;
}

    .bg-blue-hover:hover{
        background-color: #4340f8 !important;
    }

.bg-danger-hover {
    background-color: #fdaab2 !important
}
    .bg-danger-hover:hover {
        background-color: #dc3545 !important
    }

.bg-lightgray-hover {
    background-color: #c2c2c2 !important
}
    .bg-lightgray-hover:hover {
        background-color: lightgray !important;
    }

.bg-red-hover {
    background-color: #fcc8c8 !important;
}

    .bg-red-hover:hover {
        background-color: #fc6a6a !important;
    }

.bg-orange-hover {
    background-color: #ffa77d;
}

    .bg-orange-hover:hover {
        background-color: #fd8751;
    }

.bg-primary-hover {
    background-color: #94c8ff !important
}

    .bg-primary-hover:hover {
        background-color: #007bff !important
    }

.bg-success-hover {
    background-color: #b4fac4 !important
}
    .bg-success-hover:hover {
        background-color: #28a745 !important
    }

.bg-warning-hover {
    background-color: #ffe9a8 !important
}
    .bg-warning-hover:hover {
        background-color: #ffc107 !important
    }

.bg-violet-hover {
    background-color: #ccb3fe;
}

    .bg-violet-hover:hover {
        background-color: #6f26ff;
    }

.bg-yellow-hover {
    background-color: #fcdc7f;
}

    .bg-yellow-hover:hover {
        background-color: #ffc107;
    }

.bg-transparent-hover {
    background-color: transparent;
}

    .bg-transparent-hover:hover {
        background-color: #f8f9fa;
    }

    .bg-transparent-hover:focus {
        background-color: #f8f9fa;
    }

    .bg-transparent-hover:visited {
        background-color: #f8f9fa;
    }

.bg-white-opacity-50 {
    background-color: red;
}

.border-bottom-double {
    border-bottom: 4px double #dee2e6 !important;
}

.btn-logout {
    width: 100%;
    padding: 3px 20px !important;
    text-align: left !important;
}

.border-red {
    border: .25rem solid red !important;
    padding: 3px 20px !important;
}

.border-left-orange {
    border-left: .25rem solid orange !important;
    padding-left: .5rem !important;
    height: 30px !important;
}

.border-left-blue {
    border-left: .25rem solid blue !important;
    padding-left: .5rem !important;
    height: 30px !important;
}

.border-left-red {
    border-left: .25rem solid red !important;
    padding-left: .5rem !important;
    height: 30px !important;
}

.btn-circle-sm {
    width: 30px;
    height: 30px;
    padding: 0px 0px;
    border-radius: 15px;
    font-size: 8px;
    text-align: center;
}

.btn-circle-md {
    width: 50px;
    height: 50px;
    padding: 0px 0px;
    border-radius: 25px;
    font-size: 10px;
    text-align: center;
}

.btn-circle-xl {
    width: 70px;
    height: 70px;
    padding: 0px 0px;
    border-radius: 35px;
    font-size: 12px;
    text-align: center;
}

.chk_list {
}
    .chk_list label {
        margin-left: .25rem;
    }

    .chk_list td {
        padding-right: 2rem;
    }

.currency {
    text-align: right !important;
}

.dropdown-item-dark {
    display: block;
    width: 100%;
    padding: .25rem 1.5rem;
    clear: both;
    font-weight: 400;
    color: #fff; /*#212529;*/
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0
}

    .dropdown-item-dark:focus,
    .dropdown-item-dark:hover {
        color: #16181b;
        text-decoration: none;
        background-color: rgb(254 252 252 / 0.18) /*#f8f9fa*/
    }

    .dropdown-item-dark.active,
    .dropdown-item-dark:active {
        color: #fff;
        text-decoration: none;
        background-color: #007bff
    }

    .dropdown-item-dark.disabled,
    .dropdown-item-dark:disabled {
        color: #6c757d;
        pointer-events: none;
        background-color: transparent
    }

    .dropdown-item-dark.show {
        display: block
    }

.fixedbutton {
    position: fixed !important;
    bottom: 5% !important;
    right: 8% !important;
}

.font-small {
    font-size: small !important;
}

.font-smaller {
    font-size: smaller !important;
}

.font-georgia {
    font-family: Georgia !important;
}

.font-italic {
    font-style: italic !important;
}

.font-size-10px {
    font-size: 10px !important;
}

.font-size-12px {
    font-size: 12px !important;
}

.font-size-14px {
    font-size: 14px !important;
}

.font-size-16px {
    font-size: 16px !important;
}

.font-size-24px {
    font-size: 24px !important;
}

.font-size-20px {
    font-size: 20px !important;
}

.form-control-border-bottom {
    width: 100%;
    height: calc(1.5em + .75rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    border: 0;
    border-bottom: 1px solid #ced4da;
    background-color: #f8f9fa;
    outline: 0;
    color: #495057;
    background-clip: padding-box;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out
}

    .form-control-border-bottom::-ms-expand {
        background-color: transparent;
        border: 0
    }

    .form-control-border-bottom:-moz-focusring {
        color: transparent;
        text-shadow: 0 0 0 #495057
    }

    .form-control-border-bottom:focus {
        color: #495057;
        background-color: #f8f9fa;
        border-bottom: .3rem solid rgba(0,123,255,.25);
        outline: 0;
    }

    .form-control-border-bottom::-webkit-input-placeholder {
        color: #6c757d;
        opacity: 1;
    }

    .form-control-border-bottom::-moz-placeholder {
        color: #6c757d;
        opacity: 1;
    }

    .form-control-border-bottom:-ms-input-placeholder {
        color: #6c757d;
        opacity: 1;
    }

    .form-control-border-bottom::-ms-input-placeholder {
        color: #6c757d;
        opacity: 1;
    }

    .form-control-border-bottom::placeholder {
        color: #6c757d;
        opacity: 1;
    }

    .form-control-border-bottom:disabled, .form-control-border-bottom[readonly] {
        background-color: #e9ecef;
        opacity: 1
    }

.input-group > .form-control-border-bottom {
    position: relative;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%;
    min-width: 0;
    margin-bottom: 0
}

.form-control2 {
    width: 100%;
    height: calc(1.5em + .75rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out
}

@media screen and (prefers-reduced-motion:reduce) {
    .form-control2 {
        transition: none;
    }
}

.form-control2::-ms-expand {
    background-color: transparent;
    border: 0
}

.form-control2:focus {
    color: #495057;
    background-color: #fff;
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 .2rem rgba(0,123,255,.25)
}

.form-control2::-webkit-input-placeholder {
    color: #6c757d;
    opacity: 1
}

.form-control2::-moz-placeholder {
    color: #6c757d;
    opacity: 1
}

.form-control2:-ms-input-placeholder {
    color: #6c757d;
    opacity: 1
}

.form-control2::-ms-input-placeholder {
    color: #6c757d;
    opacity: 1
}

.form-control2::placeholder {
    color: #6c757d;
    opacity: 1
}

.form-control2:disabled, .form-control2[readonly] {
    background-color: #e9ecef;
    opacity: 1
}

.form-ddl {
    width: 100%;
    height: calc(1.5em + .75rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out
}

    .form-ddl::-ms-expand {
        background-color: transparent;
        border: 0
    }

    .form-ddl:focus {
        color: #495057;
        background-color: #fff;
        border-color: transparent;
        outline: 0;
        box-shadow: 0 0 0 .2rem rgba(0,123,255,.25)
    }

    .form-ddl::-webkit-input-placeholder {
        color: #6c757d;
        opacity: 1
    }

    .form-ddl::-moz-placeholder {
        color: #6c757d;
        opacity: 1
    }

    .form-ddl:-ms-input-placeholder {
        color: #6c757d;
        opacity: 1
    }

    .form-ddl:disabled, .form-ddl[readonly] {
        background-color: #e9ecef;
        opacity: 1
    }

.hidden {
    display: none;
}

a.icon-hover-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    text-decoration: none;
    color: var(--primary);
    border-radius: 50%;
    transition: all 0.3s ease;
}

    a.icon-hover-primary:hover {
        border: 2px solid var(--primary);
        background-color: #f0f8ff;
    }
    
.input-container {
    position: relative;
    text-wrap: none;
}

    .input-container input {
        width: 100%;
    }

    .input-container .unit {
        position: absolute;
        display: block;
        /*display: -ms-flexbox;
        display: flex;*/
        top: 1px;
        right: 0px;
        margin-bottom: 0;
        white-space: nowrap;
        background-color: transparent;
        border-right: 1px solid #ced4da;
        border-radius: .25rem;
        color: #495057;
        padding: .375rem .75rem;
        width: 25%;
    }

.hover-25:hover {
    background-color: white !important;
    border-radius: 25% !important;
    opacity: 0.5 !important;
}

.hover-50:hover {
    background-color: lightgray !important;
    border-radius: 50% !important;
}

.lnk {
    color: #fff !important;
}

    .lnk:hover {
        color: #fff !important;
        /*text-decoration: none !important;*/
    }

    .lnk:visited {
        color: #fff !important;
        /*text-decoration: none !important;*/
    }

.lnk-blue {
    color: gray;
    padding-left: .5rem !important;
}

    .lnk-blue:hover {
        color: gray;
        border-left: .15rem solid blue;
        padding-left: .3rem;
        text-decoration: none;
    }

    .lnk-blue:visited {
        color: gray;
        padding-left: .5rem;
        text-decoration: none;
    }

.lnk-top-blue {
    color: gray;
    padding-left: .55rem !important;
}

.lnk-top-blue:hover {
    color: gray;
    border-top: .15rem solid blue;
    padding-top: .35rem;
    text-decoration: none;
}

    .lnk-top-blue:visited {
        color: gray;
        padding-left: .55rem;
        text-decoration: none;
    }

.lnk-bottom-blue {
    display: inline-block;
    color: gray;
    text-decoration: none;
}

    .lnk-bottom-blue::after {
        content: '';
        position: absolute;
        width: 0;
        height: 2px;
        left: 50%;
        bottom: -8px;
        background-color: blue;
        transition: all ease-in-out .3s;
        /*content: '';
        display: block;
        width: 0;
        height: 2px;
        background: #000;
        color: gray;
        transition: width .3s;*/
    }

    .lnk-bottom-blue:hover::after {
        width: 100%;
        left: 0;
    }

.lnk-bottom-white {
    display: inline-block;
    color: gray;
    text-decoration: none;
}

    .lnk-bottom-white::after {
        content: '';
        position: absolute;
        width: 0;
        height: 3px;
        left: 50%;
        bottom: -6px;
        background-color: #fff;
        transition: all ease-in-out .3s;
        /*content: '';
        display: block;
        width: 0;
        height: 2px;
        background: #000;
        color: gray;
        transition: width .3s;*/
    }

    .lnk-bottom-white:hover::after {
        width: 100%;
        left: 0;
    }

.lnk-danger {
    background-color: #a94442;
    border-radius: 50%;
}

    .lnk-danger:hover {
        background-color: #f2dede;
    }

    .lnk-danger:visited {
        background-color: #fcf8e3;
    }

.ml-35 {
    margin-left: 3.5rem !important;
}

.ml-4x {
    margin-left: 4rem !important;
}

.m-bottom-20px {
    margin-bottom: 20px;
}

.mb-6 {
    margin-bottom: 4.5rem !important
}

.pl-35 {
    padding-left: 3.5rem !important;
}

.pl-4x {
    padding-left: 4rem !important;
}

.pl-45 {
    padding-left: 4.5rem !important;
}

.p-top-10px {
    padding-top: 10px;
}

.p-right-20px {
    padding-right: 20px;
}

.paging {
    font-weight: bold !important;
}

    .paging tr td {
        padding: 0 5px !important;
        color: red !important;
        border-color: ghostwhite !important;
        border-bottom: none;
    }

    .paging a {
        color: black !important;
    }

    .paging a:hover {
        text-decoration: none !important;
        color: red !important;
    }

.rdo {
}

    .rdo label {
        margin-left: .5rem;
    }

    .rdo tr td {
        padding-right: 2rem;
    }

.rdo-flow {
}

    .rdo-flow label {
        margin-left: .5rem;
        margin-right: 5rem;
    }

    .rdo-flow tr td {
        padding-right: 2rem;
    }

.rdo-block {
    display: block
}

    .rdo-block label {
        margin-left: .5rem;
    }

    .rdo-block tr td {
        padding-right: 2rem;
    }

.rounded-xl {
    border-radius: .5rem !important;
}

.rounded-xxl {
    border-radius: 1rem !important;
}

.rounded-circle-30P {
    border-radius: 30% !important;
}

.shadow-xl {
    box-shadow: 0 2rem 4rem rgba(0,0,0,.5) !important
}

.table-smler td, .table-smler th {
    padding: .18rem !important;
}

.text-black-30 {
    color: rgba(0, 0, 0, .3) !important
}

.text-warning {
    color: #ffc107 !important
}

.visible-true {
    visibility: visible;
}

.w-1 {
    width: 1% !important;
}

.w-2 {
    width: 2% !important;
}

.w-3 {
    width: 3% !important;
}

.w-5 {
    width: 5% !important;
}

.w-6 {
    width: 6% !important;
}

.w-7 {
    width: 7% !important;
}

.w-8 {
    width: 8% !important;
}

.w-9 {
    width: 9% !important;
}

.w-10 {
    width: 10% !important;
}

.w-12 {
    width: 12% !important;
}

.w-14 {
    width: 14% !important;
}

.w-15 {
    width: 15% !important;
}

.w-16 {
    width: 16% !important;
}

.w-17 {
    width: 17% !important;
}

.w-18 {
    width: 17% !important;
}

.w-19 {
    width: 19% !important;
}

.w-20 {
    width: 20% !important;
}

.w-22 {
    width: 22% !important;
}

.w-23 {
    width: 23% !important;
}

.w-24 {
    width: 24% !important;
}

.w-25 {
    width: 25% !important;
}

.w-28 {
    width: 28% !important;
}

.w-29 {
    width: 29% !important;
}

.w-30 {
    width: 30% !important;
}

.w-31 {
    width: 31% !important;
}

.w-32 {
    width: 32% !important;
}

.w-34 {
    width: 34% !important;
}

.w-35 {
    width: 35% !important;
}

.w-38 {
    width: 38% !important;
}

.w-40 {
    width: 40% !important;
}

.w-43 {
    width: 43% !important;
}

.w-45 {
    width: 45% !important;
}

.w-46 {
    width: 46% !important;
}

.w-52 {
    width: 52% !important;
}

.w-55 {
    width: 55% !important;
}

.w-60 {
    width: 60% !important;
}

.w-65 {
    width: 65% !important;
}

.w-68 {
    width: 68% !important;
}

.w-70 {
    width: 70% !important;
}

.w-75 {
    width: 75% !important;
}

.w-79 {
    width: 79% !important;
}

.w-80 {
    width: 80% !important;
}

.w-85 {
    width: 85% !important;
}

.w-90 {
    width: 90% !important;
}

.w-95 {
    width: 95% !important;
}

.w-98 {
    width: 98% !important;
}

.w-650px {
    width: 600px;
}

.w-800px {
    width: 800px !important;
}

.w-1000px {
    width: 1000px !important;
}

.containerClass .ajax__html_editor_extender_container {
    width: 100% !important; /*important is really important at here*/
}

/* css custom form */
.user-box {
    position: relative;
}

    .user-box input {
        width: 100%;
        padding: 10px 0;
        font-size: 16px;
        color: black;
        margin-bottom: 30px;
        border: none;
        border-bottom: 1px solid black;
        outline: none;
        background: transparent;
    }

/*.user-box label {
            position: absolute;
            top: 0;
            left: 0;
            padding: 10px 0px;
            font-size: 16px;
            color: darkgrey;
            pointer-events: none;
            transition: .5s;
        }*/
.label-text {
    position: absolute;
    top: 0px;
    left: 0px;
    padding: 10px 0px;
    font-size: 16px;
    color: darkgrey;
    pointer-events: none;
    transition: .5s;
}

/*.user-box input:focus~label,
.user-box input:valid~label {
    top: -20px;
    left: 0;
    color: black;
    font-size: 12px;
}*/

.user-box input:focus~.label-text {
    top: -20px;
    left: 0px;
    color: black;
    font-size: 12px;
}

.user-box input:focus {
    border: none;
    /*border-bottom: 2px solid blue;*/
    outline: 0;
    box-shadow: 0 .2rem rgba(0, 123, 255, .25)
}

.user-box input:read-only ~ .label-text {
    top: -25px;
    left: 0px;
    color: black;
    font-size: 12px;
}

.user-box input:valid ~ .label-text {
    top: -20px;
    left: 0px;
    color: black;
    font-size: 12px;
}

.user-box input:read-only {
    background-color: lightgray;
    padding: 5px;
    border-radius: 5px 5px 0 0;
}

/* css custom form */

