*{margin:0px;padding:0px;list-style: none;outline: none;font-family: PingFangSC,helvetica neue,hiragino sans gb,arial,microsoft yahei ui,microsoft yahei,simsun,"sans-serif";}
body{background-image: url(../images/bg.jpg);background-size: cover;background-repeat: no-repeat;}

@font-face {font-family: 'condensedBold';src: url('font/font.ttf') format('truetype');font-weight: normal;font-style: normal;}
 
body {
    font-family: 'MyCustomFont', sans-serif; /* 在body中使用自定义字体 */
}
/*通用顶部风格*/
.header{position: relative;height: 70px;}
.header .header-menu{width: 32px;height: 32px;background-image: url(../images/3.png);background-size: 100%;position: absolute;left: 3%;top: 15px;cursor: pointer;}
.header .header-menu ul{background-color: #071a29;border:1px solid #0ff;-webkit-box-shadow:0 0 10px 0 #0ff;box-shadow: 0 0 10px 0 #0ff;color: #fff;width: 88px;position: absolute;top: 45px;z-index: 9999;padding:0px 5px;border-radius:4px;display: none;transition: all .3s ease;}
.header .header-menu ul li{color: #fff;font-size: 13px;display: block;text-align: center;padding:5px 0px;border-bottom:1px solid #0ff;}
.header .header-menu ul li:last-child{border-bottom: 0px none;}
.header .header-title{text-align: center;font-size: 40px;font-weight: 200;color: #fff;text-shadow: 0 0 10px #0ff;width: 500px;margin:0px auto;padding-top: 15px;}
.header .header-back{position: absolute;background:url(../images/return.png);width: 160px;height: 47px;right: 280px;top: 6px;cursor: pointer;}
.header .header-time{color: #fff;position: absolute;right: 3%;top: 15px;padding-left: 28px;height: 32px;line-height: 32px;background:  url(../images/time.png);background-size: 28px 28px;background-repeat: no-repeat;background-position:0;}
/*通用二级标题栏风格*/
.sub-header{position: relative;width: calc(100% - 30px);width: -webkit-calc(100% - 30px);margin:0px auto;height: 58px;}
.sub-header-left{float: left;}
.sub-header-center{}
.sub-header-center ul{display: flex;}
.sub-header-center ul li{background:hsla(0,0%,100%,.07);font-size: 14px;height: 28px;line-height: 28px;width: 120px;text-align: center;box-sizing: border-box;margin:0px 5px;cursor: pointer;color: #fff;}
.sub-header-center ul li.active{border:1px solid rgba(0,193,222,.8);}
.sub-header-right{float: right;position: relative;}
.sub-header .cdt.cdt-icon{width: 16px;height: 18px;float: left;margin:15px 10px 0px 0px;}
.sub-header .cdt.cdt-box{float: left;margin-top: 10px;}
.sub-header-left ul{height: 30px;color: #fff;margin-top: 30px;}
.sub-header-left ul li{background:rgba(216, 216, 216, 0.16);float: left;height: 30px;line-height: 30px;font-size: 14px;padding:0px 15px;position: relative;box-sizing: border-box;cursor: pointer;}
.sub-header-left ul li.empty-right{margin-right: 5px;}
.sub-header-left ul li.line-right::after{content: ' ';position: absolute;height: 16px;width: 0.5px;background:#fff;right: -1px;top: 7px;}
.sub-header-left ul li.line-right.red-active::after{display: none;}
.sub-header-left ul group.active li.line-right::after{display: none;}

.red-bg{background-image: linear-gradient(58deg,rgba(237,85,101,.3),rgba(237,85,101,.4) 10%,rgba(237,85,101,.8));}
.green-bg{background-image: linear-gradient(48deg,rgba(15,176,192,.3),rgba(15,176,192,.4) 37%,rgba(15,176,192,.55));}
.red-active{border:1px solid #ed5565;-webkit-box-shadow:inset 0 0 10px 0 #ed5565;box-shadow: inset 0 0 10px 0 #ed5565;position: relative;z-index: 10;}
.green-active{border:1px solid #00c1de;-webkit-box-shadow:inset 0 0 10px 0 rgba(0,255,255,.5);box-shadow: inset 0 0 10px 0 rgba(0,255,255,.5);text-shadow: 0 0 10px #0ff;}
.green-active-deep{border:1px solid #00c1de;-webkit-box-shadow:inset 0 0 10px 0 #0ff;box-shadow: inset 0 0 10px 0 #0ff;}
.red-jb-bg{background-image: linear-gradient(36deg,rgba(237,85,101,.2),rgba(237,85,101,.4) 37%,rgba(237,85,101,.6));border:1px solid rgba(212,67,71,.4);}

/**改造elementui select 原始组件风格**/
.sub-header .el-select .el-input__inner{background-color: transparent;border:0px none;background: url(../images/4.png);background-repeat: no-repeat;background-size: calc(100% - 10px) 10px;background-position:0 100%;color: #fff;text-shadow: 0 0 10px #0ff;font-size: 14px;padding:0px 18px 10px 0px;text-align: center;}
.sub-header .el-select .el-icon-arrow-up::before{content: "\e78f";color: #00ffff;}
.sub-header .el-select  .el-input--mini .el-input__icon {line-height: 38px;font-size: 16px !important;}
.sub-header .el-select .el-input .el-select__caret.is-reverse{transform: rotateZ(180deg);-webkit-transform: rotateZ(180deg);}
.sub-header .el-select .el-input .el-select__caret{transform: rotateZ(180deg);-webkit-transform: rotateZ(180deg);}
.sub-header .el-select .el-input .el-select__caret{transition:none;}
.el-select-dropdown{background-color:rgba(0,0,0,.8) !important; border:1px solid #0ff !important;-webkit-box-shadow:0 0 10px 0 #0ff !important;box-shadow: 0 0 10px 0 #0ff !important;color: #fff;}
.el-select-dropdown__item.hover, .el-select-dropdown__item:hover{background-color:transparent !important;color:#fff !important;}
.el-select-dropdown__item{color:#fff !important}
.el-popper[x-placement^="bottom"] .popper__arrow{border-bottom-color: #00ffff !important;display: none;}
.el-popper[x-placement^="bottom"] .popper__arrow::after{border-bottom-color: #00ffff !important;}
/**改造element datepicker组件风格**/
.el-picker-panel{background:rgba(0, 0, 0, .8) !important;color: #fff !important;border:1px solid #00fff0 !important;-webkit-box-shadow:0 2px 12px 0 rgba(0, 255, 240, .6) !important;box-shadow: 0 2px 12px 0 rgba(0, 255, 240, .6) !important;border-radius:2px !important;}
.el-date-range-picker__time-header > .el-icon-arrow-right{color:#fff !important}
.el-date-table td.in-range div, .el-date-table td.in-range div:hover, .el-date-table.is-week-mode .el-date-table__row.current div, .el-date-table.is-week-mode .el-date-table__row:hover div {background-color: rgba(255,255,255,.3) !important;}

/*通用地图工具栏*/
.map-tools{position: fixed;right: 59px;bottom: 100px;color: #8a8a8a;font-size: 14px;z-index: 1000;}
.map-tools .back-default{width: 36px;height: 36px;background-color: #fff;-webkit-box-shadow:1px 1px 1px 0 rgba(0,0,0,.2);box-shadow: 1px 1px 1px 0 rgba(0,0,0,.2);background-image: url(../images/pos2.png);background-size: 18px;background-repeat: no-repeat;background-position:center;cursor: pointer;}
.map-tools .back-default:hover{background-image: url(../images/pos.png);}
.map-tools .wd,.map-tools .color,.map-tools .type,.map-tools .lk{width: 36px;height: 36px;background-color: #fff;-webkit-box-shadow:1px 1px 1px 0 rgba(0,0,0,.2);box-shadow: 1px 1px 1px 0 rgba(0,0,0,.2);cursor: pointer;text-align: center;line-height: 36px;margin-top: 10px;position: relative;}
.map-tools .wd:hover,.map-tools .color:hover,.map-tools .type:hover,.map-tools .lk:hover{color: #02b4b4;}
.map-tools .type,.map-tools .lk{font-size: 13px;}
.map-tools .lk.active{color: #02b4b4;}
.BMap_stdMpCtrl div {position: static !important;}
.map-tools .color > span{position: absolute;width: 100%;height: 100%;left: 0;}
.map-tools .color-tab{position: absolute;height: 100%;width: 154px;left: -169px; display: none;}
.map-tools .color-tab > div{float: left;color: #fff;width: 72px;box-sizing: border-box;font-size: 14px;height: 100%;background:rgba(0,0,0,.9);}
.map-tools .color-tab .active{border: 1px solid #01ffff;}
