/******************************
INDEX:
    00 - General
    01 - Typography
    02 - Text Color & Background Color
    03 - Background Position & Size
    04 - Helper class
    05 - Social icons
    06 - Header
    07 - Bootstrap Overwrite 
    08 - Swiper 
    09 - Scroll To Top 
    10 - Search Box
******************************/

@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&display=swap" rel="stylesheet');

:root {
	--pbmit-global-color: #00358d;
	--pbmit-global-color-rgb: 0, 53, 141;
	--pbmit-secondary-color: #000712;
	--pbmit-secondary-color-rgb: 0, 17, 46;
	--pbmit-light-color: #ebeff3;
	--pbmit-white-color: #ffffff;
    --pbmit-white-color-rgb: 255, 255, 255;
	--pbmit-blackish-color: #00112e;
	--pbmit-blackish-color-rgb: 0, 17, 46;
	--pbmit-link-color-normal: #00112e;
	--pbmit-link-color-hover: #00358d;
	--pbmit-responsive-breakpoint: 1200px;

	--pbmit-body-typography-font-family: "Instrument Sans", serif;
	--pbmit-body-typography-variant: regular;
	--pbmit-body-typography-font-size: 16px;
	--pbmit-body-typography-line-height: 1.6;
	--pbmit-body-typography-color: #304364;
	
	--pbmit-heading-typography-font-family: "Instrument Sans", serif;
	--pbmit-heading-color: #00112e;
	--pbmit-heading-font-variant: 600;
	
	--pbmit-btn-typography-font-family: "Instrument Sans", serif;
	--pbmit-btn-typography-variant: 500;
	--pbmit-btn-typography-font-size: 15px;
	--pbmit-btn-typography-line-height: 24px;
}

/*----------------------------------------*/
/* 00 - General 
/*----------------------------------------*/
 html {
     font-family: sans-serif;
     -webkit-text-size-adjust: 100%;
     -ms-text-size-adjust: 100%;
}
 *{
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
}
 body {
     margin: 0;
     overflow-x: hidden;
}
 p {
     margin: 0 0 25px;
}
 article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary {
     display: block;
}
 audio, canvas, progress, video {
     display: inline-block;
     vertical-align: baseline;
}
 audio:not([controls]) {
     display: none;
     height: 0;
}
 [hidden], template {
     display: none;
}
 a {
     background-color: transparent;
}
 abbr[title] {
     border-bottom: 1px dotted;
}
 small {
     font-size: 80%;
}
 sub, sup {
     font-size: 75%;
     line-height: 0;
     position: relative;
     vertical-align: baseline;
}
 sup {
     top: -0.5em;
}
 sub {
     bottom: -0.25em;
}
 img {
     border: 0;
}
 svg:not(:root) {
     overflow: hidden;
}
 figure {
     margin: 0;
}
 hr {
     -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
     box-sizing: content-box;
}
 code, kbd, pre, samp {
     font-size: 1em;
}
 button, input, optgroup, select, textarea {
     color: inherit;
     font: inherit;
     margin: 0;
}
 select {
     text-transform: none;
}
 button {
     overflow: visible;
}
 button, input, select, textarea {
     max-width: 100%;
}
 button, html input[type="button"], input[type="reset"], input[type="submit"] {
     -webkit-appearance: button;
     cursor: pointer;
}
 button[disabled], html input[disabled] {
     cursor: default;
     opacity: .5;
}
 button::-moz-focus-inner, input::-moz-focus-inner {
     border: 0;
     padding: 0;
}
 input[type="checkbox"], input[type="radio"] {
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
     margin-right: 0.4375em;
     padding: 0;
}
 input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
     height: auto;
}
 input[type="search"] {
     -webkit-appearance: textfield;
}
 input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
     -webkit-appearance: none;
}
 fieldset {
     border: 1px solid #d1d1d1;
     margin: 0 0 1.75em;
     padding: 0.875em;
}
 fieldset > :last-child {
     margin-bottom: 0;
}
 legend {
     border: 0;
     padding: 0;
}
 textarea {
     overflow: auto;
     vertical-align: top;
}
 optgroup {
     font-weight: bold;
}
 textarea:hover, input:hover, textarea:active, input:active, textarea:focus, input:focus, .form-control:focus {
     outline:0px !important;
     -webkit-appearance:none;
     box-shadow: none !important;
}
 .form-select{
	 font-size: 14px;
	 font-weight: 500;
     padding: 0 20px 0 30px;
	 height: 60px;
	 border-radius: 50px;
	 cursor: pointer;
	 color: #666;
	 background-color: var(--pbmit-blackish-color);
	 background-image: url(../images/bg/down-arrow.html);
	  background-size: 11px 13px;
}
 .form-select:focus {
     outline: none;
     box-shadow: none;
}
/*----------------------------------------*/
/* 01 - Typography 
/*----------------------------------------*/
 body {
     font-family:var(--pbmit-body-typography-font-family);
     font-weight: var(--pbmit-body-typography-variant);
     color: var(--pbmit-body-typography-color);
     font-size: var(--pbmit-body-typography-font-size);
     line-height: var(--pbmit-body-typography-line-height);
     color: var(--pbmit-body-typography-color);
     text-transform: none;
     font-style: normal;
}
 h1, h2, h3, h4, h5, h6 {
     font-family:var(--pbmit-heading-typography-font-family);
     font-weight: var(--pbmit-heading-font-variant);
     color: var(--pbmit-heading-color);
}
 h1 {
     font-size: 40px;
     line-height: 50px;
     letter-spacing: 0px;
}
 h2 {
     font-size: 36px;
     line-height: 46px;
     letter-spacing: 0px;
}
 h3 {
     font-size: 30px;
     line-height: 40px;
     letter-spacing: 0px;
}
 h4 {
     font-size: 24px;
     line-height: 34px;
     letter-spacing: 0px;
}
 h5 {
     font-size: 20px;
     line-height: 30px;
     letter-spacing: 0px;
}
 h6 {
     font-size: 18px;
     line-height: 28px;
     letter-spacing: 0px;
}
 ul {
     margin: 0;
     padding: 0;
     list-style: none;
}
 a {
     -webkit-transition: all .25s ease-in-out;
     -moz-transition: all .25s ease-in-out;
     -ms-transition: all .25s ease-in-out;
     -o-transition: all .25s ease-in-out;
     transition: all .25s ease-in-out;
     color: var(--pbmit-link-color-normal);
     text-decoration: none;
}
 a:focus {
     text-decoration: none !important;
}
 a:focus, a:hover {
     color: var(--pbmit-link-color-hover);
     text-decoration: none !important;
}
 a.link-btn, .link-btn a{
     font-family: "Montserrat", Arial, Helvetica, sans-serif;
     font-weight: 700;
     text-transform: uppercase;
     font-size: 14px;
     letter-spacing: 1px;
}
 a.link-btn i, .link-btn a i{
     padding-left: 10px;
}
.pbmit-btn {
	position: relative;
	display: inline-block;
	text-decoration: none;
	box-shadow: none;
	font-family: var(--pbmit-btn-typography-font-family);
	font-size: var(--pbmit-btn-typography-font-size);
	font-weight: var(--pbmit-btn-typography-variant);
	line-height: var(--pbmit-btn-typography-line-height);
	letter-spacing: 0px;
	text-transform: capitalize;
	font-style: normal;
	padding: 18px 60px 18px 30px;
	border: none;
	transition: all .5s ease-in-out;
	z-index: 1;
	white-space: nowrap;
	fill: var(--pbmit-white-color);
	color: var(--pbmit-white-color);
	background-color: var(--pbmit-global-color);
	border-radius: 50px;
	cursor: pointer;
}
.pbmit-btn .pbmit-button-content-wrapper{
	display: flex;
	justify-content: center;
}
.pbmit-btn .pbmit-button-text:before{
	content: '\e8d2';
    font-family: "pbminfotech-base-icons";
    position: absolute;
    font-size: 16px;
    right: 5px;
    top: 8px;
    left: auto;
    width: 45px;
    height: 45px;
    background-color: var(--pbmit-white-color);
    color: var(--pbmit-blackish-color);
    border-radius: 50%;
    line-height: 45px;
    text-align: center;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.pbmit-btn:hover{
	color: var(--pbmit-white-color);
	background-color: var(--pbmit-blackish-color);
}
.pbmit-btn-white{
	color: var(--pbmit-global-color);
	background-color: var(--pbmit-white-color);
}
.pbmit-btn-white .pbmit-button-text:before{
	color: var(--pbmit-white-color);
	background-color: var(--pbmit-global-color);
}
.pbmit-btn-white:hover .pbmit-button-text:before{
	color: var(--pbmit-blackish-color);
	background-color: var(--pbmit-white-color);
}
.pbmit-btn-outline{
	border: 1px solid var(--pbmit-global-color);
	color: var(--pbmit-global-color);
    background-color: transparent;
}
.pbmit-btn-outline .pbmit-button-text:before{
	color: var(--pbmit-white-color);
	background-color: var(--pbmit-global-color);
}
.pbmit-btn-outline:hover{
	border-color: var(--pbmit-blackish-color);
}
.pbmit-btn-outline:hover .pbmit-button-text:before{
	color: var(--pbmit-blackish-color);
	background-color: var(--pbmit-white-color);
}
.pbmit-btn-outline.blackish{
	color: var(--pbmit-blackish-color);
	border-color: var(--pbmit-blackish-color);
}
.pbmit-btn-outline.blackish .pbmit-button-text:before{
	color: var(--pbmit-blackish-color);
	background-color: var(--pbmit-white-color);
}
.pbmit-btn-outline.blackish:hover {
	color: var(--pbmit-white-color);
}
.pbmit-bg-color-blackish .pbmit-btn-outline{
	color: var(--pbmit-white-color);
	border-color: var(--pbmit-white-color);
}
.pbmit-bg-color-blackish .pbmit-btn-outline .pbmit-button-text:before{
	color: var(--pbmit-blackish-color);
	background-color: var(--pbmit-white-color);
}
.pbmit-bg-color-blackish .pbmit-btn-outline:hover{
	background-color: var(--pbmit-global-color);
	border-color: var(--pbmit-global-color);
}
.pbmit-bg-color-blackish .pbmit-btn-white:hover{
	background-color: var(--pbmit-global-color);
}

.pbmit-btn .form-btn-loader svg{
    width: 50px;
}

/** Divider **/
 .sep-line{
     height: 1px;
     border-top: 1px solid #ebebeb;
     display: block;
     position: relative;
     top: 1px;
     width: 100%;
}

/*----------------------------------------*/
/* 02 - Background Color 
/*----------------------------------------*/
 body .pbmit-bg-color-global{
     background-color: var(--pbmit-global-color);
}
 body .pbmit-bg-color-secondary{
     background-color: var(--pbmit-secondary-color);
}
 body .pbmit-bg-color-blackish{
     background-color: var(--pbmit-blackish-color);
}
/* When a dark section sits directly above the footer (also dark), the two
   run flush together with no visible seam. Scoped with :has() so this only
   applies to that specific adjacency, not every .pbmit-bg-color-blackish
   section (several sit mid-page against a lighter section below them,
   where the color change alone already separates them). Scale matches
   .section-lgb's own existing padding-bottom breakpoints, since that's the
   closest already-established convention for bottom spacing on this class. */
.pbmit-bg-color-blackish:has(+ .site-footer){
     margin-bottom: 100px;
}
 body .pbmit-bg-color-white{
	background-color: var(--pbmit-white-color);
}
 body .pbmit-bg-color-light{
	background-color: var(--pbmit-light-color);
 }
 body .pbmit-global-color{
     color: var(--pbmit-global-color);
}
 body .pbmit-blackish-color{
	color: var(--pbmit-blackish-color);
 }

/*----------------------------------------*/
/* 03 - Background Position & Size 
/*----------------------------------------*/
 .bg-cover{
    background-size: cover;
}
 .bg-contain{
    background-size: contain;
}
 .bg-pos-l{
    background-position: left;
}
 .bg-pos-r{
    background-position: right;
}
 .bg-pos-rt{
    background-position: right top;
}
 .bg-pos-lt{
    background-position: left top;
}
 .bg-pos-rb{
    background-position: right bottom;
}
 .bg-pos-lb{
    background-position: left bottom;
}

/*----------------------------------------*/
/* 04 - Helper Class 
/*----------------------------------------*/
.section-lg{
	padding-top: 100px;
	padding-bottom: 70px;
}
.section-sm{
	padding-top: 80px;
	padding-bottom: 50px;
}
.section-md{
	padding-top: 70px;
	padding-bottom: 100px;
}
.section-xl{
	padding-top: 100px;
	padding-bottom: 100px;
}
.section-xxl{
	padding-top: 130px;
	padding-bottom: 100px;
}
.section-mdb{
	padding-bottom: 70px;
}
.section-lgb{
    padding-bottom: 100px;
}


/*----------------------------------------*/
/* 05 - Social icons 
/*----------------------------------------*/
ul.pbmit-social-links, 
ul.pbmit-contact-info{
	margin: 0;
    padding: 0;
    list-style: none;
}
.pbmit-social-links li, 
.pbmit-contact-info li {
    display: inline-block;
    vertical-align: top;
}

/*----------------------------------------*/
/* 06 - Header 
/*----------------------------------------*/
 .navbar-brand .navbar-brand-item {
     height: 60px;
     display: block;
     width: auto;
}
 .site-header{
     position: relative;
     z-index: 10;
}
/* header-style-1's entire visible content (nav + title-bar) lives inside
   .pbmit-header-overlay, which shortcode.css makes position:absolute --
   so <header> itself has zero flow height by default. That's the real
   root cause behind both header-visibility symptoms seen on inner pages:
   on short pages the header had nothing to push the footer down (fixed
   above via z-index), and on pages whose first section is shorter than
   the overlay's own ~675px, the header renders OVER that section instead,
   hiding it. Nothing needs to render underneath this overlay on
   header-style-1 pages (unlike header-style-2's homepage slider), so
   putting it back in normal flow removes the overlap in both directions
   at every breakpoint, instead of chasing per-breakpoint height numbers.
*/
.header-style-1 .pbmit-header-overlay{
     position: relative;
}
/* Sticky header: the .site-header-menu class on .pbmit-main-header-area
   (both branches, see header.blade.php) activates vendor code that was
   already shipped but unused -- scripts.js already wraps it in a spacer
   div (measured at runtime, so no content jump) and toggles .sticky-header
   on scroll past 90px; base.css already has the base .sticky-header rule
   (position:fixed, white background, box-shadow, z-index:999) and
   responsive.css already disables it below 1200px. All of that is
   original template code, untouched.

   Everything below is the sticky-state refinement pass (2026-09-25): a
   compact bar with ONE unified light appearance on every page, regardless
   of $is_home / header-style-1 vs header-style-2. All of it is scoped
   behind .sticky-header, so the resting header (both variants) and the
   three previously-fixed header bugs are untouched. */

/* -- Compact size --
   Selectors are prefixed with .pbmit-main-header-area (not just
   .sticky-header) to out-specificity responsive.css's own
   .header-style-2 .pbmit-header-content{padding:10px 0} (loaded after
   base.css, same specificity otherwise -- would silently win and keep
   the resting size on home without this). */
.sticky-header{
     box-shadow: 0 2px 10px rgba(0,0,0,.08);
}
/* Inner pages (header-style-1) and home (header-style-2) get their own
   sticky padding rather than one shared value -- home needs less padding
   at rest already and its own responsive scale (see the tablet/mobile
   overrides in responsive.css), while inner pages asked for this exact
   value. */
.header-style-1 .pbmit-main-header-area.sticky-header .pbmit-header-content{
     padding-top: 17px;
     padding-bottom: 17px;
}
.header-style-2 .pbmit-main-header-area.sticky-header .pbmit-header-content{
     padding-top: 12px;
     padding-bottom: 12px;
}
.pbmit-main-header-area.sticky-header .site-branding,
.pbmit-main-header-area.sticky-header .site-title,
.pbmit-main-header-area.sticky-header .pbmit-logo-menuarea{
     height: auto;
     min-height: 0;
}
.pbmit-main-header-area.sticky-header .site-branding img.logo-img{
     max-height: 28px;
}
.pbmit-main-header-area.sticky-header .main-menu .navigation > li > a{
     padding-top: 6px;
     padding-bottom: 6px;
}
.pbmit-main-header-area.sticky-header .pbmit-header-button2 .pbmit-btn{
     padding-top: 18px;
     padding-bottom: 18px;
}
.pbmit-main-header-area.sticky-header .pbmit-header-button2 .pbmit-btn .pbmit-button-text:before{
     width: 26px;
     height: 26px;
     line-height: 26px;
     top: 50%;
     transform: translateY(-50%);
}

/* -- One unified look on every page: light bg, dark nav text, dark logo --
   header-style-2 (home) already rests in this exact color scheme, so most
   of this is a no-op there and only takes effect for header-style-1
   (inner pages), whose resting theme is white-on-dark, wrong once the
   sticky bar itself turns light. */
.sticky-header{
     background-color: var(--pbmit-white-color);
}
.sticky-header .main-menu .navigation > li > a{
     color: var(--pbmit-blackish-color);
}
/* Hamburger toggle icon (mobile/tablet widths, header-style-1): same
   white-on-dark theme issue as the nav text above, just for the icon
   that's visible instead of the full nav at these widths. Found via
   direct screenshot -- white icon was otherwise invisible against the
   now-white sticky bar. */
.header-style-1 .pbmit-main-header-area.sticky-header .navbar-toggler{
     color: var(--pbmit-blackish-color);
}
.pbmit-main-header-area.sticky-header .site-navigation{
     background-color: rgba(var(--pbmit-blackish-color-rgb),.10);
}
.header-style-1 .site-branding img.logo-img.stickylogo{
     display: none;
}
/* Rebrand 2026-09-26: only one wordmark colorway (navy/blue) was supplied,
   but this resting slot sits on header-style-1's dark overlay -- the same
   spot the old white-cutout logo-white.svg used to fill. Force it to a
   white silhouette here only; every other slot (header-style-2, the
   sticky-swap logo below, footer, login/register) shows the true colors
   untouched. */
.header-style-1 .site-branding img.logo-img:not(.stickylogo){
     filter: brightness(0) invert(1);
}
.header-style-1 .pbmit-main-header-area.sticky-header .logo-img:not(.stickylogo){
     display: none;
}
.header-style-1 .pbmit-main-header-area.sticky-header .logo-img.stickylogo{
     display: inline-block;
}
.sticky-header .pbmit-header-button2 .pbmit-btn{
     background-color: var(--pbmit-global-color);
     color: var(--pbmit-white-color);
}
.sticky-header .pbmit-header-button2 .pbmit-btn .pbmit-button-text:before{
     background-color: var(--pbmit-white-color);
     color: var(--pbmit-blackish-color);
}

/* -- Drop the social icons from the sticky bar (header-style-1 only has
   them; header-style-2 never did) -- resting header is untouched, they
   still show there exactly as before. -- */
.sticky-header .social-links-wrapper{
     display: none;
}
 .site-header .site-branding img {
     max-width: 100%;
     height: auto;
     max-height: 45px;
	 display: inline-block;
     -webkit-transition: all 300ms ease;
     transition: all 300ms ease;
}
 .site-navigation ul.navigation > li > a {
	 font-size: 14px;
	 font-weight: 600;
     position: relative;
     z-index: 1;
	 display: block;
	 text-transform: uppercase;
     letter-spacing: .5px;
     color: var(--pbmit-white-color);
}
.site-navigation ul.navigation > li > a:hover:after{
    color: rgba(255, 255, 255,.8);
}
.main-menu .navigation > li > ul a{
	position: relative;
    display: table-cell;
	font-family: var(--pbmit-body-typography-font-family);
    font-weight: 500;
    font-size: 13px;
    line-height: 23px;
    letter-spacing: 0px;
	text-transform: none;
    font-style: normal;
    color: var(--pbmit-blackish-color);
}
.main-menu .navigation > li > ul a:after{
	display: none;
}
 .site-navigation ul.navigation a{
     font-family: var(--pbmit-heading-typography-font-family);
     font-weight: normal;
     font-size: 16px;
     font-style: normal;
}
 .main-menu .navigation > li {
     position: relative;
     float: left;
     margin: 0px;
     -webkit-transition: all 300ms ease;
     -moz-transition: all 300ms ease;
     -ms-transition: all 300ms ease;
     -o-transition: all 300ms ease;
     transition: all 300ms ease;
}
 .main-menu .navigation > li > ul > li > ul {
     left: 100%;
     top: 0;
}
 .main-menu .navigation > li.dropdown:hover > ul , .main-menu .navigation > li > ul > li.dropdown:hover > ul {
     visibility: visible;
     opacity: 1;
     transform: translate(0,-5px);
     z-index: 999;
}
 .header-button .pbmit-btn{
     padding: 15px 24px;
}
 .header-button .pbmit-btn i{
     font-size: 20px;
}
 .site-header .search-btn{
     margin-right: 15px;
     font-size: 17px;
}
 .site-header .social-icons li > a{
     height: 50px;
     line-height: 50px;
}
 .ipad-view-search{
     display: none;
}
 .pbmit-link li{
     margin: 0 10px;
}
.closepanel, .pbmit-mobile-menu-bg, .site-header .righticon {
    display: none;
}
/** sticky-header **/
 .sticky-header{
    position: fixed !important;
    top: 0px;
	left: 0;
    width: 100%;
    background-color: #fff;
    z-index: 999;
    margin: 0;
    box-shadow: 0 2px 5px rgb(0 0 0 / 8%);
    transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -webkit-transition: all 200ms ease;
}
 .site-header-menu.sticky-header .logo-img.stickylogo{
     display: inline-block;
}
/* Freights dropdown was rendering mostly hidden behind the hero slider,
   RESTING header state only (2026-09-27) -- sticky already works via this
   file's own .sticky-header{z-index:999} above. Root cause: at rest,
   .pbmit-main-header-area is position:static, so it establishes no
   stacking context of its own -- the dropdown's own z-index (nested
   inside .site-navigation's transform-based context from the nav-
   centering work) never gets compared against the hero slider's
   .swiper-wrapper{position:relative;z-index:1} at the right level, and
   loses by DOM order (the slider comes after the nav in the markup).
   Elevating the header area itself above the slider fixes it without
   touching anything sticky-state related -- scoped with :not(.sticky-header)
   so this never applies once .sticky-header takes over. */
.pbmit-main-header-area:not(.sticky-header) {
    position: relative;
    z-index: 20;
}

/* Hamburger icon modernized 2026-09-27: 3 bars morphing into an X on open,
   replacing the old single-glyph icon font. Markup-only change in
   header.blade.php (<span class="hamburger-bar"> x3 in place of the old
   <i class="pbmit-base-icon-menu-1">); this file only adds their layout/
   animation. Uses background-color:currentColor rather than a hardcoded
   color so the bars automatically inherit whichever color the existing,
   already-correct .navbar-toggler color rules apply in each context
   (white at rest on header-style-1's dark overlay, dark once sticky) --
   this project has hit real invisible-icon contrast bugs from hardcoding
   icon colors before, so reusing the existing, already-tested logic
   here is deliberate. Keys off the same header.active class the existing
   jQuery toggle already sets -- no JS changes needed or made. */
/* .navbar-toggler (responsive.css) never had an explicit height -- it
   relied on the old inline icon-font glyph's own line-height for its
   clickable box. The new bars are position:absolute (out of flow), so
   without this the button collapses to 0 height. New declaration only,
   nothing in responsive.css already sets height for this selector.
   2026-09-27 follow-up: also boxed in a rounded-square container per
   design reference -- background stays STATIC (no transition) behind
   the bars, only the bars themselves animate. Selector is 2 classes
   deep (.site-header .navbar-toggler) specifically to out-specify
   responsive.css's single-class .navbar-toggler{background-color:
   transparent;width:40px} without needing !important, same convention
   used throughout this file for every other .navbar-toggler override. */
.site-header .navbar-toggler {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background-color: rgba(var(--pbmit-blackish-color-rgb), .06);
}
.navbar-toggler .hamburger-bar {
    display: block;
    position: absolute;
    left: 50%;
    width: 22px;
    height: 3px;
    background-color: currentColor;
    border-radius: 3px;
    transform: translate(-50%, 0);
    transition: top 250ms ease, transform 250ms ease, opacity 200ms ease;
}
.navbar-toggler .hamburger-bar:nth-child(1) {
    top: 14px;
}
.navbar-toggler .hamburger-bar:nth-child(2) {
    top: 21px;
}
.navbar-toggler .hamburger-bar:nth-child(3) {
    top: 28px;
}
header.active .navbar-toggler .hamburger-bar:nth-child(1) {
    top: 21px;
    transform: translate(-50%, 0) rotate(45deg);
}
header.active .navbar-toggler .hamburger-bar:nth-child(2) {
    opacity: 0;
}
header.active .navbar-toggler .hamburger-bar:nth-child(3) {
    top: 21px;
    transform: translate(-50%, 0) rotate(-45deg);
}
.navbar-toggler:hover .hamburger-bar {
    background-color: var(--pbmit-global-color);
}
/* Inner pages, RESTING only: dark-overlay background + white bars
   (existing color rule, untouched, in responsive.css). A light-gray
   container there would nearly vanish against the same dark overlay it
   sits on, so this state gets a translucent-WHITE container instead --
   dark enough itself that the fully-white bars on top still read
   clearly, light enough to show up as a visible "chip" against the
   dark hero/overlay background behind it. */
.site-header.header-style-1 .navbar-toggler {
    background-color: rgba(var(--pbmit-white-color-rgb), .16);
}
/* Inner pages, STICKY: reverts to the light background + dark bars
   (matches the base rule above) -- reasserted here since it needs to
   win back over the header-style-1 resting override immediately above
   within this same file; mirrors the exact specificity relationship
   already used for the analogous .navbar-toggler color override below. */
.header-style-1 .pbmit-main-header-area.sticky-header .navbar-toggler {
    background-color: rgba(var(--pbmit-blackish-color-rgb), .06);
}
.sticky-header {
    z-index: 999;
    opacity: 1;
    visibility: visible;
    -ms-animation-name: fadeInDown;
    -moz-animation-name: fadeInDown;
    -op-animation-name: fadeInDown;
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
    -ms-animation-duration: 300ms;
    -moz-animation-duration: 300ms;
    -op-animation-duration: 300ms;
    -webkit-animation-duration: 300ms;
    animation-duration: 300ms;
    -ms-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
    -op-animation-timing-function: linear;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -ms-animation-iteration-count: 1;
    -moz-animation-iteration-count: 1;
    -op-animation-iteration-count: 1;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}
.fadeInDown{
	animation-name:fadeInDown
} 
@keyframes fadeInDown{
	from{
		opacity:0;
		transform:translate3d(0,-100%,0)
	}
	to{
		opacity:1;transform:none
	}
}
/* Pre Header */
 .pbmit-pre-header-wrapper{
    height: 70px;
    line-height: 70px;
    color: var(--pbmit-blackish-color);
}

/*----------------------------------------*/
/* 07 - Bootstrap Overwrite 
/*----------------------------------------*/
 .g-lg-4,.gy-lg-4, .g-4, .gy-4 {
     --bs-gutter-y: 2rem;
}
 .g-lg-4,.gx-lg-4, .g-4, .gx-4 {
     --bs-gutter-x: 2rem;
}
 .row>* {
     padding-right: calc(var(--bs-gutter-x) * .5);
     padding-left: calc(var(--bs-gutter-x) * .5);
}

/*----------------------------------------*/
/* 08 - Swiper 
/*----------------------------------------*/
 .swiper-slider{
     margin-left: auto;
     margin-right: auto;
     position: relative;
     overflow: hidden;
     z-index: 1;
}
 .swiper-pagination-bullet {
	position: relative;
    outline: none;
    height: 8px;
    width: 8px;
	top: 0px;
	left: 0px;
	opacity: .2;
    vertical-align: middle;
	border-radius: 50%;
	margin: 0px 5px !important;
	display: inline-block;
	background: var(--pbmit-global-color);
}
.swiper-pagination-bullet-active{
	opacity: 1;
}
 .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal,
 .swiper-pagination-custom, .swiper-pagination-fraction {
     bottom: 5px;
     left: 0px;
	 display: flex;
     align-items: center;
     justify-content: center;
}
 .swiper-slider[data-dots="true"] {
     padding-bottom: 50px;
}
 .swiper-button-next:after, .swiper-button-prev:after {
	content: "\e814";
    font-family: "pbminfotech-base-icons";
    font-size: 22px;
	line-height: normal;
}
 .swiper-button-prev, .swiper-rtl .swiper-button-next {
    transform: rotate(180deg);
	background-color: var(--pbmit-secondary-color);
}
 .swiper-button-next, .swiper-button-prev{
	position: static;
	display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    line-height: 60px;
    border-radius: 50%;
    background-color: transparent;
	border: 1px solid var(--pbmit-blackish-color);
    color: var(--pbmit-blackish-color);
    transition: all 500ms ease;
}
 .swiper-button-next{
	margin-left: 10px;
}
.swiper-button-prev{
	left: auto;
}
.swiper-button-next:hover, 
.swiper-button-prev:hover{
	color: var(--pbmit-white-color);
	border-color: var(--pbmit-global-color);
	background-color: var(--pbmit-global-color);
}
.swiper-button-prev.swiper-button-disabled{
	opacity: 1;
	cursor: pointer;
	pointer-events: auto;
}
.pbmit-bg-color-blackish .swiper-button-prev,
.pbmit-bg-color-blackish .swiper-button-next{
	color: var(--pbmit-white-color);
	border-color: var(--pbmit-white-color);
}
.pbmit-bg-color-blackish .swiper-button-prev:hover{
	color: var(--pbmit-white-color);
	border-color: var(--pbmit-global-color);
	background-color: var(--pbmit-global-color);
}
.pbmit-bg-color-blackish .swiper-button-next:hover{
	color: var(--pbmit-blackish-color);
	background-color: var(--pbmit-white-color);
}
.swiper-slider.marquee .swiper-slide {
    display: flex;
    width: auto!important;
}
.swiper-slider.marquee .swiper-wrapper{
    -webkit-transition-timing-function:linear !important; 
    -o-transition-timing-function:linear !important; 
    transition-timing-function:linear !important; 
}
/*----------------------------------------*/
/* 09 - Scroll To Top 
/*----------------------------------------*/
.pbmit-backtotop {
	position: fixed;
	bottom: -50px;
	right: 35px;
	width: 50px;
	height: 50px;
	font-size: 24px;
	border-radius: 25px;
	text-align: center;
	opacity: 0;
	overflow: hidden;
	z-index: 9999999;
	color: var(--pbmit-white-color);
	background: var(--pbmit-global-color);
	border: 2px solid var(--pbmit-white-color);
	box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.2);
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.pbmit-backtotop.active {
	bottom: 15px;
	opacity: 1;
}
.pbmit-backtotop > div {
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.pbmit-backtotop > div.pbmit-arrow {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	opacity: 1;
}
.pbmit-backtotop > div.pbmit-hover-arrow {
    font-size: 24px;
    line-height: 24px;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateY(50%) translateX(-50%);
	opacity: 0;
	margin-top: 1px;
}
.pbmit-backtotop:hover {
	transform: scale(1.1);
	bottom: 20px;
	cursor: pointer;
	box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.2);
}
.pbmit-backtotop:hover > div.pbmit-arrow {
	transform: translateY(-150%) translateX(-50%);
	opacity: 0;
}
.pbmit-backtotop:hover > div.pbmit-hover-arrow {
	transform: translateY(-50%) translateX(-50%);
	opacity: 1;
}
@keyframes AnimationName {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
} 

/*----------------------------------------*/
/*  10 - Search Box
/*----------------------------------------*/
.pbmit-search-overlay {
    position: fixed;
    top: -500px;
    left: 0;
    width: 100%;
    height: 500px;
    z-index: 9999;
    background-color: rgba(0, 0, 0, 0.9);
    -webkit-transition: .4s;
    -moz-transition: .4s;
    -o-transition: .4s;
    -ms-transition: .4s;
    transition: .4s;
}
.pbmit-search-overlay.st-show {
    opacity: 1;
    top: 0;
}
.pbmit-icon-close {
    position: absolute;
    top: 40px;
    right: 40px;
    opacity: 0.8;
    font-size: 30px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 50%;
    -webkit-transition: .4s;
    -moz-transition: .4s;
    -o-transition: .4s;
    -ms-transition: .4s;
    transition: .4s;
    text-align: center;
    cursor: pointer;
    border-color: var(--pbmit-white-color);
    color: var(--pbmit-white-color);
}
.pbmit-icon-close:hover{
	opacity: 1;
}
@keyframes pbmit-closer-line-draw {
	0%,100% {
		clip-path:inset(-1px 0 -1px 0);
		-webkit-clip-path:inset(-1px 0 -1px 0);
	}
	55% {
		clip-path:inset(-1px 0 -1px 100%);
		-webkit-clip-path:inset(-1px 0 -1px 100%);
	}
	56% {
		clip-path:inset(-1px 100% -1px 0);
		-webkit-clip-path:inset(-1px 100% -1px 0);
	}
}
.pbmit-icon-close svg{
	fill: var(--pbmit-white-color);
}
.pbmit-icon-close svg rect{
	-webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.pbmit-icon-close:hover svg rect,
.closepanel:hover svg rect{
	animation: pbmit-closer-line-draw .6s;
    animation-duration: 0.6s;
    animation-timing-function: ease;
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: none;
    animation-play-state: running;
    animation-name: pbmit-closer-line-draw;
}
.pbmit-icon-close:hover svg rect:nth-of-type(2),
.closepanel:hover svg rect:nth-of-type(2){
	animation-delay: .17s;
}
.pbmit-search-outer {
    max-width: 1140px;
    margin: 0 auto;
    position: relative;
	text-align: center;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    transform: translateY(-50%);
}
.pbmit-search-overlay .pbmit-site-searchform {
    position: relative;
}
.pbmit-search-overlay .pbmit-site-searchform:before{
	position: absolute;
    bottom: 0;
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    background-color: #fff;
    -webkit-transform: scale3d(0, 1, 1);
    -ms-transform: scale3d(0, 1, 1);
    transform: scale3d(0, 1, 1);
    -webkit-transform-origin: left center;
    -ms-transform-origin: left center;
    transform-origin: left center;
    -webkit-animation-delay: 0.8s;
    -moz-animation-delay: 0.8s;
    -o-animation-delay: 0.8s;
    animation-delay: 0.8s;
}
.pbmit-search-overlay .pbmit-site-searchform:after{
	font-family: "pbminfotech-base-icons";
    content: '\e80d';
    position: absolute;
    right: 10px;
    top: 15px;
    color: var(--pbmit-white-color);
    font-size: 25px;
    line-height: normal;
}
.pbmit-search-overlay.st-show .pbmit-site-searchform:before{
	-webkit-animation-name: fadeInMove;
    animation-name: fadeInMove;
    -webkit-animation-duration: 0.7s;
    animation-duration: 0.7s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    visibility: visible;
}
@keyframes fadeInMove {
	0% {
		opacity: 0;
		transform: scale3d(0, 1, 1);
	}
	10% {
		opacity: 1;
		transform: scale3d(0.1, 1, 1);
	}
	100% {
		opacity: 0.14;
		transform: scale3d(1, 1, 1);
	}
}
.pbmit-search-overlay input[type="search"] {
    height: 65px;
    line-height: 65px;
	font-weight: 400;
    font-size: 28px;
    background-color: transparent;
    text-align: left;
    border: none;
    border-bottom: 1px solid #ffffff54;
    padding-left: 0;
    border-radius: 0;
	font-family: inherit;
	color: var(--pbmit-white-color);
}
.pbmit-search-overlay input[type="search"]::placeholder{
	color: rgba(var(--pbmit-white-color-rgb),.7);
}
.pbmit-search-overlay .pbmit-site-searchform button {
    position: absolute;
    height: 50px;
    width: 50px;
    top: 0;
    right: 0;
    background-color: transparent;
    text-indent: -9999px;
	line-height: 58px;
    font-size: 16px;
	outline: none;
	padding: 0;
    border: none;
    z-index: 1;
    color: var(--pbmit-white-color);
}

