html *{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
body, html {
  /* prevent horizontal scrolling */
  overflow-x:hidden;
  background:#e6e6e6;
}
img{vertical-align:middle;}
a{text-decoration:none;}
p{line-height:24px;text-align:justify;}

.index{background:url(../images/body-bg.jpg) no-repeat top center;
  /*-webkit-background-size:cover;
     -moz-background-size:cover;
      -o-background-size: cover;
         background-size: cover;*/
}
.inner{background:url(../images/body-bg.jpg) no-repeat 100% -450px;}

body h1,body h2,body h3,p{margin:0!important;padding:0!important;}

body.overflow-hidden {
  /* used when modal is visible */
  overflow:hidden;/*-webkit-overflow-scrolling:touch;*/
  position:fixed;
  width:100%;  
}

small{font-size:70%!important;}

#top-level{height:150px;border-bottom:3px solid rgba(255,255,255,0.4);padding-top:60px;}
header > #top-level h1{font-size:32px;letter-spacing:-1px;line-height:28px;width:250px;}
header > #top-level h2{width:75px;height:75px;text-indent:-9999px;background:url(../images/bank-logo.png)no-repeat center center;margin-top:-20px;top:45px;right:0;}

#banner-level{height:460px;padding-top:30px;overflow:hidden;}
header > #banner-level h1{font-size:60px;line-height:70px;width:100%;color:#fff;}
header > #banner-level h1::after{content:"";height:10px;width:100%;display:block;}
header > #banner-level h2{font-size:36px;line-height:50px;color:#fff;width:100%;}

nav{display:inline-block;margin-left:60px;width:540px;margin-top:-11px;}
nav ul{list-style:none;margin:0;padding:0;}
nav ul li{margin:0;l/*ine-height:13px;*/list-style-type:none;
  /*relative positioning for list items along with overflow hidden to contain the overflowing ripple*/
  position:relative;
  overflow:hidden;
  transition:0.5s ease all; 
  -moz-transition:0.5s ease all; 
  -webkit-transition:0.5s ease all;}
nav ul li:hover{background:rgba(255,255,255,0.15);border-radius:2px;-webkit-border-radius:2px;}
nav a{font-weight:300;font-size:20px;letter-spacing:-1px;color:#fff;display:block;padding:14px;text-decoration:none;cursor:pointer; /*since the links are dummy without href values*/
}
.ripple{overflow:hidden;}
.ripple-effect{position:absolute;border-radius:50%;width:50px;height:50px;background:hsl(20, 100%, 60%);-webkit-animation:ripple-animation 2s;animation:ripple-animation 2s;}
@-webkit-keyframes ripple-animation {
    from {
      -webkit-transform: scale(1);
              transform: scale(1);
      opacity: 0.4;
    }
    to {
      -webkit-transform: scale(100);
              transform: scale(100);
      opacity: 0;
    }
}
@keyframes ripple-animation {
    from {
      -webkit-transform: scale(1);
              transform: scale(1);
      opacity: 0.4;
    }
    to {
      -webkit-transform: scale(100);
              transform: scale(100);
      opacity: 0;
    }
}

.spinner {margin:5px 0 0;
  -webkit-animation: rotator 1.4s linear infinite;
          animation: rotator 1.4s linear infinite;
}
@-webkit-keyframes rotator {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(270deg);
            transform: rotate(270deg);
  }
}
@keyframes rotator {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(270deg);
            transform: rotate(270deg);
  }
}
.path {
  stroke-dasharray: 187;
  stroke-dashoffset: 0;
  -webkit-transform-origin: center;
      -ms-transform-origin: center;
          transform-origin: center;
  -webkit-animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
          animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
}
@-webkit-keyframes colors {
  0% {
    stroke: #4285F4;
  }
  25% {
    stroke: #DE3E35;
  }
  50% {
    stroke: #F7C223;
  }
  75% {
    stroke: #1B9A59;
  }
  100% {
    stroke: #4285F4;
  }
}
@keyframes colors {
  0% {
    stroke: #4285F4;
  }
  25% {
    stroke: #DE3E35;
  }
  50% {
    stroke: #F7C223;
  }
  75% {
    stroke: #1B9A59;
  }
  100% {
    stroke: #4285F4;
  }
}
@-webkit-keyframes dash {
  0% {
    stroke-dashoffset: 187;
  }
  50% {
    stroke-dashoffset: 46.75;
    -webkit-transform: rotate(135deg);
            transform: rotate(135deg);
  }
  100% {
    stroke-dashoffset: 187;
    -webkit-transform: rotate(450deg);
            transform: rotate(450deg);
  }
}
@keyframes dash {
  0% {
    stroke-dashoffset: 187;
  }
  50% {
    stroke-dashoffset: 46.75;
    -webkit-transform: rotate(135deg);
            transform: rotate(135deg);
  }
  100% {
    stroke-dashoffset: 187;
    -webkit-transform: rotate(450deg);
            transform: rotate(450deg);
  }
}
@-webkit-keyframes inputHighlighter {
  from { background:#5264AE; }
  to  { width:0; background:transparent; }
}
@-moz-keyframes inputHighlighter {
  from { background:#5264AE; }
  to  { width:0; background:transparent; }
}
@keyframes inputHighlighter {
  from { background:#5264AE; }
  to  { width:0; background:transparent; }
}

#body-content{border:2px solid #d6d6d6;min-height:330px;background:#fff;}
#body-content div.four.columns{width:33.33%!important;}

.flex{display:flex;align-items:stretch;flex: 1 100%;flex-direction:row;}
.flex div{flex-grow:1;}

.swiper-container-horizontal > .swiper-pagination{bottom:160px!important;}

.b2-r{border-right:2px solid #d6d6d6;}
.b2-b{border-bottom:2px solid #d6d6d6;}

.flag,.ladies,.mobile{height:166px;padding:30px 50px 10px;}

.flag img.fit{width:auto!important;height:130px!important;}
.ladies img.fit{width:220px!important;height:auto!important;}
.mobile img.fit{width:160px;margin-left:-60px;}
.mobile span{border-radius:15px;background:#dc4a1e;width:60px;height:60px;top:95px;right:67px;}
.mobile span span{border-radius:8px;background:#fff;width:32px;height:32px;top:14px;right:14px;}

footer ul li{list-style:none;float:left;margin:0 15px 0;}
footer > .columns{height:45px;line-height:45px;margin-top:20px;margin-bottom:35px;}
footer{position:relative;z-index:400;}

.white{color:#fff;}
.green{color:#17702d;}
.grey{color:#4a4a4a;}

.smallest{font-size:9px;}
.smaller{font-size:10px;}
.small{font-size:11px;}
.medium{font-size:13px;}
.large{font-size:15px;}
.larger{font-size:16px;}
.largest{font-size:18px;}
.x-large{font-size:26px;}
.xx-large{font-size:30px;}
.spaced{letter-spacing:1px;}

.center {text-align:center!important;}

.no-margin{margin:0!important;}
.no-ml{margin-left:0!important;}
.mt10{margin:10px 0 0;}
.m15b{margin-bottom:15px!important;}
.m20t{margin-top:20px!important;}
.m25-r{margin-right:25px!important;}
.ml4p{margin-left:4%!important;}
.p60-r{padding-right:60px;}
.p40-b{padding-bottom:40px;}
.pad{padding:0px 20px!important;}
.p35-b{padding-bottom:35px!important;}
.p20{padding:20px!important;}

.auto-width{width:auto!important;}
.relative{overflow:hidden;position:relative;}
.absolute{position:absolute;}
.fixed{position:fixed;}

.block{display:block;clear:both;}

.button {display:inline-block;position:relative;border-radius:2px;cursor:pointer;overflow:hidden;}
.button.border8{border:8px solid rgba(255,255,255,0.3);}
.button.pad-a{padding:8px 30px;}
.button.pad-b{padding:16px 20px;}

.button.border2{border:2px solid rgba(255,255,255,0.3);padding:10px 20px;}
.button.bg{background-color:#188E39;}
.button.bg::after{content: ' ';
    display:block;
    position:absolute;
    left:-10px;
    top:-10px;
    width:200%;
    height:200%;
    z-index:1;
    opacity:0.4;
    background:url('../images/wave-pattern.png') no-repeat 100%;
    -ms-background-size: cover;
    -o-background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;}
.button p {position:relative;z-index:2;}
#map-canvas {width:100%;height:300px;margin-bottom:30px;}

.thin{font-weight:300;}
.light{font-weight:400;}
.bold{font-weight:500;}
.bolder{font-weight:600;}
.x-bold{font-weight:700;}
.xx-bold{font-weight:800;}

.visuallyhidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;}
.only-mobile{display:none;}

.cd-modal .cd-modal-content .card {width:100%;height:100%;border:1px solid #4a4a4a;background:#f4f4f4;box-shadow:0 1px 3px rgba(0,0,0,0.3), 0 1px 2px rgba(0,0,0,0.35);
-webkit-transition:all 250ms;
   -moz-transition:all 250ms;
        transition:all 250ms;
}
.card:hover{box-shadow:0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
/*-webkit-transform: translateY(-5px);
   -moz-transform: translateY(-5px);
        transform: translateY(-5px);
*/}

.layout{background:url(../images/login-bg.jpg);
  -webkit-background-size:cover;
     -moz-background-size:cover;
      -o-background-size: cover;
         background-size: cover;
}
.layout img{padding-top:15px;float:right;padding-right:15px;}

.truncate {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


















/*body:not(.index) .row{background:#fff;}
*/.row.footer{padding-top:8px;}

.breadcrumbs{font-size:12px;height:48px;border-top:1px solid #632272;border-bottom:1px solid #632272;line-height:48px;padding-left:150px;}
.showmenuwrapper{position:absolute;z-index:60000;left:8px;top:12px;margin:0 auto;overflow:hidden;width:90px;cursor:pointer;
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  -khtml-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;
}
.showmenuwrapper h2{float:left;font-size:15px;font-weight:500;margin-top:10px;color:rgb(99, 34, 114);letter-spacing:3px;}

.hamburger {top:-2px;
  list-style:none;
  float:left;
  margin:0;
  padding:10px 0;
  position:relative;
  left:10px;
  -moz-transition:all 233ms cubic-bezier(0.5, 0, 0, 1);
  -o-transition:all 233ms cubic-bezier(0.5, 0, 0, 1);
  -webkit-transition:all 233ms cubic-bezier(0.5, 0, 0, 1);
  transition:all 233ms cubic-bezier(0.5, 0, 0, 1);
}
.hamburger li {
  width:24px;
  height:2px;
  background:#632272;
  margin:4px 0 0;
  padding:0;
  -moz-transform:translate3d(0, 0, 0);
  -ms-transform:translate3d(0, 0, 0);
  -webkit-transform:translate3d(0, 0, 0);
  transform:translate3d(0, 0, 0);
  -moz-transition:all 333ms cubic-bezier(0.5, 0, 0, 1);
  -o-transition:all 333ms cubic-bezier(0.5, 0, 0, 1);
  -webkit-transition:all 333ms cubic-bezier(0.5, 0, 0, 1);
  transition:all 333ms cubic-bezier(0.5, 0, 0, 1);
}

.checked .hamburger li.first {
  -moz-transform:rotate(-135deg) translateY(-8.5px);
  -ms-transform:rotate(-135deg) translateY(-8.5px);
  -webkit-transform:rotate(-135deg) translateY(-8.5px);
  transform:rotate(-135deg) translateY(-8.5px);
}
.checked .hamburger li.second {
  filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity:0;
}
.checked .hamburger li.third {
  -moz-transform:rotate(135deg) translateY(8.5px);
  -ms-transform:rotate(135deg) translateY(8.5px);
  -webkit-transform:rotate(135deg) translateY(8.5px);
  transform:rotate(135deg) translateY(8.5px);
}

.group{ 
  position:relative; 
  margin-bottom:35px; 
}
.group input,.group textarea,input{
  font-size:14px;position:relative;z-index:2;
  padding:10px 10px 5px;margin-bottom:1px;
  display:block;
  width:100%;
  border:none;
  border-bottom:1px solid #B0A4C4;
  box-sizing: border-box;outline: none;
  -moz-box-sizing: border-box;
}
.group::before, .group::after{
  content:'';
  display: block;
  position: absolute;
  bottom:1px;
  height: 6px;
  border-left: 1px solid #B0A4C4;
}
.group[errr]::before,.group[errr]::after{border-left:2px solid #d34336;}
.group::before,.group[errr]::before{
  left: 0;
}
.group::after,.group[errr]::after{
  right: 0;
}
.group input:focus,.group textarea { outline:none;background:rgba(246, 177, 100, 0.07); }

.group errora,.group errorb,.group errorc,.group errord,.group errore,.group errorf,.group errorg,.group errorh,.group errori
{position:absolute;width:calc(100% - 10px);letter-spacing:1.5px;left:5px;top:37px;font-size:9px;color:#d34336;font-weight:300;font-style:italic;
  transition:0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55) all;
  -moz-transition:0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55) all;
  -webkit-transition:0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55) all;
  opacity:0;
}

.group errora i,.group errorb i,.group errorc i,.group errord i,.group errore i,.group errorf i,.group errorg i,.group errorh i,.group errori i
{position:absolute;right:5px;top:-22px;width:15px;height:15px;border-radius:50%;float:right;}

.group errora i svg,
.group errorb i svg,
.group errorc i svg,
.group errord i svg,
.group errore i svg,
.group errorf i svg,
.group errorg i svg,
.group errorh i svg,
.group errori i svg
{fill:#d34336;}

.group[errr] .float-label{color:#d34336!important;}
/*.group[errr] .form-control{border-bottom:1px solid #d34336!important;}
.group[errr] .form-control:focus{border-bottom:2px solid #d34336!important;}*/
.group[errr] errora,
.group[errr] errorb,
.group[errr] errorc,
.group[errr] errord,
.group[errr] errore,
.group[errr] errorf,
.group[errr] errorg,
.group[errr] errorh,
.group[errr] errori
{opacity:1;}

.button.raised {
  transition:all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  transition-delay:0.2s;
  box-shadow:0 2px 5px 0 rgba(0, 0, 0, 0.26);
}
.button.raised:hover {
  box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.button.raised:active {
  box-shadow:0 8px 17px 0 rgba(0, 0, 0, 0.2);
  transition-delay:0s;
}
.button.raised.disabled{box-shadow:none!important;cursor:default!important;}
.button.raised.blue{background:#29b6f6;}
.button.blue:hover{background:#0091ea;color:#fff;}
   
/* LABEL ======================================= */
label{
  color:#1083CA;z-index:1;
  font-size:14px;
  font-weight:normal;
  position:absolute;
  pointer-events:none;
  left:10px;
  top:10px;
  transition:0.2s ease all; 
  -moz-transition:0.2s ease all; 
  -webkit-transition:0.2s ease all;
}

input.cid{color:transparent;border:0!important;cursor:pointer;}
input.cid ~ i{position:absolute;left:95px;top:7px;width:32px;height:32px;text-align:center;cursor:pointer;}
input.cid ~ i.fa-angle-down:before{vertical-align:-webkit-baseline-middle;}
input.cid ~ label{font-weight:600;padding-left:32px;width:130px;float:left;margin-top:-35px;}
input.cid ~ img{position:absolute;top:8px;left:10px;}

/* active state */
input:focus:not(.cid) ~ label,input:valid ~ label,textarea:focus ~ label,textarea:valid ~ label{
  top:-20px;left:5px;
  font-size:10px;font-weight:600;
  color:#1083CA;
}
/* BOTTOM BARS ================================= */
.bar  { position:relative; display:block; width:100%; }
.bar:before, .bar:after   {
  content:'';
  height:2px; 
  width:0;
  bottom:1px; 
  position:absolute;
  background:#1083CA; 
  transition:0.2s ease all; 
  -moz-transition:0.2s ease all; 
  -webkit-transition:0.2s ease all;
}
.bar:before {
  left:50%;
}
.bar:after {
  right:50%; 
}

/* active state */
input:focus ~ .bar:before, input:focus ~ .bar:after,textarea:focus ~ .bar:before, textarea:focus ~ .bar:after {
  width:50%;
}/* HIGHLIGHTER ================================== */
.highlight {
  position:absolute;
  height:60%; 
  width:100px; 
  top:15%; 
  left:0;
  pointer-events:none;
  opacity:0.5;
}

/* active state */
input:focus ~ .highlight,textarea:focus ~ .highlight {
  -webkit-animation:inputHighlighter 0.3s ease;
  -moz-animation:inputHighlighter 0.3s ease;
  animation:inputHighlighter 0.3s ease;
}

/* ANIMATIONS ================ */
@-webkit-keyframes inputHighlighter {
  from { background:#5264AE; }
  to  { width:0; background:transparent; }
}
@-moz-keyframes inputHighlighter {
  from { background:#5264AE; }
  to  { width:0; background:transparent; }
}
@keyframes inputHighlighter {
  from { background:#5264AE; }
  to  { width:0; background:transparent; }
}

.has-error{background:transparent!important;border-bottom:2px solid #E40E2F!important;margin-top:-1px;}

input[type=text]{text-transform:capitalize;}
button{display:inline-block;padding:0;
  color:#555;
  text-align:center;
/*  font-size:11px;
*/  letter-spacing:.1rem;
  text-decoration:none;
  border:none;
  cursor:pointer;
  box-sizing:border-box;outline:0;}