#map {
	width: 100%;
	height: 100%;
	border: 2px solid silver;
}
#loadedLayers {
	position: absolute;
	left: 85.6%;
	top: 10%;
	width: auto;
	padding-left: 0.2%;
}
#togglePoint, #toggleLine, #togglePoly {
	cursor: pointer;
	font-family: cursive;
	font-size: 20px;	
}

.ol-popup {
    position: absolute;
    background-color: white;
    -webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
    filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #cccccc;
    bottom: 12px;
    left: -50px;
    min-width: 280px;
}
.ol-popup:after, .ol-popup:before {
    top: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}
.ol-popup:after {
    border-top-color: white;
    border-width: 10px;
    left: 48px;
    margin-left: -10px;
}
.ol-popup:before {
    border-top-color: #cccccc;
    border-width: 11px;
    left: 48px;
    margin-left: -11px;
}
.ol-popup-closer {
    text-decoration: none;
    position: absolute;
    top: 2px;
    right: 8px;
}
.ol-popup-closer:after {
	content: "✖";
}

#identify {
	position: absolute;
	left: 79%;
	top: 2.5%;
	width: auto;
	border: 2px solid silver;
	background-color: rgba(94, 91, 87, .3);
	border-radius: 20px;
	padding-right: 1%;
}
#identifyLay {
	position: absolute;
	left: 79%;
	top: 6.1%;
	width: auto;
	border: 2px solid silver;
	background-color: rgba(94, 91, 87, .3);
	border-radius: 20px;
	padding-right: 1%;
}
#startEditLine {
	position: absolute;
	cursor: pointer;
	left: 79%;
	top: 10%;
}
#startEditPoly {
	position: absolute;
	cursor: pointer;
	left: 81.2%;
	top: 10%;
}
#startExplore {
	position: absolute;
	cursor: pointer;
	left: 83.4%;
	top: 10%;
}
#startSearch {
	position: absolute;
	cursor: pointer;
	left: 87.9%;
	top: 10%;
}
#startEditLine:hover, #startEditPoly:hover, #startExplore:hover, #hoverSearch:hover {
	background-color: #5c6f8e;
}

#toSite {
	position: absolute;
	border: 2px solid silver;
	top: 9px;
	cursor: pointer;
}
#activeLayers {
	position: absolute;
	cursor: pointer;
	left: 71%;
	top: 70px;
}
#abc {
	display: none;
	border: 2px solid silver;
	border-radius: 20px;
	background-color: rgba(94, 91, 87, .3);
	position: relative;
	left: -20%;
}
#hoverLayers:hover {
	background-color: #5c6f8e;
	cursor: pointer;
}

input {
	cursor: pointer;
}


.tooltip {
	position: relative;
	background: rgba(0, 0, 0, 0.5);
	border-radius: 4px;
	color: white;
	padding: 4px 8px;
	opacity: 0.7;
	white-space: nowrap;
}
.tooltip-measure {
	opacity: 1;
	font-weight: bold;
}
.tooltip-static {
	background-color: #ffcc33;
	color: black;
	border: 1px solid white;
}
.tooltip-measure:before, .tooltip-static:before {
    border-top: 6px solid rgba(0, 0, 0, 0.5);
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
    content: "";
    position: absolute;
    bottom: -6px;
    margin-left: -7px;
    left: 50%;
}
.tooltip-static:before {
	border-top-color: #ffcc33;
}

.hidden {
	display: none;
}
.ol-zoom {
	position: absolute;
	left: 96%;
}

#tooltipTextLine, #tooltipTextPoly, #tooltipTextExplore, #tooltipTextLayers, #tooltipSearch {
    visibility: hidden;
    background-color: #555;
    border-radius: 6px;
    width: 150px;
    color: #fff;
    padding: 5px 0;
    text-align: center;
    position: absolute;
    top: -34px;
    left: -200%;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.7s;
}
#tooltipIdenLayer {
	visibility: hidden;
    background-color: #555;
    border-radius: 6px;
    width: 150px;
    color: #fff;
    padding: 5px 0;
    text-align: center;
    position: absolute;
    top: 10%;
    left: -75%;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.7s;
}
#tooltipGetInfo {
	visibility: hidden;
    background-color: #555;
    border-radius: 6px;
    width: 150px;
    color: #fff;
    padding: 5px 0;
    text-align: center;
    position: absolute;
    top: 10%;
    left: -93%;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.7s;
}
#tooltipParcInfo {
	visibility: hidden;
    background-color: #555;
    border-radius: 6px;
    width: 40%;
    color: #fff;
    padding: 5px;
    text-align: center;
    position: absolute;
    top: 0px;
    left: -45%;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.7s;
}
#tooltipSearchVla {
	visibility: hidden;
    background-color: #555;
    border-radius: 6px;
    width: 40%;
    color: #fff;
    padding: 5px 0;
    text-align: center;
    position: absolute;
    top: 50%;
    left: -42%;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.7s;
}

#identify #tooltipIdenLayer::after, #identifyLay #tooltipGetInfo::after, #fetching #tooltipParcInfo::after, #semlv #tooltipSearchVla::after {
	content: "";
    position: absolute;
    top: 10%;
    left: 103.3%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent transparent #555;
}
#startEditLine #tooltipTextLine::after, #startEditPoly #tooltipTextPoly::after, #startExplore #tooltipTextExplore::after, #loadedLayers #tooltipTextLayers::after, #startSearch #tooltipSearch::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}
#startEditLine:hover #tooltipTextLine, #startEditPoly:hover  #tooltipTextPoly, #startExplore:hover #tooltipTextExplore, #loadedLayers:hover #tooltipTextLayers, #identify:hover #tooltipIdenLayer, #identifyLay:hover #tooltipGetInfo, #fetching:hover #tooltipParcInfo, #semlv:hover #tooltipSearchVla, #startSearch:hover #tooltipSearch {
	visibility: visible;
	opacity: 1
}

#seminfo {
	position: absolute;
	border: 2px solid silver;
	border-radius: 20px;
	padding: 5px;
	transition: opacity 0.7s;
	background-color: rgba(58, 59, 61, .3);
	top: 25%;
	width: 20%;
	display: none;
	z-index: 2;
}

#checkLV, #searchAmenity {
	cursor: text;
}
#searchLv, #searchSearch {
	cursor: pointer;
	border-radius: 20px;
}
#searching {
	position: absolute;
	border: 2px solid silver;
	background-color: rgba(94, 91, 87, .3);
	border-radius: 20px; 
	padding: 5px 5px 0px 5px;
	top: 2.5%;
	width: 24%;
	left: 53%;
}

#def {
	display: none;
	border: 2px solid silver;
	border-radius: 20px;
	background-color: rgba(94, 91, 87, .3);
	padding: 5px;
	cursor: default;
}
#seminfo #close {
	position: absolute;
	left: 90%;
	top: 3%;
	cursor: pointer;
	float:right;
    display:inline-block;
}
#seminfo #close:hover {
	float:right;
    display:inline-block;
    background:#ccc;
    color:#fff;
}

#toCLV {
	visibility: hidden;
    background-color: #555;
    border-radius: 6px;
    width: 50%;
    color: #fff;
    padding: 5px 0;
    text-align: center;
    position: absolute;
    top: 30%;
    left: 0%;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.7s
}
#toCLV::after {
	content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}
#toCLVsite:hover #toCLV {
	visibility: visible;
	opacity: 1
}

a#toParcZoom > span {
	visibility: hidden;
    background-color: #555;
    border-radius: 6px;
    width: 50%;
    color: #fff;
    padding: 5px 0;
    text-align: center;
    position: absolute;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.7s
}
a#toParcZoom > span::after {
	content: "";
    position: absolute;
    top: 70%;
    left: -3.5%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent #555 transparent transparent;
}
a#toParcZoom:hover span {
	visibility: visible;
	opacity: 1
}

#wthr {
	position: absolute;
	top: 20%;
	left: 1%;
	cursor: pointer;
	font-size: 25px;
	z-index: 0;
}

#wthr > #weather {
	visibility: hidden;
    background-color: rgba(58, 59, 61, .3);
    border: 2px solid silver;
    border-radius: 6px;
    width: 300%;
    color: #fff;
    text-align: left;
    position: absolute;
    opacity: 0;
    padding: 2%;
    transition: opacity 0.7s;
    font-size: 16px;
    color: black;
}
#wthr:hover #weather {
	visibility: visible;
	opacity: 1
}

#hereTime {
	position: absolute;
	top: 2.5%;
	left: 22%;
}

#changeStyle {
	position: absolute;
	left: 53%;
	top: 10%;
	background-color: rgba(94, 91, 87, .3);
	border: 2px solid silver;
	border-radius: 6px;
	margin: 2px;
	padding: 2px;
	cursor: pointer;
}
#tool {
	display: none;
}