/* Add your css code here */
/**
 * @file
 * Subtheme specific CSS.
 */
 :root {
    --the-black: #000000;
    --the-white: #fff;
    --the-orange: #F25929;
    --the-dark-green: #008F45;
    --the-light-green: #6CC11F;
    --the-gray: #DFEFE6; 
	--grey: #605959;
	--border-grey: #dbdbdb;
}
@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');






html{
	overflow-x: hidden;
}


a,
p,
ul,
li,
td,
tr,
body,
p span,
ul span {
  font-family: "Rubik", sans-serif !important;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Rubik", sans-serif !important;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal !important;
}

h2 {
	font-size: 2.5em;
	font-weight: 400;
	color: var(--the-dark-green);
	font-size: 2.8em;

}

h3 {
	color: var(--the-dark-green);
	font-weight: 400;
	font-size: 1.5em;
}

/* img {
	width: 100%;
	object-fit: cover;
} */

#main-container ul li {
	list-style: square;
}

#main-container ul li::marker {
	color: var(--the-light-green);
}

.search-slide-inner, .header-inner, .main-navigation-inner-h, .welcome-text-inner, .highlighted-inner, .top-container-inner, .page-title-inner, .main-container-inner, .bottom-container-inner, .footer-container-inner, .footer-menu-inner, .copyright-inner {
	float: none;
	max-width:90% !important;
	margin: 0 auto !important;
}
#main-container {
	color: var(--the-black);
	padding-bottom: 4em;
}
.aplha-container {
	max-width: 90%;
	margin-left: auto;
	margin-right: auto;
}
#main-container {
	background-color: var(--the-white);
	color: var(--the-black);
	padding-top: 40px;
}
.w3-row-padding, .w3-row-padding > .w3-half, .w3-row-padding > .w3-third, .w3-row-padding > .w3-twothird, .w3-row-padding > .w3-threequarter, .w3-row-padding > .w3-quarter, .w3-row-padding > .w3-col {
	padding: 0 0px !important;
}
.top-container-inner .first-top > div, .top-container-inner .second-top > div, .top-container-inner .third-top > div, .main-container-inner .first-sidebar > div, .main-container-inner .w3css-content > div, .main-container-inner .second-sidebar > div, .bottom-container-inner .first-bottom > div, .bottom-container-inner .second-bottom > div, .bottom-container-inner .third-bottom > div, .bottom-container-inner .forth-bottom > div, .footer-container-inner .first-footer > div, .footer-container-inner .second-footer > div, .footer-container-inner .third-footer > div {
	float: none;
	height: 100%;
	width: 100% !important;
	padding: 0px !important;
}
/* Font Icon */
@font-face {
	font-family: 'zb';
	src: url('font/zb.eot?94345664');
	src: url('font/zb.eot?94345664#iefix') format('embedded-opentype'),
		 url('font/zb.woff2?94345664') format('woff2'),
		 url('font/zb.woff?94345664') format('woff'),
		 url('font/zb.ttf?94345664') format('truetype'),
		 url('font/zb.svg?94345664#zb') format('svg');
	font-weight: normal;
	font-style: normal;
  }
  /* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
  /* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
  /*
  @media screen and (-webkit-min-device-pixel-ratio:0) {
	@font-face {
	  font-family: 'zb';
	  src: url('../font/zb.svg?94345664#zb') format('svg');
	}
  }
  */
  [class^="icon-"]:before, [class*=" icon-"]:before {
	font-family: "zb";
	font-style: normal;
	font-weight: normal;
	speak: never;
  
	display: inline-block;
	text-decoration: inherit;
	width: 1em;
	margin-right: .2em;
	text-align: center;
	/* opacity: .8; */
  
	/* For safety - reset parent styles, that can break glyph codes*/
	font-variant: normal;
	text-transform: none;
  
	/* fix buttons height, for twitter bootstrap */
	line-height: 1em;
  
	/* Animation center compensation - margins should be symmetric */
	/* remove if not needed */
	margin-left: .2em;
  
	/* you can be more comfortable with increased icons size */
	/* font-size: 120%; */
  
	/* Font smoothing. That was taken from TWBS */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
  
	/* Uncomment for 3D effect */
	/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
  }
  
  .icon-hand-phone-1:before { content: '\0e80'; } /* '຀' */
  .icon-iconmonstr-facebook:before { content: '\e800'; } /* '' */
  .icon-atm-1:before { content: '\e802'; } /* '' */
  .icon-iconmonstr-instagram:before { content: '\e803'; } /* '' */
  .icon-security:before { content: '\e804'; } /* '' */
  .icon-bill:before { content: '\e805'; } /* '' */
  .icon-credit-card:before { content: '\e806'; } /* '' */
  .icon-borrow:before { content: '\e807'; } /* '' */
  .icon-profit:before { content: '\e808'; } /* '' */
  .icon-insure:before { content: '\e809'; } /* '' */
  .icon-icon-bank:before { content: '\e80a'; } /* '' */
  .icon-dollar-1:before { content: '\e80b'; } /* '' */
  .icon-transaction-1:before { content: '\e80c'; } /* '' */
  .icon-coffin:before { content: '\e80d'; } /* '' */
  .icon-schedule-1:before { content: '\e80e'; } /* '' */
  .icon-path-100:before { content: '\e80f'; } /* '' */
  .icon-up-arrow-1:before { content: '\e810'; } /* '' */
  .icon-icon-left-green-arrow:before { content: '\e811'; } /* '' */
  .icon-icon-right-green-arrow:before { content: '\e812'; } /* '' */
  .icon-twitter-logo-black-outline-20846-1:before { content: '\e813'; } /* '' */
  .icon-iconmonstr-youtube-6-1:before { content: '\e814'; } /* '' */
  .icon-iconmonstr-magnifier-lined-1:before { content: '\e815'; } /* '' */
  .icon-iconmonstr-arrow-down:before { content: '\e816'; } /* '' */
  .icon-path-40:before { content: '\e817'; } /* '' */
  .icon-fire:before { content: '\e818'; } /* '' */
  .icon-arrow-right:before { content: '\e819'; } /* '' */
  .icon-agreement-1:before { content: '\e81a'; } /* '' */
  .icon-good-feedback-1:before { content: '\e81b'; } /* '' */
  .icon-tractor:before { content: '\e81c'; } /* '' */
  .icon-padlock-1:before { content: '\e81d'; } /* '' */
  .icon-salary-based-loans:before { content: '\e81e'; } /* '' */
  .icon-order-finance:before { content: '\e81f'; } /* '' */
  .icon-civil-servant--loans:before { content: '\e820'; } /* '' */
  .icon-business-loans:before { content: '\e821'; } /* '' */
  .icon-eduacation-loan:before { content: '\e822'; } /* '' */
  .icon-micro-housing:before { content: '\e823'; } /* '' */
  .icon-stethoscope:before { content: '\e824'; } /* '' */
  
  
  body {
    overflow-x: hidden;
  }
  .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    --bs-gutter-x: 0;
    --bs-gutter-y: 0;
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    margin-right: auto;
    margin-left: auto;
    max-width: 93% !important;
  }
  .w3-container::after, .w3-container::before, .w3-panel::after, .w3-panel::before, .w3-row::after, .w3-row::before, .w3-row-padding::after, .w3-row-padding::before, .w3-cell-row::before, .w3-cell-row::after, .w3-clear::after, .w3-clear::before, .w3-bar::before, .w3-bar::after {
	content: none !important;
	}
  #tbm-the-main-menu {
    width: 100%;
  }
  .top-menu.navbar .container-fluid {
    max-width: 100% !important;
  }
  .block-block-content {
	display: block !important;
}
.tbm {
	background-color: transparent !important;
}
/* Logo */
#block-drupal8-w3css-subtheme-branding img {
	/* background: var(--the-white); */
	position: relative;
	/* border-radius: 50%; */
	/* padding: 10px; */
	/* height: 120px; */
	width: 180px;
	/* top: 42px; */
	z-index: 9999;
}

.site-name-slogan {
	display: none;
}

/* Product offering */

#alpha-region {
	background: var(--the-white);
}
.prod-holder {
	display: flex;
	flex-direction: column;
	gap: 25px;
	align-items: center;
	/* max-width: 120px; */
}


.view-product-offering.view-id-product_offering.view-display-id-page_1 .prod-title {
    font-size: 24px;
    font-weight: 400;
}
.view-product-offering.view-id-product_offering.view-display-id-page_1 .the-prod-icon {
    position: relative;
    display: flex;
    justify-content: flex-start;
}
.view-product-offering.view-id-product_offering.view-display-id-page_1 .prod-button i {
    font-size: 31px;
    font-weight: 200;
    color: var(--the-light-green);
    border: 1px solid;
    border-radius: 50%;
    padding: 10px 7px;
}
.view-product-offering.view-id-product_offering.view-display-id-page_1 .prod-button {
    margin-top: 40px;
}
.view-product-offering.view-id-product_offering.view-display-id-page_1 .prod-holder {
    display: grid;
    max-width: unset;
}
#block-drupal8-w3css-subtheme-views-block-product-offering-block-1 i.icon-icon-right-green-arrow {
    display: none;
}

.the-prod-icon i {
	color: var(--the-dark-green);
	font-size: 30px;
	border: 1px solid var(--the-gray);
	padding: 15px;
	border-radius: 6px;
	display: inline-block;
	margin-bottom: 10px;
}

#highlighted {
	background-color: var(--the-white);
	color: var(--the-black);
}
#block-drupal8-w3css-subtheme-views-block-product-offering-block-1 {
	margin-top: 4em;
	text-align: center;
	width: 100%;
}
#block-drupal8-w3css-subtheme-views-block-product-offering-block-1 h2 {
	margin-bottom: 2em;
	padding-top: 3em;
	font-weight: normal;
}
.owl-stage {
	padding-top: 30px;
}
.view-product-offering .owl-nav.disabled {
	display: flex !important;
	justify-content: space-between;
	position: absolute;
	width: 104%;
	top: 20%;
	left: -34px;
}
.owl-prev span, .owl-next span {
	color: transparent;
	font-size: 30px;
	position: relative;
}
.owl-prev span::before {
	content: "\E811";
	font-family: 'zb';
	font-size: 20px;
	position: absolute;
	color: var(--the-light-green) !important;
	left: -7px;
	top: 9px;
}
.owl-next span::after {
	content: "\E812";
	font-family: 'zb';
	font-size: 20px;
	position: absolute;
	color: var(--the-light-green) !important;
	left: -4px;
	top: 8px;
}
.owl-theme .owl-nav [class*="owl-"] {
	background: var(--the-gray) !important;
	width: 40px;
	border-radius: 50px;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 40px;
}
.prod-holder a {
    font-size: 17px;
    line-height: 1.3 !important;
    font-weight: 400;
}
@media(max-width: 760px){
	.view-product-offering .owl-nav.disabled {
		display: flex !important;
		justify-content: space-between;
		margin: -40px;
		position: relative;
		top: -90px;
	}
}
/* Header section */
#header {
	background-color: var(--the-white) !important;
	position: relative;
	z-index: 99;
}
.w3-block {
	display: block;
	width: auto;
}
#tbm-internet-banking .tbm-link {
	background: var(--the-dark-green);
	color: var(--the-white ) !important;
	border-radius: 50px 0px 0px 50px;
	padding: 10px 26px !important;
	font-size: 0.9em;
	font-weight: 500;
}

#tbm-internet-banking .tbm-link:hover, #tbm-internet-banking .tbm-link:focus {
	background: var(--the-dark-green) !important;

}

.tbm-internet-banking .tbm-submenu .tbm-subnav .tbm-link::before {
	display: none;
}

#tbm-internet-banking .tbm {
	background-color: var(--the-white);
}
#tbm-internet-banking .tbm-link::before {
	content: '\e81d';
	position: relative;
	font-family: 'zb';
	font-size: 1.1em;
	left: -6px;
}
.tbm-submenu-toggle::before {
	position: absolute;
	top: 50%;
	transform: translateY(-50%) translateX(-50%);
	content: '\e816';
	left: 50%;
	display: block;
	border-left: none;
	border-right: none;
	border-top: none;
	transition: transform 400ms ease-out;
	font-family: 'zb';
	font-size: 12px;
}

#tbm-internet-banking .tbm-item.level-1 {
	border-right: none;
}
#tbm-internet-banking .tbm-submenu-toggle {
	background-color: var(--the-light-green);
	color: var(--the-white);
	border-radius: 0 50px 50px 0;
}
 .tbm {
	background-color: var(--the-white) !important;
}


#custom-search-block-form {
	display: flex;
}
.w3-search-block-form {
	position: relative;
	width: 50vw;
	display: inline-block;
}
#search-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.8);
	z-index: 99999;
}
#search-icon {
	color: var(--the-dark-green);
	font-size: 1.2em;
}
#block-drupal8-w3css-subtheme-searchpopup {
	position: relative;
	/* top: 18px; */

}
#block-drupal8-w3css-subtheme-searchpopup::before {
	content: "";
	border-left: 2px solid var(--the-gray);
	left: 0px;
	position: absolute;
	left: -15px;
	height: 45px;
	top: -7px;
}
.search-button-block {
	width: 140px !important;
	border-radius: 0 50px 50px 0 !important;
	/* background: var(--the-white); */
	background-color: var(--the-light-green) !important;
}
#search-form-container .form-search {
	border-bottom-left-radius: 30px;
	border-top-left-radius: 30px;
	border: 1px solid white !important;
	background: var(--the-white) !important;
	padding: 8px 20px !important;
}

@media(max-width:600px){
	.w3-search-block-form {
		width: 75vw;
	}
	
.search-button-block {
	width: 30px !important;
}
}


#header-inner {
	display: flex;
	/* flex-wrap: wrap; */
	gap: 5px;
	justify-content: space-between;
	align-items: center;
	position: relative;
	z-index: 99999;
	/* margin-top: -40px !important; */
}

.navbar-we-mega-menu {
	background-color: transparent;
	
}
.navbar {
	margin-bottom: 0 !important;
}
.top-menu ul li a {
	background: var(--the-white) !important;
	text-transform: capitalize !important;
	position: relative !important;
	font-weight: normal !important;
	color: var(--grey) !important;
	font-size: 14px !important;
}


.top-menu ul li a:hover, .top-menu ul li.investments-active a {
	color: var(--the-orange) !important;
}
.top-menu ul li {
	border: none !important;
}

.top-menu ul li a:hover::before, .top-menu ul li.investments-active a::before {
	content: "\e80f";
	font-family: 'zb' !important;
	position: absolute;
	top: 45px;
	font-size: 9px;
	left: 100%;
	width: 100%;
	transform: translate(-64%, 0%);
}
#tbm-internet-banking ul li .tbm-submenu {
	background: var(--the-light-green);
	border-radius: 15px;
	border: none;
	padding: 0;
	overflow: hidden;
	margin-top: 2px;
	width: 198px !important;
	text-align: center;
	position: absolute;
	right: 0;
}

#tbm-internet-banking .tbm-subnav a {
	font-weight: 300 !important;
} 
#tbm-internet-banking .tbm-subnav li {
	padding: 6px;
}
#tbm-internet-banking .tbm-item.level-2 {
	background:  var(--the-light-green);
	position: relative !important;
}
#tbm-internet-banking .tbm-item.level-2 a {
	background: transparent !important;
}
#tbm-internet-banking .tbm-item.level-2:hover,
#tbm-internet-banking .tbm-item.level-2 a:hover {
	background: var(--the-orange ) !important;
}
#tbm-internet-banking .tbm-item.level-2::before {
	content: "";
	border-bottom: 1px solid var(--the-white);
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
}
#tbm-internet-banking .tbm-item.level-2:last-of-type:before {
	display: none !important;
}
#tbm-internet-banking .tbm-link:hover,
#tbm-internet-banking .tbm-link:focus {
  background: var(--the-orange) !important;
}
#custom-search-block-form {
	display: flex;
}
#tbm-the-main-menu {
	background: transparent !important;
}
.main-navigation-wrapper, .close-nav, .mobile-nav {
	background-color: var(--the-gray) !important;
	color: var(--the-black) !important;
	/* margin-top: -45px; */
}

.main-navigation-wrapper{
	filter: drop-shadow(0px 4px 4.3px rgba(0,0,0,0.10));
}

#tbm-the-main-menu ul li {
	border: none;
	position: relative;
}
#tbm-the-main-menu ul li::after {
	content: "";
	position: absolute;
	border-right: 1px solid var(--the-white);
	height: 36px;
	right: 0;
	width: 20px;
	top: 14px;
}
#tbm-the-main-menu ul li:last-of-type:after {
	display: none;
}
#tbm-the-main-menu button {
	display: none;
}
#tbm-the-main-menu .tbm-submenu.tbm-item-child.tbm-has-width {
	border-radius: 0 0 10px 10px;
}

.tbm-submenu.tbm-item-child {
	width: 400px;
}
#main-navigation-h {
	/* display: flex; */
	position: relative;
	z-index: 10;
}
/* .top-menu, #tbm-internet-banking {
	padding-top: 40px;
} */
#tbm-the-main-menu .tbm-subnav {
	margin: -18px;
}

#tbm-the-main-menu .tbm-link.level-1 {
	padding: 1rem 18px;
	font-size: 16px;
	font-weight: 400;
	color: var(--grey) !important;
	position: relative;
	z-index: 99;
}


#tbm-the-main-menu .level-1 .tbm-link-container {
	position: relative;
}

#tbm-the-main-menu .level-1 .tbm-link-container::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 30px; 
    height: 30px; 
    background-color: transparent;
    border: 2px solid transparent;
    border-radius: 50%;
    transition: background-color 0.3s ease, border-color 0.3s ease; 
	z-index: 9;
	transition: 500ms ease-in-out;
}

#tbm-the-main-menu .level-1 .tbm-link-container:hover::after {
    background-color: var(--the-white); 
    border-color: var(--the-white); 
}

#tbm-the-main-menu .level-1.active.active-trail .tbm-link-container::after {
    background-color: var(--the-white); 
    border-color: var(--the-white); 
}

li.tbm-item.level-1.tbm-item--has-dropdown.li-0:hover .tbm-submenu {
	opacity: 1 !important;
	display: block !important;
    overflow: visible !important;
    clip: auto !important;
    height: auto !important;
}

.tbm.animate:not(.tbm--mobile).slide .tbm-item:hover .tbm-submenu>div {
    margin-top: 0 !important;
}

.tbm-link-container .tbm-link.level-1:hover, .tbm-link-container .tbm-link.level-1:focus {
	background-color: transparent !important;
}

#tbm-the-main-menu .level-2 .tbm-link-container::after {
	display: none;
}

ul.tbm-subnav.level-1.ul-1 li:last-child a:hover {
	border-radius: 0 0 10px 10px;
}


#tbm-the-main-menu .tbm-item.level-2 a {
	padding: 15px 20px !important;
	transition: 500ms !important;
	font-size: 16px;
	font-weight: 300;
}
#tbm-the-main-menu .tbm-item.level-2 a:hover {
	background: var(--the-orange);
	color: var(--the-white);
}

.tbm-submenu.tbm-item-child .tbm-row{
	margin-left: unset !important;
}


li.tbm-item.level-2.tbm-item--has-flyout.li-1 {
	position: relative; 
  }

.tbm.animate:not(.tbm--mobile).slide .tbm-item .tbm-item>.tbm-submenu>div {
    margin-left: unset !important;
}

li.tbm-item.level-2.tbm-item--has-flyout.li-1:hover > .tbm-link-container + .tbm-submenu.tbm-item-child {
    display: block !important;
	position: absolute;
	top: 5px; 
	left: 97%; 
	z-index: 10;
}

.tbm-submenu {
    padding: 0.5rem 1rem;
    border-bottom-right-radius: 12px !important;
    border-bottom-left-radius: 12px !important;
}

li.tbm-item.level-2.tbm-item--has-flyout.li-1 .tbm-submenu.tbm-item-child {
	display: none !important;
  }
  a.tbm-link.level-3::after,
#tbm-the-main-menu .tbm-item.level-2::after {
	content: '\e819';
	position: absolute;
	border-right: none !important;
	font-family: 'zb';
	right: 28px;
	top: 15px;
	font-size: 13px;
	color: var(--the-white);
}

#tbm-the-main-menu .tbm-item.level-2:last-of-type:after {
	display: block !important;
}
/* Search */
#block-drupal8-w3css-subtheme-customsearchform {
	width: 92px;
}

.path-search form.search-form>.form-wrapper>.form-type-search {
	float: none;
  }
  

/* Crystal Clear */
@media(min-width: 760px){
	.crystal-wrapper {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}
	.scan-text {
		max-width: 70%;
	}

}
.view.view-product-tiles .view-content {
	width: 100%;
	display: flex;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	margin-top: 15px !important;
}
@media(min-width: 600px){
	.view.view-product-tiles .view-content {
		width: 100%;
		display: flex;
		justify-content: space-between;
		gap: 20px;
		flex-wrap: nowrap;
	}
}
@media(min-width: 1400px){
	.crystal-text {
		display: flex;
		flex-direction: column;
		gap: 1em;
		justify-content: center;
	}
}
.crystal-text {
	background: var(--the-dark-green);
	color: var(--the-white);
	padding: 15px 30px;
	border-radius: 0 12px 12px 0;
}
.the-scan {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	background: var(--the-white);
	color: var(--the-black);
	border-radius: 12px;
	padding: 7px 20px;
	min-height: 8em;
	justify-content: space-evenly;
	align-items: center;
}
#block-drupal8-w3css-subtheme-views-block-product-tiles-block-1 {
	width: 100%;
}
.tiles-holder {
	position: relative;
}
.tile-title {
	position: absolute;
	/* height: 100%; */
	/* width: 100%; */
	padding: 25px;
	z-index: 2;
}
.tiles-image {
	position: relative;
	z-index: 1;
}
.tile-title a {
	color: var(--the-white);
	font-size: 1.5em;
}
.tiles-image::after {
	content: '\e810';
	position: absolute;
	z-index: 9;
	font-family: 'zb';
	color: var(--the-white);
	top: 5em;
	left: 25px;
	font-size: 34px;
}
.prod-holder:hover a {
	transform: scale(1.1);
}
.view-product-offering .more-link a {
	color: var(--the-light-green);
	margin-top: 20px;
	display: inline-block;
}
.view-product-offering .more-link a {
	color: var(--the-light-green);
	margin-top: 20px;
	display: inline-block;
}
.view-product-offering .more-link a:hover {
	color: var(--the-orange);
}
.prod-holder a:hover, .the-prod-icon:hover img {
	transform: scale(1.1);
}
.prod-holder a:hover > .prod-title a{
	transform: scale(1.1);
	color: var(--the-dark-green) !important;
}
.tiles-image img {
	transition: 500ms;
}
.tiles-image:hover img {
	transform: scale(1.1);
}
#block-drupal8-w3css-subtheme-views-block-product-tiles-block-1 {
	padding-bottom: 3em;
}
/* Banner Area */
.delta-container img {
	width: 100%;
	height: 350px;
	object-fit: cover;
}

.delta-container::before {
	content: "";
	width: 100%;
	height: 100%;
	left: 0;
	z-index: 9;
	position: absolute;
	/* background: linear-gradient(90deg, rgb(2, 0, 36) 0%, rgba(108, 193, 31, 0.3) 0%, rgb(0, 143, 69) 100%); */
	background: linear-gradient(to right, rgb(19, 143, 69) 0%, rgb(19, 143, 69) 15%, rgba(255, 255, 255, 0) 55%);
}
.delta-container::after {
	content: "";
	position: absolute;
	left: 0;
	top: 200px;
	width: 45%;
	height: 100%;
	background-image: url('img/arc.svg');
	background-size: contain;
	/* background-position: center; */
	opacity: 0.5;
	/* z-index: 1; */
	background-repeat: no-repeat;
}
@media(max-width:620px){
	
	.delta-container::after {
		width: 80%;
	}
	}

.pg-title {
	position: absolute;
	width: 100%;
	top: 50%;
	text-align: center;
	color: var(--the-white);
}
h1.page-title {
	color: var(--the-white);
	text-shadow: 1px 2px 3px #18261a;
	font-size: 3em;

}
.delta-container {
	position: relative;
	background: var(--the-white);
}
.delta-container .w3-block {
	width: 100%;
}
#the-page-title {
	position: absolute;
	width: 100%;
	top: 186px;
	height: 350px;
	display: flex;
	align-items: center;
	z-index: 9;
}

#page-title-innerr {
	margin-left: 10% !important;
}


/* the board */
.view.view-board-of-directors .views-row {
	flex-basis: 100%;
}
.view.view-board-of-directors .view-content {
	display: flex;
	gap: 1em;
	flex-wrap: wrap;
}
.member-holder {
	position: relative;
	height: 100%;
	border-radius: 9px;
	padding: 15px;
	background: rgba(45, 54, 49, 0.7 );
	color: var(--the-white);
	top: -100%;
	transition: 500ms;
}
.member-wrapper {
	display: flex;
	flex-direction: column-reverse;
}
@media(min-width: 760px){
	.view.view-board-of-directors .views-row {
		flex-basis: 32%;
	}
	.view.view-board-of-directors .view-content {
		display: flex;
		gap: 1em;
		flex-wrap: wrap;
	}
	.member-wrapper {
		position: relative;
		overflow: hidden;
	}
	.member-holder {
		position: absolute;
		height: 100%;
		border-radius: 9px;
		padding: 15px;
		background: rgba(45, 54, 49, 0.7 );
		color: var(--the-white);
		top: -100%;
		transition: 500ms;
		width: 100%;
	}
	.member-wrapper:hover .member-holder {
		top: 0;
	}
}
.member-position {
	padding-bottom: 2em;
	position: relative;
}
.member-position::before {
	content: "";
	position: absolute;
	border-bottom: 3px solid var(--the-white);
	width: 20%;
	bottom: 20px;
}
.member-title {
	font-weight: 600;
}

/* Breadcrums */
.w3-row.w3-breadcrumb {
	display: none;
}

/* Footer-footer */
.the-social img {
	width: 40px;
	height: auto;
}
#block-drupal8-w3css-subtheme-copyrightsection {
	width: 100%;
}
.the-footer-footer-wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	width: 100%;
	justify-content: space-between;
	color: var(--the-black);
	padding-top: 35px;
}
.back-to-top img {
	width: 66px;
	position: relative;
	top: -85px;
	margin-bottom: -42px !important;
}
#footer-menu {
	background-color: var(--the-white);
	color: #bebebe;
}
.the-social {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.app-section {
	display: flex;
	justify-content: space-between;
	gap: 15px;
	padding-bottom: 2em;
	border-bottom: 2px solid var(--the-white);
	flex-wrap: wrap;
  }
  
  @media (max-width:1300px){
	.my-app h2 {
	  font-size: 2.0em;
  }
  
  }
.my-app h2 {
	font-size: 2.5em;
	font-weight: 400;
	color: var(--grey);
}

.quick-links h4, .quick-links a, .terms-link a, .the-copy-right {
	color: var(--grey);
}

#block-drupal8-w3css-subtheme-quicklinkssignup, #block-drupal8-w3css-subtheme-myzbapp {
	display: block;
	width: 100%;
}
.quick-mail-flex {
	display: flex;
	justify-content: space-between;
	gap: 1em;
	flex-wrap: wrap;
}
.quick-flex {
	display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-top: 40px;

}

.the-app-img {
	display: flex;
	gap: 1em;
}
#footer-container {
	background-color: var(--the-gray);
	padding: 3em 0em;
}
.terms {
	margin-top: 3em;
}
.terms-text {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	margin-top: 25px;
	color: var(--grey);
}
.terms-link {
	display: flex;
	flex-wrap: wrap;
	gap: 2em;
	position: relative;
}
.terms-link a {
	position: relative ;
}
.terms-link a:last-of-type::after {
	display: none;
}

.quick-mail-flex h4 {
	padding-bottom: 30px;
	position: relative;
}
.terms-link a::after {
	content: "";
	position: absolute;
	border-right: 1px solid var(--the-white);
	height: 30px;
	right: -20px;
	top: 0px;
	width: 10px;
}
#mc_embed_signup {
	background: var(--the-gray) !important;
	clear: left;
	font: inherit !important;
	
}
#mc_embed_signup .mc-field-group input {
	display: block;
	width: 100%;
	padding: 8px 0;
	text-indent: 2%;
	max-width: 645px !important;
}
#mc_embed_signup .indicates-required {
	display: none !important;
}
#mc_embed_signup {
	display: block !important;
	width: 100% !important;
}
#mc_embed_signup_scroll {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	align-items: center;
}
.refferal_badge {
	display: none !important;
}
#mc_embed_signup form {
	margin: 0 !important;
}
#mc_embed_signup .mc-field-group input {
	
	border-color: var(--the-light-green);
	border-radius: 50px !important;
}
#mc-embedded-subscribe {
	background: var(--the-light-green) !important;
	height: 50px !important;
	width: 145px !important;
	border-radius: 50px !important;
	font-weight: 600 !important;
	margin-top: 31px;
	color: var(--the-white);
	border-color: transparent;
}
#mc_embed_signup input.mce_inline_error {
	border-color: transparent !important;
	margin-top: 53px;
  }
.quick-mail-flex h4::before {
	content: "";
	position: absolute;
	border-bottom: 2px solid var(--the-white);
	width: 340px;
	bottom: 14px;
}
.terms-text a {
	color: var(--the-orange);
}
#footer-container .first-footer > div {
	background-color: var(--the-gray);
	color: var(--the-black) !important;
}
.quick-mail-flex a {
	color: var(--the-black) !important;
}
#mc_embed_shell {
	margin-top: 2em;
}
@media(min-width: 760px){
	#mc_embed_signup .mc-field-group input {
		display: block;
		/* width: 39vw !important; */
		padding: 8px 0;
		text-indent: 2%;
		border-color: transparent;
		border-radius: 50px !important;
		min-width: 390px;
	}
	#mc_embed_signup_scroll {
		display: flex;
		flex-wrap: nowrap !important;
		gap: 5px;
		width: 100%;
	}
	#mc_embed_signup {
		background: var(--the-gray) !important;
		clear: left;
		font: inherit !important;
	
	}
	#mc_embed_signup div#mce-responses {
		
		display: none;
	}
}
/* .path-frontpage #footer-container {
	display: none;
} */

/* Tabs style */
.quicktabs-tabs > li > a {
	border: none;
	display: block;
	padding: .5rem 1rem;
	position:  relative !important;
	transition: 500ms;
}
.quicktabs-tabs > li > a:hover::before {
	content: "";
	position: absolute;
	border-bottom: 2px solid var(--the-orange);
	width: 100%;
	bottom: 0;
	left: 0;
}
.quicktabs-tabs > li.active{
	position: relative;
}
ul.quicktabs-tabs {
	border-bottom: 0;
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin-top: 20px;
	margin-bottom: 1rem;
	justify-content: center;
	gap: 1em;
	position: relative;
}
ul.quicktabs-tabs::before {
	content: "";
	position: absolute;
	border-bottom: 2px solid var(--the-gray);
	width: 80%;
	bottom: 1px;
}
.quicktabs-tabs > li.active > a {
	border-bottom: 2px solid var(--the-black) !important;
	color: var(--the-black)!important
}
.quicktabs-tabs > li.active > a {
	color: var(--the-black) !important;
	background-color: var(--the);
	border-color: var(--the-orange) !important;
	border: none;
}

.bootstrap-tabs {
	margin-top: 2em;
}
.bootstrap-tabs .nav-tabs {
	border-bottom: none;
	display: flex;
	justify-content: center;
	margin-bottom: 3em;
	position: relative;
}
@media(max-width: 760px){
	.bootstrap-tabs .nav-tabs::before {
		content: "";
		position: absolute;
		border-bottom: 2px solid var(--the-gray);
		width: 100%;
		bottom: 0;
	}
}
.tabsbar ul.quicktabs-tabs {
	border-bottom: none;
}
.bootstrap-tabs .nav-tabs::before {
	content: "";
	position: absolute;
	border-bottom: 2px solid var(--the-gray);
	width: 40%;
	bottom: 0;
}
.ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle {
	display: inline-block;
	position: absolute;
	padding: 0 10px;
	width: 30px;
	height: 30px;
	z-index: 1;
	top: calc(50% - 1px);
	left: auto;
	box-sizing: border-box;
	right: 20px;
}
.tab-content > .active {
	border: none !important;
}
.bootstrap-tabs .nav-tabs > li.active > a, .bootstrap-tabs .nav-tabs > li.active > a:focus {
	border-bottom: 3px solid var(--the-orange) !important;
	color: var(--the-black) !important;
}
.tab-link {
	border: 0 !important;
}
.bootstrap-tabs .nav > li > a:hover, .bootstrap-tabs .nav > li > a:focus {
	text-decoration: none;
	background-color: transparent;
	color: var(--the-black);
	border-bottom: 3px solid var(--the-orange) !important;
}
.ckeditor-accordion-container > dl dt > a, .ckeditor-accordion-container > dl dt > a:not(.button) {
	display: block;
	padding: 30px 15px 30px 50px;
	background-color: var(--the-white) !important;
	color: var(--the-black) !important;
	-webkit-transition: background-color 300ms;
	transition: background-color 300ms;
}
.ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle::after {
	right: 7px !important;
	left: auto;
	-webkit-transform: rotate(-135deg) !important;
	transform: rotate(-180deg) !important;
}
.ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle::before, .ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle::after {
	background: var(--the-black);
	
}
.ckeditor-accordion-container > dl dt.active > a > .ckeditor-accordion-toggle::before {
	transform: rotate(0deg) !important;
}
.ckeditor-accordion-container > dl dt.active > a > .ckeditor-accordion-toggle::after {
	transform: rotate(0deg) !important;
}
.ckeditor-accordion-container > dl {
	border: none !important;
}
.ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle::before {
	left: 13px;
	-webkit-transform: rotate(90deg) !important;
	transform: rotate(90deg) !important ;
}
.ckeditor-accordion-container > dl dt > a, .ckeditor-accordion-container > dl dt > a:not(.button) {
	border-bottom: 1px solid var(--the-gray);
}
.ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle::after {
	right: 7px;
	left: auto;
	-webkit-transform: rotate(-135deg);
	transform: rotate(-180deg);
}
.ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle::before, .ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle::after {
	content: "";
	display: block;
	height: 3px;
	position: absolute;
	width: 20px;
	left: 0px !important;
	top: 0;
}
/* dl dt:first-of-type {
	border-top: 1px solid var(--the-gray) ;
} */

.ckeditor-accordion-container > dl dt > a, .ckeditor-accordion-container > dl dt > a:not(.button) {
	border-bottom: none;
	border-top: 1px solid var(--the-gray);
}

dd {
	padding: 2em 3em !important;
}
/* Slider */
.slide-container {
	position: relative;
}
#slide {
	margin-bottom: -10em;
}
/* .view.view-slider .flex-control-nav {
	display: none !important;
} */
.flex-control-nav {
    bottom: 0;
    z-index: 999;
}

.flex-control-paging li a.flex-active {
    background: var(--the-gray) !important;
}

.flexslider {
	margin: 0 0 0px !important;
	background: #fff;
	border: 0px solid !important;
	position: relative;
	zoom: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	-webkit-box-shadow: 0;
	-moz-box-shadow: 0;
	-o-box-shadow: 0;
	box-shadow: 0;
}

.flex-viewport {
    max-height: 2000px;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -ms-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
    width: 100%;
    height: 552px !important;
}

.slide-container .flexslider:hover .flex-direction-nav a, .slide-container .flexslider:hover .flex-direction-nav a {
	display: none;
}
.bg-cap {
	font-size: 2.2em;
	font-weight: 600;
}
.bg-cap p {
	font-weight: 500;
	/* font-size: 36px; */
}


.flexslider .slides img {
	width: 100%;
	display: block;
	min-height: 600px !important;
	object-fit: cover !important;
}
.sldr-img {
	min-height: 600px;
}
.flex-viewport {
	min-height: 600px;
}


@media(max-width: 760px){
	.slider-content {
		margin-right: 5%;
		margin-left: 5%;
	}

	.bg-cap {
		font-size: 2em;
		max-width: 100%;
	}
}

@media(max-width: 1000px) {
	.view-product-offering .owl-nav {
		display: none;
	}
}

@media(min-width: 760px){
	.bg-cap {
		font-size: 2.5em;
		font-weight: 600;
		max-width: 60%;
		line-height: 1.2;
		margin-bottom: 1em;
	}
	.slider-content {
		position: absolute;
		left: 7vw;
	}
}

@media(min-width: 760px){
	.bg-cap {
		font-size: 2.5em;
		font-weight: 600;
		max-width: 60%;
		line-height: 1.2;
		margin-bottom: 1em;
	}
	.slider-content {
		position: absolute;
		left: 7vw;
	}
}
@media(max-width: 1400px){
	.sldr-content-positioning {
		position: absolute;
		display: flex;
		align-items: center;
		height: 100%;
		top: 0px;
		width: 100%;
		max-height: 500px;
	}
}
@media(min-width: 1401px){
	.sldr-content-positioning {
		position: absolute;
		display: flex;
		align-items: center;
		height: 100%;
		top: 0px;
		width: 100%;
		max-height: 700px;
	}
	.slider-content {
		position: absolute;
		left: 10%;
	}
}
.frst-lnk a {
	background: var(--the-white);
	padding: 22px 40px;
	color: var(--the-light-green);
	border-radius: 50px;
	transition: 500ms;
	text-transform: capitalize;
}
.scnd-link a {
	transition: 500ms;
	text-transform: capitalize;
}
.slider-links-flex {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5em;
}
.slider-content {
	color: var(--the-white);
}
.sml-cap {
	font-weight: 600;
	text-transform: capitalize;
}

.views-field.views-field-field-the-slider-image {
	position: relative;
}

/* .views-field.views-field-field-the-slider-image::before {
	content: "";
	width: 100%;
	left: 0;
	height: 100%;
	position: absolute;
	background: rgba(0,0,0,0.6);
} */


/* Careers */
.view-careers .views-field-view-node a {
	background: var(--the-light-green);
	padding: 13px 25px;
	border-radius: 50px;
	color: var(--the-white);
	transition: 500ms;
	display: inline-block;
	margin-bottom: 2.5em;
	margin-top: 1.5em;
}
.view-careers .views-field-title a {
	font-size: 1.1em;
	transition: 500ms;
}
.view-careers .views-field-view-node a:hover {
	background: var(--the-orange);
}
.view-careers .views-field-title a:hover {
	color: var(--the-orange);
}
.view-careers .views-row:first-of-type .views-field-title {
	margin-top: 2.5em;
}
.view-careers .views-row:first-of-type {
	border-top: 1px solid var(--the-gray);
	margin-top: 1em;
}
.view-careers .views-row {
	border-bottom: 1px solid var(--the-gray);
	margin-bottom: 3em;
}
.view-careers .view-content {
	margin-top: 5em;
}

#quicktabs-careers ul.quicktabs-tabs::before {
	content: "";
	position: absolute;
	border-bottom: 2px solid var(--the-gray);
	width: 57%;
	bottom: 18px;
}
/* Contact Us */
.view-contact-details .view-content {
	display: flex;
	flex-wrap: wrap;
	gap: 1em;
	margin-bottom: 3em;
	justify-content: center;
}

@media(min-width: 900px) {
	.view-contact-details .view-content {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
	}
}


.view-contact-details.view-id-contact_details img {
    width: 100%;
}

.contact0-background {
	background: var(--the-gray);
	padding: 19px;
	border-radius: 0 0 10px 10px;
	min-height: 13em;
	padding-top: 35px;
}
.view-contact-details .contact0-background a {
	position: relative;
	display: inline-block;
	background: var(--the-light-green);
	color: var(--the-white);
	padding: 10px 20px;
	border-radius: 50px;
	transition: 500ms;
	margin-top: 8px;
}
.c-title {
	font-weight: 600;
}
#block-drupal8-w3css-subtheme-zbmap {
	position: relative;
	margin-top: 6em;
}
#block-drupal8-w3css-subtheme-zbmap iframe {
	width: 100%;
}
/* News-Insights */
.view.view-news-insights .view-content {
	display: flex;
	gap: 2em;
	flex-wrap: wrap;
	justify-content: space-between;
}
.view.view-news-insights .view-content .views-row {
	flex-basis: 370px;
	margin-bottom: 3em;
	position: relative;
}
.view.view-news-insights .views-field-view-node a {
	color: var(--the-light-green);
	transition: 500ms;
}
.view.view-news-insights .views-field-field-news-insights-date .field-content {
	background: var(--the-dark-green);
	display: inline-block;
	margin-top: 1.5em;
	color: var(--the-white);
	border-radius: 50px;
	padding: 1px 15px;
	margin-bottom: 1em;
}
.view-news-insights .views-field-body p {
	font-size: 17px;
	line-height: 1.3;
	display: block;
	margin: 0.5em 0;
}
.view.view-news-insights .views-field-view-node::before {
	content: "";
	position: absolute;
	border-bottom: 1px solid var(--the-gray);
	width: 100%;
	left: 0;
	bottom: -25px;
}
.view-news-insights .views-field-title a {
	font-weight: 600;
	font-size: 1em;
}
.views-field-field-news-insights-image .field-content a {
	border-radius: 10px;
}
.field.field--name-field-news-insights-image img {
	max-width: 300px;
	object-fit: cover;
	height: auto;
	float: left;
	margin-right: 20px;
}


/* footer */
/* .path-frontpage #footer-menu {
	
	display: none;
} */

/* Online Enquiries */

#webform-submission-contact-node-36-add-form {
	width: 60%;
	margin-right: auto;
	margin-left: auto;
}

.w3-section input, w3-section textarea  {
	box-shadow: none;
	border-radius: 3px;
	border: 1px solid #dfdada !important;
}


#edit-actions-submit {
	background: var(--the-light-green);
	color: white;
	border: none !important;
	box-shadow: none;
}

#edit-actions-submit:hover {
	background: var(--the-dark-green) !important;
	color: white !important;
}

/* Banking Services */


.services-wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 30px;
	margin: 60px 0;
}
.path-node-140 .services-wrapper{
	grid-template-columns: 1fr 1fr 1fr;
}

@media(max-width: 796px) {
	.services-wrapper {
		display: grid;
		grid-template-columns: 1fr;

	}
}
  

  .service-wrap {
	position: relative;
	min-height: 380px;
}

.service-wrap img {
	/* filter: brightness(0.25); */
	border-radius: 20px;
	width: 100%;
	object-fit: cover;
	min-height: 225px;
}

.path-our-services .view-product-offering .view-content {
	display: grid;
	grid-template-columns: 1fr 1fr ;
	gap: 40px;
}

.view-product-offering.view-id-product_offering.view-display-id-page_1 .w3-row.views-row {
    background: var(--the-gray);
    padding: 60px;
    border-radius: 15px;
    align-items: flex-start;
}
.view-product-offering.view-id-product_offering.view-display-id-page_1 .the-prod-icon i {
    border: none;
    padding: 0;
    font-size: 3em;
}
@media(max-width: 600px){

.path-our-services .view-product-offering .view-content {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 30px;
}

}

.banking-content {
	background: var(--the-white);
	position: relative;
	margin-top: -80px;
	border-radius: 15px;
	padding: 40px 20px;
	border: 1px solid var(--border-grey);
}

.banking-content h3 {
	margin-bottom: 20px;
	color: var(--the-dark-green);
	font-size: 1.5em;
	font-weight: 400;
	line-height: 1.2;
	min-height: 40px;}

.banking-content p {
	line-height: 1.7;
	font-size: 17px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	overflow: hidden;
}

.banking-buttons {
	display: flex;
	align-items: baseline;
	gap: 20px;
	margin-top: 15px;
}

.banking-buttons .learn-more-btn a {
	background: var(--the-dark-green);
	color: var(--the-white);
	display: inline-block;
	padding: 5px 25px;
}


.learn-more-btn a {
	background: var(--the-white);
	color: var(--the-light-green);
	padding: 12px 30px;
	display: inline-block;
	border-radius: 50px;
}

.learn-more-btn a:hover {
	background: var(--the-light-green);
	color: var(--the-gray);
}

.banking-services a:hover {
	color: var(--the-gray);
}

.diaspora-content {
	color: var(--the-white);
	padding: 30px;
}

@media (max-width: 992px) {
	.banking-content {
		top: 0%;
		padding: 20px 20px;
	}

	.service-wrap p{
		font-size: 15px;
	}
}

/* Access Banking */

.access-wrapper {
	display: flex;
	justify-content: space-between;
	/* flex-wrap: wrap; */
	gap: 10px;
	margin-top: 40px;
}

.access-wherever {
	display: flex;
	gap: 30px;
}

.access-wrapper h3 {
	font-size: 24px;
	font-weight: normal;
	margin-bottom: 30px;
}

.zb-app span::before {
	margin-right: 15px;
	font-size: 30px;
	color: var(--the-dark-green);
}

.zb-app p {
	margin-bottom: 30px;
}

.download-btn {
	margin-top: 60px;
}

.download-btn a {
	background: var(--the-light-green);
	padding: 18px 40px;
	display: block;
	border-radius: 50px;
	color: var(--the-white);
	text-align: center;
	font-weight: 600;
	transition: 500ms;
}
.download-btn a:hover {
	background: var(--the-orange);
}
.branches-atms h3 {
	margin-bottom: 10px;
}

.branches-atms {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.branches-atms a {
	font-size: 16px;
	color: var(--the-light-green);
	font-weight: 500;
}

.search.loctions, .appointments, .hour-banking {
	position: relative;
	margin-left: 50px;
}
.search.loctions::before {
	content: "\e802";
	left: 0;
	font-family: "zb";
	color: var(--the-dark-green);
	top: 5px;
	position: absolute;
	margin-left: -50px;
	font-size: 30px;
}

.appointments::before {
	content: "\e80e";
	left: 0;
	font-family: "zb";
	color: var(--the-dark-green);
	top: 5px;
	position: absolute;
	margin-left: -50px;
	font-size: 30px;
}

.hour-banking::before {
	content: "\0e80";
	left: 0;
	font-family: "zb";
	color: var(--the-dark-green);
	top: 5px;
	position: absolute;
	margin-left: -50px;
	font-size: 30px;
}

.access-separator {
	border-left: 2px solid var(--the-gray);
}


@media(max-width:1230px){
	.access-separator {
		border: none;
	}

	.branches-atms {
		display: flex;
		flex-direction: inherit;
		gap: 20px;
		flex-wrap: wrap;
		justify-content: center;
		margin-top: 40px;
	}

	.access-wherever {
		display: flex;
		gap: 30px;
		flex-wrap: wrap;
		justify-content: center;
	}

	.access-wrapper {
		display: flex;
		justify-content: unset;
		flex-wrap: wrap;
		gap: 10px;
		margin-top: 40px;
	}
}
/* Borrow Money Section */
.path-frontpage #bottom-container {
	position: relative;
	background-image: url("img/borrow.png");
	min-height: 541px;
	display: flex;
	align-items: center;
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

section#block-drupal8-w3css-subtheme-borrowmoney {
    padding: 60px 0;
}

#bottom-container .first-bottom > div {
	background-color: transparent;
	color: var(--the-white);
}
.customer-loans {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 2em;
}
.the-links {
	display: flex;
	/* flex-wrap: wrap; */
	gap: 3em;
	align-items: center;
	margin-top: 2em;
}
.link-one a {
	background: var(--the-white);
	padding: 10px 45px;
	display: inline-block;
	color: var(--the-light-green);
	border-radius: 50px;
}
.b-links-sec {
	margin-top: 3em;
}
.the-links a {
	transition: 500ms;
	font-weight: 600;
}
.link-one a:hover {
	background: var(--the-black);
	color: var(--the-white);
}
.link-two a:hover {
	color: var(--the-black);
}

@media(min-width: 900px){
	.b-text p {
		max-width: 62%;
	}
	.b-title h2 {
		max-width: 500px;
	}
}
.b-title h2 {
	margin-bottom: 1em;
	color: var(--the-white);
}
.b-links-sec h5 {
	font-size: 1.3em;
}
/* Individual aaccounts & Business */
.view-accounts .view-content {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 2em;
}
#block-drupal8-w3css-subtheme-individualaccounts h2 {
	font-size: 1.3em !important;
}
@media(min-width:768px){
	.view-accounts .view-content {
		display: grid;
		gap: 2em;
		grid-template-columns: 1fr 1fr;
		place-items: center;
	}
}

.view-accounts .view-content .views-field-field-image-account img {
	border-radius: 12px;
}
.view.view-accounts .view-content .views-row {
	/* max-width: 370px; */
	width: 100%;
	position: relative;
}
.view.view-accounts .view-content .views-row .views-field-view-node a {
	color: var(--the-light-green);
	transition: 500ms;
}
.view.view-accounts .view-content .views-row .views-field-view-node a:hover {
	color: var(--the-orange);
}
.views-field-field-image-account {
	border-radius: 12px;
	overflow: hidden;
}
a > img.w3-image {
	transition: 1s !important;
}
a:hover > img.w3-image {
	animation: animateimg 1s !important;
	transition: 1s !important;
} 
.field--name-field-image-account img {
	max-width: 350px;
	float: left;
	margin-right: 20px;
	border-radius: 12px;
}
.view-accounts.view-id-accounts .views-row .views-field-title {
	display: inline-block;
	margin-top: 1em;
}
@media(min-width: 760px){
	.view-accounts.view-id-accounts.view-display-id-page_2.js-view-dom-id-3bd6579c53a262a4709c53f6f641c36b6f784405719697440bad5f8045f0cda2 .views-row {
		max-width: 47%;
	}
}

/* Accounts */

.account-wrap {
	position: relative;
	transition: 500ms ease-in-out;
}

.account-content {
	position: absolute;
	top: 0%;
	padding: 40px;
	z-index: 99;
}

.account-wrap:hover {
	color: var(--the-white);
}

.account-wrap::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: var(--the-gray);
	z-index: 9;
}

.account-wrap:hover::before {
	transition: 500ms ease-in-out;
	background: rgba(0,0,0,0.75);
}

.account-title {
	font-size: 36px;
	font-weight: 400;
}
.acc-type-image {
	position: relative;
	border-radius: 12px;
}
.acc-type-image img {
	position: relative;
	border-radius: 12px;
}
.acc-type-image a::before {
	content: "";
	position: absolute;
	background: rgba(0,0,0,0.3);
	height: 100%;
	width: 100%;
	border-radius: 12px;
	z-index: 9;
}
.account-wrapper {
	position: relative !important;
	overflow: hidden;
	border-radius: 12px;
}
.acc-type-holder {
	position: absolute;
	top: 0;
	padding: 20px;
}
.acc-type-holder .acc-type-title a {
	position: relative !important;
	z-index: 999;
	color: var(--the-white) !important;
	font-size: 1.7em;
}
.acc-type-image {
	transition: 500ms ease-in-out;
}
.account-wrapper:hover img {
	transform: scale(1.1);
	transition: 500ms ease-in-out;

}

.acc-type-image img {
	transition: 500ms ease-in;
	width: 100%;
}
.acc-type-title a::after {
	content: '\e812';
	position: absolute;
	font-family: 'zb';
	border: 2px solid;
	padding: 5px;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 23px;
	bottom: -246px;
}
.zb-flex {
	display: flex;
	justify-content: space-around;
	gap: 20px;
	flex-wrap: wrap;
}
@media(min-width: 720px){
	.account-wrapper {
		flex-basis: 46%;
	}
}
.account-wrap img {
	width: 100%;
	border-radius: 15px;

}
.account-button-link i {
	border: 2px solid;
	border-radius: 50%;
	padding: 10px 15px;
	display: inline-block;
	font-size: 20px;
	color: var(--the-light-green);
}

.account-button-link {
	margin-top: 30px;
}

.account-wrap:hover i {
	color: var(--the-white);
}

/* Accounts Single */

#block-drupal8-w3css-subtheme-businessaccounts-2, #block-drupal8-w3css-subtheme-individualaccounts {
	background: var(--the-gray);
	border-radius: 10px;
}

#block-drupal8-w3css-subtheme-businessaccounts-2 h2, #block-drupal8-w3css-subtheme-individualaccounts h2 {
	padding: 20px 30px 0;
	font-weight: 400;
	font-size: 28px;
}

.ul-parent.ul-parent-business-accounts li, .ul-parent.ul-parent-individual-accounts li {
	float: none;
	display: block;
	border-bottom: 1px solid var(--the-white);

}

.li-item.li-item-business-accounts a, .li-item.li-item-individual-accounts a {
	padding: 15px 30px;
	font-size: 20px !important;
	font-weight: 400;
}

.li-item.li-item-business-accounts a:hover, .li-item.li-item-individual-accounts a:hover {
	background-color: var(--the-orange) !important;
}

.w3-threequarter {
	padding-right: 40px !important;
	margin-right: 60px;
}


/* credit cards */
.view.view-cards .view-content {
	display: flex;
	flex-wrap: nowrap;
	gap: 1em;
}
@media(min-width: 600px){
	.view.view-cards .view-content {
		display: grid;
		gap: 2em;
		grid-template-columns: repeat(3, 1fr);
	}
	.view.view-cards .view-content .views-row {
		flex-basis: 48%;
	}
}

.views-field-field-card-image img {
	border-radius: 12px;
}
.view.view-cards .views-field-title {
	color: var(--the-light-green);
	font-size: 1.1em;
	padding: 5px 20px;
}
.view.view-cards .view-content .views-row {
	box-shadow: #efefef 0px 3px 6px 3px;
	padding: 0px 0px 10px 0px;
	border-radius: 12px;
}
.view.view-cards .views-field.views-field-body p{
	padding: 0px 0px 20px 0px;
}
.view.view-cards .views-field.views-field-body p {
	padding: 5px 20px !important;
}


/* Feedback form */

.webform-submission-feedback-form-form {
	width: 60%;
	margin-right: auto;
	margin-left: auto;
	margin-top: 60px;
}

@media(min-width:560px){
	.webform-submission-feedback-form-form {
		width: 60%;
	}
}

.webform-submission-feedback-form-form textarea, .webform-submission-feedback-form-form input, .webform-submission-feedback-form-form select {
	background: transparent;
	box-shadow: none;
}

form .form-item label {
	padding-right: 10px;
	font-weight: 400;
}

.webform-submission-feedback-form-form select {
	padding: 9px;
}

#edit-submit {
	background-color: var(--the-light-green);
	color: var(--the-gray);
	border: none !important;
	padding: 9px 40px;
	border-radius: 50px;
}

#edit-submit:hover {
	background-color: var(--the-orange);
	color: var(--the-gray) !important;
}

/* Partners */

.views-field.views-field-field-partner-logo img {
	width: 300px;
}
.view-partners .views-field.views-field-title {
	font-size: 1.5em;
	color: var(--the-dark-green);
	font-weight: 400;
}

/* .path-microloans section{
	margin-top: 50px;
} */
.path-microloans h2.w3-block-title{
	padding-bottom: 20px;
	font-size: 2em;
}
.path-microloans  .view-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}
.path-microloans  .view-content a{
	font-style: italic;
	color: var(--the-orange);
}
.path-microloans .views-field.views-field-field-partner-logo {
    margin-bottom: 25px;
}
.path-microloans .view-partners.view-id-partners .w3-row.views-row:nth-child(3) .views-field.views-field-field-partner-logo img{
	width: 150px;
}
.path-microloans .w3-row.views-row{
    border: 1px solid var(--the-gray);
    padding: 50px;
	border-radius: 15px;
}
@media (max-width: 768px){
.path-microloans .view-content{
		grid-template-columns: 1fr;
	}
}
/* Business Conditions */

.banking-conditions img {
	width: auto;
	margin-right: auto;
	margin-left: auto;
}

a.button {
	background: var(--the-light-green);
	color: var(--the-gray);
	padding: 15px 30px;
	display: inline-block;
	border-radius: 50px;
}

a.button:hover {
	background: var(--the-orange);
	color: var(--the-gray);
}

.pager__items li.is-active {
	padding: 6px 12px;
	font-weight: 400 !important;
	background: transparent !important;
}

.pager__items li a {
	padding: 6px 12px;
	display: inline-block;
	border: none;
	color: var(--the-light-green);
	border-radius: 0;
}

.pager__items li a:hover {
background: transparent !important;
}

.banking-conditions {
	text-align: center;
}


/* Branch Locator */

/* #views-exposed-form-branch-locator-page-1 {
	width: 80%;
	margin-right: auto;
	margin-left: auto;
} */

#views-exposed-form-branch-locator-page-1 select {
	background: transparent;
	padding: 10px;
}

#edit-submit-branch-locator {
	background: var(--the-light-green);
	color: var(--the-gray);
	border: none !important;
	padding: 15px 30px;
	/* margin-right: auto;
	margin-left: auto; */
	display: block;
	transition:500ms ease-in-out;
}

#edit-submit-branch-locator:hover {
	background: var(--the-orange);

}

.view-branch-locator .w3-row.views-row {
	border-bottom: 1px solid var(--the-gray);
	padding: 20px 0;
}

.view-branch-locator .view-content {
	display: grid;
	gap: 20px;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	margin-top: 60px;
}

.view-branch-locator .w3-row.views-row {
	border-bottom: 3px solid var(--the-dark-green);
	padding: 20px 0;
	border-radius: 5px;
	-webkit-box-shadow: 0px 2px 5px -4px rgba(173,173,173,0.6);
	-moz-box-shadow: 0px 2px 5px -4px rgba(173,173,173,0.6);
	box-shadow: 0px 2px 5px -4px rgba(173,173,173,0.6);
	padding: 20px;
}
#block-drupal8-w3css-subtheme-local-tasks {
	position: relative;
	z-index: 9999999999999999999999;
}




/* Table style */
.w3-table-all {
	border: none;
}
thead tr {
	background: var(--the-light-green) !important;
	color: var(--the-white);
}
.w3-table-all tr:nth-child(2n) {
	background-color: rgba(223, 239, 230, 0.3);
}
tr {
	border: none !important;
}

/* commodities */
#block-drupal8-w3css-subtheme-views-block-commodity-prices-block-1, #block-drupal8-w3css-subtheme-views-block-ptc-rates-block-1, #block-drupal8-w3css-subtheme-views-block-libor-rates-block-1 {
	margin-top: 4em;
}

/* Products */
.view-duplicate-of-accounts .view-content {
	display: grid;
	gap: 2em;
	grid-template-columns: 1fr;
}
.view-duplicate-of-accounts .view-content .views-row {
	/* padding: 25px; */
	min-height: 300px;
	display: flex;
	align-items: center;
	flex-direction: column;
}
@media(min-width: 600px){
	.view-duplicate-of-accounts .view-content {
		display: grid;
		gap: 2em;
		grid-template-columns: 1fr 1fr;
	}
}
.view-duplicate-of-accounts .view-content .views-row .views-field-title a {
	display: flex;
	height: 300px;
	position: relative;
	font-weight: 500;
	font-size: 1.3em;
	background: var(--the-gray);
	padding: 90px 30px;
	flex-direction: column;
}
.view-duplicate-of-accounts .view-content .views-row .views-field-title a:hover {
	background: var(--the-dark-green);
	color: var(--the-white);
}
.view-duplicate-of-accounts .view-content .views-row .views-field-title a:hover::after {
	color: var(--the-white);
}
.prod-imge i {
	font-size: 3em;
	color: var(--the-dark-green);
}
.view-duplicate-of-accounts .view-content .views-row .views-field-title a::after {
	content: "\e812";
	font-family: 'zb';
	position: absolute;
	bottom: 35px;
	color: var(--the-light-green);
	border: 2px solid;
	width: 50px;
	height: 50px;
	display: flex;
	justify-content: center;
	border-radius: 50px;
	align-items: center;
}
.view-duplicate-of-accounts .views-field.views-field-title {
	display: block;
	width: 100% !important;
}
.prod-wrapper:hover .prod-imge i::before {
	color: var(--the-white);
}
.prod-imge {
	position: absolute;
	z-index: 9;
	left: 18px;
}
.prod-wrapper {
	display: flex;
	flex-direction: column;
	position: relative;
}
.prod-imge img {
	max-width: 80px;
	max-height: 80px;
	object-fit: scale-down;
}

/* Testimonials */

.view-testimonials.view-id-testimonials {
	text-align: center;
	margin-bottom: 120px;
	margin-top: 40px;
}

.view-testimonials.view-id-testimonials blockquote {
	border-left: none !important;
}

.flexslider:hover .flex-direction-nav .flex-prev, .flexslider:hover .flex-direction-nav .flex-next {
	display: none;
}


.requirements {
	columns: 2;
	margin: 40px 0;
}

.requirements p {
	background: var(--the-gray);
	padding: 15px;
	margin-bottom: 30px;
	text-align: center;
}

a.button {
	background: var(--the-light-green);
	color: var(--the-gray);
	padding: 15px 40px;
	margin-top: 30px;
	display: inline-block;
}

.view-testimonials ul.flex-direction-nav {
    display: none;
}


/* microloans about us */
article.contextual-region.w3-row.node.node--type-page.node--view-mode-full
.content-text {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-gap: 10px;
    align-items: start;
    justify-content: start;
	padding-bottom: 30px;
}
article.contextual-region.w3-row.node.node--type-page.node--view-mode-full .image {
    grid-column: 2;
}
article.contextual-region.w3-row.node.node--type-page.node--view-mode-full .content-info {
    grid-column: 8;
}
@media (max-width: 768px) { 
	article.contextual-region.w3-row.node.node--type-page.node--view-mode-full .content-info {
		grid-column: 2;
	}
  }

/* Sign Up Form */

.ui-widget-header {
    background: transparent;
    color: var(--the-black);
    font-weight: 600;
    text-align: center;
    font-size: 1.5em;
}

form .form-item label, legend {
    padding-right: 10px;
    font-weight: 300;
    font-size: 1em;
	margin-bottom: 0px;
	border-bottom: none;
}

button.webform-button--submit {
    background: var(--the-light-green);
    color: var(--the-white);
    padding: 15px 30px;
    transition: 500ms ease-in-out;
    border-radius: 0;
    box-shadow: none;
    border: none !important;
}
button.webform-button--submit:hover {
    background: var(--the-orange) !important;
	color: var(--the-white) !important;
}


/* Mobile Responsive*/
.mobile-nav.w3-hide-large.w3-button.w3-block.w3-right-align.w3-large.w3-theme {
	display: none;
}
@media(max-width: 1200px){
	#block-drupal8-w3css-subtheme-topmenu {
		display: none;
	}
	#block-drupal8-w3css-subtheme-internetbanking, .mobile-nav.w3-hide-large.w3-button.w3-block.w3-right-align.w3-large.w3-theme {
		display: none;
	}

	#main-navigation-h {
		display: none;
	}
	.view-product-offering .view-content {
		gap: 1.5em;
		justify-content: space-evenly;
	
	}
	#block-drupal8-w3css-subtheme-branding {
		flex-basis: 80%;
	}
}

@media(max-width: 1395px){
	#tbm-internet-banking .tbm-link {
		padding: 5px 12px !important;
		font-size: 0.8em;
	}

	.tbm-submenu-toggle {
		width: 2rem;
	}

	.we-mega-menu-ul > .we-mega-menu-li > a, .we-mega-menu-ul > .we-mega-menu-li > span {
		padding: 1.125rem 0.6rem;
		font-size: 14px !important;
	}

	.top-menu ul li a {
		font-size: 15px !important;
	}
}

@media(min-width: 1200px){
	#tbm-mobile-menu {
		display: none;
	}
	#block-drupal8-w3css-subtheme-responsivemenumobileicon {
		display: none;
	}
}
#mce-responses {
	display: none !important;
}

@media(min-width:1300px){
    .we-mega-menu-ul > .we-mega-menu-li > a, .we-mega-menu-ul > .we-mega-menu-li > span {
		padding: 1.125rem 0.45rem;
		font-size: 14px !important;
	}
}


/* Mobile Menu */
.responsive-menu-toggle-icon::before, .responsive-menu-toggle-icon::after, .responsive-menu-toggle-icon span.icon {
	background: var(--the-light-green) !important;
}
.mm-panel, .mm-navbar {
	background: var(--the-light-green) !important;
}
.responsive-menu-toggle-icon::before, .responsive-menu-toggle-icon::after, .responsive-menu-toggle-icon span.icon {
	content: '';
	display: block;
	width: 32px;
	height: 4px;
	position: absolute;
	top: 10px;
	left: 13px;
	border-radius: 2px;
}
.responsive-menu-toggle-icon::before {
	top: 0px !important;
}
.responsive-menu-toggle-icon::after {
	top: 20px !important;
}
.responsive-menu-toggle-icon {
	box-sizing: border-box;
	display: block;
	width: 44px;
	height: 35px;
	z-index: 4;
	/* margin-top: 45px !important; */
	position: relative;
}
.mm-wrapper__blocker {
	background: rgba(0,0,0,1) !important;
}
.mm-navbar__title {
	color: var(--the-white) !important;
	font-weight: 600;
}
.mm-listview li a {
	color: var(--the-white) !important;
	font-size: 18px;
}
.mm-listitem::after {
	content: "";
	border-color: var(--the-white) !important;
}

.mm-listitem {
	border-color: var(--the-white) !important;
}
.mm-navbar {
	border-bottom: 1px solid var(--the-white) !important;
}
.mm-btn--next::after, .mm-btn--prev::before {
	border-color: var(--the-white);
}
@media(max-width: 960px){
	.tbm.tbm--mobile .tbm-button, .region-we-mega-menu {
		display: none;
	}
}


.tbm-link.no-link {
    cursor: default;
}

.tbm-link.no-link:hover + .tbm-submenu {
    display: block; 
}

/* Menu Media Quries */
/* 
@media (min-width: 1326px) {
	#main-navigation-inner-h {
		margin-left: 335px !important;
	}
}

@media (min-width: 1360px) and (min-height: 768px) {
	#main-navigation-inner-h {
		margin-left: 342px !important;
	}
}

@media (min-width: 1366px) and (min-height: 768px) {
	#main-navigation-inner-h {
		margin-left: 370px !important;
	}
}

@media (min-width: 1400px) and (min-height: 726px) {
	#main-navigation-inner-h {
		margin-left: 25.4% !important;
	}
}

@media (min-width: 1440px) and (min-height: 900px) {
	#main-navigation-inner-h {
		margin-left: 540px !important;
	}
}

@media (min-width: 1532px) and (min-height: 600px) {
	#main-navigation-inner-h {
		margin-left: 26.4% !important;
	}
}

@media (min-width: 1600px) and (min-height: 900px) {
	#main-navigation-inner-h {
		margin-left: 536  px !important;
	}
}

@media (min-width: 1680px) and (min-height: 1050px) {
	#main-navigation-inner-h {
		margin-left: 454px !important;
	}
}

@media (min-width: 1920px) and (min-height: 1080px) {
	#main-navigation-inner-h {
		margin-left: 540px !important;
	}
} */

/* Apply Form */

#webform-submission-apply-now-node-94-add-form {
	background: var(--the-gray);
	padding: 30px;
	width: 60%;
	margin-right: auto;
	margin-left: auto;
	border-radius: 10px;
}

@media(max-width:600){
	#webform-submission-apply-now-node-94-add-form {

		width: 100%;
	}
}


#webform-submission-qupa-reducing-balance-calculator-add-form, #webform-submission-qupa-fixed-interest-calculator-add-form {
	width: 80%;
	margin-right: auto;
	margin-left: auto;
	background: var(--the-gray);
	padding: 60px 40px;
}

/* Columns */


@media(min-width:800px){
	.ck-widget.g-0.no-gutters.row {
    display: flex;
    margin: 40px 0;
}
}
.col.req-img {
    margin-right: 30px;
	clear: both;
}

.col.req-img img {
    max-height: 600px;
    border-radius: 8px;
}



/* Responsive Code */

@media(max-width: 1480px) {

	.top-menu ul li a {
		font-size: 14px !important;
	}

	#tbm-internet-banking .tbm-link {
		padding: 10px 15px !important;
		font-size: 0.7em;
		font-weight: 400;
	}
	.search-slide-inner, .header-inner, .main-navigation-inner-h, .welcome-text-inner, .highlighted-inner, .top-container-inner, .page-title-inner, .main-container-inner, .bottom-container-inner, .footer-container-inner, .footer-menu-inner, .copyright-inner {
		max-width: 90% !important;
	}

	#tbm-the-main-menu .tbm-link.level-1 {
		padding: 1rem 15px;
		font-size: 14px;
		font-weight: 400;
	}
}

@media(max-width: 1200px) {
	.banking-services {
		grid-template-columns: 1fr;

	}

	.account-wrap {
		min-height: 350px;
	}

	.view-accounts .view-content .views-field-field-image-account img {
		border-radius: 12px;
		height: 350px;
	}

	.account-title {
		font-size: 25px;
		line-height: 1.2;
	}
}

@media(max-width: 600px){
	.the-links {
	flex-wrap: wrap;
	}
}


/* Mobile Slider Code */

#block-drupal8-w3css-subtheme-views-block-slider-block-2-2 {
	display: none;
  }
  
  @media (max-width: 600px) {
	html.js {
	  overflow-x: hidden;
	}
	.slider-links-flex {
	  padding-top: 110px;
	}
	#flexslider-1 {
	  display: none;
	}
  
	#block-drupal8-w3css-subtheme-views-block-slider-block-2-2 {
	  display: block;
	}
  
	.bg-cap {
	  font-size: 2em;
	  max-width: 100%;
	  line-height: 1.3;
	}
  
	.sldr-img {
	  position: relative;
	}
  
	.sldr-img::before {
	  content: "";
	  left: 0;
	  width: 100%;
	  height: 100%;
	  background: rgba(0, 0, 0, 0.2);
	  position: absolute;
	}
  }