﻿.slick.slick-initialized .js-slide, .slick.slick-initialized .js-thumb {
    margin: 0!important;
}

/* Line Desc */
.badge-span {
    position: absolute;
    height: auto;
    border-radius: 10px 0px;
    margin: 0px !important;
    z-index: 2 !important;
    width: 120px;
}

.step-span {
    display: block;
    color: #677788 !important;
    border-radius: 0;
    margin-left: -16px;
    margin-right: -16px;
}


/* Rating */
/*.rating-group {
    zoom: 50%;
    display: inline-flex;
}
.rating__icon {
    pointer-events: none;
}

.rating__input {
    position: absolute !important;
    left: -9999px !important;
}

.rating__label {
    cursor: pointer;
    padding: 0 0.1em;
    font-size: 2rem;
}

.rating__label--half {
    padding-right: 0;
    margin-right: -40px;
    z-index: 2;
}

.rating__icon--star {
    color: orange;
}

.rating__icon--none {
    color: #eee;
}

.rating__input--none:checked + .rating__label .rating__icon--none {
    color: red;
}

.rating__input:checked ~ .rating__label .rating__icon--star {
    color: #ddd;
}

.rating-group:hover .rating__label .rating__icon--star,
.rating-group:hover .rating__label--half .rating__icon--star {
    color: orange;
}

.rating__input:hover ~ .rating__label .rating__icon--star,
.rating__input:hover ~ .rating__label--half .rating__icon--star {
    color: #ddd;
}

.rating-group:hover
.rating__input--none:not(:hover) + .rating__label
.rating__icon--none {
    color: #eee;
}

.rating__input--none:hover + .rating__label .rating__icon--none {
    color: red;
}*/

.jq-ry-container > .jq-ry-group-wrapper > .jq-ry-group.jq-ry-normal-group {
    height: 32px;
}
.jq-ry-container > .jq-ry-group-wrapper > .jq-ry-group.jq-ry-rated-group {
    height: 32px;
}
.jq-ry-container {
    zoom: 60%;
    margin-left: auto;
    margin-right: auto;
}
.rateYo-div {
    margin-bottom: 45px;
}
.time-span-frame {
    position: absolute;
    right: -1px;
    top: 20px;
    background: #377dff;
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
    color: white;
    font-weight: 600;
    width: 80px;
    padding: 0rem 0.5rem;
    font-size: 75%;
}
.time-span {
    position: absolute;
    right: 0;
    top: 0;
    background: #f39c12;
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
    color: white;
    font-weight: 600;
    width: 80px;
    padding: 0rem 0.5rem;
    font-size: 75%;
}
.rate-value-span {
    font-weight: 900;
    font-size: 20px;
    position: absolute;
    right: -60px;
    top: 19px;
}

.filter-slide {
    width:312px!important;
}
.filter-slide-list {
    width: auto !important;
}


#loader {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: #21325b;
    opacity: 1;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}

    #loader img {
        -webkit-animation: KEYFRAME-NAME 7s infinite;
        -moz-animation: KEYFRAME-NAME 7s infinite;
        -o-animation: KEYFRAME-NAME 7s infinite;
        animation: KEYFRAME-NAME 7s infinite;
    }

#Subloader {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: #21325b6b;
    opacity: 1;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}
#SubloaderZ {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 160px;
    background-color: white;
    opacity: 1;
    z-index: 1;
    align-items: center;
    justify-content: center;
}
    #Subloader img {
        -webkit-animation: KEYFRAME-NAME 7s infinite;
        -moz-animation: KEYFRAME-NAME 7s infinite;
        -o-animation: KEYFRAME-NAME 7s infinite;
        animation: KEYFRAME-NAME 7s infinite;
    }

@keyframes KEYFRAME-NAME {
    0% {
        opacity: 0.1;
    }

    10% {
        opacity: 0.3;
    }

    20% {
        opacity: 0.5;
    }

    30% {
        opacity: 0.7;
    }

    40% {
        opacity: 0.9;
    }

    50% {
        opacity: 0.7;
    }

    60% {
        opacity: 0.5;
    }

    70% {
        opacity: 0.3;
    }

    80% {
        opacity: 0.1;
    }

    90% {
        opacity: 0.3;
    }

    100% {
        opacity: 0.1;
    }
}
span.step-icon.step-icon-sm.step-icon-soft-primary:hover {
    background: #21325b;
    color: white;
    font-size: 20px;
}
.span-clicked {
    background: #21325b;
    color: white;
    font-size: 20px;
}

object {
    width: 100%;
}

#advancedFormSelectStepOne1 span.k-dropdown-wrap.k-state-default {
    padding: 7px;
}
#advancedFormSelectStepOne1 span.k-select {
    padding: 7px;
}
#advancedFormSelectStepOne span.k-dropdown-wrap.k-state-default {
    padding: 7px;
}

#advancedFormSelectStepOne span.k-select {
    padding: 7px;
}
.k-state-focused {
    background-color: transparent !important;
    color: black !important;
    box-shadow: inset 0 0 3px 1px transparent !important;
}

.k-state-selected {
    background: #377dff !important;
    color: white !important;
}

.k-popup .k-list .k-item {
    border: 0 !important;
    background: white !important;
    margin-top: 3px;
}

.k-column-menu .k-sprite, .k-drop-hint, .k-gantt-views > .k-current-view > .k-link:after, .k-grid-mobile .k-resize-handle-inner:after, .k-grid-mobile .k-resize-handle-inner:before, .k-grouping-dropclue, .k-icon, .k-pager-numbers .k-current-page .k-link:after, .k-scheduler-toolbar > ul.k-scheduler-views > li.k-current-view > .k-link:after, .k-tool-icon {
    zoom: 80% !important;
    margin-bottom: 2px !important;
}


.k-fieldselector .k-list .k-item, .k-list-optionlabel.k-state-focused, .k-list-optionlabel.k-state-selected, .k-overflow-container .k-state-focused, .k-overflow-container .k-state-hover, .k-overflow-container .k-state-selected, .k-popup .k-list .k-state-focused, .k-popup .k-list .k-state-hover, .k-popup .k-list .k-state-selected {
    background: #377dff !important;
    color: white !important;
    border-color: unset !important;
    /*margin-top: 3px!important;*/
}

.k-multiselect.k-header, input.k-textbox, textarea.k-textbox {
    height: 40px;
}

span.k-input {
    background:white!important;
}

span.k-widget.k-dropdown.k-header {
    background: white !important;
    border-color: #e7eaf3 !important;
}

span.k-dropdown-wrap.k-state-default {
    background: white !important;
    border-color: #e7eaf3 !important;
}

span.k-dropdown-wrap.k-state-default.k-state-hover {
    background: white !important;
    border-color: #e7eaf3 !important;
}

.k-list-filter > .k-textbox {
    border-color: #e7eaf3 !important;
}

span.k-dropdown-wrap.k-state-disabled {
    background: white !important;
    border-color: #e7eaf3 !important;
}

.k-widget.k-upload.k-header.k-upload-empty {
    width: 100%;
    border-color: #e7eaf3 !important;
    background: white !important;
}

.k-button.k-state-active, .k-button:active {
    background: #377dff !important;
    border-color: #377dff !important;
    color: white!important;
}

.k-button {
    background: white !important;
    border-color: #e7eaf3 !important;
}

.k-widget.k-upload.k-header {
    width: 100%;
    background: white !important;
    border-color: #e7eaf3 !important;
}

/* width */
::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #7d7d8e;
    border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #555;
}
/*#air-freight {
    height: 160px;
}*/
/*#blocked-stock {
    height: 160px;
}
#stock {
    height: 160px;
}
#dead-stock {
    height: 160px;
}*/
/*#inventory {
    height: 300px;
}
#cinventory {
    height: 300px;
}*/


#layout_tbl_wrapper {
    padding: 10px 15px;
}

.custome-arrow-position {
    font-size: 60px;
    color: #377dff;
}

div.dataTables_filter input {
    height:unset!important;
    padding: unset!important; 
}

div.dataTables_length select {
    height: unset!important;
    padding: unset!important;
    font-size: unset!important;
    line-height: unset!important;
}

div.dataTables_info {
    padding-top: 10px !important;
    padding-left: 10px !important;
    font-size: 0.875rem!important;
}

div.dataTables_paginate {
    margin-top: 0 !important;
    padding: 10px !important;
    background: #f8fafd !important;
    font-size: 0.875rem!important;
}
table.dataTable td, table.dataTable th {
    font-size: 0.875rem!important;
}
div.dataTables_length label {
    font-size: 0.875rem;
}
div.dataTables_filter label {
    font-size: 0.875rem;
}
table.dataTable thead .sorting:after {
    content: "" !important;
}
table.dataTable thead .sorting_desc:after {
    content: "" !important;
}

table.dataTable thead .sorting_asc:after {
    content: "" !important;
}

#navBar .navbar-body .navbar-nav {
    font-weight: 800;
}
.avatar .avatar-img {
    border: 1px solid #e7eaf3
}

#mainprofileimg {
    filter: unset !important;
    border: 1px solid #e7eaf3
}

#user .avatar-xs {
    width: 50px !important;
    height: 50px !important;
    
}

.w-45-td {
    width:100px;
}
.details-control-pool {
    width:30px;
}

table.dataTable td, table.dataTable th {
    vertical-align:middle!important;
}

.summernote-editor {
    width:100%;
}


.step .is-valid .step-icon {
    color: #377dff!important;
    background-color: rgba(55, 125, 255, 0.1)!important;
}

.side-left {
    position: absolute;
    height: 500px;
    width: 300px;
    background: #ffffff;
    z-index: 3;
    margin-top: 10px;
    display: flex;
    border-radius: 0px 5px 5px 0px;
    padding: 10px;
    border: 1px solid #e7eaf3;
    margin-left: -300px;
    z-index: 12;
}

.btn-side-left {
    padding: 10px 15px;
    background: #21325bc7;
    height: 45px;
    border-radius: 0px 10px 10px 0px;
    position: absolute;
    margin-left: 288px;
    margin-top: 150px;
    z-index: 3;
    cursor: pointer;
    color: white;
}
.itm-side-left {
    height: max-content;
    padding-bottom: 5px;
    border-bottom: 1px solid #e7eaf3;
    margin-bottom: 15px;
}
#ModelsItem {
    width: 100%;
    overflow: auto;
}
html {
    zoom: 90% !important;
}
.notification {
    text-decoration: none;
    position: relative;
    display: inline-block;
    border-radius: 2px;
}

    .notification:hover {
        background: red;
    }

    .notification .badge {
        position: absolute;
        top: -8px;
        right: -8px;
        padding: 4px 6px;
        border-radius: 50%;
        background: red;
        color: white;
    }

.modal-backdrop.fade.show {
    width: 100%;
    height: 100%;
}

video {
    width: 100%;
    height: 100%;
}

.hs-video-bg-video {
    height:100%;
}

.dzsparallaxer.auto-init.height-is-based-on-content.use-loading.mode-scroll {
    min-height: 43rem !important;
}

#overlay {
    /*background: -webkit-radial-gradient(rgba(0,0,0,0) 45%, rgba(0,0,0,0.2) 46%), -webkit-radial-gradient(rgba(0,0,0,0) 45%, rgba(0,0,0,0.2) 46%);*/
    background: -webkit-radial-gradient(rgba(0,0,0,0) 45%, rgba(0,0,0,0.2) 46%), -webkit-radial-gradient(rgba(0,0,0,0) 45%, rgb(0 0 0 / 48%) 46%);
    background-position: 0 0, 2px 2px, center center;
    background-size: 4px 4px, 4px 4px, 600px 600px;
    z-index: 998;
    width: 100%;
    height: 688px;
    position: absolute;
    top: 0;
    opacity: 0.7;
    display: flex;
}

.span-quote {
    margin: auto;
    color: white;
    background: #000000;
    padding: 0px 13px;
    font-size: 35px;
    font-family: fantasy;
    margin-bottom: 125px;
    margin-left: 20px;
}

#home-quote {
    color: #fbc00c;
}

.home-step-div {
    font-size: 20px;
    color: white;
    font-weight: 800;
    /* letter-spacing: 0.08vw; */
    text-align: center;
}
.home-step-icon {
    font-size: 20px;
    margin-right: 3px;
}

@media screen and (max-width: 1200px) {
    #dots-shap {
        display: none;
    }

    #steps-div {
        display: none;
    }
}
@media screen and (max-width:1000px){
    #footer-ul{
        display:none;
    }
    #footer-icon {
        display:none;
    }
}

.highcharts-tooltip span {
    max-height: 250px !important;
    overflow-y: scroll !important;
}