input.form_input {
    -ms-touch-action: none;
    touch-action: none;
}


:root {
    --error-light-color: #ffc376;
}

h1 {
    margin-bottom: 10px;
}

/*#region General*/
.fit {
    padding: 0;
    margin: 0;
}

.w25 {
    width: 25% !important;
}

.w50 {
    width: 50% !important;
}

.w75 {
    width: 75% !important;
}

.w85 {
    width: 85% !important;
}

.w90 {
    width: 90% !important;
}

.w100 {
    width: 100% !important;
}

.h25 {
    height: 25% !important;
}

.h50 {
    height: 50% !important;
}

.h75 {
    height: 75% !important;
}

.h100 {
    height: 100% !important;
}

.vcenter {
    display: flex;
    align-items: center;
}

.center {
    text-align: center;
}

.left {
    text-align: left;
}

.right {
    text-align: right;
}

.text-lowercase {
    text-transform: lowercase !important;
}

.text-uppercase {
    text-transform: uppercase !important;
}

.text-capitalize {
    text-transform: capitalize !important;
}

.text-blue {
    color: darkblue;
}

.text-red {
    color: crimson;
}

.text-green {
    color: darkgreen;
}

.text-yellow {
    color: gold;
}

.text-magenta {
    color: darkmagenta;
}

.fnt-small {
    font-size: small;
}

.rmargin10 {
    margin-right: 10px;
}

.light_text {
    color: white !important;
}

.popup-unknown {
    background: linear-gradient(180deg, #50000b, #000000db) !important
}

    .popup-unknown .img-border {
        border: 2px solid #ef620f;
    }

.popup-admin {
    background: linear-gradient(180deg, #31235a, #000000db) !important
}

    .popup-admin li.table_row.no_header {
        background-color: #f8f8f8 !important;
        color: #1b1a1a !important;
    }

    .popup-admin .img-border {
        border: 2px solid #8567bf;
    }

.popup-unit {
    background: linear-gradient(45deg, black, transparent) !important;
}

    .popup-unit li.table_row.no_header {
        background-color: #f8f8f8 !important;
        color: #1b1a1a !important;
    }

    .popup-unit .img-border {
        border: none;
    }

.popup-driver {
    background: linear-gradient(180deg, #004c09, #000000db) !important
}

    .popup-driver li.table_row.no_header {
        background-color: #f8f8f8 !important;
        color: #1b1a1a !important;
    }

    .popup-driver .img-border {
        border: 2px solid #17a926;
    }

.popup-guardian {
    background: linear-gradient(180deg, #003250, #000000db) !important
}

    .popup-guardian li.table_row.no_header {
        background-color: #f8f8f8 !important;
        color: #1b1a1a !important;
    }

    .popup-guardian .img-border {
        border: 2px solid #0a62a0
    }

.popup-dependent {
    /*background: #233a5a !important;*/
    background: linear-gradient(0deg, black, #1d3248bd) !important
}

    .popup-dependent li.table_row.no_header {
        background-color: #375a70 !important;
        color: #FFFFFF !important;
    }

    .popup-dependent .img-border {
        border: 1px solid #e6e6e6;
    }


.small-bar {
    /*height: 60px;*/
}

.small-barcode.row {
    height: 100px;
    max-height: 50px;
    /*border: 1px solid black;*/
}

    .small-barcode.row .feat_small_icon {
        height: 100%;
        display: inline-block;
        vertical-align: top;
        position: relative;
        text-align: center;
    }

        .small-barcode.row .feat_small_icon i.fa {
            height: 100%;
            display: inline-block;
            font-size: xx-large;
            vertical-align: middle;
            line-height: inherit;
        }

        .small-barcode.row .feat_small_icon img {
            max-height: 100%;
            max-width: 100%;
            width: auto;
            height: auto;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            margin: auto;
        }

    .small-barcode.row .feat_small_details {
        display: table-cell;
        height: 100%;
        vertical-align: middle;
        text-align: right;
    }

        .small-barcode.row .feat_small_details div {
            height: 100% !important;
        }

            .small-barcode.row .feat_small_details div svg {
                width: 85%;
                height: 100%;
            }


/* everything below is not required */
.img-frame span {
    font-family: arial, sans-serif;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    color: white;
    background: rgba(0,0,0,0.4);
    font-size: 12px;
}

.scanned-profile-barcode {
    width: 100%;
    border: 2px solid black;
    background: white;
}

.error_text {
    color: var(--error-light-color) !important;
}

/* in app.css */
/*input[type="time"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
}
input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
}*/


::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: silver;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: silver;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: silver;
}

.no-padding {
    padding: 0px 0 0 0px;
}

.unit-code {
    padding-left: 5px;
    /*background-color: #f0f8ffc4;*/
    background-color: #fbdadac4;
    color: #980f0f;
    /*text-align: center;*/
    text-transform: uppercase;
    font-weight: bold;
    font-size: large;
    width: 100%;
}

    .unit-code.absolute {
        position: absolute;
    }

.round-button {
    display: block;
    width: 70px;
    height: 70px;
    line-height: 50px;
    border: 2px solid #f5f5f5;
    border-radius: 50%;
    color: #f5f5f5;
    text-align: center;
    text-decoration: none;
    /* background: #464646; */
    box-shadow: 0 0 3px grey;
    /* font-size: 20px; */
    /* font-weight: bold; */
}

    .round-button:hover {
        background: #262626;
    }

.btn-notify {
    background: #374b70;
    border: 2px solid #4da9dc;
}

.btn-phone-call {
    background: #4cd9643d;
    border: 2px solid #4ddc9f;
}

.btn-emergency {
    background: #7037496e;
    border: 2px solid #dc794d;
}

ul.contact_share {
    list-style: none;
    padding: 0px;
    /*margin: 10%;*/
}

    ul.contact_share li {
        width: 32%;
        text-align: -webkit-center;
        display: inline-block;
        padding: 10px 0;
        margin: 0px;
    }

        ul.contact_share li img {
            width: 50px;
            height: 50px;
            margin-top: 10px;
        }

.emergency-nav {
    padding: 0px 0 0 0px;
    width: 100%;
}

    .emergency-nav ul {
        width: 100%;
        list-style: none;
        padding: 0px;
        margin: 0px;
        display: block;
    }

        .emergency-nav ul li {
            width: 28%;
            list-style: none;
            padding: 15px 0;
            margin: 2%;
            display: inline-block;
            text-align: center;
        }

            .emergency-nav ul li img {
                display: inline-block;
                max-width: 40%;
            }

            .emergency-nav ul li span {
                display: block;
                text-align: center;
                padding: 5px 0 0 0;
                color: white;
            }

            .emergency-nav ul li a {
                font-size: 13px;
                font-weight: 300;
            }

        .emergency-nav ul li {
            /*background: #8a2015;*/
            border-bottom: 1px var(--error-light-color) solid;
            background: #2a5571;
            /*border-bottom: 1px #384e79 solid;*/
        }

            .emergency-nav ul li a {
                color: #e7a7a0;
            }

/*#endregion General*/

/*#region Loader*/
.error {
    color: #fd5f89;
    font-weight: 500;
    padding: 10px;
}

.connect_loader {
    /*background: url(/images/connecting.gif) no-repeat;*/
    background: url(https://titanets.com/shared/images/busy/connecting-32.gif) no-repeat;
    position: fixed;
    /*z-index: 1;*/
    /* padding-top: 100px; */
    left: 5px;
    top: 20px;
    width: 100%;
    height: 100%;
    /*overflow: auto;*/
    /*background-color: rgba(0,0,0,0);*/
}

.time-clock {
    /*width: 100%;*/
    /*position: relative;*/
    /*float: right;*/
    /*font-family: monospace;*/
    /*padding: 4px 10px;*/
    /*font-weight: 600;*/
    /*position: relative;*/
    text-align: end;
    /*font-size: unset;*/
    font-family: monospace;
    /*font-family: 'Orbitron', sans-serif;*/
    position: absolute;
    /*bottom: 75px;*/
    width: 100%;
    /*margin-left: -10px;*/
    /*position: absolute;*/
    /*top: 25px;*/
    /*left: 50%;*/
    /*transform: translateX(-50%) translateY(-50%);*/
    /*color: #e4e8ea;*/
    font-size: large;
    /*font-family: "orbitron";*/
    /*display: inline-block;*/
    /*letter-spacing: 2px;*/
    font-weight: bold;
}

    .time-clock.inactive {
        /*top: 25px;*/
        color: #980f0f;
        font-size: 18px;
        font-weight: bold;
        top: -1px;
    }

    .time-clock.active {
        color: #f6f6f7;
        background-color: #00000057;
    }
        .time-clock.active > span:first-child {
            display: block;
        }
        .time-clock.inactive > span:first-child {
            display: none;
        }

    .time-clock > span:first-child {
        padding-left: 10px;
        float: left;
    }
    
    .time-clock > span:last-child {
        padding-right: 10px;
    }


/*#endregion Loader*/

/*#region Scanned Profile*/
.scanned-profile-barcode {
    width: 100%;
}

.img-circle {
    border-radius: 50%
}

.img-border {
    border: 1px solid #e6e6e6;
}

.up-icons {
    height: 40px;
}

.footer {
    /*position: fixed;*/
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    /*background-color: red;*/
    color: white;
    text-align: center;
}

.table_section_large {
    width: 80%;
    float: left;
    padding: 0 0 0 2%;
}

.content-block {
    color: #adadaf;
}

.popup-scan h4 {
    /*padding-top: 40px;
    font-family: inherit;
    font-size: 25px;
    letter-spacing: 3px;*/
    padding: 0 0 0px 0;
}

/*.tabs-animated-wrap {
    width: 95%

}*/

.button {
    /*color: #889dab !important;*/
    color: #bcc5cc !important;
}

    .button.active {
        color: #fff !important;
    }

.user_details {
    /*opacity: 0.5;*/
    color: black;
    font-weight: bold;
    top: 75px;
}

    .user_details p span {
        display: contents;
        font-size: inherit;
    }



/*.toolbar-inner {
    top: -20px;
}*/

.toolbar {
    height: 70px;
}


.user-nav.top-10 {
    margin-top: -10px;
}

.user-nav.botton-10 {
    margin-bottom: -10px;
}

li.table_row.no_header {
    background-color: #375a70 !important;
    color: #FFFFFF !important;
}

.list-block .swipeout-actions-right a:nth-child(1) {
    background: #35639f;
}

.list-block .swipeout-actions-right a:nth-child(2) {
    background: #359f78;
}

.list-block .swipeout-actions-right a:nth-child(3) {
    background: #9f356b;
}
/*#endregion User Profile*/

.main-nav ul li a {
    color: #fdfbef !important;
}

#id-scanned-content {
    /*display: none;*/
}

#id-scanned-payment {
    display: none;
}

#id-btn-full-screen {
    display: none;
    background-color: #719c92;
}

#id-btn-addToHome {
    display: none;
    background-color: #71889c;
    margin-top: 50px;
}

#id-scanner-barcode {
    cursor: pointer;
}

#id-btn-numpad-close {
    cursor: pointer;
}

#id-number-input {
    font-family: Orbitron;
    font-size: large;
}

/*#region Scanned History*/
#id-search-text {
    background-image: url('/images/icons/silver/search.png');
    background-position: 10px 12px;
    background-repeat: no-repeat;
    font-size: 16px;
    padding: 12px 20px 12px 40px;
    /*border: 1px solid #ddd;*/
    margin-bottom: 12px;
}

ul.popular_posts li a img {
    width: 50px;
}

.scan-history-image {
    width: 25%
}

/*#endregion*/


/*#region Logo*/
.form_logo {
    /*filter: hue-rotate(180deg) brightness(200%) drop-shadow(0 0 40px #fff);*/
    /*filter: hue-rotate(0deg) drop-shadow(0 0 5px #ffd700) brightness(1) saturate(0);*/
    /*filter: hue-rotate(225deg) brightness(230%) drop-shadow(0 0 50px #addcff);*/
    filter: hue-rotate(0deg) brightness(99%) drop-shadow(0 0 30px #addcff);
}

    .form_logo img {
        /*filter: hue-rotate(250deg) brightness(250%);*/
        /*filter: hue-rotate(80deg) brightness(150%);*/
        /*max-width: 30%;*/
        max-width: 80px;
    }

.logo {
    /*filter: hue-rotate(200deg) brightness(160%) drop-shadow(0 0 50px #addcff);*/
    /*filter: hue-rotate(0deg) drop-shadow(0 0 10px #ffd700);*/
    /*-webkit-filter: contrast(200%) brightness(84%) grayscale(53%) invert(4%) hue-rotate(161deg);*/
    /*filter: contrast(200%) brightness(84%) grayscale(53%) invert(4%) hue-rotate(161deg);*/
    position: relative;
}

    .logo img {
        max-width: 120px;
    }

.nav_left_logo {
    padding: 0 0 0 3%;
}

    .nav_left_logo a img {
        /*filter: brightness(0) invert(1);*/
        max-width: 30px;
    }




/*#endregion Logo*/


.interactive {
    margin-left: 12px;
}

#interactive video {
}

#interactive canvas {
}

/*#region Switch On-Off */
#id-scan-title {
    background: #ececec;
}

#id-scan-switch {
    position: relative;
    top: 10px;
    left: -5px;
}

.onoffswitch {
    float: right;
    position: relative;
    width: 90px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.onoffswitch-checkbox {
    display: none;
}

.onoffswitch-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid #999999;
    border-radius: 20px;
}

.onoffswitch-inner {
    display: block;
    width: 200%;
    margin-left: -100%;
    transition: margin 0.3s ease-in 0s;
}

    .onoffswitch-inner:before, .onoffswitch-inner:after {
        display: block;
        float: left;
        width: 50%;
        height: 30px;
        padding: 0;
        line-height: 30px;
        font-size: 14px;
        color: white;
        font-family: Trebuchet, Arial, sans-serif;
        font-weight: bold;
        box-sizing: border-box;
    }

    .onoffswitch-inner:before {
        content: "ON";
        padding-left: 10px;
        background-color: #34A7C1;
        color: #FFFFFF;
    }

    .onoffswitch-inner:after {
        content: "OFF";
        padding-right: 10px;
        background-color: #EEEEEE;
        color: #999999;
        text-align: right;
    }

.onoffswitch-switch {
    display: block;
    width: 18px;
    margin: 6px;
    background: #FFFFFF;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 56px;
    border: 2px solid #999999;
    border-radius: 20px;
    transition: all 0.3s ease-in 0s;
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    right: 0px;
}
/*#endregion Switch On-Off */

/*#region Scan Configuration */
/*.barcode-container{
    position: fixed;
}*/
/*.table_section_14 a {
    color: #FFFFFF;
    text-decoration: none;
}*/
/*.table_section_14 a[href^="tel:"]:before {
        content: "\260e";
        margin-right: 0.5em;
    }*/
#id-guardian-list li.table_row {
    min-height: 130px;
}

.table_section_12 {
    color: #FFFFFF;
    /*width: 20%;*/
    /*float: left;*/
    padding: 0 0 0 2%;
    text-align: center;
    display: block;
    height: 40px;
}

    .table_section_12 img {
        display: inline-block;
        text-align: center;
        padding: 10px 0 0 0;
        margin: 0px;
        line-height: 10px;
    }

    .table_section_12 strong {
        font-size: 18px;
    }

    .table_section_12.first {
        width: 100%;
        /*width: 50%;*/
        /*display: flex;*/
        align-items: center;
    }



    .table_section_12 a.call_now {
        background-color: #2db350;
    }

    .table_section_12 a.email_now {
        background-color: #0193cb;
    }

.btn-scan-action {
    /* display: inline-block; */
    text-align: center;
    padding: 0 5px;
    background-color: #ffd15c;
    color: #FFFFFF;
    font-size: 17px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 95%;
    margin-left: 1%;
    margin-top: 10px;
    height: 40px;
    line-height: 40px;
    color: #233a5a;
    font-weight: bold;
}

    .btn-scan-action.red {
        background-color: #ff5c6b;
    }

.btn-scan-start {
    /* display: inline-block; */
    text-align: center;
    padding: 0 5px;
    background-color: #155596;
    color: #FFFFFF !important;
    font-size: 17px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 95%;
    margin-left: 1%;
    border-top: 0px;
    height: 40px;
    line-height: 40px;
    color: #233a5a;
    font-weight: bold;
}

.btn-scan-stop {
    /* display: inline-block; */
    text-align: center;
    padding: 0 5px;
    background-color: #961533;
    color: #FFFFFF !important;
    font-size: 17px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 95%;
    margin-left: 1%;
    border-top: 0px;
    height: 40px;
    line-height: 40px;
    color: #233a5a;
    font-weight: bold;
}

.btn-scan-tab-action {
    display: inline-block;
    text-align: center;
    padding: 0 5px;
    margin: 5px 0;
    background-color: #94cb01;
    color: #FFFFFF;
    font-size: 12px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    /*min-width: 40px;*/
    min-width: 80%;
}

.barcode-group-desc {
    margin-top: -15px !important;
    margin-bottom: 15px !important;
}

#pages_maincontent p {
    padding: 0 0 10px 10px;
    text-align: justify;
    text-justify: inter-word;
}

ul .toolbar_icons li.menuicon {
    background-color: #201e2c !important;
}

    ul.toolbar_icons li.menuicon.online {
        background-color: #3f5668 !important;
    }

    ul.toolbar_icons li.menuicon.offline {
        background-color: #b32454 !important;
    }

ul.features_list_detailed.light_text li .feat_small_details a {
    color: #ffffff;
}

ul li.unit {
    /*width: 31%;*/
    /* padding: 0; */
    /* float: left; */
    /* margin: 1%; */
    text-align: center;
    /*height: 114px;*/
    border: 1px solid #cccccc;
    padding: 18px 0px 18px 0px;
}

i.icon.icon-plus.scan-config {
    color: white;
    width: 32px;
    height: 32px;
    font-size: 45px;
    line-height: 30px;
    margin: 10px;
}

.custom-accordion .icon-plus, .custom-accordion .icon-minus {
    color: white;
    border: 1px solid #fff;
}

    .custom-accordion .icon-plus, .custom-accordion .icon-minus.scan-config {
        color: white;
        margin: 10px;
        width: 32px;
        height: 32px;
        font-size: 45px;
        line-height: 25px;
    }

.custom-accordion .accordion-item-toggle {
    height: 100% !important;
    font-size: 17px;
}

.scan-config-container {
    color: #fde690;
    font-weight: 900;
    font-size: 24px;
    font-variant: small-caps;
}

.scan-config-desc {
    margin: 10px !important;
    text-align: justify;
    text-justify: inter-word;
    color: #9eb4c6;
    /*font-style: italic;*/
}

.scan-config-title {
    color: white !important;
    /*font-weight: 900;*/
    /*text-align: center;*/
    /*font-size: 20px !important;*/
    border-bottom: 1px solid white;
}

/*.scan-congig-barcode-group {
    border-bottom: 1px solid #6891a5;
}*/
/*#endregion Scan Configuration*/




#id-scan-error {
    word-wrap: break-word;
    text-align: center;
    /*color: gold;*/
    /*color: deepskyblue;*/
    /*color:palegreen;*/
    color: moccasin;
}

/* Custom Selects */
.custom-select {
    /* display: block; */
    /* font-size: 16px; */
    /* font-family: sans-serif; */
    /* font-weight: 700; */
    /* color: #444; */
    /* line-height: 1.3; */
    padding: .6em 1.4em .5em .8em;
    width: 100%;
    /* max-width: 100%; */
    /* box-sizing: border-box; */
    margin: 5px;
    border: 1px solid #aaa;
    box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
    border-radius: .5em;
    -moz-appearance: none;
    /*-webkit-appearance: none;*/
    appearance: none;
    background-color: #fff;
    background-image: url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3…c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E), linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
    background-repeat: no-repeat, repeat;
    background-position: right .7em top 50%, 0 0;
    background-size: .65em auto, 100%;
}

    .custom-select::-ms-expand {
        display: none;
    }

    .custom-select:hover {
        border-color: #888;
    }

    .custom-select:focus {
        border-color: #aaa;
        box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7);
        box-shadow: 0 0 0 3px -moz-mac-focusring;
        color: #222;
        outline: none;
    }

    .custom-select option {
        font-weight: normal;
    }

.custom-input {
    padding: 0 5px;
    color: #FFFFFF;
    font-size: 15px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 90%;
    margin-left: 1%;
    /* margin-top: 10px; */
    height: 40px;
    /* line-height: 40px; */
    color: #233a5a;
    font-weight: bold;
}