/* --------------------------------------------------------
        Text Input Component
    -----------------------------------------------------------*/
    .text-input.theme-default {
        background-color: #fff;
        border-radius: 2px;
        border: 1px solid #ccc;
        box-shadow: none;
        color: #000;
        font-size: 13px;
        font-weight: 300;
        height: 32px;
    }
    
        .text-input.theme-default:focus {
            box-shadow: none;
            border-color: #6059ee;
        }
    
    textarea.text-input.theme-default {
        width: 100%;
        min-height: 50px;
    }
    
    
    /* --------------------------------------------------------
            Select2 Component
        -----------------------------------------------------------*/
    .select2-container--default {
        width: 100% !important;
    }
    
        .select2-container--default .select2-selection {
            background-color: #fff;
            border: 1px solid #ccc;
            border-radius: 2px;
        }
    
            .select2-container--default .select2-selection.select2-selection--single {
                height: 31px;
            }
    
            .select2-container--default .select2-selection.select2-selection--multiple {
                line-height: 5px;
            }
    
            .select2-container--default .select2-selection .select2-selection__rendered {
                font-size: 14px;
                font-weight: 300;
                margin: 0;
                padding: 0 0 0 5px;
            }
    
        .select2-container--default .select2-selection--multiple .select2-selection__rendered {
            padding-right: 10px;
            list-style: none;
            line-height: 30px;
        }
    
    .select2-no-results {
        display: none !important;
    }
    
    .select2-container--default .select2-selection--multiple .select2-selection__rendered > li {
        float: left;
        margin-left: 7px;
    }
    
    .select2-container--default .select2-selection--multiple .select2-selection__choice {
        background-color: #eee;
        border: 1px solid #ccc;
        border-radius: 15px;
        cursor: default;
        height: 24px;
        line-height: normal;
        margin-top: 3px;
        padding-left: 5px;
        padding-right: 5px;
    }
    
        .select2-container--default .select2-selection--multiple .select2-selection__choice > span {
            margin-left: 5px;
        }
    
    .select2-container--default.select2-container--open .select2-selection {
        border-color: #6059ee;
    }
    
    .select2-container--default .select2-selection__rendered {
        color: #444;
        line-height: 28px;
    }
    
    .select2-container--default.select2-container--open .select2-dropdown--below {
        border-color: #6059ee;
    }
    
    .select2-container--default .select2-selection__placeholder {
        font-size: 13px;
        color: #999;
        font-weight: 300;
    }
    
    .select2-container--default .select2-search__field {
        font-size: 13px;
        font-weight: 300;
    }
    
    .select2-container--default .select2-selection__arrow {
        border-left: 1px solid #ccc;
        right: 1px !important;
        height: 30px !important;
        width: 28px !important;
        position: absolute;
        top: 1px;
    }
    
        .select2-container--default .select2-selection__arrow b {
            border-color: #888 transparent transparent;
            border-style: solid;
            border-width: 5px 4px 0;
            height: 0;
            left: 50%;
            margin-left: -4px;
            margin-top: -2px;
            position: absolute;
            top: 50%;
            width: 0;
        }
    
    .select2-container--default .select2-search--inline {
        float: right;
    }
    
        .select2-container--default .select2-search--inline .select2-search__field {
            font-size: 14px;
            font-weight: 500;
            line-height: 14px;
            margin-top: 5px;
            width: unset;
        }
    
    .select2-container--default .select2-results > .select2-results__options {
        max-height: 200px;
        overflow-y: auto;
    }
    
    /* --------------------------------------------------------
            Chosen Component
        -----------------------------------------------------------*/
    .chosen-container.theme-default {
        max-width: 100% !important;
        width: 100% !important;
        padding: 0;
        height: auto;
    }
    
        .chosen-container.theme-default .chosen-choices {
            background: none;
            box-shadow: none;
            border: none;
        }
    
        .chosen-container.theme-default.w-100 {
            width: 100% !important;
        }
    
        .chosen-container.theme-default .chosen-default, .chosen-container.theme-default .chosen-single {
            background: none;
            padding: 0px 0 0 8px;
            border: none;
            line-height: 30px;
            box-shadow: none;
            height: 32px;
        }
    
            .chosen-container.theme-default .chosen-default div b, .chosen-container.theme-default .chosen-single div b {
                background-position: 0 7px;
            }
    
    /* --------------------------------------------------------
            Radio Button && Checkbox Component
        -----------------------------------------------------------*/
    .radio.theme-default, .checkbox.theme-default {
        position: relative;
        display: block;
        margin-bottom: 12px;
    }
    
        .radio.theme-default.theme-inline, .checkbox.theme-default.theme-inline {
            display: inline-block;
        }
    
        .radio.theme-default label, .checkbox.theme-default label {
            min-height: 18px;
            padding-left: 20px;
            margin-bottom: 0;
            font-weight: 400;
            cursor: pointer;
        }
    
        .radio.theme-default input[type="radio"], .radio.theme-default-inline input[type="radio"], .checkbox.theme-default input[type="checkbox"], .checkbox.theme-default-inline input[type="checkbox"] {
            position: absolute;
            margin-left: -20px;
            margin-top: 4px; 
        }
    
        .radio.theme-default + .radio.theme-default, .checkbox.theme-default + .checkbox.theme-default {
            margin-top: -5px;
        }
    
        .radio.theme-default input {
            width: 19px;
            height: 19px;
        }
    
            .radio.theme-default input:checked + .input-helper:after {
                -webkit-transform: scale(1);
                -ms-transform: scale(1);
                -o-transform: scale(1);
                transform: scale(1);
            }
    
        .radio.theme-default .input-helper:before {
            top: -1px;
            width: 19px;
            height: 19px;
            border-radius: 50%;
        }
    
        .radio.theme-default .input-helper:after {
            width: 11px;
            height: 11px;
            background: #009688;
            border-radius: 50%;
            top: 3px;
            left: 4px;
            -webkit-transform: scale(0);
            -ms-transform: scale(0);
            -o-transform: scale(0);
            transform: scale(0);
        }
    
        .checkbox.theme-default label, .radio.theme-default label {
            padding-left: 30px;
            position: relative;
        }
    
        .checkbox.theme-default input, .radio.theme-default input {
            top: 0;
            left: 0;
            margin-left: 0 !important;
            z-index: 1;
            cursor: pointer;
            opacity: 0;
            filter: alpha(opacity=0);
            margin-top: 0;
        }
    
        .checkbox.theme-default .input-helper:before, .radio.theme-default .input-helper:before, .checkbox.theme-default .input-helper:after, .radio.theme-default .input-helper:after {
            -webkit-transition: all;
            -o-transition: all;
            transition: all;
            -webkit-transition-duration: 250ms;
            transition-duration: 250ms;
            -webkit-backface-visibility: hidden;
            -moz-backface-visibility: hidden;
            backface-visibility: hidden;
            position: absolute;
            content: "";
        }
    
        .checkbox.theme-default .input-helper:before, .radio.theme-default .input-helper:before {
            left: 0;
            border: 1px solid #ccc;
        }
    
        .checkbox.theme-default.disabled, .radio.theme-default.disabled {
            opacity: .6;
            filter: alpha(opacity=60);
        }
    
        .checkbox.theme-default input {
            width: 17px;
            height: 17px;
        }
    
            .checkbox.theme-default input:checked + .input-helper:before {
                -webkit-transform: scale(0);
                -ms-transform: scale(0);
                -o-transform: scale(0);
                transform: scale(0);
            }
    
            .checkbox.theme-default input:checked + .input-helper:after {
                -webkit-transform: scale(1) rotate(-50deg);
                -ms-transform: scale(1) rotate(-50deg);
                -o-transform: scale(1) rotate(-50deg);
                transform: scale(1) rotate(-50deg);
                opacity: 1;
                filter: alpha(opacity=100);
            }
    
        .checkbox.theme-default .input-helper:before {
            top: 0;
            width: 17px;
            height: 17px;
        }
    
        .checkbox.theme-default .input-helper:after {
            opacity: 0;
            filter: alpha(opacity=0);
            -webkit-transform: scale(0) rotate(80deg);
            -ms-transform: scale(0) rotate(80deg);
            -o-transform: scale(0) rotate(80deg);
            transform: scale(0) rotate(80deg);
            width: 22px;
            height: 9px;
            border-bottom: 2px solid #009688;
            border-left: 2px solid #009688;
            border-bottom-left-radius: 2px;
            left: -1px;
            top: 1px;
        }
    
    /* --------------------------------------------------------
            Label Form Component
        -----------------------------------------------------------*/
    .mbd-flex-slider.default {
        position: relative;
        direction: ltr;
    }
    
        .mbd-flex-slider.default .fx-slider {
            overflow: hidden;
            border: none;
            border-radius: 0;
            margin: 0 0 15px 0;
        }
    
            .mbd-flex-slider.default .fx-slider .fx-slider-wrapper {
                overflow: hidden;
            }
    
                .mbd-flex-slider.default .fx-slider .fx-slider-wrapper img {
                    cursor: pointer;
                    height: 100%;
                }
    
        .mbd-flex-slider.default .fx-carousel {
            border: none;
            border-radius: 0;
            margin: 0;
        }
    
            .mbd-flex-slider.default .fx-carousel .fx-carousel-wrapper {
                height: 60px;
                overflow: hidden;
            }
    
                .mbd-flex-slider.default .fx-carousel .fx-carousel-wrapper img {
                    height: 100%;
                }
    
            .mbd-flex-slider.default .fx-carousel .flex-direction-nav li a {
                background: #e05333;
                height: 60px;
                margin-top: 0;
                top: 0px;
                width: 26px;
            }
    
            .mbd-flex-slider.default .fx-carousel .flex-prev,
            .mbd-flex-slider.default .fx-carousel .flex-next {
                font-size: 0;
            }
    
            .mbd-flex-slider.default .fx-carousel .flex-direction-nav a:before {
                content: '\f2fa';
                font: normal normal normal 20px/1 'Material-Design-Iconic-Font';
                left: 12px;
                position: absolute;
                top: 18px;
                color: white;
            }
    
            .mbd-flex-slider.default .fx-carousel .flex-direction-nav a.flex-next:before {
                content: '\f2fb';
            }
    
            .mbd-flex-slider.default .fx-carousel .flex-direction-nav .flex-prev {
                left: 0;
            }
    
            .mbd-flex-slider.default .fx-carousel .flex-direction-nav .flex-next {
                right: 0;
            }
    
    /* --------------------------------------------------------
            Label Form Component
        -----------------------------------------------------------*/
    .label-form.theme-default {
        margin-bottom: 0;
        padding-top: 5px;
        text-align: right;
        font-weight: 400;
        font-size: 13px;
    }
    
    /* --------------------------------------------------------
            Toggle Switch Component
        -----------------------------------------------------------*/
    .toggle-switch.theme-default {
        display: inline-block;
        vertical-align: top;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    
        .toggle-switch.theme-default .ts-label {
            display: inline-block;
            margin: 0 20px 0 0;
            vertical-align: top;
            -webkit-transition: color 0.56s cubic-bezier(0.4, 0, 0.2, 1);
            transition: color 0.56s cubic-bezier(0.4, 0, 0.2, 1);
        }
    
        .toggle-switch.theme-default .ts-helper {
            display: inline-block;
            position: relative;
            width: 40px;
            height: 15px;
            border-radius: 8px;
            background: rgba(0, 0, 0, 0.26);
            -webkit-transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1);
            transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1);
            vertical-align: middle;
            cursor: pointer;
        }
    
            .toggle-switch.theme-default .ts-helper:before {
                content: '';
                position: absolute;
                top: -5px;
                left: -4px;
                width: 22px;
                height: 22px;
                background-color: #fff;
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28);
                border-radius: 50%;
                webkit-transition: left 0.28s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
                transition: left 0.28s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
            }
    
        .toggle-switch.theme-default:not(.disabled) .ts-helper:active:before {
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(128, 128, 128, 0.1);
        }
    
        .toggle-switch.theme-default input {
            position: absolute;
            z-index: 1;
            width: 46px;
            margin: 0 0 0 -4px;
            height: 24px;
            opacity: 0;
            filter: alpha(opacity=0);
            cursor: pointer;
        }
    
            .toggle-switch.theme-default input:checked + .ts-helper:before {
                left: 20px;
            }
    
        .toggle-switch.theme-default:not([data-ts-color]) input:not(:disabled):checked + .ts-helper {
            background: rgba(0, 150, 136, 0.5);
        }
    
            .toggle-switch.theme-default:not([data-ts-color]) input:not(:disabled):checked + .ts-helper:before {
                background: #009688;
            }
    
            .toggle-switch.theme-default:not([data-ts-color]) input:not(:disabled):checked + .ts-helper:active:before {
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(0, 150, 136, 0.2);
            }
    
        .toggle-switch.theme-default.disabled {
            opacity: 0.6;
            filter: alpha(opacity=60);
        }
    
        .toggle-switch.theme-default[data-ts-color="red"] input:not(:disabled):checked + .ts-helper {
            background: rgba(244, 67, 54, 0.5);
        }
    
            .toggle-switch.theme-default[data-ts-color="red"] input:not(:disabled):checked + .ts-helper:before {
                background: #f44336;
            }
    
            .toggle-switch.theme-default[data-ts-color="red"] input:not(:disabled):checked + .ts-helper:active:before {
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(244, 67, 54, 0.2);
            }
    
        .toggle-switch.theme-default[data-ts-color="blue"] input:not(:disabled):checked + .ts-helper {
            background: rgba(33, 150, 243, 0.5);
        }
    
            .toggle-switch.theme-default[data-ts-color="blue"] input:not(:disabled):checked + .ts-helper:before {
                background: #2196f3;
            }
    
            .toggle-switch.theme-default[data-ts-color="blue"] input:not(:disabled):checked + .ts-helper:active:before {
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(33, 150, 243, 0.2);
            }
    
        .toggle-switch.theme-default[data-ts-color="amber"] input:not(:disabled):checked + .ts-helper {
            background: rgba(255, 193, 7, 0.5);
        }
    
            .toggle-switch.theme-default[data-ts-color="amber"] input:not(:disabled):checked + .ts-helper:before {
                background: #ffc107;
            }
    
            .toggle-switch.theme-default[data-ts-color="amber"] input:not(:disabled):checked + .ts-helper:active:before {
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(255, 193, 7, 0.2);
            }
    
        .toggle-switch.theme-default[data-ts-color="purple"] input:not(:disabled):checked + .ts-helper {
            background: rgba(156, 39, 176, 0.5);
        }
    
            .toggle-switch.theme-default[data-ts-color="purple"] input:not(:disabled):checked + .ts-helper:before {
                background: #9c27b0;
            }
    
            .toggle-switch.theme-default[data-ts-color="purple"] input:not(:disabled):checked + .ts-helper:active:before {
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(156, 39, 176, 0.2);
            }
    
        .toggle-switch.theme-default[data-ts-color="pink"] input:not(:disabled):checked + .ts-helper {
            background: rgba(233, 30, 99, 0.5);
        }
    
            .toggle-switch.theme-default[data-ts-color="pink"] input:not(:disabled):checked + .ts-helper:before {
                background: #e91e63;
            }
    
            .toggle-switch.theme-default[data-ts-color="pink"] input:not(:disabled):checked + .ts-helper:active:before {
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(233, 30, 99, 0.2);
            }
    
        .toggle-switch.theme-default[data-ts-color="lime"] input:not(:disabled):checked + .ts-helper {
            background: rgba(205, 220, 57, 0.5);
        }
    
            .toggle-switch.theme-default[data-ts-color="lime"] input:not(:disabled):checked + .ts-helper:before {
                background: #cddc39;
            }
    
            .toggle-switch.theme-default[data-ts-color="lime"] input:not(:disabled):checked + .ts-helper:active:before {
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(205, 220, 57, 0.2);
            }
    
        .toggle-switch.theme-default[data-ts-color="cyan"] input:not(:disabled):checked + .ts-helper {
            background: rgba(0, 188, 212, 0.5);
        }
    
            .toggle-switch.theme-default[data-ts-color="cyan"] input:not(:disabled):checked + .ts-helper:before {
                background: #00bcd4;
            }
    
            .toggle-switch.theme-default[data-ts-color="cyan"] input:not(:disabled):checked + .ts-helper:active:before {
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(0, 188, 212, 0.2);
            }
    
        .toggle-switch.theme-default[data-ts-color="green"] input:not(:disabled):checked + .ts-helper {
            background: rgba(76, 175, 80, 0.5);
        }
    
            .toggle-switch.theme-default[data-ts-color="green"] input:not(:disabled):checked + .ts-helper:before {
                background: #4caf50;
            }
    
            .toggle-switch.theme-default[data-ts-color="green"] input:not(:disabled):checked + .ts-helper:active:before {
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(76, 175, 80, 0.2);
            }
    
    .toggle-switch.theme-topol {
        position: relative;
        display: inline-block;
        width: 45px;
        height: 23px;
    }
    
        .toggle-switch.theme-topol input {
            display: none;
        }
    
        .toggle-switch.theme-topol .slider {
            border-radius: 34px;
            position: absolute;
            cursor: pointer;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: #B4B4B4;
            -webkit-transition: .4s;
            transition: .4s;
        }
    
            .toggle-switch.theme-topol .slider:before {
                border-radius: 50%;
                position: absolute;
                content: "";
                height: 19px;
                width: 19px;
                left: 2px;
                bottom: 2px;
                background-color: white;
                -webkit-transition: .4s;
                transition: .4s;
            }
    
        .toggle-switch.theme-topol input:checked + .slider:before {
            -webkit-transform: translateX(22px);
            -ms-transform: translateX(22px);
            transform: translateX(22px);
        }
    
        .toggle-switch.theme-topol .slider.round {
            border-radius: 34px;
        }
    
            .toggle-switch.theme-topol .slider.round:before {
                border-radius: 50%;
            }
    
        .toggle-switch.theme-topol input:checked + .slider {
            background-color: #2196f3;
        }
    
        .toggle-switch.theme-topol.yellow input:checked + .slider {
            background-color: #f5f403;
        }
    
        .toggle-switch.theme-topol.green input:checked + .slider {
            background-color: #41f503;
        }
    
        .toggle-switch.theme-topol.red input:checked + .slider {
            background-color: #ce4844;
        }
    
    
        .toggle-switch.theme-topol.small {
            height: 24px;
            width: 42px;
        }
    
            .toggle-switch.theme-topol.small .slider::before {
                bottom: 3px;
                height: 18px;
                left: 4px;
                width: 18px;
            }
    
            .toggle-switch.theme-topol.small input:checked + .slider::before {
                transform: translateX(16px);
            }
    
    
    /* --------------------------------------------------------
            Upload Photo(Image)
        -----------------------------------------------------------*/
    .mbd-field-uploadphoto {
        margin-bottom: 10px;
    }
    
        .mbd-field-uploadphoto .box-upload {
            border: solid 1px #ccc;
            float: left;
            width: 150px;
            height: 120px;
            margin-right: 10px;
            position: relative;
        }
    
            .mbd-field-uploadphoto .box-upload > input[type=file] {
                cursor: pointer;
                opacity: 0;
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                z-index: 9;
            }
    
            .mbd-field-uploadphoto .box-upload > i {
                position: absolute;
                left: 40%;
                top: 18%;
                font-size: 50px;
                color: gray;
            }
    
            .mbd-field-uploadphoto .box-upload > span {
                position: absolute;
                left: 20px;
                top: 70px;
                font-size: 15px;
                font-weight: 600;
                color: #aaa;
            }
    
        .mbd-field-uploadphoto .photo-error {
            position: absolute;
            left: 0;
            top: 0;
            color: #fff;
            width: 100%;
            line-height: 2;
            padding: 5px;
            height: 100%;
            background: rgba(52, 52, 52, 0.84);
        }
    
        .mbd-field-uploadphoto .box-image {
            background: url(images/photo.png) no-repeat center center;
            border: solid 1px #ccc;
            float: left;
            width: 150px;
            height: 120px;
            margin-right: 10px;
            margin-bottom: 10px;
            position: relative;
            overflow: hidden;
        }
    
            .mbd-field-uploadphoto .box-image .is-main {
                position: absolute;
                left: 20px;
                top: 0;
                font-size: 125px;
                opacity: 0.2;
                color: green;
            }
    
            .mbd-field-uploadphoto .box-image .bu-actions {
                background-color: rgba(38, 35, 35, 0.13);
                color: #fff;
                width: 100%;
                position: absolute;
                text-align: right;
                left: 0;
                padding: 5px 10px;
                font-size: 17px;
                top: 0;
            }
    
                .mbd-field-uploadphoto .box-image .bu-actions > i {
                    cursor: pointer;
                }
    
                    .mbd-field-uploadphoto .box-image .bu-actions > i.btn-main {
                        display: none;
                    }
    
            .mbd-field-uploadphoto .box-image:hover .bu-actions > i.btn-main {
                display: block;
            }
    
            .mbd-field-uploadphoto .box-image > img {
                width: 100%;
                min-height: 100%;
                max-height: 130%;
            }
    
            .mbd-field-uploadphoto .box-image .bu-progress {
                position: absolute;
                bottom: 0;
                left: 0;
                width: 100%;
                padding: 10px;
                text-align: center;
                background-color: #ffffff82;
                font-size: 11px;
            }
    
                .mbd-field-uploadphoto .box-image .bu-progress > span {
                    position: absolute;
                    left: 0;
                    top: 0;
                    height: 100%;
                }
    /* --------------------------------------------------------
            Nano scroller Component
        -----------------------------------------------------------*/
    .nano > .nano-pane {
        left: 0;
        right: auto;
        width: 7px;
        z-index: 9;
    }
    
    
    /* --------------------------------------------------------
            File Upload Component
        -----------------------------------------------------------*/
    .custom-file-upload {
        border: 1px solid #ccc;
        border-radius: 2px;
        height: 33px;
        position: relative;
        width: 100%;
    }
    
        .custom-file-upload::before {
            content: attr(file-text);
            font-size: 14px;
            height: 35px;
            line-height: 27px;
            overflow: hidden;
            padding: 5px 10px;
            position: absolute;
            left: 0;
            text-overflow: ellipsis;
            white-space: pre;
            width: calc(100% - 105px);
        }
    
        .custom-file-upload::after {
            background-color: #00bcd4;
            color: #fff;
            content: attr(text);
            font-size: 14px;
            height: 31px;
            right: 0;
            line-height: normal;
            padding: 5px 10px;
            position: absolute;
            text-align: center;
            top: 0;
            width: 100px;
        }
    
        .custom-file-upload > input[type="file"] {
            cursor: pointer;
            height: 30px;
            left: 0;
            opacity: 0;
            position: absolute;
            top: 0;
            width: 100%;
            z-index: 9;
        }
    
        .custom-file-upload > .image-preview {
            height: 30px;
            width: 30px;
            float: right;
            margin-right: 102px;
            position: relative;
        }
    
    /* --------------------------------------------------------
            Image Upload Component
        -----------------------------------------------------------*/
    .image-upload-wrapper {
        background-color: #ddd;
        border: 3px dashed #fff;
        border-radius: 4px;
        height: 100%;
        margin-bottom: 10px;
        max-height: 200px;
        max-width: 250px;
        min-height: 150px;
        overflow: hidden;
        position: relative;
        width: 100%;
    }
    
        .image-upload-wrapper.dragover {
            border-color: #6059ee;
        }
    
        .image-upload-wrapper > img {
            max-height: 125%;
            min-height: 100%;
            width: 100%;
        }
    
        .image-upload-wrapper > input[type="file"] {
            bottom: 3%;
            cursor: pointer;
            left: 3%;
            opacity: 0;
            position: absolute;
            width: 94%;
            z-index: 3;
        }
    
        .image-upload-wrapper > button {
            bottom: 3%;
            left: 3%;
            position: absolute;
            width: 94%;
            z-index: 2;
        }
    
    
    /* --------------------------------------------------------
            Angular Validation Component
        -----------------------------------------------------------*/
    .ang-validation.theme-default {
        position: relative;
    }
    
        .ang-validation.theme-default::before {
            background-color: rgba(255, 0, 0, 0.66);
            border-radius: 50%;
            content: "";
            height: 15px;
            right: 25px;
            opacity: 0;
            position: absolute;
            top: 8px;
            transition: all 0.3s ease-in-out 0s;
            width: 15px;
            z-index: 9;
            visibility: hidden;
        }
    
        .ang-validation.theme-default.error::before {
            visibility: visible;
            opacity: 1;
            animation: 600ms linear 0s normal none 2 running loading-bar-spinner;
        }
    
        .ang-validation.theme-default.error input, .ang-validation.theme-default.error select, .ang-validation.theme-default.error textarea, .ang-validation.theme-default.error .select2-container .theme-default {
            border-color: rgba(255, 0, 0, 0.66);
        }
    
    @keyframes loading-bar-spinner {
        0% {
            opacity: 0;
            transform: scale(1);
        }
    
        25% {
            opacity: 0.5;
            transform: scale(1.15);
        }
    
        50% {
            opacity: 1;
            transform: scale(1.3);
        }
    
        75% {
            opacity: 0.5;
            transform: scale(1.15);
        }
    
        100% {
            opacity: 0;
            transform: scale(1);
        }
    }
    
    /* --------------------------------------------------------
            Pre Loader Component
        -----------------------------------------------------------*/
    .pre-loader.theme-default {
        background-color: #fff;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 9;
    }
    
        .pre-loader.theme-default .lines {
            display: block;
            position: absolute;
            left: 45%;
            top: 50px;
            width: 150px;
            height: 150px;
            border-radius: 50%;
            border: 3px solid transparent;
            border-top-color: #3498db;
            -webkit-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
            animation: spin 2s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
            z-index: 1001;
        }
    
            .pre-loader.theme-default .lines:before {
                content: "";
                position: absolute;
                top: 5px;
                left: 5px;
                right: 5px;
                bottom: 5px;
                border-radius: 50%;
                border: 3px solid transparent;
                border-top-color: #e74c3c;
                -webkit-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
                animation: spin 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
            }
    
            .pre-loader.theme-default .lines:after {
                content: "";
                position: absolute;
                top: 15px;
                left: 15px;
                right: 15px;
                bottom: 15px;
                border-radius: 50%;
                border: 3px solid transparent;
                border-top-color: #f9c922;
                -webkit-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
                animation: spin 1.5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
            }
    
    @-webkit-keyframes spin {
        0% {
            -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg); /* IE 9 */
            transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */
        }
    
        100% {
            -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg); /* IE 9 */
            transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */
        }
    }
    
    @keyframes spin {
        0% {
            -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg); /* IE 9 */
            transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */
        }
    
        100% {
            -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg); /* IE 9 */
            transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */
        }
    }
    
    
    /* --------------------------------------------------------
            Multi Steps Component
        -----------------------------------------------------------*/
    .steps.theme-default {
        background-color: #edeff0;
        border-radius: .25em;
        margin: 0;
    }
    
        .steps.theme-default::after {
            clear: both;
            content: "";
            display: table;
        }
    
        .steps.theme-default li {
            display: inline-block;
            float: left;
            margin: 0.5em 0;
        }
    
            .steps.theme-default li::after {
                display: inline-block;
                content: '\00bb';
                margin: 0 .6em;
                color: #959fa5;
            }
    
            .steps.theme-default li:last-of-type::after {
                display: none;
            }
    
            .steps.theme-default li > a {
                display: inline-block;
                font-size: 1.4rem;
                color: #2c3f4c;
            }
    
            .steps.theme-default li.active > a {
                color: #96c03d;
            }
    
        .steps.theme-default a:hover {
            color: #96c03d;
        }
    
    .step-content {
        position: relative;
        min-height: 200px;
    }
    
    @media only screen and (min-width: 768px) {
        .steps.theme-default {
            padding: 0 1.2em;
        }
    
            .steps.theme-default li {
                margin: 1.2em 0;
                width: 19.5%;
            }
    
                .steps.theme-default li::after {
                    margin: 0 1em;
                }
    
                .steps.theme-default li > a {
                    font-size: 1.6rem;
                }
    
        .steps.theme-default {
            background-color: transparent;
            padding: 0;
        }
    
            .steps.theme-default li {
                position: relative;
                padding: 0;
                margin: 0 4px 4px 0;
            }
    
                .steps.theme-default li:last-of-type {
                    margin-right: 0;
                }
    
                .steps.theme-default li > a {
                    background-color: #edeff0;
                    border-color: #edeff0;
                    color: #2c3f4c;
                    font-family: roboto;
                    font-size: 18px;
                    font-weight: 500;
                    position: relative;
                    padding: 15px 0 15px 35px;
                    outline: none;
                    width: 100%;
                }
    
                .steps.theme-default li.active > a {
                    color: #ffffff;
                    cursor: default;
                    background-color: #68c7d3;
                    border-color: #68c7d3;
                }
    
                .steps.theme-default li:first-of-type > a {
                    padding-left: 1.6em;
                    border-radius: .25em 0 0 .25em;
                }
    
                .steps.theme-default li:last-of-type > a {
                    border-radius: 0 .25em .25em 0;
                }
    
                .steps.theme-default li:not(.active) > a:hover {
                    color: #ffffff;
                    background-color: #2c3f4c;
                    border-color: #2c3f4c;
                }
    
                .steps.theme-default li > a > i {
                    font-size: 25px;
                }
    
                .steps.theme-default li > a > p {
                    font-family: open sans;
                    font-size: 12px;
                    height: 35px;
                    margin: 5px 0 0 5px;
                    max-width: 100px;
                    opacity: 0.9;
                    overflow: hidden;
                }
    
                .steps.theme-default li::after, .steps.theme-default li > a::after {
                    content: '';
                    position: absolute;
                    top: 0;
                    left: 100%;
                    content: '';
                    height: 0;
                    width: 0;
                    border: 29px solid transparent;
                    border-right-width: 0;
                    border-left-width: 30px;
                }
    
                .steps.theme-default li::after {
                    z-index: 1;
                    -webkit-transform: translateX(4px);
                    -moz-transform: translateX(4px);
                    -ms-transform: translateX(4px);
                    -o-transform: translateX(4px);
                    transform: translateX(4px);
                    border-left-color: #ffffff;
                    margin: 0;
                }
    
                .steps.theme-default li > a::after {
                    z-index: 2;
                    border-left-color: inherit;
                }
    
                .steps.theme-default li:last-of-type::after, .steps.theme-default li:last-of-type > a::after {
                    display: none;
                }
    
            .steps.theme-default.custom-separator li::after {
                background-image: none;
            }
    
            .steps.theme-default li::after, .steps.theme-default li > a::after {
                border-top-width: 49px;
                border-bottom-width: 49px;
            }
    
        @-moz-document url-prefix() {
            .steps.theme-default li::after,
            .steps.theme-default li > a::after {
                border-left-style: dashed;
            }
        }
    }
    
    .wizard-steps.artin {
        margin: 0;
        position: relative;
        text-align: left;
    }
    
        .wizard-steps.artin > .wz-steps {
            background-color: #fff;
            margin-bottom: 10px;
            display: table;
            width: 100%;
        }
    
            .wizard-steps.artin > .wz-steps .wz-step {
                color: #62b965;
                cursor: pointer;
                display: table-cell;
                font-size: 14px;
                font-weight: 400;
                margin-bottom: 15px;
                margin-right: -0.5%;
                padding: 40px 25px 0;
                position: relative;
                text-align: center;
                transition: all 300ms ease-in-out 0s;
            }
    
                .wizard-steps.artin > .wz-steps .wz-step.disable, .wizard-steps.artin > .wz-steps .wz-step.disabled {
                    cursor: not-allowed;
                    opacity: .5;
                }
    
                .wizard-steps.artin > .wz-steps .wz-step::before, .wizard-steps.artin > .wz-steps .wz-step::after {
                    border-color: #62b965;
                    border-style: solid;
                    border-width: 2px 0 0;
                    content: "";
                    position: absolute;
                    top: 15px;
                    transition: all 300ms ease-in-out 0s;
                    z-index: 1;
                }
    
                .wizard-steps.artin > .wz-steps .wz-step::before {
                    right: calc(50% + 20px);
                    width: calc(50% - 20px);
                }
    
                .wizard-steps.artin > .wz-steps .wz-step::after {
                    right: -10px;
                    width: calc(50% - 10px);
                }
    
                .wizard-steps.artin > .wz-steps .wz-step:first-child::before, .wizard-steps.artin > .wz-steps .wz-step:last-child::after {
                    border-style: dashed;
                }
    
                .wizard-steps.artin > .wz-steps .wz-step.active:after {
                    border-color: #ddd !important;
                }
    
                .wizard-steps.artin > .wz-steps .wz-step.active ~ .wz-step,
                .wizard-steps.artin > .wz-steps .wz-step.active ~ .wz-step:before, .wizard-steps.artin > .wz-steps .wz-step.active ~ .wz-step:after {
                    color: #333;
                    border-color: #ddd;
                }
    
                .wizard-steps.artin > .wz-steps .wz-step > span {
                    background-color: #62b965;
                    border: 2px solid #62b965;
                    border-radius: 50%;
                    display: inline-block;
                    height: 26px;
                    left: calc(50% - 13px);
                    position: absolute;
                    top: 0;
                    width: 26px;
                    transition: all 300ms ease-in-out 0s;
                    z-index: 3;
                }
    
                    .wizard-steps.artin > .wz-steps .wz-step > span::before {
                        color: #fff;
                        content: '\f26b';
                        font-family: 'Material-Design-Iconic-Font';
                        font-size: 19px;
                        font-weight: 700;
                        left: 4px;
                        line-height: 1;
                        position: absolute;
                        top: 1px;
                    }
    
                .wizard-steps.artin > .wz-steps .wz-step.active > span {
                    background-color: #fff;
                }
    
                    .wizard-steps.artin > .wz-steps .wz-step.active > span::before {
                        color: #62b965;
                        content: '\f384';
                        left: 3px;
                        font-size: 20px;
                        font-weight: 300;
                    }
    
    
                .wizard-steps.artin > .wz-steps .wz-step.active ~ .wz-step > span {
                    background-color: #fff;
                    border-color: #ddd;
                }
    
                    .wizard-steps.artin > .wz-steps .wz-step.active ~ .wz-step > span:before {
                        content: none;
                    }
    
        .wizard-steps.artin > .step-content {
            padding-top: 30px;
            min-height: 250px;
        }
    
    
    /* --------------------------------------------------------
            Form Section Component
        -----------------------------------------------------------*/
    .form-section.theme-default {
        position: relative;
    }
    
        .form-section.theme-default > .header {
            background: none;
            line-height: 1.3;
            min-height: unset;
            box-shadow: 0 -2px 0 0 #eeeeee inset;
            margin: 10px 0;
            position: relative;
        }
    
            .form-section.theme-default > .header::after {
                content: '\f2fc';
                display: inline-block;
                font-family: "Material-Design-Iconic-Font";
                font-size: 26px;
                position: absolute;
                right: 0px;
                top: 0;
                transition: transform 0.4s ease 0s;
            }
    
            .form-section.theme-default > .header > h3 {
                border-bottom: 2px solid #00bcd4;
                display: inline-block;
                font-size: 20px;
                margin: 0;
                padding: 0 0 10px;
            }
    
        .form-section.theme-default > input[type="checkbox"] {
            cursor: pointer;
            height: 30px;
            left: 0;
            margin: 0;
            position: absolute;
            top: 0;
            width: 100%;
            z-index: 9;
            opacity: 0;
        }
    
            .form-section.theme-default > input[type="checkbox"]:checked + .header::after {
                transform: rotate(-180deg);
            }
    
            .form-section.theme-default > input[type="checkbox"]:checked + .header + fieldset {
                max-height: 0;
                opacity: 0;
                transform: scaleY(0);
            }
    
        .form-section.theme-default > fieldset {
            padding-top: 20px;
            opacity: 1;
            transform-origin: center top 0;
            transition: max-height 0.26s ease 0s,opacity 0.5s ease 0s,transform 0.6s ease 0s,background-color 0.26s ease;
            max-height: 5000px;
        }
    
        .form-section.theme-default.no-max-height > fieldset {
            max-height: unset;
        }
    
        .form-section.theme-default > input[type="checkbox"]:hover + .header > h3 {
            border-bottom-color: #2196f3;
        }
    
        .form-section.theme-default > input[type="checkbox"]:hover + .header + fieldset {
            background-color: #fbfbfb;
        }
    
        .form-section.theme-default.small > .header > h3 {
            font-size: 17px;
        }
    
        .form-section.theme-default.small > .header {
            margin-bottom: 10px;
        }
    
            .form-section.theme-default.small > .header::after {
                font-size: 24px;
            }
    
        .form-section.theme-default.small > fieldset {
            padding-top: 10px;
        }
    
    /* --------------------------------------------------------
            Ajaxbar Component
        -----------------------------------------------------------*/
    .ajax-bar {
        color: #bbb;
        display: none;
        margin-left: 50px;
        padding-left: 25px;
        position: relative;
    }
    
        .ajax-bar:before {
            animation: 4000ms linear 0s normal none infinite running spin;
            border: 3px dotted #00bcd4;
            border-radius: 50%;
            content: "";
            height: 25px;
            left: 0;
            position: absolute;
            top: 0;
            width: 25px;
        }
    
        .ajax-bar.error {
            background: none;
        }
    
            .ajax-bar.error .animate, .ajax-bar.error .content-bold {
                display: none;
            }
    
        .ajax-bar.show {
            display: inline-block !important;
        }
    
        .ajax-bar .animate {
            content: "";
            height: 30px;
            position: absolute;
            left: 22px;
            top: -5px;
            transition: all 0.5s ease-in-out 0s;
            width: 80px;
            background: #ffffff; /* Old browsers */
            background: -webkit-linear-gradient(left, #ffffff 0%,#fbfbfb 30%,#f8f8f8 47%,#fbfbfb 65%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
            background: linear-gradient(to right, #ffffff 0%, rgba(254, 254, 254) 30%, rgba(253, 253, 253) 47%, rgba(254, 254, 254) 65%, #ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
            -webkit-animation: ajax-bar 4s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
            animation: ajax-bar 4s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
        }
    
        .ajax-bar .content {
            font-size: 14px;
            font-weight: 100;
            display: inline-block;
            padding: 0 5px;
            position: relative;
            white-space: pre;
            z-index: 2;
        }
    
            .ajax-bar .content.content-bold {
                color: #333;
                font-weight: 300;
                height: 22px;
                overflow: hidden;
                position: absolute;
                top: 3px;
                left: 25px;
                white-space: pre;
                width: 0%;
                -webkit-animation: ajax-bar-content 4s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
                animation: ajax-bar-content 4s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
            }
    
        .ajax-bar .ajax-error {
            display: none;
        }
    
        .ajax-bar.error .ajax-error {
            background: red none repeat scroll 0 0;
            border-radius: 15px;
            color: #fff;
            cursor: default;
            display: inline-block;
            font-size: 11px;
            line-height: 12px;
            padding: 3px;
            width: 52px;
            transition: box-shadow 0.3s linear 0s;
        }
    
        .ajax-bar.error.shadow .ajax-error {
            animation: .5s linear 0s normal none 1 running ajax-bar-error;
        }
    
        .ajax-bar.theme-blue {
            color: #ddd;
        }
    
            .ajax-bar.theme-blue:before {
                border-color: #eee;
            }
    
            .ajax-bar.theme-blue .content.content-bold {
                color: #eee;
            }
    
            .ajax-bar.theme-blue .animate {
                background: #2293ee; /* Old browsers */
                background: -webkit-linear-gradient(left, #2293ee 0%,#1582da 30%,#0074d2 47%,#1582da 65%,#2b99f2 100%); /* Chrome10-25,Safari5.1-6 */
                background: linear-gradient(to right, #2293ee 0%,#1582da 30%, #0074d2 47%, #1582da 65%, #2b99f2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
            }
    
    @-webkit-keyframes ajax-bar {
        0% {
            left: 25px;
        }
    
        25% {
            left: 32.5%;
        }
    
        50% {
            left: 65%;
        }
    
        75% {
            left: 32.5%;
        }
    
        100% {
            left: 25px;
        }
    }
    
    @keyframes ajax-bar {
        0% {
            left: 25px;
        }
    
        25% {
            left: 32.5%;
        }
    
        50% {
            left: 65%;
        }
    
        75% {
            left: 32.5%;
        }
    
        100% {
            left: 25px;
        }
    }
    
    @-webkit-keyframes ajax-bar-content {
        0% {
            width: 0%;
        }
    
        5% {
            width: 10%;
        }
    
        10% {
            width: 20%;
        }
    
        15% {
            width: 30%;
        }
    
        20% {
            width: 40%;
        }
    
        25% {
            width: 50%;
        }
    
        30% {
            width: 60%;
        }
    
        35% {
            width: 70%;
        }
    
        40% {
            width: 80%;
        }
    
        45% {
            width: 90%;
        }
    
        50% {
            width: 100%;
        }
    
        55% {
            width: 90%;
        }
    
        60% {
            width: 80%;
        }
    
        65% {
            width: 70%;
        }
    
        70% {
            width: 60%;
        }
    
        75% {
            width: 50%;
        }
    
        80% {
            width: 40%;
        }
    
        85% {
            width: 30%;
        }
    
        90% {
            width: 20%;
        }
    
        95% {
            width: 10%;
        }
    
        100% {
            width: 0%;
        }
    }
    
    @keyframes ajax-bar-content {
        0% {
            width: 0%;
        }
    
        5% {
            width: 10%;
        }
    
        10% {
            width: 20%;
        }
    
        15% {
            width: 30%;
        }
    
        20% {
            width: 40%;
        }
    
        25% {
            width: 50%;
        }
    
        30% {
            width: 60%;
        }
    
        35% {
            width: 70%;
        }
    
        40% {
            width: 80%;
        }
    
        45% {
            width: 90%;
        }
    
        50% {
            width: 100%;
        }
    
        55% {
            width: 90%;
        }
    
        60% {
            width: 80%;
        }
    
        65% {
            width: 70%;
        }
    
        70% {
            width: 60%;
        }
    
        75% {
            width: 50%;
        }
    
        80% {
            width: 40%;
        }
    
        85% {
            width: 30%;
        }
    
        90% {
            width: 20%;
        }
    
        95% {
            width: 10%;
        }
    
        100% {
            width: 0%;
        }
    }
    
    @keyframes ajax-bar-error {
        10% {
            box-shadow: 0 0 0px #ddd;
        }
    
        20% {
            box-shadow: 0 0 5px #ddd;
        }
    
        30% {
            box-shadow: 0 0 10px #ddd;
        }
    
        40% {
            box-shadow: 0 0 15px #ddd;
        }
    
        50% {
            box-shadow: 0 0 20px #ddd;
        }
    
        60% {
            box-shadow: 0 0 25px #ddd;
        }
    
        70% {
            box-shadow: 0 0 30px #ddd;
        }
    
        80% {
            box-shadow: 0 0 35px #ddd;
        }
    
        90% {
            box-shadow: 0 0 40px #ddd;
        }
    
        100% {
            box-shadow: 0 0 45px #ddd;
        }
    }
    
    
    /* --------------------------------------------------------
            pulse Animation
        -----------------------------------------------------------*/
    .pulse {
        animation: 3s ease-out 0s normal none infinite running pulse;
    }
    
    @keyframes pulse {
        0% {
            opacity: 0;
            transform: scale(0);
        }
    
        25% {
            opacity: 0.1;
            transform: scale(0);
        }
    
        50% {
            opacity: 0.3;
            transform: scale(0.1);
        }
    
        75% {
            opacity: 0.5;
            transform: scale(0.5);
        }
    
        100% {
            opacity: 0;
            transform: scale(1);
        }
    }
    
    /* --------------------------------------------------------
            more dot
        -----------------------------------------------------------*/
    .more-dot {
        cursor: pointer;
        height: 100%;
        display: block;
        border-left: solid 1px #ccc;
        position: absolute;
        right: 12px;
        padding-left: 10px;
        top: 0;
        line-height: 24px;
        font-weight: 700;
        z-index: 9;
    }
    
    
    /* --------------------------------------------------------
            MBD Category Menu
        -----------------------------------------------------------*/
    .mbd-field-category-menu {
        border: solid 1px #eee;
    }
    
        .mbd-field-category-menu .cm-back {
            border-bottom: solid 2px #ddd;
        }
    
            .mbd-field-category-menu .cm-back:hover {
                background-color: #F9F9F9;
                cursor: pointer;
            }
    
            .mbd-field-category-menu .cm-back > i {
                padding: 10px 15px;
                border-right: solid 1px #eee;
            }
    
            .mbd-field-category-menu .cm-back > .cm-parent-titles {
                padding: 0 10px 10px;
                display: inline-block;
            }
    
                .mbd-field-category-menu .cm-back > .cm-parent-titles > span {
                    font-size: 16px;
                    font-weight: 300;
                }
    
                    .mbd-field-category-menu .cm-back > .cm-parent-titles > span:before {
                        content: '\f2f6';
                        font: normal normal normal 24px/1 'Material-Design-Iconic-Font';
                        position: absolute;
                        right: -5px;
                        top: 0;
                        color: #666;
                    }
    
                    .mbd-field-category-menu .cm-back > .cm-parent-titles > span:last-child:before {
                        content: none;
                    }
    
        .mbd-field-category-menu > ul {
            padding: 0;
            margin: 0;
        }
    
            .mbd-field-category-menu > ul > li {
                font-size: 16px;
                padding: 1em;
                list-style: none;
                position: relative;
                border-bottom: solid 1px #eee;
            }
    
                .mbd-field-category-menu > ul > li:hover, .mbd-field-category-menu > ul > li.mbd-active {
                    background-color: #F9F9F9;
                    cursor: pointer;
                }
    
                .mbd-field-category-menu > ul > li > i {
                    position: absolute;
                    right: 10px;
                    top: 5px;
                    display: none;
                }
    
                .mbd-field-category-menu > ul > li:hover > i, .mbd-field-category-menu > ul > li.mbd-active > i {
                    display: block;
                }
    
    
    /* --------------------------------------------------------
            Waves effect
        -----------------------------------------------------------*/
    .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,0.2);
            background: -webkit-radial-gradient(rgba(0,0,0,0.2) 0,rgba(0,0,0,0.3) 40%,rgba(0,0,0,0.4) 50%,rgba(0,0,0,0.5) 60%,rgba(255,255,255,0) 70%);
            background: -o-radial-gradient(rgba(0,0,0,0.2) 0,rgba(0,0,0,0.3) 40%,rgba(0,0,0,0.4) 50%,rgba(0,0,0,0.5) 60%,rgba(255,255,255,0) 70%);
            background: -moz-radial-gradient(rgba(0,0,0,0.2) 0,rgba(0,0,0,0.3) 40%,rgba(0,0,0,0.4) 50%,rgba(0,0,0,0.5) 60%,rgba(255,255,255,0) 70%);
            background: radial-gradient(rgba(0,0,0,0.2) 0,rgba(0,0,0,0.3) 40%,rgba(0,0,0,0.4) 50%,rgba(0,0,0,0.5) 60%,rgba(255,255,255,0) 70%);
            -webkit-transition: all .5s ease-out;
            -moz-transition: all .5s ease-out;
            -o-transition: all .5s ease-out;
            transition: all .5s ease-out;
            -webkit-transition-property: -webkit-transform,opacity;
            -moz-transition-property: -moz-transform,opacity;
            -o-transition-property: -o-transform,opacity;
            transition-property: transform,opacity;
            -webkit-transform: scale(0) translate(0,0);
            -moz-transform: scale(0) translate(0,0);
            -ms-transform: scale(0) translate(0,0);
            -o-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,0.4);
            background: -webkit-radial-gradient(rgba(255,255,255,0.2) 0,rgba(255,255,255,0.3) 40%,rgba(255,255,255,0.4) 50%,rgba(255,255,255,0.5) 60%,rgba(255,255,255,0) 70%);
            background: -o-radial-gradient(rgba(255,255,255,0.2) 0,rgba(255,255,255,0.3) 40%,rgba(255,255,255,0.4) 50%,rgba(255,255,255,0.5) 60%,rgba(255,255,255,0) 70%);
            background: -moz-radial-gradient(rgba(255,255,255,0.2) 0,rgba(255,255,255,0.3) 40%,rgba(255,255,255,0.4) 50%,rgba(255,255,255,0.5) 60%,rgba(255,255,255,0) 70%);
            background: radial-gradient(rgba(255,255,255,0.2) 0,rgba(255,255,255,0.3) 40%,rgba(255,255,255,0.4) 50%,rgba(255,255,255,0.5) 60%,rgba(255,255,255,0) 70%);
        }
    
        .waves-effect.waves-classic .waves-ripple {
            background: rgba(0,0,0,0.2);
        }
    
        .waves-effect.waves-classic.waves-light .waves-ripple {
            background: rgba(255,255,255,0.4);
        }
    
    .waves-notransition {
        -webkit-transition: none !important;
        -moz-transition: none !important;
        -o-transition: none !important;
        transition: none !important;
    }
    
    .waves-button, .waves-circle {
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-mask-image: -webkit-radial-gradient(circle,#fff 100%,#000 100%);
    }
    
        .waves-button, .waves-button:hover, .waves-button:visited, .waves-button-input {
            white-space: nowrap;
            vertical-align: middle;
            cursor: pointer;
            border: none;
            outline: none;
            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,0.12);
        box-shadow: 0 1px 1.5px 1px rgba(0,0,0,0.12);
        -webkit-transition: all 300ms;
        -moz-transition: all 300ms;
        -o-transition: all 300ms;
        transition: all 300ms;
    }
    
        .waves-float:active {
            -webkit-box-shadow: 0 8px 20px 1px rgba(0,0,0,0.3);
            box-shadow: 0 8px 20px 1px rgba(0,0,0,0.3);
        }
    
    .waves-block {
        display: block;
    }
    
    /*
     * Generate Margin Class
     * margin, margin-top, margin-bottom, margin-left, margin-right
     */
    
    .m-0 {
        margin: 0px !important;
    }
    
    .m-t-0 {
        margin-top: 0px !important;
    }
    
    .m-b-0 {
        margin-bottom: 0px !important;
    }
    
    .m-l-0 {
        margin-left: 0px !important;
    }
    
    .m-r-0 {
        margin-right: 0px !important;
    }
    
    .m-5 {
        margin: 5px !important;
    }
    
    .m-t-5 {
        margin-top: 5px !important;
    }
    
    .m-b-5 {
        margin-bottom: 5px !important;
    }
    
    .m-l-5 {
        margin-left: 5px !important;
    }
    
    .m-r-5 {
        margin-right: 5px !important;
    }
    
    .m-10 {
        margin: 10px !important;
    }
    
    .m-t-10 {
        margin-top: 10px !important;
    }
    
    .m-b-10 {
        margin-bottom: 10px !important;
    }
    
    .m-l-10 {
        margin-left: 10px !important;
    }
    
    .m-r-10 {
        margin-right: 10px !important;
    }
    
    .m-15 {
        margin: 15px !important;
    }
    
    .m-t-15 {
        margin-top: 15px !important;
    }
    
    .m-b-15 {
        margin-bottom: 15px !important;
    }
    
    .m-l-15 {
        margin-left: 15px !important;
    }
    
    .m-r-15 {
        margin-right: 15px !important;
    }
    
    .m-20 {
        margin: 20px !important;
    }
    
    .m-t-20 {
        margin-top: 20px !important;
    }
    
    .m-b-20 {
        margin-bottom: 20px !important;
    }
    
    .m-l-20 {
        margin-left: 20px !important;
    }
    
    .m-r-20 {
        margin-right: 20px !important;
    }
    
    .m-25 {
        margin: 25px !important;
    }
    
    .m-t-25 {
        margin-top: 25px !important;
    }
    
    .m-b-25 {
        margin-bottom: 25px !important;
    }
    
    .m-l-25 {
        margin-left: 25px !important;
    }
    
    .m-r-25 {
        margin-right: 25px !important;
    }
    
    .m-30 {
        margin: 30px !important;
    }
    
    .m-t-30 {
        margin-top: 30px !important;
    }
    
    .m-b-30 {
        margin-bottom: 30px !important;
    }
    
    .m-l-30 {
        margin-left: 30px !important;
    }
    
    .m-r-30 {
        margin-right: 30px !important;
    }
    
    .m-50 {
        margin: 50px !important;
    }
    
    .m-t-50 {
        margin-top: 50px !important;
    }
    
    .m-b-50 {
        margin-bottom: 50px !important;
    }
    
    .m-l-50 {
        margin-left: 50px !important;
    }
    
    .m-r-50 {
        margin-right: 50px !important;
    }
    
    /*
     * Generate Padding Class
     * padding, padding-top, padding-bottom, padding-left, padding-right
     */
    
    .p-0 {
        padding: 0px !important;
    }
    
    .p-t-0 {
        padding-top: 0px !important;
    }
    
    .p-b-0 {
        padding-bottom: 0px !important;
    }
    
    .p-l-0 {
        padding-left: 0px !important;
    }
    
    .p-r-0 {
        padding-right: 0px !important;
    }
    
    .p-5 {
        padding: 5px !important;
    }
    
    .p-t-5 {
        padding-top: 5px !important;
    }
    
    .p-b-5 {
        padding-bottom: 5px !important;
    }
    
    .p-l-5 {
        padding-left: 5px !important;
    }
    
    .p-r-5 {
        padding-right: 5px !important;
    }
    
    .p-10 {
        padding: 10px !important;
    }
    
    .p-t-10 {
        padding-top: 10px !important;
    }
    
    .p-b-10 {
        padding-bottom: 10px !important;
    }
    
    .p-l-10 {
        padding-left: 10px !important;
    }
    
    .p-r-10 {
        padding-right: 10px !important;
    }
    
    .p-15 {
        padding: 15px !important;
    }
    
    .p-t-15 {
        padding-top: 15px !important;
    }
    
    .p-b-15 {
        padding-bottom: 15px !important;
    }
    
    .p-l-15 {
        padding-left: 15px !important;
    }
    
    .p-r-15 {
        padding-right: 15px !important;
    }
    
    .p-20 {
        padding: 20px !important;
    }
    
    .p-t-20 {
        padding-top: 20px !important;
    }
    
    .p-b-20 {
        padding-bottom: 20px !important;
    }
    
    .p-l-20 {
        padding-left: 20px !important;
    }
    
    .p-r-20 {
        padding-right: 20px !important;
    }
    
    .p-25 {
        padding: 25px !important;
    }
    
    .p-t-25 {
        padding-top: 25px !important;
    }
    
    .p-b-25 {
        padding-bottom: 25px !important;
    }
    
    .p-l-25 {
        padding-left: 25px !important;
    }
    
    .p-r-25 {
        padding-right: 25px !important;
    }
    
    .p-30 {
        padding: 30px !important;
    }
    
    .p-t-30 {
        padding-top: 30px !important;
    }
    
    .p-b-30 {
        padding-bottom: 30px !important;
    }
    
    .p-l-30 {
        padding-left: 30px !important;
    }
    
    .p-r-30 {
        padding-right: 30px !important;
    }
    
    /*
     * Generate Font-Size Classes (8px - 20px)
     */
    
    .f-8 {
        font-size: 8px !important;
    }
    
    .f-9 {
        font-size: 9px !important;
    }
    
    .f-10 {
        font-size: 10px !important;
    }
    
    .f-11 {
        font-size: 11px !important;
    }
    
    .f-12 {
        font-size: 12px !important;
    }
    
    .f-13 {
        font-size: 13px !important;
    }
    
    .f-14 {
        font-size: 14px !important;
    }
    
    .f-15 {
        font-size: 15px !important;
    }
    
    .f-16 {
        font-size: 16px !important;
    }
    
    .f-17 {
        font-size: 17px !important;
    }
    
    .f-18 {
        font-size: 18px !important;
    }
    
    .f-19 {
        font-size: 19px !important;
    }
    
    .f-20 {
        font-size: 20px !important;
    }
    
    .f-25 {
        font-size: 25px !important;
    }
    
    .f-30 {
        font-size: 30px !important;
    }
    
    .f-40 {
        font-size: 40px !important;
    }
    
    /*
     * Font Weight
     */
    
    .f-300 {
        font-weight: 300 !important;
    }
    
    .f-400 {
        font-weight: 400 !important;
    }
    
    .f-500 {
        font-weight: 500 !important;
    }
    
    .f-700 {
        font-weight: 700 !important;
    }
    
    /*
     * Position Classes
     */
    
    .p-relative {
        position: relative !important;
    }
    
    .p-absolute {
        position: absolute !important;
    }
    
    .p-fixed {
        position: fixed !important;
    }
    
    .p-static {
        position: static !important;
    }
    
    /*
     * Overflow
     */
    .o-hidden {
        overflow: hidden !important;
    }
    
    .o-visible {
        overflow: visible !important;
    }
    
    .o-auto {
        overflow: auto !important;
    }
    
    /*
     * Width
     */
    .w-25 {
        width: 25px !important;
    }
    
    .w-50 {
        width: 50px !important;
    }
    
    .w-100 {
        width: 100% !important;
    }
    
    .w-150 {
        width: 150px !important;
    }
    
    .w-200 {
        width: 200px !important;
    }
    
    .w-10p {
        width: 10% !important;
    }
    
    .w-20p {
        width: 20% !important;
    }
    
    .w-30p {
        width: 30% !important;
    }
    
    .w-40p {
        width: 40% !important;
    }
    
    .w-50p {
        width: 50% !important;
    }
    
    .w-60p {
        width: 60% !important;
    }
    
    .w-70p {
        width: 70% !important;
    }
    
    .w-80p {
        width: 80% !important;
    }
    
    .w-90p {
        width: 90% !important;
    }
    
    .w-100p {
        width: 100% !important;
    }
    
    /*
     * Min Width
     */
    .mnw-25 {
        min-width: 25px !important;
    }
    
    .mnw-50 {
        min-width: 50px !important;
    }
    
    .mnw-100 {
        min-width: 100px !important;
    }
    
    .mnw-150 {
        min-width: 150px !important;
    }
    
    .mnw-200 {
        min-width: 200px !important;
    }
    
    .mnw-250 {
        min-width: 250px !important;
    }
    
    /*
     * Max Width
     */
    .mxw-25 {
        max-width: 25px !important;
    }
    
    .mxw-50 {
        max-width: 50px !important;
    }
    
    .mxw-100 {
        max-width: 100px !important;
    }
    
    .mxw-150 {
        max-width: 150px !important;
    }
    
    .mxw-200 {
        max-width: 200px !important;
    }
    
    .mxw-250 {
        max-width: 250px !important;
    }
    
    .mxw-300 {
        max-width: 300px !important;
    }
    
    /*
     * Min Height
     */
    .mnh-25 {
        min-height: 25px !important;
    }
    
    .mnh-50 {
        min-height: 50px !important;
    }
    
    .mnh-100 {
        min-height: 100px !important;
    }
    
    .mnh-150 {
        min-height: 150px !important;
    }
    
    .mnh-200 {
        min-height: 200px !important;
    }
    
    .mnh-250 {
        min-height: 250px !important;
    }
    
    
    /*
     * Max Height
     */
    .mxh-25 {
        max-height: 25px !important;
    }
    
    .mxh-50 {
        max-height: 50px !important;
    }
    
    .mxh-100 {
        max-height: 100px !important;
    }
    
    .mxh-150 {
        max-height: 150px !important;
    }
    
    .mxh-200 {
        max-height: 200px !important;
    }
    
    .mxh-250 {
        max-height: 250px !important;
    }
    
    .cursor-default {
        cursor: default;
    }
    
    .cursor-pointer {
        cursor: pointer;
    }
    
    .d-block {
        display: block;
    }
    
    .d-inline-block {
        display: inline-block;
    }
    
    
    .ui.dropdown, .ui.input, .ui.input.input {
        font-size: 14px;
        font-family: inherit;
    }
    
        .ui.dropdown > input.search {
            text-align: left;
        }
    
    
    /* expand animate*/
    .expand-animate {
        max-height: 0;
        transition: all 0.5s ease-in-out;
        overflow: hidden;
        opacity: 0;
        padding: 0;
    }
    
        .expand-animate.expand {
            max-height: max-content;
            opacity: 1;
        }
    
            .expand-animate.expand.expand-p-10 {
                padding-top: 10px;
                padding-bottom: 10px;
            }
    
    
    /* rotate vertical animate*/
    .rotate-v-animate {
        transition: transform 0.5s ease-in-out;
        transform: rotate(0deg);
    }
    
        .rotate-v-animate.animate {
            transform: rotate(180deg);
        }
    
    
    /* div table */
    .div-table {
        display: table;
        border: 1px solid #ddd;
        width: 100%;
    }
    
        .div-table .div-table-head {
            background-color: #f9f9f9;
            display: table-header-group;
            font-weight: bold;
        }
    
        .div-table .div-table-body {
            display: table-row-group;
        }
    
        .div-table .div-table-row {
            display: table-row;
        }
    
        .div-table .div-table-row {
            display: table-row;
        }
    
            .div-table .div-table-row .div-table-cell {
                border-bottom: 1px solid #ddd;
                border-right: 1px solid #ddd;
                display: table-cell;
                padding: 6px;
            }
    
                .div-table .div-table-row .div-table-cell:last-child {
                    border-right: none;
                }
    
        .div-table .div-table-body .div-table-row:last-child .div-table-cell {
            border-bottom: none;
        }
    
        .div-table .div-table-foot {
            background-color: #EEE;
            display: table-footer-group;
            font-weight: bold;
        }
    
    .l-s-none {
        list-style: none !important
    }