* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }

  li {
    color: #262672;
  }

  p {
    line-height: 1.8em;
  }

  sub, sup  {
    line-height: 0;
  }

  body{
   font-family: "Montserrat", sans-serif;
   font-weight: 400;
  }

  h1{
    text-align:center;
    font-size:0.9em;
    font-weight:normal;
    margin:0.5em 0;
    color:#132D5E;
  }

  /* Page Layout */

  .container {
    position: relative;
    display: flex;
    flex-direction: column;
    background-color: #fff;
    padding: 0 0;
  }

  /* Header */
  .headerarea {
    z-index: 100;
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    background-color: #fff;
    border-bottom: 3px solid rgb(210,240,20);	/*Approx to Bf lime green*/
  }

  banner {
    font-family: "Trebuchet MS" sans-serif;
    font-size: 24px;
    font-weight: bold;
    color: red;
    margin-left: .5rem;
    text-align: center;
    padding-bottom: 10px;
    padding-top: 6px;
  }

  .pdf_inset{
	  width: 100%;
	  height: 500px;
  }

  .showhideiconbox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    cursor: pointer;
  }

  .menulabel {
    color: #666;
    font-size: 12px;
    font-style: bold;
    padding-top: 20px;
    padding-bottom: 0px;
    margin-top: 0px;
    margin-bottom: 5px;
    margin-left: 10px;
  }

  /* Below the header */

  .wrapper {
    display: flex;
    flex-direction: row;
  }

  .main {
    margin-left: 170px;
    z-index: 0;
    width: 100%;
    border:1px solid #ccc;
  }

  .googlecharts{
    min-width=240px;
    height:230px;
    margin: 0;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }

  .image-wrapper {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
  }

  .image {
    width:90%;
    margin-left: auto;
    margin-right: auto;
  }

  .table-header {
    text-align: center;
    border:1px solid #ccc;
  }

  .table-rows {
    display: flex;
    margin:auto;
    text-align:center;
    border:1px solid #ccc;
  }

  .main h2 {
    text-align:center;
    font-size:0.6em;
    color:#132D5E;
    margin:0.5em 0;
  }

  .main h3 {
    text-align:center;
    font-size:0.42em;
    font-weight:normal;
    color:#132D5E;
  }

  .main p {
    font-size: .38rem;
    color:#333;
  }

  .main footer {
    font-size:0.3em;
    color:#000000;
    text-align:left;
    margin-left:2px;
  }

  /* Sidebar */

  .sidebar {
    display: block;
    position: fixed;
    top: 70px;
    height: 90%;
    width: 158px;
    overflow-y: auto;
    margin-left: 5px;
    background-color: #fff;
    padding: 4px 6px;
  }

  .sidebar ul {
    list-style-type: none;
    font-size: .35rem;
  }

  .sidebar ul > li {
    cursor: pointer;
  }
  .menubutton {
    font-size: 16px;
    margin: 20px 0;
    padding: 10px 20px;
    background-color: #ddd;	/* original: #f9f9f9 */
    border: 1px;
    color: #132D5E;
    text-align: center;
    text-decoration: none;
    box-shadow: 0 2px 2px;
    cursor: pointer;
  }

  .return-link-div {
    font-size: 16px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    margin: 20px 0;
    padding: 10px 20px;
    background-color: #ecff73;
    border: 1px;
    color: #132D5E;
    text-align: center;
    text-decoration: none;
    box-shadow: 0 2px 2px;
    cursor: pointer;
    white-space: nowrap;
  }

  .return-link {
    font-size: 16px;
    margin: 0;
    padding: 0;
    background-color: #ecff73;
    color: #132D5E;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
  }

  /* For Dropdown Menus */

  /* The container <div> - needed to position the dropdown content */
  .dropdown {
    position: relative;
    display: inline-block;
  }
  /* Dropdown Button */
  .dropbtn {
    font-size: 16px;
    padding: 10px 20px;
    border: 1px;
    background-color: #ddd;	/* original: #f9f9f9 */
    color: #132D5E;
    text-align: center;
    box-shadow: 0 2px 2px;
  }
  /* Dropdown Content (Hidden by Default) */
  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #ddd;	/* original: #f9f9f9 */
    min-width: 160px;
    z-index: 1;
  }
  /* Links inside the dropdown */
  .dropdown-content a {
    color: #132D5E;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    cursor: pointer;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  }
  /* Change color of dropdown links on hover */
  .dropdown-content a:hover {background-color: #ddd;}
  /* Show the dropdown menu on hover */
  .dropdown:hover .dropdown-content {display: block;}
  /* Change the background color of the dropdown button when the dropdown content is shown */
  .dropdown:hover .dropbtn {background-color: #fff;}

  .logo {
    font-size: 2rem;
    margin-right: 1.5rem;
    color: #50c6db;
  }


/*For heatmap buttons */

@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: #55a4fa;
  color: white;
  text-decoration: none;
  border-radius: 5px;
  text-align: center;
}



.button:hover {
  background-color: #3071a9; /* Slightly darker blue on hover */
}


.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 */
}


/* Collapse Styles */
.collapse {
  display: none; /* Hide content by default */
}

.collapse.show {
  display: block; /* Show content when toggled */
}

/* Custom Button Styles */
.custom-collapse-btn {
  cursor: pointer;
  font-size: 16px; /* Increase font size, adjust as needed */
  padding: 10px 20px; /* Increase padding, adjust as needed for height */
  background-color: #288bc9; /* Example button color, change as needed */
  color: white; /* Example text color, change as needed */
  border: none; /* Remove border, adjust as needed */
  border-radius: 5px; /* Optional: round button corners */
  margin-bottom: 5px; /* Optional: add space below the button */
  text-align: center;
}


  html {
     font-size: 40px;
  }

  /* From longmont.htm */
  /* Known in use: */
  .vcenter{vertical-align:middle;}
  .opaquetableheader{background-color:rgb(255,255,255);font-size:0.75em;}
  .info3{display:block;font-size:0.5em;margin:0.5em 0.5em;}
  .edge{width:100%;margin-left:auto;margin-right:auto;}
  .intitle{padding:0;margin:0; color:#132D5E;}
  .w100{width:100%;}
  .font100{font-size:1em;}
  .left{text-align:left;}
  .center{text-align:center;}
  .tabsel{background-color:rgb(255, 255, 255);}
  .vert{display:block;margin-left:auto;margin-right:auto;}
  .width{width:100%;}
  .colortemp{background-color:#f7cdcd; display: block;}
  .colorrelh{background-color:#71b1e6; display: block;}
  .colorsolr{background-color:#e3ec8a; display: block;}
  .colorwsp{background-color:#e7ab51; display: block;}
  .colorwdr{background-color:#9f9fa0; display: block;}