.elementor-kit-12{--e-global-color-primary:#37448C;--e-global-color-secondary:#D9D9D9;--e-global-color-text:#6A6A6A;--e-global-color-accent:#F4F4F4;--e-global-color-27d44ba:#1C2D8C;--e-global-color-6bcb07e:#F23005;--e-global-color-87dd729:#F27141;--e-global-color-15d803b:#F4F4F4;--e-global-color-a3554b5:#BF2301;--e-global-color-2422d25:#162472;--e-global-color-bdcb861:#6EC1E400;--e-global-color-c3828c4:#202959;--e-global-color-dfe1781:#c9c1c1;--e-global-color-5927148:#EFEFEF;--e-global-color-1aa262d:#193F66;--e-global-color-604f8e5:#193F66;--e-global-typography-primary-font-family:"Nunito Sans";--e-global-typography-secondary-font-family:"Roboto";--e-global-typography-text-font-family:"Hind";--e-global-typography-text-font-size:1.1rem;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.5em;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-size:0.9rem;--e-global-typography-accent-font-weight:500;--e-global-typography-accent-line-height:1em;--e-global-typography-accent-letter-spacing:2.5px;--e-global-typography-baeae83-font-family:"Roboto";--e-global-typography-baeae83-font-size:1rem;--e-global-typography-baeae83-font-weight:600;--e-global-typography-baeae83-line-height:1em;--e-global-typography-baeae83-letter-spacing:2.5px;--e-global-typography-a2459da-font-family:"Nunito Sans";--e-global-typography-a2459da-font-size:4.8rem;--e-global-typography-a2459da-font-weight:700;--e-global-typography-a2459da-line-height:1.2em;--e-global-typography-3cb660a-font-family:"Nunito Sans";--e-global-typography-3cb660a-font-size:4.1rem;--e-global-typography-3cb660a-font-weight:700;--e-global-typography-3cb660a-line-height:1.2em;--e-global-typography-fef6d84-font-family:"Nunito Sans";--e-global-typography-fef6d84-font-size:3.5rem;--e-global-typography-fef6d84-font-weight:700;--e-global-typography-fef6d84-line-height:1.2em;--e-global-typography-b6db8b6-font-family:"Nunito Sans";--e-global-typography-b6db8b6-font-size:1.5rem;--e-global-typography-b6db8b6-font-weight:700;--e-global-typography-b6db8b6-line-height:1.2em;--e-global-typography-6ee1dce-font-family:"Nunito Sans";--e-global-typography-6ee1dce-font-size:1.2rem;--e-global-typography-6ee1dce-font-weight:700;--e-global-typography-6ee1dce-line-height:1.2em;--e-global-typography-cd87dc1-font-family:"Nunito Sans";--e-global-typography-cd87dc1-font-size:1.1rem;--e-global-typography-cd87dc1-font-weight:400;--e-global-typography-cd87dc1-line-height:1.2em;--e-global-typography-69f476b-font-family:"Hind";--e-global-typography-69f476b-font-size:1.5rem;--e-global-typography-69f476b-font-weight:400;--e-global-typography-69f476b-font-style:italic;--e-global-typography-69f476b-line-height:1.5em;--e-global-typography-33cac29-font-family:"Nunito Sans";--e-global-typography-33cac29-font-size:2rem;--e-global-typography-33cac29-font-weight:700;--e-global-typography-33cac29-line-height:1.2em;--e-global-typography-4d03304-font-family:"Nunito Sans";--e-global-typography-4d03304-font-size:13rem;--e-global-typography-4d03304-font-weight:700;--e-global-typography-4d03304-line-height:1.2em;background-color:var( --e-global-color-secondary );color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-12 button,.elementor-kit-12 input[type="button"],.elementor-kit-12 input[type="submit"],.elementor-kit-12 .elementor-button{background-color:var( --e-global-color-6bcb07e );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-size:var( --e-global-typography-accent-font-size );font-weight:var( --e-global-typography-accent-font-weight );line-height:var( --e-global-typography-accent-line-height );letter-spacing:var( --e-global-typography-accent-letter-spacing );color:var( --e-global-color-15d803b );border-radius:0px 0px 0px 0px;padding:18px 20px 18px 20px;}.elementor-kit-12 button:hover,.elementor-kit-12 button:focus,.elementor-kit-12 input[type="button"]:hover,.elementor-kit-12 input[type="button"]:focus,.elementor-kit-12 input[type="submit"]:hover,.elementor-kit-12 input[type="submit"]:focus,.elementor-kit-12 .elementor-button:hover,.elementor-kit-12 .elementor-button:focus{background-color:var( --e-global-color-a3554b5 );color:var( --e-global-color-accent );border-radius:0px 0px 0px 0px;}.elementor-kit-12 e-page-transition{background-color:#FFBC7D;}.elementor-kit-12 a{color:var( --e-global-color-secondary );}.elementor-kit-12 a:hover{color:var( --e-global-color-6bcb07e );}.elementor-kit-12 h1{color:var( --e-global-color-15d803b );font-family:var( --e-global-typography-a2459da-font-family ), Sans-serif;font-size:var( --e-global-typography-a2459da-font-size );font-weight:var( --e-global-typography-a2459da-font-weight );line-height:var( --e-global-typography-a2459da-line-height );}.elementor-kit-12 h2{color:var( --e-global-color-15d803b );font-family:var( --e-global-typography-3cb660a-font-family ), Sans-serif;font-size:var( --e-global-typography-3cb660a-font-size );font-weight:var( --e-global-typography-3cb660a-font-weight );line-height:var( --e-global-typography-3cb660a-line-height );word-spacing:var( --e-global-typography-3cb660a-word-spacing );}.elementor-kit-12 h3{color:var( --e-global-color-primary );font-family:var( --e-global-typography-fef6d84-font-family ), Sans-serif;font-size:var( --e-global-typography-fef6d84-font-size );font-weight:var( --e-global-typography-fef6d84-font-weight );line-height:var( --e-global-typography-fef6d84-line-height );}.elementor-kit-12 h4{color:var( --e-global-color-primary );font-family:var( --e-global-typography-b6db8b6-font-family ), Sans-serif;font-size:var( --e-global-typography-b6db8b6-font-size );font-weight:var( --e-global-typography-b6db8b6-font-weight );line-height:var( --e-global-typography-b6db8b6-line-height );}.elementor-kit-12 h5{color:var( --e-global-color-primary );font-family:var( --e-global-typography-6ee1dce-font-family ), Sans-serif;font-size:var( --e-global-typography-6ee1dce-font-size );font-weight:var( --e-global-typography-6ee1dce-font-weight );line-height:var( --e-global-typography-6ee1dce-line-height );}.elementor-kit-12 h6{color:var( --e-global-color-text );font-family:var( --e-global-typography-cd87dc1-font-family ), Sans-serif;font-size:var( --e-global-typography-cd87dc1-font-size );font-weight:var( --e-global-typography-cd87dc1-font-weight );line-height:var( --e-global-typography-cd87dc1-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1340px;}.e-con{--container-max-width:1340px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-kit-12{--e-global-typography-text-font-size:1rem;--e-global-typography-text-line-height:1.5em;--e-global-typography-accent-font-size:0.8rem;--e-global-typography-accent-line-height:1em;--e-global-typography-accent-letter-spacing:2.5px;--e-global-typography-baeae83-font-size:0.9rem;--e-global-typography-baeae83-line-height:1em;--e-global-typography-baeae83-letter-spacing:2.5px;--e-global-typography-a2459da-font-size:3.5rem;--e-global-typography-a2459da-line-height:1.2em;--e-global-typography-3cb660a-font-size:3.1rem;--e-global-typography-3cb660a-line-height:1.2em;--e-global-typography-fef6d84-font-size:2.7rem;--e-global-typography-fef6d84-line-height:1.2em;--e-global-typography-b6db8b6-font-size:1.4rem;--e-global-typography-b6db8b6-line-height:1.2em;--e-global-typography-6ee1dce-font-size:1.2rem;--e-global-typography-6ee1dce-line-height:1.2em;--e-global-typography-cd87dc1-font-size:1rem;--e-global-typography-cd87dc1-line-height:1.2em;--e-global-typography-69f476b-font-size:1.3rem;--e-global-typography-69f476b-line-height:1.5em;--e-global-typography-33cac29-font-size:1.5em;--e-global-typography-33cac29-line-height:1.2em;--e-global-typography-4d03304-font-size:9rem;--e-global-typography-4d03304-line-height:1.2em;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-12 h1{font-size:var( --e-global-typography-a2459da-font-size );line-height:var( --e-global-typography-a2459da-line-height );}.elementor-kit-12 h2{font-size:var( --e-global-typography-3cb660a-font-size );line-height:var( --e-global-typography-3cb660a-line-height );word-spacing:var( --e-global-typography-3cb660a-word-spacing );}.elementor-kit-12 h3{font-size:var( --e-global-typography-fef6d84-font-size );line-height:var( --e-global-typography-fef6d84-line-height );}.elementor-kit-12 h4{font-size:var( --e-global-typography-b6db8b6-font-size );line-height:var( --e-global-typography-b6db8b6-line-height );}.elementor-kit-12 h5{font-size:var( --e-global-typography-6ee1dce-font-size );line-height:var( --e-global-typography-6ee1dce-line-height );}.elementor-kit-12 h6{font-size:var( --e-global-typography-cd87dc1-font-size );line-height:var( --e-global-typography-cd87dc1-line-height );}.elementor-kit-12 button,.elementor-kit-12 input[type="button"],.elementor-kit-12 input[type="submit"],.elementor-kit-12 .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );letter-spacing:var( --e-global-typography-accent-letter-spacing );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-12{--e-global-typography-text-font-size:0.9rem;--e-global-typography-text-line-height:1.5em;--e-global-typography-accent-font-size:0.7rem;--e-global-typography-accent-line-height:1em;--e-global-typography-accent-letter-spacing:2.5px;--e-global-typography-baeae83-font-size:0.8rem;--e-global-typography-baeae83-line-height:1em;--e-global-typography-baeae83-letter-spacing:2.5px;--e-global-typography-a2459da-font-size:2.5rem;--e-global-typography-a2459da-line-height:1.2em;--e-global-typography-3cb660a-font-size:2.3rem;--e-global-typography-3cb660a-line-height:1.2em;--e-global-typography-fef6d84-font-size:2rem;--e-global-typography-fef6d84-line-height:1.2em;--e-global-typography-b6db8b6-font-size:1.2rem;--e-global-typography-b6db8b6-line-height:1.2em;--e-global-typography-6ee1dce-font-size:1.1rem;--e-global-typography-6ee1dce-line-height:1.2em;--e-global-typography-cd87dc1-font-size:0.9rem;--e-global-typography-69f476b-font-size:1.1rem;--e-global-typography-69f476b-line-height:1.5em;--e-global-typography-33cac29-font-size:1.4rem;--e-global-typography-33cac29-line-height:1.2em;--e-global-typography-4d03304-font-size:7rem;--e-global-typography-4d03304-line-height:1.2em;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-12 h1{font-size:var( --e-global-typography-a2459da-font-size );line-height:var( --e-global-typography-a2459da-line-height );}.elementor-kit-12 h2{font-size:var( --e-global-typography-3cb660a-font-size );line-height:var( --e-global-typography-3cb660a-line-height );word-spacing:var( --e-global-typography-3cb660a-word-spacing );}.elementor-kit-12 h3{font-size:var( --e-global-typography-fef6d84-font-size );line-height:var( --e-global-typography-fef6d84-line-height );}.elementor-kit-12 h4{font-size:var( --e-global-typography-b6db8b6-font-size );line-height:var( --e-global-typography-b6db8b6-line-height );}.elementor-kit-12 h5{font-size:var( --e-global-typography-6ee1dce-font-size );line-height:var( --e-global-typography-6ee1dce-line-height );}.elementor-kit-12 h6{font-size:var( --e-global-typography-cd87dc1-font-size );line-height:var( --e-global-typography-cd87dc1-line-height );}.elementor-kit-12 button,.elementor-kit-12 input[type="button"],.elementor-kit-12 input[type="submit"],.elementor-kit-12 .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );letter-spacing:var( --e-global-typography-accent-letter-spacing );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}} /* Start custom CSS *//* ===================================================================== SUCCESS STORAGE SOLUTIONS - BUTTON OVERRIDE v3 ADD THIS AT THE BOTTOM of Site Settings > Custom CSS (keep GLOBAL-FIXES-v2 above it - this block must come LAST) Fixes: - buttons flashing RED on click / hover / focus - white buttons that are invisible on white or blue Every state is forced: link, visited, hover, focus, active. High specificity (html body ...) plus !important so the theme's Global Style Kit cannot win. ===================================================================== */ :root{ --ss-blue:#193F66; --ss-blue-dark:#0d2440; --ss-blue-light:#2b5c8f; --ss-blue-ice:#9dc3e8; } /* ===================================================================== A. SOLID BLUE BUTTONS (blue bg, white text) Used on light backgrounds. ===================================================================== */ html body [id^="ssx"] .ssxab__btn, html body [id^="ssx"] .ssxab__btn:link, html body [id^="ssx"] .ssxab__btn:visited, html body [id^="ssx"] .ssxsy__headBtn, html body [id^="ssx"] .ssxsy__headBtn:link, html body [id^="ssx"] .ssxsy__headBtn:visited, html body [id^="ssx"] .ssxsv__foot a, html body [id^="ssx"] .ssxsv__foot a:link, html body [id^="ssx"] .ssxsv__foot a:visited{ background-color:var(--ss-blue) !important; background-image:none !important; border:2px solid var(--ss-blue) !important; color:#ffffff !important; opacity:1 !important; } html body [id^="ssx"] .ssxab__btn:hover, html body [id^="ssx"] .ssxab__btn:focus, html body [id^="ssx"] .ssxab__btn:active, html body [id^="ssx"] .ssxsy__headBtn:hover, html body [id^="ssx"] .ssxsy__headBtn:focus, html body [id^="ssx"] .ssxsy__headBtn:active, html body [id^="ssx"] .ssxsv__foot a:hover, html body [id^="ssx"] .ssxsv__foot a:focus, html body [id^="ssx"] .ssxsv__foot a:active{ background-color:var(--ss-blue-dark) !important; background-image:none !important; border-color:var(--ss-blue-dark) !important; color:#ffffff !important; } /* ===================================================================== B. OUTLINE BLUE BUTTON (transparent bg, blue text, blue border) Used on light backgrounds - e.g. the systems footer strip. ===================================================================== */ html body [id^="ssx"] .ssxsy__foot a, html body [id^="ssx"] .ssxsy__foot a:link, html body [id^="ssx"] .ssxsy__foot a:visited{ background-color:transparent !important; background-image:none !important; border:2px solid var(--ss-blue) !important; color:var(--ss-blue) !important; } html body [id^="ssx"] .ssxsy__foot a:hover, html body [id^="ssx"] .ssxsy__foot a:focus, html body [id^="ssx"] .ssxsy__foot a:active{ background-color:var(--ss-blue) !important; border-color:var(--ss-blue) !important; color:#ffffff !important; } /* ===================================================================== C. WHITE BUTTONS ON BLUE / DARK BACKGROUNDS These are the ones showing up invisible. Forced solid white with blue text so they always read. ===================================================================== */ html body [id^="ssx"] .ssxsb__btn, html body [id^="ssx"] .ssxsb__btn:link, html body [id^="ssx"] .ssxsb__btn:visited, html body [id^="ssx"] .ssxbar__btn--solid, html body [id^="ssx"] .ssxbar__btn--solid:link, html body [id^="ssx"] .ssxbar__btn--solid:visited, html body [id^="ssx"] .ssxcta__btn--solid, html body [id^="ssx"] .ssxcta__btn--solid:link, html body [id^="ssx"] .ssxcta__btn--solid:visited, html body [id^="ssx"] .ssxst__card--blue .ssxst__link, html body [id^="ssx"] .ssxst__card--dark .ssxst__link{ background-color:#ffffff !important; background-image:none !important; border:2px solid #ffffff !important; color:var(--ss-blue) !important; opacity:1 !important; text-shadow:none !important; } html body [id^="ssx"] .ssxsb__btn:hover, html body [id^="ssx"] .ssxsb__btn:focus, html body [id^="ssx"] .ssxsb__btn:active, html body [id^="ssx"] .ssxbar__btn--solid:hover, html body [id^="ssx"] .ssxbar__btn--solid:focus, html body [id^="ssx"] .ssxbar__btn--solid:active, html body [id^="ssx"] .ssxcta__btn--solid:hover, html body [id^="ssx"] .ssxcta__btn--solid:focus, html body [id^="ssx"] .ssxcta__btn--solid:active, html body [id^="ssx"] .ssxst__card--blue .ssxst__link:hover, html body [id^="ssx"] .ssxst__card--dark .ssxst__link:hover{ background-color:var(--ss-blue-ice) !important; border-color:var(--ss-blue-ice) !important; color:var(--ss-blue-dark) !important; } /* ===================================================================== D. GHOST BUTTONS ON DARK (transparent, white text, white border) ===================================================================== */ html body [id^="ssx"] .ssxbar__btn--ghost, html body [id^="ssx"] .ssxbar__btn--ghost:link, html body [id^="ssx"] .ssxbar__btn--ghost:visited, html body [id^="ssx"] .ssxcta__btn--ghost, html body [id^="ssx"] .ssxcta__btn--ghost:link, html body [id^="ssx"] .ssxcta__btn--ghost:visited{ background-color:transparent !important; background-image:none !important; border:2px solid rgba(255,255,255,.55) !important; color:#ffffff !important; } html body [id^="ssx"] .ssxbar__btn--ghost:hover, html body [id^="ssx"] .ssxbar__btn--ghost:focus, html body [id^="ssx"] .ssxbar__btn--ghost:active, html body [id^="ssx"] .ssxcta__btn--ghost:hover, html body [id^="ssx"] .ssxcta__btn--ghost:focus, html body [id^="ssx"] .ssxcta__btn--ghost:active{ background-color:#ffffff !important; border-color:#ffffff !important; color:var(--ss-blue) !important; } /* ===================================================================== E. LIGHT STACKING CARD BUTTON (blue on white card) ===================================================================== */ html body [id^="ssx"] .ssxst__card--light .ssxst__link, html body [id^="ssx"] .ssxst__card--light .ssxst__link:link, html body [id^="ssx"] .ssxst__card--light .ssxst__link:visited{ background-color:var(--ss-blue) !important; border:2px solid var(--ss-blue) !important; color:#ffffff !important; } html body [id^="ssx"] .ssxst__card--light .ssxst__link:hover, html body [id^="ssx"] .ssxst__card--light .ssxst__link:focus, html body [id^="ssx"] .ssxst__card--light .ssxst__link:active{ background-color:var(--ss-blue-dark) !important; border-color:var(--ss-blue-dark) !important; color:#ffffff !important; } /* ===================================================================== F. TEXT LINKS INSIDE OUR SECTIONS - never red ===================================================================== */ html body [id^="ssx"] a:not([class*="btn"]):not([class*="Btn"]), html body [id^="ssx"] a:not([class*="btn"]):not([class*="Btn"]):visited{ color:inherit !important; text-decoration:none !important; } html body [id^="ssx"] .ssxsv__link, html body [id^="ssx"] .ssxsy__arrow{ color:var(--ss-blue) !important; } html body [id^="ssx"] .ssxsv__card:hover .ssxsv__link{ color:#ffffff !important; } /* ===================================================================== G. KILL RED / ORANGE EVERYWHERE ELSE ON THE SITE Covers the header CALL US NOW, hero buttons and any Elementor button still picking up the template kit. ===================================================================== */ html body .elementor-button, html body .elementor-button:link, html body .elementor-button:visited, html body a.elementor-button, html body .elementor-widget-button .elementor-button{ background-color:var(--ss-blue) !important; background-image:none !important; border-color:var(--ss-blue) !important; color:#ffffff !important; } html body .elementor-button:hover, html body .elementor-button:focus, html body .elementor-button:active, html body a.elementor-button:hover, html body a.elementor-button:focus, html body a.elementor-button:active{ background-color:var(--ss-blue-dark) !important; border-color:var(--ss-blue-dark) !important; color:#ffffff !important; } /* stop the browser's tap flash on mobile */ html body [id^="ssx"] a, html body [id^="ssx"] button, html body .elementor-button{ -webkit-tap-highlight-color:rgba(25,63,102,.18) !important; } /* ===================================================================== H. FOCUS RING - accessible, and blue not red ===================================================================== */ html body [id^="ssx"] a:focus-visible, html body [id^="ssx"] button:focus-visible, html body .elementor-button:focus-visible{ outline:3px solid var(--ss-blue-ice) !important; outline-offset:3px !important; } /* ===================================================================== BUTTON VISIBILITY FIX v4 Add this at the VERY BOTTOM of Elementor > Site Settings > Custom CSS (below STYLE-ARMOR.css - this must be the last block) Fixes the specific buttons that are washing out: - "About the Company" on the white stacking card - "Book a Site Assessment" on the blue stats band - "Book a Site Assessment" on the services footer - "Ask About Your Project" on the systems footer - any button that inherits white-on-white from the theme kit Then: Elementor > Tools > Regenerate CSS & Data, hard refresh. ===================================================================== */ :root{ --ss-blue:#193F66; --ss-blue-dark:#0d2440; --ss-blue-light:#2b5c8f; --ss-blue-ice:#9dc3e8; } /* ===================================================================== 1. STACKING CARDS - the three "Why Success" buttons Card 1 is WHITE, so its button must be solid blue. Cards 2 and 3 are BLUE/DARK, so theirs must be solid white. ===================================================================== */ html body #ssxStack .ssxst__card--light .ssxst__link, html body #ssxStack .ssxst__card--light .ssxst__link:link, html body #ssxStack .ssxst__card--light .ssxst__link:visited, html body #ssxStack .ssxst__card--light .ssxst__link:hover, html body #ssxStack .ssxst__card--light .ssxst__link:focus, html body #ssxStack .ssxst__card--light .ssxst__link:active{ background:var(--ss-blue) !important; background-image:none !important; border:2px solid var(--ss-blue) !important; color:#ffffff !important; -webkit-text-fill-color:#ffffff !important; opacity:1 !important; } html body #ssxStack .ssxst__card--light .ssxst__link:hover{ background:var(--ss-blue-dark) !important; border-color:var(--ss-blue-dark) !important; } html body #ssxStack .ssxst__card--light .ssxst__link svg{ color:#ffffff !important; stroke:#ffffff !important; } html body #ssxStack .ssxst__card--blue .ssxst__link, html body #ssxStack .ssxst__card--blue .ssxst__link:link, html body #ssxStack .ssxst__card--blue .ssxst__link:visited, html body #ssxStack .ssxst__card--dark .ssxst__link, html body #ssxStack .ssxst__card--dark .ssxst__link:link, html body #ssxStack .ssxst__card--dark .ssxst__link:visited{ background:#ffffff !important; background-image:none !important; border:2px solid #ffffff !important; color:var(--ss-blue) !important; -webkit-text-fill-color:var(--ss-blue) !important; opacity:1 !important; } html body #ssxStack .ssxst__card--blue .ssxst__link:hover, html body #ssxStack .ssxst__card--blue .ssxst__link:focus, html body #ssxStack .ssxst__card--dark .ssxst__link:hover, html body #ssxStack .ssxst__card--dark .ssxst__link:focus{ background:var(--ss-blue-ice) !important; border-color:var(--ss-blue-ice) !important; color:var(--ss-blue-dark) !important; -webkit-text-fill-color:var(--ss-blue-dark) !important; } html body #ssxStack .ssxst__card--blue .ssxst__link svg, html body #ssxStack .ssxst__card--dark .ssxst__link svg{ color:var(--ss-blue) !important; stroke:var(--ss-blue) !important; } /* ===================================================================== 2. STATS BAND - "Book a Site Assessment" on blue ===================================================================== */ html body #ssxStats .ssxsb__btn, html body #ssxStats .ssxsb__btn:link, html body #ssxStats .ssxsb__btn:visited{ background:#ffffff !important; background-image:none !important; border:2px solid #ffffff !important; color:var(--ss-blue) !important; -webkit-text-fill-color:var(--ss-blue) !important; opacity:1 !important; box-shadow:0 8px 22px rgba(0,0,0,.24) !important; } html body #ssxStats .ssxsb__btn:hover, html body #ssxStats .ssxsb__btn:focus, html body #ssxStats .ssxsb__btn:active{ background:var(--ss-blue-ice) !important; border-color:var(--ss-blue-ice) !important; color:var(--ss-blue-dark) !important; -webkit-text-fill-color:var(--ss-blue-dark) !important; } html body #ssxStats .ssxsb__btn svg{ color:var(--ss-blue) !important; stroke:var(--ss-blue) !important; } /* ===================================================================== 3. SERVICES FOOTER - "Book a Site Assessment" ===================================================================== */ html body #ssxSrv .ssxsv__foot a, html body #ssxSrv .ssxsv__foot a:link, html body #ssxSrv .ssxsv__foot a:visited{ background:var(--ss-blue) !important; background-image:none !important; border:2px solid var(--ss-blue) !important; color:#ffffff !important; -webkit-text-fill-color:#ffffff !important; opacity:1 !important; } html body #ssxSrv .ssxsv__foot a:hover, html body #ssxSrv .ssxsv__foot a:focus{ background:var(--ss-blue-dark) !important; border-color:var(--ss-blue-dark) !important; color:#ffffff !important; } html body #ssxSrv .ssxsv__foot a svg{ color:#ffffff !important; stroke:#ffffff !important; } /* ===================================================================== 4. SYSTEMS FOOTER - "Ask About Your Project" (outline style) ===================================================================== */ html body #ssxSys .ssxsy__foot a, html body #ssxSys .ssxsy__foot a:link, html body #ssxSys .ssxsy__foot a:visited{ background:transparent !important; background-image:none !important; border:2px solid var(--ss-blue) !important; color:var(--ss-blue) !important; -webkit-text-fill-color:var(--ss-blue) !important; opacity:1 !important; font-weight:700 !important; } html body #ssxSys .ssxsy__foot a:hover, html body #ssxSys .ssxsy__foot a:focus{ background:var(--ss-blue) !important; color:#ffffff !important; -webkit-text-fill-color:#ffffff !important; } html body #ssxSys .ssxsy__foot a:hover svg{ color:#ffffff !important; stroke:#ffffff !important; } /* systems header button stays solid blue */ html body #ssxSys .ssxsy__headBtn, html body #ssxSys .ssxsy__headBtn:link, html body #ssxSys .ssxsy__headBtn:visited{ background:var(--ss-blue) !important; border:2px solid var(--ss-blue) !important; color:#ffffff !important; -webkit-text-fill-color:#ffffff !important; } html body #ssxSys .ssxsy__headBtn svg{ color:#ffffff !important; stroke:#ffffff !important; } /* ===================================================================== 5. COMPACT CTA BAR ===================================================================== */ html body #ssxBar .ssxbar__btn--solid, html body #ssxBar .ssxbar__btn--solid:link, html body #ssxBar .ssxbar__btn--solid:visited{ background:#ffffff !important; border:2px solid #ffffff !important; color:var(--ss-blue) !important; -webkit-text-fill-color:var(--ss-blue) !important; box-shadow:0 8px 22px rgba(0,0,0,.24) !important; } html body #ssxBar .ssxbar__btn--solid svg{ color:var(--ss-blue) !important; stroke:var(--ss-blue) !important; } html body #ssxBar .ssxbar__btn--ghost, html body #ssxBar .ssxbar__btn--ghost:link, html body #ssxBar .ssxbar__btn--ghost:visited{ background:transparent !important; border:2px solid rgba(255,255,255,.65) !important; color:#ffffff !important; -webkit-text-fill-color:#ffffff !important; } html body #ssxBar .ssxbar__btn--ghost:hover{ background:#ffffff !important; border-color:#ffffff !important; color:var(--ss-blue) !important; -webkit-text-fill-color:var(--ss-blue) !important; } /* ===================================================================== 6. CATCH-ALL SAFETY NET Any button inside our sections that ends up with a transparent or white background AND light text gets forced to solid blue. ===================================================================== */ html body [id^="ssx"] a[class*="btn"], html body [id^="ssx"] a[class*="link"]{ text-shadow:none !important; opacity:1 !important; } html body [id^="ssx"] a[class*="btn"] *, html body [id^="ssx"] a[class*="link"] *{ opacity:1 !important; } /* SVG arrows must always match their button text colour */ html body [id^="ssx"] a[class*="btn"] svg, html body [id^="ssx"] a[class*="link"] svg{ stroke:currentColor !important; color:inherit !important; }/* End custom CSS */