/* ============================================================ 7/20 MEMORIAL FOUNDATION - SITEWIDE CSS (CONSOLIDATED MASTER) Merged: live Developer CSS (July 2026) + homepage native block updates (The Thirteen links, Continued Work v2, Support close). CONTENTS 1. Foundation 2. Shared patterns 3. Remember (soft) 4. Our Story 5. Crane Project 6. Support 7. Get Involved 8. Homepage ============================================================ */ /* ============================================================ 1. FOUNDATION ============================================================ */ body { background-color: #faf8f5 !important; } html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; scroll-behavior: smooth; } ::selection { background: rgba(91, 184, 212, 0.25); color: #252560; } /* ---- ANCHOR TARGETS ---- Native blocks can't take an id, so to make a native section linkable, paste a one-line HTML Widget directly ABOVE it:
Custom HTML sections carry their own id and scroll-margin already. scroll-margin-top keeps a sticky nav from covering the heading. */ .anchor{ display: block; height: 0; scroll-margin-top: 90px; } [class*="block_"]{ scroll-margin-top: 90px; } [class*="block_"] { position: relative !important; z-index: 2 !important; } .navContent ul li ul, .navContent ul li:first-child ul { max-width: 471px; } .j-nav__dropdown { z-index: 100 !important; } /* ---- Global typography (default = memorial serif, the safe baseline) ---- */ .blockContent.layoutA h2, .blockContent.layoutA h3 { font-family: 'adobe-garamond-pro', 'Georgia', 'Times New Roman', serif !important; font-weight: 400 !important; font-style: normal !important; color: #252560 !important; line-height: 1.18 !important; letter-spacing: -0.015em !important; text-wrap: balance; } .blockContent.layoutA h2 { margin-top: 20px !important; margin-bottom: 28px !important; text-align: center; } .blockContent.layoutA p, .blockContent.layoutA li { font-family: 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-size: 17px !important; line-height: 1.75 !important; color: #3a3a5c !important; opacity: 1 !important; margin-bottom: 20px !important; } .blockContent.layoutA .j-simpleList__descr { color: #6c6c88 !important; } /* PROSE LINKS ONLY — scoped July 2026. Previously this was `.blockContent a:not(.scEditable--plainText)`, which caught EVERY link inside a block: cards, metric rows, agenda rows and pill buttons in custom HTML widgets all inherited teal text, a 2px teal border-bottom and 1px of phantom bottom padding. Widgets had to fight it with !important on every rule. Now it targets only links inside body copy — paragraphs, list items and Simple List descriptions — which is what it was always for. Structural links in custom widgets style themselves. */ .blockContent p a:not(.scEditable--plainText), .blockContent li a:not(.scEditable--plainText), .blockContent .j-simpleList__descr a:not(.scEditable--plainText) { color: #3aa8a0 !important; text-decoration: none !important; border-bottom: 2px solid rgba(58, 168, 160, 0.3); padding-bottom: 1px; transition: border-color 200ms cubic-bezier(0.25, 0.1, 0.25, 1); } .blockContent p a:not(.scEditable--plainText):hover, .blockContent li a:not(.scEditable--plainText):hover, .blockContent .j-simpleList__descr a:not(.scEditable--plainText):hover { border-color: #3aa8a0 !important; } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } } @media (max-width: 768px) { .blockContent.layoutA { padding-left: 24px; padding-right: 24px; } } /* ORIGAMI KIT — paper grain (sitewide) */ body::before{ content:""; position:fixed; inset:0; pointer-events:none; z-index:9999; opacity:.5; mix-blend-mode:multiply; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"); } /* ============================================================ 2. SHARED PATTERNS ============================================================ */ /* ---- Packery override ---- */ .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .item.itemPreview, .block_a3c1f4febe3e4a72899d123025ab3aa0 .item.itemPreview, .block_b5daa774404a4b11a1ac4cc891f56507 .item.itemPreview, .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview, .block_d62a727149c940c2ae6052690683c9b2 .item.itemPreview, .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview, .block_a5aae64498924deb9bd7da2ff28d7a02 .item.itemPreview, .block_f9198cf57a4340f58f42c27d4129c5aa .item.itemPreview, .block_fce170a2191942bdb22613bc5c3001d7 .item.itemPreview, .block_b467f4c2a85d496589cc27b566d360bb .item.itemPreview, /* REMEMBER PAGE — added July 2026. These three were missing, which is why The Thirteen, the dedication timeline and the bench carousel rendered as blank space: Packery pins every item with position:absolute and computed left/top, and with no reset the container collapses to nothing. */ .block_cca878d7c98244439df50aa4f0975085 .item.itemPreview, .block_c1d3f2d244d44c2d963b40066929d6ca .item.itemPreview, .block_e5345a03e69540a3bd933dafa2a75174 .item.itemPreview, /* GET INVOLVED — the events widget. Same packery behaviour as every Simple List on the site, so it takes the same reset. */ .block_a3581cb48c6b45c890582e8de35708af .item.itemPreview, .home-events .item.itemPreview { position: relative !important; left: auto !important; top: auto !important; } /* ---- Editorial card surface ---- */ .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .item.itemPreview, .block_a3c1f4febe3e4a72899d123025ab3aa0 .item.itemPreview, .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview, .block_d62a727149c940c2ae6052690683c9b2 .item.itemPreview { background: #ffffff !important; border: 1px solid rgba(37, 37, 96, 0.10) !important; border-radius: 12px !important; box-shadow: none !important; transition: transform 200ms cubic-bezier(0.25, 0.1, 0.25, 1), box-shadow 200ms cubic-bezier(0.25, 0.1, 0.25, 1) !important; } .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .item.itemPreview:hover, .block_a3c1f4febe3e4a72899d123025ab3aa0 .item.itemPreview:hover, .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview:hover, .block_d62a727149c940c2ae6052690683c9b2 .item.itemPreview:hover { transform: translateY(-4px) !important; box-shadow: 0 14px 34px rgba(37, 37, 96, 0.12) !important; } @media (max-width: 768px) { .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .item.itemPreview, .block_a3c1f4febe3e4a72899d123025ab3aa0 .item.itemPreview, .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview, .block_d62a727149c940c2ae6052690683c9b2 .item.itemPreview, .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview, .block_a5aae64498924deb9bd7da2ff28d7a02 .item.itemPreview, .block_f9198cf57a4340f58f42c27d4129c5aa .item.itemPreview, .block_b467f4c2a85d496589cc27b566d360bb .item.itemPreview, .home-events .item.itemPreview { width: 100% !important; max-width: 100% !important; flex: 1 1 100% !important; } } /* ============================================================ 3. REMEMBER PAGE (MEMORIAL VOICE — unchanged / soft) ============================================================ */ #ascentiate-bg { background-position: center top !important; } @media (min-width: 1024px) { #ascentiate-bg { background-size: cover !important; } } .block_fb135a00b4604a1baa66eef9cd7d1ca7 { max-width: 780px !important; margin: 0 auto !important; padding: 80px 40px 24px !important; text-align: center !important; } .block_fb135a00b4604a1baa66eef9cd7d1ca7 h2, .block_fb135a00b4604a1baa66eef9cd7d1ca7 h3 { font-size: clamp(30px, 4.5vw, 42px) !important; margin-bottom: 28px !important; } .block_fb135a00b4604a1baa66eef9cd7d1ca7 p { margin-bottom: 20px !important; text-align: left !important; } .block_fb135a00b4604a1baa66eef9cd7d1ca7 p:first-of-type { font-size: 19px !important; text-align: center !important; font-weight: 300 !important; color: #252560 !important; margin-bottom: 32px !important; } .block_aa058c369f684d4d99ef70066d1d871a { max-width: 680px !important; margin: 10px auto 40px !important; padding: 32px 40px !important; text-align: center !important; } .block_aa058c369f684d4d99ef70066d1d871a p { font-family: 'adobe-garamond-pro', 'Georgia', 'Times New Roman', serif !important; font-size: 20px !important; font-style: italic !important; line-height: 1.7 !important; color: #9b84c4 !important; margin: 0 !important; } .block_d0df349bdf634e1e889fc2cde8afdb75 { max-width: 680px !important; margin: 0 auto 50px !important; padding: 0 40px !important; text-align: center !important; } .block_d0df349bdf634e1e889fc2cde8afdb75 p { font-size: 14px !important; color: #6c6c88 !important; letter-spacing: 0.5px; } .block_f05a1b27b571416abff1e922a1f41e72 { max-width: 100% !important; margin: 0 auto 60px !important; padding: 0 !important; } .block_d6fc9720445e49879b6788f528c87603 { text-align: center !important; margin: 100px auto 50px !important; padding: 0 24px !important; } .block_d6fc9720445e49879b6788f528c87603 h2, .block_d6fc9720445e49879b6788f528c87603 h3 { font-size: clamp(30px, 4.5vw, 42px) !important; margin: 0 !important; } /* ---- THE THIRTEEN · upgraded July 2026 ---------------------- Native Simple List, 12 items (13 lives — Veronica Moser-Sullivan and her unborn sibling share one page). Four-across grid, circular portraits on a soft brand field, Garamond names, ages in small caps, and a "Remember →" line generated on hover so nobody types it twelve times. Simple List fields: Image = portrait · Title/link = name → bio page Description = "Age 26" LOCKED: no excerpts, no pulled quotes, zero transactional elements near this block. Heather approves the treatment before publish. */ .block_cca878d7c98244439df50aa4f0975085 { max-width: 1180px !important; margin: 30px auto 60px !important; padding: 0 24px !important; } /* FLEX, not grid. Websites 360 nests .j-simpleList inside .itemsCollectionContent — with grid on both, the inner container becomes one grid item and collapses into a quarter of the width. Every working section in this file uses flex for that reason. Portrait size is fixed rather than fluid so the circles can't balloon on wide screens. */ .block_cca878d7c98244439df50aa4f0975085 .itemsCollectionContent, .block_cca878d7c98244439df50aa4f0975085 .j-simpleList { display: flex !important; flex-wrap: wrap !important; gap: 48px 34px !important; justify-content: center !important; max-width: 1000px !important; height: auto !important; margin: 0 auto !important; padding: 0 !important; } .block_cca878d7c98244439df50aa4f0975085 .item.itemPreview { flex: 0 0 200px !important; max-width: 200px !important; text-align: center; background: none !important; box-shadow: none !important; border: none !important; padding: 0 !important; } .block_cca878d7c98244439df50aa4f0975085 img.contentImg { width: 168px !important; height: 168px !important; border-radius: 50% !important; object-fit: cover; border: none !important; background: linear-gradient(150deg, rgba(91,184,212,.30), rgba(155,132,196,.30)) !important; box-shadow: 0 0 0 1px rgba(37, 37, 96, .07) !important; display: block; margin: 0 auto !important; transition: box-shadow 350ms ease, transform 350ms ease; } .block_cca878d7c98244439df50aa4f0975085 .item.itemPreview:hover img.contentImg { box-shadow: 0 0 0 3px rgba(155, 132, 196, .55) !important; transform: translateY(-4px); } .block_cca878d7c98244439df50aa4f0975085 .item.itemPreview a.scEditable--plainText { font-family: 'adobe-garamond-pro', 'Georgia', 'Times New Roman', serif !important; font-size: clamp(19px, 1.7vw, 22px) !important; font-weight: 400 !important; line-height: 1.32 !important; color: #252560 !important; text-decoration: none !important; display: block; margin: 20px 0 4px !important; text-wrap: balance; } .block_cca878d7c98244439df50aa4f0975085 .item.itemPreview .j-simpleList__descr, .block_cca878d7c98244439df50aa4f0975085 .item.itemPreview p { font-size: 13px !important; font-weight: 600 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; color: #6c6c88 !important; margin: 0 !important; } .block_cca878d7c98244439df50aa4f0975085 .item.itemPreview::after { content: "Remember \2192"; display: block; font-family: 'adobe-garamond-pro', 'Georgia', serif; font-size: 15.5px; color: #9b84c4; margin-top: 12px; opacity: 0; transform: translateY(-4px); transition: opacity 300ms ease, transform 300ms ease; } .block_cca878d7c98244439df50aa4f0975085 .item.itemPreview:hover::after { opacity: 1; transform: none; } .block_e87f514cbecf4458875a119f7a2924be { max-width: 640px !important; margin: 40px auto 60px !important; padding: 0 24px !important; text-align: center !important; } .block_e87f514cbecf4458875a119f7a2924be p, .block_e87f514cbecf4458875a119f7a2924be blockquote { font-family: 'adobe-garamond-pro', 'Georgia', 'Times New Roman', serif !important; font-size: 18px !important; font-style: italic !important; line-height: 1.7 !important; color: #9b84c4 !important; margin: 0 !important; } .block_c1d3f2d244d44c2d963b40066929d6ca { max-width: 800px !important; margin: 60px auto !important; padding: 0 24px !important; } .block_c1d3f2d244d44c2d963b40066929d6ca a[href*="dedication"] { color: #3aa8a0 !important; border: 1.5px solid #3aa8a0 !important; border-radius: 6px !important; padding: 12px 28px !important; display: inline-block !important; } .block_c1d3f2d244d44c2d963b40066929d6ca a[href*="dedication"]:hover { color: #ffffff !important; background: #3aa8a0 !important; border-color: #3aa8a0 !important; } .block_e5345a03e69540a3bd933dafa2a75174 { max-width: 100% !important; margin: 40px 0 60px !important; padding: 48px 24px !important; background: linear-gradient(135deg, rgba(91, 184, 212, 0.06), rgba(58, 168, 160, 0.06)) !important; border-top: 1px solid rgba(91, 184, 212, 0.1); border-bottom: 1px solid rgba(91, 184, 212, 0.1); } .block_f793795313054ff38767baa28cfd1820 { max-width: 100% !important; margin: 0 !important; padding: 0 !important; } @media (max-width: 768px) { .block_fb135a00b4604a1baa66eef9cd7d1ca7 { padding: 50px 24px 20px !important; } .block_cca878d7c98244439df50aa4f0975085 .itemsCollectionContent, .block_cca878d7c98244439df50aa4f0975085 .j-simpleList { gap: 36px 26px !important; } .block_cca878d7c98244439df50aa4f0975085 .item.itemPreview { flex: 0 0 150px !important; max-width: 150px !important; } .block_cca878d7c98244439df50aa4f0975085 img.contentImg { width: 128px !important; height: 128px !important; } .block_e5345a03e69540a3bd933dafa2a75174 { padding: 32px 16px !important; } } @media (max-width: 620px) { .block_cca878d7c98244439df50aa4f0975085 .itemsCollectionContent, .block_cca878d7c98244439df50aa4f0975085 .j-simpleList { gap: 30px 18px !important; } .block_cca878d7c98244439df50aa4f0975085 .item.itemPreview { flex: 0 0 128px !important; max-width: 128px !important; } .block_cca878d7c98244439df50aa4f0975085 img.contentImg { width: 112px !important; height: 112px !important; } .block_cca878d7c98244439df50aa4f0975085 .item.itemPreview a.scEditable--plainText { font-size: 17px !important; } /* touch devices have no hover — show the line always */ .block_cca878d7c98244439df50aa4f0975085 .item.itemPreview::after { opacity: 1; transform: none; } } /* ============================================================ 4. OUR STORY PAGE (ENERGY voice on headings; warm body) ============================================================ */ /* Origin story — energy heading, soft opening line preserved */ .block_d0c224bec26a4b82b864a51441a4a903 { max-width: 780px !important; margin: 80px auto 50px !important; padding: 0 40px 24px !important; text-align: center !important; } .block_d0c224bec26a4b82b864a51441a4a903 h2, .block_d0c224bec26a4b82b864a51441a4a903 h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; font-size: clamp(34px, 5.5vw, 52px) !important; line-height: 1.02 !important; margin-bottom: 32px !important; } .block_d0c224bec26a4b82b864a51441a4a903 p { text-align: left !important; } .block_d0c224bec26a4b82b864a51441a4a903 p:first-of-type { font-size: 19px !important; color: #252560 !important; text-align: center !important; font-weight: 300 !important; margin-bottom: 32px !important; } /* Mission statement (tinted panel) */ .block_fe0b84b5c33448cc8823253af32847f3 { max-width: 680px !important; margin: 40px auto 60px !important; padding: 40px 32px !important; text-align: center !important; background: linear-gradient(135deg, rgba(91, 184, 212, 0.10), rgba(58, 168, 160, 0.10)) !important; border-radius: 16px; } .block_fe0b84b5c33448cc8823253af32847f3 h2, .block_fe0b84b5c33448cc8823253af32847f3 h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; color: #3aa8a0 !important; font-size: 22px !important; letter-spacing: 0.06em; text-transform: uppercase; } .block_fe0b84b5c33448cc8823253af32847f3 p { font-size: 18px !important; font-weight: 300 !important; } /* Cultural Heritage Site (callout panel) */ .block_e98a6767197f47649408d9a02088646d { max-width: 720px !important; margin: 0 auto 50px !important; padding: 32px 40px !important; background: rgba(255, 255, 255, 0.85) !important; border-left: 4px solid #9b84c4 !important; border-radius: 0 12px 12px 0 !important; box-shadow: 0 4px 20px rgba(37, 37, 96, 0.06) !important; } .block_e98a6767197f47649408d9a02088646d h2, .block_e98a6767197f47649408d9a02088646d h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; color: #9b84c4 !important; font-size: 23px !important; letter-spacing: -0.01em !important; } /* Section headings (Core Values, Programs) — energy */ .block_ac14972a93a04d9c843c012e0fbf234d, .block_ce59cd50aca34c969a78e4103ef11986 { text-align: center !important; margin: 60px auto 20px !important; padding: 0 24px !important; } .block_ac14972a93a04d9c843c012e0fbf234d h2, .block_ac14972a93a04d9c843c012e0fbf234d h3, .block_ce59cd50aca34c969a78e4103ef11986 h2, .block_ce59cd50aca34c969a78e4103ef11986 h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; font-size: clamp(28px, 4vw, 38px) !important; margin: 0 !important; } /* Core Values - card grid */ .block_c0ac0e2f8acd4a84b7646e2ca4b4716d { margin: 20px auto 60px !important; padding: 0 24px !important; } .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .itemsCollectionContent, .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .j-simpleList { display: flex !important; flex-wrap: wrap !important; gap: 28px !important; justify-content: center !important; max-width: 960px !important; margin: 0 auto !important; padding: 0 !important; height: auto !important; } .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .item.itemPreview { flex: 1 1 270px; max-width: 300px; padding: 36px 28px 32px !important; text-align: center; } .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .item.itemPreview:nth-child(1) { border-top: 5px solid #5bb8d4 !important; } .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .item.itemPreview:nth-child(2) { border-top: 5px solid #3aa8a0 !important; } .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .item.itemPreview:nth-child(3) { border-top: 5px solid #9b84c4 !important; } .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .item.itemPreview a.scEditable--plainText { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; font-size: 22px !important; font-style: normal !important; letter-spacing: -0.01em !important; color: #252560 !important; text-decoration: none !important; display: block; margin-bottom: 16px; } .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .item.itemPreview .j-simpleList__descr, .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .item.itemPreview p { font-size: 15px !important; line-height: 1.7 !important; text-align: left; color: #3a3a5c !important; } /* Programs - card grid */ .block_a3c1f4febe3e4a72899d123025ab3aa0 { margin: 20px auto 80px !important; padding: 0 24px !important; } .block_a3c1f4febe3e4a72899d123025ab3aa0 .itemsCollectionContent, .block_a3c1f4febe3e4a72899d123025ab3aa0 .j-simpleList { display: flex !important; flex-wrap: wrap !important; gap: 24px !important; justify-content: center !important; max-width: 1000px !important; margin: 0 auto !important; padding: 0 !important; height: auto !important; } .block_a3c1f4febe3e4a72899d123025ab3aa0 .item.itemPreview { flex: 1 1 220px; max-width: 240px; padding: 32px 24px !important; text-align: center; } .block_a3c1f4febe3e4a72899d123025ab3aa0 img.contentImg { width: 64px !important; height: 64px !important; object-fit: contain; border-radius: 0 !important; margin: 0 auto 16px; display: block; } .block_a3c1f4febe3e4a72899d123025ab3aa0 .item.itemPreview a.scEditable--plainText { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; font-size: 18px !important; font-style: normal !important; letter-spacing: -0.01em !important; color: #252560 !important; text-decoration: none !important; display: block; margin-bottom: 10px; } .block_a3c1f4febe3e4a72899d123025ab3aa0 .item.itemPreview .j-simpleList__descr, .block_a3c1f4febe3e4a72899d123025ab3aa0 .item.itemPreview p { font-size: 14px !important; line-height: 1.6 !important; } /* Board of Directors heading — energy */ .block_f59d81ac9cda4dff8ad10589898956a7 { text-align: center !important; margin: 80px auto 30px !important; padding: 0 24px !important; } .block_f59d81ac9cda4dff8ad10589898956a7 h2, .block_f59d81ac9cda4dff8ad10589898956a7 h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; font-size: clamp(28px, 4vw, 38px) !important; margin: 0 !important; } /* Leadership - portrait grid (names stay in dignified serif) */ .block_b5daa774404a4b11a1ac4cc891f56507 { margin: 20px auto 80px !important; padding: 0 24px !important; } .block_b5daa774404a4b11a1ac4cc891f56507 .itemsCollectionContent, .block_b5daa774404a4b11a1ac4cc891f56507 .j-simpleList { display: flex !important; flex-wrap: wrap !important; gap: 40px 32px !important; justify-content: center !important; max-width: 900px !important; margin: 0 auto !important; padding: 0 !important; height: auto !important; } .block_b5daa774404a4b11a1ac4cc891f56507 .item.itemPreview { flex: 0 0 190px; text-align: center; background: none !important; box-shadow: none !important; border: none !important; padding: 0 !important; } .block_b5daa774404a4b11a1ac4cc891f56507 img.contentImg { width: 120px !important; height: 120px !important; border-radius: 50% !important; object-fit: cover; border: 3px solid #5bb8d4 !important; display: block; margin: 0 auto 12px; } .block_b5daa774404a4b11a1ac4cc891f56507 .item.itemPreview a.scEditable--plainText { font-family: 'adobe-garamond-pro', 'Georgia', 'Times New Roman', serif !important; font-size: 17px !important; color: #252560 !important; text-decoration: none !important; display: block; margin-bottom: 4px; } .block_b5daa774404a4b11a1ac4cc891f56507 .item.itemPreview .j-simpleList__descr, .block_b5daa774404a4b11a1ac4cc891f56507 .item.itemPreview p { font-size: 13px !important; color: #3aa8a0 !important; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; } .block_cac30d9164704bb19873cc766ccc071d { max-width: 680px !important; margin: 60px auto !important; padding: 40px 24px 24px !important; text-align: center !important; border-top: 1px solid rgba(58, 168, 160, 0.12); } .block_ad6a4bddfd2540f6bb31a46432651c24 { max-width: 600px !important; margin: 50px auto 60px !important; padding: 32px !important; text-align: center !important; background: linear-gradient(135deg, rgba(58, 168, 160, 0.06), rgba(91, 184, 212, 0.06)) !important; border-radius: 12px; } @media (max-width: 768px) { .block_d0c224bec26a4b82b864a51441a4a903 { margin: 50px auto 30px !important; padding: 0 24px !important; } .block_e98a6767197f47649408d9a02088646d { margin: 0 16px 40px !important; padding: 28px 24px !important; } .block_c0ac0e2f8acd4a84b7646e2ca4b4716d .j-simpleList { flex-direction: column; align-items: center; } .block_a3c1f4febe3e4a72899d123025ab3aa0 .j-simpleList { flex-direction: column; align-items: center; } .block_b5daa774404a4b11a1ac4cc891f56507 .j-simpleList { gap: 24px; } .block_b5daa774404a4b11a1ac4cc891f56507 .item.itemPreview { flex: 0 0 110px; } .block_b5daa774404a4b11a1ac4cc891f56507 img.contentImg { width: 90px !important; height: 90px !important; } } /* ============================================================ 5. CRANE PROJECT PAGE (ENERGY voice) ============================================================ */ .block_b48b85719e7a4de5be239ee51ba9fb1e { max-width: 780px !important; margin: 80px auto 50px !important; padding: 0 40px 24px !important; text-align: center !important; } .block_b48b85719e7a4de5be239ee51ba9fb1e h2, .block_b48b85719e7a4de5be239ee51ba9fb1e h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; font-size: clamp(34px, 5.5vw, 52px) !important; line-height: 1.02 !important; margin-bottom: 32px !important; } .block_b48b85719e7a4de5be239ee51ba9fb1e p { text-align: left !important; } .block_b48b85719e7a4de5be239ee51ba9fb1e p:first-of-type { font-size: 19px !important; color: #252560 !important; text-align: center !important; font-weight: 300 !important; margin-bottom: 32px !important; } /* Active campaign (callout panel) */ .block_e99cb068cd0e43689376e780a9099dd8 { max-width: 680px !important; margin: 0 auto 60px !important; padding: 36px 40px !important; background: rgba(255, 255, 255, 0.85) !important; border-left: 4px solid #9b84c4 !important; border-radius: 0 12px 12px 0 !important; box-shadow: 0 4px 20px rgba(37, 37, 96, 0.06) !important; } .block_e99cb068cd0e43689376e780a9099dd8 h2, .block_e99cb068cd0e43689376e780a9099dd8 h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; color: #9b84c4 !important; font-size: 23px !important; letter-spacing: -0.01em !important; margin-bottom: 14px !important; } /* 3 Ways to Participate — editorial 01·02·03 sequence (not a card grid) */ .block_cc10f6068ef044008b3bcb6b8092a3ed { counter-reset: ways; } .block_cc10f6068ef044008b3bcb6b8092a3ed .itemsCollectionContent, .block_cc10f6068ef044008b3bcb6b8092a3ed .j-simpleList { display: flex !important; flex-direction: column !important; max-width: 820px !important; margin: 0 auto !important; padding: 0 !important; gap: 0 !important; height: auto !important; } .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview { counter-increment: ways; flex: 1 1 100% !important; max-width: 100% !important; background: transparent !important; border: none !important; border-top: 1px solid rgba(37, 37, 96, 0.12) !important; border-radius: 0 !important; box-shadow: none !important; padding: 30px 0 30px 96px !important; position: relative; text-align: left !important; } .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview:last-child { border-bottom: 1px solid rgba(37, 37, 96, 0.12) !important; } .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview:hover { transform: none !important; box-shadow: none !important; } .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview::before { content: "0" counter(ways); position: absolute; left: 0; top: 26px; font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700; font-size: 56px; line-height: 0.9; letter-spacing: -0.03em; } .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview:nth-child(1)::before { color: #5bb8d4; } .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview:nth-child(2)::before { color: #3aa8a0; } .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview:nth-child(3)::before { color: #9b84c4; } .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview a.scEditable--plainText { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; font-size: 22px !important; font-style: normal !important; letter-spacing: -0.01em !important; color: #252560 !important; text-decoration: none !important; display: block; margin-bottom: 8px; text-align: left !important; } .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview .j-simpleList__descr, .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview p { font-size: 15px !important; line-height: 1.7 !important; text-align: left !important; color: #3a3a5c !important; } @media (max-width: 600px) { .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview { padding-left: 64px !important; } .block_cc10f6068ef044008b3bcb6b8092a3ed .item.itemPreview::before { font-size: 40px; top: 30px; } } /* Peace Makers (teal band) — stronger color */ .block_b3b62942336c4f46b02d37fe77d1bfde { max-width: 100% !important; margin: 60px 0 !important; padding: 56px 40px !important; background: linear-gradient(135deg, rgba(58, 168, 160, 0.12), rgba(91, 184, 212, 0.12)) !important; border-top: 1px solid rgba(58, 168, 160, 0.18); border-bottom: 1px solid rgba(58, 168, 160, 0.18); } .block_b3b62942336c4f46b02d37fe77d1bfde h2, .block_b3b62942336c4f46b02d37fe77d1bfde h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; text-align: center !important; font-size: clamp(26px, 3.5vw, 34px) !important; } .block_b3b62942336c4f46b02d37fe77d1bfde p { max-width: 680px; margin-left: auto !important; margin-right: auto !important; text-align: center !important; } /* Peace Box */ .block_de805a41bea54778ae354dc6b840236b { max-width: 720px !important; margin: 60px auto 50px !important; padding: 0 40px !important; } .block_de805a41bea54778ae354dc6b840236b h2, .block_de805a41bea54778ae354dc6b840236b h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; text-align: center !important; font-size: clamp(26px, 3.5vw, 36px) !important; } /* Closing CTA (frosted panel) — confident pill link */ .block_f8dc3f1438f544129118cc648d1a8089 { max-width: 720px !important; margin: 60px auto 80px !important; padding: 48px 40px !important; text-align: center !important; background: rgba(255, 255, 255, 0.85) !important; border-radius: 16px !important; box-shadow: 0 4px 24px rgba(37, 37, 96, 0.06) !important; border: 1px solid rgba(58, 168, 160, 0.1); } .block_f8dc3f1438f544129118cc648d1a8089 p { text-align: left !important; } .block_f8dc3f1438f544129118cc648d1a8089 a { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; font-size: 15px !important; letter-spacing: 0.04em !important; text-transform: uppercase !important; color: #ffffff !important; background: #3aa8a0 !important; border: none !important; border-radius: 50px !important; padding: 15px 34px !important; display: inline-block !important; margin-top: 8px; transition: transform 180ms ease, box-shadow 180ms ease !important; } .block_f8dc3f1438f544129118cc648d1a8089 a:hover { transform: translateY(-2px) !important; box-shadow: 0 8px 22px rgba(58, 168, 160, 0.35) !important; } @media (max-width: 768px) { .block_b48b85719e7a4de5be239ee51ba9fb1e { margin: 50px auto 30px !important; padding: 0 24px !important; } .block_e99cb068cd0e43689376e780a9099dd8 { margin: 0 16px 40px !important; padding: 28px 24px !important; } .block_cc10f6068ef044008b3bcb6b8092a3ed .j-simpleList { flex-direction: column; align-items: center; } .block_b3b62942336c4f46b02d37fe77d1bfde { margin: 40px 0 !important; padding: 40px 24px !important; } .block_de805a41bea54778ae354dc6b840236b { margin: 40px auto 30px !important; padding: 0 24px !important; } .block_f8dc3f1438f544129118cc648d1a8089 { margin: 40px 16px 60px !important; padding: 36px 24px !important; } } /* ============================================================ 6. SUPPORT PAGE (ENERGY + FUNDING confidence) ============================================================ */ .block_d93c565360e44ef1b7df02c3fcbf360f { max-width: 680px !important; margin: 80px auto 40px !important; padding: 0 40px !important; text-align: center !important; } .block_d93c565360e44ef1b7df02c3fcbf360f h2, .block_d93c565360e44ef1b7df02c3fcbf360f h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; font-size: clamp(30px, 4.5vw, 44px) !important; line-height: 1.05 !important; margin-bottom: 24px !important; } /* Impact tiers — big confident numbers. $30 / $60 / $100 / $250 */ .block_bea79993274544fa83cf1bd250e1e08d .itemsCollectionContent, .block_bea79993274544fa83cf1bd250e1e08d .j-simpleList { display: flex !important; flex-wrap: wrap !important; gap: 20px !important; justify-content: center !important; max-width: 940px !important; margin: 0 auto !important; padding: 0 !important; height: auto !important; } .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview { flex: 1 1 210px; max-width: 240px; padding: 34px 22px !important; text-align: center; } .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview:nth-child(1) { border-top: 5px solid #5bb8d4 !important; } .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview:nth-child(2) { border-top: 5px solid #3aa8a0 !important; } .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview:nth-child(3) { border-top: 5px solid #9b84c4 !important; } .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview:nth-child(4) { border-top: 5px solid #7b8fd4 !important; } .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview a.scEditable--plainText { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; font-size: 46px !important; letter-spacing: -0.02em !important; text-decoration: none !important; display: block; margin-bottom: 12px; } .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview:nth-child(1) a.scEditable--plainText { color: #5bb8d4 !important; } .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview:nth-child(2) a.scEditable--plainText { color: #3aa8a0 !important; } .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview:nth-child(3) a.scEditable--plainText { color: #9b84c4 !important; } .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview:nth-child(4) a.scEditable--plainText { color: #7b8fd4 !important; } .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview .j-simpleList__descr, .block_bea79993274544fa83cf1bd250e1e08d .item.itemPreview p { font-size: 15px !important; line-height: 1.6 !important; } .block_b26cd1625a21467b956dccb0c9e7c644 { max-width: 600px !important; margin: 40px auto 60px !important; padding: 32px !important; text-align: center !important; background: linear-gradient(135deg, rgba(58, 168, 160, 0.06), rgba(155, 132, 196, 0.06)) !important; border-radius: 12px; } @media (max-width: 768px) { .block_bea79993274544fa83cf1bd250e1e08d .j-simpleList { flex-direction: column; align-items: center; } .block_b26cd1625a21467b956dccb0c9e7c644 { margin: 30px 16px 50px !important; padding: 24px 20px !important; } } /* ============================================================ 7. GET INVOLVED PAGE (ENERGY voice; bold event moment) ============================================================ */ .block_dc7a2e2695054281b3f8159102df990d { max-width: 680px !important; margin: 80px auto 40px !important; padding: 0 40px !important; text-align: center !important; } .block_dc7a2e2695054281b3f8159102df990d h2, .block_dc7a2e2695054281b3f8159102df990d h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; font-size: clamp(30px, 4.5vw, 44px) !important; line-height: 1.05 !important; margin-bottom: 20px !important; } /* Pathway cards — Gather / Volunteer / Create / Care */ .block_d62a727149c940c2ae6052690683c9b2 .itemsCollectionContent, .block_d62a727149c940c2ae6052690683c9b2 .j-simpleList { display: flex !important; flex-wrap: wrap !important; gap: 28px !important; justify-content: center !important; max-width: 960px !important; margin: 0 auto !important; padding: 0 !important; height: auto !important; } .block_d62a727149c940c2ae6052690683c9b2 .item.itemPreview { flex: 1 1 270px; max-width: 300px; padding: 36px 28px 32px !important; text-align: center; } .block_d62a727149c940c2ae6052690683c9b2 .item.itemPreview:nth-child(1) { border-top: 5px solid #3aa8a0 !important; } .block_d62a727149c940c2ae6052690683c9b2 .item.itemPreview:nth-child(2) { border-top: 5px solid #9b84c4 !important; } .block_d62a727149c940c2ae6052690683c9b2 .item.itemPreview:nth-child(3) { border-top: 5px solid #5bb8d4 !important; } .block_d62a727149c940c2ae6052690683c9b2 .item.itemPreview:nth-child(4) { border-top: 5px solid #7b8fd4 !important; } .block_d62a727149c940c2ae6052690683c9b2 .item.itemPreview a.scEditable--plainText { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; font-size: 22px !important; font-style: normal !important; letter-spacing: -0.01em !important; color: #252560 !important; text-decoration: none !important; display: block; margin-bottom: 16px; } .block_d62a727149c940c2ae6052690683c9b2 .item.itemPreview .j-simpleList__descr, .block_d62a727149c940c2ae6052690683c9b2 .item.itemPreview p { font-size: 15px !important; line-height: 1.7 !important; text-align: left; color: #3a3a5c !important; } /* Peace Makers (teal band) — stronger color */ .block_e23fd164de9b4a558c7eeda4653207f7 { max-width: 100% !important; margin: 60px 0 !important; padding: 56px 40px !important; background: linear-gradient(135deg, rgba(58, 168, 160, 0.12), rgba(91, 184, 212, 0.12)) !important; border-top: 1px solid rgba(58, 168, 160, 0.18); border-bottom: 1px solid rgba(58, 168, 160, 0.18); } .block_e23fd164de9b4a558c7eeda4653207f7 h2, .block_e23fd164de9b4a558c7eeda4653207f7 h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; text-align: center !important; font-size: clamp(26px, 3.5vw, 32px) !important; } .block_e23fd164de9b4a558c7eeda4653207f7 p { max-width: 680px; margin-left: auto !important; margin-right: auto !important; text-align: center !important; } /* Day of Resilience heading — the big event moment */ .block_f15fd527c086487b91bc1bfc4d12c033 { text-align: center !important; margin: 70px auto 10px !important; } .block_f15fd527c086487b91bc1bfc4d12c033 h2, .block_f15fd527c086487b91bc1bfc4d12c033 h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.025em !important; font-size: clamp(32px, 5.5vw, 54px) !important; line-height: 1.0 !important; } .block_fd12dd9858914defa4eaf9f5325e75e8 { max-width: 720px !important; margin: 0 auto 30px !important; } .block_ba4e7c93883d467dad4cb667be8dd422 { max-width: 800px !important; margin: 0 auto 40px !important; padding: 0 24px !important; } .block_ba4e7c93883d467dad4cb667be8dd422 img { border-radius: 12px !important; box-shadow: 0 4px 20px rgba(37, 37, 96, 0.08); } /* Sponsor (callout panel) */ .block_ddae0c98de7646379580e6e1850f6cbd { max-width: 680px !important; margin: 0 auto 40px !important; padding: 28px 32px !important; background: rgba(255, 255, 255, 0.85) !important; border-left: 4px solid #9b84c4 !important; border-radius: 0 12px 12px 0 !important; box-shadow: 0 4px 20px rgba(37, 37, 96, 0.06) !important; } .block_ddae0c98de7646379580e6e1850f6cbd h2, .block_ddae0c98de7646379580e6e1850f6cbd h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; color: #9b84c4 !important; font-size: 23px !important; letter-spacing: -0.01em !important; } .block_aa13479d5e0f47b08e0933865fddc7f7 { max-width: 600px !important; margin: 40px auto 60px !important; padding: 32px !important; text-align: center !important; background: linear-gradient(135deg, rgba(58, 168, 160, 0.06), rgba(91, 184, 212, 0.06)) !important; border-radius: 12px; } @media (max-width: 768px) { .block_d62a727149c940c2ae6052690683c9b2 .j-simpleList { flex-direction: column; align-items: center; } .block_e23fd164de9b4a558c7eeda4653207f7 { margin: 40px 0 !important; padding: 40px 24px !important; } .block_ddae0c98de7646379580e6e1850f6cbd { margin: 0 16px 30px !important; } .block_aa13479d5e0f47b08e0933865fddc7f7 { margin: 30px 16px 50px !important; padding: 24px 20px !important; } } /* ============================================================ 8. HOMEPAGE (MIXED — memorial moments soft, work/events energy) ============================================================ */ /* Why This Exists — SOFT (memorial moment, flows from hero) */ .block_f072d71541be4978b78465a786968ce6 { max-width: 680px !important; margin: 80px auto 50px !important; padding: 0 40px !important; text-align: center !important; } .block_f072d71541be4978b78465a786968ce6 p { font-size: 18px !important; line-height: 1.8 !important; } /* "We carry these names" / THE THIRTEEN — SOFT UPDATED: each name is now a link to their bio page. Structure: p1 = eyebrow · p2 = the names (as links) · p3 = closing line */ .block_e217ab392410476aa41fd4e7ee1a683e { max-width: 760px !important; margin: 40px auto 80px !important; padding: 60px 40px !important; text-align: center !important; border-top: 1px solid rgba(91, 184, 212, 0.3); border-bottom: 1px solid rgba(91, 184, 212, 0.3); } .block_e217ab392410476aa41fd4e7ee1a683e p:first-of-type { font-family: 'adobe-garamond-pro', 'Georgia', 'Times New Roman', serif !important; font-size: 16px !important; font-style: italic !important; color: #9b84c4 !important; letter-spacing: 0.15em !important; text-transform: uppercase !important; margin-bottom: 28px !important; } .block_e217ab392410476aa41fd4e7ee1a683e p:nth-of-type(2) { font-family: 'adobe-garamond-pro', 'Georgia', 'Times New Roman', serif !important; font-size: 19px !important; color: #252560 !important; line-height: 2.0 !important; letter-spacing: 0.02em !important; margin-bottom: 32px !important; } /* Name links — dignified serif, quiet lavender hover underline. Block-scoped !important overrides the global teal link treatment. */ .block_e217ab392410476aa41fd4e7ee1a683e p:nth-of-type(2) a { display: inline-block; font-family: 'adobe-garamond-pro', 'Georgia', 'Times New Roman', serif !important; font-size: 22px !important; line-height: 1.5 !important; color: #252560 !important; text-decoration: none !important; border-bottom: 1px solid transparent !important; padding-bottom: 1px; margin: 4px 10px; transition: border-color 200ms cubic-bezier(0.25, 0.1, 0.25, 1); } .block_e217ab392410476aa41fd4e7ee1a683e p:nth-of-type(2) a:hover, .block_e217ab392410476aa41fd4e7ee1a683e p:nth-of-type(2) a:focus-visible { border-bottom-color: #9b84c4 !important; } .block_e217ab392410476aa41fd4e7ee1a683e p:last-of-type { font-family: 'adobe-garamond-pro', 'Georgia', 'Times New Roman', serif !important; font-size: 17px !important; font-style: italic !important; color: #9b84c4 !important; line-height: 1.7 !important; margin: 0 !important; } /* The Thirteen — SOFT (serif names portrait grid — legacy; remove this rule set only if the portrait grid block was deleted from the page) */ .block_fce170a2191942bdb22613bc5c3001d7 { max-width: 960px !important; margin: 0 auto 20px !important; padding: 0 24px !important; } .block_fce170a2191942bdb22613bc5c3001d7 .itemsCollectionContent, .block_fce170a2191942bdb22613bc5c3001d7 .j-simpleList { display: flex !important; flex-wrap: wrap !important; gap: 28px !important; justify-content: center !important; height: auto !important; } .block_fce170a2191942bdb22613bc5c3001d7 .item.itemPreview { flex: 0 0 140px; text-align: center; background: none !important; box-shadow: none !important; border: none !important; padding: 0 !important; } .block_fce170a2191942bdb22613bc5c3001d7 img.contentImg { width: 120px !important; height: 120px !important; border-radius: 50% !important; object-fit: cover; border: 3px solid #5bb8d4 !important; display: block; margin: 0 auto 10px; } .block_fce170a2191942bdb22613bc5c3001d7 .item.itemPreview a.scEditable--plainText { font-family: 'adobe-garamond-pro', 'Georgia', 'Times New Roman', serif !important; font-size: 16px !important; color: #252560 !important; text-decoration: none !important; display: block; margin-bottom: 2px; } .block_fce170a2191942bdb22613bc5c3001d7 .item.itemPreview .j-simpleList__descr, .block_fce170a2191942bdb22613bc5c3001d7 .item.itemPreview p { font-size: 13px !important; color: #6c6c88 !important; } /* Section headings (homepage energy zones) — targets the rebuilt Continued Work heading by ID, plus the reusable Classes-field hook: type home-section-heading into any heading block's Classes field and it picks up this style with no block ID needed. */ .block_e542c189cfe7453d83d77259b4625621, .block_f1a34d6d1fef457ab8819d38f69df0a3, .home-section-heading { text-align: center !important; margin: 80px auto 30px !important; } .block_e542c189cfe7453d83d77259b4625621 h2, .block_e542c189cfe7453d83d77259b4625621 h3, .block_f1a34d6d1fef457ab8819d38f69df0a3 h2, .block_f1a34d6d1fef457ab8819d38f69df0a3 h3, .home-section-heading h2, .home-section-heading h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; font-size: clamp(30px, 4.5vw, 44px) !important; } /* Continued Work - feature cards — UPDATED v2: gradient accent bars (replaces solid border-tops) + taller photo-forward images (160px → 200px) */ .block_a5aae64498924deb9bd7da2ff28d7a02 { margin: 20px auto 80px !important; padding: 0 24px !important; } .block_a5aae64498924deb9bd7da2ff28d7a02 .itemsCollectionContent, .block_a5aae64498924deb9bd7da2ff28d7a02 .j-simpleList { display: flex !important; flex-wrap: wrap !important; gap: 28px !important; justify-content: center !important; max-width: 1000px !important; margin: 0 auto !important; padding: 0 !important; height: auto !important; } .block_a5aae64498924deb9bd7da2ff28d7a02 .item.itemPreview { flex: 1 1 280px; max-width: 310px; background: #ffffff !important; border: 1px solid rgba(37, 37, 96, 0.08) !important; border-radius: 14px !important; padding: 0 !important; text-align: center; box-shadow: 0 4px 18px rgba(37, 37, 96, 0.06) !important; transition: transform 280ms cubic-bezier(0.25, 0.1, 0.25, 1), box-shadow 280ms cubic-bezier(0.25, 0.1, 0.25, 1); overflow: hidden; } .block_a5aae64498924deb9bd7da2ff28d7a02 .item.itemPreview:hover { transform: translateY(-6px); box-shadow: 0 14px 36px rgba(37, 37, 96, 0.13) !important; } .block_a5aae64498924deb9bd7da2ff28d7a02 .item.itemPreview::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 5px; z-index: 2; } .block_a5aae64498924deb9bd7da2ff28d7a02 .item.itemPreview:nth-child(1)::before { background: linear-gradient(90deg, #5bb8d4, #3aa8a0); } .block_a5aae64498924deb9bd7da2ff28d7a02 .item.itemPreview:nth-child(2)::before { background: linear-gradient(90deg, #3aa8a0, #9b84c4); } .block_a5aae64498924deb9bd7da2ff28d7a02 .item.itemPreview:nth-child(3)::before { background: linear-gradient(90deg, #9b84c4, #7b8fd4); } .block_a5aae64498924deb9bd7da2ff28d7a02 img.contentImg { width: 100% !important; height: 200px !important; object-fit: cover !important; border-radius: 0 !important; margin: 0 !important; display: block; } .block_a5aae64498924deb9bd7da2ff28d7a02 .item.itemPreview a.scEditable--plainText { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; font-size: 21px !important; font-style: normal !important; letter-spacing: -0.01em !important; color: #252560 !important; text-decoration: none !important; display: block; margin: 20px 24px 10px !important; } .block_a5aae64498924deb9bd7da2ff28d7a02 .item.itemPreview .j-simpleList__descr, .block_a5aae64498924deb9bd7da2ff28d7a02 .item.itemPreview p { font-size: 15px !important; line-height: 1.65 !important; padding: 0 24px 24px !important; margin: 0 !important; } /* What's Happening heading — old block deleted. The rebuilt heading just needs home-section-heading typed in its Classes field. */ /* What's Happening - event cards — energy titles. Also targets the Classes-field hook: type home-events into the rebuilt Simple List block's Classes field. */ .block_f9198cf57a4340f58f42c27d4129c5aa, .block_b467f4c2a85d496589cc27b566d360bb, .home-events { margin: 20px auto 80px !important; padding: 0 24px !important; } .block_f9198cf57a4340f58f42c27d4129c5aa .itemsCollectionContent, .block_f9198cf57a4340f58f42c27d4129c5aa .j-simpleList, .block_b467f4c2a85d496589cc27b566d360bb .itemsCollectionContent, .block_b467f4c2a85d496589cc27b566d360bb .j-simpleList, .home-events .itemsCollectionContent, .home-events .j-simpleList { display: flex !important; flex-wrap: wrap !important; gap: 28px !important; justify-content: center !important; max-width: 800px !important; margin: 0 auto !important; padding: 0 !important; height: auto !important; } .block_f9198cf57a4340f58f42c27d4129c5aa .item.itemPreview, .block_b467f4c2a85d496589cc27b566d360bb .item.itemPreview, .home-events .item.itemPreview { flex: 1 1 340px; max-width: 380px; background: #ffffff !important; border: 1px solid rgba(37, 37, 96, 0.08) !important; border-radius: 14px !important; padding: 36px 32px !important; box-shadow: 0 4px 18px rgba(37, 37, 96, 0.06) !important; border-left: 5px solid #3aa8a0 !important; transition: transform 280ms cubic-bezier(0.25, 0.1, 0.25, 1), box-shadow 280ms cubic-bezier(0.25, 0.1, 0.25, 1); } .block_f9198cf57a4340f58f42c27d4129c5aa .item.itemPreview:hover, .block_b467f4c2a85d496589cc27b566d360bb .item.itemPreview:hover, .home-events .item.itemPreview:hover { transform: translateY(-6px); box-shadow: 0 14px 36px rgba(37, 37, 96, 0.13) !important; border-left-color: #5bb8d4 !important; } .block_f9198cf57a4340f58f42c27d4129c5aa .item.itemPreview a.scEditable--plainText, .block_b467f4c2a85d496589cc27b566d360bb .item.itemPreview a.scEditable--plainText, .home-events .item.itemPreview a.scEditable--plainText { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; font-size: 24px !important; font-style: normal !important; letter-spacing: -0.015em !important; color: #252560 !important; text-decoration: none !important; display: block; margin-bottom: 14px; } .block_f9198cf57a4340f58f42c27d4129c5aa .item.itemPreview .j-simpleList__descr, .block_f9198cf57a4340f58f42c27d4129c5aa .item.itemPreview p, .block_b467f4c2a85d496589cc27b566d360bb .item.itemPreview .j-simpleList__descr, .block_b467f4c2a85d496589cc27b566d360bb .item.itemPreview p, .home-events .item.itemPreview .j-simpleList__descr, .home-events .item.itemPreview p { font-size: 16px !important; line-height: 1.7 !important; color: #3a3a5c !important; } /* Invitation to support — LEGACY panel (old block). Remove this rule set only if the old invitation block was deleted from the page. */ .block_d4b6965a8ce449a6adebd34c0d7e7f6e { max-width: 640px !important; margin: 50px auto 20px !important; padding: 40px 32px !important; text-align: center !important; background: linear-gradient(135deg, rgba(155, 132, 196, 0.08), rgba(91, 184, 212, 0.08)) !important; border-radius: 16px; } .block_d4b6965a8ce449a6adebd34c0d7e7f6e h2, .block_d4b6965a8ce449a6adebd34c0d7e7f6e h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; font-size: clamp(24px, 3.5vw, 34px) !important; margin-bottom: 16px !important; } /* Support close — NEW panel (Zone 3: warm quiet, earned). Heading stays in the global Garamond default — soft close on purpose, in contrast to the energy sections above it. Structure: h2 = "Be Part of the Healing" · body paragraph(s) · final paragraph = trust line ("100% of every gift..."). */ .block_bbd9523e43cb476fb52d4bd5050e934c { max-width: 680px !important; margin: 50px auto 20px !important; padding: 52px 44px !important; text-align: center !important; background: linear-gradient(160deg, #ffffff 0%, #f2f4fb 100%) !important; border: 1px solid rgba(37, 37, 96, 0.08); border-radius: 16px; } .block_bbd9523e43cb476fb52d4bd5050e934c h2, .block_bbd9523e43cb476fb52d4bd5050e934c h3 { font-size: clamp(26px, 3.5vw, 34px) !important; margin-bottom: 20px !important; } .block_bbd9523e43cb476fb52d4bd5050e934c p { font-size: 16px !important; line-height: 1.7 !important; max-width: 540px; margin-left: auto !important; margin-right: auto !important; } .block_bbd9523e43cb476fb52d4bd5050e934c p:not(:first-of-type):last-of-type { font-size: 13px !important; color: #8a8aa5 !important; margin-top: 14px !important; margin-bottom: 0 !important; } /* Support CTA button — confident pill */ .block_e87966236a4448bcb7a91997fce2dbf9 { max-width: 640px !important; margin: 0 auto 70px !important; text-align: center !important; } .block_e87966236a4448bcb7a91997fce2dbf9 a { display: inline-block !important; font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-size: 15px !important; font-weight: 700 !important; color: #ffffff !important; background: #7b8fd4 !important; padding: 16px 40px !important; border-radius: 50px !important; text-decoration: none !important; border: none !important; letter-spacing: 0.04em; text-transform: uppercase; transition: background 200ms ease, transform 200ms ease, box-shadow 200ms ease; } .block_e87966236a4448bcb7a91997fce2dbf9 a:hover { background: #6a7ec3 !important; transform: translateY(-2px); box-shadow: 0 8px 22px rgba(123, 143, 212, 0.4) !important; } @media (max-width: 768px) { .block_e217ab392410476aa41fd4e7ee1a683e { padding: 40px 24px !important; margin: 30px auto 60px !important; } .block_e217ab392410476aa41fd4e7ee1a683e p:nth-of-type(2) { font-size: 17px !important; line-height: 1.9 !important; } .block_e217ab392410476aa41fd4e7ee1a683e p:nth-of-type(2) a { font-size: 19px !important; margin: 3px 7px; } .block_fce170a2191942bdb22613bc5c3001d7 .j-simpleList { gap: 20px; } .block_fce170a2191942bdb22613bc5c3001d7 .item.itemPreview { flex: 0 0 110px; } .block_fce170a2191942bdb22613bc5c3001d7 img.contentImg { width: 90px !important; height: 90px !important; } .block_a5aae64498924deb9bd7da2ff28d7a02 .j-simpleList { flex-direction: column; align-items: center; } .block_f9198cf57a4340f58f42c27d4129c5aa .j-simpleList { flex-direction: column; align-items: center; } .home-events .j-simpleList { flex-direction: column; align-items: center; } .block_b467f4c2a85d496589cc27b566d360bb .j-simpleList { flex-direction: column; align-items: center; } .block_d4b6965a8ce449a6adebd34c0d7e7f6e { margin: 40px 16px 15px !important; padding: 32px 20px !important; } .block_bbd9523e43cb476fb52d4bd5050e934c { margin: 40px 16px 15px !important; padding: 40px 24px !important; } .block_e87966236a4448bcb7a91997fce2dbf9 { margin: 0 auto 50px !important; } } /* ============================================================ 9. CLASS HOOKS — FINAL BUILD SYSTEM (no block IDs needed) Type these names into a block's "Classes" field in the Websites 360 editor and the block styles itself. Every new block in the 720 Site Build Guide maps to one of these. ============================================================ */ /* ---- Headings ---- */ .heading-soft { /* memorial-voice section heading */ text-align: center !important; margin: 80px auto 30px !important; padding: 0 24px !important; } .heading-soft h2, .heading-soft h3 { font-size: clamp(30px, 4.5vw, 42px) !important; /* Garamond via global default */ margin: 0 !important; } .heading-bold { /* energy-voice section heading */ text-align: center !important; margin: 80px auto 30px !important; padding: 0 24px !important; } .heading-bold h2, .heading-bold h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; font-size: clamp(30px, 4.5vw, 44px) !important; margin: 0 !important; } /* ---- Page intros ---- */ .intro-soft { /* quiet centered intro (memorial) */ max-width: 680px !important; margin: 80px auto 50px !important; padding: 0 40px !important; text-align: center !important; } .intro-soft p { font-size: 18px !important; line-height: 1.8 !important; } .intro-bold { /* bold page opening (program pages) */ max-width: 780px !important; margin: 80px auto 50px !important; padding: 0 40px 24px !important; text-align: center !important; } .intro-bold h2, .intro-bold h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; font-size: clamp(34px, 5.5vw, 52px) !important; line-height: 1.02 !important; margin-bottom: 32px !important; } .intro-bold p { text-align: left !important; } .intro-bold p:first-of-type { font-size: 19px !important; color: #252560 !important; text-align: center !important; font-weight: 300 !important; margin-bottom: 32px !important; } /* ---- Quiet serif quote (memorial voice) ---- */ .quiet-quote { max-width: 640px !important; margin: 40px auto 60px !important; padding: 0 24px !important; text-align: center !important; } .quiet-quote p, .quiet-quote blockquote { font-family: 'adobe-garamond-pro', 'Georgia', 'Times New Roman', serif !important; font-size: 18px !important; font-style: italic !important; line-height: 1.7 !important; color: #9b84c4 !important; margin: 0 !important; } /* ---- Callout panel (lavender edge, white) ---- */ .callout-panel { max-width: 680px !important; margin: 0 auto 50px !important; padding: 32px 40px !important; background: rgba(255, 255, 255, 0.85) !important; border-left: 4px solid #9b84c4 !important; border-radius: 0 12px 12px 0 !important; box-shadow: 0 4px 20px rgba(37, 37, 96, 0.06) !important; } .callout-panel h2, .callout-panel h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; color: #9b84c4 !important; font-size: 23px !important; letter-spacing: -0.01em !important; margin-bottom: 14px !important; } /* ---- Tinted full-width band (teal) ---- */ .tinted-band { max-width: 100% !important; margin: 60px 0 !important; padding: 56px 40px !important; background: linear-gradient(135deg, rgba(58, 168, 160, 0.12), rgba(91, 184, 212, 0.12)) !important; border-top: 1px solid rgba(58, 168, 160, 0.18); border-bottom: 1px solid rgba(58, 168, 160, 0.18); } .tinted-band h2, .tinted-band h3 { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; letter-spacing: -0.02em !important; text-align: center !important; font-size: clamp(26px, 3.5vw, 34px) !important; } .tinted-band p { max-width: 680px; margin-left: auto !important; margin-right: auto !important; text-align: center !important; } /* ---- Support close panel (warm, earned) ---- */ .support-panel { max-width: 680px !important; margin: 50px auto 20px !important; padding: 52px 44px !important; text-align: center !important; background: linear-gradient(160deg, #ffffff 0%, #f2f4fb 100%) !important; border: 1px solid rgba(37, 37, 96, 0.08); border-radius: 16px; } .support-panel h2, .support-panel h3 { font-size: clamp(26px, 3.5vw, 34px) !important; /* Garamond via global default */ margin-bottom: 20px !important; } .support-panel p { font-size: 16px !important; line-height: 1.7 !important; max-width: 540px; margin-left: auto !important; margin-right: auto !important; } .support-panel p:not(:first-of-type):last-of-type { font-size: 13px !important; color: #8a8aa5 !important; margin-top: 14px !important; margin-bottom: 0 !important; } /* ---- Pill CTAs (block contains one button/link) ---- */ .pill-cta { max-width: 640px !important; margin: 0 auto 70px !important; text-align: center !important; } .pill-cta a, .pill-cta-teal a { display: inline-block !important; font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-size: 15px !important; font-weight: 700 !important; color: #ffffff !important; padding: 16px 40px !important; border-radius: 50px !important; text-decoration: none !important; border: none !important; letter-spacing: 0.04em; text-transform: uppercase; transition: background 200ms ease, transform 200ms ease, box-shadow 200ms ease; } .pill-cta a { background: #7b8fd4 !important; } .pill-cta a:hover { background: #6a7ec3 !important; transform: translateY(-2px); box-shadow: 0 8px 22px rgba(123, 143, 212, 0.4) !important; } .pill-cta-teal { max-width: 640px !important; margin: 0 auto 70px !important; text-align: center !important; } .pill-cta-teal a { background: #3aa8a0 !important; } .pill-cta-teal a:hover { background: #339890 !important; transform: translateY(-2px); box-shadow: 0 8px 22px rgba(58, 168, 160, 0.35) !important; } /* ---- Card grid (Simple List; accent tops by position) ---- */ .cards-grid .itemsCollectionContent, .cards-grid .j-simpleList { display: flex !important; flex-wrap: wrap !important; gap: 28px !important; justify-content: center !important; max-width: 960px !important; margin: 0 auto !important; padding: 0 !important; height: auto !important; } .cards-grid .item.itemPreview { position: relative !important; left: auto !important; top: auto !important; flex: 1 1 270px; max-width: 300px; padding: 36px 28px 32px !important; text-align: center; background: #ffffff !important; border: 1px solid rgba(37, 37, 96, 0.10) !important; border-radius: 12px !important; box-shadow: none !important; transition: transform 200ms cubic-bezier(0.25, 0.1, 0.25, 1), box-shadow 200ms cubic-bezier(0.25, 0.1, 0.25, 1) !important; } .cards-grid .item.itemPreview:hover { transform: translateY(-4px) !important; box-shadow: 0 14px 34px rgba(37, 37, 96, 0.12) !important; } .cards-grid .item.itemPreview:nth-child(1) { border-top: 5px solid #5bb8d4 !important; } .cards-grid .item.itemPreview:nth-child(2) { border-top: 5px solid #3aa8a0 !important; } .cards-grid .item.itemPreview:nth-child(3) { border-top: 5px solid #9b84c4 !important; } .cards-grid .item.itemPreview:nth-child(4) { border-top: 5px solid #7b8fd4 !important; } .cards-grid .item.itemPreview a.scEditable--plainText { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; font-size: 22px !important; font-style: normal !important; letter-spacing: -0.01em !important; color: #252560 !important; text-decoration: none !important; display: block; margin-bottom: 16px; } .cards-grid .item.itemPreview .j-simpleList__descr, .cards-grid .item.itemPreview p { font-size: 15px !important; line-height: 1.7 !important; text-align: left; color: #3a3a5c !important; } /* ---- Portrait grid (circular photos, serif names) ---- */ .portrait-grid .itemsCollectionContent, .portrait-grid .j-simpleList { display: flex !important; flex-wrap: wrap !important; gap: 40px 32px !important; justify-content: center !important; max-width: 900px !important; margin: 0 auto !important; padding: 0 !important; height: auto !important; } .portrait-grid .item.itemPreview { position: relative !important; left: auto !important; top: auto !important; flex: 0 0 160px; text-align: center; background: none !important; box-shadow: none !important; border: none !important; padding: 0 !important; } .portrait-grid img.contentImg { width: 130px !important; height: 130px !important; border-radius: 50% !important; object-fit: cover; border: 3px solid #5bb8d4 !important; display: block; margin: 0 auto 12px; } .portrait-grid .item.itemPreview a.scEditable--plainText { font-family: 'adobe-garamond-pro', 'Georgia', 'Times New Roman', serif !important; font-size: 17px !important; color: #252560 !important; text-decoration: none !important; display: block; margin-bottom: 4px; } .portrait-grid .item.itemPreview .j-simpleList__descr, .portrait-grid .item.itemPreview p { font-size: 13px !important; color: #6c6c88 !important; } /* ---- Numbered editorial list (01 · 02 · 03) ---- */ .numbered-list { counter-reset: ways; } .numbered-list .itemsCollectionContent, .numbered-list .j-simpleList { display: flex !important; flex-direction: column !important; max-width: 820px !important; margin: 0 auto !important; padding: 0 !important; gap: 0 !important; height: auto !important; } .numbered-list .item.itemPreview { counter-increment: ways; position: relative !important; left: auto !important; top: auto !important; flex: 1 1 100% !important; max-width: 100% !important; background: transparent !important; border: none !important; border-top: 1px solid rgba(37, 37, 96, 0.12) !important; border-radius: 0 !important; box-shadow: none !important; padding: 30px 0 30px 96px !important; text-align: left !important; } .numbered-list .item.itemPreview:last-child { border-bottom: 1px solid rgba(37, 37, 96, 0.12) !important; } .numbered-list .item.itemPreview::before { content: "0" counter(ways); position: absolute; left: 0; top: 26px; font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700; font-size: 56px; line-height: 0.9; letter-spacing: -0.03em; } .numbered-list .item.itemPreview:nth-child(1)::before { color: #5bb8d4; } .numbered-list .item.itemPreview:nth-child(2)::before { color: #3aa8a0; } .numbered-list .item.itemPreview:nth-child(3)::before { color: #9b84c4; } .numbered-list .item.itemPreview a.scEditable--plainText { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', 'Arial', sans-serif !important; font-weight: 700 !important; font-size: 22px !important; font-style: normal !important; letter-spacing: -0.01em !important; color: #252560 !important; text-decoration: none !important; display: block; margin-bottom: 8px; text-align: left !important; } .numbered-list .item.itemPreview .j-simpleList__descr, .numbered-list .item.itemPreview p { font-size: 15px !important; line-height: 1.7 !important; text-align: left !important; color: #3a3a5c !important; } /* ---- Hooks: mobile ---- */ @media (max-width: 768px) { .cards-grid .j-simpleList { flex-direction: column; align-items: center; } .cards-grid .item.itemPreview, .numbered-list .item.itemPreview { width: 100% !important; max-width: 100% !important; flex: 1 1 100% !important; } .portrait-grid .j-simpleList { gap: 24px; } .portrait-grid .item.itemPreview { flex: 0 0 110px; } .portrait-grid img.contentImg { width: 100px !important; height: 100px !important; } .intro-bold, .intro-soft { margin: 50px auto 30px !important; padding: 0 24px !important; } .tinted-band { margin: 40px 0 !important; padding: 40px 24px !important; } .callout-panel { margin: 0 16px 40px !important; padding: 28px 24px !important; } .support-panel { margin: 40px 16px 15px !important; padding: 40px 24px !important; } .numbered-list .item.itemPreview { padding-left: 64px !important; } .numbered-list .item.itemPreview::before { font-size: 40px; top: 30px; } } /* ============================================================ 10. GET INVOLVED — EVENTS WIDGET block_a3581cb48c6b45c890582e8de35708af Written against the widget's real markup: .item.itemPreview .itemImg > a > img.contentImg .itemContent.hasPrimaryMeta .maxWidth--itemContentTitle > h2.contentTitle > a > span.scEditable--plainText .maxWidth--itemMetadata > p.primaryMeta > span <- the date .maxWidth--itemContent > .itemInnerContent > p > a.moreLink Heather manages events through the widget exactly as before. This only changes how the output renders. WHAT IT FIXES · packery absolute positioning (reset in Section 2) · cols5 — five columns for five events made each card a strip · images arriving as portraits, logos, flyers and photographs at five different shapes; a 3:2 cover frame makes them a set · the date rendered as grey fine print below the title, when it is the most scannable thing on an event card — it is moved ABOVE the title with flex order and set in teal small caps · the » after every title, generated from data-primary-link-after ============================================================ */ /* Full-bleed tinted band. Below the Day of Resilience photo the page ran four light sections back to back — gatherings, events, sponsors, closing — and went flat. This tint separates the events from the gathering cards above it. The heading widget directly above carries the same wash so the two read as one band. */ .block_a3581cb48c6b45c890582e8de35708af { width: 100vw !important; max-width: 100vw !important; margin-left: calc(-50vw + 50%) !important; box-sizing: border-box !important; padding: clamp(8px, 2vh, 20px) clamp(24px, 5vw, 60px) clamp(72px, 9vh, 116px) !important; background: radial-gradient(60% 70% at 20% 10%, rgba(91,184,212,0.10) 0%, rgba(250,248,245,0) 64%), radial-gradient(58% 66% at 84% 90%, rgba(58,168,160,0.10) 0%, rgba(250,248,245,0) 62%) !important; } .block_a3581cb48c6b45c890582e8de35708af .itemsCollectionContent { max-width: 1200px !important; } /* ---- grid ---- */ /* FLEX, CENTRED — not grid. A 3-column grid renders 5 events as 3 + 2 and leaves an empty cell bottom-right, which reads as an event that failed to load. Centred flex puts the orphan row in the middle, so any count looks deliberate — and it will, whether Heather has 3 events or 9. */ .block_a3581cb48c6b45c890582e8de35708af .itemsCollectionContent { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: clamp(20px, 2.6vw, 30px) !important; height: auto !important; margin: 0 auto !important; padding: 0 !important; } /* ---- card ---- */ .block_a3581cb48c6b45c890582e8de35708af .item.itemPreview { display: flex !important; flex-direction: column !important; flex: 0 1 340px !important; width: auto !important; max-width: 380px !important; margin: 0 !important; padding: 0 !important; background: #ffffff !important; border: 1px solid rgba(37, 37, 96, 0.07) !important; border-radius: 16px !important; box-shadow: 0 4px 20px rgba(37, 37, 96, 0.07) !important; overflow: hidden !important; transition: transform 300ms ease, box-shadow 300ms ease !important; } .block_a3581cb48c6b45c890582e8de35708af .item.itemPreview:hover { transform: translateY(-5px); box-shadow: 0 16px 40px rgba(37, 37, 96, 0.14) !important; } /* ---- images become a set ---- */ .block_a3581cb48c6b45c890582e8de35708af .itemImg { width: 100% !important; margin: 0 !important; padding: 0 !important; display: block !important; } /* CONTAIN, not cover. These are mixed media — photographs, square logos, and PORTRAIT flyers. Cover-cropping a 4:5 flyer to 3:2 cut the top and bottom off, which on the Vitalant flyer removed the date and the address. Contain shows every asset whole; the tinted field fills whatever is left over, and 4:3 keeps the leftover small. When real photographs replace the flyers, switching this back to cover will look better — one line. */ .block_a3581cb48c6b45c890582e8de35708af img.contentImg { width: 100% !important; height: auto !important; aspect-ratio: 4 / 3 !important; object-fit: contain !important; object-position: center !important; border-radius: 0 !important; margin: 0 !important; padding: 10px !important; display: block !important; box-sizing: border-box !important; background: linear-gradient(150deg, rgba(91,184,212,.14), rgba(155,132,196,.14)) !important; } /* ---- text column · date reordered above the title ---- */ .block_a3581cb48c6b45c890582e8de35708af .itemContent { border-top: 1px solid rgba(37,37,96,.06) !important; display: flex !important; flex-direction: column !important; padding: 22px 24px 26px !important; flex: 1 !important; } .block_a3581cb48c6b45c890582e8de35708af .maxWidth--itemMetadata { order: -1 !important; } /* ---- the date ---- */ .block_a3581cb48c6b45c890582e8de35708af .primaryMeta { margin: 0 0 10px !important; padding: 0 !important; } .block_a3581cb48c6b45c890582e8de35708af .primaryMeta .scEditable--plainText { font-family: 'proxima-nova', 'Helvetica Neue', sans-serif !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: 0.13em !important; text-transform: uppercase !important; color: #3aa8a0 !important; line-height: 1.5 !important; } /* ---- title, and killing the » ---- */ .block_a3581cb48c6b45c890582e8de35708af .maxWidth--itemContentTitle { margin: 0 !important; } .block_a3581cb48c6b45c890582e8de35708af .contentTitle { margin: 0 0 12px !important; padding: 0 !important; } .block_a3581cb48c6b45c890582e8de35708af .contentTitle a { text-decoration: none !important; border-bottom: none !important; padding-bottom: 0 !important; } .block_a3581cb48c6b45c890582e8de35708af .contentTitle a::after { content: none !important; /* removes the » from data-primary-link-after */ } .block_a3581cb48c6b45c890582e8de35708af .contentTitle .scEditable--plainText { font-family: 'omnesprobold', 'proxima-nova', 'Helvetica Neue', sans-serif !important; font-weight: 700 !important; font-size: 20px !important; line-height: 1.24 !important; letter-spacing: -0.015em !important; color: #252560 !important; text-wrap: balance; transition: color 200ms ease; } .block_a3581cb48c6b45c890582e8de35708af .item.itemPreview:hover .contentTitle .scEditable--plainText { color: #3aa8a0 !important; } /* ---- description ---- */ .block_a3581cb48c6b45c890582e8de35708af .maxWidth--itemContent { margin: 0 !important; } .block_a3581cb48c6b45c890582e8de35708af .itemInnerContent p { font-family: 'proxima-nova', 'Helvetica Neue', sans-serif !important; font-size: 15px !important; line-height: 1.7 !important; color: #3a3a5c !important; margin: 0 !important; } .block_a3581cb48c6b45c890582e8de35708af .moreLink { font-weight: 700 !important; color: #3aa8a0 !important; text-decoration: none !important; border-bottom: 1px solid rgba(58, 168, 160, 0.4) !important; padding-bottom: 1px !important; margin-left: 4px; white-space: nowrap; } .block_a3581cb48c6b45c890582e8de35708af .moreLink:hover { color: #252560 !important; border-bottom-color: #252560 !important; } .block_a3581cb48c6b45c890582e8de35708af .scTruncateEllipsis { color: #6c6c88 !important; } @media (max-width: 640px) { .block_a3581cb48c6b45c890582e8de35708af .item.itemPreview { flex: 1 1 100% !important; max-width: 100% !important; } .block_a3581cb48c6b45c890582e8de35708af .itemsCollectionContent { gap: 20px !important; } } @media (prefers-reduced-motion: reduce) { .block_a3581cb48c6b45c890582e8de35708af .item.itemPreview, .block_a3581cb48c6b45c890582e8de35708af .contentTitle .scEditable--plainText { transition: none !important; } .block_a3581cb48c6b45c890582e8de35708af .item.itemPreview:hover { transform: none; } } /* ============================================================ 11. EVENT DETAIL PAGES (shared template) No block ID here — the content uses generic template classes, so one rule set styles every event including ones created years from now: .blockImg the event image .blockText.hasPrimaryMeta title + description .maxWidth--metadata the date line SCOPE: body:has(.blockText.hasPrimaryMeta) — true only on an event detail page. Without it, .blockImg and .blockText would be restyled sitewide. REVISION 2 — what was wrong the first time · object-fit:cover on the image. These are LOGOS as often as photographs, so cover cropped the artwork and left it floating as a white card. Contain on a tinted field holds both. · Centred title over left-aligned body with nothing between them, so the page read as two different documents. There is now a rule under the header and the two share one axis. · Paragraphs at a flat rhythm. The opening line is now a lead, and the spacing between paragraphs is wider than the spacing within them, which is what makes long copy scannable. ONE TEMPLATE, TWO REGISTERS — this holds a beer festival and the Midnight Vigil. Neutral on purpose: Garamond, no display type, no celebratory colour. Each event's own words set its tone. ============================================================ */ /* ---- header image: a banner, not a floating card ---- */ body:has(.blockText.hasPrimaryMeta) .blockImg { max-width: 860px !important; margin: 0 auto clamp(30px, 4vh, 46px) !important; padding: 0 clamp(20px, 4vw, 32px) !important; } body:has(.blockText.hasPrimaryMeta) .blockImg img.contentImg { width: 100% !important; height: auto !important; aspect-ratio: 16 / 9 !important; object-fit: contain !important; object-position: center !important; padding: clamp(16px, 2.4vw, 28px) !important; box-sizing: border-box !important; border-radius: 16px !important; display: block !important; background: linear-gradient(150deg, rgba(91,184,212,.13), rgba(155,132,196,.13)) !important; box-shadow: none !important; } /* ---- the article column ---- */ body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta { max-width: 720px !important; margin: 0 auto !important; padding: 0 clamp(20px, 4vw, 32px) clamp(60px, 9vh, 104px) !important; display: flex !important; flex-direction: column !important; } /* ---- date above the title, centred with it ---- */ body:has(.blockText.hasPrimaryMeta) .maxWidth--metadata { order: -1 !important; margin: 0 0 14px !important; text-align: center !important; } body:has(.blockText.hasPrimaryMeta) .primaryMeta { margin: 0 !important; } body:has(.blockText.hasPrimaryMeta) .primaryMeta, body:has(.blockText.hasPrimaryMeta) .primaryMeta .scEditable--plainText { font-family: 'proxima-nova', 'Helvetica Neue', sans-serif !important; font-size: 12.5px !important; font-weight: 700 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; color: #3aa8a0 !important; line-height: 1.6 !important; } /* ---- title, with a rule that joins it to the body ---- */ body:has(.blockText.hasPrimaryMeta) .contentTitle { margin: 0 0 clamp(28px, 3.6vh, 42px) !important; padding: 0 0 clamp(26px, 3.4vh, 38px) !important; text-align: center !important; border-bottom: 1px solid rgba(37, 37, 96, 0.14) !important; } body:has(.blockText.hasPrimaryMeta) .contentTitle, body:has(.blockText.hasPrimaryMeta) .contentTitle a, body:has(.blockText.hasPrimaryMeta) .contentTitle .scEditable--plainText { font-family: 'adobe-garamond-pro', 'Georgia', 'Times New Roman', serif !important; font-weight: 400 !important; font-style: normal !important; font-size: clamp(32px, 4.8vw, 54px) !important; line-height: 1.06 !important; letter-spacing: -0.018em !important; color: #252560 !important; text-decoration: none !important; border-bottom: none !important; text-wrap: balance; } body:has(.blockText.hasPrimaryMeta) .contentTitle a::after { content: none !important; } /* ---- body: lead paragraph, then a readable rhythm ---- */ body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta p, body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta li { font-family: 'proxima-nova', 'Helvetica Neue', sans-serif !important; font-size: 17px !important; line-height: 1.82 !important; color: #3a3a5c !important; margin: 0 0 26px !important; text-align: left !important; } /* the opening line carries the event — give it weight */ body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta p:first-of-type { font-family: 'adobe-garamond-pro', 'Georgia', serif !important; font-size: clamp(20px, 1.9vw, 24px) !important; line-height: 1.6 !important; color: #252560 !important; margin-bottom: 30px !important; } body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta strong, body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta b { color: #252560 !important; font-weight: 700 !important; } body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta ul, body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta ol { margin: 0 0 26px 22px !important; padding: 0 !important; } body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta li { margin-bottom: 10px !important; } /* ---- links in the copy are the actions: register, volunteer, forms ---- */ body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta p a, body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta li a { font-weight: 700 !important; color: #3aa8a0 !important; text-decoration: none !important; border-bottom: 2px solid rgba(58, 168, 160, 0.35) !important; padding-bottom: 1px !important; overflow-wrap: anywhere; transition: border-color 200ms ease, color 200ms ease !important; } body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta p a:hover, body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta li a:hover { color: #252560 !important; border-bottom-color: #252560 !important; } @media (max-width: 600px) { body:has(.blockText.hasPrimaryMeta) .blockImg img.contentImg { aspect-ratio: 4 / 3 !important; border-radius: 12px !important; } body:has(.blockText.hasPrimaryMeta) .contentTitle { margin-bottom: 24px !important; padding-bottom: 22px !important; } body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta p:first-of-type { font-size: 19px !important; } } @media (prefers-reduced-motion: reduce) { body:has(.blockText.hasPrimaryMeta) .blockText.hasPrimaryMeta p a { transition: none !important; } }