/*************************************/
/* MicroImages Google Maps Geomashup */
/*************************************/

/* default css variables, override them in .htm file :root style*/  
html{
  --unseen-opacity: 0.6;
}

/* REMOVE */
* { box-sizing: border-box; }
html, body { height:100%;width:100%;margin:0px;padding:0px; }

/******************/
/* CONTROLS   */
/******************/
#poweredbybar { }
#basemapinfo { }
.infoControl {vertical-align:top; background-color:rgb(245, 245, 245); color:rgb:(68,68,68); opacity:.7;}
.infoControl img { vertical-align: middle; display: inline-block; height:18px; width:18px}
.infoControl p { height: auto; vertical-align: middle; display: inline-block; margin:0; padding: 0 3px 0 3px } 

.customControl {vertical-align:top; background-color:rgb(245, 245, 245); color:rgb:(68,68,68); opacity:.7;}
.customControl img { vertical-align: middle; display: inline-block; height:18px; width:18px}
.customControl p { height: auto; vertical-align: middle; display: inline-block; margin:0; padding: 0 3px 0 3px } 

/* Zoom Box control*/
.zoomBox {margin:5px}

/* Opacity Slider control*/
#opacityDiv { margin:15px 0 0 40px; width:115px; height:10px;  background-color:rgb(67,50,100);}
.ui-slider { background-color:rgb(100,0,0); opacity:1;}
.ui-slider .ui-slider-handle { cursor:default; position:absolute; z-index:2;}

/* Basemap Selection control - overrides GM style */
/* .gm-style-mtc {
  top: 100px !important; 
  right:-35px !important; 
  display:none;
  width:85px !important;
  font-size: 1em !important;
}  */

#basemapDiv{
  top: 120px !important;   /* adjust to set vertical position of basemap pullout menu button */
  right:-25px !important; 
  width:85px !important;
  font-size: 1.25em !important;
}

#basemapButton{
  display:block;
  transform: rotate(270deg); 
  font-size: 1em !important;
  font-family: Roboto, Arial, sans-serif;
  font-weight:bold;
  z-index:1 !important;
  padding-left: 8px !important;
  padding-right: 4px !important; 
  border: 1px solid #000;
}

#basemapMenu {
  display:none;
  position:absolute !important; 
  top:-30px !important; 
  right:20px;

  opacity:1 !important; 
  z-index:99 !important;
  background:#F9F9F9;
}
  /* width:100px !important;  */
#basemapMenu,
#basemapMenu:link,
#basemapMenu:visited,
#basemapMenu:hover,
#basemapMenu:active {
	border: 1px solid #000;
}
  
button {
  display:block;
}

button ul.dropdownMenu {  
  display:block;
  min-width: 100%; /* width of the dropdown-menu*/
  background: #f2f2f2;
  opacity:1;
  z-index:0;
}

div.basemap-menu p{
transform: rotate(-90deg); 
}
div.basemap-menu div{
  font-size: 1.25em !important; 
}  

#baselayerList {
  font-size: .875em !important; 
}

/*********************/
/* Legend control    */
/*********************/
#legendDiv {
  white-space:nowrap;
  padding-top:4px;
  padding-left:8px;
  font-family:Verdana,Helvetica,sans-serif;
  font-size:12px;
  vertical-align:middle;
  margin:15px 0 0 0;
  height:80%;
  overflow:auto;
}

a { border:none; padding:3px; color:black; text-decoration:none; }
a:hover { color:blue; }

.inMap { opacity:1.0 }
.outMap { opacity: var(--unseen-opacity); }
.outMapZoom { opacity: var(--unseen-opacity); }
.outMapExtents { opacity: var(--unseen-opacity); }
.overlapMapExtents { opacity:  var(--unseen-opacity); }
.checkOff { opacity: var(--unseen-opacity); }
.hidden { opacity: var(--unseen-opacity); }
.layerOff { opacity:0 var(--unseen-opacity); }
.parentOff { opacity: var(--unseen-opacity); }
.childOff { opacity: var(--unseen-opacity); }
.selected { color:white; background-color:#AAA;}
$(document).tooltip();
.hovertip { display:none; position:absolute; border:1px solid #333; background-color:#161616; border-radius:5px; padding:10px; color:#fff; font-size:12px Arial; }
.htNotOnMap {color:red; font-size:.75em; font-style:italic; }
.htSelected {color:green; font-size:.75em; font-style:italic; }
.tntLayer { cursor:pointer; }
.hovered { background-color:#c3d8ff }
.blue {border:none;  }

/* Layer rows in sidebar legend */  
.sidebar li { list-style:none; margin:0px;padding:0px;text-align:left }
.sidebar ul { margin-left:4px; padding:0px; margin-top:0px; margin-bottom:0px }
.sidebar ul ul, div.sidebar ul li { margin-left:8px; padding:0px; }
.sidebar ul li { font-size:11px; }
.sidebar ul li ul li { font-size:10px; }
.sidebar ul li ul li ul li { font-size:9px; }
.sidebar ul li ul li ul li ul li { font-size:8px; }  

/* Layer rows in sidebar legend - menu icon, click to open menu */
ul.menuicon { 
  display:inline-block; 
  position:relative;
  z-index:10;      
}
ul.menuicon li { z-index:0; }   
ul.menuicon li a { z-index:0; } /* 9900 */ 
.layerControl { padding-right:10px; }  /* menu icon fiddle */ 
ul li.dropdown{
  position:absolute;
  left: -15px;  /* menu icon fiddle */ 
  top: -10px;
}
ul li.dropdown{
  position:absolute;
  z-index:-1;
}
div.sidebar ul li.dropdown{  
  margin-left:0px;  /* menu icon margin */
  margin-right:0px;  /* menu icon margin */
}
div.sidebar ul li a {  
  padding-left:0px;  /* menu icon margin */      
  padding-right:0px;  /* menu icon margin */    
}
ul li ul.dropdown-menu {  
  display:none;
  min-width: 100%; /* width of the dropdown-menu*/
  background: #f2f2f2;
  opacity:1;
  z-index:0;
}
ul li ul li ul.dropdown-menu {  
  display:none;
  min-width: 100%; /* width of the dropdown-menu*/
  background: #002f2;
  opacity:1;
  z-index:0;
}    
a.menuitem  { font-size:11px; }


/********************/
/* Search control   */
/********************/
/* Search control in sidebar */
#sidebarTopDiv { white-space: nowrap; }
#sidebarBottomDiv { white-space: nowrap; }
#searchDiv { margin: 0; padding:15px 0 0 15px; font-family:Arial, Verdana, Helvetic, no-serif; background-color:none; }
#searchNumFound {font-size: .75em; font-style: italic}
#notSearchable {color:red;}
/* Search window */
#searchWindow{ font-size: .75em; font-family:Arial, Verdana, Helvetic, no-serif; width:300px; }
#searchResultSnippets { overflow:auto;}
#searchByDiv fieldset {display: inline-block; border: 0; padding-inline-start:0; margin-left:0; width:250px;border-style:none;}
#searchByDiv span.ui-selectmenu-button.ui-button { width: 7em;}
#searchByDiv span.ui-selectmenu-text {	margin-right: 10px;}
.ui-menu-item{ font-size:.75em; }
#searchByDiv label {display: inline-block; margin: 0 0 0 0;}
#searchTypeOption {font-size: .75em;}
#searchInput , #searchResultSnippets  { font-size:12px; font-family:Arial, Verdana, Helvetic, no-serif; vertical-align:top }
#fieldOptions{ font-size: 11px; font-family:Arial, Verdana, Helvetic, no-serif; }
/* Search tool's info icon, snippet has searched for text in red */
.foundText { color:red }  
.notFoundText { color:blue }  


#queryActionPane {
   display:none; 
   /*display:inline-block;*/
   /*display:none; */
}
#rulePane {display:inline-block;}

#searchForm , #searchRuleDiv, #fieldOptionsDiv, #searchTextToFind, #searchResultSnippets , .leftDiv, .rightDiv {
  width:270px;
}
#searchFormSimple {
  margin:2px; 
}

#searchFormSimple span img {vertical-align: text-bottom;}

#searchTextArea { width:270px; height: 100px;margin-top:10px}
#fieldOptions {width:220px;}

div.centerDiv{
  display:inline-block;
  text-align:center;
  width:90%;
  margin:auto;
}
div.rightDiv { text-align:right; }

#rulesoperatorid { display:none;}
.hideDiv {display:none}
.leftDiv {
  display:block;
  align:left;
  float:left;
  text-align:left;
  font-size: 11px; font-family:Arial, Verdana, Helvetic, no-serif;
  margin:.375em 0;
}
#addRule { font-size: 11px; }

img.hand { cursor:pointer;cursor:hand }



/* TO DO: Delete - not needed */
/****************************/
/* GOOGLE MAP CONTROLS      */
/****************************/

.gm-style .controls {
  /* font-size: 28px;  this adjusts the size of all the controls */
  font-size: 15px;  /* this adjusts the size of all the controls */
  background-color: white;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
  box-sizing: border-box;
  border-radius: 2px;
  cursor: pointer;
  font-weight: 300;
  height: 1em;
  margin: 6px;
  text-align: center;
  user-select: none;
  padding: 2px;
  width: 1em;
}
.gm-style .controls button {
  border: 0;
  background-color: white;
  color: rgba(0, 0, 0, 0.6);
}
.gm-style .controls button:hover {
  color: rgba(0, 0, 0, 0.9);
}

.gm-style .controls.zoom-control {
  display: flex;
  flex-direction: column;
  height: auto;
}
.gm-style .controls.zoom-control button {
  font: 0.85em Arial;
  margin: 1px;
  padding: 0;
}

.gm-style .controls.maptype-control {
  display: flex;
  flex-direction: row;
  width: auto;
}
.gm-style .controls.maptype-control button {
  display: inline-block;
  font-size: 0.5em;
  margin: 0 1px;
  padding: 0 6px;
}
.gm-style .controls.maptype-control.maptype-control-is-map .maptype-control-map     {
  font-weight: 700;
}
.gm-style .controls.maptype-control.maptype-control-is-satellite .maptype-control-satellite {
  font-weight: 700;
}

.gm-style .controls.fullscreen-control button {
  display: block;
  font-size: 1em;
  height: 100%;
  width: 100%
}
.gm-style .controls.fullscreen-control .fullscreen-control-icon {
  border-style: solid;
  height: 0.25em;
  position:absolute;
  width: 0.25em;
}
.gm-style .controls.fullscreen-control .fullscreen-control-icon.fullscreen-    control-top-left {
  border-width: 2px 0 0 2px;
  left: 0.1em;
  top: 0.1em;
}
.gm-style .controls.fullscreen-control.is-fullscreen .fullscreen-control-icon.fullscreen-control-top-left {
  border-width: 0 2px 2px 0;
}
.gm-style .controls.fullscreen-control .fullscreen-control-icon.fullscreen-control-top-right {
  border-width: 2px 2px 0 0;
  right: 0.1em;
  top: 0.1em;
}
.gm-style .controls.fullscreen-control.is-fullscreen .fullscreen-control-icon.fullscreen-control-top-right {
  border-width: 0 0 2px 2px;
}
.gm-style .controls.fullscreen-control .fullscreen-control-icon.fullscreen-control-bottom-left {
  border-width: 0 0 2px 2px;
  left: 0.1em;
  bottom: 0.1em;
}
.gm-style .controls.fullscreen-control.is-fullscreen .fullscreen-control-icon.fullscreen-control-bottom-left {
  border-width: 2px 2px 0 0;
}
.gm-style .controls.fullscreen-control .fullscreen-control-icon.fullscreen-control-bottom-right {
  border-width: 0 2px 2px 0;
  right: 0.1em;
  bottom: 0.1em;
}
.gm-style .controls.fullscreen-control.is-fullscreen .fullscreen-control-icon.fullscreen-control-bottom-right {
  border-width: 2px 0 0 2px;
}