 
@media screen and (max-width: 1030px) {
	#map_page_inner{padding: 98px 50px 52px 50px !important}
	#map_tabs_area_art_container{width:70% !important}
}

@media screen and (max-width: 800px) {
	#top_bar{
		box-shadow:0 1px 2px #888 !important;
		-moz-box-shadow: 0 1px 2px #888 !important;
		-webkit-box-shadow: 0 1px 2px #888 !important;
	}

	#map_tabs{padding-left: 17px !important}
	.maptablinks {
		min-width: 110px !important;
		font-size: 12px !important;
	}	

	#map_tabs_area{padding-left:20px !important}
	#map_tabs_area_art_container{width:70% !important}
	#TableCont{width:90% !important;padding:10px !important}
	#publictargets_div{width:90% !important;padding:10px !important}
	#info_container{right:29px !important;top:3px !important}
	.TableCont_set{padding-right:0px !important}
	.TableCont_set_button_area{width:46px !important;height:46px !important}
	.td_markers_icon{min-width: 26px !important}
	
	.dot_updates{
		font-size: 10px !important;
		left: 3px !important;
	}
	
	#ConnectToTarget_button{display:none !important}#add_target_button{display:none !important}#addMarkerFromFixedPosition_button{display:none !important}
	.TableCont_set_button_mobile{display:block !important}
	#new_target_details_div_mobile{width:60% !important}
	.td_markers_details{width:90% !important}
	
	#addFixedPosition_markerName_parentdiv{float:none !important}
	#addFixedPosition_markerName_labeldiv{display:inline-block !important}
	#fixedPos_freetextdiv{float:none !important;margin-top:12px !important}
	
	#addFixedPosition_locationText{display:block !important;margin-right:0px !important;margin-bottom: 10px !important;width:80% !important;}
	#latlon_tab_label_fixedPos:before{content: "Lat & lon" !important}
	/*.latlonarea_desktop{display:none !important}
	.latlonarea_mobile{display:block !important}*/
	.column_div{display:block !important;width:180px !important}
	.column_optional{display:none !important}
	
	/*.leaflet-popup{width:263px !important}*/
	.POI_popup_note{width:178px !important}
	.POI_popup_url{width:178px !important}
	
	#map_page_inner{padding: 57px 20px 25px 20px !important}
	/*#mapLabels_check_label{font-size:13px !important}*/
	
	#projo_top{margin-top: 69px !important}#reel_top{margin-top: 69px !important}	/* same value for both */
	#below_map_div{height:85px !important}

	#dialog_addPOI_details{padding-left:13px !important;padding-right:13px !important}
	#dialog_addPOI_first_column{width:95px !important}
	#tabsPOI{font-size: 14px !important}
	.POIicons_newPOI{width: 65px !important}

 /* 
 #NewTarget_sendbutton_mobile{min-height:42px;min-width:180px;font-size:18px}
 #NewTarget_cancelbutton_mobile{min-height:42px;min-width:180px;font-size:18px}
 #ConnectTarget_sendbutton_mobile{min-height:42px;min-width:180px;font-size:18px}
 #ConnectTarget_cancelbutton_mobile{min-height:42px;min-width:180px;font-size:18px}
 #addFixedPosition_CANCEL_Button{min-height:38px;min-width:150px;font-size:18px}


	#coordinates_label{font-size:19px}
	#collapse1{min-width:22px;}
	#dialog_AddMarkerFromFixedPosition{font-size:17px}
	
	#addFixedPosition_markerName{font-size:20px}
	.freeFields{font-size:19px}
	.error_messages{font-size:17px}
}
*/
}

@media screen and (max-width: 700px) {
	#map_page_inner{
		border-width:0px !important;
	}
}

@media screen and (max-width: 650px) {
	.tracking_objects_tables{width:98% !important}
	.span_target_name{padding-right:5px !important}
	.td_target_buttons_right{min-width:23px !important}
	.div_POIs{padding-left:0px !important; margin-top:0px !important; margin-bottom:6px !important}	
}

@media screen and (max-width: 600px) {
	#conversion_tab{display:none}#misc_tab{display:inline-block !important;min-width:40px !important}
}

@media screen and (max-width: 560px) {
	.accordion1{padding: 15px !important}
	.TableCont_set_button_mobile{height:44px !important}
	.accordion1_panel{padding-left: 2px !important}
	#new_target_details_div_mobile{width:80% !important}
	#maptabButton2{display:none}
}

@media screen and (max-width: 440px) {
	.span_POI_name{max-width:140px !important}
}

@media screen and (max-width: 399px) {
	#maptabButton_PT{display:none}
	.span_POI_name{max-width:100px !important}
}

@media screen and (orientation: landscape) and (max-height: 500px) and (min-width: 500px) {	/* making sure it's really landscape (caters for mobiles with keyboard displayed) */
	#top_bar{
		box-shadow:0 1px 2px #888 !important;
		-moz-box-shadow: 0 1px 2px #888 !important;
		-webkit-box-shadow: 0 1px 2px #888 !important;
	}
	#menu_img1{width:43px !important}#menu_img2{width:43px !important}#top-left-text_WTC{margin-right:53px !important}
	
	#map_tabs_area{padding-left:28px !important}
	#map_page{width:90% !important}
	#map_page_inner{padding: 51px 40px 10px 40px !important}	/* VALUES HAVE TO ALIGN TO media query #max-width 800 (in portrait, max-height 500 applies when entering a field to type) */
	/*#mapLabels_check_label{font-size:13px !important}*/
	
	.dot_updates{
		font-size: 10px !important;
		left: 3px !important;
	}
	
	#projo_top{margin-top: 60px !important}#reel_top{margin-top: 60px !important}	/* same value for both */
	#below_map_div{height: 77px !important}
	
/*	
	.maptablinks {
		width:167px;
		height:50px;
	}
	
	#NewTarget_sendbutton_mobile{min-height:42px;min-width:180px;font-size:18px}
	#NewTarget_cancelbutton_mobile{min-height:42px;min-width:180px;font-size:18px}
	#ConnectTarget_sendbutton_mobile{min-height:42px;min-width:180px;font-size:18px}
	#ConnectTarget_cancelbutton_mobile{min-height:42px;min-width:180px;font-size:18px}
	#addFixedPosition_CANCEL_Button{min-height:38px;min-width:150px;font-size:18px}
*/		/*  #addPOIbutton{font-size:17px}  */


/*
	#coordinates_label{font-size:19px}
	#collapse1{min-width:22px;}
	#dialog_AddMarkerFromFixedPosition{font-size:17px}

	#addFixedPosition_markerName{font-size:20px}
	.freeFields{font-size:19px}
	.error_messages{font-size:17px}
*/
}

@media screen and (orientation: landscape) and (max-width: 800px) {
	#map_tabs_area{padding-left:20px !important}
	#TableCont{width:90% !important;padding:10px !important}
}

@media (hover: none){	/* for devices that don't support hover; for when user clicked on active tab to retract it */
	.maptablinks {
		  background-color: #eee !important;
		  border-bottom: 2px solid #404040 !important;
		  top: 0px !important;
	}
	.accordion1{
		background-color: #eee !important;
		/*box-shadow: 0 0 0 2px rgba(236,236,236,2) !important;*/
	}
	.TableCont_set_button_mobile{
		/*background-image: url('../images/plus_sign0_hover.png') !important;*/
		/*box-shadow: 0 0 0 2px rgba(236,236,236,2) !important;*/
	}
}



.ui-widget-overlay{
	background: repeat-x scroll 50% 50% #000 !important;
	opacity: 0.5 !important;
}

.ui-dialog {
	position:fixed;
}

:root {
  --tabAreasDropShadowColor: #0A2D56;
}

body{
	background-image: none;
	background-color: black ;
	/* background-image: radial-gradient(farthest-corner at 40px 40px, #0076A8 0%, #43e 100%);  */
}


#map_page{
	position: relative;
	width:95%;
	max-width:1500px;
	margin:0 auto;
	padding-bottom: 183px;	/* can be an approximate figure; the calc is done in index.php */
	background: radial-gradient(cyan 0%, transparent 70%, #0076A8 80%);
}

#map_page_inner{
	padding: 100px 100px 0px 100px;
	border-width: 0 3px 0 3px;
	border-style: solid;
	border-image: linear-gradient(to top, #0099CC, rgba(0, 0, 0, 0)) 1 100%;
	-moz-border-image: linear-gradient(to top, #0099CC, rgba(0, 0, 0, 0)) 1 100%;
	-webkit-border-image: linear-gradient(to top, #0099CC, rgba(0, 0, 0, 0)) 1 100%;
	position: relative; /* needed for pillars */
	top: 8px; /* needed for pillars */
}


#new_target_details_div{
	min-height:1px;
	margin: 5px 0px 50px 0px;
	padding:15px;
	font-size:small;
	border: 2px solid #0099CC;
	border-radius: 5px;
	box-shadow: 5px 10px #888888;
}

#map_tabs{
	padding: 10px 25px 9px 25px;
	border: 2px solid grey;
	border-radius: 15px 15px 0 0;
	background: linear-gradient(#5A5555 10%, 30%, grey 90%);
}

.maptablinks {
	cursor: pointer;
	padding: 10px 5px 10px 8px;
	border: none;
	border-radius: 5px 8px 0 0;
	transition: 0.2s;
	font-weight:bold;
	font-size: 13px;
	min-width: 130px;
	height: 39px;
}

.active2 {
	border-bottom: 2px solid #404040;
	background-color: #9E9E9E;
	position: relative;
	top: 3px;
}
/* DOES NOT WORK ON MOBILE (will think it's still hovering after a press)
@media (hover: hover) {
  .maptablinks:hover {
    background-color: #9E9E9E;
	position: relative;
	top: 3px;
  }
}*/


.maptablinks_std:after {
  content: ' ';
  color: #777;
  font-weight: bold;
  float: right;
  margin-left: 0px;
    width: 24px;
    min-height: 12px;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTI0IDI0SDBWMGgyNHoiIG9wYWNpdHk9Ii44NyIvPgogICAgICAgIDxwYXRoIGZpbGw9IiNBOUFDQUYiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE1Ljg4IDE1LjI5TDEyIDExLjQxbC0zLjg4IDMuODhhLjk5Ni45OTYgMCAxIDEtMS40MS0xLjQxbDQuNTktNC41OWEuOTk2Ljk5NiAwIDAgMSAxLjQxIDBsNC41OSA0LjU5Yy4zOS4zOS4zOSAxLjAyIDAgMS40MS0uMzkuMzgtMS4wMy4zOS0xLjQyIDB6Ii8+CiAgICA8L2c+Cjwvc3ZnPgo=');
    background-repeat: no-repeat;
    background-position: center;
	transform: rotate(180deg);
}
/*
.maptablinks_std:hover:after{
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTI0IDI0SDBWMGgyNHoiIG9wYWNpdHk9Ii44NyIvPgogICAgICAgIDxwYXRoIGZpbGw9IiM1NTZBRUEiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE1Ljg4IDE1LjI5TDEyIDExLjQxbC0zLjg4IDMuODhhLjk5Ni45OTYgMCAxIDEtMS40MS0xLjQxbDQuNTktNC41OWEuOTk2Ljk5NiAwIDAgMSAxLjQxIDBsNC41OSA0LjU5Yy4zOS4zOS4zOSAxLjAyIDAgMS40MS0uMzkuMzgtMS4wMy4zOS0xLjQyIDB6Ii8+CiAgICA8L2c+Cjwvc3ZnPgo=');
}
*/
.maptablinks_std_hover:after{
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTI0IDI0SDBWMGgyNHoiIG9wYWNpdHk9Ii44NyIvPgogICAgICAgIDxwYXRoIGZpbGw9IiM1NTZBRUEiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE1Ljg4IDE1LjI5TDEyIDExLjQxbC0zLjg4IDMuODhhLjk5Ni45OTYgMCAxIDEtMS40MS0xLjQxbDQuNTktNC41OWEuOTk2Ljk5NiAwIDAgMSAxLjQxIDBsNC41OSA0LjU5Yy4zOS4zOS4zOSAxLjAyIDAgMS40MS0uMzkuMzgtMS4wMy4zOS0xLjQyIDB6Ii8+CiAgICA8L2c+Cjwvc3ZnPgo=');
}


.active2:after {
  content: " ";
  float: right;
  margin-left: 0px;
  width: 24px;
    min-height: 12px;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTI0IDI0SDBWMGgyNHoiIG9wYWNpdHk9Ii44NyIvPgogICAgICAgIDxwYXRoIGZpbGw9IiNBOUFDQUYiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE1Ljg4IDE1LjI5TDEyIDExLjQxbC0zLjg4IDMuODhhLjk5Ni45OTYgMCAxIDEtMS40MS0xLjQxbDQuNTktNC41OWEuOTk2Ljk5NiAwIDAgMSAxLjQxIDBsNC41OSA0LjU5Yy4zOS4zOS4zOSAxLjAyIDAgMS40MS0uMzkuMzgtMS4wMy4zOS0xLjQyIDB6Ii8+CiAgICA8L2c+Cjwvc3ZnPgo=');
    background-repeat: no-repeat;
    background-position: center;
	transform: none;
}
/*
.active2:hover:after {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTI0IDI0SDBWMGgyNHoiIG9wYWNpdHk9Ii44NyIvPgogICAgICAgIDxwYXRoIGZpbGw9IiM1NTZBRUEiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE1Ljg4IDE1LjI5TDEyIDExLjQxbC0zLjg4IDMuODhhLjk5Ni45OTYgMCAxIDEtMS40MS0xLjQxbDQuNTktNC41OWEuOTk2Ljk5NiAwIDAgMSAxLjQxIDBsNC41OSA0LjU5Yy4zOS4zOS4zOSAxLjAyIDAgMS40MS0uMzkuMzgtMS4wMy4zOS0xLjQyIDB6Ii8+CiAgICA8L2c+Cjwvc3ZnPgo=');
}
*/
.active2_hover:after {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTI0IDI0SDBWMGgyNHoiIG9wYWNpdHk9Ii44NyIvPgogICAgICAgIDxwYXRoIGZpbGw9IiM1NTZBRUEiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE1Ljg4IDE1LjI5TDEyIDExLjQxbC0zLjg4IDMuODhhLjk5Ni45OTYgMCAxIDEtMS40MS0xLjQxbDQuNTktNC41OWEuOTk2Ljk5NiAwIDAgMSAxLjQxIDBsNC41OSA0LjU5Yy4zOS4zOS4zOSAxLjAyIDAgMS40MS0uMzkuMzgtMS4wMy4zOS0xLjQyIDB6Ii8+CiAgICA8L2c+Cjwvc3ZnPgo=');
}

.dot_updates{
	color: #ff3434 ; /* #00c5f4 */
	font-size: 19px;	 	/* doesn't display properly if increased */
	position: relative;
	top: -4px;  /* doesn't display properly if up */
	left: 4px;
}


#map_tabs_area {
  padding: 0px 9px 0px 40px;	/* paddding-top needs to stay at 0 for the area to stick to the tab buttons at the top */
/*  background: grey url(/images/squares_bg_small.png) ;	*/
  background-color: grey ;
  max-height: 0;
  overflow:hidden;
  transition: max-height 0.8s ease-out;
}




#add_target_div label, #connect_target_div label{
	font-size:14px;
	color: #00c5f4;
	font-family: 'Helvetica Neue','Helvetica',Arial;
	text-shadow: 1px 1px #02a7ce;
	letter-spacing: 2px;
}


/* SUMMARY table */
.tracking_objects_tables{
	margin-left:0px;
	margin-top:0px;
	padding-top:0px;
	margin-bottom:15px;
	font-size:12px;
	min-height:5px;
	width:95%;
}
#connected_target_table{margin-bottom:9px !important}	/* has to be below .tracking_objects_tables*/

.tr_target_first_line, .whole_markers_line{
	display:block !important;
	margin-top:12px !important;
	margin-bottom:-3px !important;
}
.td_markers_icon{
	min-width: 45px;
	text-align: center;
	position:relative;
	top: 2px;
}

.td_markers_details{
	font-weight:bold;
	width:80%;
	font-size:1.1em;
	cursor: pointer;
}
.td_markers_details:hover{
	color: #00c5f4;
	/*text-decoration:underline;*/
}
.td_markers_details_noposition{
	font-weight:bold;
	width:80%;
	font-size:1.1em;
}

.span_target_name{
	padding-right:14px;
}
.td_target_buttons_right{
	min-width:76px;
	position:relative;
	top:-7px;
	left:2px;
	font-size:x-small;
	text-align:right;
}
.div_POIs{
	padding-left: 40px;
	margin-top:2px;
	margin-bottom:9px;
}
	.td_POI_main{
		width: 100%; 
		text-overflow: ellipsis;white-space: nowrap;overflow: hidden;
	}
	.td_POI_main:hover{
		color: #00c5f4;
		text-decoration:underline;
		cursor: pointer;
	}
	.span_POI_icon{
		display:inline-block;
		width: 30px;
	}
	.span_POI_name{
		padding-left: 5px;
		display:inline-block;
		position:relative;
		top:-4px;
		text-overflow: ellipsis;white-space: nowrap;overflow: hidden;
	}
	.removePOIConnectedTarget{
		float:right;
		margin-top:5px;
	}



/* buttons css tightly coupled with PT.css */
.buttons_class_allMarkers{
	font-size:11px;
	position:relative;
	top:7px;
}

.btnclass {
	color: #03b0d9;
	padding: 3px 5px;
	text-align: center;
	font-weight: bold;
	border: 1px solid #00c5f4;
	border-radius: 5px;
	margin: 0em;
	background: blue url(/images/buttonbg2.png) repeat-x;
	transition: all 0.4s linear;
	cursor:pointer;
	font-size:12px;
}
.btnclass:disabled {
	background: blue url(/images/buttonbg.png) repeat-x;
	color: grey;
	border: 1px solid silver;
	cursor: no-drop;
}

.btnclass:hover {
	color: white;
	background-color: blue;
	background-position: 0 -30px;
}


#TableCont {
  position: relative;
  margin-top:18px;
  padding: 15px 15px 15px 15px;
  width:85%;
  font-size:small;
  background-color: #D1D6DC;
  border: 2px solid #0076A8;
  border-radius: 5px;
  box-shadow: 5px 10px var(--tabAreasDropShadowColor);
  display:none;
  
/*  overflow:auto;	*/
	
/*  max-height: 0;
  overflow:hidden;
  transition: max-height 0.6s ease-out;
*/  
  -webkit-animation: fadeEffect 1s;
  animation: fadeEffect 1s;
}
#TableCont::after {
  content: "";
  background-color: #D1D6DC;
  opacity: 0.5;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}

.TableCont_set{
	display:table-cell;
	vertical-align:top;
	padding-right:30px;
}

.TableCont_set_button_area{
	display:table-cell;
	width:130px;
	vertical-align:top;
}
.TableCont_set_button{
	width:100%;
	height:36px;
	position:relative;
	top:7px;
}
.TableCont_set_button_mobile{
	width:45px;
	height:48px;
	line-height:46px;
	text-align:center;
	background-color: #cccccc;
	background: #cccccc url('../images/plus_sign0_hover.png');
	background-position: center;
	background-repeat: no-repeat;
	background-size: 15px 15px;
	display:none;
	/*box-shadow: 0 0 0 2px rgba(236,236,236,2);*/
}
/*
.TableCont_set_button_mobile:hover{
	background:  #cccccc url('../images/plus_sign0_hover.png');
	background-position: center;
	background-repeat: no-repeat;
	background-size: 15px 15px;
}*/

.TableCont_set_button_mobile_img{
	width: 40%;
	vertical-align:middle;
	position:absolute;
}

.disengage_img_class{
	width:20px;
	padding-right:4px;
	margin-top:10px;
	cursor: pointer;
}
.rmvPOI_img_class{
	width:18px;
	padding-right:5px;
	margin-top:12px;
	cursor: pointer;
}

#addPOIbutton{
	margin-right: 5px;
	margin-left: 2px;
	margin-top: 7px;
	white-space: nowrap;
}

#conn_target_sys_img{
	width:24px;
	float:right;
	margin-right:1px;
	margin-top:2px;
	cursor:pointer;
	display:none;
}


#coordinates_label{
  font-size:13px;
}
#reticle_div {
  position: relative;
  margin-top:18px;
  width:80%;
  padding:20px 15px 30px 30px;		/* top, right, bottom, and left */
  background-color: #D1D6DC;
  border: 2px solid #0076A8;
  border-radius: 5px;
  box-shadow: 5px 10px var(--tabAreasDropShadowColor);
  font-size:small;
  display:none;
   
/*  max-height: 0;
  overflow:hidden;
  transition: max-height 0.6s ease-out;
*/  
  -webkit-animation: fadeEffect 1s;
  animation: fadeEffect 1s;
}
#reticle_div::after {
  content: "";
  background-color: #D1D6DC;
  opacity: 0.5;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}

#conversionTab{
	position: relative;
	margin-top:18px;
	/*margin-right: 29px;*/
	width:86%;
	padding: 10px 27px 30px 30px;	/* top, right, bottom, and left */
	background-color: #D1D6DC;
	border: 2px solid #0076A8;
	border-radius: 5px;
	box-shadow: 5px 10px var(--tabAreasDropShadowColor);
   	display:none;
   
/*  max-height: 0;
  overflow:hidden;
  transition: max-height 0.6s ease-out;
*/  
  -webkit-animation: fadeEffect 1s;
  animation: fadeEffect 1s;
}
#conversionTab::after {
  content: "";
  background-color: D1D6DC;
  opacity: 0.5;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}

#publictargets_div {
  position: relative;
  margin-top:18px;
  /*margin-right: 29px;*/
  width:84%;
  padding: 10px 29px 10px 30px;	/* top, right, bottom, and left */
  background-color: #D1D6DC;
  border: 2px solid #0076A8;
  border-radius: 5px;
  box-shadow: 5px 10px var(--tabAreasDropShadowColor);
  font-size:small;
  display:none;
   
/*  max-height: 0;
  overflow:hidden;
  transition: max-height 0.6s ease-out;
*/  
  -webkit-animation: fadeEffect 1s;
  animation: fadeEffect 1s;
}
#publictargets_div::after {
  content: "";
  background-color: #D1D6DC;
  opacity: 0.5;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}


#dialog_AddMarkerFromFixedPosition {
  position: relative;
  margin-top:18px;
  padding: 30px 30px 30px 30px;
  width: 80%;
  background-color: #D1D6DC;
  border: 2px solid #0076A8;
  border-radius: 5px;
  box-shadow: 5px 10px var(--tabAreasDropShadowColor);
  font-size:small;
  display:none;
   
/*  max-height: 0;
  overflow:hidden;
  transition: max-height 0.6s ease-out;
*/  
  -webkit-animation: fadeEffect 1s;
  animation: fadeEffect 1s;
}
#dialog_AddMarkerFromFixedPosition::after {
  content: "";
  background-color: #D1D6DC;
  opacity: 0.5;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}

#new_target_details_div_mobile {
  position: relative;
  margin-top: 18px;
  padding: 30px 15px 30px 15px;	
  width: 400px;
  background-color: #D1D6DC;
  border: 2px solid #0076A8;
  border-radius: 5px;
  box-shadow: 5px 10px var(--tabAreasDropShadowColor);
  font-size:small;
  display: none; 
  -webkit-animation: fadeEffect 1s;
  animation: fadeEffect 1s;
}
#new_target_details_div_mobile::after {
  content: "";
  background-color: #D1D6DC;
  opacity: 0.5;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}


/*  part of dialog_tracking_info  */
#heart-breaker_d1{
	width: 100%;
	display: flex;
	margin: 36px auto 19px auto;
}
#heart-breaker-line-first_d1{
	background: linear-gradient(90deg, #72BAD8 0%, #72BAD8 0%, #41A3CB 100%);
	border-image-source: linear-gradient(90deg, #72BAD8 0%, #72BAD8 0%, #41A3CB 100%);
	height: 1px;
	width: 100%;
	border-bottom: 1px solid;
	margin: 8px 8px 8px 0;
}
#heart-breaker-line-second_d1{
	background: linear-gradient(90deg, #41A3CB 0%, #72BAD8 100%);
	border-image-source: linear-gradient(90deg, #41A3CB 0%, #72BAD8 100%);
	height: 1px;
	width: 100%;
	border-bottom: 1px solid;
	margin: 8px 0 8px 8px;
}


#latlon_tab_label_fixedPos:before{content: "Latitude & longitude"}
#tabs-LL input[type=radio]{float: left}
#tabs-LL input[type=radio] + label{
	margin-left: 35px;
    display: block;
	margin-top: 4px;
	position:relative;
}	
#tabs-LL input[type=radio]:checked + label{font-weight:bold}

.fixedPos_field_label{
	font-weight:bold;
	font-size:x-small;
	margin-left:16px;
	margin-bottom:3px;
	display:block;
}


.target_details_field_label{
	font-weight:bold;
	font-size:x-small;
	margin-left:29px;
}

.new_target_details_div_mobile_inputs{
	font-size:small;
	font-size:13.5px;
}


@-webkit-keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}

@keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}




.accordion1 {
  background-color: #eee;
  color: #444;
  font-weight:bold;
  cursor: pointer;
  padding: 17px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 12px;
  transition: 0.4s;
  /*box-shadow: 0 0 0 2px rgba(236,236,236,2);*/
}

.active1, .accordion1:hover {
  background-color: #ccc;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, .11);
}

.accordion1:after {
  content: ' ';
  color: #777;
  font-weight: bold;
  float: right;
  margin-left: 5px;
  
    width: 24px;
    min-height: 12px;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTI0IDI0SDBWMGgyNHoiIG9wYWNpdHk9Ii44NyIvPgogICAgICAgIDxwYXRoIGZpbGw9IiNBOUFDQUYiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE1Ljg4IDE1LjI5TDEyIDExLjQxbC0zLjg4IDMuODhhLjk5Ni45OTYgMCAxIDEtMS40MS0xLjQxbDQuNTktNC41OWEuOTk2Ljk5NiAwIDAgMSAxLjQxIDBsNC41OSA0LjU5Yy4zOS4zOS4zOSAxLjAyIDAgMS40MS0uMzkuMzgtMS4wMy4zOS0xLjQyIDB6Ii8+CiAgICA8L2c+Cjwvc3ZnPgo=');
    /*background-image: url('/images/arrow_expand_up_grey.png');*/
	background-repeat: no-repeat;
    background-position: center;
	transform: rotate(180deg);
}

.accordion1:hover:after{
    /*background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTI0IDI0SDBWMGgyNHoiIG9wYWNpdHk9Ii44NyIvPgogICAgICAgIDxwYXRoIGZpbGw9IiM1NTZBRUEiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE1Ljg4IDE1LjI5TDEyIDExLjQxbC0zLjg4IDMuODhhLjk5Ni45OTYgMCAxIDEtMS40MS0xLjQxbDQuNTktNC41OWEuOTk2Ljk5NiAwIDAgMSAxLjQxIDBsNC41OSA0LjU5Yy4zOS4zOS4zOSAxLjAyIDAgMS40MS0uMzkuMzgtMS4wMy4zOS0xLjQyIDB6Ii8+CiAgICA8L2c+Cjwvc3ZnPgo=');*/
	/*background-image: url('/images/arrow_expand_up_blue2.png');*/
	background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTI0IDI0SDBWMGgyNHoiIG9wYWNpdHk9Ii44NyIvPgogICAgICAgIDxwYXRoIGZpbGw9IiNBOUFDQUYiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE1Ljg4IDE1LjI5TDEyIDExLjQxbC0zLjg4IDMuODhhLjk5Ni45OTYgMCAxIDEtMS40MS0xLjQxbDQuNTktNC41OWEuOTk2Ljk5NiAwIDAgMSAxLjQxIDBsNC41OSA0LjU5Yy4zOS4zOS4zOSAxLjAyIDAgMS40MS0uMzkuMzgtMS4wMy4zOS0xLjQyIDB6Ii8+CiAgICA8L2c+Cjwvc3ZnPgo=');
}

.active1:after {
  content: " ";
  float: right;
  margin-left: 5px;
  width: 24px;
  
    min-height: 12px;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTI0IDI0SDBWMGgyNHoiIG9wYWNpdHk9Ii44NyIvPgogICAgICAgIDxwYXRoIGZpbGw9IiNBOUFDQUYiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE1Ljg4IDE1LjI5TDEyIDExLjQxbC0zLjg4IDMuODhhLjk5Ni45OTYgMCAxIDEtMS40MS0xLjQxbDQuNTktNC41OWEuOTk2Ljk5NiAwIDAgMSAxLjQxIDBsNC41OSA0LjU5Yy4zOS4zOS4zOSAxLjAyIDAgMS40MS0uMzkuMzgtMS4wMy4zOS0xLjQyIDB6Ii8+CiAgICA8L2c+Cjwvc3ZnPgo=');
    /*background-image: url('/images/arrow_expand_up_grey.png');*/
	background-repeat: no-repeat;
    background-position: center;
	transform: none;
}

.active1:hover:after {
    /*background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTI0IDI0SDBWMGgyNHoiIG9wYWNpdHk9Ii44NyIvPgogICAgICAgIDxwYXRoIGZpbGw9IiM1NTZBRUEiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE1Ljg4IDE1LjI5TDEyIDExLjQxbC0zLjg4IDMuODhhLjk5Ni45OTYgMCAxIDEtMS40MS0xLjQxbDQuNTktNC41OWEuOTk2Ljk5NiAwIDAgMSAxLjQxIDBsNC41OSA0LjU5Yy4zOS4zOS4zOSAxLjAyIDAgMS40MS0uMzkuMzgtMS4wMy4zOS0xLjQyIDB6Ii8+CiAgICA8L2c+Cjwvc3ZnPgo=');*/
	/*background-image: url('/images/arrow_expand_up_blue2.png');*/
	background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPHBhdGggZD0iTTI0IDI0SDBWMGgyNHoiIG9wYWNpdHk9Ii44NyIvPgogICAgICAgIDxwYXRoIGZpbGw9IiNBOUFDQUYiIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTE1Ljg4IDE1LjI5TDEyIDExLjQxbC0zLjg4IDMuODhhLjk5Ni45OTYgMCAxIDEtMS40MS0xLjQxbDQuNTktNC41OWEuOTk2Ljk5NiAwIDAgMSAxLjQxIDBsNC41OSA0LjU5Yy4zOS4zOS4zOSAxLjAyIDAgMS40MS0uMzkuMzgtMS4wMy4zOS0xLjQyIDB6Ii8+CiAgICA8L2c+Cjwvc3ZnPgo=');
}

.accordion1_panel {
  padding: 0 4px 0 4px;
  background-color: rgb(242, 242, 242);
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  /*box-shadow: 0 0 0 2px rgba(236,236,236,2);*/
}



.error_messages{
	color:red;
	font-weight:bold;
	font-size:12px;
	margin-bottom:11px;
}

/* hint text :  */
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: rgb(180,180,180);;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: rgb(180,180,180);;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: rgb(180,180,180);;
}



#LockOnMe_map_caption{z-index:401;position:absolute;bottom:19px;right:0px;background:#fff;background:rgba(255, 255, 255, 0.7);padding-left:4px;padding-right:4px;}

#LockOnMe_map_caption a {
font-size:11px;
font-weight:bold;
text-decoration: none;
}

#LockOnMe_map_caption a:hover {
text-decoration: underline;
}


#collapse1{
	transition: 0.3s;
}
#collapse1:hover{
	transform: scale(1.2) translateY(2px);
}


.column_div{
	display:inline-block;
	padding: 10px 2px 10px 2px;
	text-align:left;
}
.column_optional{
	display:inline-block;
	padding: 10px 2px 10px 2px;
}


.lom_ui_dialog{
	display:none;
	font-size:medium;
}

.dialog_targetSYS_labels{
	width:105px;
}


#dialog_addPOI_details{padding-left:18px;padding-right:18px;}

#dialog_addPOI_details_title{width:100% !important}#POInoteField{width:100% !important}#POIurlfield{width:100% !important}#POIimgURLfield{width:100% !important}

.POI_popup_note_label{
	width: 41px;
	display:inline-block;
}
.POI_popup_note{	
	display:inline-block;
	vertical-align:top;
	color: #ff3434;
	width: 235px;
}

.POI_popup_url_label{
	display:inline-block;
	width:35px;	
	margin-top: 8px;
}
.POI_popup_url_img{
	width: 22px;
	position:relative;
	top: 3px;
	margin-left: 4px;
}
.POI_popup_url{
	display:inline-block;
	width: 248px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: #ff3434 !important;
	text-decoration: underline;
}
.POI_popup_url:hover{
	text-decoration: none;
}

.POIimgThumb{
	position: relative;
	width:40px;
	min-height:20px;
	border: 1px solid #ddd;
	border-radius: 4px;
	padding: 5px;
	/* background-color: silver; */
}
.POIimgThumb:hover {
  box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}

.popup_editremove{
	cursor:pointer;
	transition:0.4s;
	/*min-width: 200px;*/
	color: #0099CC;		/* rgb(220,220,220) */
	margin-top: 20px;
	margin-bottom: 9px;
	margin-right:30px;
}
.popup_editremove:hover{
	text-decoration: underline;
}

.popup_more{
	cursor:pointer;
	transition:0.4s;
	/*min-width: 200px;*/
	color: #0099CC;		/* rgb(220,220,220) */
	margin-top: 20px;
	margin-bottom: 9px;
	margin-right:30px;
}
.popup_more:hover{
	text-decoration: underline;
}
.popup_more::before {
  content: "∵"; 			/* ⏷ ◆ */
  font-size: 16px;
  color: #ff3434;
  /*float: right;*/
  margin-right: 7px;
  margin-top:-5px;
  text-decoration: none;
  display:inline-block;
}
.active_popup_more::before {
  content: "∴"; 			/* ⏶ ◇ */
  /*font-size: 25px;*/
  text-decoration: none;
  display:inline-block;
}
.popup_more_content{
	display:none;
	font-size:90%;
}

.directions_img{
	width:30px;
	cursor:pointer;
	margin-top:8px;
	margin-bottom:7px;
	display:block;
}
.popup_bottom_space{
	height:3px;
}


/*@keyframes anim_carousel {
  from {
    height: 0;
  }
  to {
    height: 100px;
  }
}*/
#carousel_parent{
	position:relative;
	height:0;
	overflow:hidden;
	/*animation-duration: 0.3s;
	animation-name: anim_carousel;*/
	transition: height padding;
	transition-duration: 0.3s;
	margin: 0 auto;
}
#carousel_machine{
	width:90%;
	height:100%;
	margin:0 auto;
}
.caroussel_box_div{
	background-position: center;
	background-size: cover;
	cursor:pointer;
	margin-left:10px;margin-right:10px;
}
.caroussel_box_div_span{
	font-size: 15px;
	font-weight: bold;
	background-color: white;
	opacity: 0.7;
	/*padding-top: 5px;padding-bottom: 5px;
	padding-left: 8px;padding-right: 7px;*/
	box-shadow: 2px 0 0 4px white;
	line-height:1.6;	/* not smaller, as it would crop the upper line's Gs, Ps, etc.*/
}
#nosignal{
	position: absolute;
	left: 40px;
	bottom: 30px;
	font-size: small;
}

#projo_top{
	display: none;
	width: 100%;
	height: 17px;
	cursor: pointer;
	margin-top: 80px;	/* same as #reel_top */
	background-image: url('/images/projector_screen_top_red.png');
	background-size: 100% 100%;
}
#projo_bottom{
	display: none;
	width: 92%;
	height: 10px;
	margin: 0 auto;
	cursor: pointer;
	background-image: url('/images/projector_screen_bottom.png');
	background-size: 100% 100%;
}

#reel_top{
	display: none;
	width: 100%;
	height: 28px;
	margin-top: 90px;	/* same as #projo_top */
	background-image: url('/images/pellicule1.png');
	background-size: contain;
	background-position-x: 30px;
}
#reel_bottom{
	display: none;
	width: 100%;
	height: 28px;
	background-image: url('/images/pellicule1.png');
	background-size: contain;
	background-position-x: 30px;
}

