:root {
  color-scheme: light dark;
}

body { font-family:verdana,sans-serif; font-size: 1em; text-align: auto; background-color:white; color:black;}



img {
  max-width: 100%;
  height: auto;
}



div {
max-width: 100%;
/* border: 1px solid green; */

}

/* ============== Die Handy-Regeln ===============  */

@media only screen and (max-width: 600px) {div {width: 100%}}

.flex {
max-width: 100%;
/* border: 1px dotted red; */ 
display: flex;

/* justify-content: center; */
  align-items: stretch;
  
}
@media only screen and (max-width: 600px) {.flex {display: flex; flex-wrap: wrap;}}

.flex > * {

display:grid; grid-template-rows: subgrid;
      }

/* ============== Die Darkmode-Regeln ===============  */

@media (prefers-color-scheme: dark) {
:root {
  color-scheme: dark;
}

body { font-family: Verdana, sans-serif; font-size: 1em; text-align: auto; background-color:black; color:white;}
.blur {background: rgba(0,0,0,0.7);}
.overlay {
background-color: rgba(32,32,32,0.95);
border: 1px darkgrey dotted;
border-radius: 5px;
padding: 2px;
box-shadow: 0px 0px 15px 0px rgba(200,200,200,0.75);
}
}