are not in the plugin's selector list at all, so the * submit button and the CF7 response message never change size. * * This file replaces that behaviour with a real, bounded scale. Every rule is * gated behind body[class*="pojo-a11y-resize-font-"], so with nothing selected * -- and again after Reset -- it contributes exactly zero computed differences. * * The contrast-scheme rules at the end are gated on their own body classes * (pojo-a11y-high-contrast / -negative-contrast / -light-background / * -grayscale) and are likewise inert until one is chosen. */ /* ========================================================================== 1. STEP -> MULTIPLIERS ========================================================================== */ /* --a11y-scale body text, headings, lists step 1 +15% ... max +60% --a11y-scale-form inputs, submit, buttons, messages, validation tips, checkbox labels step 1 +30% ... max +75% --a11y-menu-scale the toolbar's own menu items -- held deliberately smaller than page text step 1 +6% ... max +30% Form controls and the toolbar start from the smallest sizes on the page, so they need a bigger first jump to read as "bigger"; the menu needs a smaller one so the panel does not outgrow its 180px width. */ :root { --a11y-scale: 1; --a11y-scale-form: 1; --a11y-menu-scale: 1; } body.pojo-a11y-resize-font-130 { --a11y-scale: 1.15; --a11y-scale-form: 1.30; --a11y-menu-scale: 1.06; } body.pojo-a11y-resize-font-140 { --a11y-scale: 1.22; --a11y-scale-form: 1.40; --a11y-menu-scale: 1.10; } body.pojo-a11y-resize-font-150 { --a11y-scale: 1.28; --a11y-scale-form: 1.48; --a11y-menu-scale: 1.14; } body.pojo-a11y-resize-font-160 { --a11y-scale: 1.35; --a11y-scale-form: 1.55; --a11y-menu-scale: 1.18; } body.pojo-a11y-resize-font-170 { --a11y-scale: 1.42; --a11y-scale-form: 1.62; --a11y-menu-scale: 1.21; } body.pojo-a11y-resize-font-180 { --a11y-scale: 1.48; --a11y-scale-form: 1.68; --a11y-menu-scale: 1.24; } body.pojo-a11y-resize-font-190 { --a11y-scale: 1.54; --a11y-scale-form: 1.72; --a11y-menu-scale: 1.27; } body.pojo-a11y-resize-font-200 { --a11y-scale: 1.60; --a11y-scale-form: 1.75; --a11y-menu-scale: 1.30; } /* ========================================================================== 2. BASE PIN ========================================================================== */ /* Deliberately NOT scoped to a content root: is what every "inherit" below resolves against. calc(), never a flat px -- a flat value would freeze the toolbar popup, which is a sibling of .elementor and inherits from . 16px is the measured baseline computed size on this site. */ html body[class*="pojo-a11y-resize-font-"] { font-size: calc(16px * var(--a11y-scale)) !important; } /* ========================================================================== 3. KILL THE COMPOUNDING PERCENTAGES ========================================================================== */ /* One entry per content root found on the site: .elementor (every Elementor page, including the header/footer template .elementor-48 nested inside it), .description-section (page.php and 404.php), and the bare-body templates single.php / index.php / search.php, which print the_content() straight into with no wrapper at all. input / select / textarea are deliberately excluded -- they are pinned to real values in section 4. */ html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor p, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor li, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor span, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor label, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor blockquote, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor legend, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor code, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor pre, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor dd, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor dt, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section p, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section li, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section span, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section label, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section blockquote, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section legend, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section code, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section pre, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section dd, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section dt, html body[class*="pojo-a11y-resize-font-"].single p:not(.pojo-a11y-toolbar-title), html body[class*="pojo-a11y-resize-font-"].single li:not(.pojo-a11y-toolbar-item), html body[class*="pojo-a11y-resize-font-"].single span, html body[class*="pojo-a11y-resize-font-"].single label, html body[class*="pojo-a11y-resize-font-"].single blockquote, html body[class*="pojo-a11y-resize-font-"].single legend, html body[class*="pojo-a11y-resize-font-"].single code, html body[class*="pojo-a11y-resize-font-"].single pre, html body[class*="pojo-a11y-resize-font-"].single dd, html body[class*="pojo-a11y-resize-font-"].single dt, html body[class*="pojo-a11y-resize-font-"].blog p:not(.pojo-a11y-toolbar-title), html body[class*="pojo-a11y-resize-font-"].blog li:not(.pojo-a11y-toolbar-item), html body[class*="pojo-a11y-resize-font-"].blog span, html body[class*="pojo-a11y-resize-font-"].blog label, html body[class*="pojo-a11y-resize-font-"].blog blockquote, html body[class*="pojo-a11y-resize-font-"].blog legend, html body[class*="pojo-a11y-resize-font-"].blog code, html body[class*="pojo-a11y-resize-font-"].blog pre, html body[class*="pojo-a11y-resize-font-"].blog dd, html body[class*="pojo-a11y-resize-font-"].blog dt, html body[class*="pojo-a11y-resize-font-"].archive p:not(.pojo-a11y-toolbar-title), html body[class*="pojo-a11y-resize-font-"].archive li:not(.pojo-a11y-toolbar-item), html body[class*="pojo-a11y-resize-font-"].archive span, html body[class*="pojo-a11y-resize-font-"].archive label, html body[class*="pojo-a11y-resize-font-"].archive blockquote, html body[class*="pojo-a11y-resize-font-"].archive legend, html body[class*="pojo-a11y-resize-font-"].archive code, html body[class*="pojo-a11y-resize-font-"].archive pre, html body[class*="pojo-a11y-resize-font-"].archive dd, html body[class*="pojo-a11y-resize-font-"].archive dt, html body[class*="pojo-a11y-resize-font-"].search p:not(.pojo-a11y-toolbar-title), html body[class*="pojo-a11y-resize-font-"].search li:not(.pojo-a11y-toolbar-item), html body[class*="pojo-a11y-resize-font-"].search span, html body[class*="pojo-a11y-resize-font-"].search label, html body[class*="pojo-a11y-resize-font-"].search blockquote, html body[class*="pojo-a11y-resize-font-"].search legend, html body[class*="pojo-a11y-resize-font-"].search code, html body[class*="pojo-a11y-resize-font-"].search pre, html body[class*="pojo-a11y-resize-font-"].search dd, html body[class*="pojo-a11y-resize-font-"].search dt, html body[class*="pojo-a11y-resize-font-"].error404 p:not(.pojo-a11y-toolbar-title), html body[class*="pojo-a11y-resize-font-"].error404 li:not(.pojo-a11y-toolbar-item), html body[class*="pojo-a11y-resize-font-"].error404 span, html body[class*="pojo-a11y-resize-font-"].error404 label, html body[class*="pojo-a11y-resize-font-"].error404 blockquote, html body[class*="pojo-a11y-resize-font-"].error404 legend, html body[class*="pojo-a11y-resize-font-"].error404 code, html body[class*="pojo-a11y-resize-font-"].error404 pre, html body[class*="pojo-a11y-resize-font-"].error404 dd, html body[class*="pojo-a11y-resize-font-"].error404 dt { font-size: inherit !important; } /* ========================================================================== 4. FORM CONTROLS, MESSAGES AND VALIDATION TIPS ========================================================================== */ /* Values mirror assets/css/style.css 1:1, and the @media blocks below are emitted in the theme's own source order -- the theme has two overlapping bands ((min-width:500px) and (max-width:767px) declared before (max-width:768px)), which resolve by order, not by specificity. px / vw only: never em (CF7's nested spans would compound it) and never rem (it shrinks below the design size on wide screens). max() floors: several of these are sized in vw with no tablet override and render at 4-8px below ~900px. The floor only ever applies inside the gate, so the default render is untouched; it just means asking for bigger text actually produces readable text. */ html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form input, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form textarea { font-size: calc(max(14px, 1vw) * var(--a11y-scale-form)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .global-btn { font-size: calc(24px * var(--a11y-scale-form)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .submit-col .global-btn, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .wpcf7-submit, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .submit-btn input[type="submit"] { font-size: calc(max(16px, 1.2vw) * var(--a11y-scale-form)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .wpcf7-list-item-label, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .custom-check-label { font-size: calc(max(12px, 0.66vw) * var(--a11y-scale-form)) !important; line-height: 1.4 !important; } /* The response output is a

, so the plugin cannot touch it at all: without this it stays frozen at 16px while everything around it grows. Unitless line-height -- the theme's own vh value would not grow with the font. NOTE: the theme's rule for this element (.private-contact-form .wpcf7 form .wpcf7-response-output) never matches, because the response output is a SIBLING of .private-contact-form, not a descendant. See the report. */ html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .wpcf7 form .wpcf7-response-output, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .wpcf7-response-output { font-size: calc(max(14px, 0.8vw) * var(--a11y-scale-form)) !important; line-height: 1.5 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .wpcf7-not-valid-tip { font-size: calc(max(14px, 0.8vw) * var(--a11y-scale-form)) !important; line-height: 1.4 !important; } @media (min-width: 768px) and (max-width: 1079px) { html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .privacy-checkbox .wpcf7-list-item-label, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .privacy-checkbox .custom-check-label { font-size: calc(max(12px, 0.8vw) * var(--a11y-scale-form)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form input, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form textarea { font-size: calc(max(14px, 1.5vw) * var(--a11y-scale-form)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .submit-col .global-btn { font-size: calc(max(16px, 1.6vw) * var(--a11y-scale-form)) !important; } } @media (min-width: 500px) and (max-width: 767px) { html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .privacy-checkbox .wpcf7-list-item-label, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .privacy-checkbox .custom-check-label { font-size: calc(12px * var(--a11y-scale-form)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form input, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form textarea { font-size: calc(16px * var(--a11y-scale-form)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .submit-col .global-btn { font-size: calc(18px * var(--a11y-scale-form)) !important; } } @media (max-width: 768px) { html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .wpcf7-not-valid-tip { font-size: calc(max(13px, 12px) * var(--a11y-scale-form)) !important; line-height: 1.4 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .wpcf7-response-output, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .wpcf7 form .wpcf7-response-output, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .wpcf7 form .wpcf7-response-output { font-size: calc(max(13px, 12px) * var(--a11y-scale-form)) !important; line-height: 1.5 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .privacy-checkbox .wpcf7-list-item-label, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .privacy-checkbox .custom-check-label { font-size: calc(max(13px, 2.4vw) * var(--a11y-scale-form)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .submit-col .global-btn { font-size: calc(18px * var(--a11y-scale-form)) !important; } } @media (max-width: 480px) { html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form input, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form textarea { font-size: calc(16px * var(--a11y-scale-form)) !important; } } /* ========================================================================== 4b. ELEMENTS CARRYING AN INTENTIONAL SIZE OF THEIR OWN ========================================================================== */ /* Section 3 would otherwise flatten these to the body size. .privacy-wrapper .privacy-content is written as .privacy-wrapper .privacy-content :where(p, li, a, div) which is specificity (0,2,0) -- :where() contributes ZERO -- so it loses to the section 3 rule above and has to be restated explicitly here. The theme's line-height for this content is in vh, which does not grow with the font; forced unitless so the modal text cannot overlap itself. */ html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content p, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content li, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content a, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content div, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content span { font-size: calc(max(13px, 0.8vw) * var(--a11y-scale)) !important; line-height: 1.6 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content h2 { font-size: calc(max(18px, 1.4vw) * var(--a11y-scale)) !important; line-height: 1.4 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content h3 { font-size: calc(max(16px, 1.1vw) * var(--a11y-scale)) !important; line-height: 1.4 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .pv-links > span, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .pv-link { font-size: calc(max(13px, 0.8vw) * var(--a11y-scale)) !important; line-height: 1.3 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .success-title { font-size: calc(23px * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .success-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .success-subtitle { font-size: calc(max(20px, 2vw) * var(--a11y-scale)) !important; } @media (max-width: 768px) { html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content p, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content li, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content a, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content div, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content span { font-size: calc(12px * var(--a11y-scale)) !important; line-height: 1.6 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content h2 { font-size: calc(18px * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .privacy-wrapper .privacy-content h3 { font-size: calc(16px * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .pv-links > span, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .pv-link { font-size: calc(14px * var(--a11y-scale)) !important; } } /* The consent checkbox is drawn with appearance:none plus a "✓" in ::before. The box itself is sized in vw and is NOT scaled, so the tick is pinned to the theme's own value too -- otherwise the plugin's input{font-size:NN%} rule would push the glyph straight out of the box. */ html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before { font-size: 0.8vw !important; line-height: 1 !important; } @media (max-width: 768px) { html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before { font-size: 3.2vw !important; line-height: 1 !important; } } /* ========================================================================== 4c. COOKIE BANNER ========================================================================== */ /* #cc-banner-root is a direct child of , OUTSIDE .elementor, so the inherit rule in section 3 cannot reach it. Plugin-only, measured on this site: .cc-title 16px -> 24.2px (step 130) -> 37.2px (step 200) runaway .cc-body 14px -> 18.2px -> 28.0px runaway .cc-root 14px -> 14px -> 14px frozen .cc-btn 14px -> 14px -> 14px frozen The two runaways are the plugin's h_/p/span rules compounding; the two freezes are because .cc-root and .cc-actions are

s, which the plugin's selector list does not include at all, and .cc-btn's own rule is "font-size: inherit". Every pin below is calc(...) -- a flat px would stop the runaway but leave the banner frozen, so the visitor would click "bigger text" and see nothing move. .cc-title and .cc-btn use the form curve off bumped baselines (16->18, 14->15) so the very first click is a visible jump. Each pin is given both a bare and a .cc-root-scoped selector so it wins whether the element sits in the banner or in the settings modal. Note the ordering: "html body[attr] .cc-root .cc-body" is (0,3,2) and beats the generic "html body[attr] .cc-root p" at (0,2,3), because the class column is compared before the element column. */ html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root p, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root li, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root span, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root label, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root a, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root div { font-size: inherit !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root { font-size: calc(14px * var(--a11y-scale)) !important; line-height: 1.5 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root .cc-title { font-size: calc(18px * var(--a11y-scale-form)) !important; line-height: 1.3 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-body, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root .cc-body { font-size: calc(14px * var(--a11y-scale-form)) !important; line-height: 1.5 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-btn, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root .cc-btn, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-btn.cc-btn-text, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root .cc-btn.cc-btn-text { font-size: calc(15px * var(--a11y-scale-form)) !important; line-height: 1.3 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-lang-toggle, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root .cc-lang-toggle { font-size: calc(12px * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-modal-head h2, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root .cc-modal-head h2 { font-size: calc(18px * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-modal-close, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root .cc-modal-close { font-size: calc(24px * var(--a11y-scale)) !important; line-height: 1 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-cat-desc, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root .cc-cat-desc { font-size: calc(13px * var(--a11y-scale)) !important; line-height: 1.5 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-required-badge, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root .cc-required-badge { font-size: calc(11px * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-cookies-list, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root .cc-cookies-list, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-cookies-list th, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-cookies-list td, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root .cc-cookies-list th, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .cc-root .cc-cookies-list td { font-size: calc(12px * var(--a11y-scale)) !important; line-height: 1.4 !important; } /* ========================================================================== 4d. VALIDATION TIP POSITIONING ========================================================================== */ /* The theme takes the consent-checkbox tip out of flow so it does not disturb the layout, and anchors it with a FIXED offset: .private-contact-form .privacy-checkbox.first .wpcf7-not-valid-tip { position: absolute; top: 3vw; width: 100%; min-width: fit-content; text-wrap: nowrap; } @media (max-width: 768px) { ... top: 4vh } A fixed top cannot track a consent label that grows taller as it is scaled, so the red message ends up drawn across the consent text. Measured on this page at 1920px, plugin only: overlap none -25px (clear), step 130 +69px, step 160 +157px, step 200 +384px. The nowrap also blew the tip out to 1833px wide at step 200 and pushed documentElement.scrollWidth to 2430px. Fix: re-anchor the tip to the BOTTOM of the checkbox row so it tracks the label automatically, and let it wrap. position:static is not an option -- the tip lives inside .wpcf7-form-control-wrap, which is only ~35px wide, so the message would be squeezed into a column. Instead the containing block is moved up one level to the row itself. */ html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .privacy-checkbox.first { position: relative !important; padding-bottom: calc(max(14px, 0.8vw) * var(--a11y-scale-form) * 1.5 + 8px) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .privacy-checkbox.first .wpcf7-form-control-wrap { position: static !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .privacy-checkbox.first .wpcf7-not-valid-tip { top: auto !important; bottom: 0 !important; right: 0 !important; left: 0 !important; width: auto !important; min-width: 0 !important; max-width: 100% !important; margin-top: 0 !important; white-space: normal !important; text-wrap: wrap !important; } @media (max-width: 768px) { html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .privacy-checkbox.first .wpcf7-not-valid-tip { top: auto !important; bottom: 0 !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .private-contact-form .privacy-checkbox.first { padding-bottom: calc(max(13px, 12px) * var(--a11y-scale-form) * 1.5 + 8px) !important; } } /* ========================================================================== 5. PER-ELEMENT PINS FROM THE ELEMENTOR PAGE CSS ========================================================================== */ /* Every font-size rule in post-2.css (the page) and post-48.css (the header/footer template nested inside it), at base and inside the (max-width: 767px) block the source uses, wrapped in the gate and multiplied by the scale. Elementor buttons use the form curve. */ html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-1b6eff4c .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-1f9034e0 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-20128d1b .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-20b453e4 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-24b38e3e .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-36d63bed .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-4bb289c .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-54eff611 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-5dc8d8e5 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-5f626190 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-6099d797 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-698ded5f .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-6b8bcfff .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-6d1a7530 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-727407b3 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-72d89204 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-755ff24d .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-76c7dec .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-787c6c05 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-845a593 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-b5b1726 .elementor-heading-title { font-size: calc(1.3vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-ceb4967 .elementor-button, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-f958c89 .elementor-button { font-size: calc(1.3vw * var(--a11y-scale-form)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-61fdab6 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-a155c05 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e5e0196 .elementor-heading-title { font-size: calc(3.5vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-3e3f068 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-7f91846 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-da234fd .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e635c4b .elementor-heading-title { font-size: calc(3vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .currency, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-a3135c5 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-d3ae33f .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-d8c3dba .elementor-heading-title { font-size: calc(2vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-1016442 .elementor-image-box-description, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-1016442 .elementor-image-box-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-2bb5b19 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-584fe94 .elementor-image-box-description, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-584fe94 .elementor-image-box-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-674b5a8 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-a38f5a1 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-b556102 .elementor-image-box-description, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-b556102 .elementor-image-box-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-b7ea605 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-b80809e .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-cc9e71d .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e3aff77 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e757d71 .elementor-image-box-description, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e757d71 .elementor-image-box-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-f17fa79 .elementor-heading-title { font-size: calc(1.4vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-23f3da9 .elementor-heading-title { font-size: calc(0.9vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-4137fbe .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-d5ce9dc .elementor-heading-title { font-size: calc(1.8vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-0e4c493 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-1bb314f .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-538cd27 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-6b66a28 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-7450b07 .elementor-icon-list-item > .elementor-icon-list-text, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-7450b07 .elementor-icon-list-item > a { font-size: calc(1vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-7e92abf .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e77691e .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-ffc4c36 .elementor-heading-title { font-size: calc(2.6vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-6f67646 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e7a79b7 .elementor-heading-title { font-size: calc(3.4vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-0f77a8c .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-46f81be .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-f02e5e2 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-f6179e5 .elementor-heading-title { font-size: calc(1.5vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-3d35b65 .elementor-heading-title { font-size: calc(2.9vw * var(--a11y-scale)) !important; } @media (max-width: 767px) { html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-0f77a8c .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-1016442 .elementor-image-box-description, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-1016442 .elementor-image-box-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-4137fbe .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-46f81be .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-584fe94 .elementor-image-box-description, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-584fe94 .elementor-image-box-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-674b5a8 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-7450b07 .elementor-icon-list-item > .elementor-icon-list-text, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-7450b07 .elementor-icon-list-item > a, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-a38f5a1 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-b556102 .elementor-image-box-description, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-b556102 .elementor-image-box-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-b7ea605 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-cc9e71d .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-d3ae33f .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e757d71 .elementor-image-box-description, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e757d71 .elementor-image-box-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-f17fa79 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-f6179e5 .elementor-heading-title { font-size: calc(16px * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-ceb4967 .elementor-button, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-f958c89 .elementor-button { font-size: calc(16px * var(--a11y-scale-form)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-61fdab6 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e5e0196 .elementor-heading-title { font-size: calc(10vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .currency, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-3d35b65 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-3e3f068 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-6f67646 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-7e92abf .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-a155c05 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-da234fd .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e635c4b .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e77691e .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e7a79b7 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-ffc4c36 .elementor-heading-title { font-size: calc(6vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-d8c3dba .elementor-heading-title { font-size: calc(5vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-7f91846 .elementor-heading-title { font-size: calc(9vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-23f3da9 .elementor-heading-title { font-size: calc(3vw * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-a3135c5 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-d5ce9dc .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-1b6eff4c .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-1f9034e0 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-20128d1b .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-20b453e4 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-24b38e3e .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-36d63bed .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-4bb289c .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-54eff611 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-5dc8d8e5 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-5f626190 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-6099d797 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-698ded5f .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-6b8bcfff .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-6d1a7530 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-727407b3 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-72d89204 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-755ff24d .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-76c7dec .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-787c6c05 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-845a593 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-48 .elementor-element.elementor-element-b5b1726 .elementor-heading-title { font-size: calc(18px * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-2bb5b19 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-b80809e .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-e3aff77 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-f02e5e2 .elementor-heading-title { font-size: calc(3.4vw * var(--a11y-scale)) !important; } /* Elements the page CSS gives no mobile override, so they fall back to a base vw value and render at 4-8px on a phone. Floored -- inside the gate only, so the default render is untouched. */ html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-0e4c493 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-1bb314f .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-538cd27 .elementor-heading-title, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor-2 .elementor-element.elementor-element-6b66a28 .elementor-heading-title { font-size: calc(max(12px, 1vw) * var(--a11y-scale)) !important; } } /* ========================================================================== 5b. HEADINGS ON THEME-TEMPLATE PAGES ========================================================================== */ /* page.php, 404.php, single.php, index.php and search.php render plain content with no Elementor rule to supply a heading size, so the size comes from Bootstrap. Mirrored 1:1 and scaled -- without this the plugin's "h1..h6 { font-size: NN*1.33% !important }" rule runs them away, and it also overrides 404.php's inline style="font-size:30px" (an !important declaration in a stylesheet beats a non-important inline style). */ html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor h1, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section h1, html body[class*="pojo-a11y-resize-font-"].single h1, html body[class*="pojo-a11y-resize-font-"].blog h1, html body[class*="pojo-a11y-resize-font-"].archive h1, html body[class*="pojo-a11y-resize-font-"].search h1, html body[class*="pojo-a11y-resize-font-"].error404 h1 { font-size: calc(calc(1.375rem + 1.5vw) * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor h2, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section h2, html body[class*="pojo-a11y-resize-font-"].single h2, html body[class*="pojo-a11y-resize-font-"].blog h2, html body[class*="pojo-a11y-resize-font-"].archive h2, html body[class*="pojo-a11y-resize-font-"].search h2, html body[class*="pojo-a11y-resize-font-"].error404 h2 { font-size: calc(calc(1.325rem + 0.9vw) * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor h3, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section h3, html body[class*="pojo-a11y-resize-font-"].single h3, html body[class*="pojo-a11y-resize-font-"].blog h3, html body[class*="pojo-a11y-resize-font-"].archive h3, html body[class*="pojo-a11y-resize-font-"].search h3, html body[class*="pojo-a11y-resize-font-"].error404 h3 { font-size: calc(calc(1.3rem + 0.6vw) * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor h4, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section h4, html body[class*="pojo-a11y-resize-font-"].single h4, html body[class*="pojo-a11y-resize-font-"].blog h4, html body[class*="pojo-a11y-resize-font-"].archive h4, html body[class*="pojo-a11y-resize-font-"].search h4, html body[class*="pojo-a11y-resize-font-"].error404 h4 { font-size: calc(calc(1.275rem + 0.3vw) * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor h5, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section h5, html body[class*="pojo-a11y-resize-font-"].single h5, html body[class*="pojo-a11y-resize-font-"].blog h5, html body[class*="pojo-a11y-resize-font-"].archive h5, html body[class*="pojo-a11y-resize-font-"].search h5, html body[class*="pojo-a11y-resize-font-"].error404 h5 { font-size: calc(1.25rem * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor h6, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section h6, html body[class*="pojo-a11y-resize-font-"].single h6, html body[class*="pojo-a11y-resize-font-"].blog h6, html body[class*="pojo-a11y-resize-font-"].archive h6, html body[class*="pojo-a11y-resize-font-"].search h6, html body[class*="pojo-a11y-resize-font-"].error404 h6 { font-size: calc(1rem * var(--a11y-scale)) !important; } @media (min-width: 1200px) { html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor h1, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section h1, html body[class*="pojo-a11y-resize-font-"].single h1, html body[class*="pojo-a11y-resize-font-"].blog h1, html body[class*="pojo-a11y-resize-font-"].archive h1, html body[class*="pojo-a11y-resize-font-"].search h1, html body[class*="pojo-a11y-resize-font-"].error404 h1 { font-size: calc(2.5rem * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor h2, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section h2, html body[class*="pojo-a11y-resize-font-"].single h2, html body[class*="pojo-a11y-resize-font-"].blog h2, html body[class*="pojo-a11y-resize-font-"].archive h2, html body[class*="pojo-a11y-resize-font-"].search h2, html body[class*="pojo-a11y-resize-font-"].error404 h2 { font-size: calc(2rem * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor h3, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section h3, html body[class*="pojo-a11y-resize-font-"].single h3, html body[class*="pojo-a11y-resize-font-"].blog h3, html body[class*="pojo-a11y-resize-font-"].archive h3, html body[class*="pojo-a11y-resize-font-"].search h3, html body[class*="pojo-a11y-resize-font-"].error404 h3 { font-size: calc(1.75rem * var(--a11y-scale)) !important; } html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .elementor h4, html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .description-section h4, html body[class*="pojo-a11y-resize-font-"].single h4, html body[class*="pojo-a11y-resize-font-"].blog h4, html body[class*="pojo-a11y-resize-font-"].archive h4, html body[class*="pojo-a11y-resize-font-"].search h4, html body[class*="pojo-a11y-resize-font-"].error404 h4 { font-size: calc(1.5rem * var(--a11y-scale)) !important; } } /* 404.php sets its heading inline at 30px; keep that, scaled. */ html body[class*="pojo-a11y-resize-font-"]:not(#pojo-a11y-toolbar) .error-content .text-wraper h3 { font-size: calc(30px * var(--a11y-scale)) !important; } /* ========================================================================== 6. THE ACCESSIBILITY TOOLBAR ITSELF ========================================================================== */ /* #pojo-a11y-toolbar is a SIBLING of .elementor, so none of the scoped rules above reach it. Left alone, the plugin's own "span { font-size: NN% }" rule doubles every menu item (12.8px -> 25.6px at step 200), which overflows the 180px panel. Held to a much gentler curve so the menu reads smaller than the page text, as asked. The ID in the selector puts these above every rule the plugin emits. */ html body[class*="pojo-a11y-resize-font-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a, html body[class*="pojo-a11y-resize-font-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-item a span, html body[class*="pojo-a11y-resize-font-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-text, html body[class*="pojo-a11y-resize-font-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-icon, html body[class*="pojo-a11y-resize-font-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-link span { font-size: calc(12.8px * var(--a11y-menu-scale)) !important; line-height: 1.2 !important; } html body[class*="pojo-a11y-resize-font-"] #pojo-a11y-toolbar p.pojo-a11y-toolbar-title { font-size: calc(16px * var(--a11y-menu-scale)) !important; } html body[class*="pojo-a11y-resize-font-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle a { font-size: 140% !important; } /* ========================================================================== 7. CONTRAST SCHEMES -- THE CONSENT CHECKBOX ========================================================================== */ /* The checkbox is appearance:none with a "✓" drawn in ::before, so it depends entirely on its own background / border / colour. Each scheme breaks that in a different way: light background the plugin forces background:#fff on everything, but nothing overrides the theme's white 1px border -- the box becomes white-on-white and disappears, leaving the tick floating on its own. negative contrast background is forced to #000 and text to yellow, so the tick is drawn in yellow at whatever contrast it lands on. high contrast the plugin's black background loses to the theme's translucent-white one (0,1,1) vs (0,2,1), so the box keeps a washed-out fill. grayscale a filter only, but the translucent fill desaturates to a low-contrast grey. The plugin's schema rules are written as body.pojo-a11y-light-background *:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) which is (1,2,1) -- the :not(#id) contributes a full ID. A plain class-based selector, however long, loses on the ID column, so :not(#pojo-a11y-toolbar) is carried here too: it matches everything and buys the ID back. */ html body.pojo-a11y-high-contrast .private-contact-form .privacy-checkbox input[type="checkbox"]:not(#pojo-a11y-toolbar), html body.pojo-a11y-negative-contrast .private-contact-form .privacy-checkbox input[type="checkbox"]:not(#pojo-a11y-toolbar) { -webkit-appearance: none !important; appearance: none !important; background: #000 !important; background-color: #000 !important; border: 2px solid #fff !important; opacity: 1 !important; } html body.pojo-a11y-high-contrast .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before, html body.pojo-a11y-negative-contrast .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before { color: #fff !important; opacity: 1 !important; } html body.pojo-a11y-light-background .private-contact-form .privacy-checkbox input[type="checkbox"]:not(#pojo-a11y-toolbar) { -webkit-appearance: none !important; appearance: none !important; background: #fff !important; background-color: #fff !important; border: 2px solid #000 !important; opacity: 1 !important; } html body.pojo-a11y-light-background .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before { color: #000 !important; opacity: 1 !important; } html body.pojo-a11y-grayscale .private-contact-form .privacy-checkbox input[type="checkbox"]:not(#pojo-a11y-toolbar) { -webkit-appearance: none !important; appearance: none !important; background: #333 !important; background-color: #333 !important; border: 2px solid #fff !important; opacity: 1 !important; } html body.pojo-a11y-grayscale .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before { color: #fff !important; opacity: 1 !important; } /* The tick is centred with top:60%/translate(-50%,-50%) and is sized in vw independently of the box. Restated for all four schemes so nothing the schemes do to font-size can push it out of the box. */ html body.pojo-a11y-high-contrast .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before, html body.pojo-a11y-negative-contrast .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before, html body.pojo-a11y-light-background .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before, html body.pojo-a11y-grayscale .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before { content: "\2713" !important; /* the theme's tick, escaped so the file stays pure ASCII */ position: absolute !important; top: 60% !important; left: 50% !important; transform: translate(-50%, -50%) !important; line-height: 1 !important; font-size: 0.8vw !important; font-weight: bold !important; pointer-events: none !important; } @media (max-width: 768px) { html body.pojo-a11y-high-contrast .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before, html body.pojo-a11y-negative-contrast .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before, html body.pojo-a11y-light-background .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before, html body.pojo-a11y-grayscale .private-contact-form .privacy-checkbox input[type="checkbox"]:checked::before { font-size: 3.2vw !important; } }