html,body{
	height: 100%;
	width: 100%;
	font-family: '微软雅黑';
}
.mapview {
	position: relative;
	width: 100%;
	height: 100%;
}
.onemap {
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
}
.left_map{
	position: absolute;
	top: 0px;
	left: 0px;
	right: 50%;
	bottom: 0px;
	border-right: 1px solid #000;
}
.right_map{
	position: absolute;
	top: 0px;
	left: 50%;
	right: 0px;
	bottom: 0px;
}

.top_left_map{
	position: absolute;
	top: 0px;
	left: 0px;
	right: 50%;
	bottom: 50%;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
}	
.top_right_map{
	position: absolute;
	top: 0px;
	left: 50%;
	right: 0px;
	bottom: 50%;
	border-bottom: 1px solid #000;
}
.bottom_left_map{
	position: absolute;
	top: 50%;
	left: 0px;
	right: 50%;
	bottom: 0px;
	border-right: 1px solid #000;
}
.bottom_right_map{
	position: absolute;
	left: 50%;
	right: 0px;
	top: 50%;
	bottom: 0px;
}

.switchLayer-panel{
	top: 10px;
	left: auto;
	right: 10px;
	display: block;
}
.switchLayer-panel .panel-body{
	padding: 0px 15px;
}
.switchLayer-panel ul li a{
	padding: 5px 5px;
}

#maptoolbar_bootstrap,.maptoolbar_bootstrap {
	position: absolute;
	right: 80px;
	top: 10px;
}

#measureResult{
	background:#F8B75C;
	border-radius: 4px;
	font-size:12px;
	font-family: '微软雅黑';
	padding:4px;
	color:#fff;
}
		
.ol-control{
	z-index: 99;
}

.search_box{
	position: absolute;
	z-index: 199;
	left: 50px;
	top: 5%;
	width: 300px;
	height: auto;
	max-height: 80%;
	border-radius: 5px;
	/*background-color: rgba(238, 238, 238, 0.98);*/
}
.table_box{
	position: absolute;
	z-index: 199;
	right: 10px;
	bottom: 0;
	width: 50%;
	height: auto;
	max-height: 395px;
	border-radius: 5px;
}
.panel{
	height: 100%;
	margin-bottom: 0px;
}
.popupDiv{
	position: absolute;
	width: 400px;
	height: 300px;
}
.nav-tabs.nav-justified>.active>a,.nav-tabs.nav-justified>.active>a:focus, .nav-tabs.nav-justified>.active>a:hover{
	color: #337ab7;
}
a {
	text-decoration: none;
	color: #454545;
}

img {
	border: none;
}

ul,
p {
	margin: 0px;
	padding: 0px;
	list-style: none;
}

.ol-control-layer{
	position: absolute;
	top: 10px;
	right: 15px;
}
.ol-control-layer>div:not(:first-child){
	margin-top: 5px;
}
.ol-control-baselayer, .ol-control-busilayer{
	position: relative;
}

.ol-control-baselayer-btn{
	cursor: pointer;
	display: block;
	width: 38px;
	height: 37px;
	background-image: url(../images/switchmapon.png);
}

.ol-control-layer .active .ol-control-baselayer-btn{
	cursor: pointer;
	display: block;
	width: 38px;
	height: 37px;
	background-image: url(../images/switchmapoff.png);
}

.ol-control-baselayer ul {
	display: none;
	background: url(../images/tckzbg.png) no-repeat;
	background-size: 100% 100%;
	border-radius: 5px;
	white-space: nowrap;
	position: absolute;
    right: 0px;
	top: 42px;
	z-index: 2;
}

.ol-control-baselayer>ul li {
	margin: 25px 5px;
	text-align: center;
	display: inline-block;
	width: 93px;
	white-space:normal;
}
.ol-control-baselayer>ul li:first-child{
	margin-left: 15px;;
}
.ol-control-baselayer>ul li:last-child{
	margin-right: 15px;;
}

.ol-control-baselayer>ul li a{
	padding: 0px;
	display: block;
	text-decoration: none;
}
.ol-control-baselayer>ul li img {
	border: 2px solid #dddddd;
	width: 100%;
}

.ol-control-baselayer>ul li img:hover {
	border: 2px solid #09F;
}

.ol-control-baselayer>ul li img.active {
	border: 2px solid #09F;
}


.ol-control-busilayer-btn{
	cursor: pointer;
	display: block;
	width: 38px;
	height: 37px;
	background-image: url(../images/tcctorlicon.png);
}

.ol-control-layer .active .ol-control-busilayer-btn{
	cursor: pointer;
	display: block;
	width: 38px;
	height: 37px;
	background-image: url(../images/switchmapoff.png);
}

.ol-control-busilayer>ul{
	z-index: 1;
	width: 200px;
	min-height: 250px;
	max-height: 350px;
	position: absolute;
	top: 40px;
	right: 0px;
	display: block;
	overflow: auto;
	background-color: #FFFFFF;
	border:1px solid #BBBBBB;
}

.ol-popup-content{
	position: relative;
	overflow-y: auto;
	padding: 10px;
}

.ol-popup-content::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

.ol-popup-content::-webkit-scrollbar-button {
	background-color: #FF7677;
	display: none;
}

.ol-popup-content::-webkit-scrollbar-track {
	background: rgba(255, 255, 255, 0.15);
}

.ol-popup-content::-webkit-scrollbar-track-piece {
	background: rgba(255, 255, 255, .1);
}

.ol-popup-content::-webkit-scrollbar-thumb {
	background: #333;
	border-radius: 10px;
}

.ol-popup-content::-webkit-scrollbar-corner {
	background: #82AFFF;
}

.ol-popup-content::-webkit-scrollbar-resizer {
	background: #FF0BEE;
}

.ol-popup-content .ol-popup-body{
	margin: 5px 0px 20px;
	min-width: 300px;
	max-width: 350px;
	min-height: 200px;
	max-height: 400px;
	overflow: auto;
}
.ol-popup-content .ol-popup-footer{
	position: absolute;
	left: 5px;
    right: 5px;
	bottom: 5px;
	user-select: none;
}

.ol-popup-content .ol-popup-page{
	float: left;
}
.ol-popup-content .ol-popup-page span{
	padding: 0px 5px;
}
.ol-popup-content .ol-popup-switch{
	float: right;
}
.ol-popup-content .ol-popup-switch a{
	padding: 0px 5px;
	cursor: pointer;
}

/** primary popup */
.ol-popup.primary 
{	background-color: #ececec;
	border:3px solid #1b487a;
	border-radius: 15px;
	margin:11px 0;
}
.ol-popup-left.primary
{	margin:11px 10px 11px -22px;
}
.ol-popup-right.primary
{	margin:11px -22px 11px 10px;
}
.ol-popup.primary .closeBox{
	background-color: rgba(255, 255, 255, 0);
    color: #fff;
    border: 1px solid #fff;
    border-radius: 0.8em;
    cursor: pointer;
    float: right;
    font-size: 0.9em;
    font-weight: 700;
    width: 1.6em;
    height: 1.6em;
    padding: 0;
    position: absolute;
    right: 1.5em;
    top: 1.4em;
}
.ol-popup-middle.primary 
{	margin:0 10px;
}
.ol-popup.primary .content {
    cursor: default;
    padding: 0px;
}
.ol-popup.hasclosebox .content {
   margin-right: 0em; 
}
.ol-popup.primary .anchor:after,
.ol-popup.primary .anchor:before 
{	content:"";
	border-color: #69f transparent;
	border-style: solid;
	border-width: 11px;
	margin: 0 -11px;
}
.ol-popup.primary .anchor:after
{	border-color: #fff transparent;
	border-width: 9px;
	margin: 3px -9px;
}

.ol-popup-top.primary .anchor:before,
.ol-popup-top.primary .anchor:after
{	border-top:0;
	top:0;
}

.ol-popup-bottom.primary .anchor:before,
.ol-popup-bottom.primary .anchor:after
{	border-bottom:0;
	bottom:0;
}

.ol-popup-middle.primary .anchor:before
{	margin: -11px 0;
	border-color: transparent #69f;
}
.ol-popup-middle.primary .anchor:after
{	margin: -9px 2px;
	border-color: transparent #fff;
}
.ol-popup-middle.ol-popup-left.primary .anchor:before,
.ol-popup-middle.ol-popup-left.primary .anchor:after
{	border-left:0;
}
.ol-popup-middle.ol-popup-right.primary .anchor:before,
.ol-popup-middle.ol-popup-right.primary .anchor:after
{	border-right:0;
}

.swipe-panel{
	padding: 0px;
}
.swipe-title{
	color:#000;
	padding: 5px 10px;
	border: 1px solid #c9c9c9;
}
.swipe-content{
	padding: 5px 15px;
	max-height: 200px;
	overflow-y: auto;
}
.swipe-info{
	color:#000;
}


.ol-timeline{
	position: absolute;
	bottom: 80px;
	left: 0;
	right: 0;
	height: 0;
}

.ol-timeline .ol-timeline-bar{
	position: relative;
	width: 50%;
	min-width: 500px;
	max-width: 1000px;
	color: #FFFFFF;
	padding: 10px 90px;
	border-radius: 5px;
	background: rgba(57, 115, 175, 0.73);
	margin: 0 auto;
}
.ol-timeline .ol-timeline-bar .swiper-container{
	padding: 10px 10px;
}
.ol-timeline-bar .swiper-container .swiper-slide{
    line-height:22px;
    padding-bottom:0px;
    border:5px;
    color:#fff;
    font-size: 14px;
    cursor: pointer;
    width: 150px;
	text-align: center;
	font-size: 22px;
}
.ol-timeline-bar .swiper-container .swiper-slide-active {
    color: #ffea48;
}

.ol-timeline-bar .timeline-button{
	position: absolute;
    top: 50%;
    width: 38px;
    height: 44px;
    margin-top: -22px;
    cursor: pointer;
    background-size: 38px 38px;
    background-position: center;
	background-repeat: no-repeat;
	
}
.ol-timeline-bar .timeline-button-autoplay {
	left: 15px;
	right: auto;
}
.ol-timeline-bar .timeline-button-prev{
	left: 54px;
	background-size: 38px 38px;
    background-position: center;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}
.ol-timeline-bar .timeline-button-next{
	right: 54px;
	background-size: 38px 38px;
    background-position: center;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}
.ol-timeline-bar .timeline-button-autoplay-start{
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20t%3D%221562227347448%22%20class%3D%22icon%22%20viewBox%3D%220%200%201024%201024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20p-id%3D%2211019%22%20width%3D%2244%22%20height%3D%2244%22%3E%3Cpath%20d%3D%22M512%2064C264.6%2064%2064%20264.6%2064%20512s200.6%20448%20448%20448%20448-200.6%20448-448S759.4%2064%20512%2064z%20m0%20820c-205.4%200-372-166.6-372-372s166.6-372%20372-372%20372%20166.6%20372%20372-166.6%20372-372%20372z%22%20p-id%3D%2211020%22%20fill%3D%22%23ffffff%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M424%20352h-48c-4.4%200-8%203.6-8%208v304c0%204.4%203.6%208%208%208h48c4.4%200%208-3.6%208-8V360c0-4.4-3.6-8-8-8zM648%20352h-48c-4.4%200-8%203.6-8%208v304c0%204.4%203.6%208%208%208h48c4.4%200%208-3.6%208-8V360c0-4.4-3.6-8-8-8z%22%20p-id%3D%2211021%22%20fill%3D%22%23ffffff%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");	
}
.ol-timeline-bar .timeline-button-autoplay-stop{
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20t%3D%221562227508770%22%20class%3D%22icon%22%20viewBox%3D%220%200%201024%201024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20p-id%3D%2211660%22%20width%3D%2232%22%20height%3D%2232%22%3E%3Cpath%20d%3D%22M512%2064C264.6%2064%2064%20264.6%2064%20512s200.6%20448%20448%20448%20448-200.6%20448-448S759.4%2064%20512%2064z%20m0%20820c-205.4%200-372-166.6-372-372s166.6-372%20372-372%20372%20166.6%20372%20372-166.6%20372-372%20372z%22%20p-id%3D%2211661%22%20fill%3D%22%23ffffff%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M719.4%20499.1l-296.1-215c-10.6-7.7-25.3-0.2-25.3%2012.9v430c0%2013.1%2014.8%2020.5%2025.3%2012.9l296.1-215c8.8-6.4%208.8-19.4%200-25.8z%20m-257.6%20134V390.9L628.5%20512%20461.8%20633.1z%22%20p-id%3D%2211662%22%20fill%3D%22%23ffffff%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
}

.ol-timeline-bar .timeline-button-more{
	right: 15px;
	left: auto;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20class%3D%22icon%22%20width%3D%2232px%22%20height%3D%2232.00px%22%20viewBox%3D%220%200%201024%201024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M464%20144H160c-8.8%200-16%207.2-16%2016v304c0%208.8%207.2%2016%2016%2016h304c8.8%200%2016-7.2%2016-16V160c0-8.8-7.2-16-16-16z%20m-52%20268H212V212h200v200zM864%20144H560c-8.8%200-16%207.2-16%2016v304c0%208.8%207.2%2016%2016%2016h304c8.8%200%2016-7.2%2016-16V160c0-8.8-7.2-16-16-16z%20m-52%20268H612V212h200v200zM464%20544H160c-8.8%200-16%207.2-16%2016v304c0%208.8%207.2%2016%2016%2016h304c8.8%200%2016-7.2%2016-16V560c0-8.8-7.2-16-16-16z%20m-52%20268H212V612h200v200zM864%20544H560c-8.8%200-16%207.2-16%2016v304c0%208.8%207.2%2016%2016%2016h304c8.8%200%2016-7.2%2016-16V560c0-8.8-7.2-16-16-16z%20m-52%20268H612V612h200v200z%22%20%2F%3E%3C%2Fsvg%3E");
}
.ol-layer-title{
	position: absolute;
	top:10px;
	left: 45px;
	padding: 5px 10px;
	background-color: #10101069;
	border-radius: 5px;
	min-width: 60px;
	color: #ffffff;
}


.ol-legend{
	position: absolute;
	bottom:15px;
	right: 15px;
	background-color: #fff;
	border-radius: 5px;
	min-width: 60px;
	min-height: 80px;
	color: #000;
	border: 1px solid #09F;
	border-radius: 5px;
	overflow: hidden;
}
.ol-legend-title{
	height: 32px;
	line-height: 32px;
	padding: 0px 10px;
	border-bottom: 1px solid #09F;
}
.ol-legend-body{
	padding: 5px 0px;
	overflow: auto;
	max-height: 300px;
	max-width: 250px;
}
.ol-legend-body .ol-legend-item{
	padding: 0px 5px;
	line-height: 26px;
	
}
.ol-legend-body .ol-legend-item>img{
	width: 20px;
	height:20px;
}
.ol-legend-body .ol-legend-item>span{
	font-size: 12px;
	padding: 0px 5px;
}

.ol-control-hideshow-btn{
	cursor: pointer;
	display: block;
	width: 38px;
	height: 37px;
	background-image: url(../images/hideshow.png);
}
.ol-control-layer-v2 .active .ol-control-vectorlayer-btn{
	cursor: pointer;
	display: block;
	width: 38px;
	height: 37px;
	background-image: url(../images/switchmapoff.png);
}
.ol-control-layer-v2>div:not(:first-child){
	margin-top: 5px;
}

.ol-control-layer-v2{
	position: absolute;
	top: 10px;
	right: 15px;
}


.ol-control-vectorlayer-btn{
	cursor: pointer;
	display: block;
	width: 38px;
	height: 37px;
	background-image: url(../images/tcctorlicon.png);
}

.vectorlayer-control{
	z-index: 1;
    width: 200px;
    min-height: 250px;
    max-height: 350px;
    position: absolute;
    top: 40px;
    right: 10px;
    display: block;
    overflow: auto;
    background-color: #FFFFFF;
    border: 1px solid #BBBBBB;
}

.ol-control-vectorlayer>ul{
	z-index: 1;
	width: 200px;
	min-height: 250px;
	max-height: 350px;
	position: absolute;
	top: 40px;
	right: 0px;
	display: block;
	overflow: auto;
	background-color: #FFFFFF;
	border:1px solid #BBBBBB;
	padding-left: 5px;
	background-color: rgba(255,255,255,0.75);
}

