/* * LIANG websites typography * - No serif fonts * - English: Sarabun * - Chinese (zh*): Noto Sans SC * Scoped to our custom component/module output so we don't unexpectedly restyle the whole template. */ @import url("https://fonts.googleapis.com/css2?family=Sarabun:wght@300;400;500;600;700&family=Noto+Sans+SC:wght@300;400;500;600;700&display=swap"); :root { /* Keep both fonts in the stack so mixed-language content renders cleanly. */ --liang-font-family: "Sarabun", "Noto Sans SC", Arial, Helvetica, sans-serif; --liang-link-color: #0d6efd; --liang-link-hover-color: #0a58ca; } html[lang^="zh"] { --liang-font-family: "Noto Sans SC", "Sarabun", Arial, Helvetica, sans-serif; } html, body { font-family: var(--liang-font-family); } /* Our front-end component pages (Joomla typically puts `com_site_property` on ) */ body.com_site_property, body[class*="com_site_property"] { font-family: var(--liang-font-family) !important; } h1, h2, h3, h4, h5, h6, span:not(.fa):not(.fas):not(.far):not(.fab):not(.fal):not(.fad), p, div, li, a, label, input, select, textarea, button { font-family: var(--liang-font-family) !important; } /* Preserve icon fonts that rely on Font Awesome. */ .fa, .fas, .fal, .fad, .far, .fab { font-family: "Font Awesome 5 Free" !important; font-style: normal; font-variant: normal; text-rendering: auto; line-height: 1; } .fa, .fas, .fal, .fad { font-weight: 900; } .far { font-weight: 400; } .fab { font-family: "Font Awesome 5 Brands" !important; font-weight: 400; } /* Offcanvas submenu toggler uses Font Awesome via pseudo-elements. */ .menu-toggler, .menu-toggler::before, .menu-toggler::after { font-family: "Font Awesome 5 Free" !important; font-weight: 900; font-style: normal; font-variant: normal; text-rendering: auto; line-height: 1; } /* Our modules */ .mod-custom-form-json, .mod-agents-display { font-family: var(--liang-font-family) !important; } /* Ensure form controls inherit (browsers often default to system fonts) */ body.com_site_property input, body.com_site_property select, body.com_site_property textarea, body.com_site_property button, body[class*="com_site_property"] input, body[class*="com_site_property"] select, body[class*="com_site_property"] textarea, body[class*="com_site_property"] button, .mod-custom-form-json input, .mod-custom-form-json select, .mod-custom-form-json textarea, .mod-custom-form-json button, .mod-agents-display input, .mod-agents-display select, .mod-agents-display textarea, .mod-agents-display button { font-family: inherit; }