/* sidebar */

.sidebar{
	z-index: 2;
	}

	.sidebar-content{
	background-color: rgba(255, 255, 255, 1);
	}
	
	.sidebar-tabs > li, .sidebar-tabs > ul > li{
		cursor: pointer;
	}
	
	.sidebar-right.collapsed{
	height: 40px;
	border-bottom: 3px solid transparent;
	}
	
	.sidebar-right.collapsed .sidebar-tabs > ul:first-child li:not(:first-child) {
	  display: none;
	}
	.sidebar-right.collapsed .sidebar-tabs > ul:not(:first-child) {
	  display: none;
	}
	.sidebar-right .fa-caret-left{
	transform: rotate(180deg);
	}
	.sidebar-right:not(.collapsed) > .sidebar-tabs {
	background-color: rgba(127, 157, 195, 1);
	}
	.sidebar-right.collapsed > .sidebar-tabs > ul > li:hover{
	background-color: unset;
	} 
	
	@media (min-width: 768px) {
		.sidebar-right {
			border-top: unset;
			border-right: unset;
			border-bottom: unset;
			border-radius: unset;
			top: 0px;
			right: 0px;
			bottom: 0px;
		}
		.sidebar-right.collapsed {
			border-top: unset;
			border-right: unset;
			border-bottom: 3px solid transparent;
			border-radius: unset;
			top: 0px;
			right: 0px;
		}
		.sidebar-right .sidebar-tabs , .sidebar-right .sidebar-content  {
			border-radius: unset;
		}
	}
		
	
/* form logo */

      #form_logo {
	    position: absolute;
		background-color: #f8f8f8;
		border: 2px solid #f8f8f8 ;
		border-top: none ;
        z-index: 1;
        opacity: 1;
        top: 10px;
        left: 4.5em;
        margin: 0;
		width: 185px;
		height: 60px;
		vertical-align: middle;
		box-shadow: 0px 1px 2px rgb(0 0 0 / 100%);
      }
	  
	  #form_logo > h1{
	    font-size: 13px;
		font-family: 'arial';
		width: 125px;
		height: 60px;
		position: absolute;
		left: 60px;
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0px;
      }
	  	  
	  
	   .touch#form_logo {	 
        top: 8px;
		left: 8px;
      }


/* ol-control */	
	
	html, body {
		background-color: #ffffff;
	}
	.ol-control{
		box-shadow: 0px 1px 2px rgb(0 0 0 / 100%);
		clear: unset;
	}
	.ol-control button {
		background-color: #f8f8f8;
		color: #000000 ;
		font-weight: 900;
	}
	.ol-control button:hover{
		background-color: rgba(251, 214, 105)!important;
		}
	.ol-control button.clicked{
		background-color: rgba(251, 214, 105)!important;
		}
	.ol-control button:focus{
		background-color: #f8f8f8;
		}	
	.ol-touch .ol-control button {
    font-size: 1.20em;
	}
	

/* geocoder */
	
	.ol-geocoder.gcd-gl-container {
    top: 72px !important;
	left: 51px !important;
	}

	.ol-touch .ol-geocoder{
	left: unset!important;
	}
	
	.ol-geocoder .gcd-gl-input{
	z-index: 1;
	}
	
	.ol-geocoder .gcd-gl-search{
	z-index: 1;
	}
	
	.ol-geocoder.gcd-gl-container:hover {
    background-color: rgba(255,255,255,.6);
	}
	
	.ol-geocoder .gcd-gl-control {
	width: 158px;
	height: 26px;
	cursor: auto;
	}
	.ol-geocoder .gcd-gl-expanded {
    position: absolute;
    width: 100%;
    height: 2.1875em;
	}
	/* .ol-touch .ol-geocoder.gcd-gl-container{
		display: none;
	} */
	.ol-geocoder .gcd-gl-btn {
    width: 20px;
    height: 20px;
    top: 2px;
    background-image: none;
    left: 3px;
	pointer-events: none;
	}
	.ol-geocoder .gcd-gl-input {
    width: 125px;
    top: 3px;
    left: 28px;
    height: 20px;
    border: none;
    background-color: #f8f8f8;
	border-radius: 3px;
	font-size: 11.2px;
	}
	.ol-geocoder .gcd-gl-reset {
    z-index: 1;
    top: 3px;
	}
	.ol-geocoder ul.gcd-gl-result{
	left: 30px;
	z-index: 1;
	}
	
	.ol-geocoder .gcd-gl-search{
	top: -1px;
    right: 7px;
	width: unset;
	line-height: unset;
	font-size: 15px;
	}
	

	
/* ol-ext geolocate gps */
	
	.ol-control.ol-geobt {
    top: 80px;
    left: 219px;
    right: unset;
    bottom: unset;
	}
	
	.ol-touch .ol-control.ol-geobt{
    bottom: unset;
	left: 171px;
	}
	
	.ol-control.ol-geobt button:before{
    top: unset;
	left: unset;
	}
	.ol-control.ol-geobt button:after{
    top: unset;
	left: unset;
	}
	
	.geolocdescription-visible{
	display: none;
	}
	
	.ol-geobt.ol-active > .geolocdescription-visible{
	display: unset;
	}

/* ol-zoom */

	.ol-zoom{ 
    top: 104px;
	left: 51px;
	}
	.ol-zoom:hover{ 
    background-color: rgba(255,255,255,.6) ;
	}
	.ol-touch .ol-zoom{
	left: unset;
	}
	 

/* query wms wfs */

		.querywmswfs{
			top: 112px;
			left: 91px;
		}
		.querywmswfs > button{
			width: 55px;
		}
		.querywmswfs > button > h1{
			font-size: 12px;
			display: inline;
		}		
		.querywmswfs.ol-active > button {
			background-color: rgba(251, 214, 105);
		}
		
		#form_querywmswfs {
		background-color: rgba(251, 214, 105);
		border: 3px solid rgba(251, 214, 105);
		border-radius: 3px;
		z-index: 1;
		opacity: 1;
		position: absolute;
		top: 142px;
		left: 93px;
		margin: 0;
		width: 240px;
		height: 60px;
		}
		#form_querywmswfs > label {
			left: 2px;
			position: relative;
		}
		.ol-touch .querywmswfs {
		display: none;
		}
	
/* ol-ext bookmark */

		.ol-control.ol-bookmark {
			top: 112px;
			left: 157px;
		} 
		
		.ol-control.ol-bookmark > button::before {
			border-top-color: unset;
			border-left-color: unset;
			border-right-color: unset;
			border-width: 8px 4px 4px;
		}
		
		.ol-control.ol-bookmark li {
			font-size: 12px;
		}
		
		.ol-control.ol-bookmark > div {
			background-color: #f8f8f8;
		}
		
		.ol-touch .ol-bookmark{
			left: 42px;
		} 
		
		.ol-bookmark ul {
			max-height: 250px;
			overflow: auto;
		}
		
		
/* qgis2web:measurement */	
	
	.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;
	}
	.measure-control {
	 position: absolute;
	 top: 158px !important;
	 left: 51px !important;
	 display: flex;
	}
	.ol-touch .measure-control {
	  display: none;
	}
	.measure-control label {
		background-color: rgba(251, 214, 105);
		padding: 1px;
		padding-right: 4px;
	}
	
	
/* print button 	
	
	.print {
    top: 197px;
    left: 58px;
    height: 22px;
    width: 22px;
    background-color: rgba(255,255,255,.4);
    border-radius: 4px;
    padding: 2px;
    margin: 1px;
	}
	.print-hover:hover {
    background-color: rgba(255,255,255,.6);
	}
	.fa-print {
	position: absolute;
	background-color: #f8f8f8;
    height: 20px;
    width: 20px;
    border: none;
    top: 3.4px;
    left: 3px;
	}
	.fa-print:before {
	position: absolute;
	top: 2.6px;
	left: 2.5px;
	font-size: 15px;
	}	
	@media screen and (max-width: 649px) {
	.print {
    display: none;
		}
	}
*/ 
	
	
/* search layer
	
	.search-layer {
	  top: 238px;
	  left: 59px;
	}
	.search-layer-input-search {
    position: absolute;
    top: 2px;
    left: 32px;
    width: 180px;
    padding: 5px;
    border: 1px solid #ccc;
    font-family: Arial;
    font-size: .875rem;
	}
	.ol-touch .search-layer {
	  display: none;
	}
 */	
 
/*  popup all feature */
		.popupall-feature {
		top: 198px;
		left: 59px;
		}
		.popupall-feature.ol-active > button {
			background-color: rgba(251, 214, 105);
		}		
		.ol-touch .popupall-feature {
		display: none;
		}
		
		#form_popupall {
		background-color: rgba(251, 214, 105);
		border: 3px solid rgba(251, 214, 105);
		border-radius: 3px;
		z-index: 1;
		opacity: 1;
		position: absolute;
		top: 199px;
		left: 89px;
		margin: 0;
		width: 147px;
		height: 30px;
		}
 
 
/* ol-ext editbar */
  
		.ol-bar.collapsed .ol-editbar {
		  display: none;
		}
		.ol-bar.collapsed .ol-editbar > div.ol-selection {
		  display: block;
		}
		/* 
		.ol-selection{
		  display: none!important;
		} 
		 */
		.ol-bar > .ol-button {
			box-shadow:none;
		}
		
		.ol-control.ol-bar .ol-toggle.ol-active > button {
			background-color: rgba(251, 214, 105);
			color: black;
		}
		.ol-control.ol-bar .ol-toggle.ol-active button:hover{
			color: black;
		}
		.ol-control.ol-bar {
			left: 59px;
			height: 22px;
			top: 203px;
			-webkit-transform: translate(0,100%);
		}
		
		.ol-control.ol-bar .ol-control button{
			margin: 0.5px 1px;
		}
		.ol-touch .ol-bar{
			display: none;
		}
		.fa-drafting-compass::before{
			top: 1.3px;
			position: relative;
		}
		.ol-editbar {
			box-shadow:none;
		}
		.ol-editbar .ol-drawregular > button:before{
			width: 14px;
			height: 14px;
			border: 2px solid currentColor;
		}
		.ol-editbar .ol-selection > button:before {
			width: 8px;
		}		
		.ol-editbar .ol-drawpoint button:before {
			top: 0.3em;
			border: 0.35em solid currentColor;
		}
		.ol-editbar .ol-drawpoint button:after {
			display: none;
		}
		.ol-editbar .ol-offset > button i, .ol-editbar .ol-transform > button i {
			width: 13.7px;
		}

		
/* ol-ext search feature */

		.ol-search {
			top: 260px;
			left: 59px;
		}
		.ol-search input {
			border: 1px solid #ccc;
			height: 20px;
			width: 180px;
			font-family: inherit;
			font-size: .875em;
			padding-left: 3px;
			background-color: #f8f8f8;
		}
		.ol-search ul {
			position: relative;
			top: 2px;
			left: 1px;
			height: 200px;
			width: auto;
			max-width: unset;
		}
		.ol-touch .ol-search {
			top: 168px;
			left: 8px;
		} 
		.ol-control.ol-search > button:before{
		  border: 0.2em solid currentColor;
		}
		
		.ol-search:not(.ol-collapsed) button {
		  background-color: rgba(251, 214, 105);
		}

		/* #FormSearchFeature {
			  background-color: rgba(251, 214, 105);
			  border: 3px solid rgba(251, 214, 105) ;
			  border-radius: 3px;
			  z-index: 1;
			  opacity: 1;
			  position: absolute;
			  top: 300px;
			  left: 89px;
			  margin: 0;
			  width: 147px;
			  height: 19px;
			} */

		.ol-touch .ol-search input, .ol-touch .ol-search ul {
			font-size: .875em;
		}	


/* extended search table */

		.extendedSearch {
		left: 59px;
		top: 291px;
		}
		.extendedSearch.ol-active > button {
		background-color: rgba(251, 214, 105);
		}
		.ol-touch .extendedSearch {
		display: none;
		}

		.tabulator {
		font-size: small !important;
		}
		.tabulator-header,
		.tabulator-col {
		background: lightsteelblue!important;
		color: #333!important;
		}
		.tabulator-col-content:hover {
		background-color: #ddd;
		}

		#layer-table {
		display: none;
		position: fixed;
		z-index: 1;
		bottom: 0px;
		/*max-height: 30%;*/
		height: 30%;
		width: 100%;
		}

		.additional-header {
		background: steelblue;
		color: white;
		padding: 2px;
		}

		.additional-header > button {
		border-radius: 4px;
		border-width: 1px;
		}

		#layer-combo {
		border-radius: 5px;
		background-color: rgba(251, 214, 105);
		}
		#layer-combo option {
		background-color: white;
		}
		#layer-combo option:checked {
		background-color: rgba(251, 214, 105);
		}

		#layer-visibility-button {
		background-color: #f8f8f8;
		border-radius: 5px;
		margin-left: 5px;
		}
		#layer-visibility-button:hover {
		background-color: #ddd;
		}
		#layer-visibility-button.active {
		background-color: rgba(251, 214, 105);
		}

		#zoom-selected-row-extension {
		background-color: #f8f8f8;
		border-radius: 5px;
		margin-left: 5px;
		position: absolute;
		padding: 1px;
		padding-left: 2px;
		padding-right: 2px;
		position: relative;
		}
		#zoom-selected-row-extension:hover {
		background-color: #ddd !important;
		}
		#zoom-selected-row-extension:disabled {
		color: #999999;
		background-color: #f1f1f1;
		cursor: not-allowed;
		}

		#clear-selected-row {
		background-color: #f8f8f8;
		border-radius: 5px;
		margin-left: 5px;
		position: relative;
		}
		#clear-selected-row:hover {
		background-color: #ddd;
		}
		#clear-selected-row:disabled {
		color: #999999;
		background-color: #f1f1f1;
		cursor: not-allowed;
		}

		#table-button-xlsx {
		position: absolute;
		right: 32px;
		background-color: #f8f8f8;
		border-radius: 5px;
		}
		#table-button-xlsx:hover {
		background-color: #ddd;
		}

		#close-button {
		position: absolute;
		right: 3px;
		background-color: #f8f8f8;
		border-radius: 5px;
		}
		#close-button:hover {
		background-color: #ddd;
		}

		/* advanced filter */

		.tabulator-header-popup-button {
		padding: 2px 5px 2px 6px;
		}

		.tabulator-header-popup-button.active {
		color: rgba(251, 214, 105);
		text-shadow: 1px 1px 3px #000;
		}

		.menu-overlay {
		position: absolute;
		z-index: 1;
		display: none;
		}

		.filter-menu {
		position: absolute;
		bottom: 0px;
		background-color: #f8f8f8;
		padding: 5px;
		min-width: 150px;
		border: 1px solid #999;
		}

		.filter-menu > button {
		border-radius: 4px;
		border-width: 1px;
		}

		.close-menu-button {
		position: relative;
		float: right;
		border-radius: 5px;
		cursor: pointer;
		}
		.close-menu-button:hover {
		background-color: #ddd;
		}

		#filter-input {
		position: relative;
		margin-right: 20px;
		margin-top: 6px;
		}

		#clear-selection-button {
		position: relative;
		background: none;
		border: none;
		color: red;
		cursor: pointer;
		font-size: 15px;
		top: 3px;
		}

		#select-all-button {
		position: relative;
		background: none;
		border: none;
		color: blue;
		cursor: pointer;
		font-size: 15px;
		top: 3px;
		}

		#value-select {
		position: relative;
		height: 245px;
		width: 200px;
		margin: 5px;
		overflow: auto;
		background-color: #ffffff;
		}

		#value-select > label {
		display: flex;
		}

		#remove-filter-button {
		background: none;
		border: none;
		font-size: 15px;
		color: red;
		cursor: pointer;
		}

		#filter-button {
		float: right;
		position: relative;
		background-color: #4caf50;
		color: white;
		border-radius: 5px;
		cursor: pointer;
		}

		.filter-menu-overlay {
		position: absolute;
		height: 100%;
		width: 100%;
		top: 0px;
		left: 0px;
		background-color: rgba(0, 0, 0, 0.25);
		display: none;
		}
		.filter-operator-window.active + .filter-menu .filter-menu-overlay {
		display: block;
		}

		/* filter operator */

		#filter-operator {
		background: unset;
		}
		#filter-operator:hover {
		background-color: #ddd;
		}
		.filter-operator-window {
		position: absolute;
		bottom: 180px;
		left: -25px;
		width: 250px;
		height: auto;
		background-color: #fff;
		border: 1px solid #ccc;
		padding: 10px;
		z-index: 1;
		display: none;
		}

		.filter-operator-close-button {
		position: relative;
		float: right;
		margin-top: unset !important;
		border: 1px solid black;
		border-radius: 4px;
		cursor: pointer;
		}
		.filter-operator-close-button:hover {
		background-color: #ddd;
		}

		.filter-operator-window h3 {
		margin: 0 0 10px 0;
		}

		.filter-operator-window select,
		.filter-operator-window input {
		width: 100%;
		margin-top: 4px;
		}

		.filter-operator-window button {
		margin-top: 10px;
		}

		#filter-value-2 {
		display: none;
		}

		#apply-filter-button {
		border: 1px solid black;
		border-radius: 4px;
		cursor: pointer;
		float: right;
		background-color: #4caf50 !important;
		color: white;
		}

		#apply-filter-button:hover {
		background-color: #ddd;
		}

		#filter-status {
		position: relative;
		display: none;
		}

		#filter-status .filter-text {
		display: inline-block;
		}

		#delete-filter-operator {
		background-color: unset;
		color: red;
		border: none;
		cursor: pointer;
		display: none;
		bottom: 1px;
		position: relative;
		}

		/* sort arrow */

		.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=none] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow {
		border-bottom: none;
		}
		.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=ascending] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow{
		border-top: none;
		border-bottom: 6px solid #333;
		}
		.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=descending] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow{
		border-top: 6px solid #333;
		border-bottom: none;
		}


		
/* overview map  */
		.ol-control.ol-overview	{
			left: 59px;
			bottom: 89px;
		}	
		.ol-overview:not(.ol-collapsed) button {
			z-index: 1;
		}
		.ol-touch .ol-control.ol-overview{
			bottom: 64px;
			left: 8px;
		}
		
/* scale line */
	  	
		 .ol-scale-line {
			position: absolute;
			left: 60px;
			bottom: 66px;
			margin-bottom: unset;
			margin-left: unset;
			padding: unset;
			border-radius: 0px;
			
		}
		.ol-scale-line-inner {
			border: 2px solid #ccc ;
			border-top: none ;
			background: #f8f8f8;
			color: black ;
			font: 11.5px/1.5 Arial;
			height: 14px;
			border-top: 1px solid #f8f8f8;
		}
		.ol-touch .ol-scale-line{
			bottom: 40px;
			left: 8px;
		}
		
/* ol-ext scale control */
	
		.ol-viewport .ol-scale {
		left: 60px;
		bottom: 43px;
		height: 13px;
		border-radius: unset;
		display: flex;
		flex-direction: row-reverse;
		font: 14.4px/1.2 Arial;
		}
	 .scaladescription-visible {
		left: 2px;
		background-color: #f8f8f8;
		height: 13px;
		display: block;
		position: relative;
		line-height: 12px;
		margin-right: 5px;
		}
	 .ol-viewport .ol-scale input {
		height: 11px;
		width: 70px;
		background-color: rgba(255,255,255,1);
		margin-right: 2px;
		}	
     .ol-touch .ol-scale{
		display: none;
		}			
		
/* epsg mouse position coordinates */	
		
		.mousePositionDefault {
			position: absolute;
			background-color: #f8f8f8;
			height: 13px;
			top: unset;
			bottom: 22px;
			left: 61px;
			font: 11.5px/1.6 Arial;
			border-radius: unset;
			padding: unset;
			padding-left: 3px;
			padding-right: 3px;
			padding-bottom: 3px;
		}
		.mousePositionDefault:hover {
			background-color: rgba(251, 214, 105);
				}
		
		.ol-touch .mousePositionDefault {
			display: none;
		}
		
		
/* form login 
	
      #form_login {
		background-color: rgba(255, 255, 255, 0.75);
		border: 2px solid #f8f8f8 ;
		border-top: none ;
        z-index: 1;
        opacity: 1;
		top: 10px;
		right: 10px;
		margin: 0;
		width: 77px;
		height: 24px;
		vertical-align: middle
      }
	  .text_login {
		position: absolute;
		top: -1.6px;
		left: 7px;
		}
	  .fa-sign-in-alt {
		position: absolute;
		top: 4.4px;
		right: 8px;
		}
*/

		
/* modify qgis2web popup */

		/*
		#popup-content>ul>li:nth-child(even) {
			background-color: unset;
		}
	
		#popup-content li table{
		max-height: 200px;
		overflow-x: hidden;
		overflow-y: auto;
		display: block;
		}
		
		#popup-content {
			max-height: calc(100vh - 300px);
			max-width: 350px;
			overflow-y: auto;
			font-size: 11.5px;
		}
		
		#popup-content > a {
			display: block;
			padding: 2px;
			border-bottom: 1px solid #666;
			font-size: 12.4px;
		}
		
		table.featureInfo caption {
			color: #666;
		}
		
		.ol-selectable {
			z-index: 3;
		}
			
		th {
		min-width: 125px;
		color: #666!important;
		}
		td {
		min-width: 125px;
		}
		
		@media screen and (max-width: 649px) {
		th {
		min-width: 125px;
		}
		td {
		min-width: 125px;
		}
		#popup-content {
			max-width: 265px;
		}
		}
		
		.ol-popup {
		user-select: text;	
		overflow: unset;
		max-height: unset;
		cursor: default;
		left: -145px;
		padding: 5px;
		}
		.ol-popup:after {
        top: 100%;
        border: solid transparent;
        content: " ";
        position: absolute;
		border-top-color: white;
        border-width: 10px;
        left: 145px;
        margin-left: -10px;
		}	
		#popup-content>ul>li>a {
		position: relative;
		display: block;
		padding: 2px;
		border-bottom: 1px solid #666;
		font-size: 12.5px;
		}
		
		#popup-content>table{
			font-size: 11.4px!important;
		} */
		
		th {
		color: #666!important;
		}
		
		tr td strong {
			 color: #333;
		}


		
		
/* ol-ext popup feature */

		.ol-popup.default {
		  left: auto;
		  padding: unset;
		  display: block;
		  bottom: auto;
		  background: none;
		  border: 0;
		  filter: unset;
		  width: fit-content;
		  min-width: 110px;
		  z-index: 4;
		  font-size: 11.5px;
		  filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
		}
		.ol-popup.default:after {
		  display: none;
		}
		
		.ol-popup.default:before {
		  display: none;
		}
		
		.ol-popup .closeBox:after{
			top: 8px;
		}
		
		.ol-popup-content{
			min-height: 60px;
		}

		.ol-popupfeature h1{
		  height: 10px;  
		  font-weight: bold;
		  font-size: 12.5px;
		  margin-top: 5px;
		  margin-bottom: 10px;
		}
			
		.ol-popup .ol-popupfeature table td {
			word-wrap: break-word;
		}
		
		.ol-popupfeature tr:nth-child(2n+1){
		  background-color: unset!important;
		}

		tr td:first-child {
			font-weight: bold;
			color: #666!important;
			/* min-width: 125px; */
		  }

		/* tr td:nth-child(2) {
			min-width: 125px;
		  } */
		  
		@media screen and (max-width: 649px) {
			.ol-popup .ol-popupfeature table td {
			max-width: 110px;
			word-wrap: break-word;
			min-width: 80px;
			}					
		}
		
		.ol-popup-center .ol-count {
			float: right;
			margin: 7px 0 0 0!important;
			position: absolute;
			bottom: 12px;
			right: 7px;
		}
		 
		.ol-popup-top.ol-popup-left .ol-count {
			position: relative;
			top: -7px;
			left: -3px;
			float: left;
		}

		.ol-popup-top.ol-popup-right h1 {
		  padding-right: 65px;
		}
		.ol-popup-top.ol-popup-right .ol-count {
			margin: 7px 0 0 0!important;
			position: absolute;
			top: 3px;
			right: 25px; 
		}

		.ol-popup-left .ol-count {
			margin: 7px 0 0 0!important;
			position: absolute;
			bottom: 12px;
			left: 32px;
		}

		.ol-popup-right .ol-count {
			margin: 7px 0 0 0!important;
			position: absolute;
			bottom: 12px;
			right: 7px;
		}

		.ol-popup .ol-popupfeature .ol-zoombt {
			width: 25px;
			height: 25px;
		}

		.ol-popup .ol-popupfeature .ol-zoombt:before {
			width: 0.9em;
			height: 0.9em
		}
		.ol-popup .ol-popupfeature .ol-zoombt:after {
			top: 16.5px;
			left: 14.5px;
			border-width: 0.1em 0.25em;
		}
		
		
		.ol-popup .ol-fix {
			/* width: 1em; */
			/* height: 0.9em; */
			background: rgba(255, 255, 255, 1);
			/* color: white; */
			position: absolute;
			right: 6px;
			top: 26px;
			float: right;
			margin: 0.2em;
			cursor: pointer;
		}
		.ol-popup .ol-fix:before {
			content: "";
			width: 12px;
			height: 11px;
			display: block;
			border: 1px solid rgba(0, 60, 136, 0.5);
			border-right-width: 0.1em;
			border-right-width: 4px;
			-webkit-box-sizing: border-box;
			box-sizing: border-box;
			/* margin: 0.1em; */
		}

		.ol-touch .ol-fix {
			display: none;
		}

		.ol-popup.ol-fixed {
			margin: 0!important;
			top: 350px!important;
			right: auto;
			left: 60px!important;
			bottom: auto!important;
			-webkit-transform: none!important;
			transform: none!important;
		}

		.ol-fixed .ol-count {
			position: relative;
			top: -7px;
			left: 0px;
			float: left;
		}

		


/* ol-ext print dialog  */
	
		.ol-control.ol-print {
			top: 9px;
			right: 105px;
			left: unset;
		}
		.ol-ext-print-dialog .ol-scale-line {
			display: none;
		}
		.ol-scale-bar {
			display: none;
		}
		.ol-ext-print-dialog .ol-scale-bar {
			display: unset;
			bottom: 20px;
			left: 20px;
		}
		.ol-ext-print-dialog .ol-geocoder{
			display: none;
		}
		.ol-ext-print-dialog .mousePositionDefault{
			display: none;
		}
		.ol-ext-print-dialog .ol-attribution{
			display: none;
		}
		.ol-ext-print-dialog .ol-print-map .legend-attribution{
			display: block!important;
			right: 10px!important;
			top: 30px!important;
			background-color: #f8f8f8!important;
			height: unset!important;
			max-height: calc(100% - 45px);
			overflow-y: auto!important;
			border: 2px solid #000;
			margin-top: unset!important;
		}
		.ol-ext-print-dialog .legend-attribution ul {
			width: unset;
			top: unset;
		}
		.ol-ext-print-dialog .legend-attribution button{
			display: none;
		}
		.ol-ext-print-dialog .legend-attribution.ol-collapsed ul{
			display: flex;
		}
		.ol-ext-print-dialog .ol-saveas{
			display: none;
		}
		.ol-ext-print-dialog .ol-print-compass{
			top: 10px!important;
			right: unset!important;
		}
		/* show button on print map
		.ol-ext-print-dialog .ol-print-map .ol-control.measure-control{
			display: block!important;
		}
		.ol-ext-print-dialog .ol-print-map .ol-control.highlight-feature{
			display: block!important;
		}
		.ol-ext-print-dialog .ol-print-map .ol-control.ol-bar{
			display: block!important;
		}
		.ol-ext-print-dialog .ol-print-map .ol-control.ol-bar .ol-control{
			display: inline-block!important;
		}
		.ol-ext-print-dialog .ol-print-map .ol-bar.collapsed .ol-editbar{
			display: none!important;
		}
		.ol-ext-print-dialog .ol-print-map .ol-control.ol-bar .ol-control.ol-option-bar{
			display: none!important;
		}
		.ol-ext-print-dialog .ol-print-map .ol-control.ol-bar .ol-control.ol-active > .ol-option-bar{
			display:block!important;
		} 
		*/
		.ol-ext-print-dialog .ol-print-map .ol-viewport .ol-scale{
			display: block!important;
			left: 21px;
			bottom: 55px;
			background-color: #000000;
			box-shadow: none;
		}
		.ol-ext-print-dialog .ol-print-map .scaladescription-visible{
			display: none;
		}
		.ol-ext-print-dialog .ol-print-map #form_epsg{
			display: none;
		}		
		.ol-ext-print-dialog .ol-print-map .ol-viewport .ol-scale input {
			bottom: 2px;
			position: relative;
		}
		.ol-touch .ol-control.ol-print{
			display: none;
		}		




/* legend attribution in map*/

			.ol-attribution .legend {
				display: none;
			}

			.legend-attribution {
				text-align: left;
				bottom: unset;
				right: 12px;
				top: 43px;
				z-index: 3;
				max-height: calc(100% - 172px);
				box-shadow: none;
				display: none;
				}
			.legend-attribution:not(.ol-collapsed){
				background: #f8f8f8;
			}
			.legend-attribution.ol-uncollapsible {
				bottom: unset;
				right: unset;
			}
			.legend-attribution.ol-unselectable.ol-control.ol-collapsed {
				height: unset;
				overflow-y: hidden;
				background-color: rgb(255 255 255 / 0%);
				right: 55px;
				top: 56px;
				margin-top: 0px;
			}
			.legend-attribution.ol-unselectable.ol-control {
				height: 100%;
				overflow-y: scroll;
				margin-top: 40px;
			}

			.legend-attribution button {
				z-index: 3;
				border: 1px solid #00000033;
			}
			.legend-attribution.ol-unselectable.ol-control.ol-collapsed > button {
				position: relative;
				right: unset;
				width: 65px;
				background-color: #f8f8f8;
			}
			.legend-attribution.ol-unselectable.ol-control > button {
				position: fixed;
				right: 35px;
				width: 108px;
				background-color: rgba(251, 214, 105);
				border-radius: 4px;
			}
			.legend-attribution.ol-collapsed ul {
				display: none;
			}
			.legend-attribution ul {
				position: relative;
				display: flex;
				flex-direction: column-reverse;
				width: 304px;
				top: 22px;
				padding-left: 4px;
				margin-bottom: unset;
			}
			.legend-attribution li {
				padding-bottom: 8px;
				max-width: 300px;
				list-style: none;
			}
			.legend-attribution img{
				max-width: 22px;
				max-height: 22px;
			}
			.legend-realtime img {
				max-width: unset;
				max-height: unset;
			}
			.legend-attribution-expand, .legend-attribution-collapse {
				font-family: Arial;
				font-weight: 600;
				font-size: small;
			}

			
		
/* ol-ext permalink  */		
		.ol-permalink{
			position: absolute;
			right: 73px;
			top: 9px;
		}
		
		.ol-permalink button {
		background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QUIzOUY4MzEzOEM5MTFFREJCMjA4ODVCNjRDMzU4RTEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QUIzOUY4MzIzOEM5MTFFREJCMjA4ODVCNjRDMzU4RTEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpBQjM5RjgyRjM4QzkxMUVEQkIyMDg4NUI2NEMzNThFMSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpBQjM5RjgzMDM4QzkxMUVEQkIyMDg4NUI2NEMzNThFMSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pl8WV18AAAIkSURBVHjapJM/aBRBFMZnZ2d3b++8P14h2Bib4zwEO4UUyaGNRUAUQUJUNBg0jYpCSgs7wSIg2AkmaWxEDAZJE0QRPUGwioiWNjZCIsvt3v6Z9TfhEgx6JOCwj3k7733v+97OWyvPc/E/S3U6HREEwY6JUkrPkvKwha+1/oxF9XpdiEajsRuiEewrlvftG3ayPToqlOd5f2XDNAzTUdwuLS6XSnuGwrBb4v0elmI3syx7VqnWhtU2oGVJ27YfEpzW/W+D9KDXi65Q6CCyE3PmF4srYbf7itgt+SeYZy5N02n8RaXUpHIc468BnlfKGdrMpdBbcn+FYXhImluA1fb94nye64vlcnnB8wpXKXnXlnK/63njAAqOo85tkQlxgtyKX/RXjWSzHtHjBVifRlF0CS0TWmcHKP4J+45UFMq6ATuueyxJkie4gc6yWTBqKo7jy+zPkT/RV9QwIM5e8z6DApEk8ZLjOEfwlzmrUOAUZKvkyUn6DNmvEdj4SLatPhoQYqfYvxB7gIQQfyXXugLBGYIvNz4yhEUKxPjrmz3Gce8xbB9o636SpuMUriVx/J7cvYBP08KLrQFjLhapXCXpDoUKWJlrPEvsOi0siDxvEzuPinfSlscBL20bmmazWWV705+wH9hP41PoRj+lhu3713i2222hWq3Wuuu6YzDcRuIY2MzMgdb5HFdl8tYGzTfkwhr0N5pzCu38kw0K7AZs1m8BBgB/TADv8Sy50QAAAABJRU5ErkJggg==');
		background-position: center;
		background-repeat: no-repeat;
		}
		
		.ol-permalink button i:before {
			display:none;
		}
		.ol-permalink button i:after {
			display:none;
		}

		.ol-touch .ol-permalink {
			display: none;
		}
		.center {
		text-align: center;
		}
		.ol-ext-dialog > form .ol-content {
			overflow-x: hidden;
			overflow-y: auto;
			user-select: text;
			cursor: auto;
			word-wrap: break-word;
		}	
		.ol-ext-dialog	{
			background-color: unset;
		}
		
		
		
/* rotate arrow */	
		
		.ol-rotate {
			height: 22px;
			right: 41px;
			top: 9px;
		}
		
		.ol-touch .ol-rotate{
			top: 50px;
		}
		
		.ol-rotate.ol-hidden {
		opacity: unset;
		visibility: unset;
		}
		.ol-compass{
			font-weight: unset;
		}
		
		.ol-touch .ol-rotate-reset{
			height: 20px;
			width: 20px;
		}
	
		
/* fullscreen  */	
	
		.expand {
		top: 8px;
		right: 7px;
		height: 22px;
		width: 22px;
		border-radius: 4px;
		padding: 2px;
		margin: 1px;
		}
		
	  .touch.expand {	 
        top: 49px;
	  }

		
/* ol-ext layerswitcher */		
		
		.ol-touch .ol-layerswitcher {
		top: 80px;
		
		}
		
		.ol-touch .ol-layerswitcher.ol-forceopen {
		max-height: calc(100% - 158px)!important;
		}
		
		.ol-layerswitcher.ol-forceopen {
		z-index: 2;
		height: 100%;
		max-height: calc(100% - 120px);
		padding: 3px;
		right: 8px;
		cursor: auto;
		}
		
		.ol-layerswitcher.ol-unselectable.ol-collapsed{
		min-height: 43px;
		min-width: 43px;
		padding: 3px;
		right: 8px;
		}
		
		.ol-layerswitcher.ol-forceopen .panel-container {
	/* personalize width panel container */	
		width: 330px;
		margin-top: 40px;
		height: calc(100% - 47px);
		overflow-y: scroll;
		background-color: #f8f8f8;
		padding-left: 2px;
		}
		
		.ol-layerswitcher .panel {
		right: -3px;
		font-family: sans-serif;
		font-size: 11.5px;
		}
		
		#layersSelect {
			float: right;
			margin-bottom: 6px;
		}

		.panel a {
			position: relative;
			float: right;
			top: 2px;
			right: 3px;
		}

		.ol-layerswitcher .panel ul {
		padding: 0 0 7px 22px;
		}

		.ol-layerswitcher .panel li label {
	/* personalize width label */	
		width: 200px;
		max-width: unset;
		height: auto;
		min-height: 15px;
		white-space: unset;
		/* max-height: 250px; 
		overflow-y: auto;*/
		}

		.ol-layerswitcher .panel li > div {
		display: contents;
		}
		
		.ol-layerswitcher .panel li label span {
		position: relative;
		padding-left: 5px;
		width: 95%;
		}
		
		/* .ol-layerswitcher .panel li label span img {
		max-width: 98%;
		} */
		
		
		.ol-layer-group .li-content label span {
		  font-weight: bold;
		}
		
		.ol-layer-group .ol-layer-group .li-content label span {
		  font-weight: bold;
		  font-style: italic;
		 }		 

		.ol-layer-vector .li-content label span {
		  font-weight: unset;
		}
		
		.ol-layer-tile .li-content label span {
		  font-weight: unset;
		 }
		 
		 .ol-layerswitcher img {
			max-width: 22px;
    		max-height: 22px;
		 }

		.ol-layerswitcher .layerswitcher-opacity {
		display: inline-flex;
		position: absolute;
		width: 40px;
		right: 26px;
		border: unset;
		margin: 9px 6px 6px 3px;
		background: linear-gradient(to right, rgba(0,60,136,0), #aaa);
		box-shadow: 1px 1px 1px rgb(0 0 0 / 35%);
		}
		
		.ol-layerswitcher .layerswitcher-opacity-label {
		display: inline;
		position: absolute;
		right: 50px;
		bottom: unset;
		font-size: 0.7em;
		}
			
		.ol-layerswitcher [type="radio"] + label:before, .ol-layerswitcher [type="checkbox"] + label:before, .ol-layerswitcher [type="radio"]:checked + label:after, .ol-layerswitcher [type="checkbox"]:checked + label:after{
		display:none;
		} 
		
		.ol-layerswitcher input[type="radio"], .ol-layerswitcher input[type="checkbox"]{
		display:unset;
		position: absolute;
		}
		
		.ol-layerswitcher .layerswitcher-opacity .layerswitcher-opacity-cursor, .ol-layerswitcher .layerswitcher-opacity .layerswitcher-opacity-cursor:before {
		width: 10px;
		height: 10px;
		background: #aaaaaa61;
		}
		
		.ol-layerswitcher input[type="checkbox"] {
		display: unset;
		position: absolute;
		}
		
		@media screen and (max-width: 649px) {
			.ol-layerswitcher input[type="checkbox"] {
				width: 15px;
				height: 15px;
			}
			.ol-layerswitcher .panel li label {
				top: 3px;
			}
		}
		
		.ol-layerswitcher-buttons > div {
		vertical-align: 1.2px;
		height: 12px;
		}
		
		.ol-layerswitcher button {
		position: static;
		top: 42px;
		right: 9px;
		float: right;
		z-index: 1;
		width: 35px;
		height: 35px;
		background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAwRJREFUaEPtmP2RDVEQxc9GYDMgAzJABIgAESACRIAIEAEZIAMysBnsZqB+alq1u/ej78d49dTrf96rmTtz+3SfPrd7znTkdnbk/usE4NAZPGXgf87AuaT3G8Cnki73ALsXhe5I+iTp1ub0T0mPJH1fDWIPAE8kvZFEBryRgReSPqwEsRoAlAGA2dX254a7BgAotcRWAYAqUAbqmP1wYHD6trsHlaAU1JqyFQDubc57ynyU9NwVLvfeSnrsvIVSgPg6g2AWwEtJrxIH4DnO5gxQ1Ic3nn89CmIUgEnkw4TvZKOlNNCMqPu6+LzVRbfUjgBIJRIM3yQBJuoAAcDpuy4AQ1LbCyAnke82vo+wAKo9S+qiS2p7AOQkEkBEcsbIHCo1JLURADWJbPE9CgxaDkltC0BEIqNOttYNSW0NQK9EthyM3u+S2hqAEjcpsqjaRJ22dWSBcyJtR4q11qIQ/KdId2kDEnSlWiOQxZajBYA9StykIZtVIMOAk6hcrR3JZjMCwB4kjTag2LWpNmB7Sa7WCE6o7e4BwH7IHVG/6cJBW0BT1lsXRJsOFqUzu9hO9LA8RwDATc/BFW1AtB1J975GoxoArwgc+aiPN+hD+r1FUp+jIt1o2tWiRkgqVCoqXw0AD/r+nbTeT6jSI7VRiWTdl2Q4Yr7w0vonaK0MAOKBC3FuCIlIbVQiu0/+SA3kTkau0YX6Ayg3cdnsG5FIutJ0EKoNR7/3jgBgHZFBfVpDSI7faeGldTIzHIUB2IGGZKanMg552ctJLc/nJJK1ZMd/DOgajqIZ8FGMDCGp1OacWjIcjQAADJsDxFOqJLWsL0mkBYbvR0PD0SgAO5VzQ0gqtT57OYm070fh09e/cAaA1UVEak0IaB26G7Zrx6+7MAvAXtWS2iGJrDlu91YBqEkt90a+H0X875LRyAuhRyq1/rkuiYxsuDIDNanl3sz3oyKWvQB4qbX/q6a3v8DsCcCklt8hiTwkhSJ7L1mzdwaWOPkvzoHdHS1tcMrAwUK/bXz0GfgFVLbIMcdxjJAAAAAASUVORK5CYII=');
		background-size: contain;
		background-repeat: no-repeat;
		/* background-position: 2px; */
		background-color: #f8f8f8;
		color: black;
		border: none;
		}

		.ol-layerswitcher > button:before , .ol-layerswitcher > button:after {
		display:none;
		}
		
		.ol-layerswitcher .expend-layers:before, .ol-layerswitcher .collapse-layers:before, .ol-layerswitcher .expend-layers:after{
		background: #999;
		}
		
		.ol-layerswitcher .expend-layers:before, .ol-layerswitcher .collapse-layers:before {
		content: "";
		position: absolute;
		top: 4px;
		left: 0;
		height: 3px;
		width: 11px;
		margin: unset;
		}
		
		.ol-layerswitcher .expend-layers:after {
		content: "";
		position: absolute;
		left: 4px;
		top: 0;
		width: 3px;
		height: 11px;
		margin: unset;
		}
		
		.ol-layerswitcher .layerExtent {
			background: #ccc;
			position: absolute;
			right: 12px;
			height: 17px;
			width: 11px;
			cursor: -moz-zoom-in;
			cursor: -webkit-zoom-in;
			cursor: zoom-in;
		}

		.ol-layerswitcher .layerExtent:before {
			border-right: 2px solid #fff;
			border-bottom: 2px solid #fff;
			content: "";
			display: block;
			position: absolute;
			left: 5px;
			right: 1px;
			top: 9px;
			bottom: 2px;
		}

		.ol-layerswitcher .layerExtent:after {
			border-left: 2px solid #fff;
			border-top: 2px solid #fff;
			content: "";
			display: block;
			position: absolute;
			bottom: 9px;
			left: 1px;
			right: 5px;
			top: 2px;
		}	
		
		.ol-layerswitcher .layerup {
		height: 17px;
		width: 11px;
		right: -3px;
		background-color: #ccc;
		opacity: 1;
		cursor: move;
		position: relative;
		}
		
		.ol-layerswitcher .layerup:before, .ol-layerswitcher .layerup:after {
		border-color: #fff transparent;
		border-style: solid;
		border-width: 0.4em 0.4em 0;
		content: "";
		position: absolute;
		bottom: 1px;
		left: 0.1em;
		width: 0;
		}
		
		.ol-layerswitcher .layerup:after {
		border-width: 0 0.4em 0.4em;
		top: 2px;
		bottom: auto;
		}
		
		/*Hide layer for hideLayer class list element*/
		li.hideLayer {
		display: none!important;
		}
	
	
		/*expand collapse layerlegend */
		
				#layertitle {
					position: relative;
					display: flex;
					justify-content: space-between;
					align-items: center;
					cursor: pointer;
					
				}

				#secondImage {
				  display: none;
				}
				.active #firstImage {
				  display:none;
				}
				.active #secondImage {
				  display: inline-block;
				}
				.fa-angle-down, .fa-angle-up {
					position: relative;
					cursor: pointer!important;
					font-size: large;
					color: #999;
					left: 1px;
				}

				/*layerlegend before*/
				.layerlegend, .layerlegend-realtime {
				  display: none;
				  max-height: 0px; 
				  /*transition: all 1s;*/
				}
								
				/*layerlegend after*/
				.active + .layerlegend , .active + .layerlegend-realtime {
				  display: block;
				  height: auto;
				  max-height: 250px;
				  overflow-y: auto;
				  overflow-x: auto;
				  width: 100%;
				}
				/*layerlegend-realtime img*/
				.layerlegend-realtime img {
					max-width: unset;
					max-height: unset;
				}
		
		
		/*scroolbar in legend */
		.layerlegend::-webkit-scrollbar , .layerlegend-realtime::-webkit-scrollbar {
			width: 10px;
			height: 10px;
			background: #eee;
		}
		.layerlegend::-webkit-scrollbar-thumb , .layerlegend-realtime::-webkit-scrollbar-thumb {
			background: #ccc;
		}
		
		
		/* Hide opacity bar for noOpacity class list element
		li.noOpacity .layerswitcher-opacity {
		display: none;
		}
		li.noOpacity .layerswitcher-opacity-label {
		display: none;
		}
		*/
		
		/* Remove the checkbox in Group Layer (using initial [#map .visible] if using Father/Children group relation in .js)
		#map .ol-layer-group > .li-content input[type="checkbox"]{
		display: none;
		}
		
		/* Prevent clic (using initial [#map .visible] if using Father/Children group relation in .js)
		#map .ol-layer-group > .li-content label {
		  padding-left: 0px;
		  pointer-events: none;
		}*/
		
		/* 
		.ol-touch .ol-layerswitcher .layerswitcher-opacity .layerswitcher-opacity-cursor {
			width: 10px;
			height: 10px;
		} */
		
		.ol-touch .layerup , .ol-touch .layerExtent , .ol-touch .layerswitcher-opacity , .ol-touch .layerswitcher-opacity-label {
			display: none;
			}
			
		.ol-touch .panel-container {
			width: 250px!important;
		}
		
				
/* modify walkermatt layer switcher 
	  
		.layer-switcher {
		top: 75px;
		}
		.layer-switcher.shown {
		max-height: calc(100% - 140px);
		width: 290px;
		}
		.layer-switcher.shown.layer-switcher-activation-mode-click > button
		{
		left: unset;
		right: 22px;
		border: 4px solid #eee;
		border-radius: 4px!important;
		font: 24px/0 Arial;
		}
		.layer-switcher li label {
		padding-left: 2.7em;
		padding-right: 1.2em;
		display: inline-block;
		margin-top: -1px;
		}
		.layer-switcher ul {
		margin: 7px 0.4em;
		}
			*/
		
/* street-view */
 
	.ol-street-view--activated .ol-street-view--size-toggler {
	 display: none;
	 }
	 
	#ol-street-view--pegman-button-div {
    top: unset;
	bottom: 14px;
    right:47px;
	z-index: 1;
	}
	
	#ol-street-view--pegman-button-div.ol-street-view--md-btn #ol-street-view--pegman-button, #ol-street-view--pegman-button-div.ol-street-view--md-btn #ol-street-view--pegman-draggable {
    transform: scale(0.6);
	}
	
	#ol-street-view--pegman-button-div #ol-street-view--pegman-button {
	box-shadow: 0 1px 4px rgb(0 0 0 / 100%);
	}
	
	.gm-control-exit {
    color: #f8f8f8;
	}
	

/* form opengis */

      #form_opengis {
		position: absolute;
		background-color: #fff;
		border: 2px solid #fff;
		border-radius: 3px;
		box-shadow: 0 1px 4px rgb(0 0 0 / 100%);
		z-index: 1;
		opacity: 1;
		bottom: 24px;
		right: 8px;
		margin: 0;
		width: 27px;
		height: 27px;
		vertical-align: middle;
	}
	  
	  #form_opengis>a>label>img{
		position: absolute;
		left: 1px;
		float: center;
		height: 26px ;
		cursor: pointer;
      }

	  
/* form data source 

      #form_datasource {
		position: absolute;
		background-color: #fff;
		border: 2px solid #fff;
		border-radius: 3px;
		z-index: 1;
		bottom: 0;
		right: 0;
		width: auto;
		height: auto;
		vertical-align: middle;
		max-width: calc(100% - 60px);
	}  	
	
	/* select all elements #form_datasource that precede .ol-touch
	  .touch#form_datasource {	 
        max-width: unset;
	  }
	
	#form_datasource > a {
		text-decoration: none;
		color: #666;
      }
*/


/* bottom attribution  */

	.bottom-attribution {
		background-color: #fff;
		}
	.bottom-attribution:hover {
		background-color: #fff;
		}	
	.bottom-attribution .legend , .bottom-attribution .legend-realtime {
		display: none;
		} 	
	.bottom-attribution ul {
		display: flex;
		gap: unset;
		}		
	.bottom-attribution ul li {
		display: flex;
		align-items: center;
		}
	.bottom-attribution ul li a {
		padding-right: 8px;
		display: flex;
		align-items: center;
		}

		
/* modify for attribution enlargement */		
		
		
		/* Modify other element for attribution enlargement +17px 	
		@media screen and (max-width: 649px) {
		}*/				
		
		/* Modify other element for attribution enlargement +23px */	
		@media screen and (max-width: 1000px) {
			.ol-control.ol-overview	{
			bottom: 106px;
			}
			.ol-scale-line {
			bottom: 83px;
			}
			.ol-viewport .ol-scale {
			bottom: 60px;
			}			
			.mouseposition {
			bottom: 39px;
			}
			.mousePositionDefault {
			bottom: 39px;
			}			
			#ol-street-view--pegman-button-div {
			bottom: 31px;
			}
			
			#form_opengis{
			bottom: 41px;
			}
			/* 
			.ol-control.ol-layerswitcher.ol-forceopen {
			max-height: calc(100% - 135px);
			}
			 */ 
		}

		
/* spatial query */

		.spatial-query{
		left: 59px;
		top: 322px;
		}
		.spatial-query.ol-active > button {
		background-color: rgba(251, 214, 105);
		}
		.ol-touch .spatial-query {
		display: none;
		}
		
		#spatial-query-menu {
		  display:none;
		  position: absolute;
		  top: 112px;
		  left: 91px;
		  background-color: white;
		  padding: 10px;
		  z-index: 2;
		  width: 270px;
		  border: 1px solid rgba(0,60,136,1);
		  font-size: 12px!important;
		  border-radius: 5px;
		}

		.spatial-query-title{
		  margin: unset;
		  padding-bottom: 5px;
		  text-align: center;
		}

		.spatial-written {
		  padding: 5px;
		}

		#layer-combo-spatial {
		  border-radius: 5px;
		  margin-top: 5px;
		  margin-left: 5px;
		  font-size: 12px;
		}
		#layer-combo-spatial option {
		  background-color: white;
		}

		#layer-combo-spatial option:disabled {
		  background-color: #f2f2f2;
		}

		#query-layers-container{
		 margin-top: 8px;
		 margin-bottom: 10px;
		 margin-left: 10px;
		}

		.query-layer {
		  margin: 2px;
		  margin-right: 4px;
		  padding: 2px;
		  border: 1px solid #ccc;
		  display: inline-block;
		  position: relative;
		  color: darkblue;
		  font-size: 12px;
		}

		.remove-query-layer {
		  position: relative;
		  top: 0;
		  right: 0;
		  cursor: pointer;
		  color: red;
		}

		#spatial-intersection-operator{
		  border-radius: 5px;
		  margin-top: 5px;
		  margin-bottom: 12px;
		  margin-left: 5px;
		  font-size: 12px;
		}

		#spatial-intersection-operator option{
		  background-color: white;
		}

		#spatial-choice{
		  margin-top: 5px;
		}

		#spatial-choice-all-button{
		  display: flex;
		  justify-content: space-between;
		  bottom: -2px;
		  position: relative;
		}
		.spatial-choice-button {
		  background-color: #fff;
		  border: 1px solid #2196F3;
		  border-bottom: 2px solid #2196F3;
		  border-top-left-radius: 5px;
		  border-top-right-radius: 5px;
		  font-size: 12px;
		}

		.spatial-choice-button.active {
		  border: 2px solid #2196F3;
		  border-bottom: 0px solid white;
		}

		.spatial-choice-button:hover{
		  background-color: #ddd;
		}

		#spatial-choice-all-type {
		 border: 2px solid #2196F3;
		 padding: 5px;
		 background-color: white;
		}

		.spatial-clear-all-button{
		  border-radius: 5px;
		  background-color: salmon;
		  display: none;
		  margin-top: 10px;
		  font-size: 12px;
		  border: 1px solid;
		}

		.spatial-clear-all-button:hover{
		  background-color: #ddd;
		}

		.spatial-ok-button{
		  float: right;
		  margin-top: 10px;
		  border-radius: 5px;
		  background-color: lightblue;
		  display: none;
		  font-size: 12px;
		  border: 1px solid;
		}

		.spatial-ok-button:hover{
		  background-color: #ddd;
		}

		#spatial-buffer {
		  display:none;
		}

		#spatial-buffer-input{
		  border-radius: 5px;
		  width: 35px;
		  margin-top: 10px;
		  border: 1px solid;
		}

		.spatial-apply-buffer-button {
			border-radius: 5px;
			background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAiZJREFUSEud1UurzlEUBvDfcUlIQnIthQyUkRRJyndQZKCkFJF8AJyh3O+XIcrE0IQJMXApSZGJSwl1YkTK5bg92rv+vee9nPfsOp3e/977eZ611rPWHjD2NYCFWIfX+IGPeIc/FTaHxrImYgoOYxjXsAp7cKF8/xXgsRDMwUmcwgP8biicjPFYUaIa6pcgqk/gFY4W9a0ZmIBBJILBfgjmYibe4lsH8Eq2HDtxYLQEC3Aaj4rynw3ZUbwVi3EQdS/YA6MhSE5zeS2utiiv4NuxDS8KcWpxHFd6EUR58pm8P2tJdifwHJuO84m2G0HyfQ5P2hS0G3gIsr8kPdGJYDbi9c9tCtoLPFHvLjb+0I4gB87ibklN0+e9wGfhUsMMw+0I1mBl6ch0aV29wGcU78/Hy2qGJkGU78URDPVR0BytUd/GmUL0H6ISjAitD+XjsAXzcKy1AStB/mfGfBqlzyt/ujvgGXBf203NAC/C/vL3vg/lEXQRD4vy750I0qE7sAtfyqFeBZ1WpuhSPO82l2oEUfO4FCffNhcvN9u/CqzKr5fR0fU9CVjURskbJMx821B+56VqrhQ0TpvULS3NCwGLfzM3MhbSXJ3WsvI8Xi6RNhuw46Xqok0IwKESReuFpCUi7pcp2WzAnimq/ZDwN5ZC3ym2m1qGVty1Gjd7PDQjyJqdHIL12IcbeIpbuFcK3lqPrsrrZqdpmkcmeylm2wYaFfq/Q38ByTyHqsHzV9UAAAAASUVORK5CYII=);
			background-position-x: 2px;
			background-position-y: -1px;
			background-repeat: no-repeat;
			background-size: 20px;
			width: 71px;
			text-align: right;
			padding-right: 3px;
			background-color: lightblue;
			font-size: 12px;
			border: 1px solid;
		}

		.spatial-apply-buffer-button:hover{
		  background-color: #ddd;
		}

		.spatial-remove-buffer-button {
			display: none;
			border-radius: 5px;
			background-color: #f8f8f8;
			border: 1px solid;
		}

		.spatial-remove-buffer-button:hover{
		  background-color: #ddd;
		}


	/* spatial shape */

		#graphic-form label {
		  margin-top: 6px;
		  float: left;
		  margin-right: 5px;
		}

		#spatial-shape-type {
		  border-radius: 5px;
		  position: relative;
		  margin-top: 5px;
		  margin-bottom: 5px;
		  font-size: 12px;
		}

		#graphic-radius {
		  display:none;
		}

		.graphic-radius-input {
		  border-radius: 5px;
		  width: 35px;
		  margin-top: 4px;
		  border: 1px solid;
		}

		.graphic-radius-apply-button {
		  border-radius: 5px;
		  background-color: lightblue;
		  font-size: 12px;
		  border: 1px solid;
		}

		.graphic-radius-apply-button:hover{
		  background-color: #ddd;
		}

		.graphic-radius-remove-button {
		  display:none;
		  border-radius: 5px;
		  background-color: #f8f8f8;
		  border: 1px solid;
		}

		/*
		.spatial-shape-drawing-button{
		  border-radius: 5px;
		  background-color: lightblue;
		}
		.spatial-shape-drawing-button:hover{
		  background-color: #ddd;
		}

		.spatial-shape-drawing-button-stop{
		  border-radius: 5px;
		  display: none;
		}
		.spatial-shape-drawing-button-stop:hover{
		  background-color: #ddd;
		}
		.spatial-shape-drawing-button-stop .fa-pencil:after {
		  position: relative;
		  content: " \005C";
		  color: red;
		  font-size: 14px;
		  left: -14px;
		  top: 1px;
		}
		*/


	/* spatial selection */
	
		#selection-on-map label {
		  margin-top: 6px;
		  float: left;
		  margin-bottom: 4px;
		}

		#spatial-selection-layer-combo {
		  margin-top: 5px;
		  margin-bottom: 5px;
		  border-radius: 5px;
		  font-size: 12px;
		}

		#spatial-selection-layer-visibility-button {
		  background-color: #f8f8f8;
		  border-radius: 5px;
		  margin-left: 5px;
		  border: 1px solid;
		}
		#spatial-selection-layer-visibility-button:hover {
		  background-color: #ddd;
		}
		#spatial-selection-layer-visibility-button.active {
		  background-color: rgba(251, 214, 105);
		}
		/*
		#spatial-selection-multi-selection-button {
		  margin-top: 5px;
		  margin-bottom: 5px;
		  border-radius: 5px;
		  background-color: lightblue;
		}
		#spatial-selection-multi-selection-button:hover {
		  background-color: #ddd;
		}
		#spatial-selection-multi-selection-button-stop {
		  margin-top: 5px;
		  margin-bottom: 5px;
		  border-radius: 5px;
		  display:none;
		}
		#spatial-selection-multi-selection-button-stop:hover {
		  background-color: #ddd;
		}
		#spatial-selection-multi-selection-button-stop .fa-hand-pointer:after {
		  position: relative;
		  content: "/";
		  color: red;
		  font-size: 14px;
		  left: -9px;
		  top: 1px;
		}
		*/

	/* spatial parcels */

		#cadastral-parcels {
		  position: relative;
		}

		#spatial-parcels-set-layer-to-query-button {
		  margin-top: 5px;
		  margin-bottom: 5px;
		  border-radius: 5px;
		  font-size: 12px;
		  border: 1px solid;
		}
		#spatial-parcels-set-layer-to-query-button:hover {
		  background-color: #ddd;
		}

		#spatial-parcels-layer-on-button {
		  margin-top: 5px;
		  margin-bottom: 5px;
		  border-radius: 5px;
		  background-color: rgba(251, 214, 105);
		  font-size: 12px;
		  border: 1px solid;
		}
		#spatial-parcels-layer-on-button:hover {
		  background-color: #ddd;
		}

		#spatial-parcels-layer-off-button {
		  margin-top: 5px;
		  margin-bottom: 5px;
		  border-radius: 5px;
		  border: 1px solid;
		  font-size: 12px;
		}
		#spatial-parcels-layer-off-button:hover {
		  background-color: #ddd;
		}

		/*
		#spatial-parcels-multi-selection-button {
		  border-radius: 5px;
		  background-color: lightblue;
		  margin-top: 10px;
		  margin-left: 15px;
		}
		#spatial-parcels-multi-selection-button:hover {
		  background-color: #ddd;
		}
		#spatial-parcels-multi-selection-button-stop {
		  border-radius: 5px;
		  margin-top: 10px;
		  margin-left: 15px;
		  display:none;
		}
		#spatial-parcels-multi-selection-button-stop:hover {
		  background-color: #ddd;
		}
		#spatial-parcels-multi-selection-button-stop .fa-hand-pointer:after {
		  position: relative;
		  content: "/";
		  color: red;
		  font-size: 14px;
		  left: -9px;
		  top: 1px;
		}
		*/
		#spatial-parcels-on-section > label {
		  margin-top: 7px;
		  left: 20px;
		  position: absolute;
		}

		#cadastral-parcels #search-container {
		  margin-top: 10px;
		  margin-left: 13px;
		}

		#cadastral-parcels .ol-search {
		  top: unset!important;
		  left: unset!important;
		  position: relative;
		  min-height: 25px;
		}

		#cadastral-parcels .ol-search button {
		  border-radius: 5px;
		  background-color: lightblue;
		  border: 1px solid;
		}
		#cadastral-parcels .ol-search button:before {
		  border: 2px solid currentColor;
		  top: 6px;
		  left: 6px;
		  width: 10px;
		  height: 10px;
		}
		#cadastral-parcels .ol-search button:after {
		  left: 14px;
		  width: 5px;
		}
		#cadastral-parcels .ol-search > button:hover {
		  background-color: #ddd!important;
		}

		#cadastral-parcels .ol-search input {
		  display: unset!important;
		}

		#cadastral-parcels .ol-search ul {
		 background: #f8f8f8;
		 height: 150px;
		}

		#search-result-container{
		 margin-top: 10px;
		}

		.spatial-cdu-search-selected-item {
		  margin: 2px;
		  margin-right: 4px;
		  padding: 2px;
		  border: 1px solid #ccc;
		  display: inline-block;
		  position: relative;
		  color: darkblue;
		  background-color: buttonface;
		}

		.spatial-cdu-search-remove-item {
		  position: relative;
		  top: 0;
		  right: 0;
		  cursor: pointer;
		  color: red;
		}



	/* spatial query table */

		#spatial-query-table-container {
		  position: fixed;
		  z-index: 1;
		  bottom: 0px;
		  height: 30%;
		  width: 100%;
		  display: none;
		  overflow: auto;
		  border-top: 1px solid #999;
		  background: lightgray;
		}
		
		/* modifica posizione menù spatial query se lo schermo ha altezza sotto i 850px */
		@media screen and (max-height: 850px) {
			#spatial-query-table-container:not([style*="display: none"]) + #spatial-query-menu {
			  top: unset;
			  bottom: 10px;
			}
		}

		#spatial-query-table-additional-header{
		  background-color: rgb(7,89,141);
		  padding: 2px;
		  position: relative;
			height: 20px;
		}
		  
		.spatial-query-table {
		  position: relative;
		  z-index: 1;
		  bottom: 0px;
		  width: calc(100% - 2px);
		  background-color: #888;
		  border-top: 1px solid #999;
		  border-bottom: 1px solid #999;
		}

		#clear-selected-row-spatial {
			background-color: #f8f8f8;
			border-radius: 5px;
			position: relative;
			float: right;
			margin-right: 5px;
		}
		#clear-selected-row-spatial:hover {
		  border-radius: 5px;
		  background-color: #ddd;
		}

		#spatial-table-button-xlsx-all {
		  border-radius: 5px;
		  background-color: #f8f8f8;
		  float:right;
		  margin-right: 5px;
		}
		#spatial-table-button-xlsx-all:hover {
		  border-radius: 5px;
		  background-color: #ddd;
		}

		#spatial-print-button{
		  border-radius: 5px;
		  background-color: #f8f8f8;
		  float:right;
		  margin-right: 5px;
		}
		#spatial-print-button:hover {
		  border-radius: 5px;
		  background-color: #ddd;
		}
		.spatial-print-overlay{
		  position: absolute;
		  z-index: 2;
		  display: none;
		}
		.spatial-print-menu {
		  position: absolute;
		  bottom: 0px;
		  right:0px;
		  background-color: #f8f8f8;
		  padding: 5px;
		  width: 200px;
		  border: 1px solid #999;
		  text-align: center;
		}
		.spatial-print-close-button{
		  float:right;
		  border-radius: 5px;
		  background-color: #f8f8f8;
		}
		.spatial-print-label-one {
		  position: relative;
		  display: block;
		  text-align: justify;
		  margin-top: 10px;
		}
		.spatial-print-label-two {
		  position: relative;
		  display: block;
		  text-align: justify;
		}
		#uploadButton {
			padding: 10px 20px;
			background-color: #007BFF;
			color: #fff;
			border: none;
			cursor: pointer;
		}
		#fileName {
			margin-top: 10px;
			font-weight: bold;
			margin-bottom: 10px;
		}
		#download-from-flying-model-button {
			padding: 10px 20px;
			background-color: #007BFF;
			color: #fff;
			border: none;
			cursor: pointer;
		}
		#download-from-flying-model-button:disabled {
		  background-color: #ccc;
		  color: #666;
		  cursor: not-allowed;
		}
		#download-from-default-model-button{
			padding: 10px 20px;
			background-color: forestgreen;
			color: #fff;
			border: none;
			cursor: pointer;
			margin-top: 5px;
		}


		#close-table-spatial {
		  border-radius: 5px;
		  background-color: #f8f8f8;
		  float: right;
		  margin-right: 5px;
		}
		#close-table-spatial:hover {
		  border-radius: 5px;
		  background-color: #ddd;
		}