@font-face {font-family: "iconfont"; src: url('iconfont.eot?t=1562829682889'); /* IE9 */ src: url('iconfont.eot?t=1562829682889#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'), url('iconfont.woff?t=1562829682889') format('woff'), url('iconfont.ttf?t=1562829682889') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ url('iconfont.svg?t=1562829682889#iconfont') format('svg'); /* iOS 4.1- */ } .iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-reset:before { content: "\e62f"; } .icon-bofang:before { content: "\e647"; } .icon-suo:before { content: "\e609"; } .icon-yonghuzuguanli:before { content: "\e638"; } .icon-lukuang:before { content: "\ea3f"; } .icon-ziyuan:before { content: "\e602"; } .icon-lukuang1:before { content: "\ea8b"; } .icon-zanting:before { content: "\e68a"; } .icon-qiehuan:before { content: "\e604"; } .icon-last:before { content: "\e627"; } .icon-next:before { content: "\e628"; } .icon-sheding:before { content: "\e69f"; } .icon-qiehuan1:before { content: "\e626"; } .icon-jiesuo:before { content: "\e65a"; } .icon-guijichaxun:before { content: "\e618"; } .icon-dianziweilan:before { content: "\e61f"; } .icon-beisu4:before { content: "\e657"; } .icon-beisu2:before { content: "\e658"; } .icon-beisu1:before { content: "\e65b"; } .icon-daohang:before { content: "\e612"; } .icon { width: 1em; height: 1em; vertical-align: -0.15em; fill: currentColor; overflow: hidden; } /* font-rem*/ html {font-size: 62.5%!important; /* 10÷16=62.5% */} @media only screen and (min-width: 481px){ html { font-size: 94%!important; /* 15.04÷16=94% */ } } @media only screen and (min-width: 561px){ html { font-size: 109%!important; /* 17.44÷16=109% */ } } @media only screen and (min-width: 641px){ html { font-size: 125%!important; /* 20÷16=125% */ } } /* map content style */ .ract{ padding: 5px; position: position; min-width: 120px; min-height: 40px; background-color: #065eaf; border-radius: 10px; } .LeftBubble:after{ content:""; position:absolute; bottom:0; left:50%; border:17px solid transparent; border-top-color:#065eaf; border-bottom:0; margin:0 0 -17px -34px; border-left:0; } .ract span{ color: #fff; font-size: 12px; } /* page content */ .lr-amap-page { position:relative; width:100%; height:100%; } .lr-amap-contarner { position: relative; width: 100%; height: 100%; } #device-info-panel{ bottom: 10px; border-radius: 5px; padding: 8px; background: #FDFDFD; width: 95%; height: 50px; box-shadow: 1px 2px 8px #c3bfbf; z-index: 555; margin-bottom: 10px; margin-left: 2.5%; display: flex; flex-direction: row; align-items: center; justify-content: space-around; } #func-panel{ z-index: 555; display: flex; flex-direction: row; justify-content: space-between; align-items: center; margin-bottom: 10px; } .func-panel-bg{ background: #09f; z-index: 555; } #route-play{ display: flex; align-items: center; flex-direction: row; /* justify-content: space-between; */ justify-content: center; height: 30px; width: 25%; margin-left:10px; border-radius: 8px; } #car-lock{ display: flex; align-items: center; flex-direction: row; /* justify-content: space-between; */ justify-content: center; height: 60px; width: 30%; border-radius: 30px; } #electric-fence{ display: flex; align-items: center; flex-direction: row; /* justify-content: space-between; */ justify-content: center; height: 30px; width: 25%; margin-right:10px; border-radius: 8px; } .map-panel{ display: flex; flex-direction: column; height: 100%; } .icon-circle-small{ display: flex; justify-content: center; align-items: center; height: 20px; width: 20px; border-radius: 50%; background: #fdfdfd; margin-right: 5px; } .icon-circle-large{ display: flex; justify-content: center; align-items: center; height: 30px; width: 30px; border-radius: 50%; background: #fdfdfd; margin-right: 5px; } .icon-circle-large,.icon-circle-small span{ color: gray; } #route-play p{ font-size: 0.8em; color: #fdfdfd; } #electric-fence p{ font-size: 0.8em; color: #fdfdfd; } #car-lock p{ color: #fdfdfd; font-size: 1.1em; } .top-right-panel{ /* display: flex; */ /* align-self: flex-end; */ /* z-index: 555; */ display: flex; flex-direction: row; /* flex: 1; */ justify-content: flex-end; } #map-lelftright-func{ width: 40px; background: #fdfdfd; height: 116px; padding: 10px; margin-top: 50px; margin-right: 10px; border-radius: 5px; box-shadow: 1px 2px 5px #c3bfbf; flex-direction: column; } #layer-change,#route-situation,#user-change{ display: flex; justify-content: center; align-items: center; font-size: 1.2em; } hr{ height: 1px; background: #e0dcdc; border: none; } #user-location{ display: flex; /* align-self: flex-end; */ z-index: 555; margin-right: 15px; justify-content: flex-end; width: 28px; height: 28px; align-self: flex-end; margin-bottom: 1em; } .big-circle{ display: flex; justify-content: center; align-items: center; width: 18px; height: 18px; background: #a5a5a5; border-radius: 50%; } .medium-circle{ display: flex; justify-content: center; align-items: center; width: 14px; height: 14px; border-radius: 50%; background: #fff; } .small-circle{ width: 10px; height: 10px; background: #a5a5a5; border-radius: 50%; } .base-circle{ display: flex; justify-content: center; align-items: center; width: 28px; height: 28px; border-radius: 50%; background: #fff; box-shadow: 0 2px 10px #a4a4a5; } .delimite-line{ width: 1px; background: #e2e2e2; height: 24px; } #battery{ color: red; margin-left: 5px; width: 50px; } .panel-right-content{ width: 130px; font-size: 1em; } .insurance-img{ width: 25%; margin-left: 10px; z-index: 555; } #on-off-online{ font-size: 1em; } /* header */ .lr-workspace-header { padding:6px 40px; } .lr-workspace-header .my { position: absolute; top: 10px; left: 10px; color: #fff; } .lr-workspace-header .my .iconfont { font-size: 20px; font-weight: 100; } .lr-workspace-header .searchBox { position: relative; width: 100%; height: 100%; background-color: #0C86D8; } .lr-workspace-header .searchBox i { position: absolute; top: 8px; left: 10px; color: #fff; z-index: 1; font-size: 12px; } .lr-workspace-header .searchBox .search { position: relative; width: 100%; height: 100%; border-radius: 3px; line-height: 30px; font-size: 14px; background-color: #3d9ee0; padding-left: 30px; color: #fff; } /* .lr-workspace-header .alarm { */ /* line-height: 1; */ /* color: #0c86d8; */ /* font-size:16px; */ /* } */ .lr-workspace-header .chart { position: absolute; top: 10px; right: 50px; color: #fff; } .lr-workspace-header .chart .iconfont { font-size: 22px; font-weight: 100; } .lr-workspace-header .message { position: absolute; top: 10px; right: 10px; color: #fff; } .lr-workspace-header .message .iconfont { font-size: 22px; font-weight: 100; }