 body {
    font-family: Tahoma, sans-serif;
    line-height: 1.6;
    margin: 0;
    padding: 0;
    background-color: #000000;
    color: #aaaaaa;
    text-align: left;
}
a {
  color: #aaaaaa;
}

header {
    background: #000000;
    color: #fff;
    text-align: center;
    margin: 0;
    padding: 0;
}

main {
    padding: 2rem;
}

footer {
    background: #000000;
    color: #bbb;
    text-align: center;
    margin: 0;
    padding: 0;
    position: relative;
    bottom: 0;
    width: 100%;
}
.img-wide {
  max-width: 400px;
  height: auto; /* Maintain aspect ratio */
  display: block; /* Remove extra space below the image */
  margin: 0 auto; /* Center the image horizontally (optional) */
}
.img-tall {
  max-height: 200px;
  width: auto; /* Maintain aspect ratio */
  display: block; /* Remove extra space below the image */
  margin: 0 auto; /* Center the image horizontally (optional) */
}
.title {
    text-align: center;
}
.waves {
    color: #2585FA;
}
.red {
    text-color: #FA3825;
    color: #FA3825;  
}
details {
    margin: 5px 25% 15px 25%; /*   top,   right,   bottom,   left */
  }
.collapsible {
  background-color: #000;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
}
.active, .collapsible:hover {
  background-color: #ccc;
}
.collapsible-content {
  padding: 0 18px;
  display: none;
  overflow: hidden;
  background-color: #000;
}
summary {
 font-size: 1.5em;
}
.grid-col-1-2-container {
  display: grid;
  grid-template-columns: 1fr 1fr; /* Two equal-width columns */
   /*place-items: center; Center horizontally and vertically within each grid cell */
   /* height: 100vh; Example: Take full viewport height for vertical centering */
}
.grid-col-1{
  padding: 5px;
  border: 0px solid var(--bg-color);
  text-align: right;
  white-space: pre;
  font-style: italic;
}
.grid-col-2{
  padding: 5px;
  border: 0px solid var(--bg-color);
  text-align: left;
  white-space: pre;
}
.credits-subtitle {
 font-size: 1.5em;
 text-align: center;
 font-style: bold;
}
.credits-one-col {
  padding: 5px;
  border: 0px solid var(--bg-color);
  text-align: center;
  white-space: pre;
}
a:link {
  color: white;
  background-color: transparent;
  text-decoration: none;
}
a:visited {
  color: white;
  background-color: transparent;
  text-decoration: none;
}
a:hover {
  color: red;
  background-color: transparent;
  text-decoration: underline;
}
a:active {
  color: yellow;
  background-color: transparent;
  text-decoration: underline;
}
