.app-top{
  height:81px;
}
.app-top>*{
  float: left;
  display: inline-block;
  background-color:#000f4a;
}
.app-top-left-top{
  background-image: url(../../img/blue/img_01.gif);
  height: 42px;
  width: 258px;
}
.app-top-left-bottom{
  background: #000F4A;
  height: 39px;
  width: 258px;
  position: relative;
}
.app-top-center-left-top{
  background-image: url(../../img/blue/img_02.gif);
  height: 13px;
  width: 288px;
}
.app-top-center-left-bottom{
  background-color: #000f4a;
  height: 68px;
  width: 288px;
}
.app-top-center-left-bottom-box{
  font-size: 10px;
  color: #0efcff;
  width: 50%;
  float: left;
  text-align: left;
  margin: 0 auto;
}
.app-top-center-left-bottom-box-span{
  width: 63px;
  display: inline-block;
}
.app-top-center-right-top-right{
  background-image: url(../../img/blue/img_03.gif);
  background-repeat: no-repeat;
  height: 42px;
  width: 705px;
  display: inline-block;
  float: left;
  text-align: right;
  line-height: 42px;
  position: relative;
}
.menu-title-data-icon{
  background: url(../../img/icon_1_15.gif);
  background-repeat: no-repeat;
  width: 21px;
  height: 21px;
  display: inline-block;
  position: absolute;
  top: 12px;
  left: 32px;
}
.menu-title-analyze-icon{
  background: url(../../img/icon_1_18.gif);
  background-repeat: no-repeat;
  width: 21px;
  height: 21px;
  display: inline-block;
  position: absolute;
  top: 12px;
  left: 32px;
}

.title{
  background: url(../../img/blue/title.gif);
  width: 340px;
  height: 50px;
  background-size: 100% 100%;
  display: inline-block;
  position: absolute;
  top:20px;
  left: 14px;
  letter-spacing: 2px;
  text-align: center;
  font-size: 20px;
  font-family: "微软雅黑";
  color:#78DFFF;
  line-height: 45px;
}
.menu-title-system-icon{
  background: url(../../img/icon_1_21.gif);
  width: 19px;
  height: 18px;
  display: inline-block;
  position: absolute;
  top: 12px;
  left: 32px;
}
.user-icon{
  background: url(../../img/blue/icon_1_03.gif);
  width: 22px;
  height: 22px;
  display: inline-block;
  position: relative;
  z-index: 222;
  margin-top: 5px;
  float: left;
}
.app-top-center-right-bottom{
  display: inline-block;
  float: left;
}
.app-top-center-right-top-center-top{
  height: 31px;
  width: 119px;
}
.app-top-center-right-top{
  width: auto;
  height: 42px;
}
.app-top-center-right-top-center{
  display: inline-block;
  float: left;
}
.app-top-center-right-top-center-bottom{
  background-image: url(../../img/blue/img_07.gif);
  height: 11px;
  width: 119px;
  float: left;
}
.app-top-center-right-top-left{
  background-image: url(../../img/blue/img_05.gif);
  height: 42px;
  width: 70px;
  padding-left:25px;
  padding-top:6px;
  display: inline-block;
  cursor:pointer;
}
.app-top-center-right-bottom-left{
  background-color: #000f4a;
  width: 609px;
  height: 39px;
  float: left;
  text-align: right;
  line-height: 50px;
}
.app-top-center-right-bottom-center{
  width: 161px;
  height: 39px;
  float: left;
  background-color:#000f4a;
  line-height: 39px;
  vertical-align: middle;
  padding-left: 10px;
  color: #0efcff;
}
.app-top-center-right-bottom-right{
  background-image: url(../../img/blue/img_11.gif);
  width: 124px;
  height: 39px;
  float: left;

}
/* .app-top-center-top-left{
  background-image: url(../../img/img_12.gif);
  width: 546px;
  height: 55px;
  display: inline-block;
  float: left;
} */
/* .app-top-center-top-center{
  background-image: url(../../img/img_13.gif);
  width: 415px;
  height: 55px;
  display: inline-block;
  float: left;
} */
.app-top-center-top-center span{
  line-height: 55px;
  color: #78DFFF;
  font-size: 24px;
  font-family: "微软雅黑";
  margin-left: 37px;
  margin-top: -2px;
  letter-spacing: 5px;
  display: inline-block;
}
.app-top-center-bottom{
  /* height: 195px; */
}
/* .app-top-center-top-right{
  background-image: url(../../img/img_14.gif);
  width: 479px;
  height: 55px;
  display: inline-block;
  float: left;
} */
.app-top-center-bottom-left{
  background-color: #060b26;
  width: 42px;
  height: 69px;
  display: inline-block;
  float: left;
}
.app-top-center-bottom-center{
  display: inline-block;
  float:left;
}
.app-top-center-bottom-center-top{
  background-color: #060b26;
  width: 1398px;
  height: 5px;
  display: inline-block;
  float: left;
}
.page-button,.page-button-top,.page-button-left,.page-button-center,.page-button-right,.page-button-bottom{
  display: inline-block;
  float: left;
}
.page-button{
  width: 115px;
  margin-right: 10px;
  cursor: pointer;
  opacity: 0.7;
  transition: 0.25s;
}

.page-button-img{
  width: 115px;
  margin-right: 10px;
  cursor: pointer;
  opacity: 0.7;
  transition: 0.25s;
  background-image: url(../../img/button-bg2.jpg);
}
.page-button-img .selected{
  width: 115px;
  margin-right: 10px;
  cursor: pointer;
  opacity: 0.7;
  transition: 0.25s;
  background-image: url(../../img/button-bg1.jpg);
}

.page-button1{
  width: 115px;
  margin-right: 10px;
  cursor: pointer;
  float: left;
}
.btnBg{
   border:1px solid #78DFFF;
   width:91px;
   height:36px;
   position: relative;
   border-radius: 4px;
}
.btnBg::before{
    content: '';
    position: absolute;
    width: 0%;
    height: 0%;
    bottom: -10px;
    top:-1px;
    left:10%;
    border: none;
    border-radius: 0px;
    border-bottom: 1px solid #062778;
    border-top: 1px solid #062778;
}
.btnBg::after{
  content: '';
  position: absolute;
  width: 0%;
  height: 0%;
  left: -1px;
  right:-1px;
  top:10px;
  border: none;
  border-left: 1px solid #062778;
  border-right: 1px solid #062778;
}
.click{
  transition: 0.25s;
  opacity: 1;
}
.page-button-top{
  background-image: url(../../img/img_19.gif);
  width: 104px;
  height: 8px;
}
.page-button-left{
  background-image: url(../../img/img_18.gif);
  width: 6px;
  height: 34px;
}
.page-button-center{
  font-size: 10px;
}
.page-button-right{
  background-image: url(../../img/img_20.gif);
  width: 5px;
  height: 34px;
}
.page-button-bottom{
  background-image: url(../../img/img_27.gif);
  width: 115px;
  height: 7px;
}
.page-button-main{
  font-size: 12px;
  height: 34px;
  text-align: center;
  line-height: 28px;
  background-color: #060b26;
  color: #0efcff;
}
.page-button-main1{
  width: 91px;
  font-size: 12px;
  height: 34px;
  text-align: center;
  line-height: 34px;
  background-color: #031045;
  color: #0efcff;
  border-radius: 4px;
  padding: 0 8px;
  opacity: 1;
}
.page-button-background{

}
.app-top-bottom{
  display: inline-block;
  float: left;
  background: #060b26;
  width: 1398px;
  height: 5px;
}

#menu{
  background: url(../../img/navbar_03.gif);
  width: 178px;
  height: 48px;
  line-height: 48px;
  font-family: "幼圆";
  font-size: 16px;
}
#menuTopBorder{
  background: url(../../img/navbar_02.gif);
  width: 178px;
  height: 1px;
  display: none;
}
.icon-i{
  background: url(../../img/navbar_06.gif);
  width: 178px;
  height: 1px;
  padding: 0;
  margin-top: 5px;
}
#menuBottomBorder{
  background: url(../../img/navbar_04.gif);
  width: 178px;
  height: 1px;
  display: none;
}
.icon-hr{
  /* padding: 15px 0; */
  /* margin-left: 5px; */
  cursor: pointer;
  display: block;
  line-height: 25px;
}
.dataListUl{
  color: #148FEC;
  cursor: pointer;
  display: none;
  /* border-top: 2px solid #148FEC; */
  /* margin-bottom: 5px; */
  padding: 10px 0 0 0;
  /* background: url(../../img/navbar_05.gif); */
}
.title-name{
  /* background: url(../../img/navbar_03.gif); */
  line-height: 34px;
  position: relative;
}
.title-name > span{
    font-size: 16px;
    font-family: "幼圆";
}
.anomaly-icon,.normal-icon{
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}
.car-icon{
  background: url(../../img/blue/icon_1_11.gif);
  width: 20px;
  height: 20px;
  display: inline-block;
  position: relative;
  z-index: 222;
  margin-top: 10px;
  float: left;
}
.normal-icon{
  background-color: #0100F9;
}
.anomaly-icon{
  background-color: red;
}
.wifi-icon{
  background: url(../../img/blue/icon_1_06.gif);
  width: 16px;
  height: 12px;
  display: inline-block;
}
.wifi-icon-error{
  background: url(../../img/icon_1_07.gif);
  width: 16px;
  height: 12px;
  display: inline-block;
}
.dataListUl p{
  border-bottom: #FFF;
  text-align: center;
  padding: 5px 0;
}
.dataListUl li a{
  text-decoration: none;
  color: #148FEC;
  font-family: "幼圆";
  font-size: 12px;
}
.openAndClose > li{
  display: block;
}
.dataListUl li{
  padding: 5px 0;
  list-style-type: none;
  text-align: left;
  text-indent: 40px;
  display: none;
}
.dataListUl>li:hover a{
  text-decoration: underline
}
.tag-page{
  float: left;
}
.icon-hr>div{
  display: inline-block;
  width: 12px;
  height: auto;
  float: left;
  margin-top: 16px;
  margin-right: 15px;
  margin-left: 5px;
  }
.icon-hr>span{
  font-size: 12px;
  display: none;
}
.icon-hr .hr{
  width: 12px;
  height: 1px;
  margin-top: 3px;
  background: #1FA3ED;
}
#bottom{
  width: 1390px;
  height: 29px;
  margin-top: 5px;
  text-align: center;
  color: #0EFCFF;
  display: inline-block;
  font-size: 14px;
}
#bottom>a{
  color: #0EFCFF;
  text-decoration: none;
}

#tagEvent {
  width: 140px;
  position: absolute;
  left: 42px;
  top: 130px;
  z-index: 101;
  display: none;
  cursor: pointer;
}
#tagEvent > li{
  margin: 1px 0;
  padding: 7px 5px 7px 0;
  background: #0132BB;
  color: #0EFCFF;
  font-size: 10px;
  text-indent: 15px;
  /* height: 28px; */
}
#tagEvent > li > ul{
  display: none;
  position: absolute;
  left: 141px;
  width: 100%;
  top: 0px;
}
#tagEvent > li > ul li{
  /* height: 28px; */
  width: 140px;
  margin: 1px 0;
  padding: 7px 0;
  background: #0132BB;
  color: #0EFCFF;
  font-size: 10px;
  text-indent: 10px;
}
li{
  list-style-type: none;
}
#tagEvent > li:hover{
  background: #001C8B;
}
#tagEvent > li:hover>ul{
  display: block;
}
#tagEvent>li>ul>li:hover{
  background: #001C8B;
}
#bottom{
  float: left;
}
.app-top-center-left-bottom-box-span{
  display: inline-block;
}
.app-top-left-bottom > img{
  width: 160px;
  margin-left: 40px;
  cursor: pointer;
}
.main-top{
  float: left;
}
.trainNoBox{
  padding: 10px 5px;
  width: 1440px;
  height: 700px;
  /* border: 1px solid red; */
}
.trainInfo{
  display: inline-block;
  border: 2px solid #0368A6;
  box-shadow: #0368A6 0px 0px 20px inset;
  width: 350px;
  height: 152px;
  margin: 2px;
  cursor: pointer;
  background: #031045;
  transition: .1s;
}
.trainInfo:hover{
  border: 2px solid blue;
  transition: .2s;
}
.trainImage{
  position: relative;
  margin: 7px 0 0 11px;
  display: inline-block;
  width: 135px;
  height: 135px;
  background-image: url(../../img/blue.png);
  background-size: 100% 100%;
}
.trainImage .lineNo{
  position: absolute;
  top: 15px;
  left: 46px;
  font-size: 14px;
  width: 100px;
  color: #FFF;
}
.trainImage .trainNo{
  position: absolute;
  top: 39px;
  font-size: 14px;
  color: #FFF;
  left: 47px;
}
.bd{
  border: 2px solid red;
}
.trainImage .trainType{
  position: absolute;
  bottom: 24px;
  left: 41px;
  font-size: 14px;
  color: #000;
}
.mpInfo{
  display: inline-block;
  float: right
}
.mpInfo-main{
  height: 75px;
  width: 200px;
}
.mpInfo-left{
  margin-left: 10px;
  color: #0100F9;
  float: left;
  line-height: 75px;
  font-size: 14px;
}
.mpInfo-right{
  margin-top: 15px;
  margin-left: 20px;
  float: left;
  font-size: 12px;
  color: #0efcff;
}