@font-face {font-family: "iconfont"; src: url('iconfont.eot?t=1553842839034'); /* IE9 */ src: url('iconfont.eot?t=1553842839034#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=1553842839034') format('woff'), url('iconfont.ttf?t=1553842839034') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ url('iconfont.svg?t=1553842839034#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 { 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: 1.4rem; color: #fdfdfd; } #electric-fence p{ font-size: 1.4rem; color: #fdfdfd; } #car-lock p{ color: #fdfdfd; } .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: 2rem; } 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; } .insurance-img{ width: 25%; margin-left: 10px; z-index: 555; } /* 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; }