/* ===================================================================== Print / PDF stylesheet — turns selected letters into a keepsake book. Applied via and when has class "printing". Target: US Letter, home printers, and "Save as PDF". ===================================================================== */ @page { size: letter; margin: 0.85in 0.8in; } @media print { /* Hide everything that isn't the print collection. */ body * { visibility: hidden !important; } #printRoot, #printRoot * { visibility: visible !important; } #printRoot { display: block !important; position: absolute; left: 0; top: 0; width: 100%; } /* Kill screen chrome */ .no-print, nav, header.hero, .toolbar, .adminbar, .filters, .btn, button, .previews, .card.success { display: none !important; } html, body { background: #fff !important; color: #201a18 !important; font-size: 12pt; } a { color: inherit !important; text-decoration: none !important; } } /* ---- Shared print-layout look (also used for on-screen preview) ---- */ #printRoot { font-family: "Playfair Display", Georgia, "Times New Roman", serif; color: #201a18; } .print-page { page-break-after: always; break-after: page; position: relative; padding: 6px; } .print-page:last-child { page-break-after: auto; break-after: auto; } /* ---- Cover page ---- */ .cover { height: 9in; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; } .cover .flourish { color: #c39b45; font-size: 26pt; margin-bottom: 8pt; } .cover .cover-title { font-size: 40pt; font-style: italic; color: #7f2b3e; margin: 0 0 30pt; line-height: 1.1; } .cover .celebrating { font-size: 14pt; letter-spacing: 2pt; text-transform: uppercase; color: #6b5d55; } .cover .cover-names { font-size: 30pt; margin: 10pt 0; color: #201a18; } .cover .cover-sub { font-size: 16pt; color: #7f2b3e; margin-top: 6pt; } .cover .cover-date { font-size: 14pt; color: #6b5d55; margin-top: 22pt; } .cover .cover-rule { width: 120pt; height: 1.5pt; background: #c39b45; margin: 22pt auto; } /* ---- Table of contents ---- */ .toc h2 { font-size: 24pt; color: #7f2b3e; text-align: center; margin-bottom: 20pt; font-style: italic; } .toc ol { list-style: none; padding: 0; max-width: 5.6in; margin: 0 auto; font-size: 13pt; } .toc li { display: flex; justify-content: space-between; padding: 5pt 0; border-bottom: 1px dotted #cbb98f; } /* ---- A letter ---- */ .letter-page { display: flex; flex-direction: column; } .letter-head { text-align: center; margin-bottom: 18pt; } .letter-head .to { font-size: 12pt; color: #6b5d55; font-style: italic; } .letter-head .happy { font-size: 22pt; color: #7f2b3e; font-style: italic; margin: 4pt 0; } .letter-head .from { font-size: 15pt; color: #201a18; margin-top: 6pt; } .letter-head .from b { font-weight: 700; } .letter-head .mini-rule { width: 80pt; height: 1pt; background: #c39b45; margin: 12pt auto 0; } .letter-body { font-size: 13.5pt; line-height: 1.7; white-space: pre-wrap; word-wrap: break-word; font-family: Georgia, "Times New Roman", serif; /* Avoid splitting the letter across pages when it reasonably fits. */ orphans: 3; widows: 3; } .letter-sign { margin-top: 16pt; font-size: 13pt; font-style: italic; color: #4a3d38; text-align: right; } .letter-sign b { font-style: normal; } /* ---- Photos in print ---- */ .print-photos { margin-top: 20pt; display: grid; gap: 12pt; } .print-photos.one { grid-template-columns: 1fr; } .print-photos.two { grid-template-columns: 1fr 1fr; } .print-photos.many { grid-template-columns: 1fr 1fr; } .print-photo { break-inside: avoid; page-break-inside: avoid; text-align: center; } .print-photo img { max-width: 100%; max-height: 4.2in; object-fit: contain; border: 1px solid #e6dccb; padding: 5pt; background: #fff; border-radius: 2px; } .print-photos.one .print-photo img { max-height: 5.2in; } .print-photo .cap { font-size: 10.5pt; color: #6b5d55; font-style: italic; margin-top: 4pt; } /* Page number footer for printed pages */ .print-page .pageno { position: absolute; bottom: -0.45in; left: 0; right: 0; text-align: center; font-size: 9pt; color: #9a8b80; font-family: Georgia, serif; }