/*************************** TOOLS *******************************/
#tools-v-buttons-1 {
	width: 31px;
	top: 41px;
	left: 5px;
	position: absolute;
	z-index: 500;
}

#tools-v-buttons-2 {
	width: 24px;
	bottom: 94px;
	right: 8px;
	position: absolute;
	z-index: 500;
}

#tools-h-buttons-1 {
	height: 24px;
	bottom: 21px;
	right: 4px;
	position: absolute;
	z-index: 500;
}

#tools-panel {
	display: block;
	position: absolute;
	/*width: 300px;*/
	/* width: 20px; */
	/* height: 29px; */
	/* background-color: cyan; */
	top: 6px;
	left: 48px;
}
#tools-panel.panel-small{
	top: 20px;
	left: 128px;
}
/*************************** TOOLS *******************************/


/*************************** TOOL *******************************/

.tool-container {
	float: left;
	position: relative;
	margin-right: 2px;
}
.tool-v-panel {
	width: 100%;
	height: 100%;
}
.tool-button {
	width: 32px;
	height: 32px;
	margin-bottom: 8px;
	margin-left: 2px;
	margin-right: 2px;
	background-position: center center;
	background-size: contain;
	background-color: white;
	background-repeat: no-repeat;
	cursor: pointer;
	z-index: 501;
	float: left;
}

/*************************** TOOL *******************************/


/************************* SEARCH *******************************/

#tool-search-panel2 {
	position: absolute;
    top: 5px;
    right: 5px;

}
#tool-search-box {
    position:absolute;
    top:3px;
    right:-135%;
    width:100%;
    overflow:hidden;
    transition:all 0.8s ease-in;
}

#tool-search-box.active {
    width: 250px;
	right:0;
}


#tool-search-panel {
    width: 300px;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.4);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,.4);
    box-shadow: 1px 1px 2px rgba(0,0,0,.4);
    height:29px;
    border-radius: 3px;
    background-color: white;
    float: left;
    margin-right: 5px;
    margin-bottom: 5px;
}

#btn-tool-search-google{
	width: 38px;
	height: 29px;
    margin-right: 15px;
    position: relative;
    top: 50%;
}


#btn-tool-search-google .ico{
	display: block;
	width: 90%;
	height: 90%;
}

#btn-tool-search-google .ico_active{
	display: none;
	width: 90%;
	height: 90%;
}

#btn-tool-search-google.active .ico{
	display: none;
}

#btn-tool-search-google.active .ico_active{
	display: block;
}

.tool-search-input{
	width: 96%;
    padding-left: 5px;
    font-size: 14px !important;
    margin-top: 3px;
    margin-left: 6px;
}

#tool-search-source{
	width: 20%;
	font-size: 15px;
}


#tool-search-input:focus{
    outline: 0;
}

#tool-search-alert{
    margin-top: 5px;
}

.tool-search-icon {
	background-image: url('../imgs/icons/gray/zoom.png');
	background-position: center center;
	background-size: contain;
	background-color: white;
	background-repeat: no-repeat;
}

.tool-search-panel-mobile .input-group{
	margin-top: 5px;
    margin-left: 10px;
}

.tool-search-panel-mobile input, .tool-search-panel-mobile .input-group{
	width: 100%;
	z-index: 999999;
}

#search-area .tool-search-panel-mobile{
	width: 100%!important;
	box-shadow: none!important;
	-webkit-box-shadow: none!important;
	position: relative;
    top: 35%;
    transform: translateY(-50%);

}

#search-area .tool-search-panel-mobile .input-group{
	padding-right: 25px;
	z-index: 999999;
}

#btn-tool-search-layers{
    margin-right: 15px;
    position: relative;
    top: 50%;
    transform: translateY(-50%)
}


.button-layers-search-mobile{
	background: transparent;
	border: none;
	line-height: 40px;
	margin-right: 10px;
	padding:0px;

}
.button-google-search-mobile{
	width: 18px!important;
    height: 18px!important;
	background: transparent;
	border: none;
	padding:0px;
}


.pac-container.pac-logo.hdpi{
	z-index: 10000;
}


.tool-measurement-button,
.tool-elevation-button,
.tool-coordinates-button,
.tool-locate-me-button {
	width: 24px !important;
	height: 24px !important;
}


@media (min-width:1024px){
	#btn-tool-search-google{
		width: 38px;
		height: 29px;
		margin-right: 0px;
		position: relative;
		transform: none;
	}

	#btn-tool-search-layers{
		margin-right: 0px;
		position: relative;
		transform: none;
	}
}

/********* MEASUREMENT ****************************************/

.tool-measurement-button {
	float: left;
	margin-right: 1px;
}
.tool-measurement-button:hover {
	background-image: url('../imgs/icons/blue/measure.png') !important;
}
.tool-measurement-button-inactive {
	background-image: url('../imgs/icons/gray/measure.png') !important;
}
.tool-measurement-button-active {
	background-image: url('../imgs/icons/red/measure.png') !important;
}
#tool-measurement-container {
	float: left;
}
.tool-measurement-panel {
	display: none;
	bottom: 46px;
	right: 30px;
	width: 180px;
	position: absolute;
	background-color: #2196F3;
	border-radius: 2px;
	border: 1px solid white;
	padding: 2px;
	color: white;
	font-size: 8pt;
}

/********* MEASUREMENT ****************************************/


/********* ELEVATION PROFILE **********************************/

#tool-elevation-button {
	float: left;
}
#tool-elevation-button:hover {
	background-image: url('../imgs/icons/blue/elevation-profile.png')!important;
}
.tool-elevation-button-inactive {
	background-image: url('../imgs/icons/gray/elevation-profile.png')!important;
}
.tool-elevation-button-active {
	background-image: url('../imgs/icons/red/elevation-profile.png')!important;
}
#tool-elevation-panel {
	width: 100%;
	height: 100%;
}
#tool-elevation-chart {
	width: 100%;
	height: 100%;
}

/********* ELEVATION PROFILE **********************************/


/***********************  COORDINATES ***************************/

#tool-coordinates-button {
	float: left;
	margin-right: 1px;
}
#tool-coordinates-button:hover {
	background-image: url('../imgs/icons/blue/coordinates.png') !important;
}
.tool-coordinates-button-inactive {
	background-image: url('../imgs/icons/gray/coordinates.png') !important;
}
.tool-coordinates-button-active {
	background-image: url('../imgs/icons/red/coordinates.png') !important;
}

/***********************  COORDINATES ***************************/


/***********************  LOCATE_ME ***************************/
.tool-locateMe-button {
	margin-bottom: 5px;
}

.tool-active>i{
	color: red;
}

.tool-active{
	color: red !important;
}

/***********************  LOCATE_ME ***************************/

#tool-legend-header {
	height: 25px;
	width: 100%;
	margin-bottom: 10px;
	display: table;
	position: absolute
}
#tool-legend-body {
	position: absolute;
	top: 25px;
	bottom: 0;
	overflow-y: auto;
	width: 100%;
}
.layer-legenda-image {
	width: 80%;
	padding-left: 5%;
}

.select2-container{
	z-index: 10001;
}

.select2-container--default .select2-results__option--highlighted[aria-selected]{
    background: #000;
}

/***********************  MyLayers ***************************/
.searchLayerResult{
	display:none;
}

.searchLayerResult p{
	text-align: center;
	color: #666666;
	font-size: 1.5rem;
	margin-top: 0.5rem;
}

/**********************  Coordinate Search ******************/

#tool-coordSearch-panel{
	display: grid;
	grid-template-rows: 2.5rem 2.5rem;
	grid-template-columns: 15rem 1fr;
	column-gap: 2px;
	row-gap: 2px;

	white-space: nowrap;
    top: 0;
	float: left;

	margin-bottom: 5px;
	align-items: stretch;

	transition: all .4s;
    -webkit-transition: all .4s;
    -o-transition: all .4s;

	#srs-select {
		grid-column-start: 1;
		grid-column-end: 2;
		grid-row-start: 1;
		grid-row-end: 2;

		button {
			display: inline-flex;
			width: 100%;
			height: 100%;
			vertical-align: middle;
			text-align: left;
			
			span {
				flex-grow: 1;
				overflow: hidden;
			}
		}

		i {
			align-content: center;
			align-self: stretch;
		}

		.dropdown-menu {
			top: 27px;
			position: absolute;
			overflow-y: scroll;
			width: fit-content;
		}
	}

	#coords-display {
		grid-column-start: 2;
		grid-column-end: end;
		grid-row-start: 1;
		grid-row-end: 2;

		display: inline-flex;
		background-color: white;
		gap: 5px;
		padding: 0px 5px;
		height: 100%;
		align-items: center;

		box-shadow: 1px 1px 4px rgba(0,0,0,.4);
    	-webkit-box-shadow: 1px 1px 4px rgba(0,0,0,.4);

		.group {
			text-align: left;
			vertical-align: middle;

			label {
				font-weight:bold;
				margin: 0;
			}

			span {
				text-align: right;
			}
		} 
	}

	#coord-search {
		grid-column-start: 1;
		grid-column-end: end;
		grid-row-start: 2;
		grid-row-end: end;

		background-color: white;
		border-radius: 2px;
		display: inline-flex;
		flex-flow: row;

		#search-input {
			flex-grow: 1;
			margin: 0px 3px;
			font-size: small;
		}

		button {
			border-radius: 2px;
		}
	}

	.error {
		box-shadow: inset 0px -3px 0px 0px red;
		color: darkred;
	}
}