.mainmenu li {
}

#geofenceWrapTitle {
    position: absolute;
    width: 400px;
    margin-left: -200px;
    left: 50%;
    top: 70px;
    display: none;
    z-index: 1000;
    background-color: #fff;
    opacity: 0.8;
}

#geofenceWrapTitleEditDevicePage {
    position: absolute;
    width: 400px;
    margin-left: -200px;
    left: 50%;
    z-index: 1000;
    background-color: #fff;
    opacity: 0.8;
}

#geofenceTitle {
    text-align: center;
    margin: 5px 0px;
    font-weight: bold;
    font-size: 15px;
    color: darkblue;
}

.editalert #add-device {
    margin-left: 0px !important;
    margin-top: 5px !important;
}

.editalert #number-of-devices {
    vertical-align: sub !important;
}

.editalert #addDevicesPanel {
    margin-bottom: 5px !important;
}

.leftcol {
    width: 75%;
}

span.error, label.error {
    display: block;
    color: #ff0000;
}

.widepage {
    padding: 20px;
    width: 98%;
}

.input-small {
    width: 80px !important;
}

.input-medium {
    width: 230px !important;
}

.input-large {
    width: 340px !important;
}

.input-medium-half-1 {
    width: 140px !important;
}

.input-medium-half-2 {
    width: 86px !important;
}

.simple-footer {
    border-top: 1px #ddd solid;
    padding: 5px 20px 5px !important;
    text-align: center;
}

.simple-header {
    border-bottom: 1px #ddd solid;
    padding: 2px 20px 2px 10px !important;
    text-align: center;
}

#viewItemsModel {
    width: 500px !important;
    top: 15% !important;
}

#viewItemsList {
    height: 300px !important;
    overflow-y: auto;
}

    #viewItemsList.edit-alert-devices {
        max-height: 300px !important;
        height: auto !important;
    }

        #viewItemsList.edit-alert-devices td {
            padding: 0 5px;
        }

.searchbox {
    padding-top: 11px;
    float: right;
    margin-right: 20px;
    width: 325px;
}

    .searchbox input {
        width: 250px !important;
    }

    .searchbox button {
        padding: 5px 12px;
    }

.admin .maincontent_center {
    padding: 50px;
}

.wrapper #pageModal.modal {
    padding: 0px;
}

#deviceUninstallConfirm {
    height: 340px;
}

.margin_top_inverse_5 {
    margin-top: -5px;
}

input, input.form-control {
    padding: 4px 10px;
}

a.logo {
    height: 90px;
    padding: 0px;
}

    a.logo span {
        display: block;
        padding: 10px 15px;
    }

ul.mainmenu {
    margin: 12px 0px;
}

#deviceInfo input, #deviceInfo textarea, #deviceInfo select {
    width: 300px;
    margin: 7px;
    vertical-align: middle;
}

#mini-map-editdevice {
    width: 100%;
}

/* Login page */
body.login {
    background: url(../images/login-bg.jpg) center no-repeat;
    background-size: cover;
}

#form_customer {
    z-index: 1000;
    text-align: right;
    line-height: 18px;
    float: right;
    margin-top: 7px;
}

    #form_customer .phone {
        font-size: 98%; /*18px;*/
        color: #3fb7d3;
        font-weight: bold;
        text-transform: uppercase;
        word-wrap: break-word;
    }

    #form_customer .email a {
        font-size: 95%;
        color: #3fb7d3;
        text-transform: uppercase;
        word-wrap: break-word;
    }

#form_login {
    width: 350px;
    text-align: center;
    background: #fff;
    -webkit-box-shadow: 7px 7px 21px 0px rgba(50, 50, 50, 0.38);
    -moz-box-shadow: 7px 7px 21px 0px rgba(50, 50, 50, 0.38);
    box-shadow: 7px 7px 21px 0px rgba(50, 50, 50, 0.38);
    padding: 19px 29px 29px;
    margin: 50px auto 20px auto;
}

#formSignin {
    width: 290px;
    margin: 10px auto;
}

    #formSignin .checkbox {
        width: 120px;
        margin: auto;
    }

    #formSignin .form-control {
        border-radius: 0;
    }

    #formSignin button {
        width: 60%;
        margin-bottom: 15px;
        margin-left: 0;
    }

    #formSignin .lang label {
        opacity: 0.4;
        cursor: pointer;
        padding: 2px;
    }

        #formSignin .lang label:hover {
            opacity: 0.7;
        }

    #formSignin .lang input:checked + label {
        opacity: 1.0;
    }

    #formSignin .lang > input {
        visibility: hidden;
        position: absolute;
    }

.registerbar {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 72px;
    overflow: visible;
    text-align: center;
    background: #dddddd; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 39%, #dddddd 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(39%,#ffffff), color-stop(100%,#dddddd)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ffffff 39%,#dddddd 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ffffff 39%,#dddddd 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ffffff 39%,#dddddd 100%); /* IE10+ */
    background: linear-gradient(to bottom, #ffffff 39%,#dddddd 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 ); /* IE6-9 */
    -webkit-box-shadow: 5px 5px 24px 0px rgba(50, 50, 50, 0.3);
    -moz-box-shadow: 5px 5px 24px 0px rgba(50, 50, 50, 0.3);
    box-shadow: 5px 5px 24px 0px rgba(50, 50, 50, 0.3);
}

    .registerbar a.btn {
        margin-top: 15px;
    }

/* Home Map */
#home #map, #home #splitMap {
    z-index: 2;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
}

#home #splitView {
    position: absolute;
    width: 100%;
}

#home #splitMap {
    z-index: 1;
}

#closePanorama:hover img {
    top: 2px;
}

#home #closePanorama, #home #closeQuickReport {
    z-index: 12;
    position: absolute;
    top: 5px; /*105px;*/
    right: 5px;
}

#home #backToReport {
    z-index: 12;
    position: absolute;
    top: 115px;
    right: 50px;
    display: none;
    color: #fff;
}

#home #quickReport {
    z-index: 1;
    position: absolute;
    top: 0px;
    left: 0px;
}

#home #panorama {
    z-index: 4;
    position: absolute;
    top: 0px;
    right: 0px;
    width: 50.0%;
}

#quickReportTimescalePanel span.to {
}

#home #quickReportTimescale {
    width: 140px;
    float: left;
    margin-right: 10px;
}

#home #quickReportCustomPanel, #home #quickReportAction {
    float: left;
    margin-left: 5px;
}

#home #quickReportAction {
    margin-left: 5px;
}

#home #runReportAction {
    padding-top: 20px !important;
    float: left !important;
}

#exportPrintTools {
    position: absolute;
    right: 368px;
    top: 33px;
    z-index: 13;
    list-style: none;
    overflow: hidden;
}

    #exportPrintTools li {
        float: right;
        margin: 0px 2px;
    }

        #exportPrintTools li img {
            height: 22px;
        }

        #exportPrintTools li a {
            display: block;
            height: 22px;
        }

            #exportPrintTools li a span {
                display: none;
            }

        #exportPrintTools li.print a {
            background: url(../images/IconPrint.png) center left no-repeat;
        }

        #exportPrintTools li.pdf a {
            background: url(../images/pdf.png) center left no-repeat;
        }

        #exportPrintTools li.html a {
            background: url(../images/html.png) center left no-repeat;
        }

        #exportPrintTools li.csv a {
            background: url(../images/csv.png) center left no-repeat;
        }

#home #quickReport {
    z-index: 1;
    background-color: #fff;
    overflow: hidden;
}

    #home #quickReport table, #home #quickReport div.pagination {
        margin: 0px;
    }

    #home #quickReport .tabbable {
        left: 50px;
        position: absolute;
        top: 80px;
    }

    #home #quickReport .tab-content {
        overflow: auto;
    }

#home #map img, #home #splitMap img, #home #panorama img, #addGeofenceMap img {
    max-width: none;
}

#home #quickReport .nav {
    margin-bottom: 0px;
}

#home #quickReport .nav-tabs > .active > a,
#home #quickReport .nav-tabs a:hover,
#home #quickReport .nav-tabs > .active > a:focus {
    background-color: #2D658B !important;
}

#home #quickReport .nav-tabs a {
    border: 0px none !important;
    color: #fff !important;
}

#home #quickReport .blockOverlay {
    background-color: transparent !important;
}

#home #quickReport td {
    background-color: #fff;
}

#home #quickReportCustomPanel input {
    margin: 0;
}

#home #quickReportTimescale {
    position: absolute;
    left: 50px;
    top: 40px; /*108*/
    z-index: 13;
    border: 1px solid #D9D9D9;
    border-radius: 7px;
    color: #555555;
    font-family: 'Lato',Arial,Helvetica,sans-serif;
    font-size: 14px;
    margin: 0;
    padding: 7px 10px;
}

#quickReport .tab-content {
    overflow: auto;
}

#quickReportDevices {
    display: inline-block;
    width: 50%;
    position: relative;
    height: 200px;
    clear: both;
    margin-top: 80px;
    margin-left: 200px;
    overflow: auto;
}

#commandMenu, #reportMenu, #adminMenu {
    position: absolute;
    right: 0px;
    top: 70px;
    z-index: 1000;
    background-color: #E2E2E2;
    width: 323px;
}

    #commandMenu.rightmenu li.last, #reportMenu.rightmenu li.last, #adminMenu.rightmenu li.last {
        height: auto;
    }

    #commandMenu.rightmenu li a, #reportMenu.rightmenu li a, #adminMenu.rightmenu li a {
        outline: none;
    }

#geofencePanel {
    overflow: hidden;
    position: absolute;
    right: 0;
    z-index: 3;
    background-color: #f7f7f7;
    padding: 2px;
}

#geofencePanelWrap {
    width: 250px;
    padding: 15px;
}

#geofencePanel #geofencePanelWrap {
    overflow-x: auto;
    /*overflow-y: hidden;*/
}

#geofencePanel ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

    #geofencePanel ul li {
        float: left;
        text-align: center;
        overflow: hidden;
        border-bottom: solid 1px #dfdfdf;
        width: 100%;
        padding: 6px;
        position: relative;
    }

        #geofencePanel ul li:last-child {
            margin-right: 0px;
        }

        #geofencePanel ul li.active {
            background: #efefef;
            font-weight: bold;
        }

        #geofencePanel ul li img {
            float: left;
        }

        #geofencePanel ul li a {
            overflow: hidden;
            outline: none;
            text-decoration: none;
            display: block;
        }

            #geofencePanel ul li a span {
                display: block;
                float: left;
                width: 65%;
                margin-left: 5%;
                text-align: left;
            }

#geofencePanel .blockElement {
    width: 200px !important;
    position: absolute;
    left: 50% !important;
    margin-left: -100px !important;
}

    #geofencePanel .blockElement p {
        margin: 10px 0px;
    }

#geofencePanel .showall {
    text-align: center;
}

#geofencePanel .inlinehelp {
    font-size: 80%;
    font-style: italic;
}

#geofenceOnOff {
    position: absolute;
    width: 31px;
    height: 33px;
    right: 0;
    bottom: 0px;
    z-index: 1000;
    background-color: #fff;
}

#geofencePin.off {
    background: url(../images/1403942451_unpin.png) center left no-repeat !important;
}

#geofencePin {
    background: url(../images/1403942527_pin.png) center left no-repeat;
    position: absolute;
    width: 20px;
    height: 20px;
    left: 7px;
    top: 7px;
    z-index: 1000;
    background-color: #fff;
    cursor: pointer;
}

#geofenceOnOff a {
    display: none;
}

#geofenceOnOff.on {
    right: 154px;
}

    #geofenceOnOff.off a.open-panel, #geofenceOnOff.on a.close-panel {
        display: block;
    }

#geofenceOnOff.off {
    bottom: 14px;
}

    #geofenceOnOff.on a.open-panel, #geofenceOnOff.off a.close-panel {
        display: none;
    }

#timescalePanel {
    width: 450px;
    display: inline-block;
    padding-left: 10px;
}

#ui-datepicker-div {
    margin-top: 3px !important;
    border: 2px solid #428bca !important;
    background-color: white !important;
}

.reports {
    /*margin: 10px 0  0 20px;*/
}

#reports-table .dataTables_scrollHeadInner {
    width: 100% !important;
    padding-right: 0px !important;
}

#reports-table .dataTables_scrollHead {
    height: 60px !important;
}

/* Popup Style */
#infoWindowDevice {
    width: 321px;
    height: 167px;
    position: absolute;
    display: block;
    right: 10px;
    top: 188px;
    z-index: 999999;
    font-size: 11px;
    color: #333;
}

    #infoWindowDevice.large {
        width: 360px;
        height: 190px;
        margin-left: 18px;
        margin-top: 12px;
        background: url(../images/popup-bg.png) top left no-repeat;
        font-family: 'Muli', Verdana, Arial, sans-serif !important;
        font-size: 12px;
        color: #66656c;
    }

    #infoWindowDevice .Lotname {
        font-size: 13px;
        width: 360px;
        text-align: center;
        font-weight: bold;
        position: relative;
        top: 5px;
    }

    #infoWindowDevice h3 {
        font-size: 13px;
        line-height: 16px;
        color: #333;
        margin-bottom: 10px !important;
        margin-right: 10px !important;
    }

    #infoWindowDevice.large h3 {
        font-size: 13px;
        font-weight: normal;
        margin-top: 7px !important;
        margin-bottom: 0px !important;
        margin-left: 15px !important;
    }

    #infoWindowDevice a {
        color: #136095;
    }

    #infoWindowDevice img.loading {
        display: none;
        position: absolute;
        right: 45px;
        top: 8px;
    }

    #infoWindowDevice img.error,
    #infoWindowDevice img.success {
        display: none;
        position: absolute;
        right: 45px;
        top: 5px;
        height: 20px;
        width: 20px;
    }

    #infoWindowDevice img.avatar {
    }

    #infoWindowDevice span.text-loading {
        display: none;
        position: absolute;
        font-size: 14px;
        right: 70px;
        top: 11px;
    }

    #infoWindowDevice.in-progress img.loading {
        display: block;
        width: 16px;
        height: 16px;
    }

    #infoWindowDevice.in-progress span.text-loading {
        display: none;
    }

    #infoWindowDevice.in-progress img.success,
    #infoWindowDevice.in-progress img.error {
        display: none !important;
    }

    #infoWindowDevice.successful img.success {
        display: block;
    }

    #infoWindowDevice.un-successful img.error {
        display: block;
    }

    #infoWindowDevice a.Close {
        color: #FFFFFF;
        display: block;
        height: 16px;
        position: absolute;
        right: 13px;
        top: 10px;
        width: 18px;
        background: none;
    }

    #infoWindowDevice.large a.Close {
        right: 27px;
        top: 8px;
        text-indent: 100px;
        overflow: hidden;
    }

    #infoWindowDevice a.maximized {
        position: absolute;
        right: 35px;
        top: 8px;
        background: url(../images/w-maximized.gif) top left no-repeat;
        width: 19px;
        height: 19px;
    }

    #infoWindowDevice.large a.maximized {
        display: none;
    }

    #infoWindowDevice a.minimized {
        position: absolute;
        right: 41px;
        top: 14px;
        background: url(../images/w-minimized.gif) top center no-repeat;
        display: none;
        width: 19px;
        height: 19px;
    }

    #infoWindowDevice.large a.minimized {
        display: block;
    }

    #infoWindowDevice.large div.Info {
        width: 300px;
        left: 0px;
        height: 50px;
        padding-left: 10px;
        padding-top: 10px;
    }

        #infoWindowDevice.large div.Info div.Avatar {
            width: 100px;
            float: left;
            margin-left: 20px;
        }

    #infoWindowDevice.large div.selectTimeEnd {
        width: 300px;
        padding-left: 10px;
        height: 30px;
    }

        #infoWindowDevice.large div.selectTimeEnd label {
            width: 50px;
        }

    #infoWindowDevice.large input.selectDate {
        width: 90px;
        height: 25px;
        padding: 4px 6px;
    }

    #infoWindowDevice.large input.selectTime {
        margin-left: 10px;
        width: 50px;
        height: 25px;
        padding: 4px 6px;
    }

    #infoWindowDevice.large select.selectAP {
        margin-left: 10px;
        width: 60px;
        height: 25px;
        font-size: 9pt;
        padding: 4px 6px;
    }

    #infoWindowDevice.large div.selectTimeStart {
        width: 300px;
        padding-left: 10px;
        height: 35px;
    }

        #infoWindowDevice.large div.selectTimeStart label {
            width: 50px;
        }

    #infoWindowDevice.large div.notice {
        width: 330px;
        left: 0px;
        padding-left: 15px;
        color: red;
        line-height: 1.1;
        font-size: 10px;
    }

    #infoWindowDevice.large div.Run {
        padding-top: 4px;
        width: 320px;
        text-align: right;
    }

        #infoWindowDevice.large div.Run a {
            display: block;
            padding: 2px 4px;
            font-size: 10.5px;
            color: #333333;
            text-align: center;
            cursor: pointer;
            background-color: #f5f5f5;
            border: 1px solid #bbbbbb;
            width: 80px;
            margin-bottom: 2px;
            border-radius: 4px;
            float: right;
        }

    #infoWindowDevice a.mini {
        display: block;
        margin-top: 17px;
        text-align: center;
        font-size: 15px;
    }

    #infoWindowDevice div.Inner {
        position: relative;
        height: 155px;
    }

        #infoWindowDevice div.Inner > div.Content {
            left: 8px;
            position: absolute;
            top: 30px;
            width: 250px;
        }

    #infoWindowDevice div.avatar {
        width: 60px;
        float: left;
        text-align: center;
        padding-right: 2px;
    }

    #infoWindowDevice div.detail {
        width: 180px;
        float: left;
    }

    #infoWindowDevice div.deviceLocation {
        width: 230px;
        float: left;
        padding-top: 6px;
        padding-left: 10px;
        font-weight: bold;
    }

    #infoWindowDevice span.batteryLevel img {
        width: 30px;
        height: 10px;
    }

    #infoWindowDevice div.Inner > div.Content span {
        line-height: 14px;
        font-size: 11px;
        text-align: left;
    }

        #infoWindowDevice div.Inner > div.Content span.located-at {
            margin-bottom: 0px;
            color: red;
        }

        #infoWindowDevice div.Inner > div.Content span.old {
            color: #C76B11;
        }

        #infoWindowDevice div.Inner > div.Content span.recent {
            color: green;
        }

    #infoWindowDevice table td {
        height: 14px;
        line-height: 15px;
        overflow: hidden;
        vertical-align: top;
    }

        #infoWindowDevice table td:first-child {
            text-align: justify;
            width: 97px;
        }

        #infoWindowDevice table td:last-child {
            padding-left: 10px;
            text-transform: uppercase;
            text-align: justify;
        }

    #infoWindowDevice ul.device-tools {
        margin: 0px;
        padding: 0px;
        overflow: hidden;
        list-style: none;
        position: absolute;
        bottom: 35px;
        font-size: 10px;
    }

    #infoWindowDevice.large ul.device-tools {
        bottom: 50px;
    }

    #infoWindowDevice ul.device-tools li {
        float: left;
        margin: 5px;
    }

    #infoWindowDevice .devicename span {
        font-weight: bold;
    }

@keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

#infoWindowDevice.in-progress h3 {
    -webkit-animation: blink 1s linear infinite;
    -moz-animation: blink 1s linear infinite;
    animation: blink 1s linear infinite;
}

#infoWindowDevice.in-progress .maximized {
    display: none !important;
}

#infoWindowDevice .command-holder {
    margin: 0px;
    padding: 0px;
    list-style: none;
    overflow: hidden;
    margin-top: 10px;
}


#infoWindowDevice .commands {
    float: right;
    width: 100px;
    margin-right: 10px;
}

#infoWindowDevice .bubbleFooter {
    width: 359px;
    height: 11px;
    background: url(../images/button_show.png);
    cursor: pointer;
}

#infoWindowDevice .command-holder li a {
    display: block;
    padding: 2px 4px;
    font-size: 10.5px;
    color: #333333;
    text-align: center;
    cursor: pointer;
    background-color: #f5f5f5;
    border: 1px solid #bbbbbb;
    width: 80px;
    margin-bottom: 2px;
    border-radius: 4px;
}

    #infoWindowDevice .command-holder li a img {
        width: 25px;
        height: 25px;
        display: none;
    }

#infoWindowDevice .command-holder span.text {
}

#infoWindowDevice .commands_edit {
}

#infoWindowDevice .popup-quick-commands a.close {
    color: #136095 !important;
    font-size: 22px;
}

/* Upload Modal */
#changeLotImageModal {
    top: 20%;
    width: 30%;
    left: 50%;
    margin-left: -15%;
    overflow: hidden;
    border: 0px none;
}

    #changeLotImageModal .modal-header {
        background-color: #fff;
    }

    #changeLotImageModal .modal-body {
        min-height: 100px;
    }

    #changeLotImageModal .modal-footer {
        margin: 0;
        background-color: #fff;
    }

#searchItemsModel .modal-body {
    max-height: 290px;
}

/* Page Modal */
#pageModal {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border: 0px none;
}

    #pageModal button.close {
        opacity: 1;
    }

    #pageModal .quick-commands {
        margin: 0px auto;
        padding: 0px;
        width: 500px;
    }

    #pageModal.administration {
        width: 56%;
        margin-left: -28%;
    }

    #pageModal .quick-commands li {
        display: inline-block;
    }

    #pageModal .wrap {
        height: 100%;
        overflow: hidden;
        width: 100%;
    }

/* Administration */
div.administration {
    padding-top: 40px;
}

    div.administration h3.title {
        margin-bottom: 20px;
        text-align: center;
    }

    div.administration div.line {
        width: 750px;
        height: 165px;
        margin: 0px auto;
        margin-bottom: 20px;
    }

        div.administration div.line.last {
            width: 660px;
        }

        div.administration div.line div.box {
            float: left;
            width: 185px;
            height: 165px;
            margin-left: 15px;
            text-align: center;
            background-color: #c8c8c8 !important;
            border-radius: 0;
            -webkit-border-radius: 0;
            -moz-border-radius: 0;
            border: none;
            opacity: 1.0;
            text-decoration: none;
        }

            div.administration div.line div.box a {
                width: 185px;
                height: 165px;
                display: block;
                background: url(../images/button-img2.png) no-repeat;
                background-position: 0 80px;
                -webkit-transition: background-position 0.2s;
                -moz-transition: background-position 0.2s;
                transition: background-position 0.2s;
                display: block;
                padding: 10px 20px;
                color: #fff;
                border: none;
                font-size: 14px;
                line-height: 1.4em;
            }

                div.administration div.line div.box a:hover {
                    background: url(../images/button-img2.png) no-repeat;
                    background-position: 0 45px;
                    -webkit-transition: background-position 0.2s;
                    -moz-transition: background-position 0.2s;
                    transition: background-position 0.2s;
                    text-decoration: none;
                }

            div.administration div.line div.box h3 {
                padding: 60px 0 0 0;
                margin-bottom: 0;
                text-decoration: none;
                color: #fff;
                font-size: 22px;
                text-align: center;
            }

            div.administration div.line div.box p {
                text-align: center;
                line-height: 1em;
                color: #efefef;
            }


            div.administration div.line div.box.orders-box h3 {
                background: url(../images/admin-orders.png) center 15px no-repeat;
            }

            div.administration div.line div.box.device-box h3 {
                background: url(../images/admin-devices.png) center 15px no-repeat;
            }

            div.administration div.line div.box.alert-box h3 {
                background: url(../images/admin-alerts.png) center 15px no-repeat;
            }

            div.administration div.line div.box.geofence-box h3 {
                background: url(../images/admin-geofences.png) center 15px no-repeat;
            }

            div.administration div.line div.box.user-box h3 {
                background: url(../images/admin-users.png) center 15px no-repeat;
            }

            div.administration div.line div.box.renewal-box h3 {
                background: url(../images/admin-renewals.png) center 15px no-repeat;
            }

            div.administration div.line div.box.report-box h3 {
                background: url(../images/admin-reports.png) center 15px no-repeat;
            }

            div.administration div.line div.box.setting-box h3 {
                background: url(../images/admin-setting.png) center 15px no-repeat;
            }

            div.administration div.line div.box.Vehicle-Makes-box h3 {
                background: url(../images/Setting1.png) center 15px no-repeat;
            }

            div.administration div.line div.box.Uninstall-box h3 {
                background: url(../images/Setting2.png) center 15px no-repeat;
            }

            div.administration div.line div.box.group-box h3 {
                background: url(../images/AdmSubaccount.png) center 15px no-repeat;
            }

            div.administration div.line div.box.Days-Inventory-box h3 {
                background: url(../images/Setting3.png) center 15px no-repeat;
            }

            div.administration div.line div.box.Dms-Inventory-box h3 {
                background: url(../images/SettingDms.png) center 15px no-repeat;
            }

            div.administration div.line div.box.processofflot-box h3 {
                background: url(../images/admin-process.png) center 15px no-repeat;
            }
/* Report Admin*/
div.administrationReport {
    padding-top: 40px;
}

    div.administrationReport h3.title {
        margin-bottom: 20px;
        text-align: center;
    }

    div.administrationReport div.line {
        width: 1235px;
        height: 240px;
        margin: 0px auto;
        margin-bottom: 10px;
    }

        div.administrationReport div.line div.box {
            float: left;
            width: 230px;
            height: 230px;
            margin-left: 15px;
            text-align: center;
            border-radius: 0;
            -webkit-border-radius: 0;   
            -moz-border-radius: 0;
            border: none;
            opacity: 1.0;
            text-decoration: none;
        }

            div.administrationReport div.line div.box a {
                width: 230px;
                height: 230px;
                display: block;
                background: #c8c8c8 url(../images/button-img3.png) no-repeat;
                background-position: 0 80px;
                -webkit-transition: background-position 0.2s, background 0.4s;
                -moz-transition: background-position 0.2s, background 0.4s;
                transition: background-position 0.2s, background 0.4s;
                display: block;
                padding: 10px 20px;
                color: #fff;
                border: none;
                font-size: 12px;
                line-height: 1.4em;
            }

                div.administrationReport div.line div.box a:hover {
                    background: #4dc0d9 url(../images/button-img3.png) no-repeat;
                    background-position: 0 65px;
                    -webkit-transition: background-position 0.2s, background 0.4s;
                    -moz-transition: background-position 0.2s, background 0.4s;
                    transition: background-position 0.2s, background 0.4s;
                    text-decoration: none;
                }

            div.administrationReport div.line div.box h3 {
                padding: 160px 0 0px 0;
                margin-bottom: 0;
                margin-top: -50px;
                text-decoration: none;
                color: #fff;
                font-size: 22px;
                text-align: center;
            }

            div.administrationReport div.line div.box p {
                text-align: justify;
                line-height: 1em;
                color: #efefef;
            }

            div.administrationReport div.line div.box.vehistory-box h3 {
                background: url(../images/report-image-80.png) center no-repeat;
            }

            div.administrationReport div.line div.box.offlot-box h3 {
                background: url(../images/report-image-74.png) center no-repeat;
            }

            div.administrationReport div.line div.box.nonreporting-box h3 {
                background: url(../images/report-image-83.png) center no-repeat;
            }

            div.administrationReport div.line div.box.uninstall-box h3 {
                background: url(../images/report-image-78.png) center no-repeat;
            }

            div.administrationReport div.line div.box.install-box h3 {
                background: url(../images/report-image-81.png) center no-repeat;
            }

            div.administrationReport div.line div.box.lowbattery-box h3 {
                background: url(../images/report-image-77.png) center no-repeat;
            }

            div.administrationReport div.line div.box.lowbattery-wireless-box h3 {
                background: url(../images/report-image-1102000026.png) center no-repeat;
                background-size: 100px 100px;
            }

            div.administrationReport div.line div.box.daysinStock-box h3 {
                background: url(../images/report-image-79.png) center no-repeat;
            }

            div.administrationReport div.line div.box.inlot-box h3 {
                background: url(../images/report-image-82.png) center no-repeat;
            }

            div.administrationReport div.line div.box.devicessold-box h3 {
                background: url(../images/report-image-84.png) center no-repeat;
            }

            div.administrationReport div.line div.box.agingreport-box h3 {
                background: url(../images/report-image-90.png) center no-repeat;
            }

            div.administrationReport div.line div.box.Exceptions-box h3 {
                background: url(../images/report-image-85.png) center no-repeat;
            }

            div.administrationReport div.line div.box.driveoff-box h3 {
                background: url(../images/report-image-91.png) center no-repeat;
            }

            div.administrationReport div.line div.box.nonregistration-box h3 {
                background: url(../images/report-image-1102000002.png) center no-repeat;
            }

            div.administrationReport div.line div.box.uninstalledhistory-box h3 {
                background: url(../images/report-image-92.png) center no-repeat;
            }

            div.administrationReport div.line div.box.installationexception-box h3 {
                background: url(../images/report-image-93.png) center no-repeat;
            }

            div.administrationReport div.line div.box.vehiclependinginstallation-box h3 {
                background: url(../images/report-image-1102000003.png) center no-repeat;
            }

            div.administrationReport div.line div.box.missing-devices-box h3 {
                background: url(../images/report-image-1102000027.png) center no-repeat;
            }

            div.administrationReport div.line div.box.customvehicletype-box h3 {
                background: url(../images/report-image-1102000021.png) center no-repeat;
            }

.pluspreviouschedule {
    width: 870px;
    text-align: center;
    margin: 0px auto;
}

#btnpreviouschedule {
    width: 500px !important;
    border-radius: 5px !important;
    margin-left: -35px;
    margin-top: 2px !important;
}

    #btnpreviouschedule span {
        font-size: 22px !important;
        background: url(../images/button-img-1.png) no-repeat;
    }

    #btnpreviouschedule:hover span {
        background: url(../images/button-img-1.png) no-repeat;
        background-position: 0 -17px;
    }

#reportModal .modal-body {
    height: 57% !important;
}

#reportModal h3 {
    text-align: center;
}

#reportModal #img-report {
    padding: 10px 0;
    width: 57%;
    margin-left: 38%;
}

#reportModal #step {
    text-align: center;
    height: 25px;
    margin-left: 36%;
}

#reportModal div.step1.run {
    background: url(../images/3steps-1.png) no-repeat;
}

#reportModal div.step2.run {
    background: url(../images/3steps-2.png) no-repeat;
}

#reportModal div.step3.run {
    background: url(../images/3steps-3.png) no-repeat;
}

#reportModal div.step.run {
    background: url(../images/active-step.png) no-repeat;
}

#reportModal div.step1.schedule {
    background: url(../images/4steps-1.png) no-repeat;
}

#reportModal div.step2.schedule {
    background: url(../images/4steps-2.png) no-repeat;
}

#reportModal div.step3.schedule {
    background: url(../images/4steps-3.png) no-repeat;
}

#reportModal div.step4.schedule {
    background: url(../images/4steps-4.png) no-repeat;
}

#reportModal .step6 label {
    width: 120px;
    display: inline;
    position: absolute;
    top: 7px;
}

#reportModal .step6 table, #reportModal .step6 select {
    display: inline-block;
    margin-left: 125px;
}

#reportModal div.step2 input {
    width: 250px;
}

#runReport h4 {
    display: inline-block;
    font-size: 16px;
}

#progressBar {
    text-align: center;
}

#scheduleModal {
    width: 1000px;
    height: 500px;
    left: 40%;
}

    #scheduleModal .modal-body {
        height: 67% !important;
    }

.selectedReport {
    border: 2px solid navy;
}

.nonselectedReport {
    border: none;
}

#scheduleModal div.line1 {
    /*margin-left: 6%;*/
}

    #scheduleModal div.line1 a {
        text-align: center;
    }

    #scheduleModal div.line1 div.box {
        padding-top: 5px;
        width: 125px;
        height: 130px;
        margin: 8px 25px;
        display: inline-block;
        clear: both;
    }

#scheduleModal .spanbox {
    display: block;
    text-align: center;
}

#scheduleModal div.vehistory-box {
    background: url(../images/report-image-80.png) center 0px no-repeat;
    width: 80px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.offlot-box {
    background: url(../images/report-image-74.png) center 20px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.nonreporting-box {
    background: url(../images/report-image-83.png) center 0px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.uninstall-box {
    background: url(../images/report-image-78.png) center 0px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.install-box {
    background: url(../images/report-image-81.png) center 0px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.lowbattery-box {
    background: url(../images/report-image-77.png) center 0px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.daysinStock-box {
    background: url(../images/report-image-79.png) center 0px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.inlot-box {
    background: url(../images/report-image-82.png) center 20px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.devicessold-box {
    background: url(../images/report-image-84.png) center 0px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.Exceptions-box {
    background: url(../images/report-image-85.png) center 0px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.devicessold-box {
    background: url(../images/report-image-84.png) center 0px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.agingreport-box {
    background: url(../images/report-image-90.png) center 0px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.driveoff-box {
    background: url(../images/report-image-91.png) center 0px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.uninstalledhistory-box {
    background: url(../images/report-image-92.png) center 0px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.installationexception-box {
    background: url(../images/report-image-93.png) center 0px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.Exceptions-box {
    background: url(../images/report-image-85.png) center 0px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.vehiclependinginstallation-box {
    background: url(../images/report-image-1102000003.png) center 20px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}
#scheduleModal div.lowbattery-wireless-box {
    background: url(../images/report-image-1102000026.png) center 20px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.missing-devices-box {
    background: url(../images/report-image-1102000027.png) center 20px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal div.customvehicletype-box {
    background: url(../images/report-image-1102000021.png) center 20px no-repeat;
    width: 120px;
    height: 80px;
    margin: auto;
}

#scheduleModal select.filter {
    float: right;
    width: 170px;
    bottom: 0;
    top: 43px;
    right: 220px;
    height: 30px;
}
/* end Report admin*/

/* Change Avatar Panel */
#viewAvatarsList {
    margin: 0px;
    padding: 0px;
    list-style: none;
    overflow: auto;
}

    #viewAvatarsList li {
        float: left;
        border: 1px solid #ddd;
        text-align: center;
        width: 180px;
        height: 120px;
        margin: 0 5px 5px 0;
    }

        #viewAvatarsList li.active {
            border-color: #0000ff;
        }

        #viewAvatarsList li img {
            padding: 0px;
            vertical-align: middle;
        }

#viewAvatarsModal {
    width: 90%;
    max-height: 600px;
    left: 0%;
    margin: 0 auto;
    padding: 5px;
    background-color: #fff;
}

    #viewAvatarsModal .modal-body {
        padding: 5px;
        overflow: auto;
    }

/* Edit Device */
.edit_device .flow label {
    display: inline-block;
    width: 150px;
}

.feature {
    background: #eee;
    padding: 20px 0 20px 20px;
    margin: 5px 0;
}

.avatarbtn {
    width: 150px;
    margin-top: 4px;
    margin-left: 0 !important;
}

/* Edit User */
.edit_user .flow label {
    display: inline-block;
    width: 125px;
    padding-top: 15px;
}

/* Edit Geofence */
.edit_geofence .flow label {
    display: inline-block;
    width: 100px;
}

/* Edit Alert */
.edit_alert .flow label {
    display: inline-block;
    width: 120px;
}

body.editalert #resultItemsList {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

    body.editalert #resultItemsList span.checkbox {
        display: inline-block;
    }

body.addgeofence .edit_geofence span.checkbox {
    display: inline-block;
}

    body.addgeofence .edit_geofence span.checkbox input {
        float: none;
    }

body.addgeofence .edit_geofence #resultItemsList {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

/* Groups */

#list-device {
    position: static !important;
}

.groups .flow label {
    display: inline-block;
    width: 100px;
}

.transferWarning {
    float: right;
    bottom: 0;
    right: 0;
    position: absolute;
    width: 65%;
}

label.warning {
    color: #f00;
}

.w75 {
    width: 75px;
}

a.delete2 {
    background: url(../images/del_icon.png) no-repeat scroll left top rgba(0, 0, 0, 0);
    display: inline-block;
    height: 24px;
    width: 24px;
}

    a.delete2 span {
        display: none;
    }

a.remove {
    background: url(../images/cross.png) no-repeat scroll center center rgba(0, 0, 0, 0);
    display: block;
    height: 18px;
    overflow: hidden;
    text-indent: -100px;
    width: 18px;
}

table.table thead th {
    background: #49bbd7;
    color: #fff;
    font-size: 16px;
    font-weight: normal;
}

table.table th.sorting a {
    display: block;
    padding-right: 20px;
    background: transparent;
    color: #fff;
    text-decoration: none;
}

    table.table th.sorting a:hover {
        text-shadow: 1px 1px 2px #12778f;
        -webkit-text-shadow: 1px 1px 2px #12778f;
        -moz-text-shadow: 1px 1px 2px #12778f;
    }

    table.table th.sorting a.asc {
        background: url(../images/sort_up.png) right center no-repeat;
    }

    table.table th.sorting a.desc {
        background: url(../images/sort_down.png) right center no-repeat;
    }

table.table th a.location {
    display: inline;
    padding-right: 20px;
}

table.table th a.show-more {
    display: inline;
    padding-left: 20px;
}

/* Custom #infoWindowDevice and Mapit*/
.olPopup {
    background-color: transparent !important;
}

.olPopupContent {
    overflow: hidden !important;
}

#infoWindowDevice.Mapit table td:last-child {
    text-transform: none;
    width: 70%;
}

#mapit a.logo {
    height: 72px;
    padding: 0px;
}

#mapit #map {
    /*position: absolute;*/
    width: 100%;
    z-index: 1;
    top: 0px;
    right: 0px;
}

#mapit #panorama {
    position: absolute;
    width: 50%;
    top: 72px;
    right: 0px;
}

#mapit #closePanorama {
    position: absolute;
    top: 80px;
    right: 10px;
    z-index: 3;
    display: none;
}

#infoWindowDevice.Mapit {
    background: url(../images/device-popup2.png) top left no-repeat;
}

    #infoWindowDevice.Mapit div.Inner a.Close {
        float: right;
        padding: 1px 5px 2px 5px;
        top: 2px !important;
        right: -1px !important;
        color: #868686;
        z-index: 10000;
        margin-right: 15px;
        margin-top: 5px;
    }

    #infoWindowDevice.Mapit h3.Title {
        font-weight: bold !important;
    }

.olPopupContent #infoWindowDevice, #infoWindowDevice.Mapit {
    width: 297px;
    height: 201px;
    display: block;
    z-index: 999999;
    font-size: 11px;
    background: url(../images/device-popup2.png) top left no-repeat;
    border: solid 1px transparent;
    position: relative;
    top: 0px;
    left: 0px;
}

    .olPopupContent #infoWindowDevice > div.mini-popup {
        display: none;
    }

    .olPopupContent #infoWindowDevice.Mini {
        background: none;
    }

        .olPopupContent #infoWindowDevice.Mini > div.mini-popup {
            margin-left: 0;
            margin-top: 108px;
            width: 278px;
            height: 94px;
            display: block;
            background: url(../images/device-popup1.png) top left no-repeat;
        }

            .olPopupContent #infoWindowDevice.Mini > div.mini-popup > a {
                display: block;
                text-align: center;
                padding-top: 30px;
            }

        .olPopupContent #infoWindowDevice.Mini div.Inner {
            display: none;
        }

    .olPopupContent #infoWindowDevice h3, #infoWindowDevice.Mapit h3 {
        font-size: 12px;
        line-height: 16px;
        color: #000;
        text-transform: none;
    }

    .olPopupContent #infoWindowDevice div.Inner, #infoWindowDevice.Mapit div.Inner {
        height: 130px;
        margin: 20px 30px;
        overflow: hidden;
        width: 230px;
    }

    .olPopupContent #infoWindowDevice .Triangle {
        width: 87px;
        height: 50px;
        background: url(../images/triangle1.png) top left no-repeat;
        bottom: -50px;
        left: 50%;
        position: absolute;
    }

    .olPopupContent #infoWindowDevice div.Inner a.Close {
        float: right;
        padding: 1px 5px 2px 5px;
        top: 0px;
        right: -25px;
        /*font-size: 16px;*/
        color: #868686;
        z-index: 10000;
    }

    .olPopupContent #infoWindowDevice div.Inner a.C, #infoWindowDevice.Mapit div.Inner a.C {
        right: -4px !important;
    }

    .olPopupContent .deivce-into, #infoWindowDevice.Mapit .deivce-into {
        margin-top: 7px;
    }

    .olPopupContent #infoWindowDevice table td, #infoWindowDevice.Mapit table td {
        height: 14px;
        overflow: hidden;
        line-height: 12px;
        vertical-align: top;
    }

    .olPopupContent #infoWindowDevice ul.device-tools, #infoWindowDevice.Mapit ul.device-tools {
        margin: 0px;
        padding: 0px;
        overflow: hidden;
        list-style: none;
        position: absolute;
        bottom: 20px;
        font-size: 10px;
    }

        .olPopupContent #infoWindowDevice ul.device-tools li, #infoWindowDevice.Mapit ul.device-tools li {
            float: left;
            margin: 5px;
        }

    .olPopupContent #infoWindowDevice div.Inner > div.Content, #infoWindowDevice.Mapit div.Inner > div.Content {
        height: 100%;
        left: 0;
        top: 10px;
        width: 100%;
        margin-top: 15px;
    }

/* Transfer Dialog */
#transfer-devices-dialog, #confirm-transfer-devices-group-dialog {
    width: 1024px;
    height: 600px;
    margin-left: -512px;
    top: 7%;
}

#transfer-devices-to-paid-dialog {
    width: 1024px;
    height: 550px;
    margin-left: -512px;
    top: 7%;
}

    #transfer-devices-dialog label.warning, #confirm-transfer-devices-group-dialog label.warning, #transfer-devices-to-paid-dialog label.warning {
        float: left;
        margin-left: 15px;
        margin-top: 15px;
    }

    #transfer-devices-dialog .wrap, #transfer-devices-to-paid-dialog .wrap {
        overflow: hidden;
    }

    #transfer-devices-dialog table td, #transfer-devices-to-paid-dialog table td {
        padding: 5px;
    }

#transfer-devices-dialog #account-list {
    float: left;
    width: 35%;
}

#transfer-devices-dialog #device-list {
    float: right;
    width: 60%;
    max-height: 305px !important;
    overflow-y: auto !important;
}

#transfer-devices-to-paid-dialog #device-list-to-paid {
    overflow-y: auto !important;
}

#transfer-devices-dialog .inside-myaccount ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

    #transfer-devices-dialog .inside-myaccount ul li.sub-account {
        margin-left: 20px;
    }

#transfer-devices-dialog div.accounts ul li span,
#transfer-devices-dialog div.outside-myaccount ul li span {
    background: url("../images/NavAdmin.png") no-repeat scroll left center rgba(0, 0, 0, 0);
    padding-left: 26px;
}

#confirm-transfer-devices-group-dialog .modal-body, #transfer-devices-dialog .modal-body, #transfer-devices-to-paid-dialog .modal-body {
    height: 350px;
}

#confirm-transfer-devices-group-dialog .table > tbody > tr:first-child > td {
    border-top: 0;
}

.cate-header {
    background: url("../images/morado.jpg") repeat-x scroll left top transparent;
    padding: 5px 0px 5px 10px;
    font-weight: bold;
}

.cates {
    border: 1px solid #F5F5F5;
    height: 400px;
    overflow: auto;
}

.cate-item {
    padding-left: 10px;
    background-color: #F9F9F9;
    cursor: pointer;
}

    .cate-item:hover span {
        background: url(../images/NavAdmin-selected.png) 0% 50% no-repeat !important;
        margin-left: 3px !important;
        padding-left: 26px !important;
    }

    .cate-item span {
        padding-left: 26px;
        background: url(../images/NavAdmin.png) left center no-repeat;
    }

.cate-selected span {
    background: url(../images/NavAdmin-selected.png) 0% 50% no-repeat !important;
    margin-left: 3px !important;
}

.cates ul {
    list-style-type: none;
    padding-left: 0px;
}

/*******
General Listing styles
*******/
.table {
    margin-top: 20px;
}

    .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
        vertical-align: middle;
    }

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    background-color: #49bbd7;
    border-color: #49bbd7;
}

.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
    color: #49bbd7;
}

/*******
    Button styles 
*******/
.btn, .btn:link, .btn:hover, .btn:active, .btn:visited {
    background-color: #c8c8c8 !important;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border: none;
    padding: 0;
    margin-left: 5px;
    margin-top: 10px;
    float: none;
    opacity: 1.0;
}

    .btn span {
        background: url(../images/button-img.png) no-repeat;
        background-position: 0 0;
        background-size: 100% 100%;
        -webkit-transition: background-position 0.2s;
        -moz-transition: background-position 0.2s;
        transition: background-position 0.2s;
        display: block;
        padding: 10px 20px;
        text-transform: uppercase;
        color: #fff;
        border: none;
        font-size: 14px;
        font-weight: normal;
        text-shadow: none;
        -moz-text-shadow: none;
        -webkit-text-shadow: none;
        line-height: 1.4em;
    }

    .btn:hover span {
        background: url(../images/button-img.png) no-repeat;
        background-position: 0 -17px;
        -webkit-transition: background-position 0.2s;
        -moz-transition: background-position 0.2s;
        transition: background-position 0.2s;
    }

.btn-go, .btn-go:link, .btn-go:hover, .btn-go:active, .btn-go:visited {
    background-color: #49bbd7 !important;
}

.btn-submit, .btn-submit:link, .btn-submit:hover, .btn-submit:active, .btn-submit:visited {
    background-color: #45bd45 !important;
}

.btn-search, .btn-search:link, .btn-search:hover, .btn-search:active, .btn-search:visited {
    background-color: #49bbd7 !important;
    margin-top: 0;
}

    .btn-search span {
        padding: 5px 13px;
    }

.pull-right a {
    text-decoration: none;
}

a img {
    position: relative;
    top: 2px;
    -webkit-transition: top 0.2s;
    -moz-transition: top 0.2s;
    transition: top 0.2s;
}

a:hover img {
    position: relative;
    top: -2px;
    -webkit-transition: top 0.2s;
    -moz-transition: top 0.2s;
    transition: top 0.2s;
}

/*******
Popup styles 
*******/
.dialog_modal {
    height: 250px !important;
    width: 400px !important;
    position: absolute !important;
    top: 40% !important;
    left: 50% !important;
    margin-left: -200px !important;
    margin-top: -200px !important;
}

/*htthanh*/
.dialog_modal2 {
    height: 250px !important;
    width: 700px !important;
    position: absolute !important;
    top: 40% !important;
    left: 40% !important;
    margin-left: -200px !important;
    margin-top: -200px !important;
}
/*htthanh*/
.simple-overlay, .wrapper .modal, .ui-widget.ui-dialog, .ui-datepicker {
    /* must be initially hidden */
    display: none; /* place overlay on top of other elements */
    z-index: 10000; /* styling */
    width: auto;
    background: #fff;
    -webkit-box-shadow: 4px 4px 15px 0px rgba(50, 50, 50, 0.31);
    -moz-box-shadow: 4px 4px 15px 0px rgba(50, 50, 50, 0.31);
    box-shadow: 4px 4px 15px 0px rgba(50, 50, 50, 0.31);
}

    .simple-overlay .close {
        display: none;
    }

    .simple-overlay > div {
        padding: 20px;
    }

.wrapper .modal {
    left: 50%;
    margin-left: -325px;
    top: 10%;
    width: 650px;
    padding: 30px;
    background-color: #fff;
    height: 500px;
    overflow: hidden;
}

.modal-body {
    max-height: 350px;
    overflow-y: auto;
    padding: 15px;
    position: relative;
    background: #fff;
}

.modal-footer {
    border: none;
}

.ui-autocomplete {
    background: #fff !important;
}

    .ui-autocomplete .ui-state-hover {
        background: #eaeaea !important;
        border: none !important;
        border-radius: 0;
        margin: 0 !important;
    }

.deviceSetting ul {
    list-style: none;
}

label {
    font-weight: 200 !important;
}

span.field-validation-error {
    color: #ff0000;
    clear: both;
    float: left;
}

.col-md-4 > span.field-validation-error {
    margin-left: 31%;
}

.flow > span.field-validation-error {
    /*margin-left: 26%;*/
    margin-left: 157px;
    display: block;
}

.alert {
    padding: 8px 35px 8px 14px;
    margin-bottom: 20px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    background-color: #fcf8e3;
    border: 1px solid #fbeed5;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

    .alert,
    .alert h4 {
        color: #c09853;
    }

        .alert h4 {
            margin: 0;
        }

        .alert .close {
            position: relative;
            top: -2px;
            right: -21px;
            line-height: 20px;
        }

.alert-success {
    color: #468847;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

    .alert-success h4 {
        color: #468847;
    }

.alert-danger,
.alert-error {
    color: #b94a48;
    background-color: #f2dede;
    border-color: #eed3d7;
}

    .alert-danger h4,
    .alert-error h4 {
        color: #b94a48;
    }

.alert-info {
    color: #3a87ad;
    background-color: #d9edf7;
    border-color: #bce8f1;
}

    .alert-info h4 {
        color: #3a87ad;
    }

.alert-block {
    padding-top: 14px;
    padding-bottom: 14px;
}

    .alert-block > p,
    .alert-block > ul {
        margin-bottom: 0;
    }

    .alert-block p + p {
        margin-top: 5px;
    }

td.reportTDheader {
    width: 100px;
}

/*******
Register page
*******/
.register-device {
    padding: 10px 100px;
    background-color: white;
    height: 100%;
}

    .register-device label {
        display: inline-block;
        width: 150px;
    }

    .register-device h4 {
        margin-top: 30px;
    }

    .register-device select, .register-device input[type=text] {
        width: 250px;
    }

    .register-device #Carrier {
        width: 110px;
        height: 30px;
    }

    .register-device acceptTerms.label {
        width: 60% !important;
    }

.halfme {
    width: 50%;
    float: left;
}

.col-md-5 > span.field-validation-error {
    margin-left: 0% !important;
    float: none;
}

.register-device > span.field-validation-error {
    margin-left: 1% !important;
    float: none;
}

/*******
Mobile Styles
*******/

@media screen and (max-width: 1366px) {
    .pull-right {
        width: 100%;
        text-align: right;
    }
}

.checkboxForm {
    margin-top: 16px !important;
    width: 20px !important;
}

.required {
    color: #ff0000;
}

#messageModel {
    width: 270px;
    top: 30% !important;
    left: 40%;
    height: 170px;
    background-color: white;
    overflow-y: hidden;
}

    #messageModel .modal-footer {
        margin-top: 5px;
        padding: 0;
        text-align: center;
    }

    #messageModel .modal-body {
        max-height: 80px !important;
        overflow: hidden;
    }

/* Device: Export & Print */
.devices #deviceQuickTools {
    list-style: none;
    overflow: hidden;
    margin: 0px;
    padding: 0px;
}

    .devices #deviceQuickTools li {
        float: right;
        margin: 0px 0px;
    }

        .devices #deviceQuickTools li a {
            display: block;
            width: 30px;
            height: 34px;
        }

            .devices #deviceQuickTools li a span {
                display: none;
            }

        .devices #deviceQuickTools li.print a {
            background: url(../images/IconPrint.png) center left no-repeat;
        }

        .devices #deviceQuickTools li.pdf a {
            background: url(../images/s-pdf.png) center left no-repeat;
        }

        .devices #deviceQuickTools li.csv a {
            background: url(../images/s-csv.png) center left no-repeat;
        }

#renewalsModal.renew {
    width: 70%;
    left: 15%;
    top: 10%;
    height: 500px;
    background: #fff;
    overflow: hidden;
}

#renewalsModal .modal-body {
    height: 320px;
}

#renewalsGrid select {
    margin: 0px;
}

div.history-report #reportResult #mini-map {
    margin-top: 20px;
}

.ui-menu-item {
    font-size: 13px;
}
/*htthanh*/
a.newgroup {
    background: url(../images/newgroup.png) top left no-repeat;
    display: inline-block;
    width: 24px;
    height: 24px;
}

a.edit2 {
    background: url(../images/edit_icon.png) top left no-repeat;
    display: inline-block;
    width: 24px;
    height: 24px;
}

a.newgroup span {
    display: none;
}

a.edit2 span {
    display: none;
}

.btnclose {
    background: #70c7e7 !important;
}

.btnSearchGeofences {
    margin-top: 0px !important;
    background-color: #51a351 !important;
    padding: 4px 12px !important;
}

#resultItemsList li {
    clear: both !important;
    margin-bottom: 5px !important;
}

.pagination ul > li {
    display: inline;
}

#findAddress {
    display: inline-block;
    text-indent: -200px;
    overflow: hidden;
    background: url(../images/search.png) no-repeat center;
    height: 30px;
    width: 20px;
    padding-left: 1px;
}

#newGeoGroup, .newGeoGroup {
    display: inline-block;
    text-indent: -200px;
    overflow: hidden;
    background: url(../images/new.png) no-repeat center;
    height: 30px;
    width: 20px;
    padding-left: 1px;
}


.ui-autocomplete-StockNumber {
    width: 160px;
    display: inline-block;
}

.ui-autocomplete-SerialNumber {
    width: 135px;
    display: inline-block;
}

.ui-autocomplete-VIN {
    width: 175px;
    display: inline-block;
}

.ui-autocomplete-Action {
    width: 90px;
    display: inline-block;
}

    .ui-autocomplete-Action img {
        width: 22px;
        height: 22px;
        cursor: pointer;
    }

.ui-autocomplete-header {
    font-weight: bold;
    padding: .2em .4em;
}

.ui-autocomplete {
    font-size: 13px !important;
    font-family: 'Arimo', Arial, Helvetica, sans-serif;
}

.ui-menu .ui-menu-item a {
    display: inline !important;
}

.ui-menu .ui-menu-item,
.ui-menu .ui-autocomplete-header {
    height: 25px;
}

.navbar-default .navbar-toggle {
    border-color: transparent;
}

.logo > a > img {
    width: auto;
    height: 60px;
    margin-left: 20px;
}

#searchKeywords {
    width: 188px !important;
    height: 22px;
    padding-right: 25px;
    vertical-align: top;
    font-size: 9.5px !important;
}








#AdvancedSearch {
    font-size: 9.5px !important;
    position: absolute;
    top: 40px !important;
    left: 250px !important;
    display: none;
}

.keyword {
    width: 188px;
    position: relative;
}

#buttonSearch {
    margin-left: 3px;
}

    #buttonSearch > span {
        font-size: 8.5px;
    }

#buttonClear {
    margin-left: 3px;
}

    #buttonClear > span {
        font-size: 8.5px;
    }

.mainMenu .navbar-toggle {
    width: 95px;
    height: 35px;
}

.map-icon .navbar-toggle img {
    top: -9px;
}

.mainMenu .text-bar {
    top: 8px;
    font-size: 11px;
}

.mainMenu .navbar-toggle > span:nth-child(4) {
    font-size: 11px;
    top: 7px;
    left: 33px;
}

.navbar-toggle .icon-bar {
    margin-top: -4px;
    margin-left: -10px;
}

    .navbar-toggle .icon-bar + .icon-bar {
        margin-top: 3px;
        margin-left: -10px;
    }

.navbar-nav {
    margin-top: 5px;
    margin-right: 0;
    margin-bottom: 5px;
    margin-left: 0px;
}

@media (min-width:768px) {
    .navbar {
        border-radius: 0 !important;
    }
}

.ImageBattery {
    width: 75px;
}


/****************************************************/
/******************** Filter Style *******************/
/****************************************************/

#DealershipLots {
    font-size: 9.5px !important;
    position: absolute;
    top: 5px !important;
    left: 470px;
}

#searchLots {
    width: 170px !important;
    height: 22px;
    padding-right: 25px;
    vertical-align: top;
    font-size: 9.5px !important;
    margin: unset;
}


#VehicleTypes {
    font-size: 9.5px !important;
    position: absolute;
    top: 5px !important;
    left: 650px;
}

#vehicleTypesSearch {
    width: 170px !important;
    height: 22px;
    padding-right: 25px;
    vertical-align: top;
    font-size: 9.5px !important;
    margin: unset;
}

#SubFleets {
    font-size: 9.5px !important;
    position: absolute; 
    margin: unset;
}

#subFleetsSearch {
    width: 170px !important;
    height: 22px;
    padding-right: 25px;
    vertical-align: top;
    font-size: 9.5px !important;
    margin: unset;
}

#FilterBy {
    font-size: 9.5px !important;
    position: absolute;   
    z-index: 5;
}

#filterby {
    width: 150px !important;
    height: 22px;
    padding-right: 25px;
    vertical-align: top;
    font-size: 9.5px !important;
    margin: unset;
}

#DealershipVIN {
    font-size: 9.5px !important;
    position: absolute;
    top: 5px !important;
    left: 140px !important;
}

/****************************************************/
/******************** Popup Style *******************/
/****************************************************/

/* Popup Style */
.InfoWindowDevicePopup {
    width: 380px;
    display: block;
    right: 10px;
    top: 188px;
    z-index: 999999;
    font-size: 11px;
    color: #333;
    height: 245px;
}

    .InfoWindowDevicePopup .large {
        width: 360px;
        height: 190px;
        margin-left: 18px;
        margin-top: 12px;
        background: url(../images/popup-bg.png) top left no-repeat;
        font-family: 'Muli', Verdana, Arial, sans-serif !important;
        font-size: 12px;
        color: #66656c;
    }

    .InfoWindowDevicePopup .Lotname {
        font-size: 13px;
        text-align: left;
        font-weight: bold;
        margin-top: 20px
    }

    .InfoWindowDevicePopup h3 {
        font-size: 13px;
        line-height: 16px;
        color: #333;
        margin-bottom: 10px !important;
        margin-right: 10px !important;
    }

    .InfoWindowDevicePopup .large h3 {
        font-size: 13px;
        font-weight: normal;
        margin-top: 7px !important;
        margin-bottom: 0px !important;
        margin-left: 15px !important;
    }

    .InfoWindowDevicePopup a {
        color: #136095;
    }

    .InfoWindowDevicePopup img.loading {
        display: none;
        position: absolute;
        right: 45px;
        top: 8px;
    }

    .InfoWindowDevicePopup img.error,
    .InfoWindowDevicePopup img.success {
        display: none;
        position: absolute;
        right: 45px;
        top: 5px;
        height: 20px;
        width: 20px;
    }

    .InfoWindowDevicePopup img.avatar {
    }

    .InfoWindowDevicePopup span.text-loading {
        display: none;
        position: absolute;
        font-size: 14px;
        right: 70px;
        top: 11px;
    }

    .InfoWindowDevicePopup .in-progress img.loading {
        display: block;
        width: 16px;
        height: 16px;
    }

    .InfoWindowDevicePopup .in-progress span.text-loading {
        display: none;
    }

    .InfoWindowDevicePopup .in-progress img.success,
    .InfoWindowDevicePopup .in-progress img.error {
        display: none !important;
    }

    .InfoWindowDevicePopup .successful img.success {
        display: block;
    }

    .InfoWindowDevicePopup .un-successful img.error {
        display: block;
    }

    .InfoWindowDevicePopup a.Close {
        color: #FFFFFF;
        display: block;
        height: 16px;
        position: absolute;
        right: 13px;
        top: 10px;
        width: 18px;
        background: none;
    }

    .InfoWindowDevicePopup .large a.Close {
        right: 27px;
        top: 8px;
        text-indent: 100px;
        overflow: hidden;
    }

    .InfoWindowDevicePopup a.maximized {
        position: absolute;
        right: 35px;
        top: 8px;
        background: url(../images/w-maximized.gif) top left no-repeat;
        width: 19px;
        height: 19px;
    }

    .InfoWindowDevicePopup .large a.maximized {
        display: none;
    }

    .InfoWindowDevicePopup a.minimized {
        position: absolute;
        right: 41px;
        top: 14px;
        background: url(../images/w-minimized.gif) top center no-repeat;
        display: none;
        width: 19px;
        height: 19px;
    }

    .InfoWindowDevicePopup .large a.minimized {
        display: block;
    }

    .InfoWindowDevicePopup .large div.Info {
        width: 300px;
        left: 0px;
        height: 50px;
        padding-left: 10px;
        padding-top: 10px;
    }

        .InfoWindowDevicePopup .large div.Info div.Avatar {
            width: 100px;
            float: left;
            margin-left: 20px;
        }

    .InfoWindowDevicePopup .large div.selectTimeEnd {
        width: 300px;
        padding-left: 10px;
        height: 30px;
    }

        .InfoWindowDevicePopup .large div.selectTimeEnd label {
            width: 50px;
        }

    .InfoWindowDevicePopup .large input.selectDate {
        width: 90px;
        height: 25px;
        padding: 4px 6px;
    }

    .InfoWindowDevicePopup .large input.selectTime {
        margin-left: 10px;
        width: 50px;
        height: 25px;
        padding: 4px 6px;
    }

    .InfoWindowDevicePopup .large select.selectAP {
        margin-left: 10px;
        width: 60px;
        height: 25px;
        font-size: 9pt;
        padding: 4px 6px;
    }

    .InfoWindowDevicePopup .large div.selectTimeStart {
        width: 300px;
        padding-left: 10px;
        height: 35px;
    }

        .InfoWindowDevicePopup .large div.selectTimeStart label {
            width: 50px;
        }

    .InfoWindowDevicePopup .large div.notice {
        width: 330px;
        left: 0px;
        padding-left: 15px;
        color: red;
        line-height: 1.1;
        font-size: 10px;
    }

    .InfoWindowDevicePopup .large div.Run {
        padding-top: 4px;
        width: 320px;
        text-align: right;
    }

        .InfoWindowDevicePopup .large div.Run a {
            display: block;
            padding: 2px 4px;
            font-size: 10.5px;
            color: #333333;
            text-align: center;
            cursor: pointer;
            background-color: #f5f5f5;
            border: 1px solid #bbbbbb;
            width: 80px;
            margin-bottom: 2px;
            border-radius: 4px;
            float: right;
        }

    .InfoWindowDevicePopup a.mini {
        display: block;
        margin-top: 17px;
        text-align: center;
        font-size: 15px;
    }

    .InfoWindowDevicePopup div.Inner {
        position: relative;
        top: -8px;
    }

        .InfoWindowDevicePopup div.Inner > div.Content {
            left: 8px;
            position: absolute;
            top: 30px;
            width: 280px;
        }

    .InfoWindowDevicePopup div.avatar {
        width: 60px;
        float: left;
        text-align: center;
        padding-right: 2px;
    }

    .InfoWindowDevicePopup div.detail {
        width: 195px;
        float: left;
        left: 24px;
        vertical-align: middle;
        position: relative;
    }

    .InfoWindowDevicePopup div.deviceLocation {
        width: 279px;
        float: left;
        padding-top: 5px;
        font-weight: bold;
    }

    .InfoWindowDevicePopup span.batteryLevel img {
        width: 30px;
        height: 10px;
    }

    .InfoWindowDevicePopup div.Inner > div.Content span {
        line-height: 16px;
        font-size: 13px;
        text-align: left;
        font-weight: bold;
    }

        .InfoWindowDevicePopup div.Inner > div.Content span.located-at {
            margin-bottom: 0px;
            color: red;
        }

        .InfoWindowDevicePopup div.Inner > div.Content span.old {
            color: #C76B11;
        }

        .InfoWindowDevicePopup div.Inner > div.Content span.recent {
            color: green;
        }

    .InfoWindowDevicePopup table td {
        height: 14px;
        line-height: 15px;
        overflow: hidden;
        vertical-align: top;
    }

        .InfoWindowDevicePopup table td:first-child {
            text-align: justify;
            width: 80px;
        }

        .InfoWindowDevicePopup table td:last-child {
            padding-left: 10px;
            text-transform: uppercase;
            text-align: justify;
        }

    .InfoWindowDevicePopup ul.device-tools {
        margin: 0px;
        padding: 0px;
        overflow: hidden;
        list-style: none;
        position: absolute;
        bottom: 35px;
        font-size: 10px;
    }

    .InfoWindowDevicePopup .large ul.device-tools {
        bottom: 50px;
    }

    .InfoWindowDevicePopup ul.device-tools li {
        float: left;
        margin: 5px;
    }

    .InfoWindowDevicePopup .devicename span {
        font-weight: bold;
    }

    .InfoWindowDevicePopup .in-progress h3 {
        -webkit-animation: blink 1s linear infinite;
        -moz-animation: blink 1s linear infinite;
        animation: blink 1s linear infinite;
    }

    .InfoWindowDevicePopup .in-progress .maximized {
        display: none !important;
    }

    .InfoWindowDevicePopup .command-holder {
        margin: 0px;
        padding: 0px;
        list-style: none;
        overflow: hidden;
    }

    .InfoWindowDevicePopup .commands {
        float: right;
    }

    .InfoWindowDevicePopup .bubbleFooter {
        width: 359px;
        height: 11px;
        background: url(../images/button_show.png);
        cursor: pointer;
    }

    .InfoWindowDevicePopup .command-stolenmode {
        border: 1px solid indianred !important;
    }

    .InfoWindowDevicePopup .command-holder li a {
        display: block;
        padding: 2px 4px;
        font-size: 12px;
        color: grey;
        text-align: center;
        cursor: pointer;
        background-color: transparent;
        border: 1px solid grey;
        width: 86px;
        margin-bottom: 2px;
        border-radius: 7px;
        font-weight: bold;
        height: 25px;
        padding-top: 5px;
    }

        .InfoWindowDevicePopup .command-holder li a img {
            width: 25px;
            height: 25px;
            display: none;
        }

    .InfoWindowDevicePopup .command-holder span.text {
    }

    .InfoWindowDevicePopup .commands_edit {
    }

    .InfoWindowDevicePopup .popup-quick-commands a.close {
        color: #136095 !important;
        font-size: 22px;
    }

.gm-style .gm-style-iw-c {
    padding-top: 0px;
}

.avatar img {
    max-width: 80px !important;
}

#commandList-right {
    border-radius: 7px;
}

#commandList-footer {
    border-radius: 7px;
}


.btnikon {
    position: relative;
    display: block;
    padding: 5px;
    overflow: hidden;
    border-width: 0;
    outline: none;
    border-radius: 2px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .6);
    background-color: #2ecc71;
    color: #ecf0f1;
    transition: background-color .3s;
}

    .btnikon:hover, .btn:focus {
        background-color: #27ae60;
    }

    .btnikon > * {
        position: relative;
    }

    .btnikon span {
        display: block;
        padding: 12px 24px;
    }

    .btnikon:before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        display: block;
        width: 0;
        padding-top: 0;
        border-radius: 100%;
        background-color: rgba(236, 240, 241, .3);
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .btnikon:active:before {
        width: 120%;
        padding-top: 120%;
        transition: width .2s ease-out, padding-top .2s ease-out;
    }

.InfoWindowKeyPopup {
    width: 240px;
    display: block;
    right: 10px;
    top: 188px;
    z-index: 999999;
    font-size: 11px;
    color: #333;
    height: 132px;
    margin: 25px 0px 0px 0px;
}

    .InfoWindowKeyPopup .large {
        width: 240px;
        height: 112px;
        margin-left: 18px;
        margin-top: 12px;
        background: url(../images/popup-bg.png) top left no-repeat;
        font-family: 'Muli', Verdana, Arial, sans-serif !important;
        font-size: 12px;
        color: #66656c;
    }

    .InfoWindowKeyPopup a.Close {
        color: #FFFFFF;
        display: block;
        height: 16px;
        position: absolute;
        right: 13px;
        top: 10px;
        width: 18px;
        background: none;
    }

    .InfoWindowKeyPopup .large a.Close {
        right: 27px;
        top: 8px;
        text-indent: 100px;
        overflow: hidden;
    }

    .InfoWindowKeyPopup div.Inner {
        position: relative;
        top: -8px;
    }

        .InfoWindowKeyPopup div.Inner > div.Content {
            left: 8px;
            position: absolute;
            top: 30px;
            width: 230px;
        }

    .InfoWindowKeyPopup div.avatar {
        width: 60px;
        float: left;
        text-align: center;
        padding-right: 2px;
    }

    .InfoWindowKeyPopup div.detail {
        width: 145px;
        float: left;
        left: 24px;
        vertical-align: middle;
        position: relative;
    }

    .InfoWindowKeyPopup span.batteryLevel img {
        width: 30px;
        height: 10px;
    }

    .InfoWindowKeyPopup div.Inner > div.Content span {
        line-height: 16px;
        font-size: 13px;
        text-align: left;
        font-weight: bold;
    }
    .InfoWindowKeyPopup div.Inner > div.Content span.located-at {
        margin-bottom: 0px;
        color: #C76B11;
    }
    .InfoWindowKeyPopup div.Inner > div.Content span.cord-at {
        margin-bottom: 0px;
        color:  royalblue;
    }

.show_keys {
    height:100%
}

#key_container{
    height:100%
}

#miniMapWraperKey {
    height: 100%
}

.quick-actions-key {
    height: 100%
}

modal_key{
    height:89%;
    width: 95%;
    left:3%;
    margin-left:0px;
}


#dialogKeysInfo {
    width: 98%;
    height: 98%;
}

#contentKeysInfo {
    width: 100%;
    height: 90%;
}

#keysInfoModelBody {
    height: 90%;
    max-height: 960px;
    overflow-y: initial;
}

.keyInfoDiv {
    height: 100%;
    width: 100%
}

.keyInfoFrame {
    width: 100%;
    height: 100%;
    border: 0px none;
}


#devicekeysInfoModel {
    height: 89%;
    width: 95%;
    left: 3%;
    margin-left: 0px
}

#devicekeysInfoModelBody {
    height: 100%;
    max-height: 770px;
    overflow-y: initial;
    padding: 5px;
}

.devicekeyInfoDiv {
    height: 100%;
    width: 100%
}

.devicekeyInfoFrame {
    width: 100%;
    height: 100%;
    border: 0px none;
}

.showKeysDisabled a {
    pointer-events: none;
    color: gray;
    opacity: 0.6;
}

.InfoWindowDevicePopup .command-holder #isEnabled a {
    color: dodgerblue;
}