body {
	display: flex;
  flex-direction: column;
  min-height: 100vh;
  margin-right: calc(100vw - 100%);
}
header { /* Sticky Header */
  background-color: #f0f0f0; /* Or your header color */
  padding: 10px;
  position: sticky; /* Key for sticky behavior */
  top: 0; /* Stick to the top */
  width: 100%; /* Ensure full width */
  z-index: 10; /* Ensure it's above other content (important!) */
}
main {
	flex-grow: 1;
}
main hr {
  height: 2px;
  background-color: #ccc;
	border: none;
  margin: 20px 0;
}
/* Footer style */
footer {
  background-color: #f0f0f0; /* Light gray background */
  padding: 20px;
  text-align: center; /* Center the text */
  position: relative; /* Needed for sticky footer */
  bottom: 0; /* Sticky footer */
  width: 100%; /* Ensure full width */
}
footer a {
  margin: 0 10px; /* Space between links */
  text-decoration: none; /* Remove underlines from links */
  color: #333; /* Dark gray link color */
}
footer a:hover {
  color: #007bff; /* Blue on hover */
}

/* Font for links (on the main page) to subpages. */
.subpage_font {
  font-family: "Georgia", sans-serif;
  font-size: 32px;
  color: #007bff;
  text-decoration: none;
}
.subpage_font_black {
  font-family: "Georgia", sans-serif;
  font-size: 32px;
  color: black;
  text-decoration: none;
}

/* Expanding/collapsing div items. */
.collapsed-div {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
}
.collapsed-div.active {
  max-height: max-content;
  overflow: auto;
	background-color: lightblue;
}
.collapsed-div .expanded-text {
	text-indent: 2em;
}

/* Drop-Down arrows. */
.dd-item {
  display: flex;
  align-items: center;
}
.dd-item .down-caret {
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 10px solid #000;
	/*margin-top: 5px;*/
}
.dd-item .up-caret {
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 10px solid #000;
  margin-bottom: 5px;
}