/* ========================================================= FCBSB Shared Styles Used by: Home, Resources, Calendar, Performance, Affordability ========================================================= */ :root{ --maxw: 800px; --rule: #d9d9d9; --rule-soft: #ededed; --text: #111; --muted: #5a5a5a; } /* Base layout */ body{ font-family: Arial, sans-serif; margin: 0; padding: 20px; color: var(--text); background: #fff; } .container{ max-width: var(--maxw); width: 100%; text-align: left; margin: 0 auto; } /* Header */ .site-header{ width: 100%; margin: 0 auto 16px; } .site-header-inner{ display: flex; flex-direction: column; gap: 10px; } .site-brand{ display: block; margin: 0 auto; max-width: 100%; text-decoration: none; color: inherit; } .site-logo{ width: 100%; height: auto; max-width: 800px; object-fit: contain; display: block; margin: 0 auto; } .site-title{ display: none; } .site-nav{ display: flex; justify-content: center; gap: 24px; padding: 10px 0 4px; border-bottom: 1px solid #e6e6e6; width: 100%; } .nav-link{ text-decoration: none; color: inherit; padding: 6px 2px; font-weight: 500; border-bottom: 2px solid transparent; } .nav-link:hover{ border-bottom-color: #bbb; } .nav-link.is-active{ font-weight: 700; border-bottom-color: #000; } /* Headings & text */ h2{ font-size: 1.3rem; margin: 1.75em 0 0.5em 0; border-bottom: 1px solid #ccc; padding-bottom: 0.2em; } .container h2:first-of-type{ margin-top: 0.75em; } p{ margin: 0.4em 0 0.7em 0; line-height: 1.4; } p + ul{ margin-top: 0.2em; } .inline-label{ font-weight: bold; margin-right: 0.35em; white-space: nowrap; } ul{ margin: 0.1em 0 0.1em 0; padding-left: 20px; } ul li{ margin-top: 0.3em; line-height: 1.4; } mark a{ color: inherit; text-decoration: none; } mark a:hover{ text-decoration: underline; } .muted{ color: #666; } /* Buttons */ .expand-button{ margin-top: 0.5em; padding: 0.35em 0.8em; font-size: 0.9rem; cursor: pointer; } /* Emails list */ #recent-newsletters{ max-width: 700px; padding-left: 20px; } #recent-newsletters li.newsletter-item{ position: relative; overflow: hidden; white-space: nowrap; list-style-type: disc; } #recent-newsletters li.newsletter-item .fade-text{ display: inline-block; max-width: 100%; } #recent-newsletters li.newsletter-item::after{ content: ""; position: absolute; top: 0; right: 0; width: 80px; height: 100%; pointer-events: none; background: linear-gradient(to right, rgba(255,255,255,0), #ffffff); } /* Events */ .events{ margin: 24px 0; } .events-links{ margin: 6px 0 14px; } .events-links .sep{ margin: 0 6px; color: #888; } .events-list{ display: grid; gap: 12px; } .event-row{ display: grid; grid-template-columns: 140px 1fr; gap: 14px; padding: 10px 0; border-top: 1px solid #e6e6e6; } .event-row:first-child{ border-top: none; padding-top: 0; } .event-date{ font-weight: 750; white-space: nowrap; } .event-line{ margin: 2px 0; } .label{ font-weight: 700; } .events-toggle{ margin-top: 10px; padding: 0; border: none; background: none; text-decoration: underline; cursor: pointer; font: inherit; color: inherit; } @media (max-width: 700px){ body{ padding: 16px; } .event-row{ grid-template-columns: 1fr; gap: 6px; } .event-date{ white-space: normal; } } /* ========================================================= Series styling (extracted from your embedded