*[data-project]:hover           { cursor: pointer; }

a                               { color: #060; }

blockquote                      { margin: 1rem 0; padding: 0 2rem; position: relative; }
blockquote:before               { color: #060; content: "\201D"; font-size: 4rem; left: 0; position: absolute; top: 0.8rem; }
blockquote:after                { bottom: 1rem; color: #060; content: "\201D"; font-size: 4rem; position: absolute; right: 0; }
blockquote cite                 { display: block; margin-top: 0.5em; }

body                            { background-color: #fff; color: #000; font-family: sans-serif; line-height: 1.5em; margin: 0; }

details                         { border: 0.5pt solid transparent; border-radius: 0.5rem; padding: 0.5em 0.5em 0; }
details summary                 { outline: none; }
details summary:hover           { cursor: pointer; }
details div                     { overflow-x: auto; overflow-y: hidden; padding: 0 0.5em; }
details[open]                   { background-color: #efe; border-color: #9c9; padding-bottom: 0.5em; }
details[open] summary           { border-bottom: 0.5pt dashed #9c9; padding-bottom: 0.5em; }

div.galerij                     { display: block; margin: 1rem auto 0; max-width: 100%; width: 30em; }

figure                          { margin: 0; }
figure img                      { height: auto; width: 100%; }
figure figcaption               { display: block; font-size: 0.8em; font-style: italic; line-height: 1em; text-align: center; }

footer                          { background-color: #efe; border-top: 0.5pt solid #9c9; color: #060; display: flex; flex-wrap: wrap; padding: 1rem 5vw; text-align: center; }
footer div                      { flex-grow: 1; min-width: 15em; }
footer span                     { display: block; }


header                          { background-color: #efe; border-bottom: 0.5pt solid #9c9; display: flex; font-size: min(8vw, 3em); height: 1.6em; padding: 0.5rem 0 0.4rem 5vw; position: sticky; top: 0; z-index: 10; }
header img                      { height: auto; margin-right: 0.4em; width: 1.6em; }
header h1                       { color: #060; font-size: 1em; line-height: 1em; margin: 0; }
header h1 span                  { color: #060; display: block; font-size: 0.4em; font-weight: normal; line-height: 1.6em; text-align: center; }

main                            { overflow: scroll; }

ol, ul                          { margin: 0; padding: 0.5em 0 0 1.5em; }
ol li, ul li                    { margin: 0 0 0.5em 0; }
ol ol                           { padding: 0 0 0 2em; }
ol ol li                        { margin: 0; }

p                               { margin: 0.5rem 0 0; }

p.aantal:before                 { content: "\21B3"; margin: 0 0.5rem 0 1rem; }
p.filter                        { display: none; position: relative; margin-bottom: 0.5em; }
p.filter:before                 { content: "\25BC"; left: 0.5em; pointer-events: none; position: absolute; top: 0.5em; }
p.filter select                 { appearance: none; background-color: #fff; border: 0.5pt solid #060; border-radius: 0.5em; box-sizing: border-box; font-size: 1em; margin: 0; padding: 0.5em 0.5em 0.5em 2em; width: 30rem; }

p.wachtwoord                    { position: relative; margin-bottom: 0.5em; }
p.wachtwoord:before             { content: "\2026"; left: 0.5em; pointer-events: none; position: absolute; top: 0.2em; }
p.wachtwoord input              { appearance: none; background-color: #fff; border: 0.5pt solid #060; border-radius: 0.5em; box-sizing: border-box; font-size: 1em; margin: 0; padding: 0.5em 0.5em 0.5em 2em; width: 30rem; }

section                         { padding: 1.5em 5vw; }
section:nth-child(even)         { background-color: #eee; }
section h2                      { color: #060; font-size: 1.4em; line-height: 1.2em; margin: 0 0 0.5em 0; }
section h2.introductie          { display: none; }
section h3                      { color: #060; font-size: 1.2em; line-height: 1.2em; margin: 1em 0 0.5em 0; }

section.fotos div               { display: flex; overflow: auto; width: 90vw; }
section.fotos div figure        { flex-shrink: 0; height: 14em; margin: 0 1em 0 0; width: 12em; }
section.fotos div figure img    { height: 12em; width: 12em; }

span                            { white-space: nowrap; }

table                           { border-collapse: collapse; margin-top: 0.5em; white-space: nowrap; width: 100%; }
table tr > *                    { border-color: #9c9; border-style: dotted; border-width: 0.5pt 0 0 0.5pt; padding: 0.3em 0.5em; }
table tr > *:first-child        { border-left-width: 0; }
table thead th                  { border-bottom-style: solid; border-width: 0 0 2pt 0.5pt; }
table tbody tr:hover            { background-color: #060; color: #fff; }
table tfoot th                  { border-top-style: solid; border-width: 2pt 0 0 0.5pt; }
table .kolom-beginsaldo         { text-align: right; }
table .kolom-eindsaldo          { text-align: right; }
table .kolom-ontvangen          { text-align: right; }
table .kolom-uitgegeven         { text-align: right; }
table .kolom-beginsaldo         { text-align: right; }
table .kolom-beginsaldo-bank    { text-align: right; }
table .kolom-beginsaldo-project { text-align: right; }
table .kolom-eindsaldo          { text-align: right; }
table .kolom-eindsaldo-bank     { text-align: right; }
table .kolom-eindsaldo-project  { text-align: right; }
table .kolom-gecontroleerd      { text-align: right; }
table .kolom-jaar               { text-align: left; } 
table .kolom-datum              { text-align: left; } 
table .kolom-project            { text-align: left; } 
table .kolom-referentie         { text-align: left; } 
table .kolom-boekingsnummer     { text-align: left; } 
table .kolom-beheerder          { text-align: left; } 
table td.kolom-referentie       { font-family: monospace; }
table td.kolom-boekingsnummer   { font-family: monospace; }

table.tabel-bestuur             { width: auto; }
table.tabel-bestuur thead       { display: none; }
table.tabel-bestuur tr.inactief { color: #999; }
table.tabel-bestuur td          { border-width: 0; }

@media print {
  body                          { margin-top: 15mm; }
  details[open]                 { background-color: #fff; border-color: transparent; }
  details:not([open])           { display: none; }
  details summary               { display: none; }
  footer                        { display: none; }
  header                        { background-color: #fff; border-bottom-width: 0; padding-left: 1rem; top: auto; }
  html                          { font-size: 8px; }
  h2                            { display: none; }
  p.wachtwoord                  { display: none !important; }
  section                       { display: none; padding: 0; }
  section.afdrukken             { background-color: #fff; display: block; padding-left: 0; padding-right: 0; }
  table tr > *                  { border-style: solid !important; }
}
