/* Brand palette — pin button label colours. myRealPage falls back to the same value for label and fill, which is what makes buttons go invisible. */ :root { --g-accent-text-color: #111111 !important; } .block-layout .button-list .default-style { --fl-button-label-color: #111111; } .block-layout:not(.inverted) .button.default-style, .block-layout:not(.inverted) .button-list .button.default-style, .block-layout:not(.inverted) .button.small, .block-layout:not(.inverted) .mrp-dynamic-form button.btn { color: #111111 !important; } .block-layout:not(.inverted) .button.plain { color: #1F7A6D !important; } .omnibox-v2-container .button.small { color: #111111 !important; } /* --- Homepage dark bands (corrected 2026-08-27) -------------------------- These blocks carry an 80% black scrim (.with-smart-bg-outer::before), so they are genuinely dark bands. Text on them uses Soft Fog, never the default body colour. */ body.index .block-layout.boxes-200c.layout-003 .title, body.index .block-layout.boxes-200c.layout-003 .sub-title, body.index .block-layout.shallow-block.search-box-005-v2 .title, body.index .block-layout.shallow-block.search-box-005-v2 .sub-title, body.index .block-layout.shallow-block.search-box-005-v2 em, body.index .block-layout.boxes-200c.boxes-200c-txt3:not(.footer-200c):not(.accent-bg) .title, body.index .block-layout.boxes-200c.boxes-200c-txt3:not(.footer-200c):not(.accent-bg) .sub-title { color: #EAE7E1 !important; } /* --- Signature panel: hint of yellow ------------------------------------ Footer is signature territory — black, white, and a restrained #E8D90F. */ .block-layout.footer-200c { border-top: 3px solid #E8D90F; } .block-layout.footer-200c .sm-button:hover { color: #E8D90F !important; } /* Footer: drop the brokerage logo above the name */ .block-layout.footer-200c .brand-logo-image { display: none; } .block-layout.footer-200c .brand-title::after { content: ""; display: block; width: 4.6em; height: 3px; background: #E8D90F; margin-top: 12px; } /* ── Property evaluation: collapse the two-column row ── PASTE THIS INTO TEMPLATE SETTINGS → CSS, not Page settings. The per-page panel dropped it silently on the last attempt. Every selector is scoped to body.property-evaluation, so it is safe to keep site-wide. Why it's needed: the theme makes this row a 3-track grid, gives the form column a "span 2", and puts a 48px gap between tracks. Hiding the copy column leaves a 0px track plus that 48px gap, so the form sits indented and runs past the right edge of the column. Taking the row out of grid removes both problems; the column-gap line is a belt-and-braces fallback. */ body.property-evaluation .block-layout.forms200c-contact10 .block-row { display: block !important; column-gap: 0 !important; } body.property-evaluation .block-layout.forms200c-contact10 .block-column { width: 100% !important; max-width: 100% !important; grid-column: auto !important; } /* Hides eight old content blocks on niagara-region.html. bid_6661145 hero bid_7078069 Niagara At A Glance bid_2373424 Central Niagara (amenity tabs) bid_3863394 Eastern Niagara (amenity tabs) bid_5350785 Northern Niagara (amenity tabs) bid_7231561 Western Niagara (amenity tabs) bid_6990144 The Edge Niagara Offers bid_6807593 Challenges & Considerations NOT hidden, deliberately: bid_4445259 the interactive Mapbox region map (12 town links) bid_2108471 the MLS search widget bid_9589708 the turquoise LET'S CONNECT band Paste into TEMPLATE SETTINGS -> CSS. */ body.niagara-region #bid_6661145, body.niagara-region #bid_6661145-top-space, body.niagara-region #bid_6661145-bottom-space, body.niagara-region #bid_7078069, body.niagara-region #bid_7078069-top-space, body.niagara-region #bid_7078069-bottom-space, body.niagara-region #bid_2373424, body.niagara-region #bid_2373424-top-space, body.niagara-region #bid_2373424-bottom-space, body.niagara-region #bid_3863394, body.niagara-region #bid_3863394-top-space, body.niagara-region #bid_3863394-bottom-space, body.niagara-region #bid_5350785, body.niagara-region #bid_5350785-top-space, body.niagara-region #bid_5350785-bottom-space, body.niagara-region #bid_7231561, body.niagara-region #bid_7231561-top-space, body.niagara-region #bid_7231561-bottom-space, body.niagara-region #bid_6990144, body.niagara-region #bid_6990144-top-space, body.niagara-region #bid_6990144-bottom-space, body.niagara-region #bid_6807593, body.niagara-region #bid_6807593-top-space, body.niagara-region #bid_6807593-bottom-space { display: none !important; } /* ============================================================ vedbhat.ca — SITE-WIDE TYPOGRAPHY RECONCILIATION Written 2026-08-28. Two problems this fixes: 1. The 15 restyled pages used hardcoded pixel headings (H1 54px / H2 32px / H3 22px) while every native myRealPage block reads the theme's fluid variables (H1 48px / H2 40px / H3 32px). Same font — Fira Sans throughout — but different sizes, which is why the untouched blocks looked like a different typeface. Everything below moves MY blocks onto the theme's own variables, so they track the theme automatically if it is ever retuned. No native block is resized. 2. The theme forces text-transform: capitalize on every heading, so "Niagara Region on the map" renders as "Niagara Region On The Map". Turned off site-wide, so headings read exactly as typed. Paste at the END of TEMPLATE SETTINGS -> CSS. Fully reversible — delete this block to restore. ============================================================ */ /* ---- 1. Stop the theme forcing Title Case on headings ---- */ :root { --title-case: none; } /* ---- 2. Put my blocks on the theme's own type scale ---- --text-xxxlarge 32 -> 48px section H1 --text-xxlarge 29 -> 40px section H2 --text-large 22 -> 28px card titles (one rung below a section subtitle, which is the role these actually play) --text-normal 16 -> 20px the light supporting line Sizes are fluid: they scale with the viewport exactly the way the native blocks do. */ .vbac-h1, .vbcf-h1, .vbcl-h1, .vbla-h1, .vblp-h1, .vbmc-h1, .vbnr-h1, .vbpb-h1, .vbpe-h1, .vbpk-h1, .vbrc-h1, .vbrl-h1, .vbts-h1, .vbvs-h1, .vbwn-h1 { font-size: var(--text-xxxlarge) !important; font-weight: 700; line-height: 1.05; } .vbac-h2, .vbcf-h2, .vbcl-h2, .vbla-h2, .vblp-h2, .vbmc-h2, .vbnr-h2, .vbpb-h2, .vbpk-h2, .vbrl-h2, .vbts-h2, .vbvs-h2 { font-size: var(--text-xxlarge) !important; font-weight: 700; line-height: 1.15; } .vblp-h3, .vbnr-h3 { font-size: var(--text-large) !important; font-weight: 700; line-height: 1.2; } /* ---- 3. Supporting lines, one rung under their heading ---- The -lead and -sub classes are the light-weight line that sits under an H1 or H2. The theme's equivalent native element runs at --text-xlarge weight 300. */ .vbcf-lead, .vbcl-lead, .vbla-lead, .vblp-lead, .vbmc-lead, .vbnr-lead, .vbpe-lead, .vbrc-lead, .vbrl-lead, .vbts-lead, .vbvs-lead, .vbwn-lead { font-size: var(--p-font-size) !important; font-weight: 300; line-height: 1.5; } .vbcf-sub, .vbcl-sub, .vblp-sub, .vbpb-sub, .vbvs-sub { font-size: var(--p-font-size) !important; font-weight: 300; line-height: 1.5; } /* ---- 4. NOT resized, deliberately ---- .vbnr-kicker, .vbac-kicker, .vbpk-kicker and .vbnr-panel-h are small uppercase labels, not headings. Scaling them up would break the layouts they sit in. */ /* ---- 5. MLS listing cards back onto the site's typeface ---- The myRealPage listing component sets its card titles in Open Sans, which is a genuinely different font from the rest of the site. Family only — sizes and layout untouched, because the card grid depends on them. */ .mrp-listing-result .listing-item-entry-title, .listing-item-entry-title, .mrp-listing-result .listing-item-entry-title * { font-family: "Fira Sans", "Helvetica Neue", Helvetica, Arial, sans-serif !important; } /* ============================================================ Property pages — hide the superseded blocks Paste into Template Settings → CSS (master template). Why here and not Page settings → CSS: the block id bid_5408458 EXISTS ON BOTH property pages with completely different copy on each. Every selector below is scoped by body class so the two pages never affect each other. Do NOT simplify these selectors to a bare #bid_5408458 — that would hide the block on both. Both body classes start with a digit, so `.277-pancake-ln-pelham` and `.141acaciardpelham` are INVALID CSS. The attribute form body[class~="..."] is deliberate, not a mistake. Added 28 August 2026 after both pages were found rendering their old blocks alongside the new ones. ============================================================ */ /* ---- 277 Pancake Ln, Pelham ------------------------------- Superseded by bid_4109386 (hero + intro, above the gallery) and bid_2378249 (features, below the gallery). bid_2152389 — old hero card, "More House. More Land." bid_5408458 — old intro copy, "Some homes are designed..." bid_6622650 — old Internal Features list Keep: tid_2188290 (39 photos), bid_9527388 (video), bid_3604855 (enquiry form), bid_8396104 (map). */ body[class~="277-pancake-ln-pelham"] #bid_2152389, body[class~="277-pancake-ln-pelham"] #bid_2152389-top-space, body[class~="277-pancake-ln-pelham"] #bid_2152389-bottom-space, body[class~="277-pancake-ln-pelham"] #bid_5408458, body[class~="277-pancake-ln-pelham"] #bid_5408458-top-space, body[class~="277-pancake-ln-pelham"] #bid_5408458-bottom-space, body[class~="277-pancake-ln-pelham"] #bid_6622650, body[class~="277-pancake-ln-pelham"] #bid_6622650-top-space, body[class~="277-pancake-ln-pelham"] #bid_6622650-bottom-space { display: none !important; } /* ---- 141 Acacia Rd, Fonthill ------------------------------ Superseded by bid_6250343 (above the gallery) and bid_4387557 (below it). bid_2955797 — old header block bid_5408458 — old intro copy (DIFFERENT text from 277's) Keep: tid_2188290 (10 photos), bid_9040800 (video), bid_5225615 (enquiry form), bid_8372980 (map). */ body[class~="141acaciardpelham"] #bid_2955797, body[class~="141acaciardpelham"] #bid_2955797-top-space, body[class~="141acaciardpelham"] #bid_2955797-bottom-space, body[class~="141acaciardpelham"] #bid_5408458, body[class~="141acaciardpelham"] #bid_5408458-top-space, body[class~="141acaciardpelham"] #bid_5408458-bottom-space { display: none !important; } /* ============================================================ AFTER PASTING, 277 Pancake should render: menu → bid_4109386 (SOLD · FONTHILL hero) → tid_2188290 (gallery) → bid_2378249 (What was in it) → bid_9527388 (Take A Tour) → bid_3604855 (enquiry) → bid_8396104 (Around the Area) → footer Page height drops from ~9,730px to ~7,390px. 141 Acacia should render: menu → bid_6250343 → tid_2188290 → bid_4387557 → bid_9040800 → bid_5225615 → bid_8372980 → footer ============================================================ */ /* ============================================================ Keys & Corners — blog readability fix Paste into: page editor → speed-dial → Template Settings → CSS (Monaco editor — must be pasted by hand.) Scoped to body.blog, so it touches only the blog listing and blog post pages. Nothing else on the site is affected. Measured on vedbhat.ca 2026-08-29 at a 1440px viewport. ============================================================ */ /* 1 — READING COLUMN Was 949px wide = about 90 characters per line. Comfortable reading is 60-75; past ~85 the eye starts losing its place on the return sweep, which is why the theme compensates with very loose leading. 820px lands at 78 characters. */ body.blog .weblet_blog-entry-text { max-width: 820px; } /* 2 — LINE SPACING AND PARAGRAPH GAPS Was line-height 1.6 (32px on 20px type) with a 24px gap between paragraphs. Now 1.45 (29px) with a 14px gap. The theme's own rules are specific, so these need !important to win. */ body.blog .weblet_blog-entry-text p, body.blog .weblet_blog-entry-text li { line-height: 1.45 !important; margin-bottom: 14px !important; } body.blog .weblet_blog-entry-text ul, body.blog .weblet_blog-entry-text ol { margin-bottom: 14px !important; } /* 3 — HEADING HIERARCHY The theme renders in-post H2 at 40px while the post title (H1) is 32px — subheads were louder than the headline. It also gives H2 no top margin at all, so a new section got the same gap as a new paragraph and the structure disappeared. */ body.blog .weblet_blog-entry-text h2 { font-size: 26px !important; line-height: 1.25 !important; margin: 34px 0 8px !important; } body.blog .weblet_blog-entry-text h3 { font-size: 21px !important; line-height: 1.3 !important; margin: 26px 0 6px !important; } /* 4 — HERO AND IN-POST IMAGES Portrait images were rendering up to 949x1424 — taller than a laptop screen, before a single word of the post. Capping the height keeps a landscape hero full width and stops a portrait one from eating a screen and a half. */ body.blog .weblet_blog-blog-entry img { max-height: 560px; width: auto; max-width: 100%; display: block; margin: 0 0 20px; } /* 5 — MOBILE The column cap is irrelevant below 820px, but the tighter rhythm still helps. Nothing further needed; rules above are already fluid. */ :root { --p-font-size: clamp(1rem, calc(1rem + ((1vw - 0.225rem) * 0.235)), 1.125rem); } .block-layout .form-group-optin p, .block-layout .form-group-optin label { font-size: var(--text-small) !important; } .block-layout:has(form) :is(h1,h2,h3,h4), .block-layout:has(form) label { color: #3A3A3A !important; } .block-layout:has(form) :is(h3,h4) { text-transform: none !important; } .block-layout:has(form) label { font-size: var(--p-font-size) !important; } .block-layout:has(form) .title { font-size: 32px !important; } .block-layout:has(form) .sub-title { font-size: var(--p-font-size) !important; font-weight: 300 !important; } body.residential-landlord #bid_6390399, body.residential-landlord #bid_6390399-top-space, body.residential-landlord #bid_6390399-bottom-space, body.residential-landlord #bid_1125413, body.residential-landlord #bid_1125413-top-space, body.residential-landlord #bid_1125413-bottom-space, body.residential-landlord #bid_8075257, body.residential-landlord #bid_8075257-top-space, body.residential-landlord #bid_8075257-bottom-space, body.residential-landlord #bid_7199890, body.residential-landlord #bid_7199890-top-space, body.residential-landlord #bid_7199890-bottom-space, body.residential-landlord #bid_5429643, body.residential-landlord #bid_5429643-top-space, body.residential-landlord #bid_5429643-bottom-space, body.residential-landlord #bid_9916589, body.residential-landlord #bid_9916589-top-space, body.residential-landlord #bid_9916589-bottom-space { display: none !important; } /* ── Column-width correction for the restyled landlord block ── The theme sizes its content containers with a fluid CSS variable, not a fixed pixel width. Matching the variable keeps the block aligned with the native turquoise band at every screen size. Append this BELOW the hide-CSS already in Page settings → CSS. */ body.residential-landlord .vbrl-col, body.residential-landlord .vbrl-ready-in { width: 100%; max-width: calc(var(--max-content-width, 1250px) * 0.75); margin-left: auto; margin-right: auto; } @media (min-width: 60rem) { body.residential-landlord .vbrl-col { padding-left: 0; padding-right: 0; } }