/* file_name: no_scrollbar_fix.css Purpose: Eliminate horizontal scrollbar on ALL pages Load this LAST in , after all other CSS files Author: fix patch Date: 25/02/2026 */ /* ─── 1. Lock horizontal scroll at the root level ─── */ html { overflow-x: hidden !important; max-width: 100%; } body { overflow-x: hidden !important; max-width: 100%; width: 100%; } /* ─── 2. Page wrapper must not exceed viewport ─── */ .page-wrapper { overflow-x: hidden !important; width: 100%; max-width: 100%; position: relative; } /* ─── 3. All sections must stay within viewport ─── */ section, .about, .course, .department, .news, .apply-now-v1, .footer-main, .footer-bottom, .main-slider, .top-header { max-width: 100%; overflow-x: hidden; } /* ─── 4. Pseudo-elements bleeding out of viewport ─── */ /* apply-now-v1::before uses right:-50% which causes overflow */ .apply-now-v1 { overflow: hidden; /* clips the rotating gradient blob */ } /* department::before pattern can bleed */ .department { overflow: hidden; } /* about::before dot pattern */ .about { overflow: hidden; } /* footer dot pattern */ .footer-main { overflow: hidden; } /* ─── 5. Bootstrap row negative margins cause bleed ─── */ /* Bootstrap rows have -15px margin on sides which causes overflow */ .row { margin-right: 0 !important; margin-left: 0 !important; } /* Restore col padding so content doesn't squish */ [class*="col-"] { padding-right: 15px; padding-left: 15px; } /* ─── 6. Navbar: allow dropdown to be visible but no scrollbar ─── */ /* The navbar itself must not scroll, but dropdowns must be visible */ .main-navigation { overflow: visible !important; /* Dropdowns must not be clipped */ max-width: 100%; width: 100%; } /* The inner navbar-nav must not cause overflow */ .main-navigation .container, .main-navigation .navbar, .main-navigation .navbar-collapse, .main-navigation .navbar-nav { overflow: visible !important; /* Dropdowns need visible overflow */ } /* ─── 7. Slider section ─── */ .main-slider, .slide-carousel, .slide-carousel .item { max-width: 100%; overflow: hidden; } /* ─── 8. Images and media always fit ─── */ img, video, iframe { max-width: 100%; } /* ─── 9. Owl Carousel overflow fix ─── */ .owl-carousel { overflow: hidden; } /* ─── 10. Container never bleeds ─── */ .container, .container-fluid { max-width: 100%; }