.elementor-4528 .elementor-element.elementor-element-c0bd401{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--flex-wrap:nowrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS *//* CBT 2026-09-25 phase 4 — one site-wide header (Elementor header template, custom CSS). Structure: container.phdr > [HTML widget .phdr-logo-w] [WordPress Menu widget .phdr-nav #phdr-nav (menu 40 "Menu Final")] [HTML widget .phdr-act-w]. Menu markup is WordPress's own (ul.menu / li.menu-item-has-children / ul.sub-menu), so the menu stays editable in Appearance > Menus. Colours = kit globals: navy #151554, text #18203A, muted #4A5656, canvas #F4F7FA, cyan #07CCFB. Kit Theme Style sets `.elementor-kit-1803 a{color:#911C1A}` (0,1,1): every colour here is scoped under .phdr to outrank it. */ /* sticky on every page: the location wrapper is a direct child of */ .elementor-location-header:has(.phdr){position:sticky;top:0;z-index:999} body.admin-bar .elementor-location-header:has(.phdr){top:32px} @media (max-width:782px){ body.admin-bar .elementor-location-header:has(.phdr){top:46px} } @media (max-width:600px){ body.admin-bar .elementor-location-header:has(.phdr){top:0} } .elementor .phdr.e-con,.phdr{--ink:#151554;--ink-2:#26268a;--text:#18203a;--muted:#4a5656;--canvas:#f4f7fa;--line:#d5dde6;--cyan:#07ccfb; display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;gap:24px;height:76px;min-height:0;margin:0; padding:0 max(24px,calc((100% - 1320px) / 2));background:#fff;border-bottom:1px solid #e6ecf1;font-family:Nunito,system-ui,sans-serif} .phdr *{box-sizing:border-box} .phdr a{color:var(--text);word-spacing:0} .phdr>.elementor-widget{margin:0;width:auto;max-width:none} .phdr .elementor-widget-container{margin:0;padding:0} /* logo */ .phdr>.phdr-logo-w{flex:0 0 auto} .phdr-logo{display:block;line-height:0;padding:7px 0} .phdr .phdr-logo img{width:172px;height:auto;max-width:none} /* menu (desktop) */ .phdr>.phdr-nav{flex:1 1 auto;min-width:0} .phdr-nav h5,.phdr-nav .widget-title{display:none} .phdr-nav ul.menu{display:flex;justify-content:center;gap:2px;margin:0;padding:0;list-style:none} .phdr-nav ul.menu li{position:relative;list-style:none;margin:0} .phdr .phdr-nav ul.menu>li>a{display:flex;align-items:center;gap:6px;min-height:44px;padding:0 9px;border-radius:10px; font-family:Manrope,Nunito,sans-serif;font-weight:700;font-size:14.5px;letter-spacing:-.01em;line-height:1.2;color:var(--text);text-decoration:none;white-space:nowrap} .phdr-nav ul.menu>li.menu-item-has-children>a::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);opacity:.55} .phdr .phdr-nav ul.menu>li>a:hover,.phdr .phdr-nav ul.menu>li:focus-within>a{background:var(--canvas);color:var(--ink)} .phdr .phdr-nav ul.menu>li.current-menu-item>a,.phdr .phdr-nav ul.menu>li.current-menu-ancestor>a{color:var(--ink);box-shadow:inset 0 -3px 0 var(--cyan)} .phdr-nav .sub-menu{position:absolute;left:0;top:calc(100% + 6px);z-index:2;min-width:260px;max-width:340px;margin:0;padding:8px;list-style:none;background:#fff; border:1px solid #e3e9ef;border-radius:14px;box-shadow:0 24px 48px -20px rgba(5,6,40,.28); opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity .15s,transform .15s,visibility .15s} .phdr-nav li.menu-item-has-children:hover>.sub-menu,.phdr-nav li.menu-item-has-children:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none} .phdr-nav ul.menu>li.menu-item-has-children::before{content:"";position:absolute;left:0;right:0;top:100%;height:8px} /* hover bridge */ .phdr .phdr-nav .sub-menu a{display:block;padding:9px 12px;border-radius:9px;font-size:14.5px;line-height:1.35;color:var(--text);text-decoration:none} .phdr .phdr-nav .sub-menu a:hover,.phdr .phdr-nav .sub-menu a:focus-visible{background:var(--canvas);color:var(--ink)} .phdr-nav ul.menu>li:nth-last-child(-n+2)>.sub-menu{left:auto;right:0} .phdr-nav ul.menu>li:not(:has(.sub-menu .sub-menu))>.sub-menu{max-height:min(70vh,560px);overflow:auto} /* long blog list */ /* "Rent a Printer" has 3 levels (Short Term > products, Long Term > categories, then Application + brands): shown as a 3-column panel with the level-2 parents as group labels. */ .phdr-nav ul.menu>li:has(.sub-menu .sub-menu)>.sub-menu{min-width:0;max-width:none;width:min(900px,calc(100vw - 48px));left:50%;right:auto; transform:translate(-50%,4px);padding:18px;columns:3;column-gap:24px} .phdr-nav ul.menu>li:has(.sub-menu .sub-menu):hover>.sub-menu,.phdr-nav ul.menu>li:has(.sub-menu .sub-menu):focus-within>.sub-menu{transform:translate(-50%,0)} .phdr-nav .sub-menu .sub-menu{position:static;opacity:1;visibility:inherit;transform:none;box-shadow:none;border:0;border-radius:0;padding:0;min-width:0;max-width:none;background:none} .phdr-nav .sub-menu>li{break-inside:avoid} .phdr-nav .sub-menu>li.menu-item-has-children{margin-bottom:10px} .phdr .phdr-nav .sub-menu>li.menu-item-has-children>a{font-family:Manrope,Nunito,sans-serif;font-weight:800;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:6px 12px} /* actions */ .phdr>.phdr-act-w{flex:0 0 auto} .phdr-act{display:flex;align-items:center;gap:10px} /* scoped under .phdr: the kit's `.elementor-kit-1803 a` Nunito rule (0,1,1) outranks a bare .phdr-btn */ .phdr .phdr-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:11px;border:1.5px solid transparent; font-family:Manrope,Nunito,sans-serif;font-weight:800;font-size:14.5px;line-height:1;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s} .phdr-btn svg{width:16px;height:16px} .phdr .phdr-btn--line{border-color:var(--line);color:var(--ink);background:#fff} .phdr .phdr-btn--line:hover{border-color:var(--ink);color:var(--ink);background:#fff} .phdr .phdr-btn--ink{background:var(--ink);color:#fff} .phdr .phdr-btn--ink:hover,.phdr .phdr-btn--ink:focus{background:var(--ink-2);color:#fff} .phdr a:focus-visible,.phdr button:focus-visible{outline:3px solid var(--cyan);outline-offset:2px} /* 8 menu items + logo + number don't fit one row (measured 1,428px vs 1,240): the call button is icon-only on desktop (accessible name "Call 021 555 2334"); the full number sits in the mobile menu. */ .phdr-call span,.phdr-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} .phdr .phdr-call{padding:0;width:44px} .phdr .phdr-burger{display:none} .phdr-mobile-cta{display:none} /* tablet + phone: burger panel with accordion */ @media (max-width:1260px){ .elementor .phdr.e-con,.phdr{height:68px;gap:12px;padding:0 16px} .phdr-logo{padding:12px 0} .phdr .phdr-logo img{width:168px} .phdr .phdr-call{display:none} .phdr .phdr-burger{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1.5px solid var(--line);border-radius:11px;background:#fff;color:var(--ink);padding:0} .phdr .phdr-burger:hover,.phdr .phdr-burger:focus{background:#fff;color:var(--ink)} .phdr-burger-bars,.phdr-burger-bars::before,.phdr-burger-bars::after{display:block;width:18px;height:2px;background:currentColor;border-radius:2px;position:relative;transition:transform .2s} .phdr-burger-bars::before,.phdr-burger-bars::after{content:"";position:absolute;left:0} .phdr-burger-bars::before{top:-6px} .phdr-burger-bars::after{top:6px} .phdr-burger[aria-expanded="true"] .phdr-burger-bars{background:transparent} .phdr-burger[aria-expanded="true"] .phdr-burger-bars::before{transform:translateY(6px) rotate(45deg)} .phdr-burger[aria-expanded="true"] .phdr-burger-bars::after{transform:translateY(-6px) rotate(-45deg)} .phdr>.phdr-act-w{margin-left:auto} .phdr>.phdr-nav{position:fixed;left:0;right:0;top:var(--phdr-bottom,68px);bottom:0;z-index:998;background:#fff;overflow:auto;padding:8px 16px 32px;border-top:1px solid #e6ecf1;display:none} .phdr.is-open>.phdr-nav{display:block} .phdr-nav ul.menu{display:block} .phdr-nav ul.menu>li{border-bottom:1px solid #edf1f5} .phdr .phdr-nav ul.menu>li>a{min-height:54px;padding:0 4px;font-size:17px;border-radius:0;background:none;box-shadow:none} .phdr-nav ul.menu>li.menu-item-has-children>a::after{margin-left:auto;transition:transform .2s} .phdr-nav ul.menu>li.is-expanded>a::after{transform:translateY(2px) rotate(-135deg)} .phdr-nav .sub-menu,.phdr-nav ul.menu>li:has(.sub-menu .sub-menu)>.sub-menu{position:static;display:none;opacity:1;visibility:visible;transform:none;width:auto;max-width:none;min-width:0;max-height:none;overflow:visible; box-shadow:none;border:0;border-radius:0;padding:0 0 10px 8px;columns:1} .phdr-nav ul.menu>li:has(.sub-menu .sub-menu):hover>.sub-menu{transform:none} .phdr-nav ul.menu>li.is-expanded>.sub-menu{display:block} .phdr-nav .sub-menu .sub-menu{display:block;padding:0 0 6px 12px} .phdr .phdr-nav .sub-menu>li.menu-item-has-children>a{padding:12px 10px 4px} .phdr-nav ul.menu>li.menu-item-has-children::before{display:none} .phdr .phdr-nav .sub-menu a{padding:11px 10px;font-size:15.5px} .phdr-mobile-cta{display:grid;gap:10px;margin-top:20px} .phdr .phdr-mobile-cta .phdr-btn{min-height:52px;font-size:16px} body.phdr-lock{overflow:hidden} } @media (max-width:420px){ .phdr .phdr-btn--ink{padding:0 14px} .phdr .phdr-logo img{width:136px} .phdr-act{gap:8px} } @media (prefers-reduced-motion:reduce){ .phdr *{transition:none!important} }/* End custom CSS */