/* Bilingual Support CSS */ /* Import Google Sans Flex font */ @import url('https://fonts.googleapis.com/css2?family=Google+Sans+Flex:wght@100..900&display=swap'); /* ── Anti-FOUC: applied the instant the early script runs, before even exists. Prevents the Hebrew flash on LTR pages. ── */ html.ltr { direction: ltr !important; } /* English: hide translatable nodes until translations.js runs (stops a flash of Hebrew HTML before setLanguage) */ html[lang="en"]:not(.i18n-applied) [data-i18n] { visibility: hidden !important; } html.ltr body { direction: ltr !important; text-align: left !important; } /* English UI font: html.ltr is set in before body gets .ltr from translations.js. Inner pages were staying on Rotonda until late sync; homepage often looked fine by timing. */ html.ltr body { font-family: 'Google Sans Flex', 'Arial', 'Helvetica Neue', 'Helvetica', sans-serif !important; } html.ltr body *:not(i):not([class*="fa"]):not([class*="icon"]), html.ltr body *:not(i):not([class*="fa"]):not([class*="icon"]):before, html.ltr body *:not(i):not([class*="fa"]):not([class*="icon"]):after { font-family: 'Google Sans Flex', 'Arial', 'Helvetica Neue', 'Helvetica', sans-serif !important; } /* Do not apply UI font to FontAwesome chevron on sidebar .special-links (a::after) */ html.ltr body .single-sidebar-widget .special-links li a:after { font-family: FontAwesome !important; } html.ltr body i.fa, html.ltr body i[class*="fa-"], html.ltr body i.fa:before, html.ltr body i[class*="fa-"]:before { font-family: FontAwesome !important; } html.ltr body i.icon, html.ltr body i[class*="icon-"], html.ltr body i[class*="icon-"]:before { font-family: 'stroke-gap-icons', 'Stroke-Gap-Icons', sans-serif !important; } html.rtl { direction: rtl !important; } html.rtl body { direction: rtl !important; text-align: right !important; } /* Button spacing - ONLY for hero slider buttons, NOT project carousel */ .thm-banner-slider .content a.view-all.slide_learn_btn.btn, .tp-caption a.view-all.slide_learn_btn.btn { margin-right: 10px !important; margin-bottom: 10px !important; display: inline-block !important; } .thm-banner-slider .content a.view-all.slide_learn_btn.btn:last-child, .tp-caption a.view-all.slide_learn_btn.btn:last-child { margin-right: 0 !important; } /* LTR button spacing - hero slider only */ body.ltr .thm-banner-slider .content a.view-all.slide_learn_btn.btn, body.ltr .tp-caption a.view-all.slide_learn_btn.btn { margin-right: 0 !important; margin-left: 10px !important; } body.ltr .thm-banner-slider .content a.view-all.slide_learn_btn.btn:last-child, body.ltr .tp-caption a.view-all.slide_learn_btn.btn:last-child { margin-left: 0 !important; } body.ltr .thm-banner-slider .content a.view-all.slide_learn_btn.btn:first-child, body.ltr .tp-caption a.view-all.slide_learn_btn.btn:first-child { margin-left: 0 !important; } /* RTL button spacing - hero slider only */ body.rtl .thm-banner-slider .content a.view-all.slide_learn_btn.btn:first-child, body.rtl .tp-caption a.view-all.slide_learn_btn.btn:first-child { margin-right: 0 !important; } /* Enhanced spacing for hero slider buttons specifically */ .thm-banner-slider .content a.view-all.slide_learn_btn { margin-right: 15px !important; margin-bottom: 10px !important; } body.ltr .thm-banner-slider .content a.view-all.slide_learn_btn { margin-right: 0 !important; margin-left: 15px !important; } body.ltr .thm-banner-slider .content a.view-all.slide_learn_btn:first-child { margin-left: 0 !important; } body.rtl .thm-banner-slider .content a.view-all.slide_learn_btn:first-child { margin-right: 0 !important; } /* Hero / banner titles — sentence case (override bnrfnt40/50 uppercase) */ h1.bnrfnt40, h1.bnrfnt50, .thm-banner-wrapper .caption-h1, .thm-banner-t-wrapper .caption-h1 { text-transform: capitalize !important; } /* slide_learn_btn buttons — sentence case (override .btn/.btn0 uppercase) */ a.view-all.slide_learn_btn, a.view-all.slide_learn_btn.btn, a.view-all.slide_learn_btn.btn0, .view-all.hvr-bounce-to-right.slide_learn_btn { text-transform: capitalize !important; } /* General gap between any two adjacent slide_learn_btn buttons */ a.view-all.slide_learn_btn.btn + a.view-all.slide_learn_btn.btn { margin-left: 10px !important; } body.ltr a.view-all.slide_learn_btn.btn + a.view-all.slide_learn_btn.btn { margin-left: 10px !important; margin-right: 0 !important; } body.rtl a.view-all.slide_learn_btn.btn + a.view-all.slide_learn_btn.btn { margin-right: 10px !important; margin-left: 0 !important; } /* Header background - blue theme */ #header.header-5, #header.header-5 .container, #header.header-5 .logo-wrapper { background-color: #0f263a !important; } /* Header text color for blue background */ #header.header-5 .touch_top p, #header.header-5 .touch_top a { color: #ffffff !important; } /* Menu text styling - capitalize instead of uppercase */ .nav-t-holder .nav-t-footer ul.nav > li > a { text-transform: capitalize !important; } /* English: main header nav — same Google Sans + casing as homepage on every page (#header .nav-t-holder) */ html[lang="en"] #header .nav-t-holder .nav-t-footer ul.nav > li > a, html.ltr #header .nav-t-holder .nav-t-footer ul.nav > li > a, body.ltr #header .nav-t-holder .nav-t-footer ul.nav > li > a { font: 600 1.3em/1.3em "Google Sans Flex", "Arial", "Helvetica Neue", Helvetica, sans-serif !important; text-transform: capitalize !important; } html[lang="en"] #header .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li a, html.ltr #header .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li a, body.ltr #header .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li a { font: 600 20px/1.3 "Google Sans Flex", "Arial", "Helvetica Neue", Helvetica, sans-serif !important; text-transform: capitalize !important; } .nav-holder .nav-footer ul.nav > li > a { text-transform: capitalize !important; } /* Submenu consistent width and styling */ .nav-t-holder .nav-t-footer ul.nav > li ul.submenu { min-width: 280px !important; max-width: 350px !important; width: auto !important; } .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li { width: 100%; } .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li a { white-space: normal !important; word-wrap: break-word; display: block !important; width: 100%; box-sizing: border-box; } /* Ensure submenu items have consistent padding */ .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li a { padding: 15px 25px !important; } /* Submenu positioning for RTL (Hebrew) - align to right edge of parent */ body.rtl .nav-t-holder .nav-t-footer ul.nav > li ul.submenu, body.rtl .nav-holder .nav-footer ul.nav > li ul.submenu { right: 0 !important; left: auto !important; } /* Submenu positioning for LTR (English) - align to left edge of parent */ body.ltr .nav-t-holder .nav-t-footer ul.nav > li ul.submenu, body.ltr .nav-holder .nav-footer ul.nav > li ul.submenu { left: 0 !important; right: auto !important; } /* Nested submenu positioning for LTR */ body.ltr .nav-t-holder .nav-t-footer ul.nav > li > ul.submenu > li > ul.submenu { left: 100% !important; right: auto !important; } body.ltr .nav-holder .nav-footer ul.nav > li > ul.submenu > li > ul.submenu { left: 100% !important; right: auto !important; } /* Nested submenu positioning for RTL */ body.rtl .nav-t-holder .nav-t-footer ul.nav > li > ul.submenu > li > ul.submenu { right: 100% !important; left: auto !important; } body.rtl .nav-holder .nav-footer ul.nav > li > ul.submenu > li > ul.submenu { right: 100% !important; left: auto !important; } /* Mobile menu capitalization */ @media (max-width: 991px) { /* ── Mobile nav: full-width vertical rows ───────────────────────────── */ /* Do NOT set display:block !important on .nav-t-footer — it breaks jQuery slideToggle() and keeps the panel open after resize / hamburger tap. */ .nav-t-holder .nav-t-footer { width: 100% !important; } .nav-t-holder .nav-t-footer ul.nav { width: 100% !important; display: block !important; padding: 0 !important; margin: 0 !important; } /* One item per row, full width — override inline-block from style.css */ .nav-t-holder .nav-t-footer ul.nav > li { display: block !important; width: 100% !important; float: none !important; padding: 0 !important; border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important; position: relative !important; } .nav-t-holder .nav-t-footer ul.nav > li > a { display: block !important; width: 100% !important; box-sizing: border-box !important; padding: 13px 20px !important; border-left: none !important; border-right: none !important; text-transform: capitalize !important; } /* Hide search item and the "request a quote" + search box below the nav */ .nav-t-footer li:has(> a[data-i18n="navSearch"]), .mobile-link { display: none !important; } /* ── End mobile nav ──────────────────────────────────────────────────── */ /* Mobile menu icon fixes */ body.ltr .nav-t-header button, body.rtl .nav-t-header button { display: block !important; visibility: visible !important; } body.ltr .nav-t-header button i.fa, body.rtl .nav-t-header button i.fa { display: inline-block !important; visibility: visible !important; font-size: 24px !important; } /* Mobile submenu positioning for LTR (English) */ body.ltr .nav-t-holder > .nav-t-footer ul > li > .submenu { padding-left: 20px !important; padding-right: 20px !important; text-align: left !important; } body.ltr .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li a { padding: 15px 15px 15px 40px !important; text-align: left !important; } body.ltr .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li a::before { content: "-" !important; position: absolute !important; left: 30px !important; right: auto !important; } /* Mobile submenu toggle button position for LTR */ body.ltr .nav-t-footer ul.nav li.has-t-submenu > a > button { left: auto !important; right: 15px !important; } /* Mobile submenu positioning for RTL (Hebrew) */ body.rtl .nav-t-holder > .nav-t-footer ul > li > .submenu { padding-right: 20px !important; padding-left: 20px !important; text-align: right !important; } body.rtl .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li a { padding: 15px 40px 15px 15px !important; text-align: right !important; } body.rtl .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li a::before { content: "-" !important; position: absolute !important; right: 30px !important; left: auto !important; } /* Mobile submenu toggle button position for RTL */ body.rtl .nav-t-footer ul.nav li.has-t-submenu > a > button { left: 15px !important; right: auto !important; } /* Mobile menu main items alignment */ body.ltr .nav-t-footer ul.nav > li > a { text-align: left !important; direction: ltr !important; } body.rtl .nav-t-footer ul.nav > li > a { text-align: right !important; direction: rtl !important; } /* Mobile menu container direction */ body.ltr .nav-t-holder > .nav-t-footer { direction: ltr !important; text-align: left !important; } body.rtl .nav-t-holder > .nav-t-footer { direction: rtl !important; text-align: right !important; } /* Ensure mobile submenus don't have fixed positioning */ body.ltr .nav-t-holder > .nav-t-footer ul > li > ul.submenu, body.ltr .nav-t-holder > .nav-t-footer ul > li > ul.submenu > li > .submenu { position: relative !important; left: auto !important; right: auto !important; width: 100% !important; } body.rtl .nav-t-holder > .nav-t-footer ul > li > ul.submenu, body.rtl .nav-t-holder > .nav-t-footer ul > li > ul.submenu > li > .submenu { position: relative !important; left: auto !important; right: auto !important; width: 100% !important; } /* Mobile submenu items full width */ body.ltr .nav-t-holder > .nav-t-footer ul.nav > li ul.submenu li, body.rtl .nav-t-holder > .nav-t-footer ul.nav > li ul.submenu li { width: 100% !important; display: block !important; } /* Mobile submenu background and styling */ body.ltr .nav-t-holder .nav-t-footer ul.nav > li ul.submenu, body.rtl .nav-t-holder .nav-t-footer ul.nav > li ul.submenu { background: rgba(0,0,0,0.05) !important; } /* Mobile menu list items float behavior */ body.ltr .nav-t-holder > .nav-t-footer ul > li { float: none !important; text-align: left !important; } body.rtl .nav-t-holder > .nav-t-footer ul > li { float: none !important; text-align: right !important; } /* Mobile submenu list items */ body.ltr .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li { float: none !important; text-align: left !important; } body.rtl .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li { float: none !important; text-align: right !important; } /* ── Mobile header: logo + hamburger on ONE horizontal line ── */ .main_menu .container > .row { display: flex !important; flex-direction: row !important; align-items: center !important; flex-wrap: nowrap !important; padding: 6px 0 !important; } /* Logo column – shrink to its natural width */ .main_menu .container > .row > .col-md-3 { width: auto !important; flex: 0 0 auto !important; padding: 0 10px !important; } /* Nav column – take the remaining space; propagate flex centering down */ .main_menu .container > .row > [class*="col-"]:not(.col-md-3) { flex: 1 1 auto !important; width: auto !important; display: flex !important; align-items: center !important; } /* Every intermediate wrapper between the nav col and the button must also be a flex container so the button inherits vertical centering. */ .main_menu .navi, .main_menu .nav-menu, .main_menu .nav-t-holder { display: flex !important; align-items: center !important; float: none !important; width: 100% !important; padding: 0 !important; margin: 0 !important; } /* nav-t-header: flex row, vertically centred — NO extra padding */ .nav-t-holder .nav-t-header, .main_menu .nav-t-header { display: flex !important; align-items: center !important; padding: 0 12px !important; margin: 0 !important; } /* RTL: logo on the right, hamburger on the left */ body.rtl .main_menu .container > .row { flex-direction: row-reverse !important; } /* LTR: logo on the left, hamburger on the right */ body.ltr .main_menu .container > .row { flex-direction: row !important; } /* Scale down the sticky-bar logo so it fits */ .main_menu .logo img { height: 48px !important; max-height: 48px !important; width: auto !important; } /* Mobile logo and hamburger menu spacing */ .logo-wrapper { padding: 10px 0 10px !important; margin-bottom: 0 !important; } /* Adjust logo size for mobile */ .t-logo img, .logo img { max-height: 80px !important; height: auto !important; } /* Header container adjustments for mobile */ #header.header-5 .logo-wrapper { padding-top: 10px !important; padding-bottom: 5px !important; } /* Remove extra top spacing on header */ #header.header-5 { padding-top: 0 !important; } .header-5 .container { padding-top: 0 !important; } /* Hamburger button */ .nav-t-header button { padding: 8px 12px !important; min-height: 40px !important; display: flex !important; align-items: center !important; justify-content: center !important; } .nav-t-header button i.fa { font-size: 22px !important; line-height: 1 !important; } /* Override any inline styles on logo row */ .row.pad-logo.logo-wrapper { padding-top: 10px !important; padding-bottom: 5px !important; margin-bottom: 0 !important; } /* Logo column spacing */ .logo-wrapper .t-logo, .logo-wrapper .col-lg-4, .logo-wrapper .col-md-3 { padding-top: 0 !important; padding-bottom: 0 !important; } } /* Search menu item styling */ .nav-t-holder .nav-t-footer ul.nav > li.has-t-submenu > a { text-transform: capitalize !important; } /* Consistent submenu width for nav-holder too */ .nav-holder .nav-footer ul.nav > li ul.submenu { min-width: 280px !important; max-width: 350px !important; width: auto !important; } .nav-holder .nav-footer ul.nav > li ul.submenu li { width: 100%; } .nav-holder .nav-footer ul.nav > li ul.submenu li a { white-space: normal !important; word-wrap: break-word; display: block !important; width: 100%; box-sizing: border-box; padding: 13px 25px 14px !important; } /* Language switcher styling - inline in navbar */ .lang-switcher-menu { display: inline-block !important; padding: 0 !important; margin: 0 !important; } #langSwitcher { background: #ffffff; color: #0f263a; border: 2px solid #ffffff; padding: 8px 18px; border-radius: 20px; cursor: pointer; font-size: 14px; font-weight: bold; transition: all 0.3s ease; display: inline-block; margin: 0 10px; vertical-align: middle; box-shadow: 0 2px 6px rgba(0,0,0,0.15); } #langSwitcher:hover { background: #53cff5; color: #ffffff; border-color: #53cff5; transform: scale(1.05); box-shadow: 0 3px 10px rgba(83, 207, 245, 0.4); } #langSwitcher i { margin-right: 5px; display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-family: FontAwesome !important; font-style: normal !important; font-weight: normal !important; line-height: 1 !important; color: inherit !important; } #langSwitcher i.fa, #langSwitcher i.fa-globe { display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-family: FontAwesome !important; color: inherit !important; } #langSwitcher i.fa-globe:before { content: "\f0ac" !important; display: inline-block !important; visibility: visible !important; color: inherit !important; } #langSwitcher, #langSwitcher .lang-text { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Hebrew pages: "EN" / globe label must stay Latin (Rottonda on body would otherwise win) */ button#langSwitcher, button#langSwitcher .lang-text, body.rtl #langSwitcher, body.rtl #langSwitcher .lang-text, html[dir="rtl"] #langSwitcher, html[dir="rtl"] #langSwitcher .lang-text { font-family: 'Google Sans Flex', 'Arial', 'Helvetica Neue', 'Helvetica', sans-serif !important; } .lang-switcher-menu button { position: relative; top: 0; } /* RTL language switcher positioning */ body.rtl .lang-switcher-menu { float: right !important; } body.rtl #langSwitcher { margin-left: 15px; margin-right: 0; } /* LTR language switcher positioning */ body.ltr .lang-switcher-menu { float: left !important; } body.ltr #langSwitcher { margin-right: 15px; margin-left: 0; } body.ltr #langSwitcher i { margin-right: 5px; margin-left: 0; } body.rtl #langSwitcher i { margin-left: 5px; margin-right: 0; display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-family: FontAwesome !important; } body.rtl #langSwitcher i.fa, body.rtl #langSwitcher i.fa-globe { display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-family: FontAwesome !important; } /* Explicit FontAwesome for language switcher in Hebrew */ body.rtl #langSwitcher i:before, body.rtl #langSwitcher .fa:before, body.rtl #langSwitcher .fa-globe:before { font-family: FontAwesome !important; content: "\f0ac" !important; display: inline-block !important; visibility: visible !important; opacity: 1 !important; } /* Ultra-high specificity for language switcher icon in both modes */ button#langSwitcher i.fa.fa-globe, button#langSwitcher i.fa.fa-globe:before, body.rtl button#langSwitcher i.fa.fa-globe, body.rtl button#langSwitcher i.fa.fa-globe:before, body.ltr button#langSwitcher i.fa.fa-globe, body.ltr button#langSwitcher i.fa.fa-globe:before { font-family: FontAwesome !important; display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-style: normal !important; font-weight: normal !important; } /* Ensure language switcher icon is never hidden */ #langSwitcher .fa, #langSwitcher .fa-globe, .lang-switcher-menu button .fa, .lang-switcher-menu button .fa-globe { font-family: FontAwesome !important; display: inline-block !important; visibility: visible !important; } /* Hebrew mode specific - ensure icons aren't affected by RTL */ body.rtl i.fa::before, body.rtl i[class^="fa-"]::before, body.rtl i[class*=" fa-"]::before { display: inline-block !important; font-family: FontAwesome !important; } /* Ensure button icons are always visible in Hebrew */ body.rtl button i.fa, body.rtl a i.fa, body.rtl .nav i.fa { display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-family: FontAwesome !important; } /* Language switcher in sticky/fixed navbar */ .menu_fixed .lang-switcher-menu { display: inline-block !important; } .menu_fixed #langSwitcher { padding: 8px 16px; font-size: 12px; margin: 5px 10px; background: #ffffff; color: #0f263a; border-color: #ffffff; } .menu_fixed #langSwitcher:hover { background: #53cff5; color: #ffffff; border-color: #53cff5; } .menu_fixed .nav-t-footer ul.nav > li.lang-switcher-menu button { margin-top: 0; margin-bottom: 0; } /* Ensure visibility when navbar is sticky */ .main_menu.menu_fixed .lang-switcher-menu { display: inline-block !important; visibility: visible !important; opacity: 1 !important; } /* Ensure language switcher aligns properly with menu items */ .nav-t-footer ul.nav > li.lang-switcher-menu { padding: 0 !important; line-height: normal !important; } .nav-t-footer ul.nav > li.lang-switcher-menu button { margin-top: 10px; margin-bottom: 10px; } /* Desktop navbar alignment */ body.rtl .nav-t-footer ul.nav > li.lang-switcher-menu { float: right !important; } body.ltr .nav-t-footer ul.nav > li.lang-switcher-menu { float: left !important; } /* Language switcher should stand out */ #langSwitcher .lang-text { font-weight: bold; font-size: 13px; color: inherit; } #langSwitcher:hover .lang-text { color: inherit; } /* Ensure button is visible on blue header background */ .header-5 #langSwitcher, #header.header-5 #langSwitcher { background: #ffffff; color: #0f263a; border-color: #ffffff; box-shadow: 0 2px 8px rgba(0,0,0,0.2); } .header-5 #langSwitcher:hover, #header.header-5 #langSwitcher:hover { background: #53cff5; color: #ffffff; border-color: #53cff5; } /* Inner pages often omit .header-5; keep lang switcher pill + shadow identical to index */ .main_menu.nav-home-three #langSwitcher { background: #ffffff !important; color: #0f263a !important; border: 2px solid #ffffff !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important; } .main_menu.nav-home-three #langSwitcher:hover { background: #53cff5 !important; color: #ffffff !important; border-color: #53cff5 !important; } /* Header “calculator / quote” CTA — match English font to nav (theme .req-button a uses Rotonda) */ body.ltr #header .req-button a, body.ltr #header .req-button a.submit { font: 600 1.08em/1em "Google Sans Flex", "Arial", "Helvetica Neue", Helvetica, sans-serif !important; } /* Language switcher animation */ #langSwitcher { animation: pulse-subtle 3s ease-in-out infinite; } @keyframes pulse-subtle { 0%, 100% { box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15); } 50% { box-shadow: 0 2px 10px rgba(83, 207, 245, 0.3), 0 0 0 3px rgba(83, 207, 245, 0.1); } } #langSwitcher:hover { animation: none; } /* Ensure language switcher doesn't break layout */ .nav-t-footer ul.nav { display: flex; flex-wrap: wrap; align-items: center; } body.rtl .nav-t-footer ul.nav { justify-content: flex-end; } body.ltr .nav-t-footer ul.nav { justify-content: flex-start; } /* Mobile menu language switcher */ @media (max-width: 991px) { .nav-t-footer ul.nav > li.lang-switcher-menu { display: block !important; text-align: center !important; padding: 15px 0 !important; background: rgba(0,0,0,0.1); } .nav-t-footer ul.nav > li.lang-switcher-menu button { margin: 0 auto !important; display: inline-block !important; background: #ffffff; color: #0f263a; border-color: #ffffff; } .nav-t-footer ul.nav > li.lang-switcher-menu button:hover { background: #53cff5; color: #ffffff; } body.ltr .nav-t-footer ul.nav > li.lang-switcher-menu, body.rtl .nav-t-footer ul.nav > li.lang-switcher-menu { float: none !important; } } /* RTL/LTR direction handling */ body.rtl { direction: rtl; } body.ltr { direction: ltr; font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } body.ltr #langSwitcher { right: auto; left: 20px; } /* Apply Google Sans Flex font to all English content - comprehensive. FA/icon elements are excluded so glyph ::before pseudo-elements keep FontAwesome. */ body.ltr *:not(i):not([class*="fa"]):not([class*="icon"]), body.ltr *:not(i):not([class*="fa"]):not([class*="icon"]):before, body.ltr *:not(i):not([class*="fa"]):not([class*="icon"]):after { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } body.ltr .single-sidebar-widget .special-links li a:after { font-family: FontAwesome !important; } /* Re-apply FontAwesome to every icon element and its ::before glyph */ body.ltr i.fa, body.ltr i[class*="fa-"], body.ltr i.fa:before, body.ltr i[class*="fa-"]:before, body.ltr i.icon, body.ltr i[class*="icon-"], body.ltr i[class*="icon-"]:before { font-family: FontAwesome !important; display: inline-block !important; visibility: visible !important; opacity: 1 !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; } /* Stroke-gap / custom icon font */ body.ltr i.icon, body.ltr i[class*="icon-"], body.ltr i[class*="icon-"]:before { font-family: 'stroke-gap-icons' !important; } /* Specific elements that might need font override */ body.ltr h1, body.ltr h2, body.ltr h3, body.ltr h4, body.ltr h5, body.ltr h6 { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } body.ltr p, body.ltr span, body.ltr a, body.ltr li, body.ltr div { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } body.ltr button, body.ltr input, body.ltr textarea, body.ltr select { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } body.ltr .nav, body.ltr .menu, body.ltr .submenu { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Override any inline or external font styles */ body.ltr [style*="font-family"] { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Tables and forms */ body.ltr table, body.ltr th, body.ltr td, body.ltr label { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Force Google Sans Flex on carousel and sliders */ body.ltr .owl-carousel, body.ltr .slider, body.ltr .carousel { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } body.ltr .owl-carousel *, body.ltr .slider *, body.ltr .carousel * { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Footer and header fonts */ body.ltr footer, body.ltr footer *, body.ltr header, body.ltr header * { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Content sections */ body.ltr .content, body.ltr .content * { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } body.ltr .section, body.ltr .section * { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Override common framework fonts */ body.ltr .container, body.ltr .container *, body.ltr .row, body.ltr .row * { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Ensure no font inheritance issues */ body.ltr .widget, body.ltr .widget-title, body.ltr .sec-title, body.ltr .section_header { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } body.ltr .widget *, body.ltr .widget-title *, body.ltr .sec-title *, body.ltr .section_header * { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Typography improvements for English */ body.ltr { -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; text-rendering: optimizeLegibility !important; } /* Ensure proper font weights are applied */ body.ltr h1, body.ltr .h1 { font-weight: 700 !important; } body.ltr h2, body.ltr .h2 { font-weight: 700 !important; } body.ltr h3, body.ltr .h3 { font-weight: 500 !important; } body.ltr h4, body.ltr .h4 { font-weight: 500 !important; } body.ltr h5, body.ltr .h5 { font-weight: 400 !important; } body.ltr h6, body.ltr .h6 { font-weight: 400 !important; } body.ltr strong, body.ltr b { font-weight: 700 !important; } body.ltr .bold { font-weight: 700 !important; } body.ltr p, body.ltr .text { font-weight: 400 !important; } /* Override any Cabin or other fonts that might interfere */ body.ltr [style*="Cabin"], body.ltr [style*="cabin"], body.ltr font[face="Cabin"], body.ltr font[face="cabin"] { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Force Google Sans Flex on any font tags */ body.ltr font { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Ensure body text uses Google Sans Flex */ body.ltr body { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Additional specificity for stubborn elements */ html body.ltr, html body.ltr * { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Ultra-high specificity as last resort */ body.ltr.ltr, body.ltr.ltr *, body.ltr.ltr *:before, body.ltr.ltr *:after, .ltr, .ltr * { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Explicitly handle common problematic elements */ body.ltr a, body.ltr a:link, body.ltr a:visited, body.ltr a:hover, body.ltr a:active { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } body.ltr ul li, body.ltr ol li { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } body.ltr .btn, body.ltr button:not(#langSwitcher) { font-family: 'Google Sans Flex', 'Arial', sans-serif !important; } /* Final catch-all for Google Sans Flex font in LTR mode with maximum specificity */ html[lang="en"] body.ltr, html[lang="en"] body.ltr *, body[class*="ltr"], body[class*="ltr"] * { font-family: 'Google Sans Flex', 'Arial', 'Helvetica Neue', 'Helvetica', sans-serif !important; } /* Navigation adjustments for LTR */ body.ltr .container { direction: ltr; } body.ltr .logo-wrapper { direction: ltr; } /* Product detail shop rows (nitinol_30, nitinol_70, wires, etc.) — English: space between image and copy */ body.ltr .product-details-content .content-box { padding-right: 1rem !important; padding-left: 65px !important; } @media (max-width: 767px) { body.ltr .product-details-content .content-box { padding-left: 1rem !important; padding-right: 1rem !important; margin-top: 1.25rem; } } body.ltr .t-logo { margin-right: auto !important; margin-left: 1.5px !important; } body.ltr .nav-menu { float: right !important; } body.ltr .nav-t-holder { float: right !important; text-align: right !important; } body.ltr .nav-t-footer ul { direction: ltr !important; text-align: left !important; } body.ltr .nav-t-footer ul li { float: left !important; } body.ltr .touch_top ul { direction: ltr; text-align: left; } body.ltr .pull-left { float: right !important; } body.ltr .pull-right { float: left !important; } body.ltr .text-right { text-align: left !important; } body.ltr .text-left { text-align: right !important; } /* Header items for LTR */ body.ltr .top-two-right { direction: ltr; text-align: left; } body.ltr .req-button { text-align: left !important; } body.ltr .item-phone, body.ltr .item-adrs { direction: ltr; text-align: left; } body.ltr .touch_top .nav li { direction: ltr; } body.ltr .touch_top .media-left { margin-right: 10px !important; margin-left: 0 !important; order: -1; min-width: 30px; min-height: 30px; } body.ltr .touch_top .media-left i { font-size: 24px !important; line-height: 1 !important; width: auto !important; height: auto !important; } body.ltr .touch_top .media-body p { text-align: left !important; margin-left: 10px !important; margin-right: 0 !important; } /* Smooth transitions for language changes */ [data-i18n] { transition: opacity 0.2s ease; } /* Footer logo — always use the white version via CSS filter fallback. The src already points to oxide-logo.svg (white SVG), but if a page accidentally loads the black variant, invert it to white. */ /* About page photo pairs — keep images side-by-side in both RTL and LTR */ .abot-img-row { display: flex !important; flex-direction: row !important; flex-wrap: wrap; margin-bottom: 20px; } .abot-img-row .abot-img { flex: 1 1 45%; padding: 5px; } .abot-img-row .abot-img img { width: 100% !important; height: auto !important; display: block !important; } footer .about-us-widget img, footer .widget.about-us-widget img { filter: brightness(0) invert(1) !important; /* forces any logo to white */ } /* Logo styling for consistent display */ #header .logo img, .t-logo img { max-height: 120px; width: auto; } /* Force white mark on navy header at every breakpoint (resize / mobile sticky bar). Same technique as footer; avoids dark/incorrect rendering of the white SVG on blue. */ #header.header-5 .logo img, #header.header-5 .t-logo img { filter: brightness(0) invert(1) !important; } /* Ensure SVG logo displays properly */ img[src$=".svg"] { height: auto; max-width: 100%; } /* Mobile responsive adjustments */ @media (max-width: 768px) { /* Sticky main_menu (≤768px): logo flush one side, hamburger flush the other (not “floating” mid-bar) */ /* responsive.css (≤767) sets .nav-menu { position:absolute; top:-64px } — reset inside main_menu */ .main_menu .nav-menu { position: relative !important; top: auto !important; left: auto !important; right: auto !important; width: auto !important; max-width: none !important; float: none !important; } /* Kill Bootstrap col padding here — it was adding a “gap” that looked like space-around */ .main_menu .container > .row > [class*="col-"] { padding-left: 0 !important; padding-right: 0 !important; } #header, .main_menu, .main_menu .container, .main_menu .container > .row, .main_menu .navi, .main_menu .nav-menu { overflow: visible !important; } .main_menu .container > .row { display: flex !important; flex-wrap: nowrap !important; justify-content: space-between !important; align-items: center !important; align-content: center !important; min-height: 52px !important; padding: 8px 12px !important; overflow: visible !important; width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; box-sizing: border-box !important; } /* Physical placement (DOM is always: col1=logo, col2=nav). Use explicit flex + direction on the strip only. */ /* English: hamburger left, logo right → reverse columns */ body.ltr .main_menu .container > .row { flex-direction: row-reverse !important; direction: ltr !important; } /* Hebrew: logo left, hamburger right — normal row + LTR flex so “start” is screen-left */ body.rtl .main_menu .container > .row { flex-direction: row !important; direction: ltr !important; } .main_menu .container > .row > .col-md-3 { position: static !important; transform: none !important; flex: 0 1 auto !important; width: auto !important; min-width: 0 !important; max-width: 65% !important; } /* Nav column fills the gap so .nav-t-holder is wide — dropdown width:100% matches content area, not a tiny strip */ .main_menu .container > .row > [class*="col-"]:not(.col-md-3) { flex: 1 1 0% !important; min-width: 0 !important; max-width: none !important; width: auto !important; display: flex !important; align-items: center !important; } body.ltr .main_menu .container > .row > [class*="col-"]:not(.col-md-3) { justify-content: flex-start !important; } body.rtl .main_menu .container > .row > [class*="col-"]:not(.col-md-3) { justify-content: flex-end !important; } .main_menu .navi, .main_menu .nav-menu { display: flex !important; align-items: center !important; float: none !important; flex: 1 1 auto !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } .main_menu .nav-t-holder { display: flex !important; align-items: center !important; float: none !important; position: relative !important; flex: 1 1 auto !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; } /* Open mobile menu panel: full usable width, not clipped by narrow parent */ .main_menu .nav-t-holder > .nav-t-footer { width: 100% !important; max-width: 100% !important; min-width: 0 !important; left: 0 !important; right: auto !important; box-sizing: border-box !important; overflow-x: visible !important; overflow-y: auto !important; } .main_menu .nav-t-header { float: none !important; margin-left: 0 !important; margin-right: 0 !important; } /* Black SVG → white on navy bar (all languages) */ .main_menu .logo img { filter: brightness(0) invert(1) !important; height: 44px !important; max-height: 44px !important; width: auto !important; } #langSwitcher { padding: 6px 14px; font-size: 13px; margin: 5px; background: #ffffff; color: #0f263a; border-color: #ffffff; } #langSwitcher:hover { background: #53cff5; color: #ffffff; } .lang-switcher-menu { display: block !important; text-align: center !important; padding: 10px 0 !important; border-top: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.05); } /* Tablet/phone mobile menu adjustments */ body.ltr .nav-t-holder .nav-t-footer ul.nav > li > a { padding: 10px 25px !important; text-align: left !important; } body.rtl .nav-t-holder .nav-t-footer ul.nav > li > a { padding: 10px 25px !important; text-align: right !important; } /* Mobile submenu item padding for smaller screens */ body.ltr .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li a { padding: 12px 15px 12px 35px !important; } body.rtl .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li a { padding: 12px 35px 12px 15px !important; } body.ltr .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li a::before { left: 25px !important; } body.rtl .nav-t-holder .nav-t-footer ul.nav > li ul.submenu li a::before { right: 25px !important; } /* Hide the top contact/logo banner on phones — sticky nav bar takes over */ .row.pad-logo.logo-wrapper { display: none !important; } /* Further reduce spacing on smaller phones */ .logo-wrapper { padding: 5px 0 5px !important; } .nav-t-holder .nav-t-header { padding: 10px 12px !important; margin-top: 0 !important; } .t-logo img, .logo img { max-height: 70px !important; } /* Ensure proper spacing in header */ #header.header-5 .logo-wrapper { padding-top: 5px !important; padding-bottom: 3px !important; } /* Override inline styles on smaller tablets/phones */ .row.pad-logo.logo-wrapper { padding-top: 5px !important; padding-bottom: 3px !important; } /* Responsive button spacing for tablets - hero slider only */ .thm-banner-slider .content a.view-all.slide_learn_btn.btn, .tp-caption a.view-all.slide_learn_btn.btn { margin-right: 8px !important; margin-bottom: 8px !important; } body.ltr .thm-banner-slider .content a.view-all.slide_learn_btn.btn, body.ltr .tp-caption a.view-all.slide_learn_btn.btn { margin-left: 8px !important; margin-right: 0 !important; } } /* ≤767px (Hebrew): hamburger must sit on the physical right; row is LTR so “start” is unambiguous */ @media (max-width: 767px) { html.rtl .main_menu .container > .row, body.rtl .main_menu .container > .row { flex-direction: row !important; direction: ltr !important; } /* Explicit column order: logo = first (left), nav = second (right) */ html.rtl .main_menu .container > .row > .col-md-3, body.rtl .main_menu .container > .row > .col-md-3 { order: 1 !important; } html.rtl .main_menu .container > .row > [class*="col-"]:not(.col-md-3), body.rtl .main_menu .container > .row > [class*="col-"]:not(.col-md-3) { order: 2 !important; justify-content: flex-end !important; direction: ltr !important; } html.rtl .main_menu .nav-t-holder, body.rtl .main_menu .nav-t-holder { justify-content: flex-end !important; flex-direction: row !important; direction: ltr !important; } /* Pin button to the right edge of the wide nav column */ html.rtl .main_menu .nav-t-header, body.rtl .main_menu .nav-t-header { margin-left: auto !important; margin-right: 0 !important; } } /* Mobile button spacing adjustments */ @media (max-width: 600px) { /* Ensure buttons have enough spacing on mobile - hero slider only */ .thm-banner-slider .content a.view-all.slide_learn_btn.btn, .tp-caption a.view-all.slide_learn_btn.btn { margin-right: 5px !important; margin-bottom: 12px !important; margin-top: 5px !important; } body.ltr .thm-banner-slider .content a.view-all.slide_learn_btn.btn, body.ltr .tp-caption a.view-all.slide_learn_btn.btn { margin-left: 5px !important; margin-right: 0 !important; } /* Allow hero slider buttons to wrap naturally */ .thm-banner-slider .content a.view-all, .tp-caption a.view-all { display: inline-block !important; white-space: nowrap !important; } } /* Additional spacing adjustments for very small screens */ @media (max-width: 480px) { .logo-wrapper { padding: 3px 0 3px !important; } .nav-t-holder .nav-t-header { padding: 10px 12px !important; margin-top: 5px !important; } .t-logo img, .logo img { max-height: 60px !important; } .t-logo { width: auto !important; } /* Compact header for tiny screens */ #header.header-5 .logo-wrapper { padding-top: 3px !important; padding-bottom: 2px !important; } .row.pad-logo { padding-bottom: 0px !important; } /* Override inline styles on very small screens */ .row.pad-logo.logo-wrapper { padding-top: 3px !important; padding-bottom: 2px !important; } /* Stack buttons vertically on very small screens if needed - hero slider only */ .thm-banner-slider .content a.view-all.slide_learn_btn.btn, .tp-caption a.view-all.slide_learn_btn.btn { margin-right: 6px !important; margin-bottom: 10px !important; min-width: 140px !important; } body.ltr .thm-banner-slider .content a.view-all.slide_learn_btn.btn, body.ltr .tp-caption a.view-all.slide_learn_btn.btn { margin-left: 6px !important; margin-right: 0 !important; } } /* Contact form RTL/LTR handling */ body.ltr .service_request input, body.ltr .service_request select, body.ltr .service_request textarea { text-align: left; direction: ltr; } body.rtl .service_request input, body.rtl .service_request select, body.rtl .service_request textarea { text-align: right; direction: rtl; } body.ltr .get-t-touch { direction: ltr; text-align: left; } body.ltr .section_header2 h2 { text-align: left !important; } /* Footer adjustments for LTR */ body.ltr footer { direction: ltr; } body.ltr footer .widget { text-align: left; } body.ltr footer .pull-left { float: right !important; } body.ltr footer .pull-right { float: left !important; } body.ltr footer .widget-contact-list ul li { direction: ltr; text-align: left; } body.ltr .footer-t-bottom .fo-txt { text-align: left !important; } /* Slider content alignment for LTR */ body.ltr .carousel-caption { direction: ltr; } body.ltr .carousel-caption .content { text-align: left !important; float: left !important; } body.ltr .carousel-caption .content h1, body.ltr .carousel-caption .content p { text-align: left !important; } /* Services and content sections for LTR */ body.ltr .diff-offer, body.ltr .service-info { direction: ltr; text-align: left; } body.ltr .diff-offer ul { direction: ltr; } body.ltr .we-offer-cont2 p { text-align: left !important; } body.ltr .our-t-client { text-align: left; } body.ltr .our-t-client p { text-align: left !important; } /* Section headers for LTR */ body.ltr .section_header2, body.ltr .section_header3 { text-align: left !important; } body.ltr .section_header2 h2, body.ltr .section_header3 h2 { text-align: left !important; } /* Button text alignment for LTR */ body.ltr .submit, body.ltr .btn { text-align: center; } /* Override uppercase from style.css — sentence case for all languages */ .req-button a, .req-button .submit, a.submit, .submit { text-transform: capitalize !important; } /* Override any inline dir="rtl" when in LTR mode */ body.ltr [dir="rtl"] { direction: ltr !important; } body.ltr .row { direction: ltr !important; } /* Ensure all text flows left to right in English */ body.ltr p, body.ltr h1, body.ltr h2, body.ltr h3, body.ltr h4, body.ltr h5, body.ltr h6, body.ltr span, body.ltr div, body.ltr a, body.ltr li { direction: ltr; } /* Fix carousel indicators and controls for LTR */ body.ltr .carousel-control.left { left: 0; right: auto; } body.ltr .carousel-control.right { right: 0; left: auto; } /* Mobile link adjustments for LTR */ body.ltr .mobile-link { text-align: left; } /* Widget content for LTR */ body.ltr .widget-contact-list { direction: ltr; text-align: left; } body.ltr .fleft { float: left !important; } body.ltr .fright { float: right !important; } /* Breadcrumb handling */ body.rtl .breadcumb { direction: rtl; text-align: right; } body.ltr .breadcumb { direction: ltr; text-align: left; } body.rtl .breadcumb li { float: right; } body.ltr .breadcumb li { float: left; } /* Override uppercase from style.css — breadcrumb links/spans: sentence case */ ul.breadcumb li a, ul.breadcumb li span { text-transform: capitalize !important; } /* Breadcrumb separators are FA glyphs in ::after. html.ltr body *:…:after and body.ltr *:…:after use :not([class*="fa"]) etc., so they beat body.ltr ul.breadcumb … — include .breadcumb-wrapper / .inner-banner so FontAwesome wins. */ html.ltr body .breadcumb-wrapper ul.breadcumb li a:after, html.ltr body .breadcumb-wrapper ul.breadcumb li span:after, html.ltr body .inner-banner ul.breadcumb li a:after, html.ltr body .inner-banner ul.breadcumb li span:after, body.ltr .breadcumb-wrapper ul.breadcumb li a:after, body.ltr .breadcumb-wrapper ul.breadcumb li span:after, body.ltr .inner-banner ul.breadcumb li a:after, body.ltr .inner-banner ul.breadcumb li span:after, body.ltr ul.breadcumb li a:after, body.ltr ul.breadcumb li span:after { font-family: FontAwesome !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; } /* Inner banner direction */ body.rtl .inner-banner2 { direction: rtl; } body.ltr .inner-banner2 { direction: ltr; } body.rtl .inner-banner2 h2 { text-align: right; } body.ltr .inner-banner2 h2 { text-align: left; } /* Footer direction handling */ body.rtl footer .row { direction: rtl; } body.ltr footer .row { direction: ltr; } body.rtl .footer-t-bottom .pull-left { float: right !important; text-align: right; } body.rtl .footer-t-bottom .pull-right { float: left !important; text-align: left; } body.ltr .footer-t-bottom .pull-left { float: left !important; text-align: left; } body.ltr .footer-t-bottom .pull-right { float: right !important; text-align: right; } body.rtl footer .widget { text-align: right; } body.ltr footer .widget { text-align: left; } body.rtl footer ul { padding-right: 0; } body.ltr footer ul { padding-left: 0; } /* Footer column headings (Contact Us, Quick Links, …) — keep normal casing; style.css .widget-contact h4 / .widget-links h4 use text-transform: uppercase */ .footer-bg3 h4.widget_title { text-transform: none !important; } /* Column ordering for LTR - ensure natural left-to-right flow */ body.ltr .col-lg-1, body.ltr .col-lg-2, body.ltr .col-lg-3, body.ltr .col-lg-4, body.ltr .col-lg-5, body.ltr .col-lg-6, body.ltr .col-lg-7, body.ltr .col-lg-8, body.ltr .col-lg-9, body.ltr .col-lg-10, body.ltr .col-lg-11, body.ltr .col-lg-12, body.ltr .col-md-1, body.ltr .col-md-2, body.ltr .col-md-3, body.ltr .col-md-4, body.ltr .col-md-5, body.ltr .col-md-6, body.ltr .col-md-7, body.ltr .col-md-8, body.ltr .col-md-9, body.ltr .col-md-10, body.ltr .col-md-11, body.ltr .col-md-12, body.ltr .col-sm-1, body.ltr .col-sm-2, body.ltr .col-sm-3, body.ltr .col-sm-4, body.ltr .col-sm-5, body.ltr .col-sm-6, body.ltr .col-sm-7, body.ltr .col-sm-8, body.ltr .col-sm-9, body.ltr .col-sm-10, body.ltr .col-sm-11, body.ltr .col-sm-12, body.ltr .col-xs-1, body.ltr .col-xs-2, body.ltr .col-xs-3, body.ltr .col-xs-4, body.ltr .col-xs-5, body.ltr .col-xs-6, body.ltr .col-xs-7, body.ltr .col-xs-8, body.ltr .col-xs-9, body.ltr .col-xs-10, body.ltr .col-xs-11, body.ltr .col-xs-12 { float: left !important; direction: ltr; } /* Specific adjustments for logo position in LTR */ body.ltr .logo-wrapper .t-logo { float: left !important; } body.ltr .logo-wrapper .text-right { float: right !important; text-align: right !important; } /* Icon fixes for LTR mode */ body.ltr .media-left { float: left !important; margin-right: 10px !important; margin-left: 0 !important; display: block !important; } body.ltr .blue-color.media-left { float: left !important; display: inline-block !important; width: auto !important; height: auto !important; } body.ltr .blue-color.media-left a { display: inline-block !important; } body.ltr .blue-color i { display: inline-block !important; visibility: visible !important; width: auto !important; height: auto !important; overflow: visible !important; font-size: 1.5em !important; } body.ltr i[class^="icon-"], body.ltr i[class*=" icon-"] { display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-family: 'Stroke-Gap-Icons' !important; direction: ltr !important; } body.ltr i[class^="icon-"]:before, body.ltr i[class*=" icon-"]:before { display: inline-block !important; visibility: visible !important; opacity: 1 !important; } /* Force icon display in all contexts */ body.ltr .icon, body.ltr [class^="icon-"], body.ltr [class*=" icon-"] { font-family: 'Stroke-Gap-Icons' !important; display: inline-block !important; visibility: visible !important; opacity: 1 !important; width: auto !important; height: auto !important; } /* FontAwesome icons in LTR mode */ body.ltr i.fa, body.ltr i[class^="fa-"], body.ltr i[class*=" fa-"] { display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-family: FontAwesome !important; font-style: normal !important; font-weight: normal !important; line-height: 1 !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; } body.ltr .fa-bars:before { content: "\f0c9" !important; display: inline-block !important; } body.ltr button i.fa { display: inline-block !important; visibility: visible !important; } body.ltr .nav-t-header button { display: inline-block !important; visibility: visible !important; } body.ltr .nav-t-header button i { display: inline-block !important; font-size: 20px !important; } body.rtl .nav-t-header button { display: inline-block !important; visibility: visible !important; } body.rtl .nav-t-header button i { display: inline-block !important; font-size: 20px !important; } /* General button icon visibility */ button i.fa, button i[class^="fa-"], button i[class*=" fa-"] { display: inline-block !important; visibility: visible !important; opacity: 1 !important; } /* Ensure all FontAwesome icons in links are visible */ a i.fa, a i[class^="fa-"], a i[class*=" fa-"] { display: inline-block !important; visibility: visible !important; opacity: 1 !important; } /* Media left/right icon visibility */ .media-left i.fa, .media-right i.fa { display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-size: inherit !important; } /* Footer widget icons */ .widget i.fa, footer i.fa { display: inline-block !important; visibility: visible !important; opacity: 1 !important; } /* Ensure FontAwesome icons work in RTL too */ body.rtl i.fa, body.rtl i[class^="fa-"], body.rtl i[class*=" fa-"] { display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-family: FontAwesome !important; font-style: normal !important; font-weight: normal !important; } body.rtl .fa-bars:before { content: "\f0c9" !important; display: inline-block !important; } body.rtl .fa-globe:before { content: "\f0ac" !important; display: inline-block !important; visibility: visible !important; } /* Global FontAwesome icon fixes for both modes */ i.fa, i[class^="fa-"], i[class*=" fa-"] { display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-family: FontAwesome !important; speak: none; font-style: normal !important; font-weight: normal !important; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* Ensure FontAwesome icons are never overridden by other font rules */ body i.fa, body i[class^="fa-"], body i[class*=" fa-"], body.rtl i.fa, body.rtl i[class^="fa-"], body.rtl i[class*=" fa-"], body.ltr i.fa, body.ltr i[class^="fa-"], body.ltr i[class*=" fa-"] { font-family: FontAwesome !important; } /* Specific common icons */ .fa-envelope:before, .fa-envelope-o:before, .fa-phone:before, .fa-map-marker:before, .fa-angle-double-left:before, .fa-angle-double-right:before, .fa-bars:before, .fa-globe:before, .fa-facebook-square:before, .fa-twitter:before, .fa-linkedin-square:before, .fa-skype:before, .fa-pinterest-square:before { display: inline-block !important; visibility: visible !important; } /* LTR: footer “About” link uses fa-angle-double-left in markup; show right-pointing chevrons */ body.ltr i.fa-angle-double-left:before { content: "\f101" !important; /* same glyph as fa-angle-double-right (Font Awesome 4) */ } /* About pages CTA — Hebrew 2em / English 1.5em (matches strip) */ body.rtl .indurial-t-solution3 .indurial-solution-text h2.about-cta-headline { font-size: 2em !important; line-height: 1.25em !important; } body.ltr .indurial-t-solution3 .indurial-solution-text h2.about-cta-headline { font-size: 1.5em !important; line-height: 1.25em !important; } body.rtl .indurial-t-solution3 .indurial-solution-text:has(.about-cta-headline) .contactus-button2.text-center a { font-size: 1em !important; padding: 0.65em 1.3em !important; } body.ltr .indurial-t-solution3 .indurial-solution-text:has(.about-cta-headline) .contactus-button2.text-center a { font-size: 1em !important; padding: 0.65em 1.3em !important; } /* nitinol_30.html — CTA headline */ body.rtl .indurial-t-solution3 .indurial-solution-text h2.spring30-cta-title { font-size: 2em !important; line-height: 1.2em !important; } body.ltr .indurial-t-solution3 .indurial-solution-text h2.spring30-cta-title { font-size: 1.5em !important; line-height: 1.2em !important; } /* oxide-medical.html — materials list headline: 50% of theme 30px (style.css .image-caption-box .text-box h2) */ .single-service-page .image-caption-box .text-box h2.medical-materials-title { font-size: 15px !important; line-height: 1.3 !important; } /* English (LTR): small gap between the two columns in .image-box .image-caption-box (table-cell row) */ body.ltr .single-service-page .image-box .image-caption-box .text-box, body.ltr .single-post-page .image-box .image-caption-box .text-box { padding-right: 1.25rem !important; } /* Two+ direct in .image-box.clearfix — single row; flex-basis 0 beats intrinsic widths from HTML */ .single-service-page .image-box.clearfix:has(> img:nth-child(2)), .single-post-page .image-box.clearfix:has(> img:nth-child(2)) { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 1rem 1.25rem !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; } .single-service-page .image-box.clearfix:has(> img:nth-child(2)) > img, .single-post-page .image-box.clearfix:has(> img:nth-child(2)) > img { flex: 1 1 0% !important; min-width: 0 !important; width: auto !important; max-width: none !important; height: auto !important; float: none !important; object-fit: contain !important; box-sizing: border-box !important; } @media (max-width: 600px) { .single-service-page .image-box.clearfix:has(> img:nth-child(2)), .single-post-page .image-box.clearfix:has(> img:nth-child(2)) { flex-wrap: wrap !important; } .single-service-page .image-box.clearfix:has(> img:nth-child(2)) > img, .single-post-page .image-box.clearfix:has(> img:nth-child(2)) > img { flex: 1 1 100% !important; max-width: 100% !important; } } /* indurial-t-solution3 CTA strip: one row — headline + button (same layout on all pages) Hebrew (RTL): natural flex row → first DOM item (h2) at main-start (right), button left of it → button on the left. English (LTR): h2 left, margin-left:auto on button → button on the right. */ .indurial-t-solution3 .indurial-solution-text { display: flex !important; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 1.5rem; max-width: 1170px; margin-left: auto; margin-right: auto; padding-left: 15px; padding-right: 15px; box-sizing: border-box; } body.rtl .indurial-t-solution3 .indurial-solution-text { flex-direction: row; /* not row-reverse — keeps button visually on the left, headline on the right */ } body.ltr .indurial-t-solution3 .indurial-solution-text { text-align: left; } body.rtl .indurial-t-solution3 .indurial-solution-text { text-align: right; } .indurial-t-solution3 .indurial-solution-text h2 { float: none !important; display: block; flex: 1 1 12em; min-width: 0; margin: 0 !important; padding: 0.4em 0 !important; width: auto !important; max-width: none !important; font-family: "rotonda", sans-serif !important; font-weight: 600 !important; font-style: italic !important; line-height: 1.2em !important; letter-spacing: 0.4px; color: #fff; text-align: inherit !important; } body.rtl .indurial-t-solution3 .indurial-solution-text h2 { font-size: 2em !important; } body.ltr .indurial-t-solution3 .indurial-solution-text h2 { font-family: 'Google Sans Flex', 'Arial', Helvetica, sans-serif !important; font-style: normal !important; font-weight: 600 !important; font-size: 1.5em !important; } .indurial-t-solution3 .indurial-solution-text .contactus-button2 { flex: 0 0 auto !important; margin-left: 0 !important; margin-right: 0 !important; } body.ltr .indurial-t-solution3 .indurial-solution-text .contactus-button2 { margin-left: auto !important; margin-right: 0 !important; } body.rtl .indurial-t-solution3 .indurial-solution-text .contactus-button2 { margin-left: 0 !important; margin-right: 0 !important; } body.rtl .indurial-t-solution3 .indurial-solution-text .contactus-button2.text-center a { font-size: 1em !important; } body.ltr .indurial-t-solution3 .indurial-solution-text .contactus-button2.text-center a { font-family: 'Google Sans Flex', 'Arial', Helvetica, sans-serif !important; font-size: 1em !important; } @media (max-width: 576px) { .indurial-t-solution3 .indurial-solution-text { flex-direction: column !important; align-items: stretch; text-align: center; } body.rtl .indurial-t-solution3 .indurial-solution-text { flex-direction: column !important; } .indurial-t-solution3 .indurial-solution-text h2 { text-align: center !important; } body.ltr .indurial-t-solution3 .indurial-solution-text h2 { text-align: center !important; } body.ltr .indurial-t-solution3 .indurial-solution-text .contactus-button2 { margin-left: 0 !important; align-self: center; } body.rtl .indurial-t-solution3 .indurial-solution-text .contactus-button2 { margin-right: 0 !important; align-self: center; } } body.ltr .touch_top .icon:before, body.ltr .blue-color .icon:before { font-family: 'Stroke-Gap-Icons' !important; } /* Ensure icon containers don't hide icons */ body.ltr .blue-color.media-left, body.ltr .touch_top .blue-color { overflow: visible !important; position: relative !important; } body.ltr .blue-color a { overflow: visible !important; position: relative !important; } /* Project carousel image visibility — no direction override here; OwlCarousel manages direction internally via its rtl option + CSS transforms. */ .project-post-image, .img-holder { display: block !important; visibility: visible !important; opacity: 1 !important; } .project-post-image img { display: block !important; visibility: visible !important; opacity: 1 !important; width: 100% !important; height: auto !important; } /* Fix carousel controls for RTL */ body.rtl .owl-carousel .owl-nav { direction: rtl; } body.rtl .owl-carousel .owl-nav .owl-prev { right: auto !important; left: 10px !important; } body.rtl .owl-carousel .owl-nav .owl-next { left: auto !important; right: 10px !important; } body.rtl .owl-carousel .owl-nav button { direction: rtl !important; } /* Swap arrows for RTL */ body.rtl .owl-prev i.fa-angle-left:before { content: "\f105" !important; /* fa-angle-right */ } body.rtl .owl-next i.fa-angle-right:before { content: "\f104" !important; /* fa-angle-left */ } /* Keep normal arrows for LTR */ body.ltr .owl-prev i:before, body.ltr .owl-next i:before { content: inherit !important; } /* Owl sometimes keeps .owl-hidden after body.ltr/rtl reflow; once loaded, force visible */ .owl-carousel.owl-loaded.owl-hidden { opacity: 1 !important; visibility: visible !important; } /* Ensure carousel items are visible */ .owl-carousel .owl-item { opacity: 1 !important; visibility: visible !important; /* do NOT force display:block here — owl sets float:left and a pixel width via JS */ } .owl-carousel .owl-item img { display: block !important; width: 100% !important; opacity: 1 !important; visibility: visible !important; } /* Carousel horizontal layout — all three levels must be correct for items to sit side-by-side */ .owl-carousel .owl-stage-outer { display: block !important; overflow: hidden !important; position: relative !important; width: 100% !important; } .owl-carousel .owl-stage { display: block !important; /* float-based layout, NOT flex */ position: relative !important; touch-action: pan-y !important; } .owl-carousel .owl-stage:after { content: ""; display: table; clear: both; } .owl-carousel .owl-item { float: left !important; min-height: 1px; position: relative !important; /* width is set by JS — do NOT override it here */ } /* Fix for fullwidth slider */ .fullwidth-silder, .fullwidth-slider { width: 100%; overflow: visible; } /* OwlCarousel handles its own RTL direction via the rtl option + transforms. Do NOT set direction on the carousel container — it breaks stage positioning. */ /* .owl-item float is already declared above with the full stage rules */ body.ltr .owl-carousel .owl-nav .owl-prev { left: 10px !important; right: auto !important; } body.ltr .owl-carousel .owl-nav .owl-next { right: 10px !important; left: auto !important; } body.ltr .owl-carousel .owl-nav button { direction: ltr !important; } body.ltr .owl-carousel .owl-nav { direction: ltr; } /* our-galler-htwo section — do NOT set direction here; it propagates into the carousel and conflicts with OwlCarousel's own RTL transform calculations. */ /* Ensure images display in both modes */ .fullwidth-slider .item, .fullwidth-silder .item { visibility: visible !important; /* do NOT force float:none — owl items need float:left for horizontal layout */ } /* Project carousel specific fixes */ .our-galler-htwo .fullwidth-slider, .our-galler-htwo .fullwidth-silder { width: 100% !important; } /* Do NOT override .owl-item width or display — OwlCarousel sets these via JS */ .our-galler-htwo .owl-carousel .owl-item { opacity: 1 !important; visibility: visible !important; float: left !important; /* ensure float-based horizontal layout */ } /* Ensure project items don't stack vertically */ .fullwidth-slider.owl-carousel .owl-stage, .fullwidth-silder.owl-carousel .owl-stage { display: block !important; /* owl uses floats internally */ } /* Project carousel buttons should NOT be affected by hero slider button spacing */ .our-galler-htwo .view-all, .fullwidth-slider .view-all.view_project_btn, .fullwidth-silder .view-all.view_project_btn { margin: 0 !important; } /* Reset any button display properties that might affect carousel layout */ .our-galler-htwo a.view-all.slide_learn_btn.view_project_btn { display: inline-block !important; margin: 0 !important; } .project-post-image, .img-holder { display: block; visibility: visible; opacity: 1; } .project-post-image img { display: block; visibility: visible; opacity: 1; max-width: 100%; height: auto; } body.ltr .media-left i { display: inline-block !important; visibility: visible !important; opacity: 1 !important; } body.ltr .icon { display: inline-block !important; visibility: visible !important; } body.ltr .icon-Phone2, body.ltr .icon-Pointer, body.ltr .icon-Search, body.ltr .icon-Timer { display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-size: inherit !important; } body.ltr .icon:before, body.ltr .icon-Phone2:before, body.ltr .icon-Pointer:before, body.ltr .icon-Search:before, body.ltr .icon-Timer:before { display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-family: 'Stroke-Gap-Icons' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body.ltr .media { display: flex !important; align-items: center !important; } body.ltr .media-body { text-align: left !important; display: block !important; overflow: visible !important; flex: 1 !important; } body.ltr .media-body p { text-align: left !important; margin-left: 0 !important; margin-right: 0 !important; } /* Footer “Contact Us” — icons aligned to top of row (theme used padding-top + tall line-height on icons to vertically center them with multi-line text). */ .widget.widget-contact ul li { display: flex !important; align-items: flex-start !important; } .widget.widget-contact .widget-contact-list ul li i { padding-top: 0 !important; line-height: 1.2 !important; align-self: flex-start !important; } .widget.widget-contact ul li i.fa-map-marker, .widget.widget-contact ul li i.fa-phone, .widget.widget-contact ul li i.fa-envelope-o, .widget.widget-contact ul li i.icon-Timer { padding-top: 0 !important; line-height: 1.2 !important; } .widget.widget-contact ul li .fleft { padding-top: 0 !important; } /* LTR: icon left of text (DOM order is text, then icon) */ body.ltr .widget.widget-contact ul li { flex-direction: row !important; overflow: visible !important; } body.ltr .widget-contact-list ul li i { float: none !important; order: -1; flex: 0 0 34px !important; width: 34px !important; margin-left: 0 !important; margin-right: 10px !important; text-align: center; } body.ltr .widget-contact-list ul li .fleft { float: none !important; flex: 1 !important; width: auto !important; text-align: left !important; padding-left: 0 !important; line-height: 1.6em; } /* RTL: text block then icon; top-aligned */ body.rtl .widget.widget-contact ul li { flex-direction: row !important; overflow: visible !important; } body.rtl .widget-contact-list ul li i { float: none !important; flex: 0 0 34px !important; width: 34px !important; margin-left: 10px !important; margin-right: 0 !important; text-align: center; } body.rtl .widget-contact-list ul li .fleft { float: none !important; flex: 1 !important; width: auto !important; text-align: right !important; padding-left: 0 !important; line-height: 1.6em; } /* Carousel control icons for LTR */ body.ltr .carousel-control.left { left: 15px; right: auto; } body.ltr .carousel-control.right { right: 15px; left: auto; } body.ltr .carousel-control i { display: inline-block; } /* Social media icons in footer */ body.ltr .about-us-widget ul.nav li { float: left !important; margin-right: 5px; margin-left: 0; } /* Submit button icon alignment */ body.ltr .submit i { margin-left: 5px; margin-right: 0; } body.ltr .fa-arrow-left { transform: scaleX(-1); /* Flip arrow for LTR */ } /* ── Calculator page – LTR / Google Sans Flex overrides ── */ body.ltr #checkout-content { direction: ltr !important; text-align: left !important; } body.ltr #checkout-content label, body.ltr #checkout-content span, body.ltr #checkout-content h1, body.ltr #checkout-content h2, body.ltr #checkout-content h3, body.ltr #checkout-content h4, body.ltr #checkout-content p { font-family: 'Google Sans Flex', Arial, sans-serif !important; text-align: left !important; direction: ltr !important; } body.ltr #checkout-content input, body.ltr #checkout-content select, body.ltr #checkout-content button { font-family: 'Google Sans Flex', Arial, sans-serif !important; direction: ltr !important; text-align: left !important; } /* Section header (3D panel title) */ body.ltr #checkout-content .section_header h2 { text-align: left !important; } /* Flip column order so form is left, 3D model is right in LTR */ body.ltr #checkout-content .row { direction: ltr !important; } /* Lang switcher placement on calculator page */ body.ltr .req-button #langSwitcher, body.rtl .req-button #langSwitcher { float: right !important; } /* Service-info headings and links — sentence case instead of all-caps */ .service-info a h4, .service-info h6 a, .service-info p a { text-transform: capitalize !important; } /* About page — side tab labels and section h2 titles: sentence case not all-caps */ .about-tab-box .tab-title-box ul li a { text-transform: capitalize !important; } /* About page tab list: align with reading direction (English = left) */ body.ltr .about-tab-box .tab-title-box ul li a { text-align: left !important; direction: ltr !important; } body.rtl .about-tab-box .tab-title-box ul li a { text-align: right !important; direction: rtl !important; } .about-tab-box .single-tab-content h2 { text-transform: capitalize !important; } /* ── Site search (search.html) ─────────────────────────────────────────── */ .site-search-page { padding-top: 2rem; padding-bottom: 4rem; } .site-search-bar-form { margin-bottom: 1.5rem; } .site-search-submit { width: 100%; } .site-search-query-label { font-size: 1.1em; margin-bottom: 1rem; color: #333; } .site-search-result-list { list-style: none; padding: 0; margin: 0; } .site-search-result-row { border-bottom: 1px solid #e8e8e8; padding: 1.25rem 0; margin: 0; } .site-search-result-row:last-child { border-bottom: none; } .site-search-result-row h3 { margin: 0 0 0.5rem 0; font-size: 1.25em; font-weight: 600; } .site-search-result-row h3 a { color: #19242a; } .site-search-result-row h3 a:hover { color: #53cff5; } .site-search-snippet { margin: 0; font-size: 0.95em; line-height: 1.55; color: #555; } .site-search-empty { color: #666; font-size: 1em; } /* PDF / brochure bar in sidebar — normal casing (style.css .single-service-pdf h3 a used uppercase) */ .single-service-pdf h3 a { text-transform: none !important; } /* Two stacked PDF/catalog bars in one widget (e.g. nitinol) — gap so sticky rows don’t touch */ .single-sidebar-widget .single-service-pdf + .single-service-pdf { margin-top: 0.75rem !important; } /* Sidebar PDF catalog / chart links — readable size; EN flush left, HE centered; vertically centered in bar */ .single-service-pdf.sidebarCatalogSuperElastic, .single-service-pdf.sidebarCatalogShapeMemory, .single-service-pdf.sidebarDownloadChart { display: flex !important; align-items: center !important; justify-content: center !important; height: 62px !important; box-sizing: border-box !important; } .single-service-pdf.sidebarCatalogSuperElastic h3, .single-service-pdf.sidebarCatalogShapeMemory h3, .single-service-pdf.sidebarDownloadChart h3 { width: 100% !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; min-height: 0 !important; } html.ltr .single-service-pdf.sidebarCatalogSuperElastic, html.ltr .single-service-pdf.sidebarCatalogShapeMemory, html.ltr .single-service-pdf.sidebarDownloadChart, body.ltr .single-service-pdf.sidebarCatalogSuperElastic, body.ltr .single-service-pdf.sidebarCatalogShapeMemory, body.ltr .single-service-pdf.sidebarDownloadChart { justify-content: flex-start !important; text-align: left !important; padding-left: 12px !important; padding-right: 44px !important; } html.ltr .single-service-pdf.sidebarCatalogSuperElastic h3, html.ltr .single-service-pdf.sidebarCatalogShapeMemory h3, html.ltr .single-service-pdf.sidebarDownloadChart h3, body.ltr .single-service-pdf.sidebarCatalogSuperElastic h3, body.ltr .single-service-pdf.sidebarCatalogShapeMemory h3, body.ltr .single-service-pdf.sidebarDownloadChart h3 { justify-content: flex-start !important; } html.rtl .single-service-pdf.sidebarCatalogSuperElastic, html.rtl .single-service-pdf.sidebarCatalogShapeMemory, html.rtl .single-service-pdf.sidebarDownloadChart, body.rtl .single-service-pdf.sidebarCatalogSuperElastic, body.rtl .single-service-pdf.sidebarCatalogShapeMemory, body.rtl .single-service-pdf.sidebarDownloadChart { justify-content: center !important; text-align: center !important; padding-left: 12px !important; padding-right: 44px !important; } html.rtl .single-service-pdf.sidebarCatalogSuperElastic h3, html.rtl .single-service-pdf.sidebarCatalogShapeMemory h3, html.rtl .single-service-pdf.sidebarDownloadChart h3, body.rtl .single-service-pdf.sidebarCatalogSuperElastic h3, body.rtl .single-service-pdf.sidebarCatalogShapeMemory h3, body.rtl .single-service-pdf.sidebarDownloadChart h3 { justify-content: center !important; } .single-service-pdf.sidebarCatalogSuperElastic h3 a, .single-service-pdf.sidebarCatalogShapeMemory h3 a, .single-service-pdf.sidebarDownloadChart h3 a { font-size: 0.88em !important; line-height: 1.3 !important; display: block !important; } html.ltr .single-service-pdf.sidebarCatalogSuperElastic h3 a, html.ltr .single-service-pdf.sidebarCatalogShapeMemory h3 a, html.ltr .single-service-pdf.sidebarDownloadChart h3 a, body.ltr .single-service-pdf.sidebarCatalogSuperElastic h3 a, body.ltr .single-service-pdf.sidebarCatalogShapeMemory h3 a, body.ltr .single-service-pdf.sidebarDownloadChart h3 a { text-align: left !important; } html.rtl .single-service-pdf.sidebarCatalogSuperElastic h3 a, html.rtl .single-service-pdf.sidebarCatalogShapeMemory h3 a, html.rtl .single-service-pdf.sidebarDownloadChart h3 a, body.rtl .single-service-pdf.sidebarCatalogSuperElastic h3 a, body.rtl .single-service-pdf.sidebarCatalogShapeMemory h3 a, body.rtl .single-service-pdf.sidebarDownloadChart h3 a { text-align: center !important; } /* Sidebar .special-links — title case (not all-caps); icon on inner side, no overlap */ .single-sidebar-widget .special-links li a { text-transform: capitalize !important; } body.rtl .single-sidebar-widget .special-links li a { text-align: right !important; direction: rtl !important; border-left: none !important; border-right: 5px solid #f5f2f2 !important; padding: 0 46px 0 16px !important; } body.rtl .single-sidebar-widget .special-links li:hover a, body.rtl .single-sidebar-widget .special-links li.active a { border-left: none !important; border-right: 5px solid #0f263a !important; } /* RTL: double-angle toward text (FA \f100) */ body.rtl .single-sidebar-widget .special-links li a:after { content: '\f100' !important; left: auto !important; right: 16px !important; } /* LTR: reserve space on the right for icon; arrow points right (\f101), mirrors RTL */ body.ltr .single-sidebar-widget .special-links li a, html.ltr .single-sidebar-widget .special-links li a { text-align: left !important; direction: ltr !important; border-right: none !important; border-left: 5px solid #f5f2f2 !important; padding: 0 46px 0 16px !important; } body.ltr .single-sidebar-widget .special-links li:hover a, body.ltr .single-sidebar-widget .special-links li.active a, html.ltr .single-sidebar-widget .special-links li:hover a, html.ltr .single-sidebar-widget .special-links li.active a { border-right: none !important; border-left: 5px solid #0f263a !important; } /* LTR: double-angle points right; pinned to physical right edge (beats body.ltr *::after font + style.css left:20px) */ html[lang="en"] body.ltr .single-sidebar-widget .special-links li a:after, html.ltr body.ltr .single-sidebar-widget .special-links li a:after, html.ltr body .single-sidebar-widget .special-links li a:after, body.ltr .single-sidebar-widget .special-links li a:after { content: '\f101' !important; /* fa-angle-double-right */ font-family: FontAwesome !important; font-style: normal !important; font-weight: normal !important; position: absolute !important; top: 0 !important; left: auto !important; right: 12px !important; margin: 0 !important; padding: 0 !important; line-height: 50px !important; height: 50px !important; display: block !important; width: auto !important; min-width: 1em !important; text-align: center !important; transform: none !important; direction: ltr !important; unicode-bidi: isolate !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; } /* Pagination.js (.paginationOxide): English — center .paginationjs-pages (body.ltr .text-left { text-align:right } was pushing the control to the edge) */ body.ltr ul.page-navigation.paginationOxide.text-left, html.ltr ul.page-navigation.paginationOxide.text-left, body.ltr ul.page-navigation.paginationOxide, html.ltr ul.page-navigation.paginationOxide { text-align: center !important; } body.ltr ul.page-navigation.paginationOxide .paginationjs, html.ltr ul.page-navigation.paginationOxide .paginationjs { display: block !important; width: 100% !important; text-align: center !important; float: none !important; } body.ltr ul.page-navigation.paginationOxide .paginationjs-pages, html.ltr ul.page-navigation.paginationOxide .paginationjs-pages { display: inline-block !important; text-align: center !important; margin-left: auto !important; margin-right: auto !important; float: none !important; } body.ltr ul.page-navigation.paginationOxide .paginationjs-pages ul, html.ltr ul.page-navigation.paginationOxide .paginationjs-pages ul { display: inline-flex !important; flex-wrap: wrap !important; justify-content: center !important; align-items: center !important; margin: 0 auto !important; padding: 0 !important; list-style: none !important; float: none !important; } /* contact.html — inner banner follows html dir (removed inline direction:rtl) */ .inner-banner2 { direction: inherit; } /* contact.html — address/phone lines follow language; padding mirrors RTL/LTR */ .touch .touch_bg .touch_middle .contact-touch-txt { padding-right: 15px; box-sizing: border-box; } body.ltr .touch .touch_bg .touch_middle .contact-touch-txt { text-align: left !important; padding-right: 0; padding-left: 15px; margin-left: 10px; margin-right: 0; } body.rtl .touch .touch_bg .touch_middle .contact-touch-txt { text-align: right !important; } /* Contact page — center Font Awesome icons inside the circular anchors (style.css used padding-top) */ .touch .touch_bg .touch_top-con ul .item .media .media-left a { display: flex !important; align-items: center !important; justify-content: center !important; } .touch .touch_bg .touch_top-con ul .item .media .media-left a i { padding-top: 0 !important; line-height: 1 !important; }