/* =====  DOM elrements ===== */	


	input[type="text"]{
		width:6rem;
	}
	
	button{
		padding-top:0.2rem; padding-bottom:0.4rem;
	}
	
	select{
		width:6rem;
	}
	
	::placeholder {
		color:silver;
	}
	

/* =====  the top user control panel ===== */

	.unselectable {
	   -moz-user-select: -moz-none;
	   -khtml-user-select: none;
	   -webkit-user-select: none;
	   -ms-user-select: none;
	   user-select: none;
	}

	.dash{
		height:8.3rem;
		white-space:nowrap;
		padding-left:1.5rem;
		padding-top:1rem;
		padding-bottom:0;
		color:black;
		background-color:rgba(57, 0, 0, 0.16);
	}
	
	#advanced_search_form{
		white-space:nowrap;
		padding-left:1.5rem;
		padding-bottom:1rem;
		color:black;
		background-color:rgba(57, 0, 0, 0.16);
		border-bottom:1px solid silver;	
	}
	
	.adv_add{
		cursor: default;
		color: black;
	}
	
	.adv_add:hover{
		color:green;
	}
	
	#user_options{
		/* width:100vw; */
		margin:0.5rem;
		padding:0.5rem;
		color:white;
		background-color: #717171;
	}
	
	#user_options_closer{
		cursor:pointer;
		color:lime;
	}
	
	#user_options_closer:hover{
		color:red;
	}
	

/* =====  drop down callsign lists ===== */

	.menu_table{
		padding: 0.2rem;
		background-color: white;
		border: 0.1rem solid silver;
		cursor: default;
	}
	
	.menu_table td:nth-child(2){
		color:red;  /* #eea1a7 */
	}
	
	.menu_table td:hover{
		background-color:#efefef;
	}
	
	.menu_arrow{
		cursor:default;
		height:1rem;
		width:auto;
		padding-left:0.3rem;
		padding-right:0.5rem;
		vertical-align:middle;
	}
	
	.menu_arrow:hover{

	}
	
/* =====  the spots table ===== */

	.default_table{  /*assigned by table-object*/
		width: auto;
		min-width:72rem;
		border-collapse: separate;
		border-spacing: 1.5rem .02rem;  /* horizontal vertical */
	}

	.spots_table_caption{
		text-align:left;
		margin-left:1.5rem;
		margin-bottom:1rem;
	}
		
	.spots_table_row:hover{
		outline: 1px solid brown;
	}
	
	.spots_header_cell{
		width:auto;
		color:green;
		padding-top:0.5rem;
		padding-bottom:0.5rem;
		cursor:pointer;
		text-align:left;
	}
	
	.spots_header_cell:hover{
		background-color:#e7e7e7;
	}
	
	.spots_table_cells{
		padding-left:0; white-space: nowrap;
	}
	

	.cCall{padding-left:0;} /* used as identification for search inside table */
	
	#marker_spots{
		overflow-x: auto; margin-left:0.5rem; padding-bottom:0.5rem;
	}


/* =====  map elements ===== */	

	.marker_spot_label:first-child{
		background-color: #9d9d9d;
		color:white;
		font-family:verdana, tahoma, sans-serif;
		font-weight:bold;
		text-align:center;
	}
	
	.long_path_link{
		color:#b96400; padding-bottom:0.2rem;
	}
	
	.long_path_link:hover{
		color:blue;
	}
	
	.thin_hr{
		padding: 0; border: 0; height: 0; border-top: 0.1rem solid rgba(0, 0, 0, 0.1);
	}
	
	

/* =====  custom map controls ===== */	
	
	#customMapControls{

	}
	
	.slider{
		vertical-align: middle; width:20rem;
	}


/* =====  the map legend ===== */

	#spot_legend{
		font-size:0.8em;
		background-color:gainsboro;
		text-align: left;
		width:auto;
		position:absolute;
		bottom:1rem; left:1rem;
	}
	
	.legend_body{
		 display:block; border-top:0.1rem solid silver; padding:0.5rem; padding-top:0.3rem;
	}
	
	.legend_line_col1{
		width:6.5rem; display:inline-block; text-align:left; padding-left:0.3rem; 
	}
	
	.legend_line_col3{
		width:auto; margin-left:0.1rem; display:inline-block; text-align:right; padding-right:0.5rem;
	}
	
	.legend_line_call{
		min-width:5.5rem;
		/* border-right: 1px black solid;  testing width */
		margin-left:0.5rem;
		display:inline-block;
		white-space: nowrap;
		cursor:pointer;
	}
	
	.legend_line_call:hover{
		background-color:white;
	}
	
	.legend_footer{
		background-color:#dcdcdc;
		text-align:center;
		padding:0.5rem;
		color:red;
		cursor: pointer;
	}
	
	#band_count_rollover:hover{
		background-color: white;
	}


/* =====  charts =====  */	

	.chart_div{
		width:100%; height:auto; margin-top:1rem;
	}
	
	.chart_link{
		color:green; cursor:pointer;
	}
	
	.chart_link:hover{
		color:orange;
	}
	
	.vbars_div{
		width:calc(50vw - 0.5rem); white-space: nowrap;
	}
	
	.vbar{    /* distribution vertical bar chart */
		display:inline-block;
		height:10px;  /*2rem */
		/* width:0.36rem; */
		width:1%;
		background-color:silver; /* #c7e0b7; */
		opacity: 1;
	}
	
	.vbar:hover{
		opacity: 0.4;
	}

	/* compass */
	
	#svg{
		max-width:85rem;
		max-height:85rem;
	}
	
	.call_text{
		text-transform: uppercase;
		fill: #5E5BFF;
		font-size: 1.5rem;
		font-weight: bold;
		font-family: Helvetica,Verdana,sans-serif;
	}
	
	.bearing_text{
		fill: silver;
		stroke: none;
		font-size: 1.5rem;
		font-family: Helvetica,Verdana,sans-serif;
	}
	
	.rings_text{
		fill: grey;
		stroke: none;
		font-size: 1rem;
		font-family: Helvetica,sans-serif,Verdana;
	}
	
	.outer_focus:hover{
		opacity:0.2;
	}
	
	.dot_grad{
		
	}

/* ===== navigation tabs ===== */

	.tab {
		cursor:default;
		display:inline-block;
		width:6rem;
		font-size:1.2rem;
		/*
		background-color:white;
		border-top-left-radius:0.8rem;
		border-top-right-radius:0.8rem;
		border:0.1rem solid silver;
		border-bottom-color:silver;
		padding-top:0.2rem;
		padding-bottom:0.2rem;
		*/
		border-right:1px solid silver;
		text-align:center;
		vertical-align: top;
		color:#b9b9b9;
	}
	
/* ====== info page ===== */

	.infoSections{
		font-weight:bold;
	}

	.infoHead{
		color:#006900;
		cursor:default;
		margin-top:0.7rem;
		margin-bottom:0.4rem;
	}
	
	.infoHead:hover{
		color: red;
	}
		
	.infoPara{
		margin-left:1rem;
		line-height:150%;
		margin-bottom:2rem;
	}
	
/* ====== stats ===== */

	.spotLineTitle{
		display: inline-block;
		margin-top:1rem;
		color:brown;
	}

	.spotLine{
		display: inline-block;
		font-size:smaller;
		margin-left: 2rem;
		margin-top:0.4rem;
		color:dimgrey;
		cursor:default;
	}
	
	.spotLine:hover{
		color:blue;
	}
	
	.spotDetailTD{
		color:green;
		text-align:right;
		padding-right:1rem;
	}
	
	 /* callsign */
	#stats_user_table tr td:nth-child(2) { 
    	width: 11rem;
    	text-align: center;
    	color:black;
    	cursor:pointer;
	}
	
	#stats_user_table tr td:nth-child(2):hover{
		color:red;
	}
	
	   /* radio button */
	#stats_user_table tr td:nth-child(1) {
		width: 10rem;
    	text-align: center;
	}

/* ====== mxtra infowin  ===== */

	.xtra{
		color:brown; cursor:default;
	}
	
	.xtra:hover{
		color:blue;
	}