/*
* @ PROJECT F3
* @ AUTNOR ZoomWell Team
* @ LINK WWW.ZWLBS.COM
*/
body {
    /*user-select: none;*/
    /*-ms-user-select: none;*/
    /*-moz-user-select: none;*/
    /*-webkit-user-select: none;*/
    width: 100vw
}

video {
    background-repeat: no-repeat;
    background-position: center;
    /* background-size: 15%; */
    background-image: none !important;
}

.btn:focus,
.btn:active:focus,
.btn.active:focus {
    outline: none;
}

.input-group label.error {
    white-space: nowrap;
}

#downloadDataTable button {
    padding: 4px 12px;
}

#fastInstructions {
    position: fixed;
    display: none;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 0 15px 0 255px;
    z-index: 9999;
}

.myHolder {
    position: absolute;
    top: 0;
    left: 127px;
    cursor: text;
    font-size: 13px;
    line-height: 37px;
    color: rgb(153, 153, 153);
}

#fastInstructions img {
    width: 100%;
    margin-top: 148px;
    min-height: 410px;
    transition: all ease-in .4s;
}

#fastStartGuide {
    width: 17px;
    cursor: pointer;
    vertical-align: -3px
}

.verticalLabel {
    cursor: pointer;
}

.verticalLabel input {
    vertical-align: -1px;
}

/*html{overflow-y: scroll;}
:root{overflow-y: auto;overflow-x: hidden;}
:root body{position: absolute;}*/
body {
    position: absolute;
    overflow-x: hidden;
}

.tooltip {
    font-weight: normal
}

select.form-control {
    padding: 6px 40px 6px 11px
}

#noticeBox1 ul:after,
#noticeBox1 ul:before {
    left: 45% !important;
}

.user-nav #noticeBtn {
    position: relative;
    z-index: 9;
}

.redIcon {
    position: absolute;
    display: none;
    z-index: 10;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #E50C0C;
    top: 2px;
    left: 2px;
}

#newMsgTitle {
    position: absolute;
    display: none;
    width: 0;
    opacity: 0;
    top: -2px;
    right: -3px;
    padding-left: 20px;
    height: 42px;
    line-height: 42px;
    color: #fff;
    z-index: 1;
    cursor: pointer;
    border-radius: 20px;
    box-sizing: border-box;
    background: rgba(0, 0, 0, .6);
}

.topNotice {
    position: relative;
    line-height: 38px !important;
    margin-right: 10px !important;
    padding: 0 !important;
    height: 38px;
    width: 35px;
    line-height: 35px;
    margin-right: 5px;
}

.topNotice > span {
    position: absolute;
    display: none;
    z-index: 10;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #E50C0C;
    color: #fff;
    text-align: center;
    top: 2px;
    left: 2px;
    font-size: 12px;
}

.topNotice > button {
    outline: none !important;
}

.fixed-width {
    width: 74px !important;
}

/*首页定制导航*/
.homeListBottom {
    position: relative;
    display: block
}

.homeListBottom:hover .innerShadowGrey {
    border: 1px solid #9a9fa4;
    box-shadow: 0 0 5px #32323a
}

.homeListBottom:hover .operBtn {
    display: block
}

.operBtn {
    position: absolute;
    top: 9px;
    width: 20px;
    height: 20px;
    font-style: normal;
    display: none;
    color: #0d9bf2;
    cursor: pointer;
}

.operBtn.editButton {
    left: 25px;
    background: url("/clbs/resources/img/noEdit.svg") no-repeat
}

.operBtn.editButton:hover {
    background: url("/clbs/resources/img/okEdit.svg") no-repeat
}

.operBtn.delBtn {
    right: 20px;
    background: url("/clbs/resources/img/noDel.svg") no-repeat
}

.operBtn.delBtn:hover {
    background: url("/clbs/resources/img/okDel.svg") no-repeat
}

#container {
    background: #32323a;
    width: 100%;
    z-index: 0;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.main-content-wrapper {
    margin-left: 240px;
    margin-right: 0;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    background: #f1f2f7
}

.sidebar {
    margin-left: -240px;
    float: left;
    width: 240px;
    height: 100%;
    background: #32323a;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    z-index: 100;
    height: calc(100vh - 80px);
    overflow-y: auto;
}

/*.sidebar:hover::-webkit-scrollbar-track {*/
/*    background: #eee;*/
/*}*/
.sidebar:hover::-webkit-scrollbar-thumb {
    background: #aaa;
}

/* 滚动槽 */
.sidebar::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.sidebar::-webkit-scrollbar-track {
    border-radius: 3px;
    background: rgba(0, 0, 0, 0.06);
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.08);
}

/* 滚动条滑块 */
.sidebar::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background: rgba(0, 0, 0, 0.12);
    -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.2);
}

#main-content .eightIsZero {
    height: 0
}

footer {
    max-height: 46px;
    background: #fff;
    width: 100%;
    text-align: center
}

footer .imitateMenuBg {
    background: #32323a;
    width: 240px;
    height: 46px;
    float: left;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

footer .imitateMenuBg-left {
    margin-left: -240px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

footer .defaultFootBg p {
    color: #7A7676;
    font-size: 12px;
    margin: 6px
}

footer .defaultFootBg a {
    color: #7A7676;
    font-size: 12px;
    font-size: 12px
}

footer .defaultFootBg {
    width: calc(100% - 240px);
    float: right;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    position: relative;
}

footer .defaultFootBg .zoom {
    position: absolute;
    right: 10px;
    top: 10px;
    font-size: 20px;
    font-weight: bold;
    cursor: pointer;
    padding: 0 5px;
}

footer .defaultFootBg .zoom:hover {
    border: 1px solid gray;
    border-radius: 5px;
}

.bigger-smaller {
    height: 190px;
    width: auto;
    margin-right: 15px;
}

footer .defaultFootBg-left {
    width: 100%
}

.disabled-btn {
    background-color: #bdc3c7 !important
}

#bingListClick,
#gpsTable3 tbody tr,
#groupSelectSpan,
#header .brand,
#header .btn-default .fa-bars,
#header .btn-default .fa-comment,
#parameterHead,
#searchDevices-id li,
#sensorBasisInfo,
#sensorBasisInfoTwo,
#stretch,
#stretch2,
#stretch3,
#tableDataExport,
#tankBasisInfo,
#tankBasisInfoTwo,
#vIcoManagement .vIcoContainer:hover,
#zTreeCitySelSpan,
.add-button-left,
.add-button-right,
.areaTool,
.btn-videoRealTime .mapBtn,
.container-area i.left-btn,
.container-area i.right-btn,
.dd-item > button,
.delIcon,
.disSetMenu p,
.measurementMenu p,
.fa-question-circle,
.fenceTurnoverTime,
.hiddenparameter,
.inpVicoPhoto input[type=file],
.isQueryShow,
.lngLat_show,
.mapDropSettingMenu p,
.monitoringSelect,
.panel .actions i:hover,
.panel-default .actions i:hover,
.report-group .report-group-more:hover,
.report-speed .report-speed-more:hover,
.report-stoptime .report-stoptime-more:hover,
.report-time .report-time-more:hover,
.select,
.send-options,
.slider-handle.round,
.toolClick,
.toopTip-btn-left,
.toopTip-btn-right,
.traceTo,
.wizard ul li.complete:hover {
    cursor: pointer
}

#baseStationParameters,
#clock .PTclock,
#connectSpecifyServer,
#connectSpecifyServerModal,
#dataTableBoxlist2,
#dataTableBoxlist3,
#dataTableBoxlist4,
#dataTableBoxlist5,
#editReportModal,
#eventSetting,
#eventSettingModal,
#fenceBindTable,
#form-group-bcc,
#form-group-cc,
#gnssParameters,
#gnssParametersModal,
#hiddenText,
#infoDemandMenu,
#infoDemandMenuModal,
#leftside-navigation ul ul,
#locationReporting,
#locationReportingModal,
#phoneBookSetting,
#phoneBookSettingModal,
#reportParameters,
#sensorBasisInfo-content,
#sensorBasisInfoTwo-content,
#tankBasisInfo-content,
#tankBasisInfoTwo-content,
#telephoneParameters,
#telephoneParametersModal,
#terminalControl,
#terminalParameters,
#terminalParametersModal,
#terminalSearch,
#unlimitedUpgrade,
#unlimitedUpgradeModal,
#videoCameraParameters,
#videoCameraParametersModal,
.ToolPanel .layDateBox1,
.areaSearchTable,
.cutBtn,
.dd-collapsed .dd-list,
.echartArea,
.hideTableFooter,
.mail-option ul li,
.step-content .step-pane,
.tableReturn,
.timeline-item.left:before,
.warningDeal {
    display: none
}

.modal-body-per {
    position: relative;
    padding: 20px
}

.info-isCompany {
    background-image: url(/clbs/resources/js/zTree/css/img/zTreeStandard.svg);
    background-position: -110px 0;
    height: 16px;
    width: 16px;
    display: inline-block;
    vertical-align: sub
}

.info-isGroup {
    background-image: url(/clbs/resources/js/zTree/css/img/group.svg);
    background-repeat: no-repeat;
    background-position: 2px 1px;
    height: 16px;
    width: 16px;
    display: inline-block;
    vertical-align: text-bottom
}

.modal-body-overflow {
    overflow-y: auto;
    overflow-x: hidden
}

.main-content-wrapper-white {
    background-color: #fff !important
}

.fence-enterprise-select {
    position: absolute;
    top: 0;
    right: 16px;
    width: 34px;
    height: 35px;
    text-align: center;
    line-height: 35px
}

.ioStateShow {
    height: 36px;
    line-height: 36px
}

.ioStateInfo {
    background: url(/clbs/resources/img/ioState.svg) no-repeat;
    width: 117px;
    height: 30px;
    background-position: 0 -64px;
    display: inline-block;
    vertical-align: middle
}

.iostateinfoOn {
    background: url(/clbs/resources/img/ioState.svg) no-repeat;
    width: 117px;
    height: 30px;
    background-position: 0 -32px;
    display: inline-block;
    vertical-align: middle
}

.iostateinfoOff {
    background: url(/clbs/resources/img/ioState.svg) no-repeat;
    width: 117px;
    height: 30px;
    background-position: 0 0;
    display: inline-block;
    vertical-align: middle
}

.OpenandclosOn {
    background: url(/clbs/resources/img/Openandclos.svg) no-repeat;
    width: 117px;
    height: 30px;
    background-position: 0 0;
    display: inline-block;
    vertical-align: middle
}

.OpenandclosOff {
    background: url(/clbs/resources/img/Openandclos.svg) no-repeat;
    width: 117px;
    height: 30px;
    background-position: 0 -32px;
    display: inline-block;
    vertical-align: middle
}

#vehicleIcoShow .container-area {
    padding: 0 10px 0 10px
}

#vIcoManagement #vlength {
    padding: 0
}

#vIcoManagement #vIcoTypeNum {
    overflow-x: auto;
    height: 365px;
    padding: 0
}

#vIcoManagement .vicopadd {
    padding: 0
}

#vIcoManagement #vIcoTypeNum .vIcoTypePages {
    width: 100%;
    display: inline-block
}

#vIcoManagement .vIcoContainer {
    width: 96px;
    height: 96px;
    float: left;
    background: url(/clbs/resources/img/vico/vBorder.png) no-repeat;
    margin: 10px 10px 0 0;
    text-align: center
}

#vIcoManagement .vIcoCChecked {
    background: url(/clbs/resources/img/vico/vClickCheck.png) no-repeat !important
}

#vIcoManagement .vIcoContainer:hover {
    background: url(/clbs/resources/img/vico/vBorderHover.png) no-repeat
}

#vIcoManagement .vIcoContainer .vico {
    width: 96px;
    height: 96px;
    display: table-cell;
    vertical-align: middle;
    text-align: center
}

#vIcoManagement .vIcoContainer .vicoDel {
    position: relative;
    right: -30px;
    top: -30px;
    display: none
}

.vIcoPages {
    margin: 26px 0 0 0
}

.inpVicoPhoto {
    width: 96px;
    height: 96px;
    position: relative;
    margin: 10px 0 10px 0;
    float: left
}

.thisVIcoInfo {
    width: 96px;
    height: 96px;
    float: left;
    background: url(/clbs/resources/img/vico/vIcoDefault.png) no-repeat;
    margin: 10px 10px 0 10px;
    text-align: center
}

.thisVIcoInfo .vico {
    width: 96px;
    height: 96px;
    display: table-cell;
    vertical-align: middle;
    text-align: center
}

.inpVicoPhoto input[type=file] {
    height: 96px;
    width: 96px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9;
    opacity: 0;
    filter: alpha(opacity=0)
}

.warningTypeArea {
    max-height: 100px;
    overflow: auto
}

#drivenRoute {
    width: 450px
}

#drivenRoute .modal-body {
    padding: 15px
}

#drivenRoute .modal-body .row,
#fixedTimeArea .modal-body .row {
    margin-left: 0;
    margin-right: 0;
    max-height: 350px;
    overflow-y: auto;
    overflow-x: hidden
}

#drivenRoute .modal-footer {
    margin-top: 15px;
    padding: 0;
    border: none
}

#drivenRoute .title,
#drivenRoute .subsection-info .title {
    text-align: center;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: 1px;
}

#drivenRoute .line-start-point {
    border-bottom: 1px solid #6dcff6;
}

#drivenRoute .line-start-point span:first-child {
    color: #6dcff6;
}

#drivenRoute .line-start-point span:last-child,
#drivenRoute .line-end-point span:last-child,
#drivenRoute .line-way-point span:last-child {
    color: #c4c4c4;
    font-size: 14px;
}

#drivenRoute .line-way-point {
    border-bottom: 1px solid #0a0a0a;
}

#drivenRoute .line-way-point span:first-child {
    color: #0a0a0a;
}

#drivenRoute .line-end-point {
    border-bottom: 1px solid red;
}

#drivenRoute .line-end-point span:first-child {
    color: red;
}

#drivenRoute .subsection-info {
    position: absolute;
    top: 0;
    right: 0;
    width: 450px;
    transition: right 0.2s ease-in;
    z-index: -1;
}

#drivenRoute .subsection-info.active {
    right: -450px
}

#drivenRoute .subsection-info .form-horizontal {
    margin-top: 10px;
}

#drivenRoute .subsection-info .form-horizontal div.row {
    height: 390px;
    max-height: 390px !important;
}

#drivenRoute .driven-route-warning {
    background-color: #ffff80;
    color: orange;
    text-align: center;
    padding: 5px 0;
    margin-bottom: 10px;
}

#fixedTimeArea .modal-body {
    padding: 20px 15px 5px;
}

#fixedTimeArea form {
    padding-left: 6px;
}

#fixedTimeArea form .fastClear {
    padding-right: 23px;
}

#fixedTimeArea .modal-footer {
    padding: 15px;
    border-top: 1px solid #e5e5e5;
}

.delArea {
    background-image: url(/clbs/resources/img/delIcon1.svg) !important;
    position: absolute;
    width: 16px;
    height: 16px;
    z-index: 999;
    top: 10px;
    right: 19px;
    cursor: pointer;
}

#drivenRoute {
    position: absolute;
    top: 7px;
    left: 7px;
    z-index: 9999;
    display: none
}

#MapContainer .menu-icon.menu-icon-from {
    background-position: -95px -39px
}

#MapContainer .menu-icon.menu-icon-via {
    background-position: -126px -39px
}

#MapContainer .menu-icon.menu-icon-to {
    background-position: -158px -39px
}

#MapContainer .menu-icon {
    background: url(/clbs/resources/img/icon_dir.png) no-repeat;
    background-size: 281px 219px;
    display: inline-block;
    width: 22px;
    height: 22px;
    vertical-align: middle;
    margin-top: -4px
}

.icon-clearmap {
    background: url(/clbs/resources/img/clear.svg) no-repeat;
    width: 22px;
    height: 22px;
    background-size: 19px 19px;
    display: inline-block;
    vertical-align: middle
}

.amap-menu-outer li:last-child {
    border-top: 1px solid #ccc;
    margin-top: 5px
}

.realTimeCanArea {
    border-bottom-right-radius: 8px;
    box-shadow: 1px 1px 3px #ccc;
    display: none;
    background-color: #fff;
    width: 355px;
    z-index: 1;
    position: relative;
    top: 338px;
    padding: 20px 20px 5px 20px;
    border: 1px solid #6dcff6;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.rtcaHidden {
    margin-left: -357px
}

.areaTool {
    box-shadow: 1px 1px 3px #ccc;
    position: absolute;
    right: -44px;
    top: -1px;
    background-color: #6dcff6;
    color: #fff;
    padding: 20px 15px 20px 15px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px
}

.areaTool .fa-search {
    position: relative;
    top: -25px;
    left: -3px
}

.areaTool .fa-search::before {
    content: "";
    position: absolute;
    display: inline-block;
    background-image: url(/clbs/resources/img/tcSearch.svg) !important;
    width: 20px;
    height: 20px;
    background-size: 20px 20px
}

.areaTool span {
    position: relative;
    top: 10px
}

#administrativeArea .modal-dialog,
#drivenRoute .modal-dialog {
    margin: 90px 325px
}

#showAlarmPoint,
#showStopPoint {
    margin: 10px 0 0 20px;
    display: none
}

#chooseAlarmPoint,
#chooseStopPoint {
    vertical-align: text-top
}

.form-control-number {
    -moz-appearance: textfield
}

.form-control-number::-webkit-inner-spin-button,
.form-control-number::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.dropdown.pull-left.open > ul {
    margin-top: -2px !important
}

.keep-open.btn-group.open > ul {
    margin-top: -2px !important
}

.selectCar {
    background: url(/clbs/resources/img/Car.svg) no-repeat;
    width: 40px;
    height: 40px;
    background-size: 40px 40px
}

.selectCar.activeIcon {
    background: url(/clbs/resources/img/CCar.svg) no-repeat;
    width: 40px;
    height: 40px;
    background-size: 40px 40px
}

.selectPeople {
    background: url(/clbs/resources/img/People.svg) no-repeat;
    width: 40px;
    height: 40px;
    background-size: 40px 40px
}

.selectPeople.activeIcon {
    background: url(/clbs/resources/img/CPeople.svg) no-repeat;
    width: 40px;
    height: 40px;
    background-size: 40px 40px
}

.selectThing {
    background: url(/clbs/resources/img/Thing.svg) no-repeat;
    width: 40px;
    height: 40px;
    background-size: 40px 40px
}

.selectThing.activeIcon {
    background: url(/clbs/resources/img/CThing.svg) no-repeat;
    width: 40px;
    height: 40px;
    background-size: 40px 40px
}

#chooseCar,
.chooseCar {
    position: absolute;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
    z-index: -1
}

#choosePeople,
.choosePeople {
    position: absolute;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
    z-index: -1
}

#chooseThing,
.chooseThing {
    position: absolute;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
    z-index: -1
}

label i.delIcon {
    right: 66px
}

.input-group i.delIcon {
    right: 42px
}

.inpSearchWid i.delIcon {
    right: 6px
}

input::-webkit-contacts-auto-fill-button {
    visibility: hidden;
    display: none !important;
    pointer-events: none;
    height: 0;
    width: 0;
    margin: 0
}

#dropdownMenuOther {
    margin-top: -4px;
    padding-left: 14px !important
}

#DisDropdownMenuOther {
    margin-top: -4px;
    padding-left: 14px !important;
    background-color: #bdc3c7;
    cursor: default;
}

#dropdownMenuOther:hover {
    color: #fff;
    background-color: #26a2e4
}

#dropdownMenuContentFluxsensor {
    background-color: #f5f5f5;
    min-width: 100px;
    border: 1px solid #cdd0d3;
    box-shadow: 1px 2px 8px #ccc;
    width: 505px;
    margin-top: 2px
}

#dropdownMenuContentFluxsensor > li {
    float: left
}

#dropdownMenuContentFluxsensor > li > a {
    color: #a1a7a9 !important;
    text-align: left;
    padding: 3px 5px
}

#dropdownMenuContentFluxsensor > li > a:hover {
    background-color: #a1a7a9;
    color: #fff !important
}

#dropdownMenuContent {
    background-color: #f5f5f5;
    min-width: 100px;
    border: 1px solid #cdd0d3;
    box-shadow: 1px 2px 8px #ccc;
    width: 591px;
    margin-top: 2px
}

#dropdownMenuContent > li {
    float: left
}

#dropdownMenuContent > li > a {
    color: #a1a7a9 !important;
    text-align: left;
    padding: 3px 5px
}

#dropdownMenuContent > li > a:hover {
    background-color: #a1a7a9;
    color: #fff !important
}

#dropdownMenu809Param {
    background-color: #f5f5f5;
    min-width: 100px;
    border: 1px solid #cdd0d3;
    box-shadow: 1px 2px 8px #ccc;
    width: 550px;
    margin-top: 2px
}

#dropdownMenu809Param > li {
    float: left
}

#dropdownMenu809Param > li > a {
    color: #a1a7a9 !important;
    text-align: left;
    padding: 3px 5px
}

#dropdownMenu809Param > li > a:hover {
    background-color: #a1a7a9;
    color: #fff !important
}

.btn-oc-width {
    width: 100%
}

.fa-more::before {
    content: "";
    background-image: url(/clbs/resources/img/fa-more.svg);
    width: 15px;
    height: 15px;
    display: block;
    position: absolute;
    top: 8px;
    left: 8px;
    margin-right: 13px
}

.btn-setting-width {
    width: 69.45px
}

#customizeColumns,
#customizeColumnsTwo {
    border-radius: 3px
}

.report-para-footer,
.report-para-footer-control,
.report-para-footer-control-1 {
    border: none;
    margin: 0 !important;
    display: none
}

#terminalControl .tc-cl-align {
    text-align: left !important;
    font-weight: 300 !important
}

#terminalControl .btn-tc-wid {
    width: 140px
}

.btn-realtime-command-send {
    width: 165px
}

.panel-right-border {
    border-left: 1px solid #eff2f7;
    min-height: 365px
}

.inp-inline-flex {
    display: inline-flex
}

#controlClose,
#controlCloseAll,
#controlReset,
#controlRestore,
#controlShutDown {
    padding: 4px 16px 4px 16px !important;
    display: none
}

.btn-edit-modal {
    padding: 4px 16px 4px 16px !important
}

#showMedia {
    height: 535px;
    margin: 0 auto;
    display: none;
    text-align: center
}

#showMedia video {
    width: 100%
}

.original-handle {
    padding: 4px 8px !important;
    background: #f7f7f9 !important;
    color: #8a8686 !important
}

.original-handle:hover {
    background: #6dcff6 !important;
    color: #fff !important
}

.carNameContent {
    width: 76px;
    height: 22px;
    color: #000;
    background: #fff;
    text-align: center;
    line-height: 22px;
    border-radius: 2px;
    border: 1px solid #000
}

.carNameShowRD {
    position: relative;
    display: inline-block;
    background-color: rgba(40, 40, 46, .8);
    border-radius: 7px;
    padding: 0 10px 0 9px;
    height: 28px;
    line-height: 29px;
    text-align: center;
    color: #fff;
    font-size: 12px !important;
    white-space: nowrap;
    word-wrap: normal;
}

.carNameShowRD:after {
    content: "";
    position: absolute;
    left: -11px;
    top: -11px;
    /*right: -11px;*/
    /*bottom: -11px;*/
    width: 0;
    height: 0;
    border: 6px solid transparent;
    /*border-left-color: rgba(40, 40, 46, .8);*/
    border-right-color: rgba(40, 40, 46, .8);
    /*border-top-color: rgba(40, 40, 46, .8);*/
    /*border-bottom-color: rgba(40, 40, 46, .8);*/
    transform: rotate(45deg);
    border-radius: 4px;
}

.carNameShowRU {
    position: relative;
    display: inline-block;
    background-color: rgba(40, 40, 46, .8);
    border-radius: 7px;
    padding: 0 10px 0 9px;
    height: 28px;
    line-height: 29px;
    text-align: center;
    color: #fff;
    font-size: 12px !important;
    white-space: nowrap;
    word-wrap: normal;
}

.carNameShowRU:after {
    content: "";
    position: absolute;
    left: -11px;
    /*top: -11px;*/
    /*right: -11px;*/
    bottom: -11px;
    width: 0;
    height: 0;
    border: 6px solid transparent;
    /*border-left-color: rgba(40, 40, 46, .8);*/
    /*border-right-color: rgba(40, 40, 46, .8);*/
    border-top-color: rgba(40, 40, 46, .8);
    /*border-bottom-color: rgba(40, 40, 46, .8);*/
    transform: rotate(45deg);
    border-radius: 4px;
}

.carNameShowLU {
    position: relative;
    display: inline-block;
    background-color: rgba(40, 40, 46, .8);
    border-radius: 7px;
    padding: 0 10px 0 9px;
    height: 28px;
    line-height: 29px;
    text-align: center;
    color: #fff;
    font-size: 12px !important;
    white-space: nowrap;
    word-wrap: normal;
}

.carNameShowLU:after {
    content: "";
    position: absolute;
    /*left: -11px;*/
    /*top: -11px;*/
    right: -11px;
    bottom: -11px;
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-left-color: rgba(40, 40, 46, .8);
    /*border-right-color: rgba(40, 40, 46, .8);*/
    /*border-top-color: rgba(40, 40, 46, .8);*/
    /*border-bottom-color: rgba(40, 40, 46, .8);*/
    transform: rotate(45deg);
    border-radius: 4px;
}

.carNameShowLD {
    position: relative;
    display: inline-block;
    background-color: rgba(40, 40, 46, .8);
    border-radius: 7px;
    padding: 0 10px 0 9px;
    height: 28px;
    line-height: 29px;
    text-align: center;
    color: #fff;
    font-size: 12px !important;
    white-space: nowrap;
    word-wrap: normal;
}

.carNameShowLD:after {
    content: "";
    position: absolute;
    /*left: -11px;*/
    top: -11px;
    right: -11px;
    /*bottom: -11px;*/
    width: 0;
    height: 0;
    border: 6px solid transparent;
    /*border-left-color: rgba(40, 40, 46, .8);*/
    /*border-right-color: rgba(40, 40, 46, .8);*/
    /*border-top-color: rgba(40, 40, 46, .8);*/
    border-bottom-color: rgba(40, 40, 46, .8);
    transform: rotate(45deg);
    border-radius: 4px;
}

.carStateStop {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #c80002;
    border: 1px solid #fba7a7
}

.carStateRun {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #78af3a;
    border: 1px solid #b9fd6f
}

.carStateAlarm {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #ffab2d;
    border: 1px solid #fedba7
}

.carStateMiss {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #754801;
    border: 1px solid #d3b78a
}

.carStateOverSpeed {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #960ba3;
    border: 1px solid #eb90f4
}

.carStateheartBeat {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #fb8c96;
    border: 1px solid #fb8c96
}

.carStateheartbeat {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #fb8c96;
    border: 1px solid #fb8c96
}

.carStateOffLine {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #b6b6b6;
    border: 1px solid #ebebeb
}

.carStateStop,
.carStateRun,
.carStateAlarm,
.carStateMiss,
.carStateOverSpeed,
.carStateheartBeat,
.carStateOffLine {
    margin-right: -3px;
}

.monitorNameBox {
    display: inline-block;
    width: auto;
    max-width: 70px;
    vertical-align: top;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#bingListClick {
    position: relative;
    top: -15px
}

.car-state-area {
    position: absolute;
    top: 37px;
    right: 5px;
    z-index: 99999999
}

#recentlyC {
    margin-top: 1px;
    max-height: 200px;
    background-color: #fff;
    overflow: auto;
    padding-right: 5px;
}

.carStateShow {
    color: #464644;
    height: 25px;
    line-height: 25px;
    margin: 0;
    text-align: left;
    padding: 0 15px;
    white-space: nowrap
}

.firstState {
    background-color: #6dcff6;
    color: #fff;
    height: 30px;
    line-height: 30px;
    margin: 0;
    width: 150px;
    display: none;
    text-align: center
}

.sectionPointIcon {
    background: url(/clbs/resources/img/sectionMarker.png);
    background-repeat: no-repeat;
    width: 19px;
    height: 25px;
    color: #fff;
    font-weight: 800;
    text-align: center
}

#panDefLeft .panel-heading {
    padding: 10px 15px 0 15px;
    border-bottom: none
}

#areaSearchCar .form-horizontal {
    height: 500px;
    overflow: auto
}

.fenceTc-realtime {
    text-align: center
}

.toolClickArea {
    position: absolute;
    z-index: 1001;
    top: 4px;
    right: 10px;
    overflow: hidden
}

.toolClick {
    width: 36px;
    height: 36px;
    line-height: 32px;
    position: relative;
    top: 0;
    right: 0;
    float: right;
    background-color: #fff;
    text-align: center;
    border-radius: 3px;
    display: inline-block;
    z-index: 999;
    border: 1px solid #c4c4c4;
    box-shadow: 2px 2px 2px #c4c4c4
}

.toolClick img {
    width: 20px;
    height: 20px
}

.toolOperateClick {
    border: 1px solid #c4c4c4;
    box-shadow: 2px 2px 2px #c4c4c4;
    background-color: #fff;
    height: 36px;
    line-height: 36px;
    border-radius: 3px;
    display: inline-block;
    float: right;
    margin-right: -702px
}

.toolOperateClick.tool-phoneCall {
    margin-right: -1600px;
}

.toolOperateClick .map-magnify::before {
    content: "";
    position: relative;
    display: inline-block;
    top: 4px;
    left: 0;
    width: 19px;
    height: 19px;
    background-image: url(/clbs/resources/img/magnify.svg) !important;
    background-size: 19px 19px
}

.toolOperateClick .map-magnify.active::before {
    content: "";
    position: relative;
    display: inline-block;
    top: 4px;
    left: 0;
    width: 19px;
    height: 19px;
    background-image: url(/clbs/resources/img/magnifyActive.svg) !important;
    background-size: 19px 19px
}

.toolOperateClick .map-shrink::before {
    content: "";
    position: relative;
    display: inline-block;
    top: 4px;
    left: 0;
    width: 19px;
    height: 19px;
    background-image: url(/clbs/resources/img/shrink.svg) !important;
    background-size: 19px 19px
}

.toolOperateClick .map-shrink.active::before {
    content: "";
    position: relative;
    display: inline-block;
    top: 4px;
    left: 0;
    width: 19px;
    height: 19px;
    background-image: url(/clbs/resources/img/shrinkActive.svg) !important;
    background-size: 19px 19px
}

.toolOperateClick .map-count::before {
    content: "";
    position: relative;
    display: inline-block;
    top: 4px;
    left: 0;
    width: 19px;
    height: 19px;
    background-image: url(/clbs/resources/img/count.svg) !important;
    background-size: 19px 19px
}

.toolOperateClick .map-count.active::before {
    content: "";
    position: relative;
    display: inline-block;
    top: 4px;
    left: 0;
    width: 19px;
    height: 19px;
    background-image: url(/clbs/resources/img/countActive.svg) !important;
    background-size: 19px 19px
}

.toolOperateClick .map-query::before {
    content: "";
    position: relative;
    display: inline-block;
    top: 4px;
    left: 0;
    width: 19px;
    height: 19px;
    background-image: url(/clbs/resources/img/query.svg) !important;
    background-size: 19px 19px
}

.toolOperateClick .map-query.active::before {
    content: "";
    position: relative;
    display: inline-block;
    top: 4px;
    left: 0;
    width: 19px;
    height: 19px;
    background-image: url(/clbs/resources/img/queryActive.svg) !important;
    background-size: 19px 19px
}

.toolOperateClick .map-video::before {
    content: "";
    position: relative;
    display: inline-block;
    top: 6px;
    left: 0;
    width: 22px;
    height: 22px;
    background-image: url(/clbs/resources/img/realTimeVideo.svg) !important;
    background-size: 22px 22px
}

.toolOperateClick .map-video.active::before {
    content: "";
    position: relative;
    display: inline-block;
    top: 6px;
    left: 0;
    width: 22px;
    height: 22px;
    background-image: url(/clbs/resources/img/realTimeVideoActive.svg) !important;
    background-size: 22px 22px
}

.toolOperateClick .map-displaySetting::before,
.btn-videoRealTime .map-displaySetting::before {
    content: "";
    position: relative;
    display: inline-block;
    top: 4px;
    left: 0;
    width: 19px;
    height: 19px;
    cursor: pointer;
    background-image: url(/clbs/resources/img/displaySett.svg) !important;
    background-size: 19px 19px
}

.radioLabel {
    cursor: pointer;
    font-weight: normal;
}

.radioLabel input {
    margin-right: 5px;
    vertical-align: -2px;
}

input[type='radio'] {
    cursor: pointer;
}

.toolOperateClick .print-sett::before {
    content: "";
    position: relative;
    display: inline-block;
    top: 4px;
    left: 0;
    width: 19px;
    height: 19px;
    background-image: url(/clbs/resources/img/print-icon.svg) !important;
    background-size: 19px 19px
}

.toolOperateClick .map-drop-sett::before {
    content: "";
    position: relative;
    display: inline-block;
    top: 4px;
    left: 0;
    width: 19px;
    height: 19px;
    background-image: url(/clbs/resources/img/map-drop-sett.svg) !important;
    background-size: 19px 19px
}

.obdContainer {
    position: absolute;
    z-index: 99;
    top: 100px;
    right: 10px;
    text-align: right
}

.obdIco {
    display: inline-block;
    width: 36px;
    height: 36px;
    line-height: 35px;
    font-size: 13px;
    background-color: #fff;
    text-align: center;
    border-radius: 3px;
    border: 1px solid #c4c4c4;
}

.obdContent {
    display: none;
    ext-align: left;
    background-color: #fff;
    border-radius: 3px
}

.obdContent:hover {
    cursor: default
}

.obdTitle {
    position: relative;
    text-align: left;
    padding: 8px 40px 8px 10px;
    border: 1px solid #c4c4c4;
    border-radius: 3px 3px 0 0;
    border-bottom: none
}

.obdTitle h4 {
    margin: 0;
    font-size: 13px;
}

.obdTitle .removeIcon {
    position: absolute;
    top: 10px;
    right: 10px;
    color: #c4c4c4
}

.loadingBox {
    padding: 15px;
    font-size: 20px
}

.obdIco:hover,
.obdTitle .removeIcon:hover {
    cursor: pointer
}

.obdInfoList {
    max-height: 210px;
    text-align: left;
    line-height: 22px;
    padding: 8px 10px;
    overflow-y: auto;
    border-radius: 0 0 3px 3px;
    border: 1px solid #c4c4c4;
}

#obdInfo {
    margin: 0;
    padding: 0
}

.disSetMenu {
    display: none;
    z-index: 99999999999;
    position: absolute;
    top: 50px;
    right: 52px;
    min-width: 100px;
    background: #fff;
    border: 1px solid #c4c4c4;
    border-radius: 3px
}

.mapDropSettingMenu {
    display: none;
    z-index: 1001;
    position: absolute;
    top: 50px;
    left: calc(100% - 623px);
    padding: 10px 0 0;
    background: #fff;
    border: 1px solid #c4c4c4;
    border-radius: 3px
}

.topMenuContainer {
    display: flex;
}

/*.mapTypeMenu, .mapSubMenu {
  width: 100px;
}*/

.mapTypeMenu {
    border-right: 1px solid #c4c4c4;
}

.mapStyleMenu {
    border-left: 1px solid #c4c4c4;
}

.leftStyle {
    /*width: 90px;*/
    float: left;
}

.rightStyle {
    /*width: 90px;*/
    float: right;
}

.input-item label {
    cursor: pointer;
}

.bottomMenuContainer {
    padding: 6px 10px;
    border-top: 1px solid #c4c4c4;
}

.bottomMenuContainer button {
    position: relative;
    margin-right: 10px;
    padding-left: 15px;
    border: none;
    background-color: transparent;
}

.bottomMenuContainer button:hover {
    color: #999;
}

.bottomMenuContainer button.preBlue:hover {
    color: #26a2e4;
}

.bottomMenuContainer button:disabled {
    color: #bbb;
    cursor: not-allowed;
}

.trafficBtn:before, .hawkEyeBtn:before {
    position: absolute;
    width: 11px;
    height: 14px;
    left: 0;
    top: 5px;
    content: '';
    background-image: url(/clbs/resources/img/traffic.svg);
    background-size: 100%;
    background-repeat: no-repeat;
}

.trafficBtn.preBlue:before {
    background-image: url(/clbs/resources/img/trafficActive.svg);
}

.hawkEyeBtn:before {
    top: 5px;
    width: 12px;
    background-image: url(/clbs/resources/img/hawk.svg);
}

.hawkEyeBtn.preBlue:before {
    background-image: url(/clbs/resources/img/hawkActive.svg);
}

.measurementMenu {
    display: none;
    z-index: 1001;
    position: absolute;
    top: 50px;
    right: 150px;
    min-width: 100px;
    background: #fff;
    border: 1px solid #c4c4c4;
    border-radius: 3px
}

.marker-drops-water {
    width: 20px;
    height: 23px;
    background-image: url(/clbs/resources/img/mark_bs.png);
    display: inline-block;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    vertical-align: middle;
}

.marker-circle {
    width: 20px;
    height: 23px;
    background-image: url('/clbs/resources/img/circleIcon.png');
    display: inline-block;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    vertical-align: middle;
}

.disSetMenu p {
    /*text-align: center;*/
    margin: 5px 10px
}

.mapDropSettingMenu p,
.measurementMenu p.m-line, .input-item {
    margin: 5px 10px;
}

.measurementMenu p {
    text-align: left;
    margin: 5px
}

.mapDropSettingMenu p.m-line {
    text-align: left;
    margin: 5px 5px 5px 12px
}

.areaMeasurementList {
    display: none;
    position: absolute;
    top: 30px;
    right: 100%;
    background: #ffffff;
    border: 1px solid #c4c4c4;
}

.mapDropSettingMenu p.m-line {
    text-align: left;
    margin: 5px 5px 5px 10px \9  \0
}

.disSetMenu hr,
.mapDropSettingMenu hr,
.measurementMenu hr {
    margin: 0
}

.disSetMenu .preBlue,
.mapDropSettingMenu .preBlue,
.measurementMenu .preBlue {
    color: #6dcff6
}

#defaultMap,
#gaoDe3DMap,
#googleMap,
#logoDisplay,
#realTimeRC,
#smoothMove,
#distanceMeasuremen,
#areaMeasurement,
#overViewSetting, #mapDropSettingMenu input {
    vertical-align: text-top
}

#defaultMapLab,
#gaoDe3DMapLab,
#googleMapLab,
#logoDisplayLab,
#realTimeRCLab,
#smoothMoveLab,
#distanceMeasuremenLab,
#overViewSettingLab, #mapDropSettingMenu label {
    margin: 0
}

a.fenceA:first-child {
    border-left: 0
}

.toolOperateClick span {
    color: #5c5e62
}

.pointList {
    max-height: 150px;
    overflow-y: auto;
    overflow-x: hidden;
    display: none
}

.transformIcon {
    animation: mymove .2s linear 0s 1 normal;
    animation-fill-mode: forwards
}

#criterionDataTable tbody tr td {
    padding: 10px;
    line-height: 1.42857143;
    vertical-align: middle;
    white-space: nowrap;
    text-overflow: ellipsis
}

@keyframes mymove {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(90deg)
    }
}

#searchDevices-id li {
    height: 35px;
    line-height: 35px;
    border-bottom: 1px solid #c4c4c4;
    font-size: 14px;
    padding-left: 12px
}

#searchDevices-id li:hover {
    background-color: #fafafa !important
}

.searchDevices-div .hover:hover {
    background-color: #ededed !important
}

.table-top {
    margin-top: 30px
}

.unitShow {
    padding-top: 7px;
    padding-left: 0
}

.compre-btn {
    margin-top: 30px
}

.echart-title {
    text-align: center
}

.echartArea-panel {
    padding-bottom: 0;
    padding-top: 0
}

.dataStatistics-value {
    padding-top: 7px
}

.padBottom {
    padding-bottom: 7px !important;
    margin-left: 3px
}

#fuelPriceTable .fuelTheight,
#fuelPriceTable tr {
    height: 37px
}

.fuelPrice-container .btn-block + .btn-block {
    margin-top: 6px
}

#fuelPriceTable_wrapper .dataTables_scrollHeadInner {
    height: 39px !important
}

.fuelPrice-container,
.fuelPrice-tool {
    margin: 15px 0 0 0
}

.btn-cnlng,
.btn-diesel,
.btn-gasoline {
    color: #fff;
    border-radius: 3px !important;
    height: 40px !important;
    font-size: 16px !important
}

.btn-gasoline {
    background-color: #69A4F4 !important
}

.btn-cnlng {
    background-color: #6C7CF5 !important
}

.btn-diesel {
    background-color: #6dcff6 !important
}

#graphicsMain {
    width: 100%;
    overflow: auto;
    height: 530px
}

.fuelPmData {
    height: 530px;
    overflow-y: auto
}

#fuelPriceTable tr td {
    text-align: center
}

.fuelPriceBtnGroup-Highlight {
    box-shadow: 1px 1px 4px #000 !important;
    font-weight: 700 !important;
    color: #000
}

.carStateList {
    float: left;
    margin-top: 11px
}

.carStateList li {
    display: inline-block;
    padding-right: 15px
}

#objectForwarding .control-label {
    font-weight: 700 !important
}

.container-area {
    position: relative
}

.container-area i.left-btn {
    position: absolute;
    top: 25px;
    left: -36px;
    width: 104px;
    height: 550px;
    background-image: url(/clbs/resources/img/left_icon_1.svg);
    background-repeat: no-repeat;
    background-position: 35px center;
    display: inline-block;
    background-size: 65px 55px
}

.container-area i.left-btn:hover {
    background-image: url(/clbs/resources/img/hover_left_3.png);
    width: 104px;
    height: 550px;
    background-position: left center;
    background-size: 100%
}

.container-area i.right-btn {
    position: absolute;
    top: 25px;
    right: -30px;
    width: 104px;
    height: 550px;
    background-image: url(/clbs/resources/img/right_icon_1.svg);
    background-repeat: no-repeat;
    background-position: 5px center;
    display: inline-block;
    background-size: 65px 55px
}

.container-area i.right-btn:hover {
    background-image: url(/clbs/resources/img/hover_right_3.png);
    width: 104px;
    height: 550px;
    background-position: left center;
    background-size: 100%
}

.toopTip-btn-left {
    display: none;
    font-size: 24px;
    width: 200px;
    height: 47px;
    text-align: right;
    line-height: 47px;
    background-repeat: no-repeat;
    background-position: 181px 11px
}

.toopTip-btn-left:hover {
    background: -webkit-linear-gradient(left, rgba(196, 225, 245, 0), rgba(196, 225, 245, .6));
    background: -o-linear-gradient(left, rgba(196, 225, 245, 0), rgba(196, 225, 245, .6));
    background: -moz-linear-gradient(left, rgba(196, 225, 245, 0), rgba(196, 225, 245, .6));
    background: linear-gradient(left, rgba(196, 225, 245, 0), rgba(196, 225, 245, .6))
}

.toopTip-btn-right:hover {
    background: -webkit-linear-gradient(right, rgba(196, 225, 245, 0), rgba(196, 225, 245, .6));
    background: -o-linear-gradient(right, rgba(196, 225, 245, 0), rgba(196, 225, 245, .6));
    background: -moz-linear-gradient(right, rgba(196, 225, 245, 0), rgba(196, 225, 245, .6));
    background: linear-gradient(right, rgba(196, 225, 245, 0), rgba(196, 225, 245, .6))
}

.toopTip-btn-right {
    display: none;
    font-size: 24px;
    width: 200px;
    height: 47px;
    text-align: left;
    line-height: 47px;
    background-repeat: no-repeat;
    background-position: -6px 11px
}

.container-area i.echart-left-btn,
.container-area i.echart-right-btn {
    top: 82px
}

.carName {
    position: absolute;
    margin: 0 auto;
    text-align: center;
    width: 100%;
    height: 47px;
    line-height: 47px;
    top: 0;
    left: 0
}

.carName > span {
    display: inline-block;
    min-width: 130px;
    text-align: center;
    text-transform: none;
}

.delIcon {
    background-image: url(/clbs/resources/img/delIcon1.svg) !important;
    position: absolute;
    width: 16px;
    height: 16px;
    z-index: 999;
    top: 10px;
    right: 19px
}

.newDelIcon {
    background-image: url(/clbs/resources/img/delIcon1.svg) !important;
    position: absolute;
    width: 16px;
    height: 16px;
    z-index: 999;
    top: 10px;
    right: 19px;
    cursor: pointer;
}

.draw-del-icon {
    background-image: url('/clbs/resources/img/destroy.png') !important;
    position: absolute;
    width: 16px;
    height: 16px;
    z-index: 999;
    top: -6px;
    left: -10px;
    cursor: pointer;
    background-repeat: no-repeat;
}

.text-marker {
    font-size: 12px;
}

.draw-left {
    background-image: url('/clbs/resources/img/draw-left.png');
    display: inline-block;
    width: 13px;
    height: 20px;
    background-size: 20px 20px;
    vertical-align: bottom;
    background-repeat: no-repeat;
    background-position: -5px 0px;
}

.fence-marker-des {
    word-wrap: break-word;
}

#areaMeasurementLab.preBlue i {
    background-image: url('/clbs/resources/img/draw-left-active.png');
}

.areaMeasurementList p.active {
    color: #6dcff6;
}

.delType1 {
    right: 45px;
    top: 10px
}

.delType2 {
    right: 66px;
    top: 10px
}

.delType3 {
    right: 20px;
    top: 10px
}

.tooltip-inner {
    text-transform: none;
}

.btnStylePadding {
    padding-left: 30px;
    padding-right: 30px
}

.edit-area-marbottom {
    margin-bottom: 2px !important
}

table.table-hover thead tr th {
    white-space: nowrap;
    text-align: center;
    font-size: 15px
}

table.table-hover tbody tr td {
    text-align: center;
    vertical-align: middle
}

table.table-hover tbody tr .dataTables_empty {
    text-align: left !important
}

.main-content-wrapper #main-content .fa-pencil::before {
    content: "";
    background-image: url(/clbs/resources/img/edit.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: 8px;
    left: 8px;
    background-size: 14px 14px
}

.fa-sun-o::before {
    content: "";
    background-image: url(/clbs/resources/img/detail.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: 8px;
    left: 8px;
    background-size: 14px 14px
}

.fa-trash-o::before {
    content: "";
    background-image: url(/clbs/resources/img/delete.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: 8px;
    left: 10px;
    background-size: 14px 14px
}

.editBtn-info {
    position: relative;
    color: #fff;
    background-color: #6dcff6;
    padding-left: 23px !important
}

.disableClick {
    background-color: #ccc;
    color: #444;
    position: relative;
    padding-left: 23px !important
}

.editBtn-info:hover {
    color: #fff;
    background-color: #26a2e4
}

.addIcon,
.deleteIcon,
.detailIcon,
.export-btn,
.search-btn {
    position: relative;
    padding-left: 28px !important
}

/*.search-btn{margin-left:-1px;}*/
.deleteButton {
    position: relative;
    padding-left: 23px !important
}

.deleteButton:hover {
    background-color: #ababab
}

.default-icon {
    padding-left: 12px !important
}

.addIcon .glyphicon-plus::before {
    content: "";
    background-image: url(/clbs/resources/img/add.svg);
    width: 15px;
    height: 15px;
    display: block;
    position: absolute;
    top: -13px;
    left: -17px;
    background-size: 15px 15px
}

.glyphicon-eye-open::before {
    content: "";
    background-image: url(/clbs/resources/img/detail.svg);
    width: 15px;
    height: 15px;
    display: block;
    position: absolute;
    top: -13px;
    left: -16px;
    background-size: 15px 15px
}

.glyphiconPlus::before {
    content: "";
    background-image: url(/clbs/resources/img/addLg.svg);
    width: 17px;
    height: 17px;
    display: block;
    position: absolute;
    top: -15px;
    left: -15px
}

.deleteIcon .glyphicon-trash::before {
    content: "";
    background-image: url(/clbs/resources/img/deleteLg.svg);
    width: 16px;
    height: 20px;
    display: block;
    position: absolute;
    top: -16px;
    left: -15px
}

.fa-edit::before {
    content: "";
    background-image: url(/clbs/resources/img/distribution.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: 8px;
    left: 8px;
    background-size: 14px 14px
}

.faEdit::before {
    content: "";
    background-image: url(/clbs/resources/img/impower.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: 8px;
    left: 8px;
    background-size: 14px 14px
}

.fa-object::before {
    content: "";
    background-image: url(/clbs/resources/img/object.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: 8px;
    left: 8px;
    background-size: 14px 14px
}

.fa-eye::before {
    content: "";
    background-image: url(/clbs/resources/img/detail.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: 8px;
    left: 8px;
    background-size: 14px 14px
}

.add-button-left,
.add-button-right {
    width: 35px;
    height: 35px;
    margin-bottom: 5px
}

.glyphicon-chevron-right::before {
    content: "";
    background-image: url(/clbs/resources/img/leftIcon.png);
    width: 35px;
    height: 35px;
    display: block;
    background-size: 35px 35px
}

.glyphicon-chevron-left::before {
    content: "";
    background-image: url(/clbs/resources/img/rightIcon.png);
    width: 35px;
    height: 35px;
    display: block;
    background-size: 35px 35px
}

.editBtn .glyphicon-circle-arrow-down::before {
    content: "";
    background-image: url(/clbs/resources/img/issue.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: -13px;
    left: -16px;
    background-size: 14px 14px
}

.fa-issue::before {
    content: "";
    background-image: url(/clbs/resources/img/issue.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: 8px;
    left: 8px;
    background-size: 14px 14px
}

.fa-ban::before {
    content: "";
    background-image: url(/clbs/resources/img/ban.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: 8px;
    left: 8px;
    background-size: 14px 14px
}

.fa-set::before {
    content: "";
    background-image: url(/clbs/resources/img/set.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: 8px;
    left: 8px;
    background-size: 14px 14px
}

.glyphicon-search::before {
    content: "";
    background-image: url(/clbs/resources/img/search.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: -13px;
    left: -14px;
    background-size: 14px 14px
}

.ToolPanellable .glyphicon-log-out::before,
.alarmSearchToolPanel .glyphicon-log-out::before {
    content: "";
    background-image: url(/clbs/resources/img/export.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: -13px;
    left: -14px;
    background-size: 14px 14px
}

#printBtn .glyphicon-log-out::before {
    background-image: url(/clbs/resources/img/print.svg) !important;
}

.glyphicon-print::before {
    content: "";
    background-image: url(/clbs/resources/img/print.svg);
    width: 14px;
    height: 14px;
    display: block;
    position: absolute;
    top: -13px;
    left: -14px;
    background-size: 14px 14px
}

.conactInfo,
.inspectionInfo {
    border-radius: 3px;
    background-color: rgb(248, 197, 197);
}

.ToolPanel::after {
    content: ' ';
    display: block;
    clear: both;
}

.btn-white {
    background-color: #fafafa;
    border: 1px solid #ccc !important;
    padding: 7px 12px !important
}

.alarmSet {
    margin-top: 7px;
    padding-left: 0;
    padding-right: 0
}

.alarmLeftPadding {
    padding-left: 0
}

.widget-todo {
    padding-left: 0
}

.tableHighlight td {
    background-color: #fff8b0 !important;
    color: #5d5f63
}

.tableHighlight-blue td {
    background-color: #DCF5FF !important;
    color: #5d5f63
}

#people-edit-list {
    margin-bottom: 0
}

.btn-videoRealTime {
    z-index: 1000;
    width: auto !important;
    position: absolute;
    top: 45px;
    right: 11px;
    display: none
}

.onLineHead {
    position: relative;
    height: 25px;
    line-height: 25px;
    padding-right: 20px;
    background-color: #ffffff;
}

#onlineSetting {
    position: absolute;
    top: -2px;
    right: 8px;
}

#onlineSettingMenu {
    display: none;
    right: 5px;
    top: 27px;
    left: 50px;
    padding: 0;
}

#onlineSettingMenu input {
    vertical-align: text-top;
}

#onlineSettingMenu label {
    margin: 0;
}

#onlineSettingMenu p {
    cursor: default;
}

#onlineSettingMenu label {
    cursor: pointer;
}

.btn-videoRealTime .map-active {
    color: #fff !important;
    background-color: #6dcff6 !important
}

.btn-videoRealTime .mapBtn {
    height: 27px;
    line-height: 25px;
    color: #1f1f20;
    border: 0;
    outline: 0;
    padding: 0 10px 0 10px;
    border-radius: 3px;
    margin-bottom: 4px;
    font-size: 15px;
    background-color: #ccc;
    padding-right: 10px \9  \0 !important;
    padding-left: 9px \9  \0 !important
}

.btn-photograph {
    font-size: 23px !important
}

.photographDiv {
    text-align: center
}

.videoFrame {
    padding-bottom: 15px
}

.videoArea {
    height: 200px;
    background-color: #ffb9b9
}

.frameLeft {
    padding-right: 7px !important
}

.frameRight {
    padding-left: 7px !important
}

#commonWin .modal-lg {
    width: 60%
}

.infoinputCon {
    margin-top: 10px
}

.dataTableMileageList tbody tr td:nth-child(22),
.dataTableMileageList tbody tr td:nth-child(23),
.dataTableQueryByDatePage tbody tr td:nth-child(18),
.dataTableQueryByDatePage tbody tr td:nth-child(19) {
    display: none !important
}

.layui-layer-content {
    margin: 0 auto
}

.btnPaddLeft {
    margin-left: 5px !important
}

.assignment-div {
    margin-left: 0 !important;
    margin-right: 0 !important
}

.oilquantitystatistics-Label {
    font-size: 16px;
    color: #767676;
    font-weight: 700
}

.progress-bar-progress {
    background-color: #6dcff6
}

#GPSData .dataTables_scrollBody {
    cursor: pointer !important
}

#GPSData .dataTables_scrollBody td {
    background-color: #fff !important;
    text-align: center
}

.amap-toolbar {
    left: 27px !important
}

.groupDetailTable td,
.groupDetailTable th,
.workPeoDetail td,
.workPeoDetail th {
    white-space: nowrap;
    text-align: center
}

#header .toggle-navigation button {
    background-color: #6dcff6 !important
}

#header .toggle-navigation .fa-bars {
    color: #fff !important
}

.innerShadowGrey:hover {
    border: 1px solid #9a9fa4;
    box-shadow: 0 0 5px #32323a
}

input.inputStyleHide,
select.inputStyleHide {
    border: none;
    background-color: #fff !important;
    cursor: default !important;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none
}

.fakeHide {
    position: absolute;
    width: 0;
    height: 0;
    border: none;
    outline: none;
    opacity: 0;
}

textarea.inputStyleHide {
    resize: none;
    background-color: transparent;
    border: none;
    cursor: default !important;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    text-align: inherit;
}

input.inpOrganizationDetails,
input.inputStyleHide:focus,
textarea.inputStyleHide {
    box-shadow: none !important;
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    outline: 0 !important
}

.start-input .error {
    color: #fff !important
}

.blockTitleList {
    margin-bottom: 27px
}

.noChoseIcon {
    background: url(/clbs/resources/img/noChoseIcon.png) center center no-repeat;
    background-size: 50px 50px
}

.block {
    font-size: 24px;
    font-weight: 700;
    margin: 2px;
    padding: 2px;
    width: 100%;
    height: 129px;
    text-align: center;
    background-color: #f1f1f1;
    border-radius: 5px;
    box-shadow: 0 0 4px #f1f1f1
}

.block.innerShadowGrey {
    display: table;
}

.innerShadowGrey span {
    text-shadow: 1px 1px 2px #FFF, 0 0 0 #000;
    /*line-height: 129px;*/
    color: rgba(200, 200, 200, .5);
    letter-spacing: 3px;
    display: table-cell;
    vertical-align: middle;
    cursor: pointer;
}

.paddingLeft {
    padding-left: 0
}

.paddingRight {
    padding-right: 0
}

.hasPaddingRight {
    padding-right: 15px
}

#GPSData .dataTables_scrollBody .tableSelected td,
#gpsTable2 .tableSelected td,
#gpsTable3 .tableSelected td,
#gpsTable4 .tableSelected td,
#gpsTable5 .tableSelected td {
    background-color: #6dcff6 !important;
    color: #fff !important
}

.titleCenter {
    text-align: center
}

.btn-image div {
    width: 28px;
    height: 28px
}

.btnAccording {
    background-position: 0 0
}

.offlineIconArea span,
.onlineDrivingArea span,
.onlineNotPositioningArea span,
.onlineParkingArea span,
.speedLimitWarningArea span,
.warningArea span {
    vertical-align: middle
}

#thetree .thingSkin_ico_docu,
#thetree .peopleSkin_ico_docu,
#thetree .vehicleSkin_ico_docu,
#vTreeList .icon-offline_ico_close,
#vTreeList .icon-offline_ico_open,
#vTreeList .thingSkin_ico_close,
#vTreeList .ico_close,
#vTreeList .peopleSkin_ico_close,
#vTreeList .peopleSkin_ico_open,
#vTreeList .vehicleSkin_ico_close,
#vTreeList .vehicleSkin_ico_open,
#vTreeList .thingSkin_ico_open {
    background-image: url(/clbs/resources/img/offlineIcon_ico.svg) !important;
    width: 14px !important;
    height: 12px !important;
    background-size: 12px 12px;
    background-position: bottom;
    margin-right: 0;
    vertical-align: middle
}

#thetree .thingSkin_ico_docu + span,
#thetree .peopleSkin_ico_docu + span,
#thetree .vehicleSkin_ico_docu + span,
#vTreeList .thingSkin_ico_close + span,
#vTreeList .vehicleSkin_ico_close + span,
#vTreeList .ico_close + span,
#vTreeList .peopleSkin_ico_close + span,
#vTreeList .vehicleSkin_ico_open + span,
#vTreeList .peopleSkin_ico_open + span,
#vTreeList .thingSkin_ico_open + span,
#vTreeList .icon-offline_ico_close + span,
#vTreeList .icon-offline_ico_open + span {
    color: #b6b6b6
}

span.aliasesStyle {
    margin-left: -4px;
    color: #b6b6b6
}

.onlyShowTop {
    background-position: 0 -76px
}

.allShow {
    background-position: 0 -114px
}

.hiddenBottom {
    background-position: 0 -190px
}

.hiddenAll {
    background-position: 0 -266px
}

.btnAccording-none {
    background-position: 0 -38px
}

.onlyShowTop-none {
    background-position: 0 -498px
}

.allShow-none {
    background-position: 0 -152px
}

.hiddenBottom-none {
    background-position: 0 -228px
}

.hiddenAll-none {
    background-position: 0 -304px
}

.offlineIcon_ico_docu {
    background-image: url(/clbs/resources/img/offlineIcon_ico.svg) !important;
    width: 14px !important;
    height: 12px !important;
    background-size: 12px 12px
}

.onlineDriving_ico_docu {
    background-image: url(/clbs/resources/img/onlineDriving_ico.svg) !important;
    width: 14px !important;
    height: 12px !important;
    background-size: 12px 12px
}

.onlineNotPositioning_ico_docu {
    background-image: url(/clbs/resources/img/onlineNotPositioning_ico.svg) !important;
    width: 14px !important;
    height: 12px !important;
    background-size: 12px 12px
}

.warning_ico_docu {
    background-image: url(/clbs/resources/img/warning_ico.svg) !important;
    width: 14px !important;
    height: 14px !important;
    background-size: 12px 11px
}

.onlineParking_ico_docu {
    background-image: url(/clbs/resources/img/onlineParking_ico.svg) !important;
    width: 14px !important;
    height: 12px !important;
    background-size: 12px 12px
}

.speedLimitWarning_ico_docu {
    background-image: url(/clbs/resources/img/speedLimitWarning_ico.svg) !important;
    width: 14px !important;
    height: 12px !important;
    background-size: 12px 12px
}

.heartBeatWarning_ico_docu {
    background-position: 0 -110px
}

.offlineIcon_ico::before {
    content: "";
    background-image: url(/clbs/resources/img/offlineIcon_ico.svg);
    width: 12px;
    height: 12px;
    position: absolute;
    top: 4px;
    left: 3px;
    background-size: 12px 12px
}

.onlineDriving_ico::before {
    content: "";
    background-image: url(/clbs/resources/img/onlineDriving_ico.svg);
    width: 12px;
    height: 12px;
    position: absolute;
    top: 4px;
    left: 3px;
    background-size: 12px 12px
}

.onlineNotPositioning_ico::before {
    content: "";
    background-image: url(/clbs/resources/img/onlineNotPositioning_ico.svg);
    width: 12px;
    height: 12px;
    position: absolute;
    top: 4px;
    left: 3px;
    background-size: 12px 12px
}

.heartbeat_ico::before {
    content: "";
    background-image: url(/clbs/resources/js/zTree/css/img/zTreeStandard.svg);
    width: 16px;
    height: 12px;
    position: absolute;
    top: 4px;
    left: 3px;
    background-position: -163px 40px
}

.warning_ico::before {
    content: "";
    background-image: url(/clbs/resources/img/warning_ico.svg);
    width: 16px;
    height: 12px;
    position: absolute;
    top: 4px;
    left: 3px;
    background-size: 16px 12px
}

.onlineParking_ico::before {
    content: "";
    background-image: url(/clbs/resources/img/onlineParking_ico.svg);
    width: 11px;
    height: 11px;
    position: absolute;
    top: 4px;
    left: 3px;
    background-size: 11px 11px
}

.speedLimitWarning_ico::before {
    content: "";
    background-image: url(/clbs/resources/img/speedLimitWarning_ico.svg);
    width: 13px;
    height: 13px;
    position: absolute;
    top: 4px;
    left: 3px;
    background-size: 13px 13px
}

#promptMessage {
    height: 200px
}

.original-title-list {
    padding-left: 30px
}

.original-title-list li {
    display: inline-block;
    padding-right: 30px
}

.original-title-list li.float-right {
    cursor: pointer;
    float: right;
    color: #ccc
}

.original-title-list li:nth-child(4) {
    padding-right: 15px
}

.original-content {
    padding: 5px 10px;
    height: 250px;
    overflow: auto;
    margin: 0 15px 10px 15px;
    border: 1px solid #ccc
}

body {
    color: #5D5F63;
    font-family: "Microsoft Yahei", 微软雅黑 !important;
    padding: 0;
    margin: 0;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased
}

button,
input,
select,
textarea {
    outline: 0
}

.no-footer {
    width: 100% !important
}

.dataTables_scrollHeadInner {
    width: auto !important
}

#GPSData #gpsTable_wrapper .dataTables_scroll .dataTables_scrollHead .dataTables_scrollHeadInner,
#stopData #gpsTable2_wrapper .dataTables_scroll .dataTables_scrollHead .dataTables_scrollHeadInner {
    padding-right: 0 !important
}

a:link,
a:visited {
    text-decoration: none;
    outline: 0
}

a:active,
a:hover {
    outline: 0;
    text-decoration: none;
    color: #2ca2d1
}

h2,
h3,
h4,
h5,
h6,
z h1 {
    font-family: "Microsoft Yahei", 微软雅黑
}

p {
    font-size: 14px
}

hr {
    margin-top: 10px;
    margin-bottom: 10px
}

img {
    max-width: 100%
}

#localImag img {
    width: 100%
}

::selection {
    background: #b2d7ff
}

::-moz-selection {
    background: #fff7dd
}

.btn .caret {
    margin: 0 2px 2px 3px
}

.homeText a {
    text-align: center;
    color: #FFF
}

.fastCarUrl {
    background: #6dcff6;
    padding: 0;
    box-shadow: 0 0 4px #f1f1f1;
    border-radius: 3px
}

.fastCarUrl:hover {
    background: #65c2e7
}

.fastCarUrl h2,
.fenceUrl h2,
.fenceUrl2 h2,
.fenceUrl3 h2,
.fenceUrl4 h2 {
    margin-top: 0;
    padding-bottom: 24px;
    margin-bottom: 15px;
    font-size: 24px;
    padding-top: 5px
}

.fenceUrl {
    background: #69c0ff;
    padding: 0;
    box-shadow: 0 0 4px #f1f1f1;
    border-radius: 3px;
    margin-left: 3px
}

.fenceUrl:hover {
    background: #4db4ff
}

.fastCarUrl .IcocarBG {
    height: 144px;
    background: url(/clbs/resources/img/fastCar.svg) center 20px no-repeat;
    background-size: 120px 120px
}


.fenceUrl .IcoBG {
    height: 144px;
    background: url(/clbs/resources/img/home/realtimewatch.svg) center 20px no-repeat;
    background-size: 120px 120px;
}

.fenceUrl .IcoBG-forklift {
    height: 144px;
    text-align: center;
}

.fenceUrl .IcoBG-forklift div {
    display: inline-block;
    position: relative;
    top: 18px;
    width: 120px;
    height: 120px;
    background: url(/clbs/resources/img/home/forkliftMonitoring.png) center 20px no-repeat;
    background-size: 70px 70px;
    border: #ffffff solid 2px;
    border-radius: 50%;
}

.fenceUrl2 {
    background: #ba88f0;
    padding: 0;
    box-shadow: 0 0 4px #f1f1f1;
    border-radius: 3px;
    margin-left: 3px
}

.fenceUrl2:hover {
    background: #ab70eb
}

.fenceUrl2 .IcoBG {
    height: 144px;
    background: url(/clbs/resources/img/home/trackback.svg) center 20px no-repeat;
    background-size: 120px 120px
}

.fenceUrl3 {
    background: #95de64;
    padding: 0;
    box-shadow: 0 0 4px #f1f1f1;
    border-radius: 3px;
    margin-left: 3px
}

.fenceUrl3:hover {
    background: #73d13d
}


.fenceUrl3 .IcoBG {
    height: 144px;
    background: url(/clbs/resources/img/home/realtimevideo.svg) center 20px no-repeat;
    background-size: 120px 120px;
}

.fenceUrl3 .IcoBG-forklift {
    height: 144px;
    text-align: center;
}

.fenceUrl4 .IcoBG-forklift div {
    display: inline-block;
    position: relative;
    top: 18px;
    width: 120px;
    height: 120px;
    background: url(/clbs/resources/img/home/forkliftAlarm.png) center 20px no-repeat;
    background-size: 70px 70px;
    border: #ffffff solid 2px;
    border-radius: 50%;
}

.fenceUrl4 {
    background: #faad14;
    padding: 0;
    box-shadow: 0 0 4px #f1f1f1;
    border-radius: 3px;
    margin-left: 3px
}

.fenceUrl4:hover {
    background: #f79e31
}

.fenceUrl4 .IcoBG {
    height: 144px;
    background: url(/clbs/resources/img/home/videoback.svg) center 20px no-repeat;
    background-size: 120px 120px;
}


.fenceUrl4 .IcoBG-forklift {
    height: 144px;
    text-align: center;
}

.fenceUrl3 .IcoBG-forklift div {
    display: inline-block;
    position: relative;
    top: 18px;
    width: 120px;
    height: 120px;
    background: url(/clbs/resources/img/home/forkliftManHourManagement.png) center 20px no-repeat;
    background-size: 70px 70px;
    border: #ffffff solid 2px;
    border-radius: 50%;
}

#header {
    z-index: 200;
    background: #fff;
    min-height: 80px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    margin-right: 0
}

#header .brand {
    float: left;
    width: 240px;
    min-height: 80px;
    padding: 0 0 0 10px;
    position: relative;
}

#header .logo {
    color: #fff;
    font-size: 1.7em;
    text-transform: uppercase;
    padding: 23px 0 0 63px;
}

#header .logo span {
    font-weight: 700
}

#header .toggle-navigation button:active,
#header .toggle-navigation button:hover,
#header button#toggle-mail:active,
#header button#toggle-mail:hover {
    background: #6dcff6
}

#header .toggle-navigation button:hover i,
#header button#toggle-mail:hover i {
    color: #F6F6F6
}

#header .toggle-navigation.toggle-left {
    margin: 23px 0 0 20px;
    display: inline-block
}

#header .btn-default {
    padding: 3px 9px;
    background: #F6F6F6;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    width: 35px;
    height: 35px
}

#header .btn-default .fa-bars,
#header .btn-default .fa-comment {
    color: #797979
}

#header .user-nav {
    float: right;
    padding-top: 2px;
    padding-right: 10px
}

#header .user-nav ul {
    margin: 0
}

.fwb {
    font-weight: 700
}

.quickEntry {
    background: #f9f9f9 !important
}

.toggle-left-h2 {
    display: inline-block;
}

.toggle-left-h2 .h2title {
    font-weight: 700;
    padding-left: 10px;
    font-size: 34px;
    padding-top: 1px;
}

.toggle-left-h2 #personalizedTitle span {
    color: #fff;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0
}

.user-nav ul li {
    display: inline-block;
    vertical-align: middle;
    font-size: 15px
}

.user-nav ul li .profile-photo {
    display: inline-block;
    overflow: hidden;
    vertical-align: middle
}

.user-nav ul li.dropdown.messages .dropdown-menu {
    width: 350px
}

/*.user-nav ul li.dropdown.settings .dropdown-menu{width:125px}*/
.dropdown.settings .dropdown-menu > li > a:active,
.dropdown.settings .dropdown-menu > li > a:hover,
.dropdown.i18n .dropdown-menu > li > a:active,
.dropdown.i18n .dropdown-menu > li > a:hover {
    background-color: #37b2e3;
    color: #fff
}

.dropdown.settings .dropdown-menu > li > a:hover .badge.badge-danager,
.dropdown.i18n .dropdown-menu > li > a:hover .badge.badge-danager {
    background-color: #fff;
    color: #1abc9c
}

.user-nav ul li.dropdown.messages .dropdown-menu > li > a:hover,
.user-nav ul li.dropdown.messages .dropdown-menu > li > a:hover .message-info .time {
    background: #1abc9c;
    color: #fff
}

.user-nav ul li.dropdown.messages .dropdown-menu {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    left: -150px;
    top: 48px;
    background-color: #F6F6F6;
    border: none;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 0 5px rgba(0, 0, 0, .1);
    -o-box-shadow: 0 0 5px rgba(0, 0, 0, .1);
    box-shadow: 0 0 5px rgba(0, 0, 0, .1);
    padding: 0
}

.user-nav ul li.dropdown.messages .dropdown-menu:before {
    bottom: 100%;
    left: 48%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(238, 238, 238, 0);
    border-bottom-color: #e84c3d;
    border-width: 8px;
    margin-left: -8px
}

.messages {
    margin: 0 15px
}

.messages .badge {
    position: absolute;
    top: -10px;
    left: -5px
}

.options i {
    color: #797979;
    font-size: 1.1em
}

.user-nav ul li.dropdown.settings,
.user-nav ul li.dropdown.i18n {
    line-height: 39px;
    margin-right: 10px;
    padding: 0 10px
}

.user-nav ul li.dropdown.settings .dropdown-menu > li > a,
.user-nav ul li.dropdown.i18n .dropdown-menu > li > a {
    padding: 5px 10px;
    font-size: 12px
}

.user-controls ul li.dropdown.settings .dropdown-menu > li,
.user-controls ul li.dropdown.i18n .dropdown-menu > li {
    display: block
}

.user-nav ul li.dropdown.settings .dropdown-menu {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    left: -77px;
    top: 48px;
    background-color: #F6F6F6;
    border-color: #e7e8ec;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 0 5px rgba(0, 0, 0, .1);
    -o-box-shadow: 0 0 5px rgba(0, 0, 0, .1);
    box-shadow: 0 0 5px rgba(0, 0, 0, .1)
}

.user-nav ul li.dropdown.i18n .dropdown-menu {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    left: -32px;
    top: 48px;
    background-color: #F6F6F6;
    border-color: #e7e8ec;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 0 5px rgba(0, 0, 0, .1);
    -o-box-shadow: 0 0 5px rgba(0, 0, 0, .1);
    box-shadow: 0 0 5px rgba(0, 0, 0, .1)
}

.user-nav ul li.dropdown.settings .dropdown-menu:after,
.user-nav ul li.dropdown.i18n .dropdown-menu:after {
    bottom: 100%;
    left: 78%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(238, 238, 238, 0);
    border-bottom-color: #F6F6F6;
    border-width: 8px;
    margin-left: -8px
}

.user-nav ul li.dropdown.settings .dropdown-menu:before,
.user-nav ul li.dropdown.i18n .dropdown-menu:before {
    bottom: 100%;
    left: 78%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(238, 238, 238, 0);
    border-bottom-color: #e7e8ec;
    border-width: 8px;
    margin-left: -8px;
    top: -17px
}

.dropdown.messages .dropdown-menu > li,
.dropdown.settings .dropdown-menu > li,
.dropdown.i18n .dropdown-menu > li {
    display: block
}

li.dropdown ul.dropdown-menu.alert > li h1 {
    -webkit-border-radius: 3px 3px 0 0;
    -moz-border-radius: 3px 3px 0 0;
    -ms-border-radius: 3px 3px 0 0;
    -o-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0;
    background-color: #e84c3d;
    margin: 0;
    font-size: 13px;
    padding: 10px;
    font-weight: 400;
    color: #fff
}

.user-nav ul li.dropdown.messages .dropdown-menu > li:last-child a {
    background-color: #fff;
    font-weight: 400;
    font-size: 12px;
    margin: 0;
    -webkit-border-radius: 0 0 3px 3px;
    -moz-border-radius: 0 0 3px 3px;
    -ms-border-radius: 0 0 3px 3px;
    -o-border-radius: 0 0 3px 3px;
    border-radius: 0 0 3px 3px;
    text-align: right;
    padding: 10px 15px
}

.user-nav ul li.dropdown.messages .dropdown-menu > li:last-child a:hover {
    background: #1abc9c;
    color: #fff
}

.user-nav ul li.dropdown.messages .dropdown-menu > li > a {
    margin: 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    background-color: #fcfcfc;
    color: #797979
}

.user-nav ul li.dropdown.messages .dropdown-menu > li > a .message-info {
    vertical-align: top;
    display: inline-block;
    font-size: 11px;
    margin-left: 5px;
    width: 225px
}

.user-nav ul li.dropdown.messages .dropdown-menu > li > a .message-info .sender {
    font-weight: 500
}

.user-nav ul li.dropdown.messages .dropdown-menu > li > a .message-info .time {
    font-weight: 300;
    font-size: 9px;
    color: #b2b2b2
}

.user-nav ul li.dropdown.messages .dropdown-menu > li > a .message-info .message-content {
    white-space: normal;
    margin-top: 5px
}

#header .data-time {
    margin: 7px 6px 0px 0px;
}

#header .dataClock {
    padding-right: 15px;
    font: 15px/1.3 Microsoft JhengHei, Century gothic, Arial;
    background: #fff;
    border: 1px solid #cfcfcf;
    position: relative;
    top: -2px
}

#clockBox {
    float: left;
    padding-left: 15px
}

#clockBox #clockAP {
    position: relative;
    top: 5px;
    left: 0;
    text-align: left
}

#monthsDay {
    float: left;
    background: #6dcff6;
    padding: 4px 10px
}

#monthsDay h1 {
    display: inline
}

#monthsDay span {
    padding-left: 10px
}

.clockBoxCon {
    margin: 0;
    padding: 0
}

.sidebar-toggle {
    margin-left: -240px
}

#leftside-navigation ul,
#leftside-navigation ul ul {
    margin: 0;
    padding: 0
}

#leftside-navigation ul li {
    list-style-type: none
}

#leftside-navigation ul li a {
    color: #aeb2b7;
    text-decoration: none;
    display: block;
    padding: 18px 0 18px 6px;
    font-size: 16px;
    font-weight: 700;
    border-left: 4px solid #32323a;
    outline: 0;
    -webkit-transition: all .2s ease-in;
    -o-transition: all .2s ease-in;
    -moz-transition: all .2s ease-in
}

#leftside-navigation > ul.nano-content > li.sub-menu > ul > li > a,
#leftside-navigation > ul.nano-content > li.sub-menu > ul > li > ul > li > a {
    border: none
}

#leftside-navigation ul li a span {
    display: inline-block
}

#leftside-navigation ul ul li {
    background: #28282e;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    border-bottom: none
}

#leftside-navigation ul ul li a {
    font-size: 14px;
    padding: 13px 0 13px 6px
}

#leftside-navigation ul ul ul li a {
    font-size: 14px;
    padding: 13px 0 13px 30px
}

#leftside-navigation ul li a i {
    width: 19px
}

#leftside-navigation ul li a i.arrow {
    /*width: 50px;*/
    text-align: center
}

#leftside-navigation ul li a i.fa-angle-left,
#leftside-navigation ul li a i.fa-angle-right {
    padding-top: 3px
}

#leftside-navigation li.active ul {
    display: block
}

#leftside-navigation a:focus,
#leftside-navigation a:hover {
    color: #fff;
    background-color: #6dcff6
}

#leftside-navigation ul li {
    border-bottom: 1px solid #3b3b43;
    background-color: #32323a
}

#leftside-navigation ul ul li a:focus,
#leftside-navigation ul ul li a:hover {
    border-left: none
}

#leftside-navigation .active > a,
#leftside-navigation .active > a:focus,
#leftside-navigation .active > a:hover {
    color: #fff
}

#leftside-navigation .active1 > a {
    color: #fff;
    display: block
}

#leftside-navigation .nav > li.active > a,
#leftside-navigation .nav > li.active > a:focus,
#leftside-navigation .nav > li.active > a:hover {
    color: #fff;
    background-color: #6dcff6
}

#leftside-navigation .nav > li.open > a,
#leftside-navigation .nav > li > a:hover {
    color: #fff;
    background-color: #6dcff6
}

#leftside-navigation .open {
    color: #fff;
    background-color: #6dcff6
}

#leftside-navigation .activeLine {
    border-left: 4px solid #fff
}

#leftside-navigation .nav > li.active > a,
#leftside-navigation .nav > li.active > a:focus,
#leftside-navigation .nav > li.active > a:hover {
    color: #fff;
    background-color: #6dcff6
}

.btn-primary + .dropdown-menu > li > a:active,
.btn-primary + .dropdown-menu > li > a:hover {
    background-color: #16a086
}

.sidebarRight {
    width: 240px;
    height: 100%;
    background: #293949;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    z-index: 100;
    position: absolute;
    overflow-y: auto;
    overflow-x: hidden;
    top: 80px;
    right: 0;
    display: none
}

.sidebar-toggle-right {
    display: block
}

.sidebarRight .sidebar-heading {
    font-size: 14px;
    color: #FFF;
    font-weight: 500;
    line-height: 30px;
    padding: 10px;
    text-transform: uppercase
}

.sidebarRight a.list-item:hover {
    background: #23313F
}

.sidebarRight .sidebar-title {
    font-size: 11px;
    color: #CCC;
    font-weight: 500;
    text-transform: uppercase;
    float: left;
    width: 100%;
    padding: 10px
}

.sidebarRight .list-contacts .list-item {
    float: left;
    position: relative;
    width: 100%;
    padding: 8px 5px 8px 10px;
    margin-bottom: 3px;
    display: block
}

.sidebarRight .list-contacts .list-item,
.sidebarRight .list-contacts a.list-item {
    color: #fff !important
}

.sidebarRight .list-contacts .list-item .list-item-image img {
    float: left;
    width: 30px;
    height: 30px;
    margin-right: 5px
}

.sidebarRight .list-contacts .list-item .list-item-content h4 {
    font-size: 12px;
    line-height: 17px;
    font-weight: 600;
    padding: 0;
    margin: 0
}

.sidebarRight .list-contacts .list-item .list-item-content p {
    padding: 0;
    margin: 0;
    line-height: 13px;
    font-size: 11px
}

.sidebarRight .list-contacts .list-item .item-status.item-status-online {
    background: #27ae61
}

.sidebarRight .list-contacts .list-item .item-status.item-status-away {
    background: #f39c11
}

.sidebarRight .list-contacts .list-item .item-status {
    position: absolute;
    right: 10px;
    top: 15px;
    width: 10px;
    height: 10px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: #AAA
}

.main-content-toggle-left {
    margin-left: 0
}

.main-content-toggle-right {
    margin-right: 240px
}

.main-content-wrapper #main-content {
    display: block;
    padding: 15px 15px 0;
    width: 100%;
    position: relative;
    overflow-y: auto;
}

.main-content-wrapper #main-content .loading {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    z-index: 999;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
}

.main-content-wrapper #main-content .loading .loader {
    width: 48px;
    height: 48px;
    border: 5px solid #28282e;
    border-bottom-color: transparent;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.trackPlay-content {
    margin: -14px 0 0 0;
    padding-left: 0;
    padding-right: 0 !important
}

.realtime-content {
    background: #f1f2f7;
    margin: -14px 0 0 0;
    padding-left: 0;
    padding-right: 0 !important
}

#main-content .h1 {
    margin: 0;
    padding: 5px 10px 24px 0;
    float: left;
    line-height: 10px;
    font-weight: 300;
    font-size: 26px;
    font-family: "Microsoft Yahei", 微软雅黑
}

.dashboard-tile {
    background-color: #fff;
    color: #555;
    margin-bottom: 15px;
    padding: 10px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px
}

.dashboard-tile.tile-turquoise {
    background-color: #1abc9c;
    color: #fff
}

.dashboard-tile.tile-red {
    background-color: #e84c3d;
    color: #fff
}

.dashboard-tile.tile-blue {
    background-color: #3598db;
    color: #fff
}

.dashboard-tile.tile-purple {
    background-color: #9a59b5;
    color: #fff
}

.dashboard-tile .header {
    border-bottom: 2px solid rgba(255, 255, 255, .2)
}

.dashboard-tile .header .title {
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    padding: 5px;
    position: absolute;
    text-transform: uppercase;
    top: 7px
}

.dashboard-tile .content {
    padding: 10px
}

.dashboard-tile.header .content {
    padding: 10px 20px;
    background: 0 0;
    padding-right: 10px;
    display: inline-block;
    position: relative;
    z-index: 5
}

.dashboard-tile.detail .icon {
    position: absolute
}

.dashboard-tile.header .icon img {
    opacity: .8;
    display: block;
    float: right;
    height: 80px;
    margin-bottom: 10px;
    padding-left: 15px;
    padding-top: 10px;
    position: absolute;
    right: 10px;
    top: 50px;
    width: 80px
}

.dashboard-tile.detail,
.dashboard-tile.header {
    position: relative;
    overflow: hidden
}

.dashboard-tile.detail .content {
    background: 0 0;
    padding: 10px 10px 13px;
    display: inline-block;
    position: relative;
    z-index: 5
}

.dashboard-tile.detail .icon {
    display: block;
    float: right;
    height: 80px;
    margin-bottom: 10px;
    padding-left: 15px;
    padding-top: 10px;
    width: 80px;
    right: 40px;
    bottom: 9px
}

.dashboard-tile.detail .icon i {
    color: rgba(0, 0, 0, .05);
    font-size: 85px;
    line-height: 65px
}

.dashboard-tile .content p {
    margin-bottom: 0;
    padding: 10px;
    font-weight: 4 00;
    font-size: 14px;
    clear: both
}

#main-content .dashboard-tile .content h1 {
    margin: 0;
    font-weight: 300;
    font-size: 40px;
    padding: 8px
}

.form-control {
    font-family: "Microsoft Yahei", 微软雅黑 !important;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    list-style: none;
    position: relative;
    display: inline-block;
    padding: 6px 11px;
    width: 100%;
    height: 36px;
    font-size: 13px;
    line-height: 1.5;
    color: #717171;
    background-color: #fafafa;
    border: 1px solid #d9d9d9;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    -webkit-transition: all .3s;
    transition: all .3s
}

input.auto-input {
    background-color: #fafafa !important;
}

.form-control:hover {
    border-color: #40a9ff
}

.form-control:focus {
    border-color: #40a9ff;
    outline: 0;
    -webkit-box-shadow: 0 0 0 2px rgba(24, 144, 255, .2);
    box-shadow: 0 0 0 2px rgba(24, 144, 255, .2)
}

.form-horizontal.form-border .form-group {
    border-bottom: 1px solid #eff2f7;
    padding-bottom: 15px;
    margin-bottom: 15px
}

.control-group.error input,
.control-group.error select,
.control-group.error textarea {
    border-color: #b94a48;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075)
}

.control-group.error .checkbox,
.control-group.error .radio,
.control-group.error input,
.control-group.error select,
.control-group.error textarea {
    color: #b94a48
}

div.error,
label.error {
    color: #fff;
    background: #b94a48;
    border: solid thin #fff;
    padding: 3px 5px
}

div.error {
    width: fit-content
}

label.error2 {
    color: #fff;
    background: #b94a48;
    border: solid thin #fff;
    padding: 3px 5px
}

label.valid {
    color: #fff;
    background: #5CB85C;
    border: solid thin #fff;
    padding: 3px 5px
}

.icheck .disabled,
.icheck div {
    float: left
}

.icheck div {
    margin-right: 10px
}

.icheck label {
    font-weight: 400
}

.icheck .checkbox,
.icheck .radio {
    margin-bottom: 10px
}

.btn {
    border: none;
    font-size: 15px;
    font-weight: 400;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    padding: 8px 14px;
    margin-top: 1px;
    margin-bottom: 2px;
    -webkit-font-smoothing: subpixel-antialiased;
    -webkit-transition: border .25s linear, color .25s linear, background-color .25s linear;
    transition: border .25s linear, color .25s linear, background-color .25s linear
}

.editBtn {
    border: none;
    font-size: 15px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    padding: 4px 12px;
    margin-bottom: 0;
    -webkit-font-smoothing: subpixel-antialiased;
    -webkit-transition: border .25s linear, color .25s linear, background-color .25s linear;
    transition: border .25s linear, color .25s linear, background-color .25s linear
}

.editBtn-margins {
    margin: 0 0 4px 0
}

.btn:focus,
.btn:hover {
    outline: 0
}

.btn.active,
.btn:active {
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none
}

.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
    background-color: #bdc3c7;
    color: rgba(255, 255, 255, .75);
    opacity: .7;
    filter: alpha(opacity=70)
}

.btn-default,
a.btn-default:link,
a.btn-default:visited {
    color: #fff;
    background-color: #bdc3c7
}

.btn-white,
a.btn-white:link,
a.btn-white:visited {
    color: #333;
    border-color: #ccc;
    background-color: #fff
}

.editBtn.btn-default {
    padding-left: 23px !important
}

.btn-default.active,
.btn-default:active,
.btn-default:focus,
.btn-default:hover,
.open .dropdown-toggle.btn-default,
a.btn-default:active,
a.btn-default:hover {
    color: #fff;
    background-color: #cacfd2;
    border-color: #cacfd2
}

.btn-default.active,
.btn-default:active,
.open .dropdown-toggle.btn-default {
    background: #a1a6a9;
    border-color: #a1a6a9
}

.btn-default.disabled,
.btn-default.disabled.active,
.btn-default.disabled:active,
.btn-default.disabled:focus,
.btn-default.disabled:hover,
.btn-default[disabled],
.btn-default[disabled].active,
.btn-default[disabled]:active,
.btn-default[disabled]:focus,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default,
fieldset[disabled] .btn-default.active,
fieldset[disabled] .btn-default:active,
fieldset[disabled] .btn-default:focus,
fieldset[disabled] .btn-default:hover {
    background-color: #bdc3c7;
    border-color: #bdc3c7
}

.btn-primary,
a.btn-primary:link,
a.btn-primary:visited {
    color: #fff;
    background-color: #20b5f0
}

.btn-primary.active,
.btn-primary:active,
.btn-primary:focus,
.btn-primary:hover,
.open .dropdown-toggle.btn-primary,
a.btn-primary:active,
a.btn-primary:hover {
    color: #fff;
    background-color: #6dcff6;
    border-color: #6dcff6
}

.btn-primary.active,
.btn-primary:active,
.open .dropdown-toggle.btn-primary {
    background: #6dcff6;
    border-color: #6dcff6
}

.btn-primary.disabled,
.btn-primary.disabled.active,
.btn-primary.disabled:active,
.btn-primary.disabled:focus,
.btn-primary.disabled:hover,
.btn-primary[disabled],
.btn-primary[disabled].active,
.btn-primary[disabled]:active,
.btn-primary[disabled]:focus,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary,
fieldset[disabled] .btn-primary.active,
fieldset[disabled] .btn-primary:active,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary:hover {
    background-color: #1abc9c;
    border-color: #1abc9c
}

.btn-info,
a.btn-info:link,
a.btn-info:visited {
    color: #fff;
    background-color: #3498db
}

a.btn-info:active,
a.btn-info:hover {
    color: #fff;
    background-color: #5dade2
}

.btn-info.active,
.btn-info:active,
.btn-info:focus,
.btn-info:hover,
.open .dropdown-toggle.btn-info {
    color: #fff;
    background-color: #5dade2;
    border-color: #5dade2
}

.btn-info.active,
.btn-info:active,
.open .dropdown-toggle.btn-info {
    background: #2c81ba;
    border-color: #2c81ba
}

.btn-info.disabled,
.btn-info.disabled.active,
.btn-info.disabled:active,
.btn-info.disabled:focus,
.btn-info.disabled:hover,
.btn-info[disabled],
.btn-info[disabled].active,
.btn-info[disabled]:active,
.btn-info[disabled]:focus,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info,
fieldset[disabled] .btn-info.active,
fieldset[disabled] .btn-info:active,
fieldset[disabled] .btn-info:focus,
fieldset[disabled] .btn-info:hover {
    background-color: #3498db;
    border-color: #3498db
}

.btn-danger {
    color: #fff;
    background-color: #e74c3c
}

.btn-danger.active,
.btn-danger:active,
.btn-danger:focus,
.btn-danger:hover,
.open .dropdown-toggle.btn-danger {
    color: #fff;
    background-color: #ec7063;
    border-color: #ec7063
}

.btn-danger.active,
.btn-danger:active,
.open .dropdown-toggle.btn-danger {
    background: #c44133;
    border-color: #c44133
}

.btn-danger.disabled,
.btn-danger.disabled.active,
.btn-danger.disabled:active,
.btn-danger.disabled:focus,
.btn-danger.disabled:hover,
.btn-danger[disabled],
.btn-danger[disabled].active,
.btn-danger[disabled]:active,
.btn-danger[disabled]:focus,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger,
fieldset[disabled] .btn-danger.active,
fieldset[disabled] .btn-danger:active,
fieldset[disabled] .btn-danger:focus,
fieldset[disabled] .btn-danger:hover {
    background-color: #e74c3c;
    border-color: #e74c3c
}

.btn-success {
    color: #fff;
    background-color: #6dcff6
}

.btn-success.active,
.btn-success:active,
.btn-success:focus,
.btn-success:hover,
.open .dropdown-toggle.btn-success {
    color: #fff;
    background-color: #37b2e3;
    border-color: #37b2e3
}

.btn-success.active,
.btn-success:active,
.open .dropdown-toggle.btn-success {
    background: #37b2e3;
    border-color: #37b2e3
}

.btn-success.disabled,
.btn-success.disabled.active,
.btn-success.disabled:active,
.btn-success.disabled:focus,
.btn-success.disabled:hover,
.btn-success[disabled],
.btn-success[disabled].active,
.btn-success[disabled]:active,
.btn-success[disabled]:focus,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success,
fieldset[disabled] .btn-success.active,
fieldset[disabled] .btn-success:active,
fieldset[disabled] .btn-success:focus,
fieldset[disabled] .btn-success:hover {
    background-color: #37b2e3;
    border-color: #37b2e3
}

.btn-warning {
    color: #fff;
    background-color: #f1c40f
}

.btn-warning.active,
.btn-warning:active,
.btn-warning:focus,
.btn-warning:hover,
.open .dropdown-toggle.btn-warning {
    color: #fff;
    background-color: #f5d313;
    border-color: #f5d313
}

.btn-warning.active,
.btn-warning:active,
.open .dropdown-toggle.btn-warning {
    background: #cda70d;
    border-color: #cda70d
}

.btn-warning.disabled,
.btn-warning.disabled.active,
.btn-warning.disabled:active,
.btn-warning.disabled:focus,
.btn-warning.disabled:hover,
.btn-warning[disabled],
.btn-warning[disabled].active,
.btn-warning[disabled]:active,
.btn-warning[disabled]:focus,
.btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning,
fieldset[disabled] .btn-warning.active,
fieldset[disabled] .btn-warning:active,
fieldset[disabled] .btn-warning:focus,
fieldset[disabled] .btn-warning:hover {
    background-color: #f1c40f;
    border-color: #f1c40f
}

.btn.btn-3d {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -ms-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease
}

.btn.btn-3d:active {
    -webkit-transform: translate(0, 3px);
    -moz-transform: translate(0, 3px);
    transform: translate(0, 3px)
}

.btn-default.btn-3d {
    -webkit-box-shadow: 0 6px 0 #A6AAAC;
    -moz-box-shadow: 0 6px 0 #A6AAAC;
    box-shadow: 0 6px 0 #A6AAAC
}

.btn-default.btn-3d:active {
    -webkit-box-shadow: 0 2px 0 #A6AAAC;
    -moz-box-shadow: 0 2px 0 #A6AAAC;
    box-shadow: 0 2px 0 #A6AAAC
}

.btn-default.btn-3d:focus,
.btn-default.btn-3d:hover {
    background-color: #bdc3c7
}

.btn-primary.btn-3d {
    -webkit-box-shadow: 0 6px 0 #14a084;
    -moz-box-shadow: 0 6px 0 #14a084;
    box-shadow: 0 6px 0 #14a084
}

.btn-primary.btn-3d:active {
    -webkit-box-shadow: 0 2px 0 #14a084;
    -moz-box-shadow: 0 2px 0 #14a084;
    box-shadow: 0 2px 0 #14a084
}

.btn-primary.btn-3d:focus,
.btn-primary.btn-3d:hover {
    background-color: #1abc9c
}

.btn-success.btn-3d {
    -webkit-box-shadow: 0 6px 0 #2ab263;
    -moz-box-shadow: 0 6px 0 #2ab263;
    box-shadow: 0 6px 0 #2ab263
}

.btn-success.btn-3d:active {
    -webkit-box-shadow: 0 2px 0 #2ab263;
    -moz-box-shadow: 0 2px 0 #2ab263;
    box-shadow: 0 2px 0 #2ab263
}

.btn-success.btn-3d:focus,
.btn-success.btn-3d:hover {
    background-color: #2ecc71
}

.btn-info.btn-3d {
    -webkit-box-shadow: 0 6px 0 #2e86c1;
    -moz-box-shadow: 0 6px 0 #2e86c1;
    box-shadow: 0 6px 0 #2e86c1
}

.btn-info.btn-3d:active {
    -webkit-box-shadow: 0 2px 0 #2e86c1;
    -moz-box-shadow: 0 2px 0 #2e86c1;
    box-shadow: 0 2px 0 #2e86c1
}

.btn-info.btn-3d:focus,
.btn-info.btn-3d:hover {
    background-color: #3498db
}

.btn-warning.btn-3d {
    -webkit-box-shadow: 0 6px 0 #d6ae11;
    -moz-box-shadow: 0 6px 0 #d6ae11;
    box-shadow: 0 6px 0 #d6ae11
}

.btn-warning.btn-3d:active {
    -webkit-box-shadow: 0 2px 0 #d6ae11;
    -moz-box-shadow: 0 2px 0 #d6ae11;
    box-shadow: 0 2px 0 #d6ae11
}

.btn-warning.btn-3d:focus,
.btn-warning.btn-3d:hover {
    background-color: #f1c40f
}

.btn-danger.btn-3d {
    -webkit-box-shadow: 0 6px 0 #c94034;
    -moz-box-shadow: 0 6px 0 #c94034;
    box-shadow: 0 6px 0 #c94034
}

.btn-danger.btn-3d:active {
    -webkit-box-shadow: 0 2px 0 #c94034;
    -moz-box-shadow: 0 2px 0 #c94034;
    box-shadow: 0 2px 0 #c94034
}

.btn-danger.btn-3d:focus,
.btn-danger.btn-3d:hover {
    background-color: #e74c3c
}

.btn-square {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0
}

.btn-default.btn-trans {
    color: #bdc3c7;
    background-color: transparent;
    border: solid thin #bdc3c7
}

.btn-default.btn-trans:active,
.btn-default.btn-trans:focus,
.btn-default.btn-trans:hover {
    color: #fff;
    background-color: #bdc3c7;
    border: solid thin #bdc3c7
}

.btn-primary.btn-trans {
    color: #1abc9c;
    background-color: transparent;
    border: solid thin #1abc9c
}

.btn-primary.btn-trans:active,
.btn-primary.btn-trans:focus,
.btn-primary.btn-trans:hover {
    color: #fff;
    background-color: #1abc9c;
    border: solid thin #1abc9c
}

.btn-success.btn-trans {
    color: #2ecc71;
    background-color: transparent;
    border: solid thin #2ecc71
}

.btn-success.btn-trans:active,
.btn-success.btn-trans:focus,
.btn-success.btn-trans:hover {
    color: #fff;
    background-color: #2ecc71;
    border: solid thin #2ecc71
}

.btn-info.btn-trans {
    color: #3498db;
    background-color: transparent;
    border: solid thin #3498db
}

.btn-info.btn-trans:active,
.btn-info.btn-trans:focus,
.btn-info.btn-trans:hover {
    color: #fff;
    background-color: #3498db;
    border: solid thin #3498db
}

.btn-warning.btn-trans {
    color: #f5d313;
    background-color: transparent;
    border: solid thin #f5d313
}

.btn-warning.btn-trans:active,
.btn-warning.btn-trans:focus,
.btn-warning.btn-trans:hover {
    color: #fff;
    background-color: #f5d313;
    border: solid thin #f5d313
}

.btn-danger.btn-trans {
    color: #e74c3c;
    background-color: transparent;
    border: solid thin #e74c3c
}

.btn-danger.btn-trans:active,
.btn-danger.btn-trans:focus,
.btn-danger.btn-trans:hover {
    color: #fff;
    background-color: #e74c3c;
    border: solid thin #e74c3c
}

.btn-lg {
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.33
}

.btn-sm {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px
}

.btn-xs {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px
}

.badge.badge-success {
    background-color: #2dcc70;
    color: #fff
}

.badge.badge-info {
    background-color: #3598db;
    color: #fff
}

.badge.badge-warning {
    background-color: #f1c40f;
    color: #fff
}

.badge.badge-danager {
    background-color: #e84c3d;
    color: #fff
}

.slider.slider-horizontal {
    margin: 10px 0
}

.slider.slider-vertical {
    margin: 0 10px
}

.slider-handle.round {
    position: absolute;
    width: 20px;
    height: 20px;
    border: 1px solid #EFF2F7;
    background: #fff
}

.slider-default .slider-selection {
    background-image: none;
    background-color: #bdc3c7
}

.slider-primary .slider-selection {
    background-image: none;
    background-color: #1abc9c
}

.slider-success .slider-selection {
    background-image: none;
    background-color: #2dcc70
}

.slider-warning .slider-selection {
    background-image: none;
    background-color: #f1c40f
}

.slider-info .slider-selection {
    background-image: none;
    background-color: #3598db
}

.slider-danger .slider-selection {
    background-image: none;
    background-color: #e84c3d
}

#RGB {
    height: 239px;
    background: gray;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px
}

.progress-bar-default {
    background-color: #bdc3c7
}

.progress-bar-primary {
    background-color: #1abc9c
}

.progress-bar-success {
    background-color: #2dcc70
}

.progress-bar-warning {
    background-color: #f1c40f
}

.progress-bar-info {
    background-color: #3598db
}

.progress-bar-danger {
    background-color: #e84c3d
}

.dd {
    position: relative;
    display: block;
    margin: 0;
    padding: 0;
    max-width: 600px;
    list-style: none;
    font-size: 13px;
    line-height: 20px
}

.dd-list {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none
}

.dd-list .dd-list {
    padding-left: 30px
}

.dd-empty,
.dd-item,
.dd-placeholder {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    min-height: 20px;
    font-size: 13px;
    line-height: 20px
}

.dd-handle {
    cursor: move;
    display: block;
    height: 30px;
    margin: 5px 0;
    padding: 5px 10px;
    color: #333;
    text-decoration: none;
    font-weight: 700;
    border: 1px solid #ccc;
    background: #fafafa;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    box-sizing: border-box;
    -moz-box-sizing: border-box
}

.dd-handle:hover {
    background: #fff;
    color: #1abc9c
}

.dd-item > button {
    display: block;
    position: relative;
    float: left;
    width: 25px;
    height: 20px;
    margin: 5px 0;
    padding: 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    border: 0;
    background: 0 0;
    font-size: 12px;
    line-height: 1;
    text-align: center;
    font-weight: 700
}

.dd-item > button:before {
    content: '+';
    display: block;
    position: absolute;
    width: 100%;
    text-align: center;
    text-indent: 0
}

.dd-item > button[data-action=collapse]:before {
    content: '-'
}

.dd-empty,
.dd-placeholder {
    margin: 5px 0;
    padding: 0;
    min-height: 30px;
    background: #f2fbff;
    border: 1px dashed #b6bcbf;
    box-sizing: border-box;
    -moz-box-sizing: border-box
}

.dd-empty {
    border: 1px dashed #bbb;
    min-height: 100px;
    background-color: #e5e5e5;
    background-size: 60px 60px;
    background-position: 0 0, 30px 30px
}

.dd-dragel {
    position: absolute;
    pointer-events: none;
    z-index: 9999
}

.dd-dragel > .dd-item .dd-handle {
    margin-top: 0
}

.dd-dragel .dd-handle {
    -webkit-box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, .1);
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, .1)
}

.dropdown-menu {
    background-color: #F6F6F6;
    border-color: #CACFD2;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 6px;
    margin-top: -3px;
    max-height: 200px !important
}

.protocol-dropdown-menu {
    max-height: 600px !important;
}

.dropdown-menu > li {
    font-size: 13px
}

.dropdown-menu > li > a {
    color: #797979;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px
}

.dropdown-menu .divider {
    background-color: rgba(255, 255, 255, .05)
}

.btn-default + .dropdown-menu > li > a:focus,
.btn-default + .dropdown-menu > li > a:hover {
    text-decoration: none;
    background-color: #A1A6A9;
    color: #fff
}

.btn-primary + .dropdown-menu > li > a:focus,
.btn-primary + .dropdown-menu > li > a:hover {
    text-decoration: none;
    color: #fff
}

.btn-info + .dropdown-menu > li > a:focus,
.btn-info + .dropdown-menu > li > a:hover {
    text-decoration: none;
    background-color: #2C81BA;
    color: #fff
}

.btn-warning + .dropdown-menu > li > a:focus,
.btn-warning + .dropdown-menu > li > a:hover {
    text-decoration: none;
    background-color: #CDA70D;
    color: #fff
}

.btn-danger + .dropdown-menu > li > a:focus,
.btn-danger + .dropdown-menu > li > a:hover {
    text-decoration: none;
    background-color: #c1392b;
    color: #fff
}

.breadcrumb {
    background: #fff url(/clbs/resources/img/Titlehome.svg) no-repeat 10px 10px;
    padding-left: 40px;
    background-size: 15px 15px
}

.breadcrumb > li a {
    font-size: 14px;
    color: #5D5F63
}

.modal-footer .btn + .btn {
    margin: 0 0 3px 0
}

.modal .modal-body.modal-scroll {
    max-height: 300px;
    overflow-y: auto
}

.chart-tooltip {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    background-color: #233242 !important;
    border: 0 !important;
    color: #fff;
    padding: 10px 20px !important;
    font-size: 13px
}

.fa-hover {
    margin: 5px 0
}

.fa-hover i {
    font-size: 14px;
    margin-right: 5px;
    width: 20px
}

.tab-wrapper {
    margin-bottom: 20px
}

.tab-wrapper .nav-tabs > li > a {
    border-radius: 0
}

.tab-wrapper .tab-content {
    border: 1px solid #ddd;
    border-top: 0;
    padding: 10px 15px
}

.tab-wrapper > .nav-tabs > li a {
    color: #5D5F63
}

.tab-wrapper > .nav-tabs > li.active > a {
    border-top: 2px solid #1abc9c;
    background-color: #fff
}

.tab-wrapper.tab-left > .nav-tabs > li,
.tab-wrapper.tab-right > .nav-tabs > li {
    float: none;
    min-width: 75px
}

.tab-wrapper.tab-left > .nav-tabs > li > a,
.tab-wrapper.tab-right > .nav-tabs > li > a {
    border: 1px solid #ddd
}

.tab-wrapper.tab-left > .nav-tabs > li.active > a,
.tab-wrapper.tab-right > .nav-tabs > li.active > a {
    border-top-color: #ddd !important
}

.tab-wrapper.tab-left .tab-content,
.tab-wrapper.tab-right .tab-content {
    overflow: auto;
    border-top: 1px solid #ddd
}

.tab-wrapper.tab-left > .nav-tabs {
    float: left;
    margin-right: -3px
}

.tab-wrapper.tab-left > .nav-tabs > li > a {
    border-right: 0
}

.tab-wrapper.tab-left > .nav-tabs > li.active > a {
    border-left: 2px solid #1abc9c
}

.tab-wrapper.tab-right > .nav-tabs {
    float: right;
    margin-left: -1px
}

.tab-wrapper.tab-right > .nav-tabs > li > a {
    border-left: 0
}

.tab-wrapper.tab-right > .nav-tabs > li.active > a {
    border-right: 2px solid #1abc9c
}

.tab-wrapper.tab-bottom > .tab-content {
    border-top: 1px solid #ddd
}

.tab-wrapper.tab-bottom > .nav-tabs {
    border-bottom: none;
    margin-top: 0
}

.tab-wrapper.tab-bottom > .nav-tabs > li.active > a {
    margin-top: -2px;
    border-top-color: transparent !important;
    border-bottom: 2px solid #1abc9c
}

.tab-primary.tab-wrapper > .nav-tabs > li.active > a {
    border-top-color: #1abc9c
}

.tab-primary.tab-wrapper.tab-left > .nav-tabs > li.active {
    border-left-color: #1abc9c
}

.tab-primary.tab-wrapper.tab-right > .nav-tabs > li.active {
    border-right-color: #1abc9c
}

.tab-primary.tab-wrapper.tab-bottom > .nav-tabs > li.active > a {
    border-bottom-color: #1abc9c
}

.panel {
    border: none;
    box-shadow: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px
}

.panel > .panel-heading {
    font-size: 13px;
    font-weight: 400;
    text-transform: uppercase;
    padding: 15px
}

.panel .actions {
    position: absolute;
    right: 30px;
    top: 15px
}

.panel .listActions {
    position: absolute;
    right: 15px;
    top: 15px
}

.panel .actions i {
    font-size: 1em;
    margin: 0 3px
}

.panel > .panel-footer {
    font-size: 13px;
    font-weight: 400;
    text-transform: uppercase;
    padding: 15px
}

.panel-default > .panel-heading {
    border-color: #eff2f7;
    background: #fafafa;
    color: #767676;
    cursor: pointer;
}

.panHeadHei {
    height: 50px
}

.btnMarginTop {
    margin-top: -6px !important
}

.mapPaddCon {
    padding: 0 !important;
    width: 100%;
    transition: all .6s;
    -moz-transition: all .6s;
    -webkit-transition: all .6s;
    -o-transition: all .6s;
    -ms-transition: all .6s
}

.mapAreaTransform {
    /*width: 100%;*/
    padding-right: 676px !important;
    transition: all .6s;
    -moz-transition: all .6s;
    -webkit-transition: all .6s;
    -o-transition: all .6s;
    -ms-transition: all .6s
}

.realTimeVideoReal {
    background-color: #fff;
    width: 0;
    transition: all .6s;
    -moz-transition: all .6s;
    -webkit-transition: all .6s;
    -ms-transition: all .6s;
    -o-transition: all .6s;
    display: none
}

.realTimeVideoShow {
    width: 676px;
    /*width: 42%;*/
    transition: all .6s;
    -moz-transition: all .6s;
    -webkit-transition: all .6s;
    -ms-transition: all .6s;
    -o-transition: all .6s;
    display: block
}

.panel-default .actions i {
    font-size: 1em;
    color: #bdc3c7;
    margin: 0 3px
}

.panel-default .actions i:hover {
    color: #767676
}

.panel-default > .panel-footer {
    border-color: #eff2f7;
    background: #fafafa;
    color: #767676
}

.panel-primary > .panel-heading {
    color: #fff;
    background-color: #1abc9c;
    border-color: #1abc9c
}

.panel-primary {
    border-color: #1abc9c
}

.panel-primary > .panel-heading a,
.panel-primary > .panel-heading a:hover {
    color: #fff
}

.panel-solid-default > .panel-body,
.panel-solid-default > .panel-footer,
.panel-solid-default > .panel-heading {
    background: #bdc3c7;
    color: #fff;
    border: none
}

.panel-solid-primary > .panel-body,
.panel-solid-primary > .panel-footer,
.panel-solid-primary > .panel-heading {
    background: #1abc9c;
    color: #fff;
    border: none
}

.panel-solid-success > .panel-body,
.panel-solid-success > .panel-footer,
.panel-solid-success > .panel-heading {
    background: #2dcc70;
    color: #fff;
    border: none
}

.panel-solid-warning > .panel-body,
.panel-solid-warning > .panel-footer,
.panel-solid-warning > .panel-heading {
    background: #f1c40f;
    color: #fff;
    border: none
}

.panel-solid-info > .panel-body,
.panel-solid-info > .panel-footer,
.panel-solid-info > .panel-heading {
    background: #3598db;
    color: #fff;
    border: none
}

.panel-solid-danger > .panel-body,
.panel-solid-danger > .panel-footer,
.panel-solid-danger > .panel-heading {
    background: #e84c3d;
    color: #fff;
    border: none
}

.panel .cartreeTable {
    padding: 15px;
    background: #ccc
}

.step-content {
    border: 1px solid #D4D4D4;
    border-top: 0;
    border-radius: 0 0 4px 4px;
    padding: 10px;
    margin-bottom: 10px
}

.panelCar-body {
    margin-top: 20px
}

.carTree {
    min-height: 670px
}

.carTree h3 {
    font-weight: 700;
    color: #6dcff6;
    text-align: center;
    line-height: 30px;
    font-size: 18px;
    border-bottom: 1px solid #ddd
}

.panelCar-body > .panelCarBg {
    background: #fff;
    border-radius: 4px;
    border: 1px solid #ddd
}

.panelline {
    margin-left: 25px;
    padding: 15px
}

.dsearch {
    display: inline
}

.wizard {
    position: relative;
    overflow: hidden;
    background-color: #f9f9f9;
    border: 1px solid #d4d4d4;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .065);
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, .065);
    box-shadow: 0 1px 4px rgba(0, 0, 0, .065)
}

.wizard:after,
.wizard:before {
    display: table;
    line-height: 0;
    content: ""
}

.wizard:after {
    clear: both
}

.wizard ul {
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none outside non
}

.wizard ul.previous-disabled li.complete {
    cursor: default
}

.wizard ul.previous-disabled li.complete:hover {
    color: #468847;
    cursor: default;
    background: #f3f4f5
}

.wizard ul.previous-disabled li.complete:hover .chevron:before {
    border-left-color: #f3f4f5
}

.wizard ul li {
    position: relative;
    float: left;
    height: 46px;
    padding: 0 20px 0 30px;
    margin: 0;
    font-size: 16px;
    line-height: 46px;
    color: #999;
    cursor: default;
    background: #ededed
}

.wizard ul li .chevron {
    position: absolute;
    top: 0;
    right: -14px;
    z-index: 1;
    display: block;
    border: 24px solid transparent;
    border-right: 0;
    border-left: 14px solid #d4d4d4
}

.wizard ul li .chevron:before {
    position: absolute;
    top: -24px;
    right: 1px;
    display: block;
    border: 24px solid transparent;
    border-right: 0;
    border-left: 14px solid #ededed;
    content: ""
}

.wizard ul li.complete {
    color: #6dcff6;
    background: #f3f4f5
}

.wizard ul li.complete:hover {
    background: #e5f8ff
}

.wizard ul li.complete:hover .chevron:before {
    border-left: 14px solid #e5f8ff
}

.wizard ul li.complete .chevron:before {
    border-left: 14px solid #f3f4f5
}

.wizard ul li.active {
    color: #6dcff6;
    background: #fff
}

.wizard ul li.active .chevron:before {
    border-left: 14px solid #6dcff6
}

.wizard ul li .badge {
    margin-right: 8px;
    position: relative;
    top: -1px;
    border-radius: 50% !important;
    width: 20px !important;
    height: 20px !important;
    line-height: 20px;
    padding: 0 !important
}

.wizard ul li .asterisk {
    vertical-align: middle
}

.wizard ul li.active span.asterisk {
    color: #fff
}

.wizard ul li:first-child {
    padding-left: 20px;
    border-radius: 4px 0 0 4px
}

.wizard .actions {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1000;
    float: right;
    padding-right: 15px;
    padding-left: 15px;
    line-height: 46px;
    vertical-align: middle
}

.wizard .actions a {
    margin-right: 8px;
    font-size: 12px;
    line-height: 45px
}

.wizard .actions .btn-prev i {
    margin-right: 5px;
    color: #fff
}

.wizard .actions .btn-next i {
    margin-left: 5px;
    color: #fff
}

.wizard .actions .btn-prev[disabled] i {
    color: rgba(255, 255, 255, .75)
}

.step-content .active {
    display: block
}

.step-content .active .btn-group .active {
    display: inline-block
}

.step-content label {
    white-space: nowrap;
    text-align: center
}

.wizard .steps .badge.badge-info,
.wizard .steps .badge.badge-success {
    background-color: #6dcff6
}

.form-group .title {
    text-align: right
}

#view-mail-wrapper header {
    color: #a2a2a2
}

#view-mail-wrapper header h2 {
    border-bottom: 1px solid #ddd;
    padding: 0 0 15px
}

#view-mail-wrapper header p {
    position: absolute;
    right: 35px;
    top: 48px
}

#view-mail-wrapper .view-mail-header {
    padding-top: 5px
}

#view-mail-wrapper .view-mail-header img {
    margin-right: 10px
}

#view-mail-wrapper .view-mail-reply {
    margin-top: 12px
}

#view-mail-wrapper .view-mail-body {
    border-top: 1px solid #ddd;
    padding-top: 15px;
    margin-top: 15px
}

#view-mail-wrapper .view-mail-body p {
    line-height: 1.8em
}

#view-mail-wrapper .view-compose-body .panel-footer,
#view-mail-wrapper .view-mail-body .panel-footer {
    background: #fff;
    border-bottom: 1px solid #ddd;
    border-radius: 0;
    padding: 15px 0
}

#view-mail-wrapper .view-mail-body .panel-footer h5 {
    display: inline-block
}

#view-mail-wrapper .view-mail-body .panel-footer .attchments {
    padding: 0 8px;
    text-transform: lowercase
}

#view-mail-wrapper .view-mail-body .panel-footer button.pull-right {
    margin: 0 0 0 8px
}

.send-options {
    display: inline-block;
    font-size: 14px;
    position: absolute;
    right: 45px;
    top: 22px
}

.send-options a {
    color: #979797
}

.compose-nav > li + li {
    margin-left: 0;
    margin-top: 0
}

.compose-nav li a,
.compose-nav li a:visited {
    border-radius: 0;
    -webkit-border-radius: 0;
    border-top: 1px solid #f2f3f6;
    padding: 15px;
    border-right: 3px solid transparent;
    color: #5D5F63
}

.compose-nav > li.active > a,
.compose-nav > li.active > a:focus,
.compose-nav > li.active > a:hover,
.compose-nav > li > a:focus,
.compose-nav > li > a:hover {
    background: #f9f9f9;
    color: #1abc9c;
    border-left: 3px solid #1abc9c;
    margin-left: -3px
}

.mail-checkbox {
    margin: 0 15px 0 8px
}

.mail-option .btn-group .fa-refresh,
.pag-left,
.pag-right {
    color: #fff
}

.inbox-pag li {
    float: left;
    margin-left: 5px
}

.inbox-pag li span {
    display: inline-block;
    margin-top: 7px;
    margin-right: 5px
}

.compose-nav {
    margin: 15px -15px 0 -15px
}

.table-inbox span.title {
    display: block;
    font-weight: 700
}

.table-inbox tr {
    background: #f9f9f9
}

.table-inbox tr.unread {
    background: #fff
}

.table-inbox a,
.table-inbox a:visited {
    color: #5D5F63
}

.table-inbox .unread a,
.table-inbox .unread a:visited {
    color: #1abc9c
}

.table-inbox .fa-star {
    color: #f1c40f
}

.overlay {
    display: block;
    text-align: center;
    color: #fff;
    font-size: 60px;
    line-height: 80px;
    opacity: .8;
    background: #1ABC9C;
    border: solid 3px #1ABC9C;
    border-radius: 4px;
    box-shadow: 2px 2px 10px #333;
    text-shadow: 1px 1px 1px #666;
    padding: 0 4px
}

.overlay_arrow {
    left: 50%;
    margin-left: -16px;
    width: 0;
    height: 0;
    position: absolute
}

.overlay_arrow.above {
    bottom: -15px;
    border-left: 16px solid transparent;
    border-right: 16px solid transparent;
    border-top: 16px solid #1ABC9C
}

.overlay_arrow.below {
    top: -15px;
    border-left: 16px solid transparent;
    border-right: 16px solid transparent;
    border-bottom: 16px solid #1ABC9C
}

#login-container {
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

#login-wrapper {
    margin: 100px auto;
    float: none
}

#login-wrapper .logo {
    color: #fff;
    font-size: 1.7em;
    text-transform: uppercase;
    display: inline-block
}

#login-wrapper .logo:before {
    background-image: url(/clbs/resources/img/logo.png);
    background-position: left center;
    background-repeat: no-repeat;
    padding: 0 20px;
    content: "\00a0"
}

#login-wrapper .form-group i {
    position: absolute;
    left: 27px;
    top: 11px
}

#login-wrapper #email,
#login-wrapper #password {
    padding-left: 32px
}

#error-container {
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    color: #fff;
    background: #405d8c;
    background: -moz-radial-gradient(center, ellipse cover, #405d8c 0, #293949 100%);
    background: -webkit-gradient(radial, center center, 0, center center, 100%, color-stop(0, #405d8c), color-stop(100%, #293949));
    background: -webkit-radial-gradient(center, ellipse cover, #405d8c 0, #293949 100%);
    background: -o-radial-gradient(center, ellipse cover, #405d8c 0, #293949 100%);
    background: -ms-radial-gradient(center, ellipse cover, #405d8c 0, #293949 100%);
    background: radial-gradient(ellipse at center, #405d8c 0, #293949 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#405d8c',
    endColorstr='#293949', GradientType=1)
}

#error-container .block-error {
    width: 400px;
    margin: 50px auto 0
}

#error-container header h1.error {
    color: #fff;
    font-size: 250px
}

#error-container header p {
    color: #fff;
    text-transform: uppercase;
    font-size: 30px
}

#error-container p {
    margin: 10px 0 40px
}

.ladydataTitle {
    text-align: center
}

.dataTableBorderT {
    border-bottom: 1px solid #ddd
}

.dataTableBorderL {
    border-right: 1px solid #ddd
}

.ToolPanellable label {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 7px;
    text-align: right
}

.timeline {
    border-collapse: collapse;
    border-spacing: 0;
    display: table;
    position: relative;
    table-layout: fixed;
    width: 100%
}

.timeline .time-layer {
    margin-right: -40px;
    margin-top: 30px;
    position: relative;
    margin-bottom: 30px
}

.timeline:before {
    background-color: #d8d9df;
    bottom: 0;
    content: "";
    left: 50%;
    position: absolute;
    top: 30px;
    width: 1px;
    z-index: 0
}

h3.timeline-title {
    color: #C8CCD7;
    font-size: 20px;
    font-weight: 400;
    margin: 0 0 5px;
    text-transform: uppercase
}

.timeline-layer .panel .panel-heading h1 i {
    color: #BDC3C7
}

.timeline-item.left:after,
.timeline-item:before {
    content: "";
    display: block;
    width: 50%
}

.timeline-item {
    display: table-row
}

.timeline-layer {
    display: table-cell;
    vertical-align: top;
    width: 50%
}

.timeline-layer h1 {
    font-size: 16px;
    font-weight: 300;
    margin: 0 0 5px
}

.timeline-layer .panel {
    display: block;
    margin-left: 45px;
    position: relative;
    text-align: left;
    background: #fff
}

.timeline-item .timeline-layer .arrow {
    border-bottom: 8px solid transparent;
    border-top: 8px solid transparent;
    display: block;
    height: 0;
    left: -7px;
    position: absolute;
    top: 13px;
    width: 0;
    border-right: 8px solid #fff
}

.timeline-item.left .timeline-layer .arrow-left {
    border-bottom: 8px solid transparent;
    border-top: 8px solid transparent;
    display: block;
    height: 0;
    right: -7px;
    position: absolute;
    top: 13px;
    width: 0;
    left: auto;
    border-left: 8px solid #fff
}

.timeline .timeline-icon {
    left: -60px;
    position: absolute;
    top: 5px;
    background: #bdc3c7;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    display: block;
    height: 30px;
    width: 30px;
    text-align: center;
    color: #fff
}

.timeline .timeline-icon i {
    margin-top: 9px
}

.timeline-item.left .timeline-icon {
    left: auto;
    right: -60px
}

.timeline .time-icon:before {
    font-size: 16px;
    margin-top: 5px
}

.timeline .timeline-date {
    left: -245px;
    position: absolute;
    text-align: right;
    top: 12px;
    width: 150px;
    display: none
}

.timeline-item.left .timeline-date {
    left: auto;
    right: -245px;
    text-align: left;
    display: none
}

.timeline-layer p {
    font-size: 14px;
    margin-bottom: 0;
    color: #999
}

.timeline-layer .panel {
    margin-bottom: 5px
}

.timeline-layer .album {
    margin-top: 20px
}

.timeline-item.left .timeline-layer .album {
    margin-top: 20px;
    float: right
}

.timeline-layer .notification {
    background: #FFF;
    margin-top: 20px;
    padding: 4px
}

.timeline-item.left .panel {
    margin-left: 0;
    margin-right: 45px
}

.timeline-item.left h1,
.timeline-item.left p {
    text-align: right
}

#cal {
    background: #fff;
    padding: 20px;
    -webkit-border-radius: 0 3px 3px 0;
    -moz-border-radius: 0 3px 3px 0;
    -ms-border-radius: 0 3px 3px 0;
    -o-border-radius: 0 3px 3px 0;
    border-radius: 0 3px 3px 0
}

#events {
    background: #1ABC9C;
    color: #fff;
    height: 755px;
    -webkit-border-radius: 3px 0 0 3px;
    -moz-border-radius: 3px 0 0 3px;
    -ms-border-radius: 3px 0 0 3px;
    -o-border-radius: 3px 0 0 3px;
    border-radius: 3px 0 0 3px
}

#events h2 {
    font-size: 3em;
    font-weight: 300
}

#events h3 {
    font-size: 2em;
    font-weight: 300;
    padding: 0;
    margin: 0 0 50px
}

.external-event.ui-draggable {
    margin: 10px 0;
    padding: 5px;
    background: #149e82;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px
}

.external-event.ui-draggable:hover {
    cursor: move
}

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

.pagination > li > a,
.pagination > li > span {
    color: #6dcff6
}

.default-bg {
    background-color: #bdc3c7
}

.primary-bg {
    background-color: #1abc9c
}

.success-bg {
    background-color: #2dcc70
}

.warning-bg {
    background-color: #f1c40f
}

.info-bg {
    background-color: #3598db
}

.danger-bg {
    background-color: #e84c3d
}

.default-txt {
    color: #bdc3c7
}

.primary-txt {
    color: #1abc9c
}

.success-txt {
    color: #2dcc70
}

.warning-txt {
    color: #f1c40f
}

.info-txt {
    color: #3598db
}

.danger-txt {
    color: #e84c3d
}

.label-default {
    background-color: #bdc3c7
}

.label-primary {
    background-color: #1abc9c
}

.label-success {
    background-color: #2dcc70
}

.label-warning {
    background-color: #f1c40f
}

.label-info {
    background-color: #3598db
}

.label-danger {
    background-color: #e84c3d
}

.canvas-container {
    min-height: 300px;
    max-height: 600px;
    position: relative
}

.cycleVS {
    width: 100%;
    height: 476px
}

.mileageVS {
    width: 100%;
    height: 250px
}

.mileageStatistics {
    width: 100%;
    height: 250px
}

.hotspoteChart {
    width: 100%;
    height: 500px;
    background-color: transparent !important
}

.speedName {
    margin: 13px 0 0 0
}

.cycle-comparison,
.mileage-comparison {
    margin: 15px 0 0 0
}

.all-statistics-area .area {
    height: 120px
}

.all-statistics-area .area > div,
.all-statistics-area .area > div > div {
    padding: 0
}

.report-group {
    background-color: #27a9e3;
    width: 49%;
    margin: 0 2% 0 0;
    padding: 0
}

.report-group ul a {
    color: #333 !important
}

.report-group #selectGroup {
    font-size: 22px;
    font-weight: 700
}

.report-group .groupNameShow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%
}

.report-group #selectTotalMile {
    font-size: 18px;
    font-weight: 700
}

.report-group #selectTotalVehicleCount,
.report-group .selectTotalVehicleCount {
    font-size: 12px;
    margin: 10px 0 0 0
}

.report-group,
.report-group a,
.report-speed,
.report-speed a,
.report-stoptime,
.report-stoptime a,
.report-time,
.report-time a {
    color: #fff !important
}

.report-group .area,
.report-speed .area,
.report-stoptime .area,
.report-time .area {
    height: 105px;
    padding: 0 15px 0 15px !important
}

.report-group .report-group-more {
    height: 35px;
    line-height: 35px;
    background-color: #2295c9 !important;
    font-size: 12px
}

.report-group .report-group-more > div {
    padding: 0
}

.report-group .report-group-more:hover {
    background-color: #1f8aba !important
}

#monment {
    padding: 0;
    height: 200px;
    width: 100%;
    background-color: #ddf5ff;
    position: absolute;
    top: 140px;
    right: 0;
    display: none;
    z-index: 999999999999;
    overflow: auto
}

.report-time {
    background-color: #28b779;
    width: 49%;
    padding: 0
}

.report-time .report-time-more {
    height: 35px;
    line-height: 35px;
    background-color: #17a769 !important;
    font-size: 12px
}

.report-time .report-time-more:hover {
    background-color: #159a61 !important
}

.report-time .report-time-more > div {
    padding: 0
}

.report-time .sgstvc-top {
    font-size: 22px;
    font-weight: 700;
    margin: 7px 0 0 0
}

.report-time #avgTravelTime,
.report-time .avgTravelTime {
    font-size: 12px;
    font-weight: 300;
    margin: 10px 0 0 0
}

.reportStoptimeName,
.reportTimeName {
    font-size: 22px;
    font-weight: 700
}

.report-time #selectTotalTravelTime {
    font-size: 18px;
    font-weight: 700
}

.report-stoptime {
    background-color: #ed4e2a;
    width: 49%;
    margin: 0 2% 0 0;
    padding: 0
}

.report-stoptime .report-stoptime-more {
    height: 35px;
    line-height: 35px;
    background-color: #c54224 !important;
    font-size: 12px
}

.report-stoptime .report-stoptime-more:hover {
    background-color: #bc3f23 !important
}

.report-stoptime .report-stoptime-more > div {
    padding: 0
}

.report-stoptime .sgstvc-top {
    font-size: 22px;
    font-weight: 700;
    margin: 7px 0 0 0
}

.report-stoptime .avgDownTime {
    font-size: 12px;
    font-weight: 300;
    margin: 10px 0 0 0
}

.report-stoptime #selectTotalDownTime {
    font-size: 18px;
    font-weight: 700
}

.report-speed {
    background-color: #852b99;
    width: 49%;
    padding: 0
}

.report-speed .report-speed-more {
    height: 35px;
    line-height: 35px;
    background-color: #751e88 !important;
    font-size: 12px
}

.report-speed .report-speed-more:hover {
    background-color: #6c1c7e !important
}

.report-speed .report-speed-more > div {
    padding: 0
}

.report-speed .sgstvc-speed-top {
    font-size: 22px;
    font-weight: 700;
    margin: 26px 0 0 0
}

.report-speed #selectTotalOverSpeedTimes {
    font-size: 18px;
    font-weight: 700
}

.report-speed .reportSpeedAvg {
    font-size: 12px;
    font-weight: 300;
    margin: 10px 0 0 0
}

.report-speed .speedNum {
    font-size: 22px;
    font-weight: 700
}

.heroRanking {
    padding: 0
}

.heroRanking li {
    margin: 0 0 8px 0;
    height: 28px;
    white-space: nowrap;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    overflow: hidden
}

.bigDataHero {
    height: 28px;
    padding: 0 0 0 32px;
    line-height: 28px;
    font-style: normal
}

#mostDiligent {
    color: #f90;
    font-size: 16px
}

#mostLazy {
    color: #999;
    font-size: 16px
}

#mostFar {
    color: #6dcff6;
    font-size: 16px
}

#mintFar {
    color: #c80002;
    font-size: 16px
}

#safe {
    color: #78af3a;
    font-size: 16px
}

#danger {
    color: #960ba3;
    font-size: 16px
}

.heroRanking li:nth-child(1) {
    background: #fafafa url(/clbs/resources/img/mostDiligent.svg) no-repeat;
    background-size: 28px 28px
}

.heroRanking li:nth-child(2) {
    background: #fafafa url(/clbs/resources/img/mostLazy.svg) no-repeat;
    background-size: 28px 28px
}

.heroRanking li:nth-child(3) {
    background: #fafafa url(/clbs/resources/img/mostFar.svg) no-repeat;
    background-size: 28px 28px
}

.heroRanking li:nth-child(4) {
    background: #fafafa url(/clbs/resources/img/mintFar.svg) no-repeat;
    background-size: 28px 28px
}

.heroRanking li:nth-child(5) {
    background: #fafafa url(/clbs/resources/img/safe.svg) no-repeat;
    background-size: 28px 28px
}

.heroRanking li:nth-child(6) {
    background: #fafafa url(/clbs/resources/img/danger.svg) no-repeat;
    background-size: 28px 28px
}

.cityStayTime {
    position: absolute;
    top: 20%;
    right: 0;
    width: 35%;
    font-size: 12px;
    font-weight: 700
}

.cityStayTime ul {
    text-align: right;
    display: inline;
    line-height: 24px
}

.toThePlace {
    position: absolute;
    bottom: 15%;
    left: 0;
    width: 30%;
    font-size: 12px;
    font-weight: 700
}

.toThePlace ul {
    display: inline
}

.toThePlace ul li {
    line-height: 24px
}

#milePercent {
    font-size: 28px;
    font-weight: 700;
    color: #f90
}

#curCar {
    font-weight: 700 !important
}

.cycleComparisonInfo ul li,
.mileageStatisticsInfo ul li {
    margin: 0 0 5px 0
}

#differTotalTravelTime .dateColr {
    color: #78af3a
}

#differTotalDownTime .dateColr {
    color: #c80002
}

.btn-alarm-manage {
    width: auto;
    min-width: 69pt;
    padding: 9px 4px !important;
}

#warningManageListening {
    margin-left: -7px;
}

/*#warningManageAffirm {
  width: 110pt
}*/

.input-group .form-control:not(:first-child):not(:last-child) {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 4px !important;
    border-top-left-radius: 4px !important
}

.btn-white,
.select-list li,
.select-list li:hover,
.select-value {
    color: #717171
}

.btn-width-select {
    margin: 0 0 0 -1px;
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important
}

.is-open {
    display: block !important
}

.select-list {
    display: none;
    width: 100%;
    background-color: #fff;
    border-radius: 4px;
    list-style: none;
    margin: 3px 0 0 0;
    padding: 0;
    z-index: 100;
    border: 1px solid #ccc !important;
    max-height: 192px;
    overflow: auto;
    position: absolute;
    top: 94%;
    left: 0
}

.select-list li {
    line-height: 20px;
    height: 20px;
    padding: 0 .7em 0 .7em
}

.select-list li:hover {
    background-color: #1e90ff;
    color: #fff
}

.select-value {
    line-height: 22px !important
}

.form-horizontal .has-feedback .form-control-feedback {
    top: 1px !important;
    right: 17px !important
}

.control-label {
    font-weight: 700 !important
}

.alarmSettingDropdown {
    width: 204px
}

#zTreeContent {
    border-radius: 4px;
    top: 36px !important
}

#goTraceResponse {
    z-index: 99999 !important
}

.actions2 {
    position: relative !important;
    top: 4px !important;
    left: 95px !important;
    z-index: 999 !important;
    width: 38px;
    height: 38px;
    background: #fff;
    line-height: 38px;
    text-align: center;
    float: left;
    cursor: pointer;
    border-radius: 3px;
    box-shadow: 1px 1px 10px #ccc
}

.actions3 {
    position: relative !important;
    border-left-color: 30px !important;
    top: 5px !important;
    left: 0 !important;
    z-index: 999 !important;
    width: 41px;
    height: 32px;
    background: #6dcff6 !important;
    line-height: 20px;
    text-align: center;
    float: left;
    cursor: pointer;
    padding-top: 5px;
    border-radius: 3px;
    margin-top: 1.5px;
    margin-right: 12px
}

.refreshBtn {
    /*width: 56px*/
}

.fastClear .delIcon {
    right: 45px;
}

.monitoringObj .imgBox {
    position: relative;
    padding-left: 26px
}

.dropIcon {
    position: absolute;
    width: 15px;
    top: 2px;
    left: 1px;
    background-color: #8a6d3b;
}

.noPadding {
    padding: 0
}

.noLeftPadding {
    padding-left: 0;
}

.noRightPadding {
    padding-right: 0;
}

.sixRightPadding {
    padding-right: 6px;
}

.dataTables_wrapper,
.dataTables_wrapper .col-md-2.col-sm-12,
.dataTables_wrapper .col-md-4.col-sm-12,
.dataTables_wrapper .col-md-6.col-sm-12 {
    position: static !important;
}

.dataTables_wrapper .row {
    height: 40px;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

div.panel-body {
    position: relative;
}

.dataTables_wrapper .dataTables_length {
    position: absolute;
    left: 0;
    padding-left: 15px;
}

.dataTables_wrapper .dataTables_info {
    position: absolute;
    left: 200px;
    margin-left: 20px !important;
}

.dataTables_wrapper .dataTables_paginate {
    position: absolute;
    right: 15px;
}

.dataTables_wrapper .dataTables_paginate {
    padding-right: 15px;
}

label.control-label {
    padding-right: 0;
    padding-left: 0;
}

.syntheticBox select {
    margin-right: -4px;
    border-radius: 4px 0 0 4px;
    border-right: 1px solid transparent;
}

.syntheticBox input {
    border-radius: 0 4px 4px 0
}

@-webkit-keyframes rotation {
    from {
        -webkit-transform: rotate(0)
    }

    to {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes rotation {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.loading-state {
    -webkit-transform: rotate(360deg);
    animation: rotation 1s linear infinite;
    -moz-animation: rotation 1s linear infinite;
    -webkit-animation: rotation 1s linear infinite;
    -o-animation: rotation 1s linear infinite
}

.loading-state-button.disabled {
    background-color: #fff;
    color: #717171
}

.slide-code {
    width: 100%;
    height: 40px;
    position: relative;
    border: 1px solid #cfcfcf;
    background-color: #f5f5f5;
    overflow: hidden;
    text-align: center;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    border-radius: 3px
}

.slide-code-bg {
    height: 100%;
    background-color: #e8e8e8;
    z-index: 1
}

.slide-code-bg,
.slide-code-label {
    position: absolute;
    left: 0;
    top: 0
}

.slide-code-label {
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-right: 1px solid #cfcfcf;
    border-top: none;
    border-bottom: none;
    border-left: none;
    background: #fff;
    z-index: 3;
    cursor: move;
    background: #fff url(/clbs/resources/img/codee.png) no-repeat center
}

.slide-code-labeltip {
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    font-size: 13px;
    color: #787878;
    line-height: 40px;
    text-align: center;
    z-index: 2
}

.login_msg,
.slide-code-labeltip {
    font-family: "Microsoft Yahei", 微软雅黑
}

.Inlinesearch {
    width: 300px
}

.terminal-video-yes {
    background: url(/clbs/resources/img/terminal_video_yes.svg) no-repeat;
    width: 23px;
    height: 14px;
    margin: 0 auto
}

.terminal-video-no {
    background: url(/clbs/resources/img/terminal_video_no.svg);
    width: 23px;
    height: 14px;
    margin: 0 auto
}

.input-group-btn .dropdown-menu {
    padding-left: 0;
    padding-right: 0;
    margin-top: 0;
    border-radius: 0 0 4px 4px;
    background-color: #fff !important;
}

.input-group-btn .table {
    margin-bottom: 0;
}

.input-group-btn .table > tbody > tr > td {
    padding-left: 10px;
    border-bottom: 1px solid #e9e9e9 !important;
}

.input-group-btn .bssuggest-row.hover {
    background: #ecf6fd;
    color: #108ee9
}

.input-group-btn .bssuggest-row:hover {
    background: #ecf6fd;
}

.input-group-btn .btn {
    margin-bottom: 0;
}

.input-group-btn .btn[disabled] {
    color: #000;
    background-color: #fff;
}

.leftTreeBox {
    position: relative;
    float: left;
    width: 275px;
}

.rightDataList {
    position: relative;
    float: left;
    width: calc(100% - 280px);
}

.rightDataList .panel-heading {
    position: relative;
}

.pretendHidden {
    opacity: 0;
    width: 0;
    height: 0;
    border: none;
    outline: none;
    margin-left: -2px;
    background: none;
}

/*组织树模糊搜索*/
.moreQueryGroup {
    padding-left: 125px;
}

.treeSelect {
    position: absolute;
    width: 115px;
    float: left;
    height: 34px !important;
    top: 1px;
    left: 16px;
    z-index: 999;
    border-radius: 4px 0 0 4px;
    border: none;
    border-right: 1px solid #ccc;
}

#basicStatusInformation div,
#v-statusInfo-show div,
.amap-info-contentContainer div {
    word-break: break-all;
}

#realSetBtn {
    height: 36px;
    padding: 6px 14px;
}

#realSetBtn span {
    font-size: 24px;
}

#realSetMenu a {
    padding-left: 6px;
    cursor: pointer;
}

#realSetMenu a i {
    margin-right: 10px;
}

#showAliases i {
    opacity: 0;
}

.aliasesStyle {
    display: none;
}

.aliasesShow {
    display: inline-block;
}

.showInput {
    margin-right: 10px !important;
    vertical-align: -1px;
}

.countStyle {
    display: none;
}

.countShow {
    color: #6dcff6;
    display: inline-block;
}

/* 809平台数据交互管理 */
#interactiveData table th,
#interactiveData table td {
    vertical-align: middle !important;
}

#vehicleInfoDataBox,
#orgInfoDataBox,
#vehicleOperationStateBox,
#platformAssessDataBox,
#orgAssessDataBox,
#orgVehicleAssessDataBox {
    display: none
}

.yearTimeInput,
.quarterTimeInput,
.monthTimeInput,
.weekTimeInput {
    display: none;
}

@media only screen and (max-width: 767px) and (min-width: 480px) {
    #main-content .h1 {
        font-size: 35px
    }

    .report-group,
    .report-speed,
    .report-stoptime,
    .report-time {
        width: 100%
    }

    .report-group .area {
        height: 110px
    }
}

@media only screen and (max-width: 660px) {
    #header {
        height: 160px
    }

    #header .brand {
        width: 100%
    }

    #header .user-nav ul {
        padding-left: 0
    }

    #header .toggle-navigation.toggle-left {
        float: left
    }

    footer .imitateMenuBg {
        width: 0
    }

    footer .defaultFootBg {
        width: 100%
    }

    footer > p {
        padding-top: 5px;
    }

    .tooltip.in {
        opacity: 0
    }

    .sidebar {
        margin-left: -660px;
        width: 660px
    }

    .sidebar-toggle {
        margin-left: -660px
    }

    .main-content-wrapper {
        margin-left: 0
    }

    .main-content-toggle-left {
        margin-left: 660px
    }

    .sidebarRight {
        top: 160px;
        width: 100%
    }

    .user-nav ul li {
        font-size: 12px
    }

    .report-group,
    .report-speed,
    .report-stoptime,
    .report-time {
        width: 100%
    }

    .report-group .area {
        height: 110px
    }

    .panel-right-border {
        border-left: none;
        border-top: 1px solid #eff2f7
    }

    .real-time-command-list {
        float: none !important
    }
}

@media only screen and (min-width: 320px) and (max-width: 960px) {
    #dataTable_length label {
        margin: 0
    }

    #dataTable_info {
        margin: 0 0 10px 0;
        float: left
    }

    #dataTable_paginate {
        float: left;
        margin: 0 0 10px 0
    }

    .toggle-left-h2 h2 {
        font-size: 20px
    }

    .report-group,
    .report-speed,
    .report-stoptime,
    .report-time {
        width: 100%
    }

    .report-group .area {
        height: 110px
    }

    .real-time-command-list {
        float: none !important
    }

    @media only screen and (max-width: 479px) {
        #main-content .h1 {
            font-size: 22px
        }

        @media only screen and (max-width: 479px) {
            .toggle-left-h2 h2 {
                font-size: 18px
            }

            @media only screen and (max-width: 479px) {
                .carTree h1 {
                    font-size: 26px
                }

                #header .dropdown.messages {
                    display: none
                }

                .container-area i.left-btn {
                    background-image: url(/clbs/resources/img/hover_left_2.png);
                    background-position: 0 center;
                    top: 104px;
                    left: 0;
                    width: 52px;
                    height: 387px
                }

                .container-area i.right-btn {
                    background-image: url(/clbs/resources/img/hover_right_2.png);
                    right: 0;
                    top: 104px;
                    background-position: 0 center;
                    width: 52px;
                    height: 387px
                }

                .toopTip-btn-right {
                    width: 40px;
                    margin-left: -11px
                }

                .toopTip-btn-left {
                    margin-left: -187px
                }

                .container-area i.left-btn:hover {
                    background-image: url(/clbs/resources/img/hover_left_2.png);
                    width: 52px;
                    height: 387px;
                    background-position: 0 center
                }

                .container-area i.right-btn:hover {
                    background-image: url(/clbs/resources/img/hover_right_2.png);
                    width: 52px;
                    height: 387px;
                    background-position: 0 center
                }

                .toopTip-btn-left:hover {
                    background: -webkit-linear-gradient(left, rgba(196, 225, 245, 0), rgba(196, 225, 245, 0));
                    background: -o-linear-gradient(left, rgba(196, 225, 245, 0), rgba(196, 225, 245, 0));
                    background: -moz-linear-gradient(left, rgba(196, 225, 245, 0), rgba(196, 225, 245, 0));
                    background: linear-gradient(left, rgba(196, 225, 245, 0), rgba(196, 225, 245, 0))
                }

                .toopTip-btn-right:hover {
                    background: -webkit-linear-gradient(right, rgba(196, 225, 245, 0), rgba(196, 225, 245, 0));
                    background: -o-linear-gradient(right, rgba(196, 225, 245, 0), rgba(196, 225, 245, 0));
                    background: -moz-linear-gradient(right, rgba(196, 225, 245, 0), rgba(196, 225, 245, 0));
                    background: linear-gradient(right, rgba(196, 225, 245, 0), rgba(196, 225, 245, 0))
                }

                .real-time-command-list {
                    float: none !important
                }
            }

            @media only screen and (max-width: 1030px) {
                .wizard ul {
                    max-width: 1030px
                }
            }
        }
    }
}

/*自定义switch开关样式*/
.mySwitch {
    display: inline-block;
    width: 62px;
    height: 26px;
    line-height: 26px;
    color: #fff;
    cursor: pointer;
    box-sizing: border-box;
    border-radius: 28px;
    background-color: rgb(26, 188, 156);
}

.openRecordEnable {
    background-color: #ccc;
}

.mySwitch span {
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: -4px;
    background-color: #fff;
    border-radius: 18px;
    vertical-align: -4px;
}

.go-track-playback {
    display: block;
    width: 20px;
    height: 20px;
    position: relative;
    top: -10px;
    left: -10px;
}

.carousel_item {
    width: 1330px;
    height: 575px;
    border: 1px solid #d8d8d8;
    border-radius: 4px;
    margin-left: 57px;
    margin-top: 20px;
}

.carousel_font {
    margin-left: 20px;
    color: #000000;
}

.carousel_img {
    width: 1300px;
    height: 470px;
    margin-left: 14px;
    margin-top: 12px;
}

#carousel-example-generic .carousel-control.left {
    background-image: none;
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
}

#carousel-example-generic .carousel-control.right {
    left: auto;
    right: 0;
    background-image: none;
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
}

.carousel-indicators li {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin: 0;
    background-color: #fff;
    border: 1px solid #d8d8d8;
}

.carousel-indicators .active {
    width: 30px;
    height: 30px;
    background-color: #6dcff6;
    border: 1px solid #6dcff6;
}

.carousel-indicators .active span {
    color: #fff;
}

.activeBlack span {
    color: #d8d8d8;
}

/*地图弹窗样式*/
#basicStatusInformation {
    float: left;
}

.mapInfoDetail {
    width: 200px;
    min-height: 300px;
    max-height: 360px;
    overflow-y: auto;
    display: none;
    float: left;
    padding: 0 20px;
    border-left: 1px solid #929294;
}

.BMap_bubble_content .mapInfoDetail {
    height: 100%;
    overflow: auto;
}

.BMap_bubble_content {
    overflow: auto !important;
}

.olMap .mapInfoDetail {
    max-height: 300px;
    overflow: auto;
}

.BMap_bubble_content .mapInfoDetail {
    width: 190px !important;
}

.BMap_bubble_content .mapInfoDetail div {
    text-align: left !important;
}

.BMap_bubble_content .mapInfoDetail div, .olMap .mapInfoDetail div {
    word-wrap: break-word;
    text-align: justify;
}

.centerMapInfo {
    border-left: 1px solid #929294;
    border-right: 1px solid #929294;
}

.modal-open .layui-laydate {
    z-index: 1050;
}

/*
* 巡检应答弹窗样式
*/
#selectImgBox {
    display: flex;
    align-items: center;
    justify-content: center;
}

#selectImgBox .inpFilePhoto {
    line-height: 23px;
}

#selectImgBox button {
    margin: 0 0 0 15px;
}

#answerPhotoWrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 200px;
    height: 241px;
    margin: 0 32px 15px;
    text-align: center;
    overflow: hidden;
    background-color: rgb(215, 215, 215);
}

#answerPhotoImg {
    display: none;
    max-width: 100%;
    max-height: 100%;
    height: auto;
}

#takingPicturesBox {
    position: absolute;
    display: none;
    top: 12px;
    left: 122px;
    padding: 5px;
    border: 1px solid #ccc;
    background-color: #fff;
}

#picturesVideo {
    display: block;
    object-fit: fill;
    margin-bottom: 10px;
    background-color: rgb(215, 215, 215);
}

#pictureBtnGroup {
    display: flex;
    justify-content: center;
}

#pictureSnap {
    margin-right: 35px;
}

.lineAndStop {
    color: #c80002 !important;
}

.lineAndmiss {
    color: #754801 !important;
}

.lineAndRun {
    color: #78af3a !important;
}

.lineAndAlarm {
    color: #ffab2d !important;
}

.overSpeed {
    color: #960ba3 !important;
}

.nmoline {
    color: #b6b6b6 !important;
}

.heartBeat {
    color: #fb8c96 !important;
}

.dropdown-nav-voices {
    position: absolute;
    top: 13px;
    right: -21px;
    cursor: pointer;
    display: none;
}

/*天地图*/
.tdt-infowindow-content {
    overflow: auto;
}

.googleMonitorName {
    position: relative;
    padding: 4px 3px;
    display: block;
    width: 80px;
    /* overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;*/
    color: #fff !important;
    margin-bottom: 90px;
    margin-left: 50%;
    border-radius: 4px;
    background-color: rgba(0, 0, 0, .6);
}

.googleMonitorName:after {
    position: absolute;
    content: '';
    width: 0;
    height: 0;
    bottom: -10px;
    left: 10px;
    border: 5px solid transparent;
    border-top-color: rgba(0, 0, 0, .6);
}

.gm-style-mtc:nth-of-type(1) {
    margin-left: 40px;
}

.gm-style-mtc li label {
    margin: 0 !important;
}

.gm-style-mtc li img {
    vertical-align: baseline;
}

.olMap #basicStatusInformation {
    width: 180px !important;
    height: 300px;
    margin-right: 0 !important;
    padding-right: 5px;
    overflow-y: auto;
}

.bmap-container .shadow {
    display: none;
}

.tdt-overlay-pane .tdt-label {
    display: block;
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
}

.map_toolbarctrl, .map_toolbar {
    display: none !important;
}

.gm-fullscreen-control {
    top: 40px !important;
}

.disabledStyle {
    cursor: not-allowed !important;
}

.disabledStyle * {
    color: #bbb !important;
}

#dimensionalMapContainer {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none;
    z-index: 666;
}

.tdt-control-container .tdt-top {
    top: auto;
    bottom: 80px;
}

.tdt-control-container .tdt-bottom, .tdt-control-container .tdt-top {
    z-index: 600;
}

.markerOneItem {
    height: 26px;
    width: 26px;
    line-height: 24px;
    color: #fff;
    font-size: 14px;
    text-align: center;
    border: 1px solid #6dcff6;
    border-radius: 13px;
    opacity: 0.7;
    box-shadow: hsl(180, 100%, 50%) 0px 0px 3px;
    background-color: #6dcff6;
}

#disSetMenu p {
    position: relative;
}

/*平滑移动跳点设置模块*/
.jumpSettingMenu {
    position: absolute;
    top: 0;
    right: 100%;
    width: 200px;
    padding: 5px;
    z-index: 10;
    border: 1px solid #ccc;
    background-color: #fff;
}

.jumpSettingMenu h4 {
    margin-left: 5px;
    font-size: 14px;
    font-weight: bold;
}

.jumpSettingMenu span {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin: 5px;
    line-height: 22px;
    cursor: pointer;
    text-align: center;
    border: 1px solid #ccc;
}

.jumpSettingMenu span.active {
    color: #fff;
    border: 1px solid #6dcff6;
    background-color: #6dcff6;
}

/*四维地图*/
.olMapViewport {
    z-index: 10;
}

.EVPanZoomBar {
    top: 120px !important;
}

.olControlScaleLineTop {
    margin-bottom: 10px;
}

/*百度地图*/
.BMap_stdMpZoom {
    right: auto !important;
    left: 10px !important;
    bottom: 80px !important;
}

#markerInfoWindow {
    z-index: 999;
}

#mapPic img {
    width: 100%;
}

.BMap_stdMpZoom {
    display: none;
}

#MapContainer .amap-marker-label {
    color: #fff !important;
    padding: 3px 10px !important;
    background: rgba(0, 0, 0, .8) !important;
    border: 1px solid #fff !important;
}

.bmap-container #platform div:nth-child(2) div:nth-child(5) {
    display: block !important;
}

/*组织与用户管理*/
#userPhotoBox {
    display: flex;
    height: 240px;
    margin-bottom: 20px;
    padding: 2px;
    justify-content: center;
    align-items: center;
    background: #eee;
}

#userPhotoBox img {
    max-width: 100%;
    height: auto;
    max-height: 100%;
}

#changeFileBtn {
    display: block;
    width: 100%;
    margin-bottom: 10px;
    padding: 5px;
    cursor: pointer;
    text-align: center;
    border: 1px solid #ccc;
}

#changeFileBtn:hover {
    background-color: #eee;
}

.wayShow .nav > li > a {
    padding: 10px 5px;
}

.ToolPanel form label {
    position: relative;
}

.ToolPanel form label input[type='text'] {
    padding-right: 22px !important;
}

.ToolPanel form label .delIcon {
    right: 5px !important;
}

@media (min-width: 768px) {
    #commonSm2Win .modal-dialog {
        width: 750px;
        margin: 30px auto;
    }
}

.sortUp, .sortDown {
    display: block;
}

#searchHeartBeat {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/*
#monthsDay span{
  display: inline-block;
  width: 38px;
  text-align: right;
}*/
/**tab选项卡 */
.layuimini-tab {
    height: 30px;
    position: relative;
}

.layuimini-tab .layui-tab-content {
    height: calc(100% - 37px) !important;
}

.layuimini-tab .layui-tab-content .layui-tab-item {
    height: 100%;
}

.layuimini-tab .layui-tab-content {
    padding: 0px;
}

.layuimini-tab .layui-tab-title {
    border: none;
    border: 1px solid whitesmoke;
    background-color: white;
    overflow: hidden;
    white-space: nowrap;
    transition: all .2s;
    width: calc(100vw - 565px);
}

.layuimini-tab .layui-tab-title li {
    border-right: 1px solid whitesmoke;
    color: dimgray;
}

.layuimini-tab .layui-tab-title .layui-tab-bar {
    display: none;
}

.layuimini-tab .layui-tab-title .layui-this:after {
    display: none;
}

.layuimini-tab .layui-tab-title .layuimini-tab-active {
    display: inline-block;
    background-color: lightgray;
    width: 9px;
    height: 9px;
    border-radius: 30px;
    margin-right: 5px;
}

.layuimini-tab .layui-tab-title .layui-this .layuimini-tab-active {
    background-color: #1e9fff;
}

.layuimini-tab > .layui-tab-title, .layuimini-tab > .close-box {
    height: 30px !important;
}

.layuimini-tab > .layui-tab-title li, .layuimini-tab > .close-box li {
    line-height: 30px !important;
    display: inline-block;
    padding: 0 15px;
}

.layuimini-tab .layui-tab-title span {
    color: #acafb1;
    cursor: pointer;
}

.layuimini-tab .layui-tab-title .layui-this span {
    color: dimgray;
}

.layuimini-tab .layui-tab-title .layui-tab-close {
    font-size: 12px !important;
    width: 14px !important;
    height: 14px !important;
    line-height: 16px !important;
    background-image: url("/clbs/resources/img/ico-cannel.png");
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center center;
    transform: translateY(2px);
}

.layuimini-tab .layui-tab-title .layui-tab-close:hover {
    border-radius: 4em;
    background-color: #ff5722;
    background-image: url("/clbs/resources/img/ico-cannel-white.png");
}

.layuimini-tab .layui-tab-title .disable-close + .layui-tab-close {
    display: none;
}

.layuimini-tab .layui-tab-title .able-close + .layui-tab-close {
    display: inline-block;
}

.layuimini-tab .layui-tab-control > li {
    position: absolute;
    top: 0px;
    height: 30px;
    line-height: 27px;
    width: 30px;
    text-align: center;
    background-color: white;
    border-top: whitesmoke 1px solid;
    border-bottom: whitesmoke 1px solid;
}

.layuimini-tab .layuimini-tab-roll-left {
    left: 0px;
    border-right: whitesmoke 1px solid;
    border-left: whitesmoke 1px solid;
}

.layuimini-tab .layuimini-tab-roll-right {
    right: 0px;
    border-left: 1px solid whitesmoke;
}

.layuimini-tab .layui-tab-tool {
    right: 0px;
    border-left: 1px solid whitesmoke;
}

.layuimini-tab .layui-tab-control .layui-tab-tool,
.layuimini-tab .layui-tab-control .layuimini-tab-roll-left,
.layuimini-tab .layui-tab-control .layuimini-tab-roll-right {
    display: none;
}

.layuimini-tab.layui-tab-roll .layui-tab-control .layuimini-tab-roll-left,
.layuimini-tab.layui-tab-roll .layui-tab-control .layuimini-tab-roll-right {
    display: block;
}

.layuimini-tab.layui-tab-roll .layui-tab-control .layuimini-tab-roll-right {
    right: 0px;
    border-right: 1px solid whitesmoke;
}

.layuimini-tab.layui-tab-roll .layui-tab-title {
    padding-left: 35px;
    padding-right: 35px;
}


.layuimini-tab.layui-tab-tool .layui-tab-control .layui-tab-tool {
    display: block;
}

.layuimini-tab.layui-tab-tool .layui-tab-title {
    padding-left: 0px;
    padding-right: 35px;
}


.layuimini-tab.layui-tab-rollTool .layui-tab-title {
    padding-left: 35px;
    /*padding-right: 80px;*/
}

.layuimini-tab.layui-tab-rollTool .layui-tab-control .layuimini-tab-roll-left,
.layuimini-tab.layui-tab-rollTool .layui-tab-control .layuimini-tab-roll-right,
.layuimini-tab.layui-tab-rollTool .layui-tab-control .layui-tab-tool {
    display: block;
}

.layuimini-tab .layui-tab-tool .layui-nav {
    position: absolute;
    height: 43px !important;
    top: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    background: 0 0;
}

.layuimini-tab .layui-tab-tool .layui-nav-item {
    height: 30px;
}

.layuimini-tab .layui-tab-tool .layui-nav-bar {
    display: none;
}

.layuimini-tab .layui-tab-tool .layui-nav-child {
    left: auto;
    top: 45px;
    right: 3px;
    width: 120px;
    border: 1px solid whitesmoke;
}

.layuimini-tab .layui-tab-tool .layui-this a {
    background-color: #009688;
}

.layuimini-tab-loading {
    position: absolute;
    display: none;
    width: 100%;
    height: calc(100% - 37px);
    top: 37px;
    z-index: 19;
    background-color: #fff
}

.layuimini-tab-loading.close {
    animation: close 1s;
    -webkit-animation: close 1s;
    animation-fill-mode: forwards;
}

.titleULBox.old {
    margin-top: 16px;
}

.layui-tab-item {
    width: 100% !important;
    height: 100% !important;
}

#AnnouncementBoard {
    display: flex;
    position: absolute;
    top: 45px;
    right: 80px;
    left: 80px;
    overflow: hidden;
    width: calc(100% - 160px);
    background-color: #f8f7f3;
    color: #ed805a;
    font-weight: bold;
    padding: 10px;
    border-radius: 4px;
    z-index: 1001;
}

.announcement-title {
    flex-shrink: 0;
}

.announcement-title img {
    width: 16px;
    height: 16px;
}

#AnnouncementContent {
    margin-inline: 10px;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    transition: all .5s;
}


#AnnouncementList {
    margin: 0;
    padding: 0;
    transition: transform .5s;
}

.announcement-item {
    width: 100%;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
}

#AnnouncementList > .announcement-item:hover {
    background-color: #ed805a33;
}

.announcement-scroll {
    height: 20px;
}

#ScrollAnnouncementIcon {
    flex-shrink: 0;
    margin-left: auto;
    height: 14px;
    color: #bdc3c7;
    cursor: pointer;
    transition: transform .5s;
}


#AnnouncementBoardHideIcon {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

#AnnouncementModalBody {
    margin-inline: 100px;
}

#AnnouncementModalTitle {
    text-align: center;
    font-size: 26px;
    font-weight: bold;
}

#AnnouncementModalTime {
    text-align: center;
}

#AnnouncementModalContent {
    margin-bottom: 10px;
}