@charset "UTF-8";

html{font-family: sans-serif;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;}
body{
  width: 90%;
  height: 100%;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  overflow-x: auto;
  font-size:62px;
  background:#1E82D1;

  background-position: center;
  background-size:cover;
  background-repeat:no-repeat;
  background-attachment:fixed;
}
h1{text-align:center;font-size:1em;margin:0.5em 0;}
div{border:1px solid #ccc;}
span{display:block;}
a{background:transparent;}
a:active,a:hover{outline:0;}

.maintitlefont {font-size:0.75em; text-align:center; color:white; white-space: nowrap;
  font-family:'Lucida Sans', Arial, sans-serif; background-color:#1E82D1;}
.bannernotice{border:2px;font-size:0.35em;font-style:italic;color:#ffe2e0;}
.copr{border:0px;font-size:0.3em;color:white;}
.dropfont{text-shadow: 1px 1px 2px #404040;}
.menubarbackground{background-color:rgb(140, 140, 140);}
.table{display:table;}
.title{display:table-caption;text-align:center;font-weight:bold;font-size:0.6em;}

.intitle{font-size:0.6em; padding: 0; margin: 10;}

.insubtitle{font-size:0.6em;padding:0;margin:0;}
.insubtitleplus{font-size:0.7em;padding:0;margin:0;}
.tabsel{background-color:rgb(255, 255, 255);}
.heading1{font-weight:bold;}
.heading2{font-weight:normal; text-align:center; font-size:0.7em;}
.heading3{font-weight:normal; text-align:left; font-size:0.3em;}
.novdiv{border-color:black;}

.info{text-align:left;font-size:0.3em;clear:both;}
.inner_link {margin:10%; background-color:white; font-size:0.3em; cursor: pointer;
    padding: 4px; border-width: 3px; border-style: solid outset outset solid;}

.w100{width:100%;}
.w1{width:1%;}
.w16{width:16.3%;}
.w2{width:2%;}
.w20{width:20%;}
.w22{width:22%;}
.w23{width:23.3%;}
.w25{width:25%;}
.w30{width:30%;}
.w33{width:33.3%;}
.w50{width:50%;}

.info2{display:block;color:rgb(54, 136, 202);font-size:0.5em;margin:0.75em 0.5em 0.5em 0.5em;}
.info3{display:block;font-size:0.3em;margin:0.5em 0.5em;}

.font20{font-size:0.2em;}
.font30{font-size:0.3em;}
.font40{font-size:0.4em;}
.font50{font-size:0.5em;}
.font60{font-size:0.6em;}
.font70{font-size:0.7em;}
.font80{font-size:0.8em;}
.font100{font-size:1em;}
.fontmenu{font-size:0.7em;}
.fontbold{font-weight: bold;}

.opaquetableheader{background-color:rgb(255,255,255);font-size:0.75em;
  border-collapse: collapse; border: 1px solid white;}
.transparenttableheader{background-color:rgb(255,255,255, 0.0);font-size:0.75em;}
.black100{background-color:black;}
.border{border:1px solid black;}

.vert{display:block;margin-left:auto;margin-right:auto;}
.horiz{display:flex;margin-left:auto;margin-right:auto;}
.edge{width:100%;margin-left:auto;margin-right:auto;}

.vcenter{vertical-align:middle;}

.width{width:100%;}
.center{text-align:center;}
.left{text-align:left;}

.conditions_first_row_cells {
  width:100%;
  font-size:1em;
  text-align:left;
}

.colortemp{background-color:#f7cdcd;}
.colorrelh{background-color:#71b1e6;}
.colorsolr{background-color:#e3ec8a;}
.colorwsp{background-color:#e7ab51;}
.colorwdr{background-color:#9f9fa0;}

.pdf_inset{
	  width: 85%;
	  height: 600px;
  }
	
/* layout */
.collapse:not(.show) {
  display: none;
}
/* To display on top of scrolling content, use a large z-index. Requires position defined. */
/* (header tabbed area must be given a background color.?) */
.headerarea{
  top:0;
  z-index: 9;
  background: #1E82D1;
  border-bottom-style: none;
}

.longmont_tabs {
  font-size:0.7em;
  width:14.28%;
  cursor: pointer;
}

.webcam_header {
  width:50%;
  background-color:rgb(255,255,255, 0.0);
  font-size:0.75em;
  overflow-x: hidden;
  border: none;
}

.mainpagewebcams{
  overflow-x: hidden;
  border: none;
}

.scrollingcontent {
  position: relative;
  z-index: 1;
  border:1px solid #ccc;
}


@media (max-width: 600px) {
  .btn {
    font-size: 14px; /* Smaller font size for very small screens */
    padding: 8px; /* Less padding to fit smaller screens */
  }
}



.button {
  display: inline-block;
  padding: 10px 20px;
  margin: 5px;
  background-color: #007BFF;
  color: white;
  text-decoration: none;
  border-radius: 5px;
  text-align: center;
}


.center-container {
  display: flex;
  justify-content: center; /* Centers children horizontally in the flex container */
  align-items: center; /* Centers children vertically in the flex container */
  /* height: 100vh; /* Optional: Makes the container full height of the viewport */
}

.webcam_popup {
  border: white 12px outset;
  z-index: 12;
  width: 80%;
  left: 10%;
  position: absolute;
  top:105%;
  display: none;
}

.heatmap_panel {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%; w
  idth: 100%;
  max-width: 50vw;
  border: 0px;
}

/* for pollutant_source.htm */

.return_link_span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}