﻿/*fleet*/
/*prosegurfleet*/
/*smartfleet*/
/*claroflotas*/
/*avisfleet*/
/*elitefleet*/
/*inmelfleet*/
/*seprom-fleet*/
/*transacarfleet*/
/*GENERAL*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600&display=swap');
@import url('../../FontAwesome/css/font-awesome.min.css');
/*#region General*/
body {
    font-size: 0.85em !important;
    font-family: 'Montserrat', Verdana, Helvetica, Sans-Serif !important;
    color: #333;
    background-color: #FFF;
    margin: 0;
    min-width: 600px;
    overflow: hidden;
}

*, ::after, ::before {
    box-sizing: content-box !important;
}

.container, .container-lg, .container-md, .container-sm, .container-xl {
    max-width: 100% !important;
}

.field-validation-error {
    display: none;
    width: 0;
    height: 0;
    visibility: hidden;
}

.location-world-1 {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") 0 -48px no-repeat;
    width: 236px;
    height: 38px;
    float: right;
}

.header {
    width: 1108px;
    margin: 0 auto;
    height: 75px;
    min-height: 75px;
    overflow: hidden;
    z-index: 2000;
    background: #FFF url("https://images.geo-track.com/www/avispefleet/header-bg.png?v=2.0.1.72");
}

    .header .logo {
        background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") 0px -180px no-repeat;
        width: 210px;
        height: 57px;
        margin: 12px;
        float: left;
    }

    .header .business-top-logo {
        width: 171px;
        height: 44px;
        margin: 10px;
        background: url("https://images.geo-track.com/www/avispefleet/business-top-logo.png?v=2.0.1.72");
        float: right;
    }

.footer-container .business-bottom-logo {
    background: url("https://images.geo-track.com/www/avispefleet/business-bottom-logo.png?v=2.0.1.72");
    width: 355px;
    height: 38px;
    float: right;
}

.flow-header {
    width: 100%;
    height: 75px;
    min-height: 75px;
    overflow: hidden;
    background: url("https://images.geo-track.com/www/avispefleet/header-bg.png?v=2.0.1.72");
}

    .flow-header .logo {
        background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") 0px -180px no-repeat;
        width: 261px;
        height: 52px;
        margin: 12px;
        float: left;
    }

.loading {
    display: none;
    position: relative;
    top: 15px;
    left: 50px;
    width: 0px;
    height: 0px;
}

.identity {
    position: fixed;
    right: 230px;
    top: 25px;
    font-size: 13px;
    z-index: 3100;
    background-color: #FFF;
    padding: 5px 10px;
    border-radius: 5px;
    color: #666;
}

    .identity .today {
        color: #333;
    }

    .identity .user {
        cursor: pointer;
        color: #333;
        text-align: center;
        padding: 6px;
        border-radius: 5px;
    }

        .identity .user:hover {
            background-color: #F2F2F2;
        }

        .identity .user:before {
            content: "\f007";
            font-family: FontAwesome;
            margin-right: 5px;
        }

        .identity .user:after {
            content: "\f0d7";
            font-family: FontAwesome;
            margin-left: 5px;
        }

.user-menu-container {
    z-index: 5000;
    position: absolute;
    top: 0;
    left: 0;
    width: 300px;
    display: none;
}

    .user-menu-container .arrow {
        width: 0;
        height: 0;
        border-left: 7px solid transparent;
        border-right: 7px solid transparent;
        border-bottom: 7px solid #FFF;
        margin-left: 225px;
    }

.user-menu {
    background: #FFF;
    padding: 0 2px;
}

    .user-menu .app-name {
        font-size: 0.9em;
        display: block;
        padding: 5px 10px;
        background-color: #F2F2F2;
    }

    .user-menu .support-contact {
        font-size: 0.9em;
        display: block;
        padding: 5px 10px;
        background-color: #FFF;
        border-bottom: 1px solid #FFF;
    }

        .user-menu .support-contact a {
            text-decoration: none;
            color: #333;
            font-weight: bold;
        }

            .user-menu .support-contact a:hover {
                color: #333;
            }

    .user-menu .map-feedback {
        font-size: 0.9em;
        display: block;
        padding: 5px 10px;
        background-color: #FFF;
        border-bottom: 1px solid #FFF;
    }

        .user-menu .map-feedback a {
            text-decoration: none;
            color: #7a2682;
        }

            .user-menu .map-feedback a:hover {
                color: #333;
            }

    .user-menu .user {
        font-weight: bold;
        display: block;
        padding: 10px 10px 0 10px;
        background-color: #FFF;
    }

    .user-menu .email {
        font-size: 0.9em;
        border-bottom: 1px solid #FFF;
        padding: 0 10px 10px 10px;
        display: block;
        background-color: #FFF;
    }

    .user-menu .language {
        font-size: 0.85em;
        padding: 5px 10px;
        border-bottom: 1px solid #FFF;
    }

        .user-menu .language a {
            text-decoration: none;
            color: #7a2682;
        }

            .user-menu .language a:hover {
                color: #333;
            }

    .user-menu .actions {
        font-size: 0.85em;
        padding: 5px 10px;
        border-bottom: 1px solid #FFF;
    }

        .user-menu .actions a {
            text-decoration: none;
            color: #7a2682;
        }

            .user-menu .actions a:hover {
                color: #333;
            }

    .user-menu .singout {
        font-size: 0.85em;
        padding: 10px 10px;
    }

        .user-menu .singout a {
            text-decoration: none;
            color: #7a2682;
        }

            .user-menu .singout a:hover {
                color: #333;
            }

.info-container {
    z-index: 5000;
    position: absolute;
    top: 0;
    left: 0;
    width: 300px;
    display: none;
}

    .info-container .arrow {
        width: 0;
        height: 0;
        border-left: 7px solid transparent;
        border-right: 7px solid transparent;
        border-bottom: 7px solid #FFF;
        margin-left: 280px;
    }

    .info-container .info {
        background: #FFF;
        padding: 0 2px;
    }

        .info-container .info .name {
            font-size: 0.9em;
            display: block;
            padding: 10px 10px 10px 10px;
            background-color: #FFF;
        }

        .info-container .info .contact {
            font-size: 0.9em;
            display: block;
            padding: 5px 10px;
            background-color: #FFF;
            border-bottom: 1px solid #FFF;
        }

            .info-container .info .contact a {
                text-decoration: none;
                color: #333;
                font-weight: bold;
            }

                .info-container .info .contact a:hover {
                    color: #333;
                }

        .info-container .info .actions {
            font-size: 0.85em;
            padding: 5px 10px;
            border-bottom: 1px solid #FFF;
        }

            .info-container .info .actions a {
                text-decoration: none;
                color: #0074CC;
            }

                .info-container .info .actions a:hover {
                    color: #333;
                }

        .info-container .info .close {
            font-size: 0.85em;
            padding: 10px 10px;
        }

            .info-container .info .close a {
                text-decoration: none;
                color: #0074CC;
            }

                .info-container .info .close a:hover {
                    color: #333;
                }

.primary-button {
    background-color: #7a2682;
    border: 0;
    color: #FFF;
    border-radius: 4px;
}

    .primary-button:hover {
        box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
    }

.orange-button {
    background-color: #7a2682;
    border: 0;
    color: #FFF;
    border-radius: 4px;
}

    .orange-button:hover {
        box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
    }

.secondary-button {
    background-color: #FFF;
    border: 0;
    box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
    color: #333;
    border-radius: 4px;
}

    .secondary-button:hover {
        background: #F2F2F2;
    }

    .secondary-button.disabled {
        opacity: 0.5;
        filter: alpha(opacity=50);
        background: #F2F2F2;
    }

.grey-button {
    background-color: #FFF;
    border: 0;
    box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
    color: #333;
    border-radius: 4px;
}

    .grey-button:hover {
        background: #F2F2F2;
    }

    .grey-button.disabled {
        opacity: 0.5;
        filter: alpha(opacity=50);
        background: #F2F2F2;
    }

.grey-button-idp {
  background-color: #0074CC;
  border: 0;
  box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
  color: #FFF;
  border-radius: 4px;
}

  .grey-button-idp:hover {
    background: #0074CC;
  }

  .grey-button-idp.disabled {
    opacity: 0.5;
    filter: alpha(opacity=50);
    background: #0074CC;
  }

.blue-button {
    background-color: #7a2682;
    border: 0;
    color: #FFF;
    border-radius: 4px;
}

    .blue-button:hover {
        background: #7a2682;
    }

a.blue-button {
    text-decoration: none;
    font-size: 1.2em;
    padding: 7px 15px;
    display: inline-block;
}

.blue-option,
.gray-option {
    font-size: 1.1em;
    padding: 7px 15px;
    margin-right: 4px;
    cursor: pointer;
    border-radius: 5px 5px 5px 5px;
    font-family: 'Montserrat';
}

.blue-option {
    float: left;
    background-color: #7a2682;
    background-image: linear-gradient(top, #0074CC 0, #0074CC 50%, #0074CC 50%, #003580 100%);
    border: 1px solid #BD2C00;
    border-color: #7a2682 #7a2682 #7a2682;
    color: #FFF;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.3), inset 1px 0 0 rgba(255, 255, 255, 0.22), inset -1px 0 0 rgba(255, 255, 255, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 0 rgba(100, 100, 100, 0.1), 0 2px 0 rgba(150, 150, 150, 0.1);
}

div.blue-option:hover {
    background: #7a2682;
    background: linear-gradient(top, #7a2682 0, #7a2682 50%, #7a2682 50%, #7a2682 100%);
}

.gray-option {
    background-color: whiteSmoke;
    background-image: -ms-linear-gradient(top, #FFF, #F2F2F2);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FFF), to(#F2F2F2));
    background-image: -webkit-linear-gradient(top, #FFF, #F2F2F2);
    background-image: -o-linear-gradient(top, #FFF, #F2F2F2);
    background-image: -moz-linear-gradient(top, #FFF, #F2F2F2);
    background-image: linear-gradient(top, #FFF, #F2F2F2);
    border: 1px solid #CCC;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    box-shadow: inset 0 -1px 0 #FFF, inset 1px 0 0 rgba(255, 255, 255, 0.3), inset -1px 0 0 rgba(255, 255, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 1px 0 rgba(100, 100, 100, 0.1), 0 2px 0 rgba(150, 150, 150, 0.1);
    color: #333;
    float: left;
}

    .gray-option:hover {
        background: #F2F2F2;
    }

input[type="submit"],
input[type="button"],
button {
    font-size: 1.1em;
    padding: 7px 15px;
    cursor: pointer;
    font-family: 'Montserrat';
}

.flow-menu-bar {
    height: 30px;
    background: #FFF;
    overflow: auto;
    width: 100%;
    border-top: 1px solid #CCC;
    border-bottom: 1px solid #CCC;
}

    .flow-menu-bar > div {
        color: #666 !important;
        font-family: 'Montserrat' !important;
    }

.menu-bar {
    height: 30px;
    position: fixed;
    top: 75px;
    background: #333;
    overflow: auto;
    z-index: 52;
    width: 100%;
    -webkit-box-shadow: 0 3px 4px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 3px 4px rgba(0, 0, 0, 0.25);
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.25);
}

ul.main-menu {
    list-style: none;
    list-style-image: none;
    list-style-type: none;
    padding: 0;
    margin: 0;
    float: right;
}

    ul.main-menu li {
        cursor: pointer;
        float: left;
        padding: 0 0;
        height: 30px;
        line-height: 30px;
        /*font-family: @default-font;*/
        font-size: 12px;
    }

        ul.main-menu li a {
            padding: 0 10px;
            display: block;
            text-decoration: none;
            color: #666;
        }

            ul.main-menu li a.selected {
                background: #F2F2F2;
            }

            ul.main-menu li a:hover {
                background: #F2F2F2;
                color: #666 !important;
            }

            ul.main-menu li a:hover {
                color: #FFF;
            }

    ul.main-menu .info {
        width: 30px;
        height: 30px;
        background: #333 url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -68px -119px;
    }

.common-search-button {
    /*font-family: Verdana;*/
    font-size: 0.9em !important;
    margin: 0;
    background: whiteSmoke url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") 0 -86px;
    border: none;
}

#popup-lock {
    position: fixed;
    top: 0;
    bottom: 0;
    z-index: 700;
    background: #FFF;
    width: 100%;
    opacity: 0.25;
    filter: alpha(opacity=25);
    display: none;
}
/*#endregion*/
/*#region Login*/
.login {
    height: 100%;
    background: #FFF;
    min-width: 600px;
}

    .login .body {
        position: fixed;
        top: 75px;
        left: 0;
        width: 100%;
    }

    .login .server-messages {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 0;
        display: none;
    }

    .login .title {
        color: #666;
        font-size: 1.4em;
        text-align: center;
        margin: 30px 0 15px 0;
    }

  .login .title-ul {
    color: #666;
    font-size: 1.4em;
    text-align: center;
    margin: 30px 0 15px 0;
    visibility: hidden;
  }

    .login .body .splash {
        max-width: 1108px;
        min-width: 800px;
        height: 406px;
        margin-left: auto;
        margin-right: auto;
        background: url("https://images.geo-track.com/www/avispefleet/login-splash.png?v=2.0.1.72");
    }

        .login .body .splash.forgot-password {
            background: url("https://images.geo-track.com/www/avispefleet/login-splash.png?v=2.0.1.72");
        }

    .login .splash-text {
        float: left;
        margin-top: 50px;
        margin-left: 20px;
        width: 400px;
        /*    font-family: @default-font;*/
        font-size: 1.8em;
        text-align: center;
        color: #333;
    }

.steps-legend {
    font-size: 0.9em;
    text-align: center;
    margin-bottom: 21px;
    color: #333;
}

.final-step {
    display: none;
    color: #333;
}

.login-legend {
    color: #FFF;
}

.login .signin-container {
    background: #FFF;
    width: 336px;
    height: 306px;
    float: right;
    margin-right: 70px;
    margin-top: 36px;
    border-radius: 15px;
}

.login .signin-container-ul {
  background: #FFF transparent;
  width: 336px;
  height: 306px;
  float: right;
  margin-right: 70px;
  margin-top: 36px;
  border-radius: 15px;
}

.login .footer-container {
    width: 900px;
    height: 406px;
    margin-left: auto;
    margin-right: auto;
    overflow: auto;
    margin-top: 30px;
}

.login .footer {
    font-family: 'Montserrat';
}

    .login .footer a {
        text-decoration: none;
        font-family: 'Montserrat';
        color: #333;
        margin: 0 5px;
    }

        .login .footer a:hover {
            color: #333;
        }

.login .signin {
    padding: 20px;
}

    .login .signin .label {
        /*font-family: @default-font;*/
        font-size: 1em;
        color: #666;
        margin-bottom: 3px;
    }

    .login .signin .input {
        background: #F2F2F2;
        border: 1px solid #FFF;
        height: 20px;
        padding: 3px;
        width: 100%;
        font-size: 1em;
        margin-bottom: 10px;
        box-sizing: border-box;
    }

    .login .signin .forgot {
        font-family: 'Montserrat';
        float: left;
        line-height: 35px;
        display: block;
        text-decoration: none;
        color: #7a2682;
    }

    .login .signin .signin-button {
        float: right;
        background-color: #7a2682;
        color: #FFF;
    }

.login .lang-selector {
    color: #FFF;
    padding: 5px 30px;
    text-align: right;
}

    .login .lang-selector a {
        color: #666;
        text-decoration: none;
        font-size: 0.9em;
    }

        .login .lang-selector a:hover {
            color: #333;
        }

.login .lang-selector-ul {
  color: #FFF;
  padding: 5px 30px;
  text-align: center;
}

  .login .lang-selector-ul a {
    color: #666;
    text-decoration: solid;
    font-size: 0.9em;
  }

    .login .lang-selector-ul a:hover {
      color: #000000;
      text-decoration: solid;
    }
/*#endregion*/
/*#region Utilities*/
.loaded {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -171px -15px no-repeat;
    width: 0px;
    height: 0px;
    position: relative;
    top: 16px;
    left: 50px;
}
/*#endregion*/
/*#region Online Tracking Tabs*/
.ot-tabs-container {
    position: absolute;
    top: 107px;
    left: 0;
    width: 320px;
    /*height: 30px;*/
    /*color: @white-color;*/
    z-index: 80;
    font-size: 12px;
}

.ot-tabs {
    list-style: none;
    margin: 0;
    padding: 0;
    background: #FFF;
    border-bottom: 1px solid #CCC;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
}

    .ot-tabs li {
        display: inline-block;
        color: #333;
        padding: 5px;
        cursor: pointer;
        margin: 5px 5px 0 5px;
    }

        .ot-tabs li:hover {
            text-decoration: underline;
        }

        .ot-tabs li.selected {
            color: #333;
            background-color: #FFF;
            margin: 5px 5px 0 5px;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            border-top: 1px solid #CCC;
            border-left: 1px solid #CCC;
            border-right: 1px solid #CCC;
            border-bottom: 1px solid #FFF;
            margin-bottom: -2px;
        }

            .ot-tabs li.selected:hover {
                text-decoration: none;
            }

#online-tab .see-all-my-devices {
    background: url("https://images.geo-track.com/www/common/icons-16px.png?v=2.0.1.72") 0 -64px no-repeat;
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: bottom;
    margin-left: 5px;
    filter: invert(50%);
}

    #online-tab .see-all-my-devices:hover {
        opacity: 0.85;
        filter: alpha(opacity=85);
    }

    #online-tab .see-all-my-devices.selected {
        filter: invert(100%);
    }

#online-tab .refresh {
    background: url("https://images.geo-track.com/www/common/icons-16px.png?v=2.0.1.72") 0 -32px no-repeat;
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: bottom;
    filter: invert(50%);
}

    #online-tab .refresh:hover {
        opacity: 0.85;
        filter: alpha(opacity=85);
    }

#online-tab .export-online {
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: bottom;
    margin-left: 5px;
    filter: invert(50%);
}

    #online-tab .export-online:hover {
        opacity: 0.85;
        filter: alpha(opacity=85);
    }

    #online-tab .export-online.all {
        background: url("https://images.geo-track.com/www/common/icons-16px.png?v=2.0.1.72") 0 -112px no-repeat;
    }

    #online-tab .export-online.exporting {
        background: url("https://images.geo-track.com/www/avispefleet/ajax-loader.gif?v=2.0.1.72") no-repeat;
    }

#online-tab .download-online-file {
    background: url("https://images.geo-track.com/www/common/icons-16px.png?v=2.0.1.72") 0 -130px no-repeat;
    width: 16px;
    height: 16px;
    margin-left: 4px;
    display: none;
    vertical-align: bottom;
    filter: invert(50%);
}

#not-reviewed-alerts-counter {
    display: inline-block;
    font-size: 0.75em;
    background: #666;
    color: #FFF;
    padding: 2px 5px;
    border-radius: 10px;
    margin: 0 2px;
    cursor: default;
}

#alerts-tab .refresh {
    background: url("https://images.geo-track.com/www/common/icons-16px.png?v=2.0.1.72") 0 -32px no-repeat;
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: bottom;
    filter: invert(50%);
}

    #alerts-tab .refresh:hover {
        opacity: 0.85;
        filter: alpha(opacity=85);
    }

#alerts-panel .sound-alerts {
    background: url("https://images.geo-track.com/www/common/icons-16px.png?v=2.0.1.72") 0 -96px no-repeat;
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: bottom;
    margin-left: 5px;
    filter: invert(50%);
}

    #alerts-panel .sound-alerts:hover {
        opacity: 0.85;
        filter: alpha(opacity=85);
    }

    #alerts-panel .sound-alerts.selected {
        background: url("https://images.geo-track.com/www/common/icons-16px.png?v=2.0.1.72") 0 -80px no-repeat;
        filter: invert(50%);
    }
/*#endregion*/
/*#region Online Panel*/
#map {
    z-index: 50;
    position: fixed;
    top: 107px;
    bottom: 29px;
    left: 320px;
    width: 100%;
    background-color: #FFF;
    margin: 0 0;
    min-width: 500px;
    min-height: 500px;
    overflow: hidden;
}

#mtb-container .free-search .input {
    background-color: #FFF;
}

#mtb-container .map-list .maps a {
    padding: 3px 10px;
    background-color: #F2F2F2;
    color: #666;
    font-family: 'Montserrat';
}

    #mtb-container .map-list .maps a:after {
        content: "\f0d7";
        font-family: FontAwesome;
        margin-left: 5px;
    }

.adding-object {
    cursor: crosshair !important;
}

#op-online-dummies {
    display: none;
}

#lw-logo-a {
    position: fixed;
    bottom: 0;
    width: 320px;
    height: 37px;
    background: #FFF url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -735px -47px no-repeat;
    z-index: 71;
}

#lw-logo-b {
    width: 131px;
    height: 21px;
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -742px -99px no-repeat;
    display: inline-block;
    margin-top: 3px;
    float: left;
    margin-left: 5px;
}

#op-devices {
    position: fixed;
    top: 140px;
    bottom: 29px;
    width: 320px;
    overflow: hidden;
    background-color: #FFF;
    overflow-x: hidden;
    overflow-y: hidden;
    z-index: 70;
    -webkit-box-shadow: 0 3px 20px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 3px 20px rgba(0, 0, 0, 0.25);
    box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.25);
}

    #op-devices .filter {
        margin: 5px 7px;
        display: block;
        /*width: 310px;*/
        box-sizing: border-box;
    }

        #op-devices .filter input {
            width: 100%;
            box-sizing: border-box !important;
            border: 0;
            background-color: #F2F2F2;
            padding: 8px;
            border-radius: 5px;
            font-family: 'Montserrat';
            font-size: 12px;
        }

#user-total-devices {
    position: fixed;
    top: 180px;
    bottom: 29px;
    overflow-x: hidden;
    overflow-y: auto;
    background: #FFF;
    width: 320px;
    height: 50px;
    list-style: none;
    margin: 0;
    padding: 0;
}

    #user-total-devices div.user-devices {
        background: #F2F2F2;
        color: #333;
        display: block;
        padding: 3px 10px;
        border-bottom: 5px solid #C2C2C2;
        font-size: 14px;
        box-sizing: border-box;
        border-radius: 10px;
        margin: 5px;
    }

        #user-total-devices div.user-devices span {
            display: inline-block;
            vertical-align: middle;
            line-height: 18px;
            width: 210px;
        }

        #user-total-devices div.user-devices span-total-count {
            display: inline-block;
            vertical-align: middle;
            line-height: 18px;
            width: 30px;
            font-size: 20px;
        }

        #user-total-devices div.user-devices .show-all-devices {
            background: url("https://images.geo-track.com/www/common/icon-load-all-devices.png?v=2.0.1.72");
            width: 24px;
            height: 24px;
            display: inline-block;
            vertical-align: middle;
            margin-left: 15px;
            cursor: pointer;
        }

#op-device-groups {
    position: fixed;
    top: 200px;
    bottom: 29px;
    overflow-x: hidden;
    overflow-y: auto;
    background: #FFF;
    width: 320px;
    list-style: none;
    margin: 0;
    padding: 0;
}

    #op-device-groups div.group-header {
        background: #F2F2F2;
        color: #333;
        display: block;
        padding: 3px 10px;
        border-bottom: 1px solid #C2C2C2;
        font-size: 12px;
        box-sizing: border-box;
        border-radius: 10px;
        margin: 5px;
    }

        #op-device-groups div.group-header span {
            display: inline-block;
            vertical-align: middle;
            line-height: 18px;
            width: 170px;
        }

        #op-device-groups div.group-header span-item-count {
            display: inline-block;
            vertical-align: middle;
            line-height: 18px;
            background: #808080;
            color: #FFF;
            width: 30px;
            text-align: center;
            box-sizing: border-box;
            border-radius: 10px;
            margin: 10px;
        }

        #op-device-groups div.group-header .hide-group {
            background: url("https://images.geo-track.com/www/common/hide-tool-bar-show.png?v=2.0.1.75");
            width: 16px;
            height: 16px;
            display: inline-block;
            vertical-align: middle;
            margin-left: 5px;
            cursor: pointer;
        }

            #op-device-groups div.group-header .hide-group.disabled {
                background: url("https://images.geo-track.com/www/common/hide-tool-bar-hide.png?v=2.0.1.75");
            }

            #op-device-groups div.group-header .hide-group.selected {
                background: url("https://images.geo-track.com/www/common/hide-tool-bar-show-selected.png?v=2.0.1.75");
            }

            #op-device-groups div.group-header .hide-group.disabledSelected {
                background: url("https://images.geo-track.com/www/common/hide-tool-bar-hide-selected.png?v=2.0.1.75");
            }

        #op-device-groups div.group-header .expanded {
            background: url("https://images.geo-track.com/www/common/icons-16px.png?v=2.0.1.72") 0 -16px no-repeat;
            width: 16px;
            height: 16px;
            display: inline-block;
            vertical-align: middle;
            cursor: pointer;
        }

        #op-device-groups div.group-header .collapsed {
            background: url("https://images.geo-track.com/www/common/icons-selected-16px.png?v=2.0.1.72") 0 0 no-repeat;
            width: 16px;
            height: 16px;
            display: inline-block;
            vertical-align: middle;
            cursor: pointer;
        }

        #op-device-groups div.group-header .toggle-group-visible {
            background: url("https://images.geo-track.com/www/common/device-tool-bar.png?v=2.0.1.72") 0 -80px;
            width: 16px;
            height: 16px;
            display: inline-block;
            vertical-align: middle;
            cursor: pointer;
            margin-left: 5px;
            margin-right: 5px;
        }

            #op-device-groups div.group-header .toggle-group-visible.disabled {
                background: url("https://images.geo-track.com/www/common/device-tool-bar.png?v=2.0.1.72") 0 -64px;
            }

    #op-device-groups .options-container {
        border-top: 1px solid #F2F2F2;
        border-bottom: 1px solid #F2F2F2;
    }

        #op-device-groups .options-container .pager {
            display: none;
            padding: 5px;
            font-size: 0.9em;
            overflow: auto;
        }

    #op-device-groups li {
        list-style-type: none;
        list-style: none;
        margin: 0;
        padding: 0;
        background: #FFF;
        overflow: auto;
    }

        #op-device-groups li ul {
            list-style-type: none;
            list-style: none;
            margin: 0;
            padding: 0;
            background: #FFF;
        }

            #op-device-groups li ul li {
                background: #FFF;
                padding: 20px;
                cursor: pointer;
                -webkit-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
                -o-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
                box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
                box-sizing: border-box;
                border-radius: 10px;
                margin: 10px;
                font-size: 12px;
            }

#alerts-popup-container .alerts .popup-alert {
    background: #FFF;
    padding: 20px;
    cursor: pointer;
    -webkit-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1) !important;
    -o-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1) !important;
    box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1) !important;
    box-sizing: border-box;
    border-radius: 10px;
    margin: 10px !important;
    font-size: 12px;
}

#alerts-popup-container .alerts {
    margin: 0;
    width: 100%;
    box-sizing: border-box;
}

#alerts-popup-container .title {
    background-color: #F2F2F2 !important;
    color: #666 !important;
}

#alerts-popup-container {
    background-color: #FFF !important;
    color: #666 !important;
}

#op-device-groups li ul li:hover {
    -webkit-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.2);
    -o-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0px 9px rgba(0, 0, 0, 0.2);
}

#op-device-groups li ul li.selected {
    background: #F2F2F2;
}

.device-item .model-name {
    font-weight: bold;
    color: #666;
}

.device-item .alias {
    font-weight: bold;
    color: #333;
}

.device-item .last-address {
    font-weight: normal;
    font-size: 0.95em;
    color: #666;
}

.device-item .on-demand-address {
    color: #7a2682;
    font-size: 0.95em;
    text-decoration: none;
}

.device-item.hidden {
    opacity: 0.3;
    filter: alpha(opacity=30);
}

.device-over {
    -webkit-box-shadow: 1px 3px 7px rgba(0, 0, 0, 0.75);
    -o-box-shadow: 1px 3px 7px rgba(0, 0, 0, 0.75);
    box-shadow: 1px 3px 7px rgba(0, 0, 0, 0.75);
}

.device-marker {
    width: 38px;
    height: 38px;
    display: block;
}

    .device-marker div:first-child {
        width: 37px;
        height: 33px;
        border-radius: 5px;
        display: block;
    }

    .device-marker .arrow {
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        margin: 0 auto;
        display: block;
    }

.landmark-tip .name {
    font-weight: bold;
    color: #333;
}

.landmark-tip .owner {
    font-weight: bold;
    color: #CCC;
}

.landmark-tip .address {
    font-weight: normal;
    font-size: 0.95em;
    color: #666;
}

.landmark-tip a.center {
    text-decoration: none;
    color: #0074CC;
    font-size: 0.9em;
}

    .landmark-tip a.center:hover {
        color: #333;
    }

.landmark-tip a.mark {
    margin-left: 5px;
    text-decoration: none;
    color: #0074CC;
    font-size: 0.9em;
}

    .landmark-tip a.mark:hover {
        color: #333;
    }

.landmark-tip a.zone {
    margin-left: 5px;
    text-decoration: none;
    color: #0074CC;
    font-size: 0.9em;
}

    .landmark-tip a.zone:hover {
        color: #333;
    }

.traffic-tip .level {
    font-weight: bold;
    color: #333;
}

.traffic-tip .owner {
    font-weight: bold;
    color: #CCC;
}

.traffic-tip .street {
    font-weight: normal;
    font-size: 0.95em;
    color: #666;
}

.traffic-alert-tip .type {
    font-weight: bold;
    color: #333;
}

.traffic-alert-tip .owner {
    font-weight: bold;
    color: #CCC;
}

.traffic-alert-tip .time {
    font-weight: normal;
    font-size: 0.95em;
    color: #666;
}

.waze-type-POLICEMAN {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -287px -163px;
}

.waze-type-JAM {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -312px -163px;
}

.waze-type-WEATHERHAZARD {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -337px -163px;
}

.waze-type-ACCIDENT {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -362px -163px;
}

.waze-type-OTHER {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -387px -163px;
}

.waze-type-MISC {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -387px -163px;
}

.waze-type-CONSTRUCTION {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -387px -163px;
}

.map-tip .content {
    padding: 10px 15px;
    font-family: 'Montserrat';
}

.map-tip .tool-bar {
    padding: 10px 15px;
    font-family: 'Montserrat';
}

.map-tip a {
    text-decoration: none;
    color: #0074CC;
    font-size: 0.9em;
    margin: 0 5px 0 0;
}

    .map-tip a:hover {
        color: #333;
    }

.map-tip .see-address {
  text-decoration: none;
  color: #0074CC;
  font-size: 0.9em;
  margin: 0 5px 0 0;
  padding: 10px 15px;
  font-family: 'Montserrat';
  text-decoration: underline;
}

  .map-tip .see-address:hover {
    color: #333;
  }

  .map-tip .see-address .description {
    cursor: pointer;
  }

.map-tip .expand {
    font-size: 0.96em;
    font-weight: bold;
    text-align: right;
    margin-right: 10px;
}

    .map-tip .expand .show-more {
        background: url("https://images.geo-track.com/www/common/map-tip-show-more.png");
        width: 16px;
        height: 16px;
        display: inline-block;
        vertical-align: middle;
        cursor: pointer;
    }

.map-tip .collapse {
    font-size: 0.96em;
    font-weight: bold;
    text-align: right;
    margin-right: 10px;
}

    .map-tip .collapse .show-less {
        background: url("https://images.geo-track.com/www/common/map-tip-show-less.png");
        width: 16px;
        height: 16px;
        display: inline-block;
        vertical-align: middle;
        cursor: pointer;
    }

.map-tip .separate {
    border-bottom: 1px solid #CCC;
}

.contract-info-container {
    margin: 5px -7px -7px -7px;
    padding: 5px;
    font-size: 0.9em;
    background: #CCC;
    color: #333;
    overflow: auto;
}

    .contract-info-container .is-reaction.no {
        display: none;
    }

    .contract-info-container .is-reaction.yes {
        width: 18px;
        height: 15px;
        background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -126px -125px;
        display: block;
        float: right;
        margin-top: 2px;
        margin-right: 4px;
    }

    .contract-info-container span:hover {
        text-decoration: underline;
    }

#op-zone-dummies {
    display: none;
}

.zone-tip .name {
    color: #333;
    font-weight: bold;
    font-size: 1em;
}

.zone-tip .last-update-label {
    font-size: 0.9em;
    color: #666;
}

.zone-tip .last-update {
    font-size: 1.1em;
    display: block;
}

.zone-tip .owner-label {
    font-size: 0.9em;
}

.zone-tip .tip-tool-bar {
    margin-top: 5px;
}

.zone-tip a.edit {
    text-decoration: none;
    color: #0074CC;
    font-size: 0.9em;
    margin-right: 5px;
}

    .zone-tip a.edit:hover {
        color: #333;
    }

.zone-tip a.center-here {
    text-decoration: none;
    color: #0074CC;
    font-size: 0.9em;
}

    .zone-tip a.center-here:hover {
        color: #333;
    }

.zone-label {
    font-size: 9px;
    background: #0074CC;
    text-align: center;
    line-height: 18px;
    color: #FFF;
    border-radius: 3px;
    display: inline-block;
}

.device-label {
    font-size: 9px;
    background: #0074CC;
    text-align: center;
    line-height: 18px;
    color: #FFF;
    border-radius: 3px;
    display: inline-block;
    margin-top: 5px !important;
}

.device-label-online-plate {
    font-size: 9px;
    background: #0074CC;
    text-align: center;
    line-height: 18px;
    color: #FFF;
    border-radius: 3px;
    display: inline-block;
    margin-top: 5px !important;
    width: 70px !important;
}
/*#endregion*/
/*#region Online History Panel*/
#op-history-dummies {
    display: none;
}

#op-history {
    position: fixed;
    top: 137px;
    bottom: 29px;
    width: 320px;
    background-color: #FFF;
    overflow-x: hidden;
    overflow-y: hidden;
    z-index: 70;
    -webkit-box-shadow: 0 3px 20px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 3px 20px rgba(0, 0, 0, 0.25);
    box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.25);
    display: none;
}

    #op-history .type-selector {
        display: block;
        width: 100%;
        overflow-y: auto;
        overflow-x: hidden;
        position: relative;
        background-color: #FFF;
        padding: 5px;
        box-sizing: border-box;
    }

        #op-history .type-selector .rotator {
            position: relative;
            width: 100%;
            display: block;
            overflow: hidden;
        }

    #op-history .devices-container {
        width: 100%;
        display: block;
        text-align: center;
    }

    #op-history .toggler {
        width: 25px;
        height: 28px;
        display: block;
        cursor: pointer;
        float: left;
    }

        #op-history .toggler.d {
            background: #FEDFA7 url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -37 #56BAEC 3px -120px;
        }

        #op-history .toggler.c {
            background: #FDC255 url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -396px -120px;
        }

    #op-history .contracts-container {
        width: 294px;
        height: 28px;
        display: block;
        float: left;
        background: #FEDFA7;
        padding: 2px 0 2px 2px;
    }

    #op-history .contracts {
        width: 288px;
        margin: 1px auto 0 auto;
    }

    #op-history .devices {
        width: 100%;
        margin: 1px auto 0 auto;
        box-sizing: border-box;
    }

    #op-history .selector-container {
        background: #FFF;
        border-top: 1px solid #F2F2F2;
        border-bottom: 1px solid #F2F2F2;
    }

        #op-history .selector-container .time-selector {
            display: block;
            overflow: hidden;
            min-height: 28px;
        }

    #op-history .selector {
        min-height: 28px;
    }

    #op-history ul.selector {
        list-style: none;
        margin: 0;
        padding: 0;
        overflow: auto;
        float: left;
    }

        #op-history ul.selector li {
            list-style: none;
            display: block;
            float: left;
            padding: 0 5px;
            line-height: 28px;
            cursor: pointer;
            color: #666;
            min-height: 28px;
            font-size: 12px;
        }

            #op-history ul.selector li:hover {
                text-decoration: underline;
            }

            #op-history ul.selector li.selected {
                background-color: #F2F2F2;
                color: #666;
            }

                #op-history ul.selector li.selected:hover {
                    opacity: 1;
                }

    #op-history .query-button {
        float: right;
    }

        #op-history .query-button::after {
            content: "\f002";
            font-family: FontAwesome;
            position: relative;
            font-size: 18px;
            top: 4px;
            right: 10px;
            color: #666;
            cursor: pointer;
        }

        #op-history .query-button:hover {
            opacity: 0.6;
            filter: alpha(opacity=60);
        }

    #op-history .camera-button {
        float: right;
        background: url("https://images.geo-track.com/www/common/device-tool-bar.png?v=2.0.1.75") 0 -598px;
        width: 16px;
        height: 16px;
        padding: 0;
        display: inline-block;
        margin-right: 5px;
        margin-top: 9px;
        cursor: pointer;
    }

        #op-history .camera-button.selected {
            float: right;
            background: url("https://images.geo-track.com/www/common/device-tool-bar.png?v=2.0.1.75") 0 -480px;
        }

        #op-history .camera-button:hover {
            opacity: 0.6;
            filter: alpha(opacity=60);
        }

    #op-history .dates-label {
        font-size: 0.9em;
        display: inline-block;
        width: 70px;
        text-align: right;
    }

    #op-history .dates-input {
        width: 80px;
        text-align: center;
        font-size: 0.8em;
        cursor: pointer;
    }

    #op-history .dates {
        background: #F2F2F2;
        padding: 7px;
        display: none;
    }

        #op-history .dates .d1 {
            display: block;
        }

        #op-history .dates .d2 {
            margin-top: 5px;
            display: block;
        }

    #op-history .time-parts {
        font-size: 0.8em;
        width: 45px;
    }

    #op-history .playblack-control {
        display: none;
        background: #F2F2F2;
    }

        #op-history .playblack-control ul {
            list-style: none;
            list-style-type: none;
            padding: 0;
            margin: 0;
            display: block;
            overflow: auto;
        }

            #op-history .playblack-control ul li {
                float: left;
                width: 16px;
                height: 16px;
                line-height: 16px;
                cursor: pointer;
                margin: 4px;
            }

                #op-history .playblack-control ul li.play {
                    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -227px -15px;
                }

                #op-history .playblack-control ul li.pause {
                    display: none;
                    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -211px -15px;
                }

                #op-history .playblack-control ul li.stop {
                    display: none;
                    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -211px -31px;
                }

                #op-history .playblack-control ul li.x1 {
                    color: #333;
                }

                    #op-history .playblack-control ul li.x1.selected {
                        color: #000;
                        font-weight: bold;
                    }

                #op-history .playblack-control ul li.x2 {
                    color: #333;
                }

                    #op-history .playblack-control ul li.x2.selected {
                        color: #000;
                        font-weight: bold;
                    }

                #op-history .playblack-control ul li.x4 {
                    color: #333;
                }

                    #op-history .playblack-control ul li.x4.selected {
                        color: #000;
                        font-weight: bold;
                    }

    #op-history ul.detail {
        position: fixed;
        bottom: 29px;
        overflow-x: hidden;
        overflow-y: auto;
        width: 320px;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #op-history .item {
        margin: 10px;
        padding: 20px;
        cursor: pointer;
        -webkit-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
        -o-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
        box-shadow: 0 0px 9px 0 rgba(0, 0, 0, 0.1);
        background: #FFF;
        border-radius: 10px;
    }

        #op-history .item:hover {
            -webkit-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.2);
            -o-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.2);
            box-shadow: 0 0px 9px 0 rgba(0, 0, 0, 0.2);
        }

        #op-history .item.selected {
            background: #F2F2F2;
        }

            #op-history .item.selected > .sequence-label {
                /*color: @gray-color;*/
                font-weight: normal;
            }

            #op-history .item.selected > .address {
                /*color: @ultra-light-gray-color;*/
                font-weight: normal;
            }

            #op-history .item.selected > .message-time {
                /*color: @ultra-light-gray-color*/
                font-weight: normal;
            }

        #op-history .item .sequence-label {
            font-size: 1em;
            color: #7a2682;
        }

        #op-history .item .address {
            font-size: 0.9em;
            color: #333;
        }

        #op-history .item .message-time {
            font-size: 0.9em;
            font-weight: bold;
        }

        #op-history .item.exception {
            border-right: 7px solid #BD2C00;
        }

        #op-history .item.selected .alert {
            color: #666;
        }

        #op-history .item .alert {
            overflow: auto;
            margin: 5px 0;
        }

            #op-history .item .alert .message {
                float: left;
                padding-left: 5px;
                font-size: 0.85em;
                width: 200px;
            }

            #op-history .item .alert .icon {
                float: left;
                width: 24px;
                height: 24px;
                margin: 2px;
            }

.history-tip .sequence-label {
    font-size: 1em;
    color: #7a2682;
}

.history-tip .address {
    font-size: 0.9em;
    color: #333;
}

.history-tip .speed {
    font-size: 0.9em;
}

.history-tip .message-time {
    font-size: 0.9em;
    font-weight: bold;
}

.history-tip a.mark {
    text-decoration: none;
    color: #0074CC;
    font-size: 0.9em;
}

    .history-tip a.mark:hover {
        color: #333;
    }

.history-tip a.zone {
    margin-left: 5px;
    text-decoration: none;
    color: #0074CC;
    font-size: 0.9em;
}

    .history-tip a.zone:hover {
        color: #333;
    }

.history-tip .alert {
    overflow: auto;
    margin: 5px 0;
}

    .history-tip .alert .icon {
        float: left;
        width: 24px;
        height: 24px;
    }

    .history-tip .alert .message {
        float: left;
        padding-left: 5px;
        width: 170px;
        min-width: 170px;
        font-size: 0.95em;
    }
/*#endregion*/
/*#region Alerts*/
#op-alerts-dummies {
    display: none;
}

#op-alerts {
    position: fixed;
    top: 139px;
    bottom: 29px;
    width: 320px;
    overflow-x: hidden;
    overflow-y: hidden;
    z-index: 70;
    -webkit-box-shadow: 0 3px 20px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 3px 20px rgba(0, 0, 0, 0.25);
    box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.25);
    display: none;
    background-color: #FFF;
}

    #op-alerts .type-selector {
        display: block;
        width: 100%;
        overflow-y: auto;
        overflow-x: hidden;
        position: relative;
        box-sizing: border-box;
        padding: 5px;
    }

        #op-alerts .type-selector .rotator {
            position: relative;
            width: 100%;
            display: block;
            overflow: hidden;
        }

    #op-alerts .devices-container {
        width: 100%;
        display: block;
    }

    #op-alerts .toggler {
        width: 25px;
        height: 28px;
        display: block;
        cursor: pointer;
        float: left;
    }

        #op-alerts .toggler.d {
            background: #FEDFA7 url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -373px -120px;
        }

        #op-alerts .toggler.c {
            background: #FDC255 url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -396px -120px;
        }

    #op-alerts .contracts-container {
        width: 294px;
        height: 28px;
        display: block;
        float: left;
        background: #FEDFA7;
        padding: 2px 0 2px 2px;
    }

    #op-alerts .contracts {
        width: 288px;
        margin: 1px auto 0 auto;
    }

    #op-alerts .selector-container {
        background: #FEDFA7;
    }

    #op-alerts .selector {
        min-height: 28px;
    }

    #op-alerts .devices {
        width: 100%;
        margin: 1px auto 0 auto;
        border-box: 100%;
    }

    #op-alerts .options-container {
        border-top: 1px solid #F2F2F2;
        border-bottom: 1px solid #F2F2F2;
    }

        #op-alerts .options-container .count-message {
            color: #FFF;
        }

    #op-alerts .pager {
        display: none;
        padding: 5px;
        font-size: 0.9em;
        overflow: auto;
    }

        #op-alerts .pager a.previous-page {
            text-decoration: none;
            display: inline-block;
            margin-right: 5px;
            color: #0074CC;
        }

            #op-alerts .pager a.previous-page:hover {
                color: #333;
            }

        #op-alerts .pager a.next-page {
            text-decoration: none;
            display: inline-block;
            color: #0074CC;
        }

            #op-alerts .pager a.next-page:hover {
                color: #333;
            }

    #op-alerts ul.detail {
        position: fixed;
        bottom: 29px;
        overflow-x: hidden;
        overflow-y: auto;
        width: 320px;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #op-alerts .item {
        background: #FFF;
        padding: 20px;
        cursor: pointer;
        -webkit-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
        -o-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
        box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
        box-sizing: border-box;
        border-radius: 10px;
        margin: 10px;
        font-size: 12px;
    }

        #op-alerts .item.reviewed > .message {
            opacity: 0.75;
            filter: alpha(opacity=75);
        }

        #op-alerts .item:hover {
            -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
            -o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
            box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.35);
        }

        #op-alerts .item.selected {
            background: #333;
            color: #FFF;
        }

        #op-alerts .item .message {
            font-size: 1em;
            padding: 5px;
        }

        #op-alerts .item .priority {
            font-size: 0.8em;
            margin-right: 5px;
            padding: 1px 5px;
            background: #000;
            color: #FFF;
            border-radius: 5px;
        }

        #op-alerts .item .speed {
            font-size: 0.9em;
            padding: 0 5px;
        }

        #op-alerts .item .imei {
            font-size: 1em;
            padding: 5px 5px 0;
        }

        #op-alerts .item .message-time {
            font-size: 0.9em;
            padding: 0 5px;
        }

        #op-alerts .item .address {
            font-size: 0.9em;
            padding: 5px 5px 0;
        }

        #op-alerts .item .review-container {
            overflow: auto;
        }

            #op-alerts .item .review-container .do-review {
                margin: 0 5px 5px 0;
                display: block;
                float: right;
                background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -24px -157px;
                width: 16px;
                height: 15px;
                cursor: pointer;
            }

                #op-alerts .item .review-container .do-review:hover {
                    opacity: 0.75;
                    filter: alpha(opacity=75);
                }

            #op-alerts .item .review-container .update-review {
                margin: 0 5px 5px 0;
                display: block;
                float: right;
                background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -24px -157px;
                width: 16px;
                height: 15px;
                cursor: pointer;
                opacity: 0.25;
                filter: alpha(opacity=25);
            }

                #op-alerts .item .review-container .update-review:hover {
                    opacity: 0.5;
                    filter: alpha(opacity=50);
                }

        #op-alerts .item .automotor {
            font-size: 1em;
            padding: 0 5px 0 5px;
        }

.alert-tip .message {
    font-size: 1em;
    color: #7a2682;
}

.alert-tip .address {
    font-size: 0.9em;
    color: #333;
}

.alert-tip .message-time {
    font-size: 0.9em;
    font-weight: bold;
}

.alert-tip a.mark {
    text-decoration: none;
    color: #0074CC;
    font-size: 0.9em;
}

    .alert-tip a.mark:hover {
        color: #333;
    }

.alert-tip a.zone {
    margin-left: 5px;
    text-decoration: none;
    color: #0074CC;
    font-size: 0.9em;
}

    .alert-tip a.zone:hover {
        color: #333;
    }
/*#endregion*/
/*#region New Terms of Use*/
.new-terms-of-use .container {
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    left: 0;
    top: 105px;
    width: 430px;
    bottom: 28px;
    background: #FFF;
}

.new-terms-of-use .terms-of-use {
    overflow-x: hidden;
    overflow-y: scroll;
    position: fixed;
    left: 430px;
    top: 105px;
    bottom: 28px;
    background: #FFF;
}

    .new-terms-of-use .terms-of-use p {
        text-align: justify;
        margin: 10px 29px;
    }

    .new-terms-of-use .terms-of-use h4 {
        margin: 30px 10px;
        text-align: center;
    }

.new-terms-of-use form {
    margin: 0;
}

    .new-terms-of-use form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .new-terms-of-use form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .new-terms-of-use form .welcome {
        padding: 20px;
        font-size: 0.85em;
        background: #666;
        color: #FFF;
    }

.new-terms-of-use .warning {
    color: #333;
    font-size: 0.9em;
    padding: 15px;
    line-height: 11px;
    background: #FEDFA7;
    border-bottom: 1px solid #F2F2F2;
}

.new-terms-of-use form .sub {
    font-family: 'Montserrat';
    font-size: 1.25em;
    border-bottom: 1px solid #F2F2F2;
    font-weight: bold;
    max-width: 800px;
    padding: 0 0 5px 5px;
    margin-top: 20px;
}

.new-terms-of-use .time_zone_offset {
    margin: 10px 20px;
}
/*#endregion*/
/*#region First Time Login*/
.first-time-login .container {
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    left: 0;
    top: 105px;
    width: 430px;
    bottom: 28px;
    background: #FFF;
}

.first-time-login .terms-of-use {
    overflow-x: hidden;
    overflow-y: scroll;
    position: fixed;
    left: 430px;
    top: 105px;
    bottom: 28px;
    background: #FFF;
}

    .first-time-login .terms-of-use p {
        text-align: justify;
        margin: 10px 29px;
    }

    .first-time-login .terms-of-use h4 {
        margin: 30px 10px;
        text-align: center;
    }

.first-time-login form {
    margin: 0;
}

    .first-time-login form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .first-time-login form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .first-time-login form .welcome {
        padding: 20px;
        font-size: 0.85em;
        background: #666;
        color: #FFF;
    }

.first-time-login .warning {
    color: #333;
    font-size: 0.9em;
    padding: 15px;
    line-height: 11px;
    background: #FEDFA7;
    border-bottom: 1px solid #F2F2F2;
}

.first-time-login form .sub {
    font-family: 'Montserrat';
    font-size: 1.25em;
    border-bottom: 1px solid #F2F2F2;
    font-weight: bold;
    max-width: 800px;
    padding: 0 0 5px 5px;
    margin-top: 20px;
}

.first-time-login form .section {
    list-style: none;
    list-style-type: none;
    margin: 10px 0 20px 0;
    padding: 0;
}

    .first-time-login form .section li {
        margin: 0 20px;
        list-style: none;
    }

    .first-time-login form .section ul {
        margin: 0;
        padding: 0;
    }

        .first-time-login form .section ul li {
            margin: 0;
        }

            .first-time-login form .section ul li.label {
                color: #666;
                line-height: 22px;
                font-size: 0.92em;
            }

            .first-time-login form .section ul li.input-container {
                display: inline-block;
            }

            .first-time-login form .section ul li .input {
                border: 1px solid #CCC;
                height: 21px;
                max-width: 350px;
                padding: 0 2px;
            }

                .first-time-login form .section ul li .input.required {
                    border: 2px solid #56BAEC;
                }
/*#endregion*/
/*#region My Account*/
.my-account.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.my-account form {
    margin: 20px 30px;
}

    .my-account form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .my-account form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .my-account form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

    .my-account form .section {
        list-style: none;
        list-style-type: none;
        margin: 10px 0;
        padding: 0;
    }

        .my-account form .section li {
            margin: 0 0 5px 0;
        }

        .my-account form .section ul li {
            margin: 0;
        }

            .my-account form .section ul li.label {
                color: #666;
                width: 250px;
                margin-right: 10px;
                text-align: right;
                line-height: 22px;
                display: inline-block;
                vertical-align: top;
                font-size: 0.92em;
            }

            .my-account form .section ul li.input-container {
                display: inline-block;
            }

            .my-account form .section ul li .input {
                border: 1px solid #CCC;
                height: 21px;
                padding: 0 2px;
            }

                .my-account form .section ul li .input.required {
                    border: 2px solid #56BAEC;
                }

.my-account .phone-input .model-property-name {
    display: none;
}

.my-account .date-picker {
    cursor: pointer;
}

.my-account .warning {
    color: #333;
    font-size: 0.9em;
    padding: 5px;
    line-height: 11px;
    background: #FEDFA7;
}
/*#endregion*/
/*#region Settings Common*/
#header-tip {
    display: none;
}

.settings-grid {
    min-width: 700px !important;
    min-height: 350px !important;
    font-size: 0.9em !important;
}

    .settings-grid .action {
        text-decoration: none;
        color: #7a2682;
    }

        .settings-grid .action:hover {
            text-decoration: underline;
        }

    .settings-grid .search-selector {
        display: inline;
        margin: 0;
        padding: 0;
        list-style: none;
    }

        .settings-grid .search-selector li {
            cursor: pointer;
            float: left;
            list-style: none;
            margin: 0;
            border: 1px solid #CCC;
            background: #CCC;
            color: #FFF;
            padding: 6px 10px;
        }

            .settings-grid .search-selector li.selected {
                border: 1px solid #666;
                background: #666;
                cursor: default;
            }

            .settings-grid .search-selector li:first-child {
                border-radius: 5px 0 0 5px;
            }

            .settings-grid .search-selector li:last-child {
                border-radius: 0 5px 5px 0;
            }
/*#endregion*/
/*#region Settings Menu*/
.settings-menu.tabs {
    padding: 20px 0 0 0;
    border-bottom: 1px solid #CCC;
    font-size: 12px;
}

    .settings-menu.tabs ul {
        list-style-type: none;
        list-style: none;
        padding: 0;
        margin: 0 0 0 20px;
    }

        .settings-menu.tabs ul li {
            display: inline-block;
            padding: 7px 15px;
            font-size: 1.1em;
        }

            .settings-menu.tabs ul li.selected {
                margin-bottom: -2px;
                display: inline-block;
                border-bottom: 1px solid #FFF;
                font-family: 'Montserrat';
                cursor: default;
                background: #FFF;
                border-left: 1px solid #CCC;
                border-top: 1px solid #CCC;
                border-right: 1px solid #CCC;
                border-radius: 5px 5px 0 0;
            }

                .settings-menu.tabs ul li.selected a {
                    color: #000;
                    cursor: default;
                }

                    .settings-menu.tabs ul li.selected a:hover {
                        text-decoration: none;
                        color: #000;
                    }

            .settings-menu.tabs ul li a {
                text-decoration: none;
                color: #666;
            }

                .settings-menu.tabs ul li a:hover {
                    color: #333;
                    text-decoration: underline;
                }
/*#endregion*/
/*#region Landmarks*/
.landmarks.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.landmarks form {
    margin: 20px;
}

    .landmarks form .toolbar {
        margin: 5px 0;
    }

    .landmarks form .filter-container {
        background: #FFF;
        border: 1px solid #CCC;
        display: inline-block;
        margin-left: 5px;
    }

    .landmarks form .filter-input {
        padding: 5px;
        margin: 0 0 0 3px;
        width: 153px;
        border: 1px solid #FFF;
    }

    .landmarks form .filter-date-input {
        padding: 5px;
        margin: 0 0 0 1px;
        width: 69px;
        border: 1px solid #FFF;
        cursor: pointer;
        text-align: center;
        background: #F2F2F2;
        border-radius: 5px;
    }

    .landmarks form .assign-group {
        width: 100px;
        height: 30px;
        background: #CCC;
        display: inline-block;
    }

    .landmarks form .group {
        background: #F2F2F2;
        color: #333;
        border-radius: 10px;
        padding: 0 10px;
        display: inline-block;
        font-size: 0.9em;
    }

    .landmarks form .name {
        padding-left: 10px;
    }

.landmarks .group-selector {
    padding: 0;
    background: #FFF;
    display: none;
    width: 260px;
    overflow: hidden;
    position: absolute;
    top: 45px;
    left: 4px;
    z-index: 500;
    border: 1px solid #CCC;
    border-radius: 3px;
}

    .landmarks .group-selector ul {
        list-style: none;
        list-style-type: none;
        margin: 0;
        padding: 0;
        max-height: 220px;
        overflow-x: hidden;
        overflow-y: auto;
    }

        .landmarks .group-selector ul li {
            padding: 7px;
            cursor: pointer;
        }

            .landmarks .group-selector ul li:hover {
                background: #F2F2F2;
            }

            .landmarks .group-selector ul li a {
                float: right;
                margin-left: 5px;
            }

                .landmarks .group-selector ul li a.edit {
                    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -293px -95px no-repeat;
                    width: 16px;
                    height: 16px;
                    display: inline-block;
                }

                    .landmarks .group-selector ul li a.edit:hover {
                        opacity: 0.85;
                    }

                .landmarks .group-selector ul li a.delete {
                    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -312px -95px no-repeat;
                    width: 16px;
                    height: 16px;
                    display: inline-block;
                }

                    .landmarks .group-selector ul li a.delete:hover {
                        opacity: 0.85;
                    }

    .landmarks .group-selector .filter {
        width: 241px;
        margin: 5px;
        border: 1px solid #CCC;
        padding: 4px;
    }

    .landmarks .group-selector .new-group {
        background: #FFF;
        padding: 4px 10px;
        border-top: 1px solid #F2F2F2;
    }

        .landmarks .group-selector .new-group a {
            text-decoration: none;
            color: #0074CC;
        }

            .landmarks .group-selector .new-group a:hover {
                color: #666;
            }

    .landmarks .group-selector .remove-from-group {
        background: #FFF;
        padding: 4px 10px;
        border-bottom: 1px solid #F2F2F2;
    }

        .landmarks .group-selector .remove-from-group a {
            text-decoration: none;
            color: #333;
        }

            .landmarks .group-selector .remove-from-group a:hover {
                color: #666;
            }

    .landmarks .group-selector .cancel {
        background: #FFF;
        padding: 5px 10px;
    }

        .landmarks .group-selector .cancel a {
            text-decoration: none;
            color: #666;
        }

            .landmarks .group-selector .cancel a:hover {
                color: #333;
            }

.landmark.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 158px;
    bottom: 27px;
    width: 470px;
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.25);
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.25);
    z-index: 41;
}

.landmark.map {
    width: 800px;
    position: fixed;
    top: 158px;
    bottom: 27px;
    left: 470px;
    background: #FFF;
    z-index: 40;
}

.landmark form {
    margin: 10px;
}

    .landmark form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .landmark form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .landmark form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

.landmark ul.horizontal-list > li {
    display: inline;
}

.landmark .timer {
    border: none !important;
    cursor: pointer;
    color: #FFF;
    background: #7a2682;
    border-radius: 5px;
    text-align: center;
    padding: 2px 0;
    font-size: 0.9em;
}

.landmark ul.horizontal-list {
    font-size: 0.95em;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.landmark form .section {
    list-style: none;
    list-style-type: none;
    margin: 10px 0 0 10px;
    padding: 0;
}

    .landmark form .section li {
        margin: 0 0 5px 0;
    }

    .landmark form .section ul {
        margin: 0;
        padding: 0;
    }

        .landmark form .section ul li {
            margin: 0;
        }

            .landmark form .section ul li.label {
                color: #666;
                width: 80px;
                margin-right: 10px;
                text-align: right;
                line-height: 22px;
                display: inline-block;
                vertical-align: top;
                font-size: 0.92em;
            }

            .landmark form .section ul li.input-container {
                display: inline-block;
            }

            .landmark form .section ul li .input {
                border: 1px solid #CCC;
                height: 21px;
                max-width: 350px;
                padding: 0 2px;
            }

                .landmark form .section ul li .input.required {
                    border: 2px solid #56BAEC;
                }

            .landmark form .section ul li.option {
                color: #666;
                width: 20px;
                margin-right: 10px;
                text-align: right;
                line-height: 22px;
                display: inline-block;
                vertical-align: top;
                font-size: 0.92em;
            }

            .landmark form .section ul li.hint {
                display: inline-block;
                font-size: 0.85em;
                width: 350px;
            }

.landmark form .draw-landmark {
    background: url("https://images.geo-track.com/www/common/map-tool-bar.png?v=2.0.1.72") -135px 0;
    width: 27px;
    height: 25px;
}

.landmark form .colors {
    list-style: none;
    list-style-type: none;
    padding: 0;
    margin: 0;
    overflow: auto;
}

    .landmark form .colors li {
        list-style: none;
        list-style-type: none;
        padding: 0;
        margin: 0;
        float: left;
    }

.landmark form .group {
    background: #F2F2F2;
    color: #333;
    border-radius: 10px;
    padding: 3px 10px;
    display: inline-block;
    font-size: 0.95em;
}

.landmark .warning {
    color: #333;
    font-size: 0.9em;
    padding: 5px;
    line-height: 11px;
    background: #FEDFA7;
}

.c-1 {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -290px -60px;
    width: 22px;
    height: 31px;
}

.c-2 {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -312px -60px;
    width: 22px;
    height: 31px;
}

.c-3 {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -334px -60px;
    width: 22px;
    height: 31px;
}

.c-4 {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -357px -60px;
    width: 22px;
    height: 31px;
}

.c-5 {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -379px -60px;
    width: 22px;
    height: 31px;
}

.c-6 {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -401px -60px;
    width: 22px;
    height: 31px;
}

.c-7 {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -423px -60px;
    width: 22px;
    height: 31px;
}

.c-8 {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -445px -60px;
    width: 22px;
    height: 31px;
}

.c-9 {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -467px -60px;
    width: 22px;
    height: 31px;
}

.c-10 {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -489px -60px;
    width: 22px;
    height: 31px;
}
/*#endregion*/
/*#region Zones*/
.polygon-vertex {
    width: 4px;
    height: 4px;
    border: 1px solid #CCC;
    background: #FFF;
    border-radius: 5px;
}

.zones.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.zones form {
    margin: 20px;
}

    .zones form .toolbar {
        margin: 5px 0;
    }

    .zones form .filter-container {
        background: #FFF;
        border: 1px solid #CCC;
        display: inline-block;
        margin-left: 5px;
    }

    .zones form .filter-input {
        padding: 5px;
        margin: 0 0 0 3px;
        width: 153px;
        border: 1px solid #FFF;
    }

    .zones form .filter-date-input {
        padding: 5px;
        margin: 0 0 0 1px;
        width: 69px;
        border: 1px solid #FFF;
        cursor: pointer;
        text-align: center;
        background: #F2F2F2;
        border-radius: 5px;
    }

    .zones form .assign-group {
        width: 100px;
        height: 30px;
        background: #CCC;
        display: inline-block;
    }

    .zones form .group {
        background: #F2F2F2;
        color: #333;
        border-radius: 10px;
        padding: 0 10px;
        display: inline-block;
        font-size: 0.9em;
    }

.zones .group-selector {
    padding: 0;
    background: #FFF;
    display: none;
    width: 260px;
    overflow: hidden;
    position: absolute;
    top: 45px;
    left: 4px;
    z-index: 500;
    border: 1px solid #CCC;
    border-radius: 3px;
}

    .zones .group-selector ul {
        list-style: none;
        list-style-type: none;
        margin: 0;
        padding: 0;
        max-height: 220px;
        overflow-x: hidden;
        overflow-y: auto;
    }

        .zones .group-selector ul li {
            padding: 7px;
            cursor: pointer;
        }

            .zones .group-selector ul li:hover {
                background: #F2F2F2;
            }

            .zones .group-selector ul li a {
                float: right;
                margin-left: 5px;
            }

                .zones .group-selector ul li a.edit {
                    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -293px -95px no-repeat;
                    width: 16px;
                    height: 16px;
                    display: inline-block;
                }

                    .zones .group-selector ul li a.edit:hover {
                        opacity: 0.85;
                    }

                .zones .group-selector ul li a.delete {
                    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -312px -95px no-repeat;
                    width: 16px;
                    height: 16px;
                    display: inline-block;
                }

                    .zones .group-selector ul li a.delete:hover {
                        opacity: 0.85;
                    }

    .zones .group-selector .filter {
        width: 241px;
        margin: 5px;
        border: 1px solid #CCC;
        padding: 4px;
    }

    .zones .group-selector .new-group {
        background: #FFF;
        padding: 4px 10px;
        border-top: 1px solid #F2F2F2;
    }

        .zones .group-selector .new-group a {
            text-decoration: none;
            color: #0074CC;
        }

            .zones .group-selector .new-group a:hover {
                color: #666;
            }

    .zones .group-selector .remove-from-group {
        background: #FFF;
        padding: 4px 10px;
        border-bottom: 1px solid #F2F2F2;
    }

        .zones .group-selector .remove-from-group a {
            text-decoration: none;
            color: #333;
        }

            .zones .group-selector .remove-from-group a:hover {
                color: #666;
            }

    .zones .group-selector .cancel {
        background: #FFF;
        padding: 5px 10px;
    }

        .zones .group-selector .cancel a {
            text-decoration: none;
            color: #666;
        }

            .zones .group-selector .cancel a:hover {
                color: #333;
            }

.zone.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 158px;
    bottom: 27px;
    width: 470px;
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.25);
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.25);
    z-index: 41;
}

.zone.map {
    width: 800px;
    position: fixed;
    top: 158px;
    bottom: 27px;
    left: 470px;
    background: #FFF;
    z-index: 40;
}

.zone form {
    margin: 10px;
}

    .zone form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .zone form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .zone form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

    .zone form .section {
        list-style: none;
        list-style-type: none;
        margin: 10px 0 0 10px;
        padding: 0;
    }

        .zone form .section li {
            margin: 0 0 5px 0;
        }

        .zone form .section ul {
            margin: 0;
            padding: 0;
        }

            .zone form .section ul li {
                margin: 0;
            }

                .zone form .section ul li.label {
                    color: #666;
                    width: 80px;
                    margin-right: 10px;
                    text-align: right;
                    line-height: 22px;
                    display: inline-block;
                    vertical-align: top;
                    font-size: 0.92em;
                }

                .zone form .section ul li.input-container {
                    display: inline-block;
                }

                .zone form .section ul li .input {
                    border: 1px solid #CCC;
                    height: 21px;
                    max-width: 350px;
                    padding: 0 2px;
                }

                    .zone form .section ul li .input.required {
                        border: 2px solid #56BAEC;
                    }

                .zone form .section ul li.option {
                    color: #666;
                    width: 20px;
                    margin-right: 10px;
                    text-align: right;
                    line-height: 22px;
                    display: inline-block;
                    vertical-align: top;
                    font-size: 0.92em;
                }

                .zone form .section ul li.hint {
                    display: inline-block;
                    font-size: 0.85em;
                    width: 350px;
                }

    .zone form .draw-zone-on-landmark {
        background: url("https://images.geo-track.com/www/common/map-tool-bar.png?v=2.0.1.72") -162px 0;
        width: 27px;
        height: 25px;
    }

    .zone form .draw-zone {
        background: url("https://images.geo-track.com/www/common/map-tool-bar.png?v=2.0.1.72") -216px 0;
        width: 27px;
        height: 25px;
    }

    .zone form .edit-zone {
        background: url("https://images.geo-track.com/www/common/map-tool-bar.png?v=2.0.1.72") -243px 0;
        width: 27px;
        height: 25px;
    }

    .zone form .move-zone {
        background: url("https://images.geo-track.com/www/common/map-tool-bar.png?v=2.0.1.72") -270px 0;
        width: 27px;
        height: 25px;
    }

    .zone form .route-again {
        background: url("https://images.geo-track.com/www/common/map-tool-bar.png?v=2.0.1.72") -405px 0;
        width: 27px;
        height: 25px;
    }

.zone .warning {
    color: #333;
    font-size: 0.9em;
    padding: 5px;
    line-height: 11px;
    background: #FEDFA7;
}

#zone-collision-tip {
    padding: 10px;
    font-size: 0.9em;
}
/*#endregion*/
/*#region Devices */
.devices.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
    margin-top: 0.2em !important;
}

.devices form {
    margin: 20px;
}

    .devices form .toolbar {
        margin: 5px 0;
    }

    .devices form .filter-container {
        background: #FFF;
        border: 1px solid #CCC;
        display: inline-block;
        margin-left: 5px;
    }

    .devices form .filter-input {
        padding: 5px;
        margin: 0 0 0 3px;
        width: 153px;
        border: 1px solid #FFF;
    }

    .devices form .alias {
        font-size: 1.2em;
        padding-left: 10px;
        margin-bottom: 5px;
    }

    .devices form .overview {
        line-height: 13px;
        padding: 0 10px 5px 10px;
    }

    .devices form .assigned-drivers .label {
        color: #0074CC;
    }

    .devices form .group {
        background: #F2F2F2;
        color: #333;
        border-radius: 10px;
        padding: 0 10px;
        display: inline-block;
        font-size: 0.9em;
        margin-bottom: 2px;
        float: right;
    }

.devices .group-selector {
    padding: 0;
    background: #FFF;
    display: none;
    width: 260px;
    overflow: hidden;
    position: absolute;
    top: 45px;
    left: 4px;
    z-index: 500;
    border: 1px solid #CCC;
    border-radius: 3px;
}

    .devices .group-selector ul {
        list-style: none;
        list-style-type: none;
        margin: 0;
        padding: 0;
        max-height: 220px;
        overflow-x: hidden;
        overflow-y: auto;
    }

        .devices .group-selector ul li {
            padding: 7px;
            cursor: pointer;
        }

            .devices .group-selector ul li:hover {
                background: #F2F2F2;
            }

            .devices .group-selector ul li a {
                float: right;
                margin-left: 5px;
            }

                .devices .group-selector ul li a.edit {
                    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -293px -95px no-repeat;
                    width: 16px;
                    height: 16px;
                    display: inline-block;
                }

                    .devices .group-selector ul li a.edit:hover {
                        opacity: 0.85;
                    }

                .devices .group-selector ul li a.delete {
                    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -312px -95px no-repeat;
                    width: 16px;
                    height: 16px;
                    display: inline-block;
                }

                    .devices .group-selector ul li a.delete:hover {
                        opacity: 0.85;
                    }

    .devices .group-selector .filter {
        width: 241px;
        margin: 5px;
        border: 1px solid #CCC;
        padding: 4px;
    }

    .devices .group-selector .new-group {
        background: #FFF;
        padding: 4px 10px;
        border-top: 1px solid #F2F2F2;
    }

        .devices .group-selector .new-group a {
            text-decoration: none;
            color: #0074CC;
        }

            .devices .group-selector .new-group a:hover {
                color: #666;
            }

    .devices .group-selector .remove-from-group {
        background: #FFF;
        padding: 4px 10px;
        border-bottom: 1px solid #F2F2F2;
    }

        .devices .group-selector .remove-from-group a {
            text-decoration: none;
            color: #333;
        }

            .devices .group-selector .remove-from-group a:hover {
                color: #666;
            }

    .devices .group-selector .cancel {
        background: #FFF;
        padding: 5px 10px;
    }

        .devices .group-selector .cancel a {
            text-decoration: none;
            color: #666;
        }

            .devices .group-selector .cancel a:hover {
                color: #333;
            }

.device.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.device form {
    margin: 20px 30px;
}

    .device form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .device form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .device form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

    .device form .section {
        list-style: none;
        list-style-type: none;
        margin: 10px 0;
        padding: 0;
    }

        .device form .section li {
            margin: 0 0 5px 0;
            background-image: none;
        }

        .device form .section ul li {
            margin: 0;
        }

            .device form .section ul li.label {
                color: #666;
                width: 250px;
                margin-right: 10px;
                text-align: right;
                line-height: 22px;
                display: inline-block;
                vertical-align: top;
                font-size: 0.92em;
            }

            .device form .section ul li.input-container {
                display: inline-block;
            }

            .device form .section ul li .input {
                border: 1px solid #CCC;
                height: 21px;
                max-width: 350px;
                padding: 0 2px;
                float: left;
            }

                .device form .section ul li .input.required {
                    border: 2px solid #56BAEC;
                }

        .device form .section ul.security-section {
            padding-left: 300px;
        }

        .device form .section .new-odometer-save {
            display: inline-block;
            border-radius: 10px;
            cursor: pointer;
            width: 120px;
            height: 23px;
            line-height: 23px;
            text-align: center;
            background: #0074CC;
            color: #FFF;
            font-size: 0.9em;
        }

.device .device-types {
    list-style-type: none;
    list-style: none;
    margin: 20px 0 0 0;
    padding: 0;
    width: 500px;
    overflow: hidden;
}

    .device .device-types li {
        float: left;
        width: 125px;
        height: 80px;
        text-align: center;
        display: block;
        font-size: 0.9em;
    }

        .device .device-types li div {
            width: 37px;
            height: 33px;
            margin: 0 auto;
        }

.device .imei {
    font-size: 1.4em;
}

.device .group {
    font-size: 0.7em;
}

.device .model {
    color: #666;
    margin-bottom: 5px;
}

.device .date-picker {
    cursor: pointer;
    border: none;
    background: #CCC;
    border-radius: 5px;
    text-align: center;
    padding: 2px 0;
    font-size: 0.9em;
}

.device .command {
    color: #FFF;
    line-height: 22px;
    display: inline-block;
    vertical-align: top;
    font-size: 0.85em;
    text-decoration: none;
    background: #7a2682;
    padding: 0 10px;
    border-radius: 10px;
}

    .device .command:hover {
        background: #CCC;
        color: #333;
    }

.device .sending-command {
    color: #333;
    line-height: 22px;
    display: inline-block;
    vertical-align: top;
    font-size: 0.85em;
    text-decoration: none;
    background: #CCC;
    padding: 0 10px;
    border-radius: 10px;
}

.device .command-sent {
    color: #FFF;
    line-height: 22px;
    display: inline-block;
    vertical-align: top;
    font-size: 0.85em;
    text-decoration: none;
    background: #333;
    padding: 0 10px;
    border-radius: 10px;
}

.device .command-time-out {
    color: #FFF;
    line-height: 13px;
    display: inline-block;
    vertical-align: top;
    font-size: 0.85em;
    text-decoration: none;
    background: #FF4D4D;
    padding: 3px 10px;
    border-radius: 10px;
    width: 390px;
}

.device .warning {
    color: #333;
    font-size: 0.9em;
    padding: 5px;
    line-height: 11px;
    background: #FEDFA7;
}

.device .k-slider-horizontal {
    float: left;
    width: 350px;
    height: 26px;
    margin-right: 10px;
}

.device #cylinder_capacity_value_msg {
    float: left;
    font-size: 0.85em;
    color: #ED1C24;
    width: auto;
}

.device #fuel_average_consumption_value_msg {
    float: left;
    font-size: 0.85em;
    color: #ED1C24;
    width: auto;
}

.device .block-command {
    background-color: #1C9F22;
}
/*#endregion*/
/*#region Receiving Users*/
.receiving-users.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.receiving-users form {
    margin: 20px;
}

    .receiving-users form .toolbar {
        margin: 5px 0;
    }

    .receiving-users form .filter-container {
        background: #FFF;
        border: 1px solid #CCC;
        display: inline-block;
        margin-left: 5px;
    }

    .receiving-users form .filter-input {
        padding: 5px;
        margin: 0 0 0 3px;
        width: 153px;
        border: 1px solid #FFF;
    }

.receiving-user.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.receiving-user form {
    margin: 20px 30px;
}

    .receiving-user form .edit-my-account a {
        text-decoration: none;
        color: #333;
        font-size: 0.9em;
    }

        .receiving-user form .edit-my-account a:hover {
            color: #333;
            text-decoration: underline;
        }

    .receiving-user form .full-name {
        font-size: 1.2em;
        line-height: 17px;
    }

    .receiving-user form .email a {
        text-decoration: none;
        color: #0074CC;
        font-size: 0.9em;
    }

    .receiving-user form .mobile-number {
        color: #666;
        font-size: 0.9em;
    }

    .receiving-user form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .receiving-user form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .receiving-user form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

    .receiving-user form .devices {
        margin: 15px 15px;
        border: 1px solid #CCC;
        width: 590px;
        padding: 5px;
    }

        .receiving-user form .devices ul {
            list-style: none;
            list-style-type: none;
            margin: 0;
            padding: 0;
            overflow: auto;
            width: 580px;
        }

        .receiving-user form .devices .h {
            background: #333;
            padding: 5px;
        }

            .receiving-user form .devices .h li {
                float: left;
                width: 100px;
                text-align: center;
                color: #FFF;
            }

                .receiving-user form .devices .h li:first-child {
                    width: 20px;
                }

                    .receiving-user form .devices .h li:first-child input[type='checkbox'] {
                        margin: 0;
                    }

                .receiving-user form .devices .h li.a {
                    text-align: left;
                    width: 250px;
                    line-height: 17px;
                }

        .receiving-user form .devices .g {
            background: #CCC;
            padding: 5px;
        }

            .receiving-user form .devices .g li {
                float: left;
                width: 100px;
                text-align: center;
                color: #FFF;
            }

                .receiving-user form .devices .g li:first-child {
                    width: 20px;
                }

                    .receiving-user form .devices .g li:first-child input[type='checkbox'] {
                        margin: 0;
                    }

            .receiving-user form .devices .g input[type='checkbox'] {
                margin: 0;
            }

            .receiving-user form .devices .g li.a {
                text-align: left;
                width: 250px;
                line-height: 17px;
            }

        .receiving-user form .devices .i {
            background: #FFF;
            padding: 2px 5px;
            border-bottom: 1px solid #FFF;
        }

            .receiving-user form .devices .i li {
                float: left;
                width: 100px;
                text-align: center;
            }

                .receiving-user form .devices .i li:first-child {
                    width: 20px;
                    height: 1px;
                }

                .receiving-user form .devices .i li.a {
                    text-align: left;
                    width: 250px;
                }

    .receiving-user form .section {
        list-style: none;
        list-style-type: none;
        margin: 10px 0;
        padding: 0;
    }

        .receiving-user form .section li {
            margin: 0 0 5px 0;
        }

        .receiving-user form .section ul li {
            margin: 0;
        }

            .receiving-user form .section ul li.label {
                color: #666;
                width: 250px;
                margin-right: 10px;
                text-align: right;
                line-height: 22px;
                display: inline-block;
                vertical-align: top;
                font-size: 0.92em;
            }

            .receiving-user form .section ul li.input-container {
                display: inline-block;
            }

            .receiving-user form .section ul li .input {
                border: 1px solid #CCC;
                height: 21px;
                max-width: 350px;
                padding: 0 2px;
            }

                .receiving-user form .section ul li .input.required {
                    border: 2px solid #56BAEC;
                }

.receiving-user .phone-input .model-property-name {
    display: none;
}

.receiving-user .warning {
    color: #333;
    font-size: 0.9em;
    padding: 5px;
    line-height: 11px;
    background: #FEDFA7;
}

.receiving-user .features {
    margin: 10px 20px 20px 20px;
    font-size: 0.9em;
}

    .receiving-user .features ul.h {
        display: block;
        overflow: auto;
        font-weight: bold;
        margin-bottom: 5px;
    }

        .receiving-user .features ul.h li {
            float: left;
        }

            .receiving-user .features ul.h li:first-child {
                width: 250px;
            }

            .receiving-user .features ul.h li.r {
                float: left;
                width: 60px;
                display: inline-block;
            }

            .receiving-user .features ul.h li.w {
                float: left;
                width: 60px;
                display: inline-block;
            }

    .receiving-user .features ul {
        list-style: none;
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

        .receiving-user .features ul li span {
            width: 250px;
            display: inline-block;
        }

        .receiving-user .features ul.i .r {
            width: 60px;
            display: inline-block;
        }

        .receiving-user .features ul.i .w {
            width: 60px;
            display: inline-block;
        }

.receiving-user .security {
    margin-right: 10px;
    font-size: 0.92em;
    color: #666;
}

    .receiving-user .security .security-option {
        padding-left: 0;
        display: inline-block;
    }

    .receiving-user .security ul {
        list-style: none;
    }

    .receiving-user .security .section li .label {
        display: inline-block;
        margin: 3px 3px 3px 4px;
        font-size: 1em;
    }

    .receiving-user .security ul .label {
        display: inline-block;
        margin: 3px 3px 3px 4px;
    }

    .receiving-user .security ul .container {
        display: inline-block;
    }

.input-disabled {
    border: 1px solid #CCC;
    background-color: #F2F2F2;
}

.receiving-user .gates {
    margin: 10px 20px 20px 20px;
    font-size: 0.9em;
}

    .receiving-user .gates ul.h {
        display: block;
        overflow: auto;
        font-weight: bold;
        margin-bottom: 5px;
    }

        .receiving-user .gates ul.h li {
            float: left;
        }

            .receiving-user .gates ul.h li:first-child {
                width: 250px;
            }

            .receiving-user .gates ul.h li.r {
                float: left;
                width: 60px;
                display: inline-block;
            }

            .receiving-user .gates ul.h li.w {
                float: left;
                width: 60px;
                display: inline-block;
            }

            .receiving-user .gates ul.h li.layout {
                float: left;
                width: 60px;
                display: inline-block;
                text-align: right;
            }

    .receiving-user .gates ul {
        list-style: none;
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

        .receiving-user .gates ul li span {
            width: 250px;
            display: inline-block;
        }

        .receiving-user .gates ul.i .r {
            width: 60px;
            display: inline-block;
        }

        .receiving-user .gates ul.i .w {
            width: 60px;
            display: inline-block;
        }

        .receiving-user .gates ul.i .layout {
            width: 60px;
            display: inline-block;
            text-align: right;
        }

.user-devices-container {
    padding: 5px;
    height: 400px;
    min-height: 220px;
    display: block;
}

#device-list-container {
    padding: 5px;
    height: 190px;
    width: 100%;
}

#device-list {
    padding: 5px;
    height: 190px;
    width: 580px;
    float: left;
}

.receiving-user form .active-devices {
    margin: 5px 15px 5px 10px;
    border: 1px solid #CCC;
    width: 550px;
    height: 150px;
    overflow: auto;
    padding: 5px;
}

.receiving-user form .user-devices-container.devices {
    margin: 15px 15px;
    border: 1px solid #CCC;
    width: 590px;
    height: 150px;
    padding: 5px;
    overflow: auto;
}

.receiving-user form .input-list-container {
    margin: 10px 15px;
    border: 1px solid #CCC;
    width: 430px;
    height: 150px;
    padding: 5px;
    float: left;
}

.receiving-user .input-list {
    border: 2px solid #56BAEC;
    border-radius: 0;
    margin: 5px;
}

.receiving-user .user-devices-container .head {
    background-color: #333;
    padding: 5px;
    color: #FFF;
    margin: 0 0 2px 0;
    text-align: center;
}

.selected-devices-container {
    height: 150px;
    width: 280px;
    float: left;
    padding: 5px;
    margin: 10px 15px;
    border: 1px solid #CCC;
}

.user-devices-container .configuration {
    display: none;
    width: 100%;
}

.unit-alert-configuration {
    height: 150px;
    width: 550px;
    padding: 5px;
    margin: 30px 20px;
    overflow: auto;
    font-size: 0.85em;
    border: 1px solid #CCC;
}

    .unit-alert-configuration table {
        width: 100%;
    }

        .unit-alert-configuration table thead {
            background-color: #CCC;
            color: #FFF;
        }

            .unit-alert-configuration table thead tr th:first-child {
                width: 70%;
            }

        .unit-alert-configuration table tbody tr {
            background-color: #F2F2F2;
            color: #333;
            padding-left: 5px;
        }

            .unit-alert-configuration table tbody tr td {
                padding-left: 5px;
                border-radius: 3px;
            }

                .unit-alert-configuration table tbody tr td.send-mail {
                    text-align: center;
                }

.user-devices-container .token-input-list {
    border: 2px solid #56BAEC;
    border-radius: 0;
    padding: 0;
    margin: 5px 2px;
    width: 425px;
    overflow-y: auto;
    max-height: 70px;
}

.user-devices-container li.token-input-token {
    font-size: 0.9em;
}

.user-devices-container .token-input-dropdown {
    width: 420px;
}

.active-devices ul {
    list-style: none;
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: auto;
}

    .active-devices ul li {
        display: block;
        float: left;
        margin-right: 5px;
        margin-bottom: 3px;
        padding-left: 5px;
        background: #F2F2F2;
        color: #333;
        width: 98%;
        min-width: 350px;
        border-radius: 3px;
        font-size: 0.85em;
        text-align: left;
    }

        .active-devices ul li:hover {
            cursor: pointer;
            background: #CCC;
            color: #FFF;
        }

.user-devices-container .active-devices .selected {
    background: #333;
    color: #FFF;
}

.active-devices .active-device {
    background: #CCC;
    color: #FFF;
}

.active-devices .active-group {
    background: #F2F2F2;
    color: #333;
}

.active-devices .inactivate-button {
    cursor: pointer;
    padding: 0 4px 1px 4px;
    background: #666;
    color: #FFF;
    display: inline-block;
    font-size: 0.8em;
    border-radius: 4px;
    font-weight: bold;
    float: right;
    height: 13px;
    margin: 1px 1px 1px 0;
    border: 1px solid #666;
    line-height: 13px;
}

    .active-devices .inactivate-button:hover {
        background: #F2F2F2;
        color: #333;
    }

.unit-alert-configuration .all-alerts-settings {
    margin-left: 5px;
    vertical-align: middle;
}

#add-devices {
    float: right;
    margin: 0 8px;
}
/*#endregion*/
/*#region Drivers*/
.drivers.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.drivers form {
    margin: 20px;
}

    .drivers form .toolbar {
        margin: 5px 0;
    }

    .drivers form .filter-container {
        background: #FFF;
        border: 1px solid #CCC;
        display: inline-block;
        margin-left: 5px;
    }

    .drivers form .filter-input {
        padding: 5px;
        margin: 0 0 0 3px;
        width: 153px;
        border: 1px solid #FFF;
    }

    .drivers form .filter-date-input {
        padding: 5px;
        margin: 0 0 0 1px;
        width: 69px;
        border: 1px solid #FFF;
        cursor: pointer;
        text-align: center;
        background: #F2F2F2;
        border-radius: 5px;
    }

    .drivers form .assign-group {
        width: 100px;
        height: 30px;
        background: #CCC;
        display: inline-block;
    }

    .drivers form .group {
        background: #F2F2F2;
        color: #333;
        border-radius: 10px;
        padding: 0 10px;
        display: inline-block;
        font-size: 0.9em;
    }

.drivers .group-selector {
    padding: 0;
    background: #FFF;
    display: none;
    width: 260px;
    overflow: hidden;
    position: absolute;
    top: 45px;
    left: 4px;
    z-index: 500;
    border: 1px solid #CCC;
    border-radius: 3px;
}

    .drivers .group-selector ul {
        list-style: none;
        list-style-type: none;
        margin: 0;
        padding: 0;
        max-height: 220px;
        overflow-x: hidden;
        overflow-y: auto;
    }

        .drivers .group-selector ul li {
            padding: 7px;
            cursor: pointer;
        }

            .drivers .group-selector ul li:hover {
                background: #F2F2F2;
            }

            .drivers .group-selector ul li a {
                float: right;
                margin-left: 5px;
            }

                .drivers .group-selector ul li a.edit {
                    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -293px -95px no-repeat;
                    width: 16px;
                    height: 16px;
                    display: inline-block;
                }

                    .drivers .group-selector ul li a.edit:hover {
                        opacity: 0.85;
                    }

                .drivers .group-selector ul li a.delete {
                    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -312px -95px no-repeat;
                    width: 16px;
                    height: 16px;
                    display: inline-block;
                }

                    .drivers .group-selector ul li a.delete:hover {
                        opacity: 0.85;
                    }

    .drivers .group-selector .filter {
        width: 241px;
        margin: 5px;
        border: 1px solid #CCC;
        padding: 4px;
    }

    .drivers .group-selector .new-group {
        background: #FFF;
        padding: 4px 10px;
        border-top: 1px solid #F2F2F2;
    }

        .drivers .group-selector .new-group a {
            text-decoration: none;
            color: #0074CC;
        }

            .drivers .group-selector .new-group a:hover {
                color: #666;
            }

    .drivers .group-selector .remove-from-group {
        background: #FFF;
        padding: 4px 10px;
        border-bottom: 1px solid #F2F2F2;
    }

        .drivers .group-selector .remove-from-group a {
            text-decoration: none;
            color: #333;
        }

            .drivers .group-selector .remove-from-group a:hover {
                color: #666;
            }

    .drivers .group-selector .cancel {
        background: #FFF;
        padding: 5px 10px;
    }

        .drivers .group-selector .cancel a {
            text-decoration: none;
            color: #666;
        }

            .drivers .group-selector .cancel a:hover {
                color: #333;
            }

.driver.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.driver form {
    margin: 20px 30px;
}

    .driver form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .driver form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .driver form .group {
        background: #F2F2F2;
        color: #333;
        border-radius: 10px;
        padding: 3px 10px;
        display: inline-block;
        font-size: 0.95em;
    }

    .driver form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

    .driver form .section {
        list-style: none;
        list-style-type: none;
        margin: 10px 0;
        padding: 0;
    }

        .driver form .section li {
            margin: 0 0 5px 0;
        }

        .driver form .section ul li {
            margin: 0;
        }

            .driver form .section ul li.label {
                color: #666;
                width: 250px;
                margin-right: 10px;
                text-align: right;
                line-height: 22px;
                display: inline-block;
                vertical-align: top;
                font-size: 0.92em;
            }

            .driver form .section ul li.input-container {
                display: inline-block;
            }

            .driver form .section ul li .input {
                border: 1px solid #CCC;
                height: 21px;
                max-width: 350px;
                padding: 0 2px;
            }

                .driver form .section ul li .input.required {
                    border: 2px solid #56BAEC;
                }

    .driver form .mobile-number {
        color: #666;
        font-size: 0.9em;
    }

    .driver form .phone-input .model-property-name {
        display: none;
    }

    .driver form .date-picker {
        cursor: pointer;
        border: none;
        background: #CCC;
        border-radius: 5px;
        text-align: center;
        padding: 2px 0;
        font-size: 0.9em;
    }

    .driver form .timer {
        border: none !important;
        cursor: pointer;
        color: #FFF;
        background: #7a2682;
        border-radius: 5px;
        text-align: center;
        padding: 2px 0;
        font-size: 0.9em;
    }

#assign-key-window .key-container .title {
    font-size: 1.1em;
    color: #0074CC;
    line-height: 23px;
    border-bottom: 1px solid #F2F2F2;
}

#assign-key-window .id-bluetooth-container .title {
    font-size: 1.1em;
    color: #0074CC;
    line-height: 23px;
    border-bottom: 1px solid #F2F2F2;
}

#assign-key-window .keypad-container .title {
    font-size: 1.1em;
    color: #0074CC;
    line-height: 23px;
    border-bottom: 1px solid #F2F2F2;
}

#assign-key-window .btcoin-container .title {
    font-size: 1.1em;
    color: #0074CC;
    line-height: 23px;
    border-bottom: 1px solid #F2F2F2;
}

#assign-key-window .id-external-container .title {
  font-size: 1.1em;
  color: #0074CC;
  line-height: 23px;
  border-bottom: 1px solid #F2F2F2;
}

#assign-key-window .token-input-list {
    border: 2px solid #56BAEC;
    padding: 0;
    margin: 5px 2px;
    width: 420px;
    border-radius: 5px;
}

#upload-rule-window .upload-container .title {
    font-size: 1.1em;
    color: #0074CC;
    line-height: 23px;
    border-bottom: 1px solid #F2F2F2;
}

#upload-rule-window .token-input-list {
    border: 2px solid #56BAEC;
    padding: 0;
    margin: 5px 2px;
    width: 420px;
}
/*#endregion*/
/*#region Share Device*/
#share-device-window .share-device-container .title {
    font-size: 1.1em;
    color: #0074CC;
    line-height: 23px;
    border-bottom: 1px solid #F2F2F2;
}

#share-device-window .token-input-list {
    border: 2px solid #56BAEC;
    padding: 0;
    margin: 5px 2px;
    width: 420px;
}
/*#endregion*/
/*#region Sequence*/
#view-sequence-window .view-sequence-container .title {
    font-size: 1.1em;
    color: #0074CC;
    line-height: 23px;
    border-bottom: 1px solid #F2F2F2;
}
/*#endregion*/
/*#region Rules*/
.rules.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.rules form {
    margin: 20px;
}

    .rules form .toolbar {
        margin: 5px 0;
    }

    .rules form .filter-container {
        background: #FFF;
        border: 1px solid #CCC;
        display: inline-block;
        margin-left: 5px;
    }

    .rules form .filter-input {
        padding: 5px;
        margin: 0 0 0 3px;
        width: 153px;
        border: 1px solid #FFF;
    }

    .rules form .filter-date-input {
        padding: 5px;
        margin: 0 0 0 1px;
        width: 69px;
        border: 1px solid #FFF;
        cursor: pointer;
        text-align: center;
        background: #F2F2F2;
        border-radius: 5px;
    }

    .rules form .action.not-editable {
        cursor: default;
        text-decoration: none;
    }

.rule.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.rule form {
    margin: 20px 30px;
}

    .rule form .full-name {
        font-size: 1.2em;
        line-height: 17px;
    }

    .rule form .email a {
        text-decoration: none;
        color: #0074CC;
        font-size: 0.9em;
    }

    .rule form .mobile-number {
        color: #666;
        font-size: 0.9em;
    }

    .rule form .token-input-list {
        border: 2px solid #56BAEC;
        border-radius: 0;
        padding: 0;
        margin: 5px 2px;
    }

        .rule form .token-input-list .activity-zone {
            margin: 2px !important;
            cursor: pointer !important;
            background: #CCC;
            color: #FFF;
            border: 1px solid #CCC;
        }

            .rule form .token-input-list .activity-zone:hover {
                opacity: 0.8;
                color: #000 !important;
            }

            .rule form .token-input-list .activity-zone.selected {
                border: 1px solid #000 !important;
                color: #000;
            }

                .rule form .token-input-list .activity-zone.selected:hover {
                    opacity: 1;
                    cursor: default !important;
                }

    .rule form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .rule form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .rule form #zone-settings {
        min-width: 800px;
        width: 800px;
        display: none;
    }

    .rule form #zone-settings-viewer {
        list-style: none;
        list-style-type: none;
        padding: 0;
        margin: 0;
    }

    .rule form #event-trigger-container {
        display: none;
        width: 800px;
        padding: 7px 0;
    }

    .rule form .token-input-list .activity-zone.is-start-event-trigger {
        background: #1C9F22;
        color: #FFF;
        border: 1px solid #1C9F22;
    }

    .rule form .token-input-list .activity-zone.is-end-event-trigger {
        background: #ED1C24;
        color: #FFF;
        border: 1px solid #ED1C24;
    }

    .rule form .token-input-list .activity-zone.is-unauthorized-point {
        background: #FEDFA7;
        color: #FFF;
        border: 1px solid #FEDFA7;
    }

    .rule form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

    .rule form .dates {
        font-size: 0.9em;
    }

        .rule form .dates > div {
            display: inline-block;
        }

    .rule form .devices {
        margin: 20px 20px;
        border: 1px solid #CCC;
        width: 590px;
        padding: 5px;
    }

        .rule form .devices ul {
            list-style: none;
            list-style-type: none;
            margin: 0;
            padding: 0;
            overflow: auto;
            width: 580px;
        }

        .rule form .devices .h {
            background: #333;
            padding: 5px;
        }

            .rule form .devices .h li {
                float: left;
                width: 30px;
                text-align: center;
                color: #FFF;
            }

                .rule form .devices .h li:first-child {
                    width: 20px;
                }

                    .rule form .devices .h li:first-child input[type='checkbox'] {
                        margin: 0;
                    }

                .rule form .devices .h li.a {
                    text-align: left;
                    width: 550px;
                    line-height: 17px;
                }

        .rule form .devices .g {
            background: #CCC;
            padding: 5px;
        }

            .rule form .devices .g li {
                float: left;
                width: 30px;
                text-align: center;
                color: #FFF;
            }

                .rule form .devices .g li:first-child {
                    width: 20px;
                }

                    .rule form .devices .g li:first-child input[type='checkbox'] {
                        margin: 0;
                    }

            .rule form .devices .g input[type='checkbox'] {
                margin: 0;
            }

            .rule form .devices .g li.a {
                text-align: left;
                width: 550px;
                line-height: 17px;
            }

        .rule form .devices .i {
            background: #FFF;
            border-bottom: 1px solid #FFF;
        }

            .rule form .devices .i li {
                float: right;
                width: 40px;
                text-align: right;
                margin: 0 1px 0 0;
            }

                .rule form .devices .i li:first-child {
                    width: 20px;
                    height: 1px;
                }

                .rule form .devices .i li.a {
                    text-align: left;
                    width: 550px;
                }

    .rule form .section {
        list-style: none;
        list-style-type: none;
        margin: 10px 0;
        padding: 0;
    }

        .rule form .section li {
            margin: 0 0 5px 0;
        }

        .rule form .section ul li {
            margin: 0;
        }

            .rule form .section ul li.label {
                color: #666;
                width: 190px;
                margin-right: 10px;
                text-align: right;
                line-height: 22px;
                display: inline-block;
                vertical-align: top;
                font-size: 0.92em;
            }

            .rule form .section ul li.input-container {
                display: inline-block;
            }

            .rule form .section ul li .input {
                border: 1px solid #CCC;
                height: 21px;
                max-width: 350px;
                padding: 0 2px;
            }

                .rule form .section ul li .input.required {
                    border: 2px solid #56BAEC;
                }

.rule .phone-input .model-property-name {
    display: none;
}

.rule .warning {
    color: #333;
    font-size: 0.9em;
    padding: 5px;
    line-height: 11px;
    background: #FEDFA7;
}

.rule .date-picker {
    cursor: pointer;
    border: none;
    background: #CCC;
    border-radius: 5px;
    text-align: center;
    padding: 2px 0;
    font-size: 0.9em;
}

.rule .timer {
    border: none !important;
    cursor: pointer;
    color: #FFF;
    background: #7a2682;
    border-radius: 5px;
    text-align: center;
    padding: 2px 0;
    font-size: 0.9em;
}

.rule .field-validation-error {
    display: none;
}

.rule ul.horizontal-list {
    list-style-type: none;
    padding: 0;
    margin: 0;
    font-size: 0.95em;
}

    .rule ul.horizontal-list > li {
        display: inline;
    }

    .rule ul.horizontal-list > label {
        margin-left: 0.5em;
    }

.rule form #settings {
    display: block;
    margin-bottom: 10px;
    max-width: 800px;
    height: auto;
}

    .rule form #settings .sub-block {
        font-size: 0.95em;
        color: #CCC;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
    }

    .rule form #settings .sub-settings {
        font-size: 0.95em;
        color: #0074CC;
        width: 670px;
        max-width: 670px;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        padding: 0 0 5px 5px;
        margin: 10px 0 10px 30px;
    }

    .rule form #settings .input-label {
        float: left;
        width: 190px;
        margin-right: 10px;
        text-align: right;
    }

    .rule form #settings .input-content {
        float: left;
    }

    .rule form #settings .content-section {
        width: 92%;
        margin-left: 5%;
        display: inline-block;
    }

.rule form .activity-list {
    border: 2px solid #F2F2F2;
    border-radius: 0;
    padding: 0;
    margin: 5px 2px;
    width: 435px;
    font-size: 0.9em;
    /*font-family: Verdana;*/
    height: auto !important;
    list-style-type: none;
}

.rule form .input-container .not-editable-rule-name {
    background-color: #FFF;
    border: 2px solid #F2F2F2 !important;
}

.rule form .activity-list .activity-zone {
    font-weight: bold;
    display: inline-block;
    overflow: hidden;
    height: auto !important;
    padding: 3px 5px;
    border-radius: 3px;
    margin: 2px !important;
    background: #CCC;
    color: #FFF;
    border: 1px solid #CCC;
}

    .rule form .activity-list .activity-zone.is-start-event-trigger {
        background: #1C9F22;
        color: #FFF;
        border: 1px solid #1C9F22;
    }

    .rule form .activity-list .activity-zone.is-end-event-trigger {
        background: #ED1C24;
        color: #FFF;
        border: 1px solid #ED1C24;
    }

    .rule form .activity-list .activity-zone.is-unauthorized-point {
        background: #FEDFA7;
        color: #FFF;
        border: 1px solid #FEDFA7;
    }

.rules form .settings-grid .copy-rule-configuration {
    text-decoration: none;
    color: #0074CC;
}

    .rules form .settings-grid .copy-rule-configuration:hover {
        text-decoration: underline;
        color: #666;
    }
/*#endregion*/
/*#region Client Alerts Custom Settings*/
.client-alert-custom-settings.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.client-alert-custom-settings form {
    margin: 20px;
}

    .client-alert-custom-settings form .toolbar {
        margin: 5px 0;
    }

    .client-alert-custom-settings form .filter-container {
        background: #FFF;
        border: 1px solid #CCC;
        display: inline-block;
        margin-left: 5px;
    }

    .client-alert-custom-settings form .filter-input {
        padding: 5px;
        margin: 0 0 0 3px;
        width: 153px;
        border: 1px solid #FFF;
    }

    .client-alert-custom-settings form .assign-group {
        width: 100px;
        height: 30px;
        background: #CCC;
        display: inline-block;
    }

    .client-alert-custom-settings form .group {
        background: #F2F2F2;
        color: #333;
        border-radius: 10px;
        padding: 0 10px;
        display: inline-block;
        font-size: 0.9em;
    }

    .client-alert-custom-settings form .name {
        padding-left: 10px;
    }

.client-alert-custom-settings .group-selector {
    padding: 0;
    background: #FFF;
    display: none;
    width: 260px;
    overflow: hidden;
    position: absolute;
    top: 45px;
    left: 4px;
    z-index: 500;
    border: 1px solid #CCC;
    border-radius: 3px;
}

    .client-alert-custom-settings .group-selector ul {
        list-style: none;
        list-style-type: none;
        margin: 0;
        padding: 0;
        max-height: 220px;
        overflow-x: hidden;
        overflow-y: auto;
    }

        .client-alert-custom-settings .group-selector ul li {
            padding: 7px;
            cursor: pointer;
        }

            .client-alert-custom-settings .group-selector ul li:hover {
                background: #F2F2F2;
            }

            .client-alert-custom-settings .group-selector ul li a {
                float: right;
                margin-left: 5px;
            }

                .client-alert-custom-settings .group-selector ul li a.edit {
                    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -293px -95px no-repeat;
                    width: 16px;
                    height: 16px;
                    display: inline-block;
                }

                    .client-alert-custom-settings .group-selector ul li a.edit:hover {
                        opacity: 0.85;
                    }

                .client-alert-custom-settings .group-selector ul li a.delete {
                    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") -312px -95px no-repeat;
                    width: 16px;
                    height: 16px;
                    display: inline-block;
                }

                    .client-alert-custom-settings .group-selector ul li a.delete:hover {
                        opacity: 0.85;
                    }

    .client-alert-custom-settings .group-selector .filter {
        width: 241px;
        margin: 5px;
        border: 1px solid #CCC;
        padding: 4px;
    }

    .client-alert-custom-settings .group-selector .new-group {
        background: #FFF;
        padding: 4px 10px;
        border-top: 1px solid #F2F2F2;
    }

        .client-alert-custom-settings .group-selector .new-group a {
            text-decoration: none;
            color: #0074CC;
        }

            .client-alert-custom-settings .group-selector .new-group a:hover {
                color: #666;
            }

    .client-alert-custom-settings .group-selector .remove-from-group {
        background: #FFF;
        padding: 4px 10px;
        border-bottom: 1px solid #F2F2F2;
    }

        .client-alert-custom-settings .group-selector .remove-from-group a {
            text-decoration: none;
            color: #333;
        }

            .client-alert-custom-settings .group-selector .remove-from-group a:hover {
                color: #666;
            }

    .client-alert-custom-settings .group-selector .cancel {
        background: #FFF;
        padding: 5px 10px;
    }

        .client-alert-custom-settings .group-selector .cancel a {
            text-decoration: none;
            color: #666;
        }

            .client-alert-custom-settings .group-selector .cancel a:hover {
                color: #333;
            }

.client-alert-custom-setting.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.client-alert-custom-setting form {
    margin: 20px 30px;
}

    .client-alert-custom-setting form .edit-my-account a {
        text-decoration: none;
        color: #333;
        font-size: 0.9em;
    }

        .client-alert-custom-setting form .edit-my-account a:hover {
            color: #333;
            text-decoration: underline;
        }

    .client-alert-custom-setting form .full-name {
        font-size: 1.2em;
        line-height: 17px;
    }

    .client-alert-custom-setting form .email a {
        text-decoration: none;
        color: #0074CC;
        font-size: 0.9em;
    }

    .client-alert-custom-setting form .mobile-number {
        color: #666;
        font-size: 0.9em;
    }

    .client-alert-custom-setting form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .client-alert-custom-setting form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .client-alert-custom-setting form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

    .client-alert-custom-setting form .section {
        list-style: none;
        list-style-type: none;
        margin: 10px 0;
        padding: 0;
    }

        .client-alert-custom-setting form .section li {
            margin: 0 0 5px 0;
        }

        .client-alert-custom-setting form .section ul li {
            background-image: none;
            margin: 0;
        }

            .client-alert-custom-setting form .section ul li.label {
                color: #666;
                width: 250px;
                margin-right: 10px;
                text-align: right;
                line-height: 22px;
                display: inline-block;
                vertical-align: top;
                font-size: 0.92em;
            }

            .client-alert-custom-setting form .section ul li.input-container {
                display: inline-block;
            }

            .client-alert-custom-setting form .section ul li .input {
                border: 1px solid #CCC;
                height: 21px;
                max-width: 350px;
                padding: 0 2px;
            }

                .client-alert-custom-setting form .section ul li .input.required {
                    border: 2px solid #56BAEC;
                }

.settings-grid .send-email-alerts {
    display: inline;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .settings-grid .send-email-alerts li {
        float: left;
        list-style: none;
        margin: 0;
    }

        .settings-grid .send-email-alerts li div.legend {
            margin-left: 1px;
            padding: 2px 5px 2px 5px;
            min-width: 200px;
            width: auto;
            text-align: left;
            border: 1px solid #CCC;
            border-radius: 5px 0 0 5px;
            background-color: whiteSmoke;
            border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
            box-shadow: inset 0 -1px 0 #ffffff, inset 1px 0 0 rgba(255, 255, 255, 0.3), inset -1px 0 0 rgba(255, 255, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 1px 0 rgba(100, 100, 100, 0.1), 0 2px 0 rgba(150, 150, 150, 0.1);
        }

        .settings-grid .send-email-alerts li div {
            width: 30px;
            height: 25px;
            line-height: 25px;
            padding: 2px 0;
            margin: 2px 0 7px 0;
        }

            .settings-grid .send-email-alerts li div.grey-option {
                cursor: pointer;
            }

    .settings-grid .send-email-alerts #send-mail-ok {
        margin-left: 0;
        text-align: center;
    }

    .settings-grid .send-email-alerts #send-mail-cancel {
        border-radius: 0 5px 5px 0;
        margin-right: 5px;
        text-align: center;
    }

.settings-grid .grey-option {
    background-color: whiteSmoke;
    background-image: -ms-linear-gradient(top, #FAFAFA, #F2F2F2);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FAFAFA), to(#F2F2F2));
    background-image: -webkit-linear-gradient(top, #FAFAFA, #F2F2F2);
    background-image: -o-linear-gradient(top, #FAFAFA, #F2F2F2);
    background-image: -moz-linear-gradient(top, #FAFAFA, #F2F2F2);
    background-image: linear-gradient(top, #FAFAFA, #F2F2F2);
    border: 1px solid #CCC;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    box-shadow: inset 0 -1px 0 #ffffff, inset 1px 0 0 rgba(255, 255, 255, 0.3), inset -1px 0 0 rgba(255, 255, 255, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 1px 0 rgba(100, 100, 100, 0.1), 0 2px 0 rgba(150, 150, 150, 0.1);
    color: #333;
}

.grey-option:hover {
    background: #F2F2F2;
}

.settings-grid .send-email-alerts .selected {
    background-color: #666;
    background-image: -ms-linear-gradient(top, #CCC, #666);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#CCC), to(#666));
    background-image: -webkit-linear-gradient(top, #CCC, #666);
    background-image: -o-linear-gradient(top, #CCC, #666);
    background-image: -moz-linear-gradient(top, #CCC, #666);
    background-image: linear-gradient(top, #CCC, #666);
    border: 1px solid #CCC;
    color: #FFF;
}
/*#endregion*/
/*#region Contracts*/
.contracts-grid {
    min-width: 700px !important;
    min-height: 350px !important;
    font-size: 0.9em !important;
}

    .contracts-grid .action {
        text-decoration: none;
        color: #0074CC;
    }

        .contracts-grid .action:hover {
            text-decoration: underline;
        }

    .contracts-grid .search-selector {
        display: inline;
        margin: 0;
        padding: 0;
        list-style: none;
    }

        .contracts-grid .search-selector li {
            cursor: pointer;
            float: left;
            list-style: none;
            margin: 0;
            border: 1px solid #CCC;
            background: #CCC;
            color: #FFF;
            padding: 6px 10px;
        }

            .contracts-grid .search-selector li.selected {
                border: 1px solid #666;
                background: #666;
                cursor: default;
            }

            .contracts-grid .search-selector li:first-child {
                border-radius: 5px 0 0 5px;
            }

            .contracts-grid .search-selector li:last-child {
                border-radius: 0 5px 5px 0;
            }

.routes-grid {
    min-width: 700px !important;
    height: 300px !important;
    min-height: 300px !important;
    max-height: 300px !important;
    font-size: 0.9em !important;
}

    .routes-grid .action {
        text-decoration: none;
        color: #0074CC;
    }

        .routes-grid .action:hover {
            text-decoration: underline;
        }

    .routes-grid .option-selector {
        display: inline;
        margin: 0;
        padding: 0;
        list-style: none;
    }

        .routes-grid .option-selector div {
            cursor: pointer;
            float: left;
            list-style: none;
            margin: 0;
            background-color: #0074CC;
            background-image: linear-gradient(top, #08C0, #0074CC 50%, #0074CC 50%, #003580 100%);
            border: 1px solid #BD2C00;
            border-color: #0074CC #0074CC #003580;
            color: #FFF;
            padding: 6px 10px;
            border-radius: 5px 5px 5px 5px;
            margin-right: 4px;
        }

            .routes-grid .option-selector div:hover {
                background: #0074CC;
                background: linear-gradient(top, #008f d 70%, #0074CC 50%, #0074CC 50%, #003580 100%);
            }

            .routes-grid .option-selector div.disabled {
                border: 1px solid #CCC;
                background: #CCC;
                color: #FFF;
            }

#section-1 #edit-section #open-client {
    cursor: pointer;
    list-style: none;
    color: #FFF;
    padding: 4px 8px;
}

    #section-1 #edit-section #open-client a {
        text-decoration: none;
        color: #FFF;
    }

.display-data {
    border-radius: 5px;
    line-height: 22px;
}

.display-date,
.display-time {
    line-height: 22px;
}

.contracts-menu.tabs {
    padding: 20px 0 0 0;
    border-bottom: 1px solid #CCC;
    background: #F2F2F2;
    font-family: 'Montserrat';
}

    .contracts-menu.tabs ul {
        list-style-type: none;
        list-style: none;
        padding: 0;
        margin: 0 0 0 20px;
    }

        .contracts-menu.tabs ul li {
            display: inline-block;
            padding: 7px 15px;
            font-size: 1.1em;
            border-left: 1px solid #F2F2F2;
            border-right: 1px solid #F2F2F2;
        }

            .contracts-menu.tabs ul li.selected {
                margin-bottom: -2px;
                display: inline-block;
                border-bottom: 1px solid #FFF;
                font-family: 'Montserrat';
                cursor: default;
                background: #FFF;
                border-left: 1px solid #CCC;
                border-top: 1px solid #CCC;
                border-right: 1px solid #CCC;
                border-radius: 5px 5px 0 0;
            }

                .contracts-menu.tabs ul li.selected a {
                    color: #000;
                    cursor: default;
                }

                    .contracts-menu.tabs ul li.selected a:hover {
                        text-decoration: none;
                        color: #000;
                    }

            .contracts-menu.tabs ul li a {
                text-decoration: none;
                color: #0074CC;
            }

                .contracts-menu.tabs ul li a:hover {
                    color: #333;
                    text-decoration: underline;
                }

.automotors.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.automotors form {
    margin: 20px;
}

    .automotors form .toolbar {
        margin: 5px 0;
    }

    .automotors form .filter-container {
        background: #FFF;
        border: 1px solid #CCC;
        display: inline-block;
        margin-left: 5px;
    }

    .automotors form .filter-input {
        padding: 5px;
        margin: 0 0 0 3px;
        width: 153px;
        border: 1px solid #FFF;
    }

    .automotors form .filter-date-input {
        padding: 5px;
        margin: 0 0 0 1px;
        width: 69px;
        border: 1px solid #FFF;
        cursor: pointer;
        text-align: center;
        background: #F2F2F2;
        border-radius: 5px;
    }

.automotor.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 165px;
    bottom: 27px;
    width: 100%;
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.25);
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.25);
    z-index: 41;
}

.automotor form {
    margin: 10px;
}

    .automotor form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .automotor form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .automotor form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

    .automotor form .section {
        list-style: none;
        list-style-type: none;
        margin: 10px 0 0 10px;
        padding: 0;
    }

        .automotor form .section li {
            margin: 0 0 5px 0;
        }

        .automotor form .section ul {
            margin: 0;
            padding: 0;
        }

            .automotor form .section ul li {
                margin: 0;
            }

                .automotor form .section ul li.label {
                    color: #666;
                    width: 190px;
                    margin-right: 10px;
                    text-align: right;
                    line-height: 22px;
                    display: inline-block;
                    vertical-align: top;
                    font-size: 0.92em;
                }

                .automotor form .section ul li.input-container {
                    display: inline-block;
                }

                .automotor form .section ul li .input {
                    border: 1px solid #CCC;
                    height: 21px;
                    max-width: 350px;
                    padding: 0 2px;
                }

                    .automotor form .section ul li .input.required {
                        border: 2px solid #56BAEC;
                    }

                .automotor form .section ul li.option {
                    color: #666;
                    width: 20px;
                    margin-right: 10px;
                    text-align: right;
                    line-height: 22px;
                    display: inline-block;
                    vertical-align: top;
                    font-size: 0.92em;
                }

                .automotor form .section ul li.hint {
                    display: inline-block;
                    font-size: 0.85em;
                    width: 350px;
                }

.automotor .warning {
    color: #333;
    font-size: 0.9em;
    padding: 5px;
    line-height: 11px;
    background: #FEDFA7;
}

.contract-clients.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.contract-clients form {
    margin: 20px;
}

    .contract-clients form .toolbar {
        margin: 5px 0;
    }

    .contract-clients form .filter-container {
        background: #FFF;
        border: 1px solid #CCC;
        display: inline-block;
        margin-left: 5px;
    }

    .contract-clients form .filter-input {
        padding: 5px;
        margin: 0 0 0 3px;
        width: 153px;
        border: 1px solid #FFF;
    }

    .contract-clients form .filter-date-input {
        padding: 5px;
        margin: 0 0 0 1px;
        width: 69px;
        border: 1px solid #FFF;
        cursor: pointer;
        text-align: center;
        background: #F2F2F2;
        border-radius: 5px;
    }

.contract-client.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 165px;
    bottom: 27px;
    width: 100%;
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.25);
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.25);
    z-index: 41;
}

.contract-client form {
    margin: 10px;
}

    .contract-client form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .contract-client form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .contract-client form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

    .contract-client form .section {
        list-style: none;
        list-style-type: none;
        margin: 10px 0 0 10px;
        padding: 0;
    }

        .contract-client form .section li {
            margin: 0 0 5px 0;
        }

        .contract-client form .section ul {
            margin: 0;
            padding: 0;
        }

            .contract-client form .section ul li {
                margin: 0;
            }

                .contract-client form .section ul li.label {
                    color: #666;
                    width: 190px;
                    margin-right: 10px;
                    text-align: right;
                    line-height: 22px;
                    display: inline-block;
                    vertical-align: top;
                    font-size: 0.92em;
                }

                .contract-client form .section ul li.input-container {
                    display: inline-block;
                }

                .contract-client form .section ul li .input {
                    border: 1px solid #CCC;
                    height: 21px;
                    max-width: 350px;
                    padding: 0 2px;
                }

                    .contract-client form .section ul li .input.required {
                        border: 2px solid #56BAEC;
                    }

                .contract-client form .section ul li.option {
                    color: #666;
                    width: 20px;
                    margin-right: 10px;
                    text-align: right;
                    line-height: 22px;
                    display: inline-block;
                    vertical-align: top;
                    font-size: 0.92em;
                }

                .contract-client form .section ul li.hint {
                    display: inline-block;
                    font-size: 0.85em;
                    width: 350px;
                }

.contract-client .warning {
    color: #333;
    font-size: 0.9em;
    padding: 5px;
    line-height: 11px;
    background: #FEDFA7;
}

.contracts.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.contracts form {
    margin: 20px;
}

    .contracts form .toolbar {
        margin: 5px 0;
    }

    .contracts form .filter-container {
        background: #FFF;
        border: 1px solid #CCC;
        display: inline-block;
        margin-left: 5px;
    }

    .contracts form .filter-input {
        padding: 5px;
        margin: 0 0 0 3px;
        width: 153px;
        border: 1px solid #FFF;
    }

    .contracts form .filter-date-input {
        padding: 5px;
        margin: 0 0 0 1px;
        width: 69px;
        border: 1px solid #FFF;
        cursor: pointer;
        text-align: center;
        background: #F2F2F2;
        border-radius: 5px;
    }

.contract.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 165px;
    bottom: 27px;
    width: 100%;
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.25);
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.25);
    z-index: 41;
}

.contract form {
    margin: 10px;
}

    .contract form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .contract form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .contract form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

    .contract form .section {
        list-style: none;
        list-style-type: none;
        margin: 10px 0 0 10px;
        padding: 0;
    }

        .contract form .section li {
            margin: 0 0 5px 0;
        }

        .contract form .section ul {
            margin: 0;
            padding: 0;
        }

            .contract form .section ul li {
                margin: 0;
            }

                .contract form .section ul li.label {
                    color: #666;
                    width: 190px;
                    margin-right: 10px;
                    text-align: right;
                    line-height: 22px;
                    display: inline-block;
                    vertical-align: top;
                    font-size: 0.92em;
                }

                .contract form .section ul li.input-container {
                    display: inline-block;
                }

                .contract form .section ul li .input {
                    border: 1px solid #CCC;
                    height: 21px;
                    max-width: 350px;
                    padding: 0 2px;
                }

                    .contract form .section ul li .input.required {
                        border: 2px solid #56BAEC;
                    }

                .contract form .section ul li.option {
                    color: #666;
                    width: 20px;
                    margin-right: 10px;
                    text-align: right;
                    line-height: 22px;
                    display: inline-block;
                    vertical-align: top;
                    font-size: 0.92em;
                }

                .contract form .section ul li.hint {
                    display: inline-block;
                    font-size: 0.85em;
                    width: 350px;
                }

.contract .warning {
    color: #333;
    font-size: 0.9em;
    padding: 5px;
    line-height: 11px;
    background: #FEDFA7;
}

.route.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 165px;
    bottom: 27px;
    width: 100%;
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.25);
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.25);
    z-index: 41;
}

.route form {
    margin: 10px;
}

    .route form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .route form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .route form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

    .route form .section {
        list-style: none;
        list-style-type: none;
        margin: 10px 0 0 10px;
        padding: 0;
    }

        .route form .section li {
            margin: 0 0 5px 0;
        }

        .route form .section ul {
            margin: 0;
            padding: 0;
        }

            .route form .section ul li {
                margin: 0;
            }

                .route form .section ul li.label {
                    color: #666;
                    width: 190px;
                    margin-right: 10px;
                    text-align: right;
                    line-height: 22px;
                    display: inline-block;
                    vertical-align: top;
                    font-size: 0.92em;
                }

                .route form .section ul li.input-container {
                    display: inline-block;
                }

                .route form .section ul li .input {
                    border: 1px solid #CCC;
                    height: 21px;
                    max-width: 350px;
                    padding: 0 2px;
                }

                    .route form .section ul li .input.required {
                        border: 2px solid #56BAEC;
                    }

                .route form .section ul li.option {
                    color: #666;
                    width: 20px;
                    margin-right: 10px;
                    text-align: right;
                    line-height: 22px;
                    display: inline-block;
                    vertical-align: top;
                    font-size: 0.92em;
                }

                .route form .section ul li.hint {
                    display: inline-block;
                    font-size: 0.85em;
                    width: 350px;
                }

.route .warning {
    color: #333;
    font-size: 0.9em;
    padding: 5px;
    line-height: 11px;
    background: #FEDFA7;
}

.route .date-picker {
    cursor: pointer;
    border: none;
    background: #CCC;
    border-radius: 5px;
    text-align: center;
    padding: 2px 0;
    font-size: 0.9em;
}

.route .timer {
    border: none !important;
    cursor: pointer;
    color: #FFF;
    background: #7a2682;
    border-radius: 5px;
    text-align: center;
    padding: 2px 0;
    font-size: 0.9em;
}

.automotor-info {
    margin-bottom: 15px;
    margin-top: 15px;
}
/*#endregion*/
/*#region Events*/
#assign-savepoint-window {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3000;
    border-radius: 3px;
    background: #FFF;
    max-width: 290px;
    min-width: 290px;
    height: 170px;
    display: none;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
    -o-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.35);
}

    #assign-savepoint-window .title {
        font-size: 1.1em;
        color: #0074CC;
        line-height: 23px;
        border-bottom: 1px solid #F2F2F2;
    }

    #assign-savepoint-window .savepoint-container {
        padding: 10px 12px;
    }

    #assign-savepoint-window #input-section {
        height: 70px;
        padding-top: 5px;
        margin: 5px 0 10px 0;
        border: 1px solid #F2F2F2;
    }

        #assign-savepoint-window #input-section .label {
            margin-bottom: 3px;
            margin-left: 15px;
            font-size: 0.95em;
        }

        #assign-savepoint-window #input-section .input-container {
            margin-left: 13px;
            font-size: 0.95em;
        }

    #assign-savepoint-window .token-input-list {
        border: 2px solid #56BAEC;
        border-radius: 0;
        padding: 0;
        margin: 5px 2px;
        width: 235px;
    }

        #assign-savepoint-window .token-input-list .activity-point {
            background: #CCC;
            color: #FFF;
            border: 1px solid #CCC;
        }

            #assign-savepoint-window .token-input-list .activity-point.is-end-event-trigger {
                background: #ED1C24;
                color: #FFF;
                border: 1px solid #ED1C24;
            }

        #assign-savepoint-window .token-input-list .token-input-dropdown {
            width: 325px;
        }

    #assign-savepoint-window .save {
        display: inline-block;
        padding: 7px 15px;
        font-family: 'Montserrat';
        cursor: pointer;
    }

    #assign-savepoint-window .cancel {
        display: inline-block;
        padding: 7px 15px;
        font-family: 'Montserrat';
        cursor: pointer;
        margin-left: 5px;
    }

#assign-driver-window .driver-container .title {
    font-size: 1.1em;
    color: #0074CC;
    line-height: 23px;
    border-bottom: 1px solid #F2F2F2;
}

#comment-window .box .section ul li .input.required {
    border: 2px solid #56BAEC;
}

#comment-window .box .title {
    font-size: 1.1em;
    color: #0074CC;
    line-height: 23px;
    border-bottom: 1px solid #F2F2F2;
}

#init-event-actions-window .token-input-list {
    border: 2px solid #56BAEC;
    border-radius: 0;
    margin: 2px;
    width: 230px;
    overflow-y: auto;
    height: 170px;
}

#stop-event-window {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3000;
    border-radius: 3px;
    background: #FFF;
    max-width: 290px;
    min-width: 290px;
    height: 140px;
    display: none;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
    -o-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.35);
}

    #stop-event-window .title {
        font-size: 1.1em;
        color: #0074CC;
        line-height: 23px;
        border-bottom: 1px solid #F2F2F2;
    }

    #stop-event-window .stopEvent-container {
        padding: 10px 12px;
    }

    #stop-event-window #input-section {
        height: 30px;
        padding-top: 15px;
        margin: 5px 0 10px 0;
        border: 1px solid #F2F2F2;
    }

        #stop-event-window #input-section .label {
            margin-bottom: 3px;
            margin-left: 15px;
            font-size: 0.95em;
        }

    #stop-event-window .save {
        display: inline-block;
        padding: 7px 15px;
        font-family: 'Montserrat';
        cursor: pointer;
    }

    #stop-event-window .cancel {
        display: inline-block;
        padding: 7px 15px;
        font-family: 'Montserrat';
        cursor: pointer;
        margin-left: 5px;
    }

#tow-plate-window .tow-container .title {
    font-size: 1.1em;
    color: #0074CC;
    line-height: 23px;
    border-bottom: 1px solid #F2F2F2;
}

#tow-plate-window .tow-container .input.required {
    border: 2px solid #56BAEC;
}
/*#endregion*/
/*#region LinkedVehicles*/
.linkedvehicles.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.linkedvehicles form {
    margin: 20px;
}

    .linkedvehicles form .toolbar {
        margin: 5px 0;
    }

.linkedvehicle.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.linkedvehicle form {
    margin: 20px 30px;
}

    .linkedvehicle form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .linkedvehicle form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .linkedvehicle form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

    .linkedvehicle form .section {
        list-style: none;
        list-style-type: none;
        margin: 10px 0;
        padding: 0;
    }

        .linkedvehicle form .section li {
            margin: 0 0 5px 0;
        }

        .linkedvehicle form .section ul li {
            margin: 0;
        }

            .linkedvehicle form .section ul li.label {
                color: #666;
                width: 250px;
                margin-right: 10px;
                text-align: right;
                line-height: 22px;
                display: inline-block;
                vertical-align: top;
                font-size: 0.92em;
            }

            .linkedvehicle form .section ul li.input-container {
                display: inline-block;
            }

            .linkedvehicle form .section ul li .input {
                border: 1px solid #CCC;
                height: 21px;
                max-width: 350px;
                padding: 0 2px;
            }

                .linkedvehicle form .section ul li .input.required {
                    border: 2px solid #56BAEC;
                }
/*#endregion*/
/*#region DynamicForms*/
.dynamicforms.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.dynamicforms form {
    margin: 20px;
}

    .dynamicforms form .toolbar {
        margin: 5px 0;
    }

.dynamicform.container {
    background: #FFF;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 160px;
    bottom: 27px;
    width: 100%;
}

.dynamicform form {
    margin: 20px 30px;
}

    .dynamicform form a.cancel {
        color: #7a2682;
        text-decoration: none;
        margin-left: 10px;
        font-family: 'Montserrat';
        font-size: 1.1em;
    }

        .dynamicform form a.cancel:hover {
            text-decoration: underline;
            color: #333;
        }

    .dynamicform form .sub {
        font-family: 'Montserrat';
        font-size: 1.25em;
        border-bottom: 1px solid #F2F2F2;
        font-weight: bold;
        max-width: 800px;
        padding: 0 0 5px 5px;
        margin-top: 20px;
    }

    .dynamicform form .section {
        list-style: none;
        list-style-type: none;
        margin: 10px 0;
        padding: 0;
    }

        .dynamicform form .section li {
            margin: 0 0 5px 0;
        }

        .dynamicform form .section ul li {
            margin: 0;
        }

            .dynamicform form .section ul li.label {
                color: #666;
                width: 250px;
                margin-right: 10px;
                text-align: right;
                line-height: 22px;
                display: inline-block;
                vertical-align: top;
                font-size: 0.92em;
            }

            .dynamicform form .section ul li.input-container {
                display: inline-block;
            }

            .dynamicform form .section ul li .input {
                border: 1px solid #CCC;
                height: 21px;
                max-width: 350px;
                padding: 0 2px;
            }

                .dynamicform form .section ul li .input.required {
                    border: 2px solid #56BAEC;
                }

.dynamicform-delete-button {
    font-size: 1.1em;
    padding: 7px 15px;
    margin-right: 4px;
    cursor: pointer;
    border-radius: 5px 5px 5px 5px;
    font-family: 'Montserrat';
    background-color: #7a2682;
    background-image: linear-gradient(top, #0074CC 0, #0074CC 50%, #0074CC 50%, #003580 100%);
    border: 1px solid #BD2C00;
    border-color: #0074CC #0074CC #003580;
    color: #FFF;
    float: left;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.3), inset 1px 0 0 rgba(255, 255, 255, 0.22), inset -1px 0 0 rgba(255, 255, 255, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 0 rgba(100, 100, 100, 0.1), 0 2px 0 rgba(150, 150, 150, 0.1);
}
/*#endregion*/
/*#region Latest Trips*/
#latest-trips {
    position: absolute;
    bottom: 0;
    left: 0;
    background: #FFF;
    z-index: 7000;
    width: 100%;
    font-size: 0.7em;
    overflow: hidden;
    display: none;
    opacity: 0.9;
    filter: alpha(opacity=90);
}

    #latest-trips .imei {
        display: inline-block;
        font-size: 1.2em;
        color: #333;
        cursor: default;
        width: 100%;
        padding: 5px;
        background-color: #CCC;
        font-weight: bold;
    }

    #latest-trips .close {
        background-color: rgba(0, 0, 0, 0.1) !important;
        border-radius: 5px;
        margin-right: 3px !important;
        font-size: 1rem !important;
        opacity: 1 !important;
    }

        #latest-trips .close:hover {
            background: #666;
        }

    #latest-trips .restore,
    #latest-trips .minimize {
        background: #333;
        border-radius: 5px;
        margin-right: 3px !important;
    }

        .restore:hover,
        #latest-trips .minimize:hover {
            background: #666;
        }

    #latest-trips .h {
        background: #F2F2F2;
        margin: 0 3px;
        color: #333;
    }

        #latest-trips .h ul {
            margin: 0;
            list-style: none;
            list-style-type: none;
            padding: 0;
            display: block;
            min-width: 750px;
            overflow: auto;
            cursor: default;
        }

            #latest-trips .h ul li {
                float: left;
                padding: 5px;
                text-align: center;
                color: #333;
                font-weight: bold;
            }

                #latest-trips .h ul li.f {
                    width: 60px;
                }

                #latest-trips .h ul li.d {
                    width: 150px;
                }

                #latest-trips .h ul li.k {
                    width: 100px;
                }

    #latest-trips .i {
        background: #FFF;
        margin: 0 3px 3px 3px;
    }

        #latest-trips .i ul {
            margin: 0;
            list-style: none;
            list-style-type: none;
            padding: 0;
            cursor: pointer;
            display: block;
            min-width: 750px;
            overflow: auto;
        }

            #latest-trips .i ul:hover {
                background: #CCC;
            }

            #latest-trips .i ul.selected {
                background: #7a2682;
                color: #FFF;
            }

            #latest-trips .i ul li {
                float: left;
                padding: 5px;
                text-align: center;
            }

                #latest-trips .i ul li.f {
                    width: 60px;
                }

                #latest-trips .i ul li.d {
                    width: 150px;
                }

                #latest-trips .i ul li.k {
                    width: 100px;
                }
/*#endregion*/
/*#region Notification Window*/
#notification-window-container {
    position: absolute;
    top: -100px;
    left: -100px;
    z-index: 2500;
    width: 300px;
    height: 46px;
}

    #notification-window-container .envelope {
        position: relative;
        top: -46px;
        left: 0;
        background: #F2F2F2;
        border-radius: 0 0 5px 5px;
    }

    #notification-window-container .actions {
        padding: 5px;
        text-align: center;
    }

    #notification-window-container .message {
        padding: 5px;
        text-align: center;
    }

    #notification-window-container a {
        text-decoration: none;
        font-size: 0.75em;
        color: #7a2682;
        display: inline-block;
        margin-right: 7px;
    }

        #notification-window-container a:hover {
            text-decoration: underline;
            color: #333;
        }
/*#endregion*/
/*#region Mini Languages List */
.mini-languages a {
    color: #7a2682;
    text-decoration: none;
}

    .mini-languages a:hover {
        color: #7a2682;
    }
/*#endregion*/
/*#region Tips and Help*/
.tip-container {
    position: absolute;
    z-index: 1500;
    top: 220px;
    right: 0;
}

    .tip-container .toggle {
        float: left;
        cursor: pointer;
        background: #7a2682 url("https://images.geo-track.com/www/avispefleet/layout.png?v=2.0.1.72") 0 -116px;
        width: 35px;
        height: 33px;
        border-radius: 3px 0 0 3px;
    }

        .tip-container .toggle:hover {
            background-color: #7a2682;
        }

    .tip-container .content {
        float: right;
        background: #666;
        max-width: 300px;
        width: 0;
        color: #FFF;
        line-height: 12px;
    }

    .tip-container .tool-bar {
        margin: 10px;
        text-align: right;
        min-width: 280px;
    }

    .tip-container .hide-button {
        cursor: pointer;
        padding: 0 4px 1px 4px;
        background: #333;
        color: #FFF;
        display: inline-block;
        font-size: 0.8em;
        border-radius: 3px;
        margin-left: 30px;
    }

        .tip-container .hide-button:hover {
            background: #666;
        }

    .tip-container .check-box {
        display: inline-block;
        font-size: 0.8em;
    }

        .tip-container .check-box input {
            cursor: pointer;
        }

    .tip-container .title {
        margin: 10px;
        min-width: 280px;
    }

    .tip-container .body {
        font-size: 0.87em;
        margin: 5px 10px;
        color: #CCC;
        min-width: 280px;
    }
/*#endregion*/
/*#region General Custom Notification Style*/
#notification-sub {
    display: inline-block;
    width: 100%;
}

.notification-title {
    float: left;
}

#notification-lock {
    position: fixed;
    top: 0;
    bottom: 0;
    z-index: 10;
    background: #000;
    width: 100%;
    opacity: 0.25;
    filter: alpha(opacity=25);
    display: none;
}

.notification-window {
    width: 375px;
    height: 165px;
    border-radius: 5px;
    background-color: #FFF;
    border: 1px solid #CCC;
    z-index: 11;
    position: relative;
    display: none;
}

    .notification-window .subtitle {
        color: #0074CC;
        font-family: 'Montserrat';
        font-size: 1.05em;
        font-weight: bold;
        padding: 3px 15px 1px 11px;
        margin-top: 10px;
        border-bottom: 1px solid #7a2682;
    }

    .notification-window .section {
        list-style: none;
        list-style-type: none;
        margin: 8px 2px 7px 12px;
        padding: 0;
    }

    .notification-window ul {
        padding-left: 12px;
    }

        .notification-window ul li {
            margin: 0;
        }

            .notification-window ul li.label {
                color: #666;
                width: 45px;
                margin-right: 10px;
                text-align: left;
                line-height: 18px;
                display: inline-block;
                vertical-align: top;
                font-size: 0.92em;
            }

            .notification-window ul li.input-container {
                display: inline-block;
            }

    .notification-window .notification-toolbar {
        width: 152px;
        margin-left: 10px;
    }

    .notification-window .notification-section #notification_settings_date {
        cursor: pointer;
        border: none;
        background: #0074CC;
        border-radius: 5px;
        text-align: center;
        padding: 2px 0;
        font-size: 0.9em;
        color: #FFF;
    }
/*#endregion*/
/*#region Custom Device Notification Style*/
.device form .add-notification {
    cursor: pointer;
    border: none;
    float: left;
    background: #666;
    color: #FFF;
    width: 130px;
    min-width: 130px;
    max-width: 150px;
    border-radius: 5px;
    text-align: center;
    padding: 2px 0;
    font-size: 0.75em;
    font-weight: 200;
    margin-left: 15px;
}

    .device form .add-notification:hover {
        background: #F2F2F2;
        color: #333;
    }

.device .notification-block {
    max-width: 560px;
    margin: 20px 5px 5px 60px;
    height: auto;
    border-radius: 3px;
    max-height: 157px;
    border: 1px solid #CCC;
    overflow-x: hidden;
    overflow-y: scroll;
}

.device form ul.notification-list-header {
    list-style: none;
    list-style-type: none;
    margin: 0 2px 3px 4px;
    padding: 0;
    font-size: 12px;
}

.device form .notification-list-header li {
    list-style: none;
    display: inline-block;
    background-color: #666;
    color: #FFF;
    border-radius: 3px;
    text-align: center;
}

.device form .notification-list-header #name-header {
    width: 288px;
}

.device form .notification-list-header #date-header {
    width: 100px;
}

.device form .notification-list-header #status-header {
    width: 80px;
}

.device form .notification-list-header #actions-header {
    width: 55px;
}

.device form .heading {
    width: 535px;
    background-color: #666;
    color: #FFF;
    border-radius: 3px;
    text-align: center;
    margin: 3px 2px 2px 4px;
}

.device form ul.notification-list-section {
    list-style: none;
    list-style-type: none;
    margin: 2px 2px 7px 0;
    padding: 0;
    width: 960px;
    min-width: 530px;
    font-size: 12px;
}

.device form .notification-list-section li {
    list-style: none;
    display: block;
    margin: 0 5px 3px 5px;
    background: #F2F2F2;
    height: 25px;
    line-height: 25px;
    border-radius: 3px;
    font-size: 0.85em;
    text-align: left;
}

    .device form .notification-list-section li:hover {
        cursor: pointer;
        background: #CCC;
        color: #333;
    }

    .device form .notification-list-section li div {
        float: left;
    }

.device form .name {
    width: 288px;
    text-align: left;
    padding-left: 4px;
}

.device form .date {
    width: 100px;
    text-align: center;
}

.device form .status {
    width: 80px;
    text-align: center;
    line-height: 28px;
}

.device form .actions {
    width: 55px;
    text-align: center;
}

.device form .notification-list-section li a.delete {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=1.0.2.99") -312px -95px no-repeat;
    width: 16px;
    height: 16px;
    display: inline-block;
    float: right;
    margin: 4px 5px 0 0;
}

.device form .notification-list-section li a.edit {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=1.0.2.99") -293px -95px no-repeat;
    width: 16px;
    height: 16px;
    display: inline-block;
    float: right;
    margin: 4px 5px 0 0;
}

.device form .notification-list-section a.edit:hover {
    opacity: 0.65;
}

.device form .notification-list-section a.delete:hover {
    opacity: 0.65;
}

.device form .phone-input .model-property-name {
    display: none;
}
/*#endregion*/
/*#region Custom Driver Notification Style*/
.driver form .add-notification {
    cursor: pointer;
    border: none;
    float: left;
    background: #666;
    color: #FFF;
    width: 130px;
    min-width: 130px;
    max-width: 150px;
    border-radius: 5px;
    text-align: center;
    padding: 2px 0;
    font-size: 0.75em;
    font-weight: 200;
    margin-left: 15px;
}

    .driver form .add-notification:hover {
        background: #F2F2F2;
        color: #333;
    }

.driver .notification-block {
    max-width: 560px;
    margin: 20px 5px 5px 60px;
    height: auto;
    border-radius: 3px;
    max-height: 157px;
    border: 1px solid #CCC;
    overflow-x: hidden;
    overflow-y: scroll;
}

.driver form ul.notification-list-header {
    list-style: none;
    list-style-type: none;
    margin: 0 2px 3px 4px;
    padding: 0;
}

.driver form .notification-list-header li {
    list-style: none;
    display: inline-block;
    background-color: #666;
    color: #FFF;
    border-radius: 3px;
    text-align: center;
}

.driver form .notification-list-header #name-header {
    width: 288px;
}

.driver form .notification-list-header #date-header {
    width: 100px;
}

.driver form .notification-list-header #status-header {
    width: 80px;
}

.driver form .notification-list-header #actions-header {
    width: 55px;
}

.driver form .heading {
    width: 535px;
    background-color: #666;
    color: #FFF;
    border-radius: 3px;
    text-align: center;
    margin: 3px 2px 2px 4px;
}

.driver form ul.notification-list-section {
    list-style: none;
    list-style-type: none;
    margin: 2px 2px 7px 0;
    padding: 0;
    width: 545px;
    min-width: 530px;
}

.driver form .notification-list-section li {
    list-style: none;
    display: block;
    margin: 0 5px 3px 5px;
    background: #F2F2F2;
    height: 25px;
    line-height: 25px;
    border-radius: 3px;
    font-size: 0.85em;
    text-align: left;
}

    .driver form .notification-list-section li:hover {
        cursor: pointer;
        background: #CCC;
        color: #333;
    }

    .driver form .notification-list-section li div {
        float: left;
    }

.driver form .name {
    width: 288px;
    text-align: left;
    padding-left: 4px;
}

.driver form .date {
    width: 100px;
    text-align: center;
}

.driver form .status {
    width: 80px;
    text-align: center;
    line-height: 28px;
}

.driver form .actions {
    width: 55px;
    text-align: center;
}

.driver form .notification-list-section li a.delete {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=1.0.2.99") -312px -95px no-repeat;
    width: 16px;
    height: 16px;
    display: inline-block;
    float: right;
    margin: 4px 5px 0 0;
}

.driver form .notification-list-section li a.edit {
    background: url("https://images.geo-track.com/www/avispefleet/layout.png?v=1.0.2.99") -293px -95px no-repeat;
    width: 16px;
    height: 16px;
    display: inline-block;
    float: right;
    margin: 4px 5px 0 0;
}

.driver form .notification-list-section a.edit:hover {
    opacity: 0.65;
}

.driver form .notification-list-section a.delete:hover {
    opacity: 0.65;
}
/*#endregion*/
/*#region Commands*/
.confirmation-window .sub {
    color: #7a2682;
    font-family: 'Montserrat';
    font-size: 1.15em;
    font-weight: bold;
    padding: 10px 15px 5px 5px;
    margin-top: 15px;
    border-bottom: 1px solid #7a2682;
    text-align: center;
}
/*#endregion*/
.k-state-selected,
.k-state-selected:link,
.k-state-selected:visited,
.k-list > .k-state-selected,
.k-list > .k-state-highlight,
.k-panel > .k-state-selected,
.k-ghost-splitbar-vertical,
.k-ghost-splitbar-horizontal,
.k-draghandle.k-state-selected:hover,
.k-scheduler .k-scheduler-toolbar .k-state-selected,
.k-scheduler .k-today.k-state-selected,
.k-marquee-color {
    background-color: #666 !important;
    border-color: #666 !important;
    color: #FFF !important;
}

.input {
    background-color: #F2F2F2;
    font-family: 'Montserrat';
    border: 0 !important;
    padding: 8px !important;
    border-radius: 5px;
    box-sizing: border-box !important;
    font-size: 12px;
    height: auto !important;
}

    .input.required {
        border-left: 5px solid #ED1C24 !important;
    }

    .input:focus {
        outline: none;
    }

.codes {
    background-color: #F2F2F2;
    font-family: 'Montserrat';
    border: 0 !important;
    padding: 8px !important;
    border-radius: 5px;
    box-sizing: border-box;
    font-size: 12px;
    height: auto !important;
}

.c-codes {
    background-color: #F2F2F2;
    font-family: 'Montserrat';
    border: 0 !important;
    padding: 8px !important;
    border-radius: 5px;
    box-sizing: border-box;
    font-size: 12px;
    height: auto !important;
}

.phone {
    background-color: #F2F2F2;
    font-family: 'Montserrat';
    border: 0 !important;
    padding: 8px !important;
    border-radius: 5px;
    box-sizing: border-box;
    font-size: 12px;
    height: auto !important;
}

.leaflet-bar {
    box-shadow: 0 0px 9px rgba(0, 0, 0, 0.35);
}

.widget-header {
    background-color: #CCC !important;
    color: #333 !important;
}

.widget-header-device {
    background-color: #FFFFFF !important;
    color: #333 !important;
    display: block !important;
    border: 1px solid #CCC !important;
}

    .widget-header-device .title {
        background-color: #CCC !important;
        color: #333 !important;
        display: inline-block !important;
        width: 320px !important;
    }

  /*.widget-header-device .last-update {
    background-color: #FFF !important;
    color: #333 !important;
    display: inline-block !important;
    width: 135px !important;
    font-size: 0.85em !important;
    text-align: center !important;
  }*/

  .widget-header-device .refresh {
    background: url("https://images.geo-track.com/www/common/icons-16px.png?v=2.0.1.72") 0 -32px no-repeat;
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
    filter: invert(50%);
  }

    .widget-header-device .refresh:hover {
      opacity: 0.85;
      filter: alpha(opacity=85);
    }

  .widget-header-device .refresh-label {
    background-color: #FFF !important;
    color: #333 !important;
    display: inline-block !important;
    width: 50px !important;
    font-size: 0.85em !important;
  }

    .widget-header-device .sound-alerts {
        background: url("https://images.geo-track.com/www/common/icons-16px.png?v=2.0.1.72") 0 -96px no-repeat;
        width: 16px;
        height: 16px;
        display: inline-block;
        vertical-align: middle;
        margin-left: 20px;
        filter: invert(50%);
    }

        .widget-header-device .sound-alerts:hover {
            opacity: 0.85;
            filter: alpha(opacity=85);
        }

        .widget-header-device .sound-alerts.selected {
            background: url("https://images.geo-track.com/www/common/icons-16px.png?v=2.0.1.72") 0 -80px no-repeat;
            filter: invert(50%);
        }

[id$='main-filter'] {
    background-color: #F2F2F2 !important;
    color: #333 !important;
}

    [id$='main-filter'] .selected {
        background-color: #CCC !important;
        color: #333 !important;
    }

[id$='grid-header'] {
    background-color: #CCC !important;
    color: #333 !important;
    font-size: 10px !important;
}

    [id$='grid-header'] ul li {
        color: #333 !important;
    }

.dark-theme .current {
    background: #7a2682 !important;
    color: #FFF !important;
    border: 0 !important;
    cursor: default;
}

.dark-theme a,
.dark-theme span {
    background: none !important;
    border: 0 !important;
    background-color: #666 !important;
}

#alerts-1-grid ul li {
    font-size: 10px !important;
}

#on-event-devices-1-devices .device {
    background: #FFF;
    padding: 20px;
    cursor: pointer;
    -webkit-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
    -o-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
    border-radius: 10px;
    margin: 10px;
    font-size: 12px;
}

#alerts-1-settings,
#gate-settings-button,
[id^='lite-plot'] [id$='-settings'] {
    filter: invert(1) !important;
}

#online-1-devices .device-item .device-details {
    background: #FFF;
    padding: 20px;
    cursor: pointer;
    -webkit-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
    -o-box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0px 9px rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
    border-radius: 10px;
    margin: 10px;
    font-size: 12px;
}

    #online-1-devices .device-item .device-details .imei {
        color: #0074CC !important;
    }

[id$='settings-popup'] {
    border: 1px solid #333 !important;
}

.embeddedServiceHelpButton {
  font-family: 'Montserrat' !important;
}

  .embeddedServiceHelpButton .helpButton {
    bottom: 70px !important;
    right: 20px !important;
  }

    .embeddedServiceHelpButton .helpButton .uiButton {
      border-radius: 50% !important;
      color: #FFF !important;
      background: #0062FE !important;
      width: 20px !important;
      min-width: 20px !important;
      height: 45px !important;
    }

      .embeddedServiceHelpButton .helpButton .uiButton:hover::before, .embeddedServiceHelpButton .helpButton .uiButton:focus::before {
        border-radius: 8px 8px 8px 8px !important;
      }

    .embeddedServiceHelpButton .helpButton .helpButtonEnabled.no-hover:hover::before, .embeddedServiceHelpButton .helpButton .helpButtonEnabled.no-hover:focus::before {
      display: flex !important;
    }

[embeddedservice-chatheader_chatheader-host] {
  background-color: #005290 !important;
  font-family: 'Montserrat' !important;
}

.embeddedServiceLiveAgentStateChatPlaintextMessageDefaultUI.chasitor.plaintextContent {
  background: #005290 !important;
  color: #FFF !important;
  margin-right: 25px !important;
  font-family: 'Montserrat' !important;
}

.embeddedServiceLiveAgentStateChatInputFooter .chasitorControls {
  height: 10px !important;
}

.embeddedServiceSidebar.modalContainer {
  font-family: 'Montserrat' !important;
  bottom: 70px !important;
}

.embeddedServiceSidebar.layout-docked .dockableContainer {
  border-radius: 8px 8px 8px 8px !important;
  bottom: 70px !important;
}

.embeddedServiceLiveAgentStateChatInputFooter .chasitorText {
  font-family: 'Montserrat' !important;
  color: #333 !important;
}

.embeddedServiceLiveAgentStateChatItem .isLightningOutContext .avatar.iconAvatar {
  box-sizing: border-box !important;
}

.embeddedServiceSidebarMinimizedDefaultUI.minimizedContainer:hover {
  background-color: #005290 !important;
  color: #FFF !important;
}

.embeddedServiceSidebarMinimizedDefaultUI {
  background-color: #005290 !important;
  border-color: #005290 !important;
  border-radius: 8px 8px 8px 8px !important;
  bottom: 70px !important;
}

.embeddedServiceSidebarButton {
  background: #005290 !important;
  color: #FFF !important;
  font-family: 'Montserrat' !important;
  margin-right: 25px !important;
  height: 30px !important;
}

  .embeddedServiceSidebarButton.uiButton {
    text-decoration-color: #005290 !important;
    width: 80% !important;
  }

.embeddedServiceSidebarDialogState .dialogButton {
  width: 80% !important;
}

.embeddedServiceSidebarButton.uiButton--inverse .label {
  color: #FFF !important;
}

.embeddedServiceSidebarDialogState .dialogButtonContainer {
  width: 100% !important;
}

.embeddedServiceHelpButton .uiButton .helpButtonLabel {
  display: none !important;
}

.embeddedServiceHelpButton .embeddedServiceIcon {
  position: relative !important;
  z-index: 1 !important;
  display: inline-block !important;
  margin-right: 10px !important;
  line-height: 1 !important;
  vertical-align: top !important;
}

  .embeddedServiceHelpButton .embeddedServiceIcon::before {
    content: url("https://images.geo-track.com/www/avispefleet/chat_button.png") !important;
  }

.embeddedServiceHelpButton .helpButton .helpButtonEnabled:hover::before, .embeddedServiceHelpButton .helpButton .helpButtonEnabled:focus::before {
  top: 13.5px !important;
  left: 12px !important;
  position: absolute !important;
  opacity: 1.0 !important;
  border-radius: 50% !important;
  color: #FFF !important;
  background: #0062FE !important;
  width: 0px !important;
  min-width: 0px !important;
}

.embeddedServiceHelpButton .helpButton .helpButtonEnabled:hover::after, .embeddedServiceHelpButton .helpButton .helpButtonEnabled:focus::after {
  top: 13.5px !important;
  left: 12px !important;
  position: absolute !important;
  opacity: 1.0 !important;
  border-radius: 50% !important;
  color: #FFF !important;
  background: #0062FE !important;
  width: 0px !important;
  min-width: 0px !important;
}

.embeddedServiceLiveAgentStateChatInputFooter .chasitorControls .uiInput {
  height: 15px !important;
}

.embeddedServiceLiveAgentStateChatInputFooter.dynamicResizeTextOneRow {
  height: 60px !important;
  min-height: 60px !important;
}

.embeddedServiceLiveAgentStateChatInputFooter.dynamicResizeTextTwoRows {
  height: auto !important;
  min-height: auto !important;
}

.embeddedServiceLiveAgentStateChatInputFooter.dynamicResizeTextThreeRows, .embeddedServiceLiveAgentStateChatInputFooter.dynamicResizeTextMoreThanThreeRows {
  height: auto !important;
  min-height: auto !important;
}

  .embeddedServiceLiveAgentStateChatInputFooter.dynamicResizeTextMoreThanThreeRows .chasitorText {
    overflow-y: scroll;
    height: 23px !important;
    min-height: 23px !important;
  }

.device-label-online-plate {
    display: none;
}

.gate-name-label {
  color: #666 !important;
  font-family: 'Montserrat' !important;
  font-size: 1.0em !important;
  float: left !important;
}

.last-update-panel {
  visibility: hidden;
  height: 30px;
  width: 460px;
  margin-left: 130px;
  display: flex;
  flex-wrap: wrap;
}

.container-last-update {
  display: flex;
  width: 30px !important;
  padding: 2px 0;
  border-radius: 8px;
  background: #fff;
  row-gap: 30px;
  flex-direction: column;
  align-items: center;
  margin-left: 1px !important;
  margin-right: 1px !important;
  padding-right: 1px !important;
}

.circular-progress {
  position: relative;
  height: 25px;
  width: 25px;
  border-radius: 50%;
  background: conic-gradient(#333 3.6deg, #ededed 0deg);
  display: flex;
  align-items: center;
  justify-content: center;
}

  .circular-progress::before {
    content: "";
    position: absolute;
    height: 21px;
    width: 21px;
    border-radius: 50%;
    background-color: #FFF;
  }

.progress-value {
  position: relative;
  font-family: 'Montserrat';
  font-size: 0.75em;
  color: #333;
  /*background-color: #008000;
  height: 21px;
  width: 21px;
  border-radius: 50%;*/
}

  .progress-value .change-background-color {
    background-color: #008000;
    color: #FFF;
  }

.last-update-hour-date {
  height: 25px;
  width: 300px;
  margin-left: 5px;
}

.container-hour-date {
  background-color: #FFF;
  color: #333;
  display: inline-block;
  width: 300px;
  height: 25px;
}

  .container-hour-date .hour-date {
    font-family: 'Montserrat';
    font-size: 0.75em;
    background-color: #FFF;
    color: #333;
    border: 0;
    width: 300px;
    height: 25px;
  }
