*{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";}

@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中使用自定义字体 */
}
.main-box{position: absolute;width: 100%;height: 100%;background-image: url(../images/bg.jpg);background-size: 100% 100%;background-repeat: no-repeat;}
/*通用顶部风格*/
.header{position: relative;height: 70px;}
.header .header-menu{width: 40px;height: 40px;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: 1px;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, .9) !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;}

/**天气自定义组件**/
.weather-box{position: absolute;width: 100%;bottom: 0px;top: 80px;}
.weather-box .w-top{height: 30px;padding:0px 30px;}
.weather-box .w-top .back-box{color: #fff;background:hsla(0,0%,84.7%,.07);width: 100px;text-align: center;height: 30px;line-height: 30px;border-radius:4px;float: left;font-size: 16px;cursor: pointer;}
.weather-box .w-top .w-title{height: 30px;float: left;color: #fff;line-height: 30px;font-size: 16px;margin-left: 20px;text-shadow: rgb(0, 255, 255) 0px 0px 10px;}
.weather-box .result-box{height: 30px;padding:0px 30px;margin-top: 15px;}
.weather-box .result-box .l{float: left;color: #fff;font-size: 16px;}
.weather-box .result-box .r{float: left;color: #fff;font-size: 16px;margin-left: 50px;}
.weather-box .result-box input{height: 30px;background-color: transparent;font-family: "condensedBold";font-size: 26px;color: #fff;border:0px none;background-image: url(../images/4.png);background-repeat: no-repeat;background-position:center 100%;background-size: 100%;width: 40px;text-indent: 10px;}
.weather-box .result-box .w{text-shadow: 0 0 10px #0ff;font-family: "condensedBold";font-size: 26px;}
.weather-box .result-box .gd{text-shadow: 0 0 10px #0ff;font-family: "condensedBold";}
.weather-box .result-box i{cursor: pointer;}
.weather-box .result-box .save{height: 30px;line-height: 30px;display: inline-block;margin-left: 10px;background:hsla(0,0%,84.7%,.07);padding:0px 10px;border-radius:3px;cursor: pointer;}
.weather-box .weather-list-box{position: absolute;background-image: url(../images/11.png);top: 75px;bottom: 10px;left: 15px;right: 15px;background-size: 100% 100%;}
.weather-box .weather-list-box .fixed-ul{padding:0px 35px;height: 37px;margin-top: 25px;}
.weather-box .weather-list-box .fixed-ul li{background:hsla(0,0%,84.7%,.1);height: 100%;line-height: 37px;color: #fff;font-size: 16px;display: flex;}
.weather-box .weather-list-box li .xh{width: 100px;text-align: center;}
.weather-box .weather-list-box li .tq{width: 300px;text-align: left;}
.weather-box .weather-list-box li .tq img{width: 27px;float: left;margin-top: 5px;margin-right: 5px;}
.weather-box .weather-list-box li .gtq{width: 150px;text-align: center;}
.weather-box .weather-list-box li .btq{width: 150px;text-align: center;}
.weather-box .weather-list-box li:nth-child(even){background:hsla(0,0%,84.7%,.1);}
.weather-box  .weather-list-ul{position: absolute;bottom: 20px;left: 35px;right: 35px;top: 63px;overflow:auto;}
.weather-box  .weather-list-ul li{display: flex;color: #fff;font-size: 16px;line-height: 37px;height: 37px;}
.weather-box  .weather-list-ul li span i{font-size: 24px;color: rgba(255, 255, 255, 0.4);cursor: pointer;}
.weather-box  .weather-list-ul li span i.active{color: rgb(0, 255, 255);}
/**事件自定义组件**/
.event-box{position: absolute;width: 100%;bottom: 0px;top: 80px;}
.event-box .w-top{height: 30px;padding:0px 30px;}
.event-box .w-top .back-box{color: #fff;background:hsla(0,0%,84.7%,.07);width: 100px;text-align: center;height: 30px;line-height: 30px;border-radius:4px;float: left;font-size: 16px;cursor: pointer;}
.event-box .w-top .w-title{height: 30px;float: left;color: #fff;line-height: 30px;font-size: 16px;margin-left: 20px;text-shadow: rgb(0, 255, 255) 0px 0px 10px;}
.event-box .result-box{height: 30px;padding:0px 30px;margin-top: 15px;display: flex;}
.event-box .result-box .event-cdt{background-image: url(../images/4.png);background-repeat: no-repeat;background-position:center 100%;background-size: 100% 10px;height: 100%;}
.event-box .result-box .event-cdt input{border:0px none;background-color: transparent;font-size: 16px;color: #fff;text-indent: 10px;}
.event-box .result-box .event-cdt input::placeholder{color: #fff;font-size: 16px;text-shadow: 0 0 10px #0ff;}
.event-box .result-box .event-cdt i{color: #00eaee;line-height: 30px;}
.event-box .result-box .add-event{color: #fff;background:hsla(0,0%,84.7%,.07);height: 100%;line-height: 30px;font-size: 16px;padding:0px 10px;border-radius:3px;margin-left: 30px;cursor: pointer;}
.event-box .result-box .add-event i{color: #fff;}
.event-box .weather-list-box{position: absolute;background-image: url(../images/11.png);top: 75px;bottom: 10px;left: 15px;right: 15px;background-size: 100% 100%;}
.event-box .weather-list-box .fixed-ul{padding:0px 35px;height: 37px;margin-top: 25px;}
.event-box .weather-list-box .fixed-ul li{background:hsla(0,0%,84.7%,.1);height: 100%;line-height: 37px;color: #fff;font-size: 16px;display: flex;}
.event-box .weather-list-box .event-list-ul{padding:0px 35px;height: 37px;}
.event-box .weather-list-box .event-list-ul li{height: 100%;line-height: 37px;color: #fff;font-size: 16px;display: flex;}
.event-box .weather-list-box li .order{width: 100px;text-align: center;}
.event-box .weather-list-box li .name{width: 200px;text-align: left;}
.event-box .weather-list-box li .desc{width: 300px;text-align: left;}
.event-box .weather-list-box li .time{width: 230px;text-align: left;}
.event-box .weather-list-box li .action{width: 300px;text-align: center;}
.event-box .weather-list-box li .action span{color: rgb(2, 180, 180);display: inline-block;margin:0px 10px;cursor: pointer;}
.event-box .weather-list-box li:nth-child(even){background:hsla(0,0%,84.7%,.1);}
.event-box .weather-list-box .empty{color: #fff;text-align: center;font-size: 16px;height: 30px;line-height: 30px;position: relative; top: 45%;}
.event-box .event-form-dialog{background:rgba(0,0,0,.8);border-radius:2px;width: 620px;height: 340px;left: calc(50% - 310px);left: -webkit-calc(50% - 310px);position: absolute;top: calc(50% - 200px);top: -webkit-calc(50% - 200px);}
.event-box .event-form-dialog .efd-top{height: 60px;line-height: 60px;color: #fff;text-align: center;font-size: 16px;position: relative;}
.event-box .event-form-dialog .efd-top i{font-size: 20px;position: absolute;right: 20px;top: 20px;cursor: pointer;}
.event-box .event-form-dialog .form-box{padding: 40px 60px 0px 60px;}
.event-box .event-form-dialog .form-box .form-group{height: 30px;line-height: 30px;color: #fff;font-size: 16px;margin-bottom: 20px;}
.event-box .event-form-dialog .form-box .form-group input{width: 320px;height: 100%;background-color: transparent;border:0px none;background-image: url(../images/4.png);background-repeat: no-repeat;background-position:0px 100%;background-size: 100% 10px;color: #fff;font-size: 16px;text-shadow: 0 0 8px #0ff;font-family: PingFangSC-Light;text-indent: 10px;}
.event-box .event-form-dialog .form-box .form-group input::placeholder{color: #fff;font-size: 16px;text-shadow: 0 0 8px #0ff;}
.event-box .event-form-dialog .btn-box{display: flex;width: 300px;margin: 50px auto 0px;}
.event-box .event-form-dialog .btn-box .cancel{width: 140px;height: 34px;line-height: 34px;color: #01c1de;background:#fff;text-align: center;border-radius:3px;cursor: pointer;}
.event-box .event-form-dialog .btn-box .submit{width: 140px;height: 34px;line-height: 34px;color: #fff;background:#01c1de;text-align: center;border-radius:3px;cursor: pointer;margin-left: 20px;}
.event-box .event-form-dialog .el-icon-date{display: none;}
.event-box .event-form-dialog .el-input__inner{background-color: transparent;border:0px none;}
.event-box .event-form-dialog .el-range-input{width: 120px !important;height: 30px !important;}
.event-box .event-form-dialog .el-range-separator{color: #fff;font-size: 16px;}

.el-message-box{background-image: linear-gradient(90deg,#02e2f1,#06636d);border: 0px none !important;}
.el-message-box .el-message-box__close{color:#fff !important;}
.el-message-box .el-message-box__message p{color: #fff;font-size: 16px;}