/* Define basic colors and lengths */ :root { --clrBackground0: #ffffff; --clrBackground1: #e8f0ff; --clrBackground2: #d0e0ff; --clrBackground3: #80a0ff; --clrHotBackground2: #ffd0e0; --clrHotBackground3: #ffa080; --clrHotForeground: #800000; --clrTextStd: #000000; --stdMaxWidth: 27cm; line-height: 1.3; font-family: Calibri, Arial, sans-serif; font-size: 12pt; background-color: var(--clrBackground1); color: var(--clrTextStd); text-align: justify; } @media print { :root { font-size: 10pt; background-color: white; --clrBackground3: #d0e0ff; } } /* Default styles of basic HTML elements */ p, h1, h2, h3, h4, h5, h6, ul, ol, dl, table, form { max-width: var(--stdMaxWidth); /* We cannot set max-width for , since tables and other elements then cannot expand beyond the body width */ min-width: 300px; margin-left: auto; /* Setting margin-left and margin-right to auto centers the elements by default */ margin-right: auto; } body { /* background-color: var(--clrBackground1); */ /* background-repeat: repeat; */ margin: auto; /* margin-top: 2ex; */ margin-bottom: 3ex; padding-left: 0.5em; padding-right: 0.5em; max-width: var(--stdMaxWidth); min-width: 300px; } h1 { text-align: center; font-weight: bold; font-size: 150%; margin-top: 4ex; border-top: 1px solid var(--clrBackground3); border-bottom: 1px solid var(--clrBackground3); background-color: var(--clrBackground2); padding: 0.75ex 0ex; } h2 { font-size: 110%; text-align: left; padding-top: 1ex; padding-bottom: 0.25ex; margin: 0; } h3 { font-size: 115%; text-align: left; padding-top: 2ex; } .todo { background: cyan; color: red; font-style: italics; } table.scoresheet { max-width: 100%; width: 100%; font-size: 8pt; border-collapse: collapse; margin-left: 0; /* margin-top: 1ex; */ margin-bottom: 1ex; } table.scoresheet th, table.scoresheet td { border: 1px solid black; text-align: center; height: 3em; padding-left: 0.2ex; padding-right: 0.2ex; padding-top: 0; padding-bottom: 0; } table.scoresheet th { background-color: var(--clrBackground3); } table.scoresheet th.vert { /* writing-mode: vertical-rl; */ writing-mode: sideways-lr; text-orientation: upright; } table.scoresheet th.grayed, table.scoresheet td.grayed { background-color: #c0c0c0; color: #808080; } .crosshatch { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPSc4JyBoZWlnaHQ9JzgnPgogIDxyZWN0IHdpZHRoPSc4JyBoZWlnaHQ9JzgnIGZpbGw9JyNmZmYnLz4KICA8cGF0aCBkPSdNMCAwTDggOFpNOCAwTDAgOFonIHN0cm9rZS13aWR0aD0nMC41JyBzdHJva2U9JyNhYWEnLz4KPC9zdmc+Cg=="); /* background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPSc4JyBoZWlnaHQ9JzgnPgo8cmVjdCB3aWR0aD0nOCcgaGVpZ2h0PSc4JyBmaWxsPScjZmZmJy8+CjxwYXRoIGQ9J00wIDBMOCA4Wk04IDBMMCA4Wicgc3Ryb2tlLXdpZHRoPScwLjUnIHN0cm9rZT0nI2JiYicvPgo8L3N2Zz4="); */ background-repeat: repeat; } table.scoresheet2 { } table.scoresheet2 th, table.scoresheet2 td { height: 2.5em; } table.scoresheet2 th:first-child { text-align: left; font-weight: normal; padding-left: 2ex; width: 85%; } table.scoresheet2 tr:last-child { border: 5px solid black; } table.scoresheet2 tr:last-child th { font-weight: bold; } table.guidelines { max-width: 100%; width: 100%; border-collapse: collapse; margin-left: 0; margin-top: 1ex; margin-bottom: 1ex; } table.guidelines .important { font-weight: bold; } table.guidelines .em { text-decoration: underline; } table.guidelines td, table.guidelines th { vertical-align: top; text-align: left; padding: 0.5ex; margin: 0; border: 1px solid var(--clrBackground3); } table.guidelines th { font-size: 120%; background-color: var(--clrBackground3); } table.guidelines td:nth-child(1) { /* white-space: nowrap; */ } table.guidelines td ul { margin-top: 0; margin-bottom: 0; } table.address td:nth-child(1) { text-align: center; padding-right: 0.2em; width: 0.2em; } table.address { max-width: 100%; border-collapse: collapse; margin-left: 0; margin-top: 1ex; margin-bottom: 1ex; } table.address td { vertical-align: top; text-align: left; padding: 0; margin: 0; } table.address td:nth-child(1) { text-align: center; padding-right: 0.2em; width: 0.2em; } /* Tables cells and paragraphs with explicit alignment */ td.c,th.c,p.c { text-align: center; } td.l,th.l,p.l { text-align: left; } td.r,th.r,p.r { text-align: right; } .timeline table { font-size: larger; font-weight: bold; /* border: 1px solid black; */ width: 100%; } .timeline td { width: 50%; text-align: left; margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; } .timeline td:nth-child(2) { text-align: right; } .timeline.hot td:nth-child(2) { color: red; } .timeline.past td:nth-child(2) { font-style: italic; font-weight: normal; }