body { 
    background-color: #ccc;
    font-family: "Noto Serif", "Century Schoolbook", Georgia, Times, serif; 
    font-size: 1.5em; 
    margin: 0px;
    padding: 0px;
    /* min-width: 46rem;
    max-width: 72rem; */
}
a {
    text-decoration: none;
    color: #000;
    font-weight: normal;
}
a:link {
    color: #000080;
}
a:visited {
    color: #003;
}
a:hover {
    color: #cc7200;
}
/* div { 
    margin-top: 1rem; 
} */
h1 { 
    font-size: 2rem; 
}
h2 { 
    font-size: 1.5rem;
    font-weight: bold;
    margin: 1rem 0rem 0rem 0rem;
    padding: 0rem; 
}
h3 { 
    font-size: 1.25rem; margin: 0.25rem 0rem 0rem 0rem; 
}
dl {
    column-count: 3;
    column-gap: 0px;
    font-size: 1.1rem;
    font-weight: normal;    
}
figure, header { 
    text-align: center;
    margin: 0px;
}
figcaption { 
    font-size: 1rem; 
}
main {
    grid-area: main;
    border: 1px solid #eee;  
}
p { 
    orphans: 2; widows: 2; margin: 0rem;
    font-size: 1rem;
    max-width: 100%;
}
article,section {
    width: 100%;
    text-align: left;
    margin: 4px;
}
.align-center {
    text-align: center; 
}
.align-right {
    text-align: right; 
}
.cc2 {
    column-count: 2;
}
.container {
  display: grid;
  grid-template-columns: var(--width-nav-left) 1fr;
  grid-template-rows: 100%;
  grid-template-areas: "nav main";
}
.italic { 
    font-style: italic; 
}
.margin1 { 
    margin-left: 1rem;
}
.font-family-condensed { 
    letter-spacing: 0px;
}
.font-image { 
    height: 1.2rem;
    width: auto;
}
.letter-spacing {
  letter-spacing: 0.25rem;
}
.page-break-before {
    page-break-before: always;
}
.text-indent-1rem {
    text-indent: 1rem;
}
.text-indent-2rem {
    margin-left: 2rem;
    margin-right: 2rem;
}  
h2 a {
    font-weight: bold;
}
h2 a:hover {
    color: #000;
}
#keywords {
    column-count: 1;
    font-size: 1.1rem;
    font-weight: normal;
}
/* #main-doc {
    text-align: center;
    min-width: 480px;
} */
@media print {
    body, div {
        margin: 0rem;
    }
}
@media (max-width: 87.5rem) {
  ul {
    height: 196rem;
    grid-template-columns: 18rem 18rem 18rem;
  }
  .img-max-width {
    max-width: 54rem;
  }
  h1 {
    font-size: var(--fontsize-big);
  }
  h2 {
    font-size: var(--fontsize-medium);
  }
  h3 {
    font-size: var(--fontsize-base);
  }
  /*
  biggest / big / medium
  2       / 1.6 / 1.2
  --fontsize-fifth: 0.2rem;
  --fontsize-quarter: 0.25rem;
  --fontsize-half: 0.5rem;
  --fontsize-threequarters: 0.75rem;
  --fontsize-small: 0.8rem;
  --fontsize-smaller: 0.9rem;
  --fontsize-base: 1.0rem;
  --fontsize-medium: 1.2rem;
  --fontsize-medium-big: 1.4rem;
  --fontsize-big: 1.6rem;
  --fontsize-bigger: 1.8rem;
  --fontsize-biggest: 2.0rem;
  */
  .font-initial {
    font-size: var(--fontsize-smaller);
  }
  .fontsize-big {
    font-size: var(--fontsize-medium-big);
  }
  .fontsize-medium {
    font-size: var(--fontsize-base);
  }
  .fontsize-base {
    font-size: var(--fontsize-smaller);
  }
}
/* ---- */
@media (max-width: 69.5rem) {
  ul {
    height: 288rem;
    grid-template-columns: 18rem 18rem;
  }
  .img-max-width {
    max-width: 40rem;
  }
  .container {
    font-size: var(--fontsize-smaller);
  }
  .container {
    grid-template-columns: 100%;
    grid-template-rows: auto 1fr;
    grid-template-areas: "nav" "main";
  }
}
/* ---- */
@media (max-width: 51.5rem) {
  ul {
    height: 288rem;
    grid-template-columns: 18rem 18rem;
  }
  .img-max-width {
    max-width: 24rem;
  }
  img {
    height: 100px;
  }
  .slides-numbertext,
  .slides-text {
    font-size: var(--fontsize-smaller);
  }
}
/* ---- */
@media (max-width: 87.5rem) {
  ul {
    height: 196rem;
    grid-template-columns: 18rem 18rem 18rem;
  }
  .img-max-width {
    max-width: 54rem;
  }
  h1 {
    font-size: var(--fontsize-big);
  }
  h2 {
    font-size: var(--fontsize-medium);
  }
  h3 {
    font-size: var(--fontsize-base);
  }
  /*
  biggest / big / medium
  2       / 1.6 / 1.2
  --fontsize-fifth: 0.2rem;
  --fontsize-quarter: 0.25rem;
  --fontsize-half: 0.5rem;
  --fontsize-threequarters: 0.75rem;
  --fontsize-small: 0.8rem;
  --fontsize-smaller: 0.9rem;
  --fontsize-base: 1.0rem;
  --fontsize-medium: 1.2rem;
  --fontsize-medium-big: 1.4rem;
  --fontsize-big: 1.6rem;
  --fontsize-bigger: 1.8rem;
  --fontsize-biggest: 2.0rem;
  */
  .font-initial {
    font-size: var(--fontsize-smaller);
  }
  .fontsize-big {
    font-size: var(--fontsize-medium-big);
  }
  .fontsize-medium {
    font-size: var(--fontsize-base);
  }
  .fontsize-base {
    font-size: var(--fontsize-smaller);
  }
}
/* ---- */
@media (max-width: 69.5rem) {
  ul {
    height: 288rem;
    grid-template-columns: 18rem 18rem;
  }
  .img-max-width {
    max-width: 40rem;
  }
  .container {
    font-size: var(--fontsize-smaller);
  }
  .container {
    grid-template-columns: 100%;
    grid-template-rows: auto 1fr;
    grid-template-areas: "nav" "main";
  }
}
/* ---- */
@media (max-width: 51.5rem) {
  ul {
    height: 288rem;
    grid-template-columns: 18rem 18rem;
  }
  .img-max-width {
    max-width: 24rem;
  }
  img {
    height: 100px;
  }
  .slides-numbertext,
  .slides-text {
    font-size: var(--fontsize-smaller);
  }
}
/* ---- */
@media (max-width: 37.5rem) {
  ul {
    height: 540rem;
    grid-template-columns: 18rem;
  }
  h1 {
    font-size: var(--fontsize-big);
  }
  h2 {
    font-size: var(--fontsize-medium);
  }
  h3 {
    font-size: var(--fontsize-base);
  }
  img {
    height: 100px;
  }
  .container {
    font-size: var(--fontsize-smaller);
  }
  .font-initial {
    font-size: var(--fontsize-smaller);
  }
  .fontsize-big {
    font-size: var(--fontsize-medium-big);
  }
  .fontsize-medium {
    font-size: var(--fontsize-base);
  }
  .fontsize-base {
    font-size: var(--fontsize-smaller);
  }
}