/**************************************/
/* Set style for dropdown menu */

div.dropdown {
  width: 75%;
  /*height: 60px;  */
  height: 20%;
  border: none;
  /*padding: 10px; */
  /*background-color: #EEEEEE; */
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  -khtml-border-radius: 5px;
  border-radius: 5px;
}


/**************************************/
/* Map loading icon style */
.se-pre-con {
 position: absolute;
 left: 50%;
 top: 35%;
 z-index: 9999;
}

/**************************************/
/* FORM ELEMENT STYLES */


/* Submit button location: */
.sub_loc {
 float:right;
 display:block;
 width: 10%;
}
   
.sub_form {
 float:right;
 margin-bottom: 10%;  
 margin-left: 9%;
 margin-top: 15px;
 text-align: center;
 /*background-color: rgb(50,87,102);  */
 background-color: rgb(255, 163, 26);   /*orange*/
 color: #FFFFFF;
 font-weight: bold;
 font-size: 28px;
 width: 120px;
 height: 20%;
 text-align: center;
 border: 1px solid #000000;
 -moz-border-radius: 5px;
 -webkit-border-radius: 5px;
 -khtml-border-radius: 5px;
 border-radius: 5px;
}

/**************************************/
/* Style for map outerdiv */
.containerMapStyle {
 display: block;
 /* the original setting*/
 /* height: 480px; */
 /* modified by July 10/11/2021 */
 height: 600px; 
 /*margin-left: auto; 
 margin-right: auto;
 margin-top: 10px;
 margin-bottom: 10px; */
}

/* Set style for map */
#map {
 height: 98%;
 /*width: 75%; */
 width: 99%;
 margin: 0 auto;   
 border: 1px solid black;
 box-shadow: 2px 2px 4px gray;
}

#pac-input {
 width: 35%;
 height: 3.5%
 margin-top: 1%;
 margin-left: 12px;
 padding: 0% 3% 0 4%;
 background-color: #fff;
 font-family: Lato;
 font-size: 15px;
 font-weight: 300;
 text-overflow: ellipsis;
}

#pac-input:focus {
 /*border-color: #34495E;  */
 border-color: orange;
}

/**************************************/
/* Style for text at top of results page 
   Describing what user inputs output is
   based on. */
   
/*   
.userInfo{
 display:block;
 width:100%;
 margin-top:-40px;
 text-align:center;
 font-size:30px;
 /*color:#34495E;   */
/* color: black;
}

*/

/**************************************/
/* All styles associated with graphs */

/* Graph styles */
.graphStyles{
 width: 99%;
 display:block; 
 margin-top:5px;
 margin-left:auto;
 margin-right:auto;
 margin-bottom:2px; 
 padding 1%;
}

/* Actual high-charts style - added margins for space between plots*/
.highcharts-container {
 height:10% !important;
 width: 20%;  
 margin-top: 50px;  
 margin-bottom: 15px; 
 float: left;
 box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
} 


/* Generic caption styles */
.captions{
 display: block;
 width: 80%;
 margin-left:auto;
 margin-right:auto;
 margin-bottom:40px; 
 padding: 0.5em;
 text-align: center;
 font-style: italic;
 font-size: smaller;
 text-indent: 0;
}	

/* Flag conditions text under WBGT chart */ 
.banner{
  font-family: sans-serif;
  font-size:18px;
  font-style: bold;
  text-align:center; 
  margin-bottom:70px; 
}

/**************************************/
/*             Tables                 */

.WBGT_table{
  font-size:16px;
  width: 99%;
}  

.caption_text{
  font-size:18px;
}  

.military-work-instructions{
  text-align: left;
  font-weight: lighter;
  /* display: none; */
}

/*************************************************/
/*    Change sizes depending on size of screen   */
/*************************************************/

@media only screen and (min-width: 782px) and (max-width: 992px){
  div.options{
    height: 100px;
  }
  .sub_form{
    width: 200px;
    font-size: 14px;
  }
  .banner{
    font-size:14px;
  }
  .WBGT_table{
    font-size:14px;
  }   
  .caption_text{
    font-size:14px;
  }   


@media only screen and (max-width: 781px){
  div.options{
    height: 200px;
  }
  .sub_form{
    width: 300px;
    font-size: 11px;
  }
  .banner{
    font-size:11px;
  }
  .WBGT_table{
    font-size:11px;
  }   
  .caption_text{
    font-size:11px;
  }