@media screen and (max-width:768px) {
    /* or max-width:768px */
div.header{width:36%}
div.header .logo{display:none}
div.header-center{justify-content: left;}
span.mobile,.function-item,div.vertical-line,.search-address,.switch-map-label{display: none;}
.app-header-nav>div{width: 80px;}
#split-pane-right-area{width:36%}
.track-play {position: fixed;left: 0px;right: 0px;bottom: 10px;height: 38px;}
.track-play-bar{width:auto;background: hsl(0deg 0% 100%);box-shadow: 0px 1px 17px 4px rgba(0,0,0,0.75);}
.track-play-bar-mileage{margin-top: -30px;}
.track-play-bar .play-btn{margin-left: -100px }
.track-play-bar .play-ctrl{position:absolute;margin-left: 39%;margin-top: -44px;}
.track-play-bar .play-ctrl>div>i {font-size:42px;}
.track-play-bar .play-ctrl-next>{right: -20px}
div.selected-map-wrap{right: 70px;top:26px}
div.selected-map-list{width: 40px;left: -36px;}
ul.map-selector-popup{right: 60px;}
.split-pane-right-area .split-pane-right-btn,.split-pane-horizontal>div>.split-pane-trigger .split-pane-trigger-btn{width:12px}
.map-zoom {left: 340px;top: 620px;}
}