:root {
    /*COLORS for temp hos load
    --Red: #F23E4B ;
    --LightRed: #FAD2CF;
    --Yellow: #ECD424 ;
    --LightYellow: #FEEFC3;
    --Green: #5FE856 ;
    --LightGreen: #CEEAD6;
    --Blue: #365992;*/
    --ButtonPadding: 6px 10px 6px 10px !important;
    --ButtonRightMargin: 3px !important;
    --AlwaysWhite: #fff;
    --AlwaysBlack: #000;
}





.SVG-Always-Black {
    filter: brightness(0) saturate(100%)
}

.SVG-Always-White {
    filter: brightness(0) saturate(100%) invert(96%) sepia(3%) saturate(932%) hue-rotate(320deg) brightness(116%) contrast(100%);
}



.btn-primary {
    padding: var(--ButtonPadding);
    margin-right: var(--ButtonRightMargin);
}

.btn-warning {
    padding: var(--ButtonPadding);
    margin-right: var(--ButtonRightMargin);
}

.btn-danger {
    padding: var(--ButtonPadding);
    margin-right: var(--ButtonRightMargin);
}

.btn-white {
    padding: var(--ButtonPadding);
    margin-right: var(--ButtonRightMargin);
}

.btn-st {
    /*HOS SERVICES TYPE - BUTTON DONT FORMAT SAME AS OTHERS*/
}

.btn-do {
    padding: var(--ButtonPadding);
    margin-right: var(--ButtonRightMargin);
}

.btn-white2 {
    padding: var(--ButtonPadding);
    margin-right: var(--ButtonRightMargin);
}

.btn-info {
    padding: var(--ButtonPadding);
    margin-right: var(--ButtonRightMargin);
}

.btn-gray {
    padding: var(--ButtonPadding);
    margin-right: var(--ButtonRightMargin);
}

.input-group-addon {
    padding: var(--ButtonPadding);
    margin-right: var(--ButtonRightMargin);
}

.btn-success {
    padding: var(--ButtonPadding);
    margin-right: var(--ButtonRightMargin);
}

/*save space for phones*/
.panel-body {
    padding: 10px 10px 10px 10px !important;
}

.kyle-body {
    padding: 5px 5px 5px 5px;
}

.panel {
    margin-bottom: 14px !important;
}

.kyle-Container {
    padding-left: 7px !important;
    padding-right: 7px !important;
}

.Inspection-Panel-Row {
    padding-top: 15px !important;
    padding-bottom: 20px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.Theme-List-Item {
    padding: 7px !important;
}

.navbar-nav > li > a {
    line-height: 20px;
    padding: 5px 10px;
}
.user-icon {
    
}
 .dropdown-menu {
    min-width: 300px;
}

    .dropdown-menu.media-list > .media {
        border-top: 1px solid #eeeeee00;
        border-bottom: 1px solid #eeeeee00;
    }

.sidebar .sub-menu {
    padding: 10px 0 10px 10px;
}

    .sidebar .sub-menu > li > a:before {
        content: none;
        font-family: FontAwesome;
        position: absolute;
        left: 0;
        font-size: 7px;
        color: #889097;
        top: 50%;
        margin-top: -4px;
        margin-left: -6px;
    }

.bootstrap-timepicker-widget.dropdown-menu.open {
    min-width: 200px;
}



/*-----------------Switches for the drawbar settings ----------------*/

.switch {
    position: relative; /* Essential for positioning the slider */
    display: inline-block;
    width: 54px;
    height: 28px;
}

    /* Hide the default HTML checkbox */
    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

/* The slider - the track of the switch */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s; /* For smooth transitions */
    transition: .4s;
    border-radius: 34px; /* Rounded track */
}

    .slider:before {
        position: absolute;
        content: "";
        height: 20px;
        width: 20px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s; /* For smooth transitions */
        transition: .4s;
        border-radius: 50%; /* Circular knob */
    }

/* Change background color when checked */
input:checked + .slider {
    background-color: var(--Green); /* A common 'on' color */
}

    /* Move the knob when checked */
    input:checked + .slider:before {
        -webkit-transform: translateX(26px); /* Moves knob to the right */
        -ms-transform: translateX(26px);
        transform: translateX(26px);
    }

    /*leave space at the bottom of calendar so that things look right in any theme*/
.MAKECALENDARWHITE {
    margin-bottom: 15px;
}

#container{
    display:none;
}


.doto-<uniquifier > {
    font-family: "Doto", sans-serif;
    font-optical-sizing: auto;
    font-weight: <weight>;
    font-style: normal;
    font-variation-settings: "ROND" 0;
}

.slimScrollBar, .slimScrollRail {
    width: 1px !important;
    right: 0 !important;
    display:none;
}
.panel-heading-btn{
    padding-right:10px !important;
}

#kModal80Background {
    position: fixed;
    color:#fff;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9); /* Semi-transparent black */
    z-index: 9999; /* Ensure it's below the modal but above the page */
    /* Hidden by default */
}

.svg-btn-primary {
    filter: brightness(0) saturate(100%) invert(96%) sepia(3%) saturate(932%) hue-rotate(320deg) brightness(116%) contrast(100%);
}
.divider-noline {
    color: #00000000;
    background-color: #00000000 !important;
    
}

.modal-style-k
{
    position: fixed;
    top: 10%;
    left: 10%;
    width: 80vw; /* 50% of viewport width */
    height: 80vh;
    background: var(--BodyColor);
    padding: 2px;
    border: 2px solid var(--Yellow);
    border-radius: var(--WidgetRadius);
    z-index: 10000;
    font-size: 14px;
    color: var(--BodyFontColor);
}


.navbar-nav > li > .dropdown-menu {
    border-top: 1px solid #eeeeee57;
}

.select2-container--default .select2-results > .select2-results__options {
    max-height: 300px !important;
}

@media (min-width: 768px) {
    .modal-dialog {
        width: 800px !important;
        margin: 30px auto;
    }
}