html, body { 
	height: 100%; 
	width: 100%;
	margin: 0; 
	padding: 0; 
	font-family: 'Lato', sans-serif;
 	overflow: hidden; /* ALLOWS TO CUT OFF PARTS OF MAP THAT WON'T OTHERWISE FIT*/
}

body {
	display: table;
	width: 100%;
}

#thenavbar {
	z-index: 1;
	/*position: relative;*/
	/*display: table-row;*/
}

#themap { 
	width: 100%; 
	height: 100%; 
	display: table-row;
	z-index: 0;
	  /* THE FOLLOWING ALLOWS TO SHIFT THE MAP DOWN FOR CHROME AS WELL */
	  position:absolute;
	  border-top:50px solid #fff;
	  top:0px; 
	/*position: relative;*/
}


/* box-shadow: [horizontal offset] [vertical offset] [blur radius] [optional spread radius] [color] */
.defaultshadow {
  -webkit-box-shadow: 4px 6px 6px 6px rgba(0, 0, 0, 0.4);  /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
  -moz-box-shadow:    4px 6px 6px 6px rgba(0, 0, 0, 0.4);  /* Firefox 3.5 - 3.6 */
  box-shadow:         4px 6px 6px 6px rgba(0, 0, 0, 0.4);  /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
}

#geocodebox1, #datasetsKeysTable, #aboutUsPanel {
	display: block;
	/*background: #1E2460;*/
	/*border: 1px solid #999;*/
	/*border-radius: 3px;*/
	height: auto;
	width: auto;
	padding: 5px 5px 10px 5px;

	font-size: 1.0em;
	text-align: left;
	color: #FFFFFF;
	text-transform: uppercase;
		
	position: absolute;
	top: 50px;
	left: 25%;

	z-index: 5;
	text-align : center;

}

/* Initially hidden */
#datasetsKeysTable, #aboutUsPanel
{
	display:none;
	border-radius: 3px;
	padding: 2px;
	margin: 1px;

	font-size: 0.85rem;

	/* scrollable */
	max-height: calc(99vh - 150px);
    overflow-y: auto;

}

/* Initially hidden */
.datasetskeyitem
{
	/*font-size: 0.7rem;*/
	text-transform : lowercase;
}

#geocodeSubmit, #textSearchSubmit{
	text-transform: uppercase;
}

#geocodeAddress1 {
	/*margin-bottom: 2px;  see jQuery (to use Bootstrap responsive margins */ 
	/*background:   # #1E2490;  see jquery specs for this */
	color: #FFFFFF;
	text-align : left;
}
#geocodeResults1 {
	/*margin-top: 4px;*/
	/*background: #1E2490; see jquery specs for this */
	color: #FFFFFF;
	text-align : center;
}

/*the following obsoleted by the use of btn-outline-info */
#geocodebox1 .btn.btn-default:hover {
  color: #fff;
  background-color: #5cb85c;
  border-color: #5cb85c;
  outline: none;
  box-shadow: none;
}



.custom-popup, .my-tooltip
{
  -webkit-box-shadow: 4px 6px 6px 6px rgba(0, 0, 0, 0.4);  /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
  -moz-box-shadow:    4px 6px 6px 6px rgba(0, 0, 0, 0.4);  /* Firefox 3.5 - 3.6 */
  box-shadow:         4px 6px 6px 6px rgba(0, 0, 0, 0.4);  /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */

}

.custom-popup > .leaflet-popup-content-wrapper , .custom-popup > .leaflet-popup-tip {
	/*radius: 6px;*/
    background: #515151;
    color: white;
}

.leaflet-popup-content a {
    color: yellow;
}


.my-tooltip
{
    background: #515151;
    color: white;
}

.leaflet-tooltip-left.my-tooltip::before {
  border-left-color: yellow;
}
.leaflet-tooltip-right.my-tooltip::before {
  border-right-color: yellow;
}

/* ////////////////// */
.textSearchResultClass {
 /*  display: flex;
   flex-wrap: nowrap; 
   justify-content: space-between;
   align-content: center;
*/
  overflow: hidden;
  text-overflow: ellipsis;
}

.toggablePopupDiv
{
	display: none;
}

.dropdown-menu{
    max-height: calc(99vh - 150px);
    overflow-y: auto;
}

.versionid {
	font-size: 0.8em;
}



/* change the color of active or hovered links */
/* NOTE: THE BACKGROUND FOR THE MENUS IS SET TO THE 
   navbar-dark PALETTE IN jquery.js because I can't find how
   to reference those colors here in css */
/* NOTE: CAN'T SEEM TO BE ABLE TO CHANGE THE COLOR OF THE MENU ITEM */

/*.navbar-custom .nav-item:hover .nav-link {*/
#navbarDropdownMapType:hover,
#navbarDropdownDataSet:hover,
#navbarDropdownTools:hover
{
    color: deepskyblue;
}

.navbar-custom .dropdown-item:hover,
.navbar-custom .dropdown-item:focus {
	background-image: none !important;
	background-color: dimgray;
    color: blue;
}
/*.navbar-custom  .dropdown-menu > li > a:hover, 
.navbar-custom  .dropdown-menu > li > a:focus
{
	background-image: none !important;
	background-color: darkgray;
	color: #222222;
}*/


/* /////////////////////////////////////////////// */

#pano {
	width: 300px;
	height: 200px;
}

#toggle-drawing {
	position : relative;
	
}

#my-notification-box {
	position: absolute;
	bottom: 5%;
	left : 5%;
	height : 20px;
	width: auto;
	
	background-color : #FFFFFF;
}

#floating-panel {
	position: absolute;
	bottom: 80px;
	right: 5%;
	z-index: 5;
	height:auto;
	background-color: #fff;
	padding: 5px;
	border: 1px solid #999;
	text-align: center;
	font-family: 'Roboto','sans-serif';
	line-height: 30px;
	padding-left: 10px;
	display: none;
}