
.menuGISBtn {
	position:absolute;
	top:16px;
	left:16px;
	width:48px;
	height:48px;
	background:#ddd;
	color:#000;
	border:1px solid #aaa;
	visibility:true;
	z-index:10001;
	transition:0.2s ease all; 
	-moz-transition:0.2s ease all; 
	-webkit-transition:0.2s ease all;
}
.menuGISBtn.active {
	visibility:hidden;
}

/* .menuGISBtn::before { content: "\f0c9"; }*/
.menuGISDiv {
	position:absolute;
	top:0;
	bottom:0;
	width:300px;
	left:-300px;
	background:#ddd;
	color:#000;
	border:1px solid #aaa;
	z-index:10002;
	transition:0.2s ease all; 
	-moz-transition:0.2s ease all; 
	-webkit-transition:0.2s ease all;
}
.menuGISDiv.active {
	left:0px;
}

.menuGISHead {
	position:absolute;
	left:0;
	top:0;
	right:0;
	height:50px;
}
.menuGISCont{
	position:absolute;
	left:0;
	top:50px;
	right:0;
	bottom:0;
	overflow:hidden;
}

.menuGISSlider {
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	width:1200px;
	display:block;
	transition:0.2s ease all; 
	-moz-transition:0.2s ease all; 
	-webkit-transition:0.2s ease all;
}
.menuGISPage {
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	width:300px;
	display:inline-block;
	overflow-y:auto;
}

.menuGISMenuHead { position:relative; line-height:48px; font-size:20px; width:100%;	}
.menuGISPage a { position:relative; width:100%; }
@media (max-width:600px), (max-width:993px) {
	.menuGISPage a { line-height:48px; font-size:18px; }
}



.menu-dlg-frame {
	position:absolute;
	top:0; bottom:0; left:0;
	/*right:0;*/
	width:320px;
	border:none;
	transition: opacity 0.5s ease-in;
	transition: background 0.5s ease-in;
	z-index:999;
}
.menu-dlg-frame .menu-dlg-head {
	position:absolute;
	top:0; right:0; left:0;
	/*height:40px;*/
	background:#eee;
	text-align:center;
	line-height:48px;
}
.menu-dlg-frame .menu-dlg-cont {
	position:absolute;
	top:48px; 
	right:0; bottom:0; left:0;
	overflow:hidden;
	background:#eee;
}
.menu-dlg-title {
	font-size:1.6em;
}


.menu-dlg-close {
	position: absolute;
	right: 4px;
	top: 4px;
	width: 32px;
	height: 32px;
	opacity: 0.3;
}
.menu-dlg-close:hover {
	opacity: 1;
}
.menu-dlg-close:before, .menu-dlg-close:after {
	position: absolute;
	left: 15px;
	content: ' ';
	height: 33px;
	width: 2px;
	background-color: #333;
}
.menu-dlg-close:before {
	transform: rotate(45deg);
}
.menu-dlg-close:after {
	transform: rotate(-45deg);
}

/*
.menu-dlg-close {
	font-size:2.1em;
	float:right;
}
.menu-dlg-close:before {
	/*content:"&#x2715;";*/
	/*content:"\00d7";*/
	/*content:"\0a9b";
}
*/
.menu-dlg-frame .menu-dlg-cont iframe {
	position:absolute;
	left:0; top:0;
	width:100%;
	height:100%;
	border:none;
	overflow-x:hidden;
	overflow-y:auto;
}


.rst-off { opacity:0; }
.rst-on { 
	opacity:1;
	transition:opacity 1s linear;
	-webkit-transition:opacity 1s linear;
	-ms-transition:opacity 1s linear;
}

.divToolTip {
	position:absolute; 
	background:#fffbd6; 
	width:300px; 
	height:auto;
	border:1px solid #f4e89a;
	padding:16px;
}
.divToolTip .close {
	position: absolute;
	right: 4px;
	top: 4px;
	width: 16px;
	height: 16px;
	opacity: 0.3;
}
.divToolTip .close:hover {
	opacity: 1;
}
.divToolTip .close:before, 
.divToolTip .close:after {
	position: absolute;
	left: 7px;
	content: ' ';
	height: 16px;
	width: 2px;
	background-color: #333;
}
.divToolTip .close:before {
	transform: rotate(45deg);
}
.divToolTip .close:after {
	transform: rotate(-45deg);
}





.spinner {
	width: 32px;
	height: 32px;
	margin: 0px auto;
	background-color: #05599f;

	border-radius: 100%;
	-webkit-animation: scaleout 1.0s infinite ease-in-out;
	animation: scaleout 1.0s infinite ease-in-out;
}

.spinner-red {
	width: 40px;
	height: 40px;
	margin: 0px auto;
	background-color: #9f5905;
	border: 2px solid #cc0000;

	border-radius: 100%;
	-webkit-animation: scaleout 1.0s infinite ease-in-out;
	animation: scaleout 1.0s infinite ease-in-out;
}

@-webkit-keyframes scaleout {
	0% { -webkit-transform: scale(0.0); }
	100% {
		-webkit-transform: scale(1.0);
		opacity: 0;
	}
}
@keyframes scaleout {
	0% {
		transform: scale(0.0);
		-webkit-transform: scale(0.0);
	} 100% {
		transform: scale(1.0);
		-webkit-transform: scale(1.0);
		opacity: 0;
	}
}

.gps_ring {
    border: 2px solid #990000;
    border-radius: 60px;
    -ms-border-radius: 60px;
    -moz-border-radius: 60px;
    -webkit-border-radius: 60px;
    height: 18px;
    width: 18px;
    position: absolute;
    left: 100px;
    top: 100px;
    /*-webkit-animation: pulsate 1s ease-out;*/
    /*-webkit-animation-iteration-count: infinite;*/ 
    /*opacity: 0.0;*/
	display: block;
	z-index: 100;
}



.gps-ring-container {
    position: absolute;
	border:1px solid red;
}
.gps-circle {
    position: absolute;
	top: 4px;
    left: 4px;
    width: 16px;
    height: 16px;
    background-color: #62bd19;
    border-radius: 50%;
}
.gps-ringring {
    position: absolute;
	left: -4px;
    top: -4px;
    height: 34px;
    width: 34px;
    border: 3px solid #62bd19;
    border-radius: 30px;
    animation: pulsate 1s ease-out;
    animation-iteration-count: infinite; 
    -webkit-border-radius: 30px;
    -webkit-animation: pulsate 1s ease-out;
    -webkit-animation-iteration-count: infinite; 
    opacity: 0.0
}
@-webkit-keyframes pulsate {
    0% {-webkit-transform: scale(0.1, 0.1); opacity: 0.0;}
    50% {opacity: 1.0;}
    100% {-webkit-transform: scale(1.0, 1.0); opacity: 0.0;}
}



.gps-blob {
	background: red;
	border-radius: 50%;
	margin: 0px;
	height: 16px;
	width: 16px;

	box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
	transform: scale(1);
	animation: gps-pulse 1s infinite;
}

@keyframes gps-pulse {
	0% {
		transform: scale(0.95);
		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);
	}

	70% {
		transform: scale(1.2);
		box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.0);
	}

	100% {
		transform: scale(0.95);
		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.1);
	}
}



.mi-pulse-bgnd {
	animation: colorPulse 1s infinite alternate;
}
@keyframes colorPulse {
	from {background-color: red;}
	to   {background-color: blue;}
}
