/* Basic styles for the Scout interface */

/* Page title area */
.scout_title {
 display: block;
 width: 100%;
 font-size: 28px;
 font-weight: bold;
 margin: 5px 0px 15px 0px;
}
 .scout_title_name {
  display: inline;
  vertical-align: bottom;
 }
  .scout_title_name a {
   color: #4156A1;
   text-decoration: underline;
  }
  .scout_title_name i {
   color: #F28C0D;
  }
 .scout_title_arr {
  display: inline;
  color: #666666;
  font-weight: normal;
 }
 .scout_title_page {
  display: inline;
  color: #000000;
 }

/* Station-based notes */
.scout_station_note {
 display: inline-block;
 max-width: 1170px;
 padding: 5px 15px;
 margin: 5px 0px 15px 0px;
 background-color: #FFF3CD;
 border-radius: 8px;
 color: #533F03;
 font-size: 16px;
}
 .scout_station_note i {
  margin-right: 5px;
 }
 .scout_station_note_close {
  float: right;
  margin-left: 10px;
  font-weight: bold;
  cursor: pointer;
 }

/* Main page content container */
.scout_container {
 display: block;
 width: 100%;
 max-width: 1170px;
 margin: 20px auto;
 text-align: center;
 vertical-align: top;
}
 .scout_loading {
  display: block;
  text-align: center;
  margin: auto;
  font-size: 18px;
 }
  .scout_loading img {
   vertical-align: middle;
   margin-right: 10px;
  }

 /* Tabs for changing between station modules */
.tab_container {
 display: block;
 width: 100%;
 margin: 20px auto;
 text-align: center;
 vertical-align: top;
}
 .tab_block {
  display: inline-block;
  padding: 0px 5px;
  vertical-align: top;
 }
  .tab_button_sel, .tab_button_unsel  {
   display: block;
   width: 160px;
   padding: 4px;
   height: 20px;
   border-radius: 20px;
   margin: auto;
   text-align: center;
   font-size: 16px;
   line-height: 1.0;
   box-sizing: unset !important;
   -webkit-box-sizing: unset !important;
  }
  .tab_button_sel {
   background-color: #003366;
   color: #FFFFFF;
   border: 3px solid #0055AA;
   font-weight: bold;
   text-decoration: none;
   cursor: default;
  }
  .tab_button_unsel {
   background-color: #666666;
   color: #FFFFFF;
   border: 3px solid #CCCCCC;
   font-weight: normal;
   text-decoration: underline;
   cursor: pointer;
  }
   .tab_button_symbol {
    display: inline;
    float: right;
    padding: 2px 4px;
   }
   .tab_button_new {
    display: inline;
    vertical-align: super;
    font-size: 10px;
    margin-right: 5px;
   }

/* A matrix/table containing all subpanels */
.scout_matrix_container {
  display: table;
  width: 100%;
  border-collapse: collapse;
}
 .scout_matrix_row {
  display: table-row;
 }
  .scout_matrix_cell {
   display: table-cell;
   width: 50%;
   border: 1px solid #4156A1
  }
  .scout_matrix_cell_full {
   display: table-cell;
   width: 100%;
   border: 1px solid #4156A1
  }
  .scout_matrix_cell_1qtr {
   display: table-cell;
   width: 30%;
   border: 1px solid #4156A1
  }
  .scout_matrix_cell_3qtr {
   display: table-cell;
   width: 70%;
   border: 1px solid #4156A1
  }

/* Subpanels for displaying station details */
.scout_subpanel {
 display: block;
 width: 100%;
 vertical-align: top;;
}
 .scout_subpanel_title {
  display: block;
  padding: 4px 8px;
  text-align: center;
  background-color: #4156A1;
  color: #FFFFFF;
  font-size: 18px;
  font-weight: bold;
 }
 .scout_subpanel_content {
  display: block;
  padding: 4px 8px;
  text-align: left;
 }
  .scout_subpanel_subtitle {
   display: block;
   margin: 5px 0px;
   color: #003366;
   font-size: 18px;
   font-weight: bold;
  }
  .scout_subpanel_table {
   display: table;
   width: 100%;
   font-size: 15px;
  }
   .scout_subpanel_tr {
    display: table-row;
   }
    .scout_subpanel_td_field, .scout_subpanel_td_field_sm {
     display: table-cell;
     white-space: nowrap;
     padding: 4px 8px 4px 4px;
     text-align: left;
     font-weight: bold;
    }
    .scout_subpanel_td_field_sm {
     padding-left: 15px;
     font-size: 13px;
    }
    .scout_subpanel_td_value, .scout_subpanel_td_value_sm {
     display: table-cell;
     padding: 4px 4px 4px 8px;
     text-align: left;
    }
    .scout_subpanel_td_value_sm {
     white-space: nowrap;
     font-size: 13px;
    }
     .scout_subpanel_link {
      margin-left: 3px;
      color: #003366;
      font-weight: normal;
      font-size: 12px;
      text-decoration: underline;
      cursor: pointer;
     }
     .scout_subpanel_scolink {
      margin: 5px auto;
      font-weight: normal;
      text-align: center;
     }
      .scout_subpanel_scolink i {
       margin-right: 5px;
      }
     .scout_subpanel_text_sm {
      display: block;
      margin-top: 5px;
      font-size: 12px;
     }
     .geog_highlight {
      font-weight: bold;
      color: rgb(0, 153, 0);
     }
      .scout_subpanel_smtext {
       margin-left: 5px;
       font-size: 12px;
      }

/* Styles for a loading icon */
.loading {
 display: block;
 text-align: center;
 margin: auto;
 font-size: 18px;
}
 .loading img {
  vertical-align: middle;
  margin-right: 10px;
 }

/* Changes for mobile/responsive pages. Added by JAM 2/28/2021 */
/* Desktop */
@media screen and (min-width:992px) {
	.tab_container {
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
	}
	.scout_matrix_row {
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
	}
	.scout_matrix_cell {
		flex: 1 1 15em;
	}
	.scout_matrix_cell_1qtr {
		flex: 1 1 0em;
	}
	.scout_matrix_cell_3qtr {
		flex: 1 1 25em;
	}
}
/* Smaller screens */
@media screen and (max-width:992px) {
	#content_frame {
		width: 100% !important;
	}
	.tab_container {
		display: flex !important;
		flex-wrap: wrap;
		flex-direction: column;
		margin; inherit !important;
	}
	.tab_block {
		display: inline-flex !important;
		padding: 0.25em;
		flex: auto;
	}
	.tab_button_sel, .tab_button_unsel {
		width: 100% !important;
		padding: 0.5em 0 !important;

	}

	.scout_matrix_container {
		display: flex !important;
		width: inherit !important;
		flex-wrap: wrap;
		flex-direction: column;
	}
	.scout_matrix_row {
		display: inline-flex !important;
		flex-wrap: wrap;
		flex-direction: column;
		width: 100%;
	}
	.scout_matrix_cell, .scout_matrix_cell_1qtr, .scout_matrix_cell_3qtr {
		display: inline-flex !important;
		flex: auto;
		width: 100% !important;
	}
 .scout_subpanel_content {
		max-height: inherit !important;
	}
}