a {
                border-bottom: 1px dotted rgba(255, 255, 255, 0.35) !important;
                text-shadow: 0 0 0px rgba(255,255,255,0.4) !important;
                text-decoration: none !important;
            }

.dropdown-item {
    display: block;
    width: 100%;
    padding: 0.5rem 1.5rem;
    clear: both;
    font-weight: 400;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
    color:var(--options-text-color);
}
.demo-inline-wrapper {
    display: inline-block;
    margin-bottom: 30px;
    vertical-align: top;
}

.demo-inline-wrapper:not(:last-child) {
    margin-right: 30px;
}

.demo-inline-wrapper .form-group {
    margin: 0;
}

.btn-demo > .btn,
.btn-demo > .btn-group {
    margin: 0 5px 10px 0;
}

.color-demo {
    color: #fff;
    padding: 1rem;
    border-radius: 2px;
    display: block
}

.color-demo--light {
    color: #5E5E5E;
}

.color-demo__color {
    text-transform: uppercase;
    font-weight: 500;
}

.color-demo__hex {
    margin: 0.4rem 0;
}

.animation-demo .row {
    margin: 1.9rem -0.76rem 0;
}

.animation-demo .col-sm-6 {
    padding: 0 0.76rem;
    margin-bottom: 0.9rem;
}

.animation-demo .card-body {
    padding-bottom: 1.15rem;
}

.animation-demo .card-body > img {
    position: relative;
    width: 100%;
    z-index: 1;
    border-radius: 2px;
    box-shadow: 0 4px 10px -2px rgba(0, 0, 0, 0.2);
}

.animation-demo .card-body .btn {
    width: 100%;
}

.animation-demo .nav-tabs {
    margin: -1rem -2.2rem 2rem;
}

.animation-demo .tab-content {
    padding: 0;
}
.export-ops{
    position: absolute;
    top:5px;
    right:5px;
}
.icon-button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    padding: 0.2rem 0.2rem;
    border-radius: 2px;
    cursor: pointer;
}

.icon-button:hover {
    background-color: rgba(255,255,255,0.06);
}

.icon-button > i {
        font-size: 1.3rem;
    margin-right: 0.3rem;
    position: relative;
    top: -0.1rem;
}
.y-scroll{
        overflow-x: hidden;
    overflow-y: auto;
}
.x-scroll{
        overflow-x: auto;
    overflow-y: hidden;
}
.scroll{
    overflow: auto;
}
.card-demo {
    vertical-align: top;
    max-width: 400px;
    width: 100%;
    margin: 0 30px 0 0;
    display: inline-block;
}

.dropdown-demo {
    margin: 10px 10px 0 0;
    display: inline-block;
}

.modal-demo {
    background-color: rgba(255, 255, 255, 0.05);
    margin-bottom: 3rem;
}

.modal-demo .modal {
    z-index: 0;
    position: relative;
    display: block;
}

.rating-demo .rating {
    margin: 10px 20px 10px 0;
}

.toast-demo-container {
    background-color: rgba(0, 0, 0, 0.25);
    border-radius: 2px;
    position: relative;
    min-height: 180px;
    padding: 2rem;
}

.toast--right,
.toast--bottom-right,
.toast--bottom-left {
    position: absolute;
    min-width: 300px;
}

.toast--right {
    top: 2rem;
    right: 2rem;
}

.toast--bottom-right {
    bottom: 2rem;
    right: 2rem;
}

.toast--bottom-left {
    bottom: 2rem;
    left: 2rem;
}

/* BS5 Offcanvas style  */
div#offcanvas-sample,
div#offcanvas-sidebar,
div#offcanvas-top,
div#offcanvas-left,
div#offcanvas-right,
div#offcanvas-bottom,
div#offcanvasWithBothOptions {
    background: rgb(0 0 0 / 75%);
    border: 0;
    color: var(--text-color);
    top:55px;
}

.jqvmap {
    height: 300px;
}

/* Button Style Common  */
.btn:not(.form-control):active, .btn:not(.form-control).active, .open .btn.dropdown-toggle:not(.form-control) {
}
.btn.btn-alt:active {
    color: #000000 !important;
}

/* Jbox Modal style  */
.modal-default .modal-footer,
.modal-Narrower .modal-footer,
.modal-Wider .modal-footer{
    justify-content: flex-start;
}
.modal-default .modal-body, 
.modal-default .dark-body,
.modal-Narrower .modal-body, 
.modal-Narrower .dark-body,
.modal-Wider .modal-body, 
.modal-Wider .dark-body {
    padding: 15px;
}
.modal-default.modal-dialog {
    max-width: 500px;
}

/* Header style  */
.dropdown-toggle::after {
    content: none;
}

/* sidebar style  */
.profile-menu-open {
    display: block;
    top: 100%;
    left: 0;
    min-width: 160px;
    padding: 8px 0px;
    margin: 2px 0 0;
    list-style: none;
    font-size: 12px;
    background: transparent;
    box-shadow: none;
    position: relative;
    margin-bottom: 15px;
    width: 100%;
    z-index: 0;
    text-align: center;
}
.profile-menu-open li {
    width: 100%;
    line-height: 12px;
}
.profile-menu-open > li > a {
    width: 100%;
    display: block;
}
.profile-menu-open > li > a:hover {
    background-color: var(--background-color-lite);
}
.side-menu ul.menu-item {
    top: 38px;
}

/* form elements page style start */
select.form-control {
    background-size: 12px;
}
.form-floating>.form-select.input-lg {
    height: 55px;
    padding: 25px 9px 6px 7px;
}
.form-floating>.form-select:not(:placeholder-shown)~.input-lg{
    padding: 15px 9px 6px 7px;
}
.form-floating>.form-select.input-default {
    height: 45px;
    padding: 22px 9px 6px 7px;
}
.form-floating>.form-select.input-sm {
    height: 35px;
    padding: 10px 0px 0px 6px;
}
.form-floating>label.form-select-input-lg {
    padding: 10px 0px 0px 8px;
}
.form-floating>.form-select:not(:placeholder-shown)~label.form-select-input-lg{
    padding: 16px 0px 0px 8px;
}
.form-floating>label.form-select-input-default {
    padding: 14px 0px 0px 8px;;
}
.form-floating>label.form-select-input-sm {
    padding: 5px 0px 0px 8px;
}
.form-floating>.form-select:not(:placeholder-shown)~label.form-select-input-sm{
    padding: 12px 0px 0px 8px;
}
.form-floating>.form-control-plaintext~label::after, .form-floating>.form-control:focus~label::after, 
.form-floating>.form-control:not(:placeholder-shown)~label::after, .form-floating>.form-select~label::after {
    background-color: transparent !important;
}
.form-floating>.form-control-plaintext~label, .form-floating>.form-control:focus~label, .form-floating>.form-control:not(:placeholder-shown)~label, .form-floating>.form-select~label {
    color: var(--text-color) !important;
    z-index: 9999;
    font-weight: 600;
}
.form-control:focus{
    color: var(--act-text-color);
}
.form-floating>.form-control.input-lg {
    height: 55px;
    padding: 20px 8px 6px 7px;
}
.form-floating>.form-control:not(:placeholder-shown)~.input-lg{
    padding: 15px 9px 6px 7px;
}
.form-floating>.form-control.input-default {
    height: 45px;
    padding: 15px 0px 0px 7px;
}
.form-floating>.form-control.input-sm {
    height: 47.5px;
    padding: 15px 0px 2px 7px;
}
.form-floating>.textareaauto {
    padding: 14px 0px 0px 8px;
}
.form-floating>.textareadefault {
    padding: 0px 0px 0px 7px;
}
.form-floating>label.input-lg {
    padding: 14px 0px 0px 8px;
}
.form-floating>.form-control:not(:placeholder-shown)~label.input-lg{
    padding: 16px 0px 0px 8px;
}
.form-floating>label.input-default {
    padding: 12px 9px 6px 7px;
}
.form-floating>label.input-sm {
    padding: 12px 0px 0px 7px;
}
.form-floating>.form-control:not(:placeholder-shown)~label.input-sm{
    padding: 15px 0px 0px 7px;
}
.form-floating>label.textareaauto {
    padding: 10px 0px 0px 8px;
}
.form-floating>label.textareadefault {
    padding: 10px 0px 0px 7px;
}
  
/* form elements page style End */


/* form Components page style  start */

.container {
    width: auto;
    padding: 0;
    max-width: 100%;
}
#main{
    margin-top: 4.2rem!important;
}
.header .logo {
    background: rgb(0 0 0 / 0%);
    width: 224px;
    min-width: 224px;
    padding: 14px 0px 12px 18px;
    float: left;
    font-family: var(--font-family-prod);
    text-shadow: 0px 0px 4px #000000 !important;
}
.card {
    background-color: rgb(0 0 0 / 0%);
    box-shadow: 0px 0px 0px rgba(0,0,0,.1);
}

.top-nav .dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    float: left;
    min-width: 10rem;
    padding: 0.8rem 0;
    margin: 0 0 0;
    font-size: 1rem;
    color: rgba(255,255,255,.85);
    text-align: left;
    list-style: none;
    background-color: rgba(0,0,0,.96);
    background-clip: padding-box;
    border: 0 solid transparent;
    border-radius: 2px;
}
.top-nav>li {
    display: inline-block !important;
}
.s-widget-body .progress {
    height: 3px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    font-size: .75rem;
    background-color: rgba(255,255,255,.1);
    border-radius: 2px;
}
.listview__heading {
    font-size: 1rem;
    color: #fff;
    position: relative;
    text-shadow: 0 0 0px rgb(255 255 255);
}

.breadcrumb>li {
    display: inline-block;
}

.breadcrumb>li+li:before {
    content: "/\00a0";
    padding: 0 5px;
    color: #ccc;
}
ul.list-unstyled.side-menu li {
    margin-bottom: 0.4rem;
}
.side-menu > li > a:before {
    font-size: 28px;
    line-height: 1.4;
}

#menu-toggle {
    height: 55px;
    background-image: 'ggg' !important;
}

 /* content  style */
.form-select {
    border: 1px solid rgba(255, 255, 255, 0.3);
    background-size: 12px;
}

.has-switch label {
    z-index: 10 !important;
        box-shadow: 0px 0px 2px #000;
}

/* Date-Time style  */
.form-control[readonly] {
    background-color: rgb(195 195 195 / 20%);
}
.input-group {
    display: flex !important;
}
input.flatpickr-input {
    width: fit-content !important;
}
.flatpickr-months .flatpickr-month {
    height: 40px;
}
.flatpickr-day {
    font-size: 12px;
    padding: 0px 0px 0px 0px;
    width: 40px;
    max-width: 40px;
    height: 25px;
    line-height: 20px;
}

.flatpickr-current-month {
    font-size: 12px;
    padding-top: 11px;
}
.flatpickr-months .flatpickr-next-month, .flatpickr-months .flatpickr-prev-month {
    width: 25px;
    height: 25px;
    padding: 0;
    top: 7px;
    line-height: 24px;
    border-radius: 2px;
    font-size: 16px;
}
.flatpickr-time input {
    font-size: 12px;
}
.flatpickr-time .flatpickr-am-pm {
    font-size: 12px;
}
/* Section SELECT 2 style */
.select2-container{
    z-index: 999;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 1.5;
    padding: 20px 0px 6px 8px;
    color: var(--text-color);
}
.select2-container .select2-search--inline .select2-search__field {
    margin: 20px 0px 4px 0px;
    padding: 0 5px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    margin-right: 5px;
    margin-top: 20px;
    padding: 0 5px;
}
.select2-dropdown .select2-results__option {
    padding: 3px 13px;
}
.select2-dropdown {
    padding: 3px;
}
.select2-dropdown .select2-search--dropdown {
    margin-bottom: 0rem;
    padding: 0;
}
/* Tag Select style  */
.chzn-container-multi .chzn-choices li.search-field input {
    height: 43px;
    padding: 25px 0 0 7px;
}
.chzn-container-multi .chzn-choices li.search-choice {
    margin: 25px 0 0 3px;
    padding: 4px 26px 4px 6px;
}
/* Date and Time Picker style  */
.date_time-picker .input-group-prepend .input-group-text {
    height: 100%;
}
.date_time-picker .input-group-prepend {
    margin-right: 0;
    width: 10%;
    display: inline-block;
    height: 100% !important;
}
.date_time-picker>label {
    left: 10%;
    z-index: 2;
}
.date_time-picker .form-control.datetime-picker.flatpickr-input.input-default,
.date_time-picker .form-control.date-picker.flatpickr-input.input-default {
    height: 45px;
    padding: 10px 0px 0px 8px;
    width: 90% !important;
    float: right;
}

/* color picker style  */
.color-pick .color-preview {
    right: 1px;
    top: 1px;
    width: 38px;
    height: 46px;
}
.color-pick  .add-on {
    top: 1px;
    padding: 0px 5px 2px 8px;
    font-size: 29px;
    width: 30px;
}
input#colorPicker1,
input#colorPicker2,
input#colorPicker3{
    padding-left: 34px !important;
}

/* Range Slider  */
.slider.slider-horizontal .slider-track {
    height: 6px;
    margin-top: -6px;
}
.slider.slider-horizontal {
    width: 100%;
    height: 10px;
}
.slider-handle {
    background: rgb(255, 255, 255) !important;
    width: 15px;
    height: 15px;
    border-radius: 8px !important;
    box-shadow: 0px 0px 3px;
}
.slider.slider-vertical .slider-handle {
    margin-left: 0px;
    margin-top: -10px;
}
/* Vertical  */
.slider.slider-vertical .slider-track {
    width: 6px;
    margin-left: -5px;
}

div.spinedit {
    top: 1px;
    height: 44px;
}
div.spinedit span {
    height: 15px;
    width: 40px;
    padding-top: 0px;
}

/* form Example page style Start */
.modal-header, .dark-header {
    display: inline-block;
    padding: 10px 15px 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.11);
}
.modal-body, 
.dark-body {
    padding: 40px;
}
.modal-footer, 
.ui-dialog-buttonpane, 
.dark-footer {
    padding: 10px 15px;
    border-top: 1px solid rgba(255, 255, 255, 0.11);
    text-align: left;
}
.modal-footer button.btn {
    border: 1px solid rgba(255, 255, 255, 0.31);
    padding: 2px 10px 3px;
}
.modal-header .close {
    padding: 0px 10px 0;
}
/* Page Media  */
.carousel-control {
    width: 40px;
    height: 40px !important;
    margin-top: -20px !important;
    top: 50%;
    background: #3f3f3f;
    display: block;
    opacity: 1;
}
video, iframe {
    margin: 0 auto;
    display: block;
    width: 100%;  
    height: auto;
}
audio{
    margin: 0 auto;
    display: block;
    width: 100%;  
    height: 40px;
}
#audioPlayer::-webkit-media-controls-panel {
    background-color: rgb(0, 0, 0); 
    border-radius: 0; 
    width: 300px;
}
#audioPlayer::-webkit-media-controls-play-button,
#audioPlayer::-webkit-media-controls-current-time-display,
#audioPlayer::-webkit-media-controls-time-remaining-display,
#audioPlayer::-webkit-media-controls-timeline,
#audioPlayer::-webkit-media-controls-volume-slider,
#audioPlayer::-webkit-media-controls-toggle-closed-captions-button{
    color: #fff ;
}
/* Page components.html style  */

ul.dropdown-menu.animated {
    margin-top: 2.6rem !important;
}
ul.dropdown-menu.animated.fadeIn{
    margin-top: 0rem !important;
}
.modalImg,
#draggableContent,
.dropend .dropdown-toggle::after,
.dropstart .dropdown-toggle::before,
.dropup .dropdown-toggle::after{
    display: none;
}
.dropdown [class*="zwicon-"] {
    font-size: 16px;
}
.dropdown-menu, .elfinder-button-menu, .elfinder-contextmenu {
    z-index: 10000 !important;
}

div#modalDefault .modal-dialog,
div#modalNarrower .modal-dialog,
div#modalWider .modal-dialog {
    top: 20%;
}

/* Page Other Components  */
.list-group-item {
    color: #ffffff;
    border-bottom: 1px solid rgba(255,255,255,0.15);
}

/* Form Validation style  */
.formError {
    left: 5% !important;
}
.formError .formErrorArrow div,
.formError .formErrorContent {
    border: none !important;
}

/* List View Page  */
header.listview-header.media {
    display: block;
}

/* WysyWyg Editor Style  */
.trumbowyg-dark .trumbowyg-button-pane {
    background-color: rgba(0,0,0,0.35);
    border: none;
}

.trumbowyg-dark .trumbowyg-box {
    border: 1px solid #34343400;
}
.trumbowyg-dark .trumbowyg-button-pane .trumbowyg-button-group:not(:empty)::after {
    background-color: #34343400;
}

.trumbowyg-modal-box label {
    margin: 0;
}
.table-bordered, .table-responsive {
    border: 0;
    box-shadow: 0px 0px 3px #000 !important;
    padding: 0px;
}

/* W2UI Table style  */
.w2ui-overlay .w2ui-overlay-body {
    font-family: var(--font-family) !important;
}
.w2ui-grid .w2ui-grid-body table .w2ui-head {
    border-right: 1px solid var(--grid-col-color);
    border-bottom: 1px solid var(--grid-col-color);
        color: var(--text-color);
    background: var(--grid-col-header-background);
}
.w2ui-grid .w2ui-grid-body .w2ui-grid-columns, 
.w2ui-grid .w2ui-grid-body .w2ui-grid-fcolumns {
    box-shadow: 0px 1px 4px #efefef00;
}
.w2ui-grid {
    border: 0px solid #e1e1e100;
    width: 100% !important;
    min-height: 100% !important;
}
.w2ui-grid .w2ui-grid-body {
        background: var(--grid-background);
}
.w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-odd, 
.w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-odd {
    color: inherit;
    background-color: var(--grid-alt-row-background);
    border-bottom: 0px solid #f5f5f500;
    -webkit-transition:background 0.2s ease-in;
}
.w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-even, 
.w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-even {
    color: inherit;
    background-color: #fbfbfb00;
    border-bottom: 0px dotted #f5f5f500;
    -webkit-transition:background 0.2s ease-in;
}
.w2ui-grid .w2ui-grid-body table .w2ui-row-selected {
    color: var(--alt-text-color) !important;
}
.w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-selected{
        color: var(--alt-text-color) !important;
    background-color: #fcd9ff00 !important;
    border-bottom: 1px solid transparent;
}
.w2ui-grid .w2ui-grid-body table td {
    border-right: 1px solid #f1f1f100;
    border-bottom: 1px solid #ffffff0d;
    cursor: default;
    overflow: hidden;
}
.offcanvas-header .btn-close {
    filter: var(--close-filter);
}
.offcanvas-header{
    z-index: 1;
}   
/* Table Grid Elements Style  */
.w2ui-grid .w2ui-grid-toolbar {
    border-bottom: 1px solid #00000000;
    background-color: #000000bf;
    box-shadow: none;
}
.w2ui-grid .w2ui-grid-header {
    color: var(--text-color);
    background-color: #000000b0;
    border-bottom: 1px solid #00000000 !important;
}
.w2ui-grid .w2ui-grid-body table .w2ui-col-number {
    color: var(--text-color);
    background-color: rgb(233 237 243 / 0%) !important;
}
.w2ui-grid .w2ui-grid-footer {
    color: var(--text-color);
    background: var(--grid-footer-background);
    border: 0;
    height: 25px;
        padding-top: 2px;
    box-shadow: 0px 0px 6px var(--alt-background-color);
}
.w2ui-grid .w2ui-grid-toolbar .w2ui-grid-search-input .w2ui-search-all {
    border: 1px solid #ffffff1c !important;
    color: #fff !important;
    background-color: #00000000 !important;
}

.w2ui-grid .w2ui-grid-toolbar .w2ui-grid-search-input .w2ui-search-down,
.w2ui-toolbar .w2ui-scroll-wrapper .w2ui-tb-button .w2ui-tb-icon > span,
.w2ui-grid .w2ui-grid-toolbar .w2ui-grid-search-input .w2ui-search-drop span.w2ui-icon-drop{
    font-size: 12px;
    color: #ffffff;
}
.w2ui-overlay .w2ui-grid-search-advanced {
    text-align: left;
    padding: 0px;
    background-color: #000000e8;
    text-shadow: none;
    border: 1px solid #ffffff0d;
    box-shadow: none;
}
.w2ui-overlay .w2ui-grid-search-advanced .search-title {
    padding: 20px 0px 9px 20px;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
}
.w2ui-overlay .w2ui-grid-search-advanced table td.operator select,
.w2ui-overlay .w2ui-grid-search-advanced table {
    width: 100%;
    color: #fff;
}
select.w2ui-input {
    color: #fff;
    background: rgba(0,0,0,0.35);
    padding: 0px 20px 0px 7px;
    line-height: 1.8;
    border-radius: 3px;
    border: 1px solid #ffffff;
    background-image: rgba(0,0,0,0.35);
    background-size: 17px 6px, 100% 100%;
    background-position: right center, left top;
    background-repeat: no-repeat, no-repeat;
}
.w2ui-overlay .w2ui-grid-search-advanced table td.actions:nth-child(2) {
    padding: 25px 10px 10px 10px;
    text-align: right;
    background-color: rgba(0,0,0,0.35);
}
.w2ui-grid .w2ui-grid-toolbar .w2ui-grid-searches {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    border-top: 1px solid #ffffff0d;
    border-bottom: 1px solid #ffffff0d;
    background-color: rgba(0,0,0,0.35);
    margin: 7px -20px 0px -20px;
    padding: 6px 50px 6px 20px;
    height: 36px;
}
.w2ui-grid .w2ui-grid-toolbar .w2ui-grid-searches > span {
    min-width: 48px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    border: 1px solid #ffffff0d;
    border-radius: 15px;
    padding: 4px 12px;
    margin: 0px 4px;
    color: #ffffff;
    font-size: 12px;
    font-weight: bold;
    background-color: rgba(0,0,0,0.35);
}
.w2ui-grid .w2ui-grid-toolbar .w2ui-grid-searches .w2ui-grid-search-logic {
    border: 1px solid #ffffff0d !important;
    color: #ffffff !important;
}
input:not([type=button]):not([type=submit]).w2ui-input:focus, textarea.w2ui-input:focus {
    outline-color: #0d022c;
    background-color: var(--act-input-background-color);
}
.w2ui-grid .w2ui-grid-toolbar .w2ui-grid-search-input .w2ui-search-all {
    border: 1px solid #ffffff1c !important;
    color: #fff !important;
    background-color: #00000000 !important;
    text-shadow: none;
}
/* w2ui Calender  */
.w2ui-calendar .w2ui-cal-title, .w2ui-calendar .w2ui-time-title {
    padding: 7px 2px;
    text-align: center;
    cursor: pointer;
}
.w2ui-calendar .w2ui-cal-days .w2ui-day.w2ui-weekday,
.w2ui-calendar .w2ui-cal-days .w2ui-day {
    text-align: center;
    -webkit-transition:all 0.2s ease-in;
}
.w2ui-calendar .w2ui-cal-days .w2ui-day.w2ui-saturday, 
.w2ui-calendar .w2ui-cal-days .w2ui-day.w2ui-sunday {
    color: #c8493b;
    background-color: var(--background-color-lite);
}
.w2ui-calendar.w2ui-overlay-body {
    border: 1px solid var(--background-color);
    color: var(--text-color);
    text-shadow: none;
    background-color: var(--background-color);
    box-shadow: 0px 0px 3px var(--alt-background-color);
}
.w2ui-overlay .w2ui-overlay-body.w2ui-arrow-top:after{
        box-shadow: -2px -1px 3px var(--alt-background-color);
}
.w2ui-calendar .w2ui-cal-days .w2ui-day.outside {
    color: #b5b5b5;
    background-color: rgb(204 204 204 / 50%);
}
.w2ui-calendar .w2ui-cal-now {
    cursor: default;
    padding: 3px;
    text-align: center;
    margin: 5px;
}
.w2ui-calendar .w2ui-cal-days .w2ui-day.w2ui-weekday:hover {
    /*border: 1px solid #0a0a0a;*/
    background-color: var(--alt-background-color);
    color: var(--alt-text-color);
}
.w2ui-calendar .w2ui-cal-days .w2ui-day:hover {
    background-color: var(--alt-background-color);
    color: var(--alt-text-color);
}
.w2ui-cal-time {
    background-color: var(--background-color);
}
.w2ui-cal-time .w2ui-cal-column:nth-child(even) {
    background-color: var(--background-color-lite);
}
.w2ui-cal-time .w2ui-cal-column span{
    -webkit-transition:background 0.2s ease-in;
    border-radius: 0px;
}
.w2ui-cal-time .w2ui-cal-column span:hover {
    background-color: var(--alt-background-color);
    border: 0px solid;
    color:var(--alt-text-color);
  }
  .w2ui-cal-time .w2ui-cal-column span:active {
    background-color: var(--alt-background-color-lite);
    border: 0px solid #cec2e5;
    color:var(--alt-text-color-lite);
  }
/* Table Bordered style */
div#grid_bordered-table_records table tr td {
    border-right: 1px solid #ffffff42;
    border-bottom: 1px solid #ffffff42;
    cursor: default;
    overflow: hidden;
}

/* Table Hovered Style  */
div#grid_tableHoverStyle-table_records table tr:hover {
    background: #00000033 !important;
}
.w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-even.w2ui-empty-record:hover, .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-even.w2ui-empty-record:hover {
    background-color: rgba(0,0,0,0.35);
}

/* Hover Style  */
.w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-odd:hover, 
.w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-odd:hover, 
.w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-odd.w2ui-record-hover, 
.w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-odd.w2ui-record-hover {
    color: inherit;
    background-color: rgba(0,0,0,0.35);
}
.w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-even:hover, .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-even:hover, .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-even.w2ui-record-hover, .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-even.w2ui-record-hover {
    color: inherit;
    background-color: rgba(0,0,0,0.35);
}
.w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-odd.w2ui-empty-record:hover, .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-odd.w2ui-empty-record:hover {
    background-color: rgba(0,0,0,0.35);
}

/* Input Focus style  */
.w2ui-grid .w2ui-grid-toolbar .w2ui-grid-search-input .w2ui-search-all:focus {
    border: 1px solid rgba(0,0,0,0.35) !important;
    background-color: rgba(0,0,0,0.35) !important;
}
.w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr.w2ui-selected, .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr.w2ui-selected, .w2ui-grid .w2ui-grid-body .w2ui-grid-records table tr td.w2ui-selected, .w2ui-grid .w2ui-grid-body .w2ui-grid-frecords table tr td.w2ui-selected {
    background-color: var(--grid-selected-row-background) !important;
    border-bottom: 1px solid rgba(0,0,0,0.35);
}

/* W2 UI Tabs Style  */
.w2ui-tabs {
    color:var(--text-color);
}
button.w2ui-btn {
    border-color: transparent;
    background: rgba(0,0,0,0.35);
}
.w2ui-tabs .w2ui-scroll-wrapper .w2ui-tab {
    color: var(--text-color);
    background-color: var(--alt-background-color-vlite);
}
.w2ui-tabs .w2ui-scroll-wrapper .w2ui-tab.active {
    background: var(--act-tab-background);
    border: none;
    border-bottom: 2px solid #ffffff00;
    margin-bottom: 0px;
    line-height: 1.5;
    color: var(--alt-text-color);
}
.w2ui-tabs .w2ui-scroll-wrapper .w2ui-tab.active .w2ui-tab-close::before{
    line-height: 1.2;
}
.w2ui-tabs .w2ui-tabs-line {
    background-color: rgba(0,0,0,0.35);
}
.w2ui-tabs .w2ui-scroll-wrapper .w2ui-tab .w2ui-tab-close:hover {
    background-color: #1c1c1c00;
    opacity: 0.8;
}

/* Add/Remove Tabs  */
.w2ui-scroll-left {
    left: 0;
    box-shadow: none;
    background: var(--background-color-lite) url() center center no-repeat;
    background-size: 15px 12px;
}
.w2ui-scroll-right {
    right: 0;
    box-shadow: none;
    background: var(--background-color-lite) url() center center no-repeat;
    background-size: 15px 12px;
}
.w2ui-scroll-right:after {
    content: "\e91c";
}
.w2ui-scroll-left:after {
    content: "\e91b";
}
.w2ui-scroll-left:after,
.w2ui-scroll-right:after {
    display: block;
    position: absolute;
    top: 8px;
    left: -3px;
    font-family: zwicon !important;
    font-style: normal;
    font-weight: 400;
    font-size: 26px;
}
.w2ui-scroll-left:hover, .w2ui-scroll-right:hover {
    background-color: var(--background-color);
    cursor: pointer;
}

/* Closable Tabs  */
.w2ui-tabs .w2ui-scroll-wrapper .w2ui-tab:hover {
    /*color: #ffffff;
    background-color: rgba(0,0,0,0.35);
    */
}
.w2ui-tabs .w2ui-scroll-wrapper .w2ui-tab .w2ui-tab-close:before {
    font-family: zwicon !important;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 0.8;
    color: #fff;
    text-shadow: inherit;
    content: "\ea4c";
}
/* Calender style  */
.sidebar-calendar{
    color:var(--text-color);
}
.fc-view-harness.fc-view-harness-active {
    height: 176px !important;
}
.fc-theme-standard .fc-scrollgrid {
    border: 1px solid #ddd0;
}
.fc-scroller.fc-scroller-liquid-absolute {
    height: 145px !important;
    overflow: hidden !important;

}
button.fc-today-button.fc-button.fc-button-primary {
    display: none;
}
.fc-header-toolbar.fc-toolbar {
    background: var(--background-color-lite);
    font-size: 8px;
    padding: 5px 5px;
}
.fc .fc-daygrid-day-frame {
    height: 12px;
    min-height: 10px;

}
a:not([href]):not([tabindex]) {
    font-size: 9px;
    color: var(--text-color);
    font-weight: 400;
}
table.fc-scrollgrid-sync-table td a {
    font-size: 11px !important;
}
.fc .fc-daygrid-day-top {
    display: block;
}
.fc .fc-toolbar-title {
    font-size: 12px;
    text-transform: uppercase;
    margin: 0 0 0;
    text-shadow: 0px 0px 1px var(--text-color) !important;
}
.fc .fc-toolbar.fc-header-toolbar {
    margin-bottom: 0;
}
.fc-col-header-cell-cushion{
    text-shadow: 0px 0px 1px var(--text-color) !important;
}
.fc .fc-daygrid-day-number {
    padding: 0px 5px;
    text-shadow: 0px 0px 1px var(--text-color) !important;
}
.s-widget td {
    line-height: 2;
}
.fc .fc-daygrid-day.fc-day-today {
    background-color: rgba(0,0,0,0.2);
}
/* Form Components page custom checkbox and Radio style  */
.slider-handle.round.hide {
    display: none;
}
.checkbox-round>input[type=checkbox]:checked~label:before,
.radio-round>input[type=radio]:checked~label:before {
    opacity: 1;
    color: #fff !important;
}
.radio-round>input[type="radio"] {
    display: none;
}
label.checkbox-round,
label.radio-round{
    box-shadow: none;
    border-radius: 50%!important;
    margin-right: 4px;
    margin-bottom: 4px;
    position: relative;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgb(0 0 0 / 75%) 100%);
    border: 0;
    color: #fff;
}
.btn-check:checked+.btn {
    background-color: var(--bs-gray);
    background:var(--act-tab-background);
    color:var(--alt-text-color);
}
.btn-check:checked+.btn:hover {
    color:var(--alt-text-color);
}
.btn-check+.btn:hover {
    border-color: var(--bs-black);
    color:var(--text-color);
    background-color: var(--bs-gray);
}
.btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active, .show>.btn-outline-secondary.dropdown-toggle {
    border-color: var(--bs-black);
}
/* custom-widget page & Profile page lisview icon style  */
.listview.icon-list .media [class*="zwicon-"] {
    font-size: 2rem;
    margin-right: 8px;
}
.listview.icon-list .media i.zwicon-chevron-right,
.listview.icon-list .media i.zwicon-chevron-left {
    font-size: 3rem;
}


/* Components apge  */
h3.popover-header, .popover-body {
    color: #000;
    margin: 0;
}
.components-page .btn:not(.form-control):active, 
.components-page .btn:not(.form-control).active, 
.components-page .open .btn.dropdown-toggle:not(.form-control) {
    background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, rgba(0,0,0,1) 100%);
}
.panel-default > .panel-heading {
    padding: 8px 10px 8px;
}
.panel-default > .panel-heading  h3.panel-title{
	margin-top: 0;
	margin-bottom: 0;
}


/* Message Details Page  */
.message-attachement {
    height: 100%;
}


/* Mobile style  */
@media (min-width: 780px){
    #sidebar {
        position: fixed;
        z-index: 2;
    }
    #sidebar .side-menu,
    .side-widgets {
        padding-top: 1rem;
    }
    .superbox-show img.superbox-current-img {
        width: 600px;
        float: left;
    }
    .superbox-show .img-info {
        padding-top: 1rem;
    }
}
@media ( max-width: 780px ){

    /* Mobile Nav Toggle  */
    .offcanvas {
        position: fixed !important;
        bottom: 0;
        display: block;
        overflow: auto;
        max-width: 100%;
        color: #ffffff;
        visibility: hidden;
        background-color: #0e0e0e;
        background-clip: padding-box;
        outline: 0;
    }
    .offcanvas.offcanvas-start {
        top: 0;
        left: 45px;
        width: 80%;
        border-right: var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);
        transform: translateX(-100%);
    }
    .side-menu .menu-item {
        background: rgb(0 0 0 / 0%);
        margin-left: 20px;
        float: none;
        display: inline-block;
        padding: 16px 15px 15px 8px !important;
    }
    ul.list-unstyled.side-menu li {
        margin-bottom: -5px;
    }
    ul.list-unstyled.menu-item {
        width: 70%;
        margin-left: 63px;
    }
    .profile-menu > li {
        position: relative;
        margin-bottom: 0px;
    }
    .side-menu > li > a {
        height: 50px;
    }
    .side-menu > li > a:before {
        font-size: 28px;
        line-height: 1.8;
        margin-left: 15px;
    }
    .side-menu ul li > a {
        padding: 0px 0px 5px 0px;
        float: left;
        width: 100%;
    }

    /* Header style  */
    .header{
        height: 72px;
    }
    #sidebar {
        top: 0px;
        height: 100%;
    }
    #menu-toggle{
        height: 100% !important;
        background: transparent;
    }
    #offcanvas{
        height: 60% !important;
        background: transparent;
        width: 50px;
        padding-left: 14px;
    }
    .top-nav>li>a:not(.header__nav__text) {
        min-width: 40px;
    }

    /* Content  */
    #content {
        margin-top: 77px;
    }

    /* Toast  */
    .toast {
        max-width: 100%;
    }
    .toast--right {
        top: 0.5rem;
        right: 0.4rem;
    }
    .toast--bottom-right {
        bottom: 0.5rem;
        right: 0.5rem;
    }
    .toast--bottom-left {
        bottom: 0.5rem;
        left: 0.5rem;
    }
    .toast--right,
    .toast--bottom-right, 
    .toast--bottom-left {
        position: absolute;
        min-width: 70%;
        max-width: 70%;
    }
    
    /* list view page  */
    .message-search:focus {
        width: 353px !important;
        position: absolute;
        left: -218px;
        border: 0;
        background-color: #000;
        margin-top: -3px;
        height: 50px;
        background: #000;
        padding-left: 43px;
        font-size: 14px;
        z-index: 12;
    }

    /* form components page  */
    .date_time-picker .form-control.datetime-picker.flatpickr-input.input-default, .date_time-picker .form-control.date-picker.flatpickr-input.input-default {
        padding: 10px 0px 0px 10px;
        width: 85% !important;
    }
    .date_time-picker>label {
        left: 15%;
        z-index: 2;
    }
    .date_time-picker .input-group-prepend {
        width: 15%;
    }

}
.login .client .logo{
    margin: auto;
    height: 128px;
    background-size: contain;
    background-repeat: no-repeat;
        margin-bottom: 5px;
    background-position: center;
}
.login .client .name{
    text-align: center;
    padding: 5px;
    font-family: var(--font-family-prod) ;
    font-size: 20px;
    text-shadow: 0px 0px 3px #000;
}

.login .product .logo{
    margin: auto;
    height: 92px;
    background-size: contain;
    background-repeat: no-repeat;
        margin-bottom: 5px;
    background-position: center;
}
.login .product .name{
    text-align: justify;
    padding: 5px;
    font-size: 10px;
}

.login .robingis{
        height: 40px;
    filter: var(--logo-filter);
    margin-top: 10px;
}
a{
    text-decoration: none !important;
    border-bottom: none !important;
}
[aria-hidden="true"] { visibility: hidden; display: none;}
.loader_win{
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color: rgba(0,0,0,0.5);
    z-index: 9999999;
}
.loader_win .loader{
    width: 58px;
    height: 58px;
    background: #ffffff;
    border-radius: 40px !important;
    box-shadow: 0px 0px 5px #000000;
    padding: 10px;
    margin: auto;
    margin-top: 60%;
    /* background-image: linear-gradient(180deg, #373737 , #ffffff); */
    border-style: solid;
    border-width: 3px;
    border-color: #4a4a48;
}
.page-login{
    z-index: 6000 !important;
}
.logosmall{
    width: 40px;
    height: 40px;
    float: left;
    background-size: contain;
    margin: -10px;
}
/*.page{
    background-image: url(../../assets/img/body/violate.jpg);
        background-size: 100% 100%;
    background-attachment: fixed;
}*/
.page-title i{
        font-size: 26px;
    float: left;
    margin-top: -5px;
}
::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.6); 
    background-color: rgba(255,255,255,0.4);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
    background-color: rgba(0,0,0,0.8);
}
.tooltip.stt{
    border-width: 1px;
    border-color: #FFF;
    border-style: solid;
}
.tstatus{
    width: 16px;
    height: 16px;
    border-radius: 10px;
    background-color: #717171;
    box-shadow: inset 0px 0px 3px #000;
}
.tstatus.success{
    background-color: #005723;
}
.tstatus.pending{
    background-color: #850000;
}
.tstatus.progress{
    background-color: #cdbf00;
}
#webgis_map{
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    transition: right 0.5s ease-out;
}
#main_window{
     position: absolute;
    left: 0px;
    right: 0px;
    top: 28px;
    bottom: 0px;
    transition: right 0.5s ease-out;
}
.sidekick{
    position: absolute;
    right: 0px;
    top: 0px;
    bottom: 0px;
    width: 0px;
    transition: right 0.3s ease-out;
    background: linear-gradient(360deg, var(--background-color), var(--background-color-lite) 100%);
    z-index: 999;
    box-shadow: 0px 0px 3px;
}
.sidekick .sidekick-header{
display: flex;
    align-items: center;
    justify-content: space-between;
   padding: 10px;
   overflow: hidden;
       background-color: var(--background-color);
    box-shadow: var(--alt-header-shadow);
}
.sidekick .sidekick-header .title{
    margin-bottom: 0;
    line-height: var(--bs-offcanvas-title-line-height);
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 1px;
}
.sidekick .sidekick-header .btn-close
{
    margin-top: calc(-.5 * var(--bs-offcanvas-padding-y));
    margin-right: calc(-.5 * var(--bs-offcanvas-padding-x));
    margin-bottom: calc(-.5 * var(--bs-offcanvas-padding-y));
    filter:var(--close-filter);
}
.sidekick .sidekick-body{
        padding: 0px;
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    top: 38px;
    background: var(--background-color-lite);
    padding-top: 10px;
    overflow-y: auto;
    overflow-x: hidden;
}
.fab_button{
    position: absolute;
    width: 42px;
    height: 42px;
    background: var(--background-color);
    z-index: 99999999;
    border-radius: 32px;
    font-size: 25px;
    box-shadow: 0px 0px 4px #000;
    cursor: pointer;
    right: 10px;
    top: 10px;
    color: var(--text-color);
    transition: all 0.4s ease-out;
}
.fab_button:hover{
    background: var(--alt-background-color);
    color:var(--alt-text-color);
}
.fullscreen_menu{
    position: absolute;
    z-index:9999999;
    right: 0px;
    top: 0px;
    bottom: 0px;
    left: 0px;
    background-color: var(--background-color);
}
.poweredBy{
    width: 100px;
    background: #000000c4;
    border-radius: 3px;
    padding: 2px 5px 5px 5px;
    height: 38px;
    margin-left: 10px;
    margin-right: -10px;
}
.samvriddhi{
        width: 39px;
    height: 85px;
    position: absolute;
    bottom: 56px;
    left: 0px;
    background: #ffffff;
    margin: 3px;
    border-radius: 4px;
}
.samvriddhi .logo{
        background-image: url(../client_data/samvriddhi.png);
    background-position: center;
    background-size: 160%;
    height: 45px;
}
.samvriddhi .sus{
    background-image: url(../client_data/sus.jpg);
    background-position: center;
    background-size: 100%;
    height: 35px;
    width: 35px;
    margin: 2px;
}

.rgis svg g{
    width: 256px;
    height: 256px;
}
.rgis svg polygon{
    fill:none;
    stroke:#000;
    stroke-width:1px;
    opacity:0.8;
}
.rgis svg polyline{
    fill:none;
    stroke:#000;
    stroke-width:1px;
    opacity:0.8;
}
.rgis svg rect{
    fill:#000;
    fill-opacity:0.4;
    stroke:#000;
    stroke-width:1px;
    opacity:0.8;
    width: 10px;
    height: 10px;
}
.layerData{
    position: relative;
}
.layer_tabs{
        position: relative;
    height: 30px;
    padding-left: 0px;
    padding-right: 0px;
}
.layer_content{
    position: relative;
}
.layer_content .ttl{
    font-weight: bold;
}
#printPage
{
  position: relative;
  background: #FFF;
  z-index: 99999;
  top:0px;
  overflow: hidden;
}
#printPage .pheader{
  height: 65px;
}
#printPage .ptitle
{
  font-size: 30px;
  font-weight: bold;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
        padding-top: 10px;
        color:#000;
}
#printPage .plogo{
  position: absolute;
    margin: 5px;
    margin-left: 5px;
}
#printPage .pbody{
  margin:0px;
  margin-top:10px;
}
#printPage .gisC{
  float: left;
  width:100%;
  margin-left:20px;
  box-shadow: 0px 0px 3px #000;
    border-radius: 4px;
}
#printPage .gisC img{
  box-shadow: 0px 0px 5px #AAB;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    border-color: #AAB;
}
#printPage .pfooter{
      margin: 10px
}
#printPage .legends{
      float: left;
      margin-left: 20px;
      margin-top: 10px;
      color: #000;
      position: relative;
}
#printPage .legends img{
    background-color: #FFF;border-radius: 4px;
    box-shadow: 0px 0px 3px #FFF;
}
#printPage .legends .leg{
    margin: 3px;
    margin-bottom: 5px;
    width: 170px;
    float: left;
    font-size: 10px;
}
#printPage .legends .leg label{
    font-size: 10px;
    line-height: 11px;
    text-indent: 0px;
}
.logo_s{
  left: 0px;
    position: absolute;
    top: 5px;
    height: 38px;
    width: 40px;
    margin: 5px;
}
.mobile_title{
  position: absolute;left: 50px;width: 200px;top: 7px;
}
#printPage .compass{
      float: right;
}
@media print
{    
    /*.no-print, .no-print *
    {
        display: none !important;
    }*/
}
.legends img{
    background-color: #FFF;border-radius: 4px;
    box-shadow: 0px 0px 3px #000;
}

svg.incident{
    width: 64px;
    height: 64px;
}
svg.incident circle.icn {
    stroke-width: 2px;
    stroke-opacity: 1;
}
svg.incident.open circle{
    stroke: red;
    fill:red;
}
svg.incident.closed circle{
    stroke: green;
    fill:green;
}
svg.incident.warn circle{
    stroke: blue;
    fill:background;
}
svg.incident.alert circle{
    stroke: orange;
    fill:background;
}
svg.incident circle.pulser {
    fill: white;
    fill-opacity: 0;
    transform-origin: 50% 50%;
    animation-duration: 1s;
    animation-name: pulser;
    animation-iteration-count: infinite;
}
@keyframes pulser {
    from {
        stroke-width: 3px;
        stroke-opacity: 1;
        transform: scale(0.3);
    }
    to {
        stroke-width: 0;
        stroke-opacity: 0;
        transform: scale(2);
    }
}
input:-webkit-autofill{
    -webkit-background-clip: text;
    -webkit-text-fill-color: var(--text-color);
    transition: background-color 5000s ease-in-out 0s;
    /*box-shadow: inset 0 0 20px 20px #23232329;*/
}
/* Types */
#app height{
    display: none;
}
#app.empty header{
    display: none;
}
#app.empty aside{
    display: none;
}
#app.empty section{
    margin-top: 0px !important;
    height: 100%;
}
#app.empty .views{
    width: calc(100% - 0px);
    height: 100%;
}
#app.default .side-widgets{
    visibility: hidden;
}
#app.default #sidebar{
    width: 45px;
}
#app.default .views{
    width: calc(100% - 45px);
}
#app.full .side-widgets{
    visibility: visible;
}
#app.full #sidebar{
    width: 233px;
    box-shadow: 0px 0px 2px #000;
}
#app.full .views{
    width: calc(100% - 233px);
}
#assets_list .assets{
    cursor: pointer;
    transition: background-color 0.5s ease;
}
#assets_list .assets.active{
    background: rgba(0,0,0,0.1);
    box-shadow: 0px 0px 5px var(--alt-background-color-lite);
}
#assets_list .assets:hover{
    box-shadow: 0px 0px 4px var(--alt-background-color);
}


.tree ul {
    padding-top: 20px; position: relative;

    transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
        padding-left: 1px;
}

.tree li {
    float: left; text-align: center;
    list-style-type: none;
    position: relative;
    padding: 20px 2px 0 0px;
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;

}

.tree li::before, .tree li::after{
    content: '';
    position: absolute; top: 0; right: 50%;
    border-top: 1px solid #ccc;
    width: 50%; height: 20px;
}
.tree li::after{
    right: auto; left: 50%;
    border-left: 1px solid #ccc;
}

.tree li:only-child::after, .tree li:only-child::before {
    display: none;
}

.tree li:only-child{ padding-top: 0;}

.tree li:first-child::before, .tree li:last-child::after{
    border: 0 none;
}

.tree li:last-child::before{
    border-right: 1px solid #ccc;
    border-radius: 0 5px 0 0;
    -webkit-border-radius: 0 5px 0 0;
    -moz-border-radius: 0 5px 0 0;
}

.tree li:first-child::after{
    border-radius: 5px 0 0 0;
    -webkit-border-radius: 5px 0 0 0;
    -moz-border-radius: 5px 0 0 0;
}

.tree ul ul::before{
    content: '';
    position: absolute; top: 0; left: 50%;
    border-left: 1px solid #ccc;
    width: 0; height: 20px;
}

.tree li .tree_node{
    border: 1px solid #ccc;
    padding: 5px 10px;
    text-decoration: none;
    display: inline-block;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-transition: all 0.5s;
    background-color: var(--background-color);;
    box-shadow: 0px 0px 3px #505050;
}
.tree li .tree_node .bg-dark{
    color:#FFF;
}
.tree li .tree_node:hover, .tree li .tree_node:hover+ul li .tree_node {
    background: #c8e4f8; color: #000; border: 1px solid #94a0b4;
}
.tree li .tree_node:hover .count, .tree li .tree_node:hover+ul li .tree_node .count{
    color:#FFF;
}

.tree li .tree_node:hover+ul li::after,
.tree li .tree_node:hover+ul li::before,
.tree li .tree_node:hover+ul::before,
.tree li .tree_node:hover+ul ul::before{
    border-color:  #94a0b4;
}
#dashboard_charts .chart{
    height: 300px;
}
.treelist ul{
    list-style: none;
        border-width: 0px;
    border-style: solid;
    border-left-width: 1px;
    margin-left: 13px;
    margin-top: -3px;
}
#direction .routers{
    cursor: pointer;
}
#direction .routers:hover{
    box-shadow: 0px 0px 3px #FFF;
}
.offcanvas-header {
    background-color: var(--background-color);
    box-shadow: var(--alt-header-shadow);
}
.offcanvas-body {
    background: var(--background-color-lite);
}
label.radio-block {
    box-shadow: none;
    border-radius: 5px !important;
    margin-right: 4px;
    margin-bottom: 4px;
    position: relative;
    border: 0;
    width: 100%;
    height: 70px;
    background-size: cover;
    box-shadow: 0px 0px 3px #000;
}

.timeline{
    width:100%;
}
.timeline ul{
    list-style-type:none;
    border-left:2px solid #094a68;
    padding:10px 5px;
}
.timeline ul li{
    padding:5px 5px;
    position:relative;
    cursor:pointer;
    transition:all .5s ease-in;
}
.timeline ul li span{
        display: inline-block;
    background-color: var(--info);
    border-radius: 25px;
    padding: 5px 10px;
    font-size: 12px;
    text-align: center;
    margin-left: 0px;
        color: #fff;
    font-weight: 600;
    box-shadow: 0px 0px 3px #000;
}
.timeline ul li span:after {
      content: " ";
    position: absolute;
    left: -1px;
    top: 5px;
    border-top: 14px solid transparent;
    border-right: 16px solid var(--info);
    border-left: none;
    border-bottom: 13px solid transparent;
}
.timeline ul li:before{
    position:absolute;
    content:'';
    width:10px;
    height:10px;
    background-color:var(--info);
    border-radius:50%;
    left:-11px;
    top:15px;
    transition:.5s;
}
.timeline ul li:hover{
    background-color:var(--timeline-hover-bg);
}
.timeline ul li:hover:before{
    background-color:#0F0;
    box-shadow:0px 0px 10px 2px #0F0;
}
@media (max-width:300px){
    .timeline{
        width:100%;
        padding:30px 5px 30px 10px;
    }
    .timeline ul li .t-content h3{
        color:#34ace0;
        font-size:15px;
    }

}
:root {
  --hand-width: 0.5rem;
  --sec-hand: 6rem;
  --min-hand: calc(var(--sec-hand) * 0.85);
  --hour-hand: calc(var(--sec-hand) * 0.6);
  --clr-red: hsl(11, 79%, 49%);
  --clr-dark: hsl(0, 0%, 19%);
}
.clock-body {
      height: 15rem;
    width: 15rem;
    border-radius: 50%;
    position: relative;
    box-shadow: inset 0px 0px 30px #a6a9b4, 0 0 0 6px #333;
    background: #FFF;
    margin: auto;
}
.clock-body .apm{
        background: #253d97;
    padding: 10px;
    position: absolute;
    right: 40px;
    top: 78px;
    border-radius: 24px;
    font-weight: 600;
    font-size: 12px;
    box-shadow: 0px 0px 3px #000;
    z-index: 0;
}
.clock-body .disc {
width: 0.5rem;
    height: 0.5rem;
    background: #ff8080;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;
    transform: translateX(-50%) translateY(-50%);
}

.clock-body .disc-bottom {
  width: 0.9rem;
  height: 0.9rem;
  background: #333;
  z-index: 1;
}

.clock-body .hand {
  background: #000;
  border-radius: 15px 15px 0 0;
  position: absolute;
  bottom: 50%;
  left: 50%;
  transform-origin: bottom;
  transition: all 0.02s ease-in;
  transition-timing-function: cubic-bezier(0.1, 2.7, 0.58, 1);
}
.clock-body .minute {
  height: var(--min-hand);
  width: 0.3rem;
  transform: translateX(-50%) rotate(0deg);
  background: #000;
  z-index: 2;
}
.clock-body .minute::after {
  content: "";
  height: 1.2rem;
  width: 0.3rem;
  background: #000;
  position: absolute;
  top: 100%;
  border-radius: 0px 0px 10px 10px;
}

.clock-body .hour {
  height: var(--hour-hand);
  width: 0.4rem;
  background: #000;
  transform: translateX(-50%) rotate(0deg);
  z-index: 1;
}

.clock-body .hour::after {
  content: "";
  height: 1.2rem;
  width: 0.4rem;
  background: #000;
  position: absolute;
  top: 100%;
  border-radius: 0px 0px 10px 10px;
}

.clock-body .hour-number {
  position: absolute;
  left: 50%;
  height: 7.5rem;
  transform-origin: bottom;
  padding: 1rem;
  color: #000;
  user-select: none;
  font-size: 1.4rem;
}

.clock-body .minute-bar {
  position: absolute;
  left: 50%;
  width: 1rem;
  height: 7.5rem;
  transform-origin: bottom;
  transform: rotate(20deg) translateX(-50%);
}

.clock-body .hour-number::before,
.clock-body .minute-bar::before {
  content: "";
  position: absolute;
  left: 50%;
  right: 50%;
  top: 0px;
  border-radius: 0px 0px 15px 15px;
  transform: translateX(-50%);
  background: #000;
}

.clock-body .hour-number::before {
  height: 10px;
  width: 4px;
}

.clock-body .minute-bar::before {
  height: 6px;
  width: 2px;
}
s{
    text-decoration: inherit;
}
.w2ui-calendar .w2ui-cal-jump {

    background-color: var(--background-color);
}
#chatWindow{
    position: fixed;
    right: 10px;
    bottom: 0px;
    z-index: 9;
    background: var(--background-color);
}
#chatWindow .tile-title{
    cursor: pointer;
}
#chatWindow #chatBox{
    -webkit-transition:all 0.1s ease-in-out;
    overflow: hidden;
}
#chatWindow #chatBox.closed{
    width: 150px;
    height: 0px;
}
#chatWindow #chatBox.open{
    width: 350px;
    height: 400px;
}
#chatWindow #chatBox .msgBox{
        width: 100%;
    padding: 5px;
    min-height: 40px;
    position: relative;

    float: left;
}
#chatWindow #chatBox .msgBox .user.u{
    top: calc(100% / 2 - 12.5px);
    right: 8px;
}
#chatWindow #chatBox .msgBox .user.s{
    top: calc(100% / 2 - 12.5px);
    left: 8px;
    border-width: 0px;
}
#chatWindow #chatBox .msgBox .user{
    width: 25px;
    height: 25px;
    background-size: contain;
    background-repeat: no-repeat;
    border-radius: 30px;
    /* margin-top: -10px; */
    box-shadow: 0px 0px 4px #000;
    /* float: left; */
    border-width: 2px;
    border-style: solid;
    position: absolute;
}
#chatWindow #chatBox .msgBox .loader
{
    width: 50px;
}
#chatWindow #chatBox .msgBox .user.process{
    border-color:#bdb200;
}
#chatWindow #chatBox .msgBox .user.sent{
    border-color:#00778d;
}
#chatWindow #chatBox .msgBox .user.error{
    border-color:#8d0017;
}
#chatWindow #chatBox .msgBox .user.done{
    border-color:#8d0017;
}
#chatWindow #chatBox .msgBox .msg.u{
        margin-right: 20px;
        color: #1a1a1a;
        background-image: linear-gradient(to top, #e9e9e9 0%, #b7b7b7 100%);
        width: max-content;
    float: right;
    max-width: calc(100% - 20px);
}
#chatWindow #chatBox .msgBox .msg.s{
        margin-left: 20px;
        background-image: linear-gradient(to top, #393939 0%, #292929 100%);
    color: #FFF;
    width: max-content;
    max-width: calc(100% - 20px);
}
#chatWindow #chatBox .msgBox .msg{
    margin: 0px 5px 0px 5px;
    min-height: 30px;
    box-shadow: 0px 0px 4px #000;
    border-radius: 5px;
    
    padding: 5px 10px 5px 10px;
    -webkit-transition: all 0.1s ease-in-out;
    position: relative;
}
.wrapper {
  position: relative;
  display: flex;
  align-items: center;
  margin-left: 150px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.wrapper span {
  --d: 4px;
  display: inline-block;
  margin-inline: max(2px, calc(var(--d) / 5));
  width: var(--d);
  height: var(--d);
  background: white;
  border-radius: calc(var(--d) / 2);
  -webkit-animation: scale-up-down 500ms var(--delay) linear alternate infinite;
          animation: scale-up-down 500ms var(--delay) linear alternate infinite;

}

.wrapper span:nth-child(1) {
  --delay: calc(-100ms * (6 - 1));
}

.wrapper span:nth-child(2) {
  --delay: calc(-100ms * (6 - 2));
}

.wrapper span:nth-child(3) {
  --delay: calc(-100ms * (6 - 3));
}

.wrapper span:nth-child(4) {
  --delay: calc(-100ms * (6 - 4));
}

.wrapper span:nth-child(5) {
  --delay: calc(-100ms * (6 - 5));
}

@-webkit-keyframes scale-up-down {
  to {
    height: calc(var(--d) * 4);
  }
}

@keyframes scale-up-down {
  to {
    height: calc(var(--d) * 4);
  }
}@font-face{font-family:zwicon;src:url(/fonts/zwicon.eot?k483k8);src:url(/fonts/zwicon.eot?k483k8#iefix) format('embedded-opentype'),url(/fonts/zwicon.ttf?k483k8) format('truetype'),url(/fonts/zwicon.woff?k483k8) format('woff'),url(/fonts/zwicon.svg?k483k8#zwicon) format('svg');font-weight:400;font-style:normal}[class*="zwicon-"]{font-family:zwicon!important;speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.zwicon-align-bottom:before{content:"\e900"}.zwicon-align-h:before{content:"\e901"}.zwicon-align-left:before{content:"\e902"}.zwicon-align-right:before{content:"\e903"}.zwicon-align-top:before{content:"\e904"}.zwicon-align-v:before{content:"\e905"}.zwicon-distribute-h:before{content:"\e906"}.zwicon-distribute-v:before{content:"\e907"}.zwicon-arrow-bottom-left:before{content:"\e908"}.zwicon-arrow-bottom-right:before{content:"\e909"}.zwicon-arrow-circle-down:before{content:"\e90a"}.zwicon-arrow-circle-left:before{content:"\e90b"}.zwicon-arrow-circle-right:before{content:"\e90c"}.zwicon-arrow-circle-up:before{content:"\e90d"}.zwicon-arrow-down:before{content:"\e90e"}.zwicon-arrow-left:before{content:"\e90f"}.zwicon-arrow-right:before{content:"\e910"}.zwicon-arrow-square-down:before{content:"\e911"}.zwicon-arrow-square-left:before{content:"\e912"}.zwicon-arrow-square-right:before{content:"\e913"}.zwicon-arrow-square-up:before{content:"\e914"}.zwicon-arrow-to-top:before{content:"\e915"}.zwicon-arrow-top-left:before{content:"\e916"}.zwicon-arrow-top-right:before{content:"\e917"}.zwicon-arrow-up:before{content:"\e918"}.zwicon-back:before{content:"\e919"}.zwicon-chevron-double-down:before{content:"\e91a"}.zwicon-chevron-double-left:before{content:"\e91b"}.zwicon-chevron-double-right:before{content:"\e91c"}.zwicon-chevron-double-up:before{content:"\e91d"}.zwicon-chevron-down:before{content:"\e91e"}.zwicon-chevron-left:before{content:"\e91f"}.zwicon-chevron-right:before{content:"\e920"}.zwicon-chevron-up:before{content:"\e921"}.zwicon-collapse-alt:before{content:"\e922"}.zwicon-collapse-alt2:before{content:"\e923"}.zwicon-collapse-down:before{content:"\e924"}.zwicon-collapse-left:before{content:"\e925"}.zwicon-collapse-right:before{content:"\e926"}.zwicon-collapse-up:before{content:"\e927"}.zwicon-collapse:before{content:"\e928"}.zwicon-continue:before{content:"\e929"}.zwicon-expand-alt:before{content:"\e92a"}.zwicon-expand-alt2:before{content:"\e92b"}.zwicon-expand-down:before{content:"\e92c"}.zwicon-expand-h:before{content:"\e92d"}.zwicon-expand-left:before{content:"\e92e"}.zwicon-expand-right:before{content:"\e92f"}.zwicon-expand-up:before{content:"\e930"}.zwicon-expand-v:before{content:"\e931"}.zwicon-expand:before{content:"\e932"}.zwicon-loop:before{content:"\e933"}.zwicon-prioritize-down:before{content:"\e934"}.zwicon-prioritize-up:before{content:"\e935"}.zwicon-redo:before{content:"\e936"}.zwicon-refresh-double:before{content:"\e937"}.zwicon-refresh-left:before{content:"\e938"}.zwicon-refresh-right:before{content:"\e939"}.zwicon-restart:before{content:"\e93a"}.zwicon-split-h:before{content:"\e93b"}.zwicon-split-v:before{content:"\e93c"}.zwicon-undo:before{content:"\e93d"}.zwicon-cell-border-bottom:before{content:"\e93e"}.zwicon-cell-border-full:before{content:"\e93f"}.zwicon-cell-border-left:before{content:"\e940"}.zwicon-cell-border-right:before{content:"\e941"}.zwicon-cell-border-top:before{content:"\e942"}.zwicon-cell-empty:before{content:"\e943"}.zwicon-cell-full:before{content:"\e944"}.zwicon-cell-split-h:before{content:"\e945"}.zwicon-cell-split-v:before{content:"\e946"}.zwicon-cell-split:before{content:"\e947"}.zwicon-archive:before{content:"\e948"}.zwicon-document:before{content:"\e949"}.zwicon-folder-delete:before{content:"\e94a"}.zwicon-folder-minus:before{content:"\e94b"}.zwicon-folder-open:before{content:"\e94c"}.zwicon-folder-plus:before{content:"\e94d"}.zwicon-folder:before{content:"\e94e"}.zwicon-note:before{content:"\e94f"}.zwicon-notebook:before{content:"\e950"}.zwicon-script:before{content:"\e951"}.zwicon-sticker:before{content:"\e952"}.zwicon-sticky-notes:before{content:"\e953"}.zwicon-tray-delete:before{content:"\e954"}.zwicon-tray-empty:before{content:"\e955"}.zwicon-tray-export:before{content:"\e956"}.zwicon-tray-import:before{content:"\e957"}.zwicon-tray-minus:before{content:"\e958"}.zwicon-tray-plus:before{content:"\e959"}.zwicon-tray-stack:before{content:"\e95a"}.zwicon-tray:before{content:"\e95b"}.zwicon-artboard:before{content:"\e95c"}.zwicon-brush:before{content:"\e95d"}.zwicon-clipboard:before{content:"\e95e"}.zwicon-copy-alt:before{content:"\e95f"}.zwicon-copy:before{content:"\e960"}.zwicon-crop:before{content:"\e961"}.zwicon-cut-alt:before{content:"\e962"}.zwicon-cut:before{content:"\e963"}.zwicon-drafting-compass:before{content:"\e964"}.zwicon-duplicate-alt:before{content:"\e965"}.zwicon-duplicate:before{content:"\e966"}.zwicon-eraser:before{content:"\e967"}.zwicon-eye-dropper:before{content:"\e968"}.zwicon-group:before{content:"\e969"}.zwicon-layer-stack:before{content:"\e96a"}.zwicon-magic-wand:before{content:"\e96b"}.zwicon-marker:before{content:"\e96c"}.zwicon-paint-bucket:before{content:"\e96d"}.zwicon-paint-roller:before{content:"\e96e"}.zwicon-palette:before{content:"\e96f"}.zwicon-paste-alt:before{content:"\e970"}.zwicon-paste:before{content:"\e971"}.zwicon-pen-circle:before{content:"\e972"}.zwicon-pen:before{content:"\e973"}.zwicon-pencil-circle:before{content:"\e974"}.zwicon-pencil:before{content:"\e975"}.zwicon-ruler-combined:before{content:"\e976"}.zwicon-ruler-h:before{content:"\e977"}.zwicon-ruler-v:before{content:"\e978"}.zwicon-stamp:before{content:"\e979"}.zwicon-table:before{content:"\e97a"}.zwicon-activity:before{content:"\e97b"}.zwicon-android:before{content:"\e97c"}.zwicon-apple:before{content:"\e97d"}.zwicon-bolt:before{content:"\e97e"}.zwicon-cloud-download:before{content:"\e97f"}.zwicon-cloud-minus:before{content:"\e980"}.zwicon-cloud-plus:before{content:"\e981"}.zwicon-cloud-upload:before{content:"\e982"}.zwicon-code:before{content:"\e983"}.zwicon-command:before{content:"\e984"}.zwicon-database:before{content:"\e985"}.zwicon-deploy:before{content:"\e986"}.zwicon-git-branch:before{content:"\e987"}.zwicon-git-commit:before{content:"\e988"}.zwicon-git-fork:before{content:"\e989"}.zwicon-git-merge:before{content:"\e98a"}.zwicon-git-pull:before{content:"\e98b"}.zwicon-ios:before{content:"\e98c"}.zwicon-lan-connection:before{content:"\e98d"}.zwicon-lan-error:before{content:"\e98e"}.zwicon-lan:before{content:"\e98f"}.zwicon-osx:before{content:"\e990"}.zwicon-repository:before{content:"\e991"}.zwicon-web:before{content:"\e992"}.zwicon-window-delete:before{content:"\e993"}.zwicon-window-minus:before{content:"\e994"}.zwicon-window-plus:before{content:"\e995"}.zwicon-window:before{content:"\e996"}.zwicon-windows:before{content:"\e997"}.zwicon-airpods-alt:before{content:"\e998"}.zwicon-airpods:before{content:"\e999"}.zwicon-apple-watch-smile:before{content:"\e99a"}.zwicon-apple-watch-time:before{content:"\e99b"}.zwicon-apple-watch:before{content:"\e99c"}.zwicon-cable-hdmi:before{content:"\e99d"}.zwicon-cable-jack:before{content:"\e99e"}.zwicon-cable-lan:before{content:"\e99f"}.zwicon-cable-lightning:before{content:"\e9a0"}.zwicon-cable-magsafe:before{content:"\e9a1"}.zwicon-cable-usb:before{content:"\e9a2"}.zwicon-cardboard-vr:before{content:"\e9a3"}.zwicon-controller-alt:before{content:"\e9a4"}.zwicon-controller:before{content:"\e9a5"}.zwicon-desktop:before{content:"\e9a6"}.zwicon-devices:before{content:"\e9a7"}.zwicon-floppy:before{content:"\e9a8"}.zwicon-gameboy:before{content:"\e9a9"}.zwicon-hard-drive:before{content:"\e9aa"}.zwicon-headphone:before{content:"\e9ab"}.zwicon-imac:before{content:"\e9ac"}.zwicon-ipad-h:before{content:"\e9ad"}.zwicon-ipad:before{content:"\e9ae"}.zwicon-iphone-h:before{content:"\e9af"}.zwicon-iphone-x-h:before{content:"\e9b0"}.zwicon-iphone-x:before{content:"\e9b1"}.zwicon-iphone:before{content:"\e9b2"}.zwicon-keyboard:before{content:"\e9b3"}.zwicon-laptop:before{content:"\e9b4"}.zwicon-mac-pro:before{content:"\e9b5"}.zwicon-macbook-pro:before{content:"\e9b6"}.zwicon-memory-card:before{content:"\e9b7"}.zwicon-mouse:before{content:"\e9b8"}.zwicon-phone-andorid-h:before{content:"\e9b9"}.zwicon-phone-andorid:before{content:"\e9ba"}.zwicon-phone-holding-double:before{content:"\e9bb"}.zwicon-phone-holding:before{content:"\e9bc"}.zwicon-plug:before{content:"\e9bd"}.zwicon-printer:before{content:"\e9be"}.zwicon-server-stack:before{content:"\e9bf"}.zwicon-smart-glasses:before{content:"\e9c0"}.zwicon-smart-tv:before{content:"\e9c1"}.zwicon-smart-watch-time:before{content:"\e9c2"}.zwicon-smart-watch:before{content:"\e9c3"}.zwicon-tablet-h:before{content:"\e9c4"}.zwicon-tablet:before{content:"\e9c5"}.zwicon-terminal:before{content:"\e9c6"}.zwicon-virtual-reality:before{content:"\e9c7"}.zwicon-voice-assistant:before{content:"\e9c8"}.zwicon-edit-circle:before{content:"\e9c9"}.zwicon-edit-pencil:before{content:"\e9ca"}.zwicon-edit-square-feather:before{content:"\e9cb"}.zwicon-edit-square:before{content:"\e9cc"}.zwicon-file-archive:before{content:"\e9cd"}.zwicon-file-audio:before{content:"\e9ce"}.zwicon-file-cloud:before{content:"\e9cf"}.zwicon-file-download:before{content:"\e9d0"}.zwicon-file-empty:before{content:"\e9d1"}.zwicon-file-export:before{content:"\e9d2"}.zwicon-file-font:before{content:"\e9d3"}.zwicon-file-graphic:before{content:"\e9d4"}.zwicon-file-image:before{content:"\e9d5"}.zwicon-file-import:before{content:"\e9d6"}.zwicon-file-pdf:before{content:"\e9d7"}.zwicon-file-search:before{content:"\e9d8"}.zwicon-file-sketch:before{content:"\e9d9"}.zwicon-file-table:before{content:"\e9da"}.zwicon-file-upload:before{content:"\e9db"}.zwicon-file-vector:before{content:"\e9dc"}.zwicon-file-video:before{content:"\e9dd"}.zwicon-filter-alt:before{content:"\e9de"}.zwicon-filter:before{content:"\e9df"}.zwicon-slider-circle-h:before{content:"\e9e0"}.zwicon-slider-circle-v:before{content:"\e9e1"}.zwicon-slider-rectangle-h:before{content:"\e9e2"}.zwicon-slider-rectangle-v:before{content:"\e9e3"}.zwicon-sort-alphabetic-down:before{content:"\e9e4"}.zwicon-sort-alphabetic-up:before{content:"\e9e5"}.zwicon-sort-amount-down:before{content:"\e9e6"}.zwicon-sort-amount-up:before{content:"\e9e7"}.zwicon-sort-numeric-down:before{content:"\e9e8"}.zwicon-sort-numeric-up:before{content:"\e9e9"}.zwicon-toggle-switch:before{content:"\e9ea"}.zwicon-bar-code-scan:before{content:"\e9eb"}.zwicon-bar-code:before{content:"\e9ec"}.zwicon-bid:before{content:"\e9ed"}.zwicon-bill:before{content:"\e9ee"}.zwicon-bitcoin-sign:before{content:"\e9ef"}.zwicon-bull-horn:before{content:"\e9f0"}.zwicon-coin:before{content:"\e9f1"}.zwicon-credit-card:before{content:"\e9f2"}.zwicon-diamond:before{content:"\e9f3"}.zwicon-dollar-sign:before{content:"\e9f4"}.zwicon-euro-sign:before{content:"\e9f5"}.zwicon-hammer:before{content:"\e9f6"}.zwicon-line-chart:before{content:"\e9f7"}.zwicon-lira-sign:before{content:"\e9f8"}.zwicon-money-bill:before{content:"\e9f9"}.zwicon-money-stack:before{content:"\e9fa"}.zwicon-package:before{content:"\e9fb"}.zwicon-piggy-bank:before{content:"\e9fc"}.zwicon-pound-sign:before{content:"\e9fd"}.zwicon-price-tag:before{content:"\e9fe"}.zwicon-qr-code-scan:before{content:"\e9ff"}.zwicon-qr-code:before{content:"\ea00"}.zwicon-receipt:before{content:"\ea01"}.zwicon-rubel-sign:before{content:"\ea02"}.zwicon-rupee-sign:before{content:"\ea03"}.zwicon-sale-badge:before{content:"\ea04"}.zwicon-shopping-bag-alt:before{content:"\ea05"}.zwicon-shopping-bag:before{content:"\ea06"}.zwicon-shopping-cart:before{content:"\ea07"}.zwicon-store:before{content:"\ea08"}.zwicon-wallet:before{content:"\ea09"}.zwicon-won-sign:before{content:"\ea0a"}.zwicon-yen-sign:before{content:"\ea0b"}.zwicon-flip-left-alt:before{content:"\ea0c"}.zwicon-flip-left:before{content:"\ea0d"}.zwicon-flip-right-alt:before{content:"\ea0e"}.zwicon-flip-right:before{content:"\ea0f"}.zwicon-double-tap-two:before{content:"\ea10"}.zwicon-double-tap:before{content:"\ea11"}.zwicon-drag:before{content:"\ea12"}.zwicon-flick-left-two:before{content:"\ea13"}.zwicon-flick-left:before{content:"\ea14"}.zwicon-flick-right-two:before{content:"\ea15"}.zwicon-flick-right:before{content:"\ea16"}.zwicon-horns:before{content:"\ea17"}.zwicon-pinch:before{content:"\ea18"}.zwicon-point:before{content:"\ea19"}.zwicon-press:before{content:"\ea1a"}.zwicon-scroll-down-two:before{content:"\ea1b"}.zwicon-scroll-down:before{content:"\ea1c"}.zwicon-scroll-h-two:before{content:"\ea1d"}.zwicon-scroll-h:before{content:"\ea1e"}.zwicon-scroll-up-two:before{content:"\ea1f"}.zwicon-scroll-up:before{content:"\ea20"}.zwicon-scroll-v-two:before{content:"\ea21"}.zwicon-scroll-v:before{content:"\ea22"}.zwicon-shaka:before{content:"\ea23"}.zwicon-spread:before{content:"\ea24"}.zwicon-tap-two:before{content:"\ea25"}.zwicon-tap:before{content:"\ea26"}.zwicon-two-drag:before{content:"\ea27"}.zwicon-add-item-alt:before{content:"\ea28"}.zwicon-add-item:before{content:"\ea29"}.zwicon-add-note:before{content:"\ea2a"}.zwicon-add-to-list:before{content:"\ea2b"}.zwicon-at:before{content:"\ea2c"}.zwicon-attach-document:before{content:"\ea2d"}.zwicon-paperclip:before{content:"\ea2e"}.zwicon-battery-full:before{content:"\ea30"}.zwicon-battery-low:before{content:"\ea31"}.zwicon-battery-mid:before{content:"\ea32"}.zwicon-battery-v:before{content:"\ea33"}.zwicon-bell-alt-ring:before{content:"\ea34"}.zwicon-bell-alt:before{content:"\ea35"}.zwicon-bell-slash:before{content:"\ea36"}.zwicon-bell-snooze:before{content:"\ea37"}.zwicon-bell:before{content:"\ea38"}.zwicon-block:before{content:"\ea39"}.zwicon-book-alt:before{content:"\ea3a"}.zwicon-book:before{content:"\ea3b"}.zwicon-bookmark:before{content:"\ea3c"}.zwicon-briefcase:before{content:"\ea3d"}.zwicon-calendar-day:before{content:"\ea3e"}.zwicon-calendar-month:before{content:"\ea3f"}.zwicon-calendar-never:before{content:"\ea40"}.zwicon-calendar-week:before{content:"\ea41"}.zwicon-calendar:before{content:"\ea42"}.zwicon-call-in:before{content:"\ea43"}.zwicon-call-out:before{content:"\ea44"}.zwicon-chat:before{content:"\ea45"}.zwicon-checkmark-circle:before{content:"\ea46"}.zwicon-checkmark-square:before{content:"\ea47"}.zwicon-checkmark:before{content:"\ea48"}.zwicon-clock:before{content:"\ea49"}.zwicon-close-circle:before{content:"\ea4a"}.zwicon-close-square:before{content:"\ea4b"}.zwicon-close:before{content:"\ea4c"}.zwicon-cog:before{content:"\ea4d"}.zwicon-comment:before{content:"\ea4e"}.zwicon-compass:before{content:"\ea4f"}.zwicon-delete:before{content:"\ea50"}.zwicon-download:before{content:"\ea51"}.zwicon-earth-alt:before{content:"\ea52"}.zwicon-earth:before{content:"\ea53"}.zwicon-exclamation-triangle:before{content:"\ea54"}.zwicon-exclamation-mark:before{content:"\ea2f"}.zwicon-export:before{content:"\ea55"}.zwicon-eye-slash:before{content:"\ea56"}.zwicon-eye:before{content:"\ea57"}.zwicon-face-id:before{content:"\ea58"}.zwicon-flag:before{content:"\ea59"}.zwicon-grid:before{content:"\ea5a"}.zwicon-hamburger-menu:before{content:"\ea5b"}.zwicon-heart:before{content:"\ea5c"}.zwicon-home:before{content:"\ea5d"}.zwicon-import:before{content:"\ea5e"}.zwicon-info-circle:before{content:"\ea5f"}.zwicon-lifebelt:before{content:"\ea60"}.zwicon-link:before{content:"\ea61"}.zwicon-lock-alt:before{content:"\ea62"}.zwicon-lock:before{content:"\ea63"}.zwicon-mail:before{content:"\ea64"}.zwicon-map-marker:before{content:"\ea65"}.zwicon-minus-circle:before{content:"\ea66"}.zwicon-minus-square:before{content:"\ea67"}.zwicon-minus:before{content:"\ea68"}.zwicon-more-h:before{content:"\ea69"}.zwicon-more-v:before{content:"\ea6a"}.zwicon-my-location:before{content:"\ea6b"}.zwicon-password:before{content:"\ea6c"}.zwicon-phone:before{content:"\ea6d"}.zwicon-pin:before{content:"\ea6e"}.zwicon-plus-circle:before{content:"\ea6f"}.zwicon-plus-square:before{content:"\ea70"}.zwicon-plus:before{content:"\ea71"}.zwicon-search:before{content:"\ea72"}.zwicon-send:before{content:"\ea73"}.zwicon-share:before{content:"\ea74"}.zwicon-shortcut:before{content:"\ea75"}.zwicon-sign-in:before{content:"\ea76"}.zwicon-sign-out:before{content:"\ea77"}.zwicon-thumbs-down:before{content:"\ea78"}.zwicon-thumbs-up:before{content:"\ea79"}.zwicon-trash:before{content:"\ea7a"}.zwicon-unlink:before{content:"\ea7b"}.zwicon-upload:before{content:"\ea7c"}.zwicon-user-circle:before{content:"\ea7d"}.zwicon-user-delete:before{content:"\ea7e"}.zwicon-user-follow:before{content:"\ea7f"}.zwicon-user-minus:before{content:"\ea80"}.zwicon-user-plus:before{content:"\ea81"}.zwicon-user:before{content:"\ea82"}.zwicon-users:before{content:"\ea83"}.zwicon-history:before{content:"\ea84"}.zwicon-task:before{content:"\ea85"}.zwicon-bottom-bar:before{content:"\ea86"}.zwicon-content-left:before{content:"\ea87"}.zwicon-content-right:before{content:"\ea88"}.zwicon-desktop-1:before{content:"\ea89"}.zwicon-desktop-2:before{content:"\ea8a"}.zwicon-desktop-3:before{content:"\ea8b"}.zwicon-half-h:before{content:"\ea8c"}.zwicon-half-v:before{content:"\ea8d"}.zwicon-layout-1:before{content:"\ea8e"}.zwicon-layout-2:before{content:"\ea8f"}.zwicon-layout-3:before{content:"\ea90"}.zwicon-layout-4:before{content:"\ea91"}.zwicon-layout-5:before{content:"\ea92"}.zwicon-left-bar:before{content:"\ea93"}.zwicon-margin:before{content:"\ea94"}.zwicon-right-bar:before{content:"\ea95"}.zwicon-sidebar:before{content:"\ea96"}.zwicon-three-h:before{content:"\ea97"}.zwicon-three-v:before{content:"\ea98"}.zwicon-to-bottom:before{content:"\ea99"}.zwicon-to-left:before{content:"\ea9a"}.zwicon-to-right:before{content:"\ea9b"}.zwicon-to-top:before{content:"\ea9c"}.zwicon-top-bar:before{content:"\ea9d"}.zwicon-airplay:before{content:"\ea9e"}.zwicon-broadcast:before{content:"\ea9f"}.zwicon-camera-alt:before{content:"\eaa0"}.zwicon-camera-alt2:before{content:"\eaa1"}.zwicon-camera:before{content:"\eaa2"}.zwicon-cast:before{content:"\eaa3"}.zwicon-collapse-wide:before{content:"\eaa4"}.zwicon-collapse1:before{content:"\eaa5"}.zwicon-disk:before{content:"\eaa6"}.zwicon-expand-wide:before{content:"\eaa7"}.zwicon-expand1:before{content:"\eaa8"}.zwicon-film-alt:before{content:"\eaa9"}.zwicon-film-play:before{content:"\eaaa"}.zwicon-film:before{content:"\eaab"}.zwicon-image-circle:before{content:"\eaac"}.zwicon-image-gallery:before{content:"\eaad"}.zwicon-image-wide:before{content:"\eaae"}.zwicon-image:before{content:"\eaaf"}.zwicon-microphone-mute:before{content:"\eab0"}.zwicon-microphone:before{content:"\eab1"}.zwicon-next-alt:before{content:"\eab2"}.zwicon-next:before{content:"\eab3"}.zwicon-panorama-h:before{content:"\eab4"}.zwicon-pause-alt:before{content:"\eab5"}.zwicon-pause:before{content:"\eab6"}.zwicon-play-alt:before{content:"\eab7"}.zwicon-play:before{content:"\eab8"}.zwicon-previous-alt:before{content:"\eab9"}.zwicon-previous:before{content:"\eaba"}.zwicon-shuffle:before{content:"\eabb"}.zwicon-video-alt:before{content:"\eabc"}.zwicon-video-camera:before{content:"\eabd"}.zwicon-video:before{content:"\eabe"}.zwicon-volume-low:before{content:"\eabf"}.zwicon-volume-max:before{content:"\eac0"}.zwicon-volume-mid:before{content:"\eac1"}.zwicon-volume-min:before{content:"\eac2"}.zwicon-wide-angle:before{content:"\eac3"}.zwicon-exclude:before{content:"\eac4"}.zwicon-flatten:before{content:"\eac5"}.zwicon-intersect:before{content:"\eac6"}.zwicon-substract-back:before{content:"\eac7"}.zwicon-substract-front:before{content:"\eac8"}.zwicon-unite:before{content:"\eac9"}.zwicon-height:before{content:"\eaca"}.zwicon-resize-alt:before{content:"\eacb"}.zwicon-resize:before{content:"\eacc"}.zwicon-scale-down:before{content:"\eacd"}.zwicon-scale-up:before{content:"\eace"}.zwicon-scale:before{content:"\eacf"}.zwicon-width:before{content:"\ead0"}.zwicon-rotate-axis-x:before{content:"\ead1"}.zwicon-rotate-axis-xy:before{content:"\ead2"}.zwicon-rotate-axis-y:before{content:"\ead3"}.zwicon-rotate-left:before{content:"\ead4"}.zwicon-rotate-right:before{content:"\ead5"}.zwicon-rotate-shape:before{content:"\ead6"}.zwicon-cursor-square:before{content:"\ead7"}.zwicon-cursor:before{content:"\ead8"}.zwicon-select-cursor:before{content:"\ead9"}.zwicon-select:before{content:"\eada"}.zwicon-shape-circle:before{content:"\eadb"}.zwicon-shape-cone:before{content:"\eadc"}.zwicon-shape-cube:before{content:"\eadd"}.zwicon-shape-cylinder:before{content:"\eade"}.zwicon-shape-octagonal:before{content:"\eadf"}.zwicon-shape-polygon:before{content:"\eae0"}.zwicon-shape-sphere:before{content:"\eae1"}.zwicon-shape-square:before{content:"\eae2"}.zwicon-laugh:before{content:"\eae3"}.zwicon-neutral:before{content:"\eae4"}.zwicon-sad:before{content:"\eae5"}.zwicon-smile:before{content:"\eae6"}.zwicon-bold:before{content:"\eae7"}.zwicon-draw-text-field:before{content:"\eae8"}.zwicon-font-height:before{content:"\eae9"}.zwicon-font-size:before{content:"\eaea"}.zwicon-font-width:before{content:"\eaeb"}.zwicon-font:before{content:"\eaec"}.zwicon-heading:before{content:"\eaed"}.zwicon-indent-left-alt:before{content:"\eaee"}.zwicon-indent-left:before{content:"\eaef"}.zwicon-indent-right-alt:before{content:"\eaf0"}.zwicon-indent-right:before{content:"\eaf1"}.zwicon-italic:before{content:"\eaf2"}.zwicon-list-bullet:before{content:"\eaf3"}.zwicon-list-number:before{content:"\eaf4"}.zwicon-outdent-left:before{content:"\eaf5"}.zwicon-outdent-right:before{content:"\eaf6"}.zwicon-paragraph:before{content:"\eaf7"}.zwicon-text-align-center:before{content:"\eaf8"}.zwicon-text-align-justify:before{content:"\eaf9"}.zwicon-text-align-left:before{content:"\eafa"}.zwicon-text-align-right:before{content:"\eafb"}.zwicon-text-cursor:before{content:"\eafc"}.zwicon-text-decoration:before{content:"\eafd"}.zwicon-text-field:before{content:"\eafe"}.zwicon-text:before{content:"\eaff"}.zwicon-underline:before{content:"\eb00"}.zwicon-wrap-img-left:before{content:"\eb01"}.zwicon-wrap-img-right:before{content:"\eb02"}.zwicon-wrap-left:before{content:"\eb03"}.zwicon-wrap-right:before{content:"\eb04"}.zwicon-transform-left:before{content:"\eb05"}.zwicon-transform-right:before{content:"\eb06"}.zwicon-ab-testing:before{content:"\eb07"}.zwicon-agile:before{content:"\eb08"}.zwicon-backlog:before{content:"\eb09"}.zwicon-design-studio:before{content:"\eb0a"}.zwicon-design-validation:before{content:"\eb0b"}.zwicon-information-architecture:before{content:"\eb0c"}.zwicon-interview:before{content:"\eb0d"}.zwicon-kanban-board:before{content:"\eb0e"}.zwicon-lego-serious-play:before{content:"\eb0f"}.zwicon-paper-prototype:before{content:"\eb10"}.zwicon-persona:before{content:"\eb11"}.zwicon-prototype-mobile:before{content:"\eb12"}.zwicon-prototype:before{content:"\eb13"}.zwicon-responsive:before{content:"\eb14"}.zwicon-screen-flow:before{content:"\eb15"}.zwicon-stand-up:before{content:"\eb16"}.zwicon-sticky-notes1:before{content:"\eb17"}.zwicon-usability:before{content:"\eb18"}.zwicon-user-flow:before{content:"\eb19"}.zwicon-user-interview:before{content:"\eb1a"}.zwicon-user-journey:before{content:"\eb1b"}.zwicon-cloud:before{content:"\eb1c"}.zwicon-cloudy-day:before{content:"\eb1d"}.zwicon-cloudy-night:before{content:"\eb1e"}.zwicon-heavy-rain-day:before{content:"\eb1f"}.zwicon-heavy-rain-night:before{content:"\eb20"}.zwicon-heavy-rain:before{content:"\eb21"}.zwicon-heavy-wind:before{content:"\eb22"}.zwicon-mild-rain-day:before{content:"\eb23"}.zwicon-mild-rain-night:before{content:"\eb24"}.zwicon-mild-rain:before{content:"\eb25"}.zwicon-moon:before{content:"\eb26"}.zwicon-rain-day:before{content:"\eb27"}.zwicon-rain-night:before{content:"\eb28"}.zwicon-rain:before{content:"\eb29"}.zwicon-snow-day:before{content:"\eb2a"}.zwicon-snow-night:before{content:"\eb2b"}.zwicon-snow:before{content:"\eb2c"}.zwicon-storm-day:before{content:"\eb2d"}.zwicon-storm-night:before{content:"\eb2e"}.zwicon-storm:before{content:"\eb2f"}.zwicon-sun:before{content:"\eb30"}.zwicon-temperature:before{content:"\eb31"}.zwicon-wind-alt:before{content:"\eb32"}.zwicon-wind-cloudy-day:before{content:"\eb33"}.zwicon-wind-cloudy-night:before{content:"\eb34"}.zwicon-wind-cloudy:before{content:"\eb35"}.zwicon-wind:before{content:"\eb36"}/*
 * The MIT License
 * Copyright (c) 2012 Matias Meno <m@tias.me>
 */
@-webkit-keyframes passing-through {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px); }
  30%, 70% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px); }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    -moz-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    -o-transform: translateY(-40px);
    transform: translateY(-40px); } }
@-moz-keyframes passing-through {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px); }
  30%, 70% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px); }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    -moz-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    -o-transform: translateY(-40px);
    transform: translateY(-40px); } }
@keyframes passing-through {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px); }
  30%, 70% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px); }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    -moz-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    -o-transform: translateY(-40px);
    transform: translateY(-40px); } }
@-webkit-keyframes slide-in {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px); }
  30% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px); } }
@-moz-keyframes slide-in {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px); }
  30% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px); } }
@keyframes slide-in {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px); }
  30% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px); } }
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }
  10% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1); }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); } }
@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }
  10% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1); }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); } }
@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }
  10% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1); }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); } }
.dropzone, .dropzone * {
  box-sizing: border-box; }

.dropzone {
  min-height: 150px;
  border: 2px solid rgba(0, 0, 0, 0.3);
  background: white;
  padding: 20px 20px; }
  .dropzone.dz-clickable {
    cursor: pointer; }
    .dropzone.dz-clickable * {
      cursor: default; }
    .dropzone.dz-clickable .dz-message, .dropzone.dz-clickable .dz-message * {
      cursor: pointer; }
  .dropzone.dz-started .dz-message {
    display: none; }
  .dropzone.dz-drag-hover {
    border-style: solid; }
    .dropzone.dz-drag-hover .dz-message {
      opacity: 0.5; }
  .dropzone .dz-message {
    text-align: center;
    margin: 2em 0; }
  .dropzone .dz-preview {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin: 16px;
    min-height: 100px; }
    .dropzone .dz-preview:hover {
      z-index: 1000; }
      .dropzone .dz-preview:hover .dz-details {
        opacity: 1; }
    .dropzone .dz-preview.dz-file-preview .dz-image {
      border-radius: 20px;
      background: #999;
      background: linear-gradient(to bottom, #eee, #ddd); }
    .dropzone .dz-preview.dz-file-preview .dz-details {
      opacity: 1; }
    .dropzone .dz-preview.dz-image-preview {
      background: white; }
      .dropzone .dz-preview.dz-image-preview .dz-details {
        -webkit-transition: opacity 0.2s linear;
        -moz-transition: opacity 0.2s linear;
        -ms-transition: opacity 0.2s linear;
        -o-transition: opacity 0.2s linear;
        transition: opacity 0.2s linear; }
    .dropzone .dz-preview .dz-remove {
      font-size: 14px;
      text-align: center;
      display: block;
      cursor: pointer;
      border: none; }
      .dropzone .dz-preview .dz-remove:hover {
        text-decoration: underline; }
    .dropzone .dz-preview:hover .dz-details {
      opacity: 1; }
    .dropzone .dz-preview .dz-details {
      z-index: 20;
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0;
      font-size: 13px;
      min-width: 100%;
      max-width: 100%;
      padding: 2em 1em;
      text-align: center;
      color: rgba(0, 0, 0, 0.9);
      line-height: 150%; }
      .dropzone .dz-preview .dz-details .dz-size {
        margin-bottom: 1em;
        font-size: 16px; }
      .dropzone .dz-preview .dz-details .dz-filename {
        white-space: nowrap; }
        .dropzone .dz-preview .dz-details .dz-filename:hover span {
          border: 1px solid rgba(200, 200, 200, 0.8);
          background-color: rgba(255, 255, 255, 0.8); }
        .dropzone .dz-preview .dz-details .dz-filename:not(:hover) {
          overflow: hidden;
          text-overflow: ellipsis; }
          .dropzone .dz-preview .dz-details .dz-filename:not(:hover) span {
            border: 1px solid transparent; }
      .dropzone .dz-preview .dz-details .dz-filename span, .dropzone .dz-preview .dz-details .dz-size span {
        background-color: rgba(255, 255, 255, 0.4);
        padding: 0 0.4em;
        border-radius: 3px; }
    .dropzone .dz-preview:hover .dz-image img {
      -webkit-transform: scale(1.05, 1.05);
      -moz-transform: scale(1.05, 1.05);
      -ms-transform: scale(1.05, 1.05);
      -o-transform: scale(1.05, 1.05);
      transform: scale(1.05, 1.05);
      -webkit-filter: blur(8px);
      filter: blur(8px); }
    .dropzone .dz-preview .dz-image {
      border-radius: 20px;
      overflow: hidden;
      width: 120px;
      height: 120px;
      position: relative;
      display: block;
      z-index: 10; }
      .dropzone .dz-preview .dz-image img {
        display: block; }
    .dropzone .dz-preview.dz-success .dz-success-mark {
      -webkit-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
      -moz-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
      -ms-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
      -o-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
      animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1); }
    .dropzone .dz-preview.dz-error .dz-error-mark {
      opacity: 1;
      -webkit-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
      -moz-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
      -ms-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
      -o-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
      animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1); }
    .dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark {
      pointer-events: none;
      opacity: 0;
      z-index: 500;
      position: absolute;
      display: block;
      top: 50%;
      left: 50%;
      margin-left: -27px;
      margin-top: -27px; }
      .dropzone .dz-preview .dz-success-mark svg, .dropzone .dz-preview .dz-error-mark svg {
        display: block;
        width: 54px;
        height: 54px; }
    .dropzone .dz-preview.dz-processing .dz-progress {
      opacity: 1;
      -webkit-transition: all 0.2s linear;
      -moz-transition: all 0.2s linear;
      -ms-transition: all 0.2s linear;
      -o-transition: all 0.2s linear;
      transition: all 0.2s linear; }
    .dropzone .dz-preview.dz-complete .dz-progress {
      opacity: 0;
      -webkit-transition: opacity 0.4s ease-in;
      -moz-transition: opacity 0.4s ease-in;
      -ms-transition: opacity 0.4s ease-in;
      -o-transition: opacity 0.4s ease-in;
      transition: opacity 0.4s ease-in; }
    .dropzone .dz-preview:not(.dz-processing) .dz-progress {
      -webkit-animation: pulse 6s ease infinite;
      -moz-animation: pulse 6s ease infinite;
      -ms-animation: pulse 6s ease infinite;
      -o-animation: pulse 6s ease infinite;
      animation: pulse 6s ease infinite; }
    .dropzone .dz-preview .dz-progress {
      opacity: 1;
      z-index: 1000;
      pointer-events: none;
      position: absolute;
      height: 16px;
      left: 50%;
      top: 50%;
      margin-top: -8px;
      width: 80px;
      margin-left: -40px;
      background: rgba(255, 255, 255, 0.9);
      -webkit-transform: scale(1);
      border-radius: 8px;
      overflow: hidden; }
      .dropzone .dz-preview .dz-progress .dz-upload {
        background: #333;
        background: linear-gradient(to bottom, #666, #444);
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 0;
        -webkit-transition: width 300ms ease-in-out;
        -moz-transition: width 300ms ease-in-out;
        -ms-transition: width 300ms ease-in-out;
        -o-transition: width 300ms ease-in-out;
        transition: width 300ms ease-in-out; }
    .dropzone .dz-preview.dz-error .dz-error-message {
      display: block; }
    .dropzone .dz-preview.dz-error:hover .dz-error-message {
      opacity: 1;
      pointer-events: auto; }
    .dropzone .dz-preview .dz-error-message {
      pointer-events: none;
      z-index: 1000;
      position: absolute;
      display: block;
      display: none;
      opacity: 0;
      -webkit-transition: opacity 0.3s ease;
      -moz-transition: opacity 0.3s ease;
      -ms-transition: opacity 0.3s ease;
      -o-transition: opacity 0.3s ease;
      transition: opacity 0.3s ease;
      border-radius: 8px;
      font-size: 13px;
      top: 130px;
      left: -10px;
      width: 140px;
      background: #be2626;
      background: linear-gradient(to bottom, #be2626, #a92222);
      padding: 0.5em 1.2em;
      color: white; }
      .dropzone .dz-preview .dz-error-message:after {
        content: '';
        position: absolute;
        top: -6px;
        left: 64px;
        width: 0;
        height: 0;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-bottom: 6px solid #be2626; }
/*!
 * Bootstrap Colorpicker v2.5.2
 * https://itsjavi.com/bootstrap-colorpicker/
 *
 * Originally written by (c) 2012 Stefan Petre
 * Licensed under the Apache License v2.0
 * http://www.apache.org/licenses/LICENSE-2.0.txt
 *
 */
.colorpicker-saturation {
  width: 100px;
  height: 100px;
  background-image: url("data:image/png;base64,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");
  cursor: crosshair;
  float: left;
}
.colorpicker-saturation i {
  display: block;
  height: 5px;
  width: 5px;
  border: 1px solid #000;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  position: absolute;
  top: 0;
  left: 0;
  margin: -4px 0 0 -4px;
}
.colorpicker-saturation i b {
  display: block;
  height: 5px;
  width: 5px;
  border: 1px solid #fff;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.colorpicker-hue,
.colorpicker-alpha {
  width: 15px;
  height: 100px;
  float: left;
  cursor: row-resize;
  margin-left: 4px;
  margin-bottom: 4px;
}
.colorpicker-hue i,
.colorpicker-alpha i {
  display: block;
  height: 1px;
  background: #000;
  border-top: 1px solid #fff;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  margin-top: -1px;
}
.colorpicker-hue {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAABkCAMAAABw8qpSAAABLFBMVEXqFBb/ABH/ACL/ADH/AEH/AFD/AGD/AG7/AH7/AI3/AJ3/AKz/ALz/AMr/ANv/AOr/APr2AP/mAP/XAP/HAP+4AP+oAP+aAP+JAP97AP9rAP9cAP9MAP8+AP8tAP8fAP8PAP8BAv8AEP8AH/8AL/8APv8ATv8AXP8Abf8Ae/8Ai/8Amv8Aqv8AuP8Ayf8A1/8A5/8A9/8A//gA/+kA/9kA/8oA/7oA/6wA/5sA/40A/30A/24A/14A/1AA/z8A/zEA/yEA/xEB/wMN/wAd/wAs/wA8/wBK/wBb/wBp/wB5/wCI/wCY/wCm/wC3/wDF/wDV/wDk/wD1/wD/+gD/7AD/3AD/zAD/vgD/rQD/nwD/jgD/gAD/cAD/YgD/UQD/QwD/MgD/JAD/FAD4Eg42qAedAAAAh0lEQVR4XgXAg3EDAAAAwI9to7Zt27a1/w49BASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTS1tHXo1KVbj159+g0YNGTYiFFjxk2YNGXajFlz5i1YtGTZilVr1m3YtGXbjl179h04dOTYiVNnzl24dOXajVt37j149OTZi1dv3n349OXbj19//wOxE1dQ8reGAAAAAElFTkSuQmCC");
}
.colorpicker-alpha {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAABkCAQAAAAVxWkcAAABr0lEQVR4Xo2VwU0DQQxF7dmRuNIFlzlSAR3QAaXQQdIBJVABFXDcOVAAd67cjJLR07dkhcSrkZKfb/t7bG88rFo3B5gZPMNycItu2xloGV7MWHzM9zuzFWCkmA0nK6AszCUJDW6+mG6R03ncw5v8EMTEvZ2O3AliYjpslblc0RF9LmZYWxURU6aKytWZYsoWCAe+xwOZp1GsEukGiIkYxcQCHck99+gRgB7JncyIB5SGEhP3Yh5P6JwX+u6AnYot104d8DJT7uH7M9JH6OZbimj0vfMVaYnJIZFJDBW9kHlerL2C6JV4mSt7uuo2N57RxnZ+usQjn0R1jwBJBrNO3evJpVYUWsJ/E3UiXRlv24/7YZ04xmEdWlzcKS+B/eapeyMvFd2k0+hRk/T0AmTW8h69s2sjYMsdPntECiILhAeIMZAeH4QvUwfn6ijC0tTV+fT9ky8jM9nK2g7Ly1VjSpKYq6IvsAm7MtNu1orEqa/K3KNvgMFdhfquPfJmp2dbh0/8Gzb6Y22ViaNr6n5410zXdngVhbu6XqdOtWOuin5hjABGp4a2uotZ71MVCfwDBt2/v37yo6AAAAAASUVORK5CYII=");
  display: none;
}
.colorpicker-saturation,
.colorpicker-hue,
.colorpicker-alpha {
  background-size: contain;
}
.colorpicker {
  padding: 4px;
  min-width: 130px;
  margin-top: 1px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  z-index: 99999 !important;
}
.colorpicker:before,
.colorpicker:after {
  display: table;
  content: "";
  line-height: 0;
}
.colorpicker:after {
  clear: both;
}
.colorpicker:before {
  content: '';
  display: inline-block;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid #ccc;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  position: absolute;
  top: -7px;
  left: 6px;
}
.colorpicker:after {
  content: '';
  display: inline-block;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #ffffff;
  position: absolute;
  top: -6px;
  left: 7px;
}
.colorpicker div {
  position: relative;
}
.colorpicker.colorpicker-with-alpha {
  min-width: 140px;
}
.colorpicker.colorpicker-with-alpha .colorpicker-alpha {
  display: block;
}
.colorpicker-color {
  height: 10px;
  margin-top: 5px;
  clear: both;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAABkCAQAAAAVxWkcAAABr0lEQVR4Xo2VwU0DQQxF7dmRuNIFlzlSAR3QAaXQQdIBJVABFXDcOVAAd67cjJLR07dkhcSrkZKfb/t7bG88rFo3B5gZPMNycItu2xloGV7MWHzM9zuzFWCkmA0nK6AszCUJDW6+mG6R03ncw5v8EMTEvZ2O3AliYjpslblc0RF9LmZYWxURU6aKytWZYsoWCAe+xwOZp1GsEukGiIkYxcQCHck99+gRgB7JncyIB5SGEhP3Yh5P6JwX+u6AnYot104d8DJT7uH7M9JH6OZbimj0vfMVaYnJIZFJDBW9kHlerL2C6JV4mSt7uuo2N57RxnZ+usQjn0R1jwBJBrNO3evJpVYUWsJ/E3UiXRlv24/7YZ04xmEdWlzcKS+B/eapeyMvFd2k0+hRk/T0AmTW8h69s2sjYMsdPntECiILhAeIMZAeH4QvUwfn6ijC0tTV+fT9ky8jM9nK2g7Ly1VjSpKYq6IvsAm7MtNu1orEqa/K3KNvgMFdhfquPfJmp2dbh0/8Gzb6Y22ViaNr6n5410zXdngVhbu6XqdOtWOuin5hjABGp4a2uotZ71MVCfwDBt2/v37yo6AAAAAASUVORK5CYII=");
  background-position: 0 100%;
}
.colorpicker-color div {
  height: 10px;
}
.colorpicker-selectors {
  display: none;
  height: 10px;
  margin-top: 5px;
  clear: both;
}
.colorpicker-selectors i {
  cursor: pointer;
  float: left;
  height: 10px;
  width: 10px;
}
.colorpicker-selectors i + i {
  margin-left: 3px;
}
.colorpicker-element .input-group-addon i,
.colorpicker-element .add-on i {
  display: inline-block;
  cursor: pointer;
  height: 16px;
  vertical-align: text-top;
  width: 16px;
}
.colorpicker.colorpicker-inline {
  position: relative;
  display: inline-block;
  float: none;
  z-index: auto;
}
.colorpicker.colorpicker-horizontal {
  width: 110px;
  min-width: 110px;
  height: auto;
}
.colorpicker.colorpicker-horizontal .colorpicker-saturation {
  margin-bottom: 4px;
}
.colorpicker.colorpicker-horizontal .colorpicker-color {
  width: 100px;
}
.colorpicker.colorpicker-horizontal .colorpicker-hue,
.colorpicker.colorpicker-horizontal .colorpicker-alpha {
  width: 100px;
  height: 15px;
  float: left;
  cursor: col-resize;
  margin-left: 0px;
  margin-bottom: 4px;
}
.colorpicker.colorpicker-horizontal .colorpicker-hue i,
.colorpicker.colorpicker-horizontal .colorpicker-alpha i {
  display: block;
  height: 15px;
  background: #ffffff;
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  border: none;
  margin-top: 0px;
}
.colorpicker.colorpicker-horizontal .colorpicker-hue {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAAABCAMAAAAfBfuPAAABLFBMVEXqFBb/ABH/ACL/ADH/AEH/AFD/AGD/AG7/AH7/AI3/AJ3/AKz/ALz/AMr/ANv/AOr/APr2AP/mAP/XAP/HAP+4AP+oAP+aAP+JAP97AP9rAP9cAP9MAP8+AP8tAP8fAP8PAP8BAv8AEP8AH/8AL/8APv8ATv8AXP8Abf8Ae/8Ai/8Amv8Aqv8AuP8Ayf8A1/8A5/8A9/8A//gA/+kA/9kA/8oA/7oA/6wA/5sA/40A/30A/24A/14A/1AA/z8A/zEA/yEA/xEB/wMN/wAd/wAs/wA8/wBK/wBb/wBp/wB5/wCI/wCY/wCm/wC3/wDF/wDV/wDk/wD1/wD/+gD/7AD/3AD/zAD/vgD/rQD/nwD/jgD/gAD/cAD/YgD/UQD/QwD/MgD/JAD/FAD4Eg42qAedAAAAbUlEQVR4XgXAghEDsbxtlrZt27ax/w49ACAYQTGcICmaYTleECVZUTXdMC1Wm93hdLk9Xp8/EAyFI9FYPJFMpTPZXL5QLJUr1Vq90Wy1O91efzAcjSfT2XyxXK03293+cDydL9fb/fF8vT/f3x+LfRNXARMbCAAAAABJRU5ErkJggg==");
}
.colorpicker.colorpicker-horizontal .colorpicker-alpha {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAAAKCAQAAADoFTP1AAAB9ElEQVR4XoWTQW4VMRBEu9qWEimL7DhEMp8NF+ASnJJLcAQgE1bcgBUSkYKUuHCrZ9pjeqSU5Yn9LPu7umJQBIIv+k7vIOrtK66L4lmr3pVOrOv3otp619KZ0/KjdNI79L52Uo09FBQWrU0vfe5trezU+hLsoUKd3Repovte+0vbq/7Lj5XbaHECKasR9G4MPlbp+gzZxd6koPEJCkAYC5SjcOTAIIOK90Dja1IfIZ8Z+zAY9jm3b5Ia+MT5sFcqRJrR2AYYA8Kua5BzYRrFPNmD4PQMegGJMOffJJUsWiI3nCHZZjInNdffLWOufzbc3JaboCAVxwmnRHbhLSPwRJ4wU0BRSc6HkECYYVw95nMKgJOcylxrJttE5Ibzf9Xq9GPvP+WX3MiV/MGHfRu/SentRQrfG1GzsIrytdNXucSRKxQNIGHM9YhGFQJcdjNcBZvfJayuYe4Sia1CzwW+19mWOhe37HsxJWKwbu/jluEU15QzAQjAqCEbhMJc78GYV2E0kooHDubUImWkTOhGpgv8PoT8DJG/bzxna4BZ0eOFSOaLADGeSpFsg5AzeaDZIDQQXjZ4y/8ryfzUXBwdELRjTjCNvOeT0rNlrJz90vwy6N9pXXQEluX0inElpPWokSdiLCfiNJJjMKQ8Qsh8GEKQKMo/eiHrNbI9UksAAAAASUVORK5CYII=");
}
.colorpicker-right:before {
  left: auto;
  right: 6px;
}
.colorpicker-right:after {
  left: auto;
  right: 7px;
}
.colorpicker-no-arrow:before {
  border-right: 0;
  border-left: 0;
}
.colorpicker-no-arrow:after {
  border-right: 0;
  border-left: 0;
}
.colorpicker.colorpicker-visible,
.colorpicker-alpha.colorpicker-visible,
.colorpicker-saturation.colorpicker-visible,
.colorpicker-hue.colorpicker-visible,
.colorpicker-selectors.colorpicker-visible {
  display: block;
}
.colorpicker.colorpicker-hidden,
.colorpicker-alpha.colorpicker-hidden,
.colorpicker-saturation.colorpicker-hidden,
.colorpicker-hue.colorpicker-hidden,
.colorpicker-selectors.colorpicker-hidden {
  display: none;
}
.colorpicker-inline.colorpicker-visible {
  display: inline-block;
}