body, div{
  filter: brightness(1.3);
	display: flex; /* or display: flex; */
    	justify-content: space-between;
	flex-direction: column;
	flex-shrink: 1;
	flex-grow: 3;
	background: black;
	color: green;
  font-family: Verdana;
  font-size: 15px;

}



title, body {
	display: flex; /* or display: flex; */
	flex-direction: column;
	justify-content: center;
	text-align: left;
	background: black;
	color: green;
  max-width: 50rem;
  margin: 0 auto;
  padding: 0 1em;
}

/* @keyframes colorCycle { */
/*   0%   { color: red; } */
/*   25%  { color: blue; } */
/*   50%  { color: green; } */
/*   75%  { color: yellow; } */
/*   100% { color: red; } /1* Loop back to start *1/ */
/* } */

a {
  /* animation-name: colorCycle; */
  /* animation-duration: 10s; /1* Duration of one cycle of colors *1/ */
  /* animation-iteration-count: infinite; /1* Repeat the animation forever *1/ */
  color: #eee600;
}


.scroll-container {
  width: 100%; /* Set the width of the container */
  overflow-x: auto; /* Enable horizontal scrolling */
  white-space: nowrap; /* Prevent wrapping of child elements */
}

.scroll-item {
  display: inline-block; /* Inline-block for horizontal layout */
  width: 200px; /* Width of each child item */
  margin-right: 10px; /* Optional: space between items */
  padding: 1em;
  /* Additional styling for the items */
}

b {
  filter: brightness(1.7);
}


h2 {
  border-bottom: 1px solid #00FF00;
}

svg {
  width: 100%;
  font-family: serif;
}

/* Automatic numbered headers */
body {
  /* counter-reset: h2counter; */
}
h1 {
  counter-reset: h2counter -1;
}
h2 {
  counter-reset: h3counter -1;
}
h2:before {
  content: counter(h2counter) ".\0000a0\0000a0";
  counter-increment: h2counter;
}
h3:before {
  content: counter(h2counter) "." counter(h3counter) "\0000a0\0000a0";
  counter-increment: h3counter;
}
 


::highlight(custom-highlight-name) {
  color: #0c93d5
}

.green {
color: lime;
}
.red {
color: red;
}
.yellow {
color: yellow;
}
.cyan {
color: cyan;
}