.InformerBox ::-moz-selection { background: transparent; }
.InformerBox ::selection { background: transparent; }

.InformerBox {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    /*border-bottom: 3px solid #0a3826;*/
    font-size: 11px;
    font-family: "DejaVu Sans Mono", "Courier New", monospace;
    font-family: "DroidSansMonoRegular", monospace;
    background: #e3e3e3;
    background: #eeeeee;
    /*z-index: 9000;*/
    height: 0;
    cursor: default;
}

.InformerBox.single {
    height: 18px;
}

.InformerBox.small {
    height: 114px;
    height: 119px;
}

.InformerBox.large {
    height: 320px; /* 20 messages */
    height: 240px; /* 15 messages */
    height: 456px; /* 30 messages */
}

.InformerSliderWrapper {
    background: #aec0b3;
    border-top: 3px solid #aec0b3;
    position: absolute !important;
    top: 1px;
    left: 37px;
    bottom: 1px;
    width: 17px;
}

.InformerSlider {
    position: absolute !important;

    top: 10px;
    left: 37px;
    bottom: 8px;

    top: 0px;
    left: 0px;
    bottom: 0px;
}

.InformerSlider.ui-slider-vertical {
    height: auto !important;
    width: 17px;
    border: 0;
    background: none;
}
.InformerSlider.ui-slider-vertical .ui-slider-range {
    border-top: 3px solid green;
    background: #8baf7e;
    background: transparent;
}
.InformerSlider.ui-slider-vertical .ui-slider-handle {
    display: none;
    height: 14px;
    width: 15px;
    left: 0;
}

.InformerControls {
    position: absolute;
    top: -15px;
    left: 0;
    width: 36px;
    bottom: 0;
    background: url("../images/inf-controls-bgr.png") white repeat-y 50% 50%;
    background: inherit;
    border-right: 1px solid #e0e0e0;
    /*z-index: 10000;*/
}

.InformerControls .control {
    width: 34px;
    height: 18px;
    border: 1px solid #a0a0a0;
    margin-bottom: -1px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-image: none;
    background-color: transparent;
}

.InformerControls .control-large {
    height: 30px !important;
}

.InformerControls .control-hover {
    background-color: #fff !important;
}

.InformerControls .control-dis {
    background-color: #c0c0c0 !important;
}

.InformerControls .control.watch { background-image: url("../images/inf-controls-watch.png"); }
.InformerControls .control.watch.active { background-image: url("../images/inf-controls-watch-a.png"); background-color: #379f00; }
.InformerControls .control.watch.control-dis { background-image: url("../images/inf-controls-watch-d.png"); }
.InformerControls .control.up { background-image: url("../images/inf-controls-up.png"); }
.InformerControls .control.up.control-dis { background-image: url("../images/inf-controls-up-d.png"); }
.InformerControls .control.down { background-image: url("../images/inf-controls-down.png"); }
.InformerControls .control.down.control-dis { background-image: url("../images/inf-controls-down-d.png"); }
.InformerControls .control.first { background-image: url("../images/inf-controls-first.png"); }
.InformerControls .control.first.control-dis { background-image: url("../images/inf-controls-first-d.png"); }
.InformerControls .control.last { background-image: url("../images/inf-controls-last.png"); }
.InformerControls .control.last.control-dis { background-image: url("../images/inf-controls-last-d.png"); }
.InformerControls .control.large { background-image: url("../images/inf-controls-bigger.png"); }
.InformerControls .control.large.control-dis { background-image: url("../images/inf-controls-bigger-d.png"); }
.InformerControls .control.small { background-image: url("../images/inf-controls-smaller.png"); }
.InformerControls .control.small.control-dis { background-image: url("../images/inf-controls-smaller-d.png"); }
.InformerControls .control.single { background-image: url("../images/inf-controls-sngline.png"); }
.InformerControls .control.single.control-dis { background-image: url("../images/inf-controls-sngline-d.png"); }

.InformerTabs {
    position: absolute;
    top: -34px;
    left: 1px;
    right: 0;
    height: 19px;
    background: rgba(201, 201, 201, 0.2);
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    overflow: visible;
}

.InformerTabs .tab {
    display: inline-block;
    position: relative;
    bottom: 0px;
    width: 160px;
    padding: 0 10px 0;
    /*margin-right: 1px;
    */
    background: #4B5E9C;
    /*border: 1px solid rgba(255, 255, 255, 0.75);
    */
    color: #BACFDF;
    line-height: 18px;
}

.InformerTabs .tab:hover {
    color: #f3f3f3;
}

.InformerTabs .tab .info {
    position: absolute;
    bottom: 19px;
    left: 0px;
    background: rgba(250, 255, 160, 1);
    background: #FFF974;
    background: #FFDD86;
    color: #203522;
    font-size: 12px;
    line-height: 12px;
    padding: 5px;
    white-space: nowrap;
    border: 1px dotted #869687;
    border: 1px solid #306136;
    /*border-bottom-width: 0;*/
    border-radius: 6px 6px 6px 0;
}

.InformerTabs .tab .info .period {
    font-weight: bold;
    padding-bottom: 5px;
}

.InformerTabs .tab .info p {
    padding-bottom: 1px;
}

.InformerTabs .tab .info button.speedGraph {
    bottom: 6px;
    right: 10px;
    position: absolute;
    margin-left: 10px;
    font-size: 10px;
}

/*
.InformerTabs .tab .info:hover {
    opacity: .4;
}
*/

.InformerTabs .tab .close {
    position: absolute;
    height: 12px;
    width: 16px;
    top: 2px;
    right: 1px;
    background: url("../images/inf-tab-close-b.png") transparent no-repeat 50% 50%;
    opacity: 0.5;
}

.InformerTabs .tab .close:hover {
    background-image: url("../images/inf-tab-close.png");
    opacity: 1;
}

.InformerTabs .tab.activ {
    background: #404040;
    background: #335cd6;
    color: white;
    /*font-weight: bold;*/
    /*border-color: #d0d0d0;*/
}

.InformerTabs .tab.path {
    /*background: #ffc285;*/
}

.InformerTabs .tab.path.activ {
    background: #ff8533;
    background: #e65c00;
    color: white;
    /*font-weight: bold;*/
    /*border-color: #d0d0d0;*/
}

.InformerHead {
    height: 10px;
    border-width: 1px 0 1px;
    border-style: solid;
    border-color: rgba(11, 56, 36, 0.9);
    color: white;
    background: #11533D;
    font-size: 10px;
    padding: 1px 0 2px;
    position: absolute;
    top: -15px;
    left: 0;
    right: 0;
}

.InformerHead.navigate {
    background: rgba(255, 232, 174, 0.9);
    color: #ff6a00;
    color: #d15c00;
}

/* Informer Head's Text-element */
.InformerHead .text {
    display: inline-block;
    height: 13px;
}

.InformerHead .text.time {
    width: 216px;
    padding-left: 65px;
    font-size: 11px;
    line-height: 12px;
    color: rgba(202, 255, 153, 0.7);
}
.InformerHead .text.number {
    width: 30px;
}
.InformerHead .text.name {
    width: 207px;
}
.InformerHead .text.coord {
    width: 186px;
}
.InformerHead .text.head {
    width: 165px;
}
.InformerHead .text.sat {
    width: 47px;
}
.InformerHead .text.event {
    width: 200px;
}
.InformerHead .text.counter {
    /*
    position: absolute;
    top: 2px;
    right: 3px;
    font-weight: bold;
    color: black;
    color: white;
    text-align: right;
    */

    position: absolute;
    top: 0px;
    right: 10px;
    /*font-weight: bold;*/
    color: white;
    text-align: right;
    font-size: 11px;
    line-height: 11px;
}

.InformerEntries {
    padding-left: 55px;
}

.InformerEntry {
    height: 14px;
    line-height: 14px;
    border-bottom: 1px solid gray;
}

.InformerEntry.selected {
    /*background: #E34400 !important;*/
    background: rgba(255, 92, 0, 0.9) !important;
    color: #fff;
}

.InformerEntry.selected .text.time {
    background: rgba(190, 61, 0, 0.8) !important;
}

.InformerEntry.new {
    background: #b8ff70 !important;
    /* font-weight: bold !important; */
}

/* System messages */

.InformerEntry.message {
    background: transparent;
}

.InformerEntry.message-error {
    background: #b11 !important;
    color: #fff !important;
    /*font-weight: bold !important;*/
}

.InformerEntry.avl.prior_0 {
    background: #ebffd6;
}

.InformerEntry.avl.prior_1 {
    background: #a1e1e1;
}

.InformerEntry.avl.prior_2 {
    background: orange;
}

.InformerEntry.avl.prior_3 {
    background: red;
}

/*
.InformerEntry.info:hover {
    background: #ccff66 !important;
    color: #000 !important;
}

.InformerEntry.event:hover {
    background: #ffdb4d !important;
    color: #000 !important;
}

.InformerEntry.info:hover .text.time {
    background: #5c8a00 !important;
    border-bottom: 1px solid white;
}

.InformerEntry.event:hover .text.time {
    background: #cc9900 !important;
    border-bottom: 1px solid white;
}
*/

/* Informer Entry's Text-element */
.InformerEntry .text {
    display: inline-block;
    padding: 0px 1px 0px;
    font-size: 11px;
    /* line-height: 11px; */
    /*
    -webkit-padding-before: 0px;
    -webkit-padding-after: 2px;
    */
}

/* InformerEntry: Icon */
.InformerEntry .icon {
    display: inline-block;
    width: 13px;
    height: 13px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    /*
    position: relative;
    top: -1px;
    */
}

/* InformerEntry: Time */
.InformerEntry .text.time {
    width: 212px;
    padding-left: 10px;
    background: #394b3f;
    background: rgba(10, 56, 38, .8);
    color: white;
    /*font-weight: bold;*/
    /*text-shadow: #444 1px 1px 0px;*/
}

/* InformerEntry: Object's Number */
.InformerEntry .text.number {
    width: 23px;
    /*font-weight: bold;*/
}

/* InformerEntry: Object's Name */
.InformerEntry .text.name {
    width: 200px;
    /*font-weight: bold;*/
}

/* InformerEntry: The border for controls */
.InformerHead .border,
.InformerEntry .border {
    display: inline-block;
    width: 30px;
    width: 0;
    height: 14px;
}

/* InformerEntry: Coordinates */
.InformerEntry .icon.coord {
    background-image: url("../images/inf-icon-coord.png");
}
.InformerEntry .text.coord {
    width: 160px;
}

/* InformerEntry: Moving */
.InformerEntry .icon.head {
    background-image: url("../images/inf-icon-head.png");
}
.InformerEntry .icon.speed {
}
.InformerEntry .icon.speed.park {
    background-image: url("../images/inf-icon-park.png");
}
.InformerEntry .icon.speed.stop {
    background-image: url("../images/inf-icon-stop.png");
}
.InformerEntry .text.head {
    width: 120px;
}

/* InformerEntry: Satellite */
.InformerEntry .icon.sat {
    background-image: url("../images/inf-icon-sat.png");
}
.InformerEntry .text.sat {
    width: 20px;
}

/* InformerEntry: Sensor */
.InformerEntry .icon.sens {
    background-image: url("../images/inf-icon-sens.png");
}
.InformerEntry .text.sens {
    /*width: 100px;*/
}

/* InformerEntry: Geofence */
.InformerEntry .icon.geof {
    background-image: url("../images/inf-icon-geof.png");
}
.InformerEntry .text.geof {
    /*width: 300px;*/
}
/* InformerEntry: Position */
.InformerEntry .icon.posit {
    background-image: url("../images/inf-icon-posit.png");
}
/* InformerEntry: Alarm */
.InformerEntry .icon.alarm {
    background-image: url("../images/inf-icon-alarm.png");
}