/*
 * Starsze strony (ukladu z tabelami o stalej szerokosci, np. realizacje.html, zaliczenie.html, programjokes.html): ten sam wyglad,
 * ale na ekranie telefonu lub tabletu tresc zajmuje cala szerokosc, menu laduje poziomo nad trescia, obrazy sie skaluja.
 */
@media (max-width: 900px) {
   img { max-width: 100%; height: auto; }
   body { overflow-wrap: break-word; word-wrap: break-word; }
   pre { white-space: pre-wrap; overflow-x: auto; max-width: 100%; }
   ul, ol, li, p, a, td, h1, h2, h3 { overflow-wrap: anywhere; }
   select, input[type="text"], textarea { max-width: 100%; box-sizing: border-box; }
   ul, ol { max-width: 100%; padding-left: 1.2em; }
   p { max-width: 100%; }
   body { background-size: 700px auto; background-position: center top; margin: 8px; }
   table#gora, table#dol { position: static !important; width: 100% !important; box-sizing: border-box; }
   table#gora { margin-top: 28px; }
   table#dol { margin-top: 70px; }
   table#gora, table#gora tbody, table#gora tr, table#gora td,
   table#dol, table#dol > tbody, table#dol > tbody > tr, table#dol > tbody > tr > td,
   table#dol table, table#dol table tbody, table#dol table tr, table#dol table td { display: block; width: auto !important; box-sizing: border-box; }
   table#gora td[width], table#dol > tbody > tr > td[width] { display: none; }
   table#dol > tbody > tr > td:first-child { display: flex !important; flex-wrap: wrap; justify-content: center; gap: 2px 18px; text-align: center; padding: 0; }
   table#dol > tbody > tr > td:first-child p { margin: 0 !important; padding: 4px 0; }
   table#dol br { display: none; }
   h1 { font-size: 20pt !important; line-height: 1.15; }
   * { font-size: 12pt; }
   h1, h1 * { font-size: 20pt; }
   p, td { text-align: left !important; }
}