.map {
  height: 100%;
  width: 100%;
  background: url(../images/map-background.gif) repeat;
}

.ol-zoom {
  bottom: 8px;
  right: 8px;
  top: auto;
  left: auto;
}

.ol-attribution {
  display: none;
}

.ol-mouse-position {
  bottom: 8px;
  right: 35px;
  top: auto;
  left: auto;
  position: absolute;
  background: rgba(0,60,136,.3);
  border-radius: 4px;
  color: #eee;
  padding: 2px;
}

.ol-map-bottom {
  height: 105px;
  position: absolute;
  bottom: 0;
  background-color: #ffffff;
}

.rotate-north {
  top: 65px;
  left: .5em;
}
.ol-touch .rotate-north {
  top: 80px;
}

.ol-map-button {
  background-color: rgba(0, 60, 136, .5);
  border-radius: 2px;
  padding: 0;
  margin: 0;
  border: 0;
  height: 20px;
  width: 40px;
  color: #fff;
  cursor: pointer;
}

/* 船舶列表按钮 */
.ol-list-button{
  right: 8px;
  bottom: 75px;
}
/* 气象设置 */
.ol-weather-button{
  right: 8px;
  bottom: 115px;
}

.ol-list-button button,
.ol-weather-button button{
  font-size: 1.5em;
}


.ol-zoomslider,
.ol-touch .ol-zoomslider {
  top: 8px;
}

.weather-dialog li{
  height: 30px;
  width: 100%;
  line-height: 30px;
  text-align: left;
  font-size: 20px;
}
/* media */


/* 横屏 */

@media screen and (orientation:landscape) {}


/* 竖屏 */

@media screen and (orientation:portrait) {}

@media screen and (min-width:960px) {
  .ol-weather-button,
  .ol-list-button {
    display: none;
  }
}
/* 窗口宽度<960,设计宽度=768 */

@media screen and (max-width:959px) {}


/* 窗口宽度<768,设计宽度=640 */

@media screen and (max-width:767px) {
  .ol-mouse-position,
  .ol-full-screen,
  .ol-overviewmap{display: none};
  .ol-list-button {
    display: block;
  }
}


/* 窗口宽度<640,设计宽度=480 */

@media screen and (max-width:639px) {}


/* 窗口宽度<480,设计宽度=320 */

@media screen and (max-width:479px) {}


/* windows UI 贴靠 */

@media screen and (-ms-view-state:snapped) {}


/* 打印 */

@media print {}