@import 'animate.css';

/* body style */
/* @charset "utf-8"; */
body {
	font-family: "LatoWeb";
	font-style: normal;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
    letter-spacing: 0.32px;
}

section.col-lg-12.navbar-container {
    padding: 0;
    background-color: #fff;
    position: fixed;
    z-index: 1020;
}

.bodyContainer{
    background-image: url(../images/faviconNew.png);
    background-color: #fff;
    /* background: url("../images/faviconNew.png"), lightgray 50% / cover no-repeat, #FAFAFA; */
    background-position: center;
    background-size: 100%;
    height: 100%;
}

section.content-container.d-inline-block {
    padding-top: 5px;
}

hr.navbg{
    background: rgb(255,130,0);
    background: linear-gradient(90deg, rgba(255,130,0,.15) 30%, rgba(255,0,43,.15) 90%);
    height: 1px;
    margin: 0;
    width: 100%;
}

a.navbar-brand img {
    height: 24px;
}

label.userStatus{
    font-size: 16px;
    font-family: 'LatoWebSemibold';
    line-height: 18px;
    display: inline-flex;
    padding: 6px 12px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 3px;
    border: 1px solid var(--CMB-Gradient-Light, #FF8200);
}

/* side menu */
nav.navbar.navbar-expand-lg.navbar-light.bg-light.d-inline-block {
    position: fixed;
}

nav.aopMenu ul.navbar-nav .active > .nav-link{
    border-bottom: 1px solid var(--Border-Gradient, #FF8200);
    color: #000;
    background: var(--CMB-Gradient-Light, linear-gradient(90deg, rgba(255, 130, 0, 0.10) 30%, rgba(255, 0, 43, 0.10) 90%));
}

nav.aopMenu.navbar.navbar-expand-lg.navbar-light.d-block {
    padding: 0;
}

nav.aopMenu ul.navbar-nav.mr-auto.d-inline {
    width: 100%;
}

nav.aopMenu ul.navbar-nav li.nav-item {
    text-align: center;
    color: #000;
    text-align: center;
    font-family: 'LatoWebBold';
    font-size: 14px;
    font-style: normal;
    line-height: normal;    
}

nav.aopMenu ul.navbar-nav li.nav-item  a{
    padding: 0.82rem 0.25rem;
    color: #000;
    border-bottom: 1px solid var(--Border-Gradient, #FF8200);
    background-color: #fff;
}

nav.aopMenu ul.navbar-nav li.nav-item  a:hover, nav.aopMenu ul.navbar-nav li.nav-item  a:focus{
    background: var(--CMB-Gradient-Light, linear-gradient(90deg, rgba(255, 130, 0, 0.10) 30%, rgba(255, 0, 43, 0.10) 90%));
    color: #000;
}

div#navbarSupportedContent {
    position: fixed;   
    max-width: 11%;
    width: 140.78px;
    background: #FFF;
    box-shadow: 0px 4px 24px -1px rgba(0, 0, 0, 0.10);
   
}

p.otpText{
    color: #212529;
    font-family: 'LatoWeb';
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px; /* 127.273% */
}

p.otpText span{
    color: #212529;
    font-family: 'LatoWebBold';
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px; /* 127.273% */
}

/* card style */

.AcctSection a:hover, .AcctSection a:focus{
    text-decoration: none;
}

a .card.cardRadius24{
    box-shadow: 0px 1px 7px 0px rgba(0, 0, 0, 0.10);
}

a .card.cardRadius24:hover, a .card.cardRadius24:focus{
    box-shadow: 0px 1px 20px 0px rgba(0, 0, 0, 0.10);
}

.cardRadius15{
    border-radius: 15px;
}

a .card.cardRadius15{
    box-shadow: 0px 1px 7px 0px rgba(0, 0, 0, 0.05);
}

a .card.cardRadius15:hover, a .card.cardRadius15:focus{
    box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.10);
}

a .card.cardRadius24 .card-body h3.card-title{
    color: #1A1A1A;
    font-family: 'LatoWebHeavy';
    font-size: 24px;
    font-style: normal;
    font-weight: 800;
    line-height: 28px; /* 116.667% */
    letter-spacing: inherit;
}

.card img.card-img-left {
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
    height: 80px;
}

.downloadSection a .card.cardRadius15 .card-body h3.card-title{
    color: #1A1A1A;
    font-family: 'LatoWebSemibold';
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px; /* 100% */
    letter-spacing: inherit;
    margin: 0;
}

a .card.cardRadius24 .card-body p.card-text{
    color: #3A3A3A;
    font-family: 'LatoWebMedium';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 150% */
    letter-spacing: inherit;
}

.card.corpBg{
    background: var(--transparent-gradient, linear-gradient(90deg, rgba(255, 130, 0, 0.15) 0%, rgba(255, 0, 43, 0.15) 111.11%));
}


/* Footer Section */

footer.footerbg{
    background-color: #000;
    padding-top: 10px;
    padding-bottom: 10px;
    color: #fff;
    min-height: 70px;
    
}

footer .footer-mobile p{
    color: #FFF;
    text-align: center;
    font-family: 'LatoWeb';
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px; 
}

.footercontainer p {
    font-size: 12px;
    margin: 0 auto;
    padding-top: 12px;
}

.footercontainer p a {
    color: red;
    text-decoration: none;
}

/* Homepage */
h1.banner-text{
    color: #383E44;
    font-family: 'LatoWebBlack';
    font-size: 36px;
    font-style: normal;
    font-weight: 800;
    line-height: 60px;
    letter-spacing: 2px;
}

h1.banner-text > span{
    color: #212529;
    font-size: 36px;
    font-weight: 800;
    line-height: 50px;
    letter-spacing: 1.08px;
    font-family: 'LatoWebBlack';
    letter-spacing: 0.32px;
}

.bannerText-container{
    vertical-align: middle;
    height: 100%;
    align-self: center;
}

.bannerText-container p{
    color: #3A3A3A;
    font-family: 'LatoWebMedium';
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px; /* 177.778% */
    letter-spacing: 0.54px;
}

.bannerText-container p a{
    color: #FF8200;
}

.bannerText-container p i{
    color: #3A3A3A;
    font-family: "LatoWeb";
    font-size: 16px;
    font-style: italic;
    font-weight: 400;
    line-height: 32px; /* 200% */
    letter-spacing: 0.48px;
}


/* Rapid Account Opening */

.headerText-container{
    background: #F8F8F8;
    padding-bottom: 5px;
}

.headerText-container>h2{
    color: #212529;
    font-family: 'LatoWebSemibold';
    font-size: 28px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px; 
    letter-spacing: 0.32px;
}

.headerText-container h4{
    color: #8C8989;
    font-family: 'LatoWebMedium';
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 10px; 
    letter-spacing: 0.32px;
}

/* button styles */
button#dropdownMenuButton::after {
    display: none;
}

button.sec-btn {
    display: inline-flex;
    height: 40px;
    padding: 7px 24px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    border-radius: 5px;
    border: none;
    background: #1E1E1E;
    box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.15);
    color: #fff;
    font-family: "LatoWebMedium";
    font-size: 15px;
    cursor: pointer;
    font-style: normal;
    font-weight: 800;
    line-height: 30px;
    text-transform: capitalize;
    letter-spacing: 0.92px;
}

button.sec-btn:hover, button.sec-btn:focus{
    background: #3b3b3b;
}

button#dropdownMenuButton {
    box-shadow: none;
    border-radius: 0;
    font-weight: normal;
    font-size: 14px;
    padding: 5px 20px;
    height: auto;
    line-height: 22px;
    text-transform: uppercase;
}

.accent-btn{
    color: #000;
    height: 40px;
    padding: 7px 24px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    border-radius: 5px;
    border: none;
    border: 1px solid var(--Border-Gradient, #FF8200);
    background: #FCFCFC;
    box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.15);
    font-family: "LatoWebMedium";
    font-size: 15px;
    cursor: pointer;
    font-style: normal;
    font-weight: 800;
    line-height: 27px;
    text-transform: capitalize;
    letter-spacing: 0.92px;
}

.accent-btn:hover, .accent-btn:focus{
    background:var(--CMB-Gradient-Light, linear-gradient(90deg, rgba(255, 130, 0, 0.10) 30%, rgba(255, 0, 43, 0.10) 90%));
    border: 1px solid var(--Border-Gradient, #FF8200);
    outline: none;
}

.Primary-btn{
    color: #fff;
    height: 40px;
    padding: 7px 16px 7px 12px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    border-radius: 5px;
    border: none;
    background: var(--CMB-Gradient-Thick, linear-gradient(90deg, #FF8200 30%, #FF002B 90%));
    box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.15);
    font-family: "LatoWebMedium";
    font-size: 15px;
    cursor: pointer;
    font-style: normal;
    font-weight: 800;
    line-height: 30px;
    text-transform: capitalize;
    letter-spacing: 0.92px;
}

button.Primary-btn:hover, button.Primary-btn:focus {
    background: var(--CMB-Gradient-Thick, linear-gradient(90deg, rgba(255, 130, 0, 0.85) 30%, rgba(255, 0, 43, 0.85) 90%));
    border: none;
    outline: none;
    color: #fff;
}

/* checkbox style */
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
    background-image: url(/asset/images/tick.svg);
}

.custom-control-label::after {
    top: 0.15rem;
    left: 0.25em;
    background-size: 100% 100%;
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #fff;
}

.custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.15);
}

.custom-control-label {
cursor: pointer;
}

label.lebelText{
    font-size: 16px;
    font-style: normal;
    font-family: 'LatoWebSemibold';
    font-weight: 600;
    line-height: 28px; /* 155.556% */
    color: #212529;
}

.textGradient{
    background: var(--Button-style, linear-gradient(90deg, #FF8200 0%, #FF002B 111.11%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: "LatoWebMedium";
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: 18px; /* 186.667% */
    letter-spacing: 0.45px;
}

p.modal-text{
    color: #1A1A1A;
font-family: 'LatoWebMedium';
font-size: 15px;
font-style: normal;
font-weight: 500;
line-height: 18px;
letter-spacing: 0.45px;
}

.modalHeader{
    color: #000;
    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    font-family: 'LatoWebBlack';
    font-size: 24px;
    font-style: normal;
    font-weight: 800;
    line-height: 35px; /* 145.833% */
    letter-spacing: 1.2px;
}

p.modalInfo{
    color: #6A6A6A;
    font-family: 'LatoWeb';
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 21px; /* 175% */
    letter-spacing: 0.36px;
}


hr.divider{
    border-top: 1px solid rgba(0, 0, 0, 0.10);
    background: linear-gradient(90deg, #FF8200 30%, #FF002B 90%);
    height: 1px;
}

/* form styles */
.formContainer{
    background: #FFF;
    box-shadow: 0px 6px 30px 0px rgba(0, 0, 0, 0.03);
    border-radius: 24px;
}

.formContainer .form-group.mb-5 {
    margin-bottom: 2.2rem !important;
}

.formContainer input[type=text],.formContainer input[type=email],.formContainer input[type=number],
.formContainer select,
.formContainer input[type=date] {
    border-radius: 5px;
    background: #fbfbfb;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.05);
    border: none;
    margin: 0;
    color: #000;
    font-family: "LatoWebMedium";
    font-size: 14px;
    letter-spacing: 0.32px;
}

.form-group label{
    font-size: 14px;
}

input[type=text],input[type=email],input[type=number],input[type=date],
select {
    background-color: #f8f8f8;
    border: none;
    color: #0d0d0d;
    padding: 14px 26px;
    text-decoration: none;
    display: inline-block;
    font-size: 13px;
    margin: 5px;
    width: 100%;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 0;
    height: 45px;
}

input[type=text]:focus,
input[type=text]:focus-visible,
input[type=date]:focus,
input[type=date]:focus-visible,
input[type=number]:focus,
input[type=number]:focus-visible,
input[type=email]:focus,
input[type=email]:focus-visible,
textarea.w-100:focus,
textarea.w-100:focus-visible,
select:focus,
select:focus-visible {
    background-color: #fff;
    border-radius: 5px;
    outline: none;
    border-bottom: 2px solid red;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.05);
}

input[type=text]::placeholder,input[type=email]::placeholder,input[type=number]::placeholder,input[type=date]::placeholder, .form-control select::placeholder, textarea::placeholder {
    color: #A1A1A1;
    font-family: "LatoWebMedium";
    font-size: 14px;
    font-style: normal;
    line-height: normal;
}

#disabled input[type=text]::placeholder, #disabled input[type=email]::placeholder,#disabled input[type=number]::placeholder, #disabled input[type=date]::placeholder,  #disabled .form-control select::placeholder, #disabled textarea::placeholder {
    color: #000;
    font-family: "LatoWebBold";
    font-size: 14px;
    font-style: normal;
    line-height: normal;
}

.form-control:disabled, .form-control[readonly], input[type=text]:disabled, input[type=email]:disabled,input[type=number]:disabled,input[type=date]:disabled, .form-control select:disabled, textarea:disabled{
    color: #000;
    background-color: #f4f4f4;
}

.form-control select:focus {
    background-color: #fff;
    border-radius: 5px;
    outline: none;
    border-bottom: 2px solid red;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.05);
}

.formContainer input,
.formContainer select {
    font-size: 14px;
    font-weight: lighter;
    letter-spacing: 0.32px;
}

textarea.w-100 {
    padding-top: 10px;
    padding-left: 15px;
    border-radius: 5px;
    background: #FFF;
    box-shadow: 1px 2px 4px 0px rgba(22, 23, 23, 0.10);
    border: 0;
}

.formContainer h3 {
    text-transform: capitalize;
    color: #DC3545;
    font-size: 17px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    font-family: "LatoWebBold";
}

.formContainer #accordion .card p {
    color: #6a6a6a;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 36px;
    font-family: "LatoWebMedium";
    margin: 0;
}

.formContainer p.loginText {
    color: #1e1e1e;
    font-size: 14px;
    width: 80%;
}

.formLoginBtn input {
    color: #fff;
    background: rgb(255, 130, 0);
    background: linear-gradient(90deg, #ff8200 30%, rgba(255, 0, 43, 1) 90%) !important;
    background-image: none;
    border-color: rgb(255, 130, 0);
    padding: 8px 30px;
    border-radius: 7px;
    box-shadow: 0 2px 5px rgb(0 0 0 / 15%);
    font-weight: 500;
    font-size: 13px;
    text-transform: uppercase;
    border-style: hidden;
    cursor: pointer;
    cursor: pointer;
}

.formContainer #accordion .card-header{
    background-color: transparent;
    padding-left: 0;
}

.formContainer #accordion .card-header h5 button.btn-link:before{
    content: "\f107";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    float: right;
}

.formContainer #accordion .card-header h5 button.btn-link.collapsed:before {
    content: "\f106";
  }

 .formContainer #accordion .card-header h5 button.btn-link {
    width: 100%;
    display: contents;
    color: #212529;
    font-family: "LatoWebBold";
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px; 
    letter-spacing: 0.52px;
    text-shadow: 1px 2px 4px rgba(22, 23, 23, 0.10);
}

.formContainer #accordion .card-header h5 button.btn-link:hover,  .formContainer #accordion .card-header h5 button.btn-link:focus{
    color: rgba(255,130,0,1);
}

a#dropdownMenuLink.rapidDropdown{
    display: inline-flex;
    padding: 11px 24px;
    justify-content: center;
    align-items: center;
    gap: 12px;
    border-radius: 4px;
    border: 1px solid var(--Border-Gradient, #FF8200);
    background: rgba(251, 251, 251, 0.73);
    box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.15);
    color: #000;
    font-family: 'LatoWebSemibold';
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-transform: capitalize;
}

a#dropdownMenuLink.rapidDropdown:hover, a#dropdownMenuLink.rapidDropdown:focus{
    background: #fff;
    text-decoration: none;
}

.formContainer .dropdown-menu.show{
    border-radius: 7px;
    background: #FFF;
    padding: 0;
    border: none;
    box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.15);
}

.formContainer a.dropdown-item{
    padding: 12px 20px;
    font-size: 14px;
}

.formContainer a.dropdown-item:first-child{
    border-bottom: 1px solid rgba(204, 204, 204, 0.25);
}

#accordion .card-header{
    border-bottom: 1px solid;
    border-image: linear-gradient(45deg, rgba(255,130,0,1) 30%, rgba(255,0,43,1)) 1;
}

.custom-control-label::before {
    position: absolute;
    top: -0.15rem;
    left: 0;
    display: block;
    width: 25px;
    height: 25px;
    flex-shrink: 0;
    pointer-events: none;
    content: "";
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border-radius: 5px;
    border: 0.7px solid var(--Button-style, #FF8200);
    background: #FFF;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.05);
}

select.form-control:focus {
    color: #a1a1a1;
    background-color: #fff;
    border-color: transparent;
    outline: 0;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.05);
}

select.form-control.dropdown-menu a.dropdown-item{
    background-color: red;
    font-size: 14px;
    text-transform: capitalize !important;
    padding: 14px 26px;
}

.docCard{
    background: #FBFBFB;
}

.docCard {
    background: #FBFBFB;
    padding-bottom: 60px;
    padding-top: 30px;
}

.statusCard{
    padding: 30px 24px 60px;
}

#accordion .card.custDetailCard{
    margin-bottom: 24px;
}

#accordion .card.custDetailCard .custom-control-label::after {
    top: 0.55rem;
    left: 0.25em;
}

.documentUploads .col-lg-5.col-sm-5.col-5 {
    padding-left: 0;
}

.row.rowBorderBottom .col-lg-5.col-sm-5.col-5 {
    padding-left: 0;
}


/* table style */
.statusCard .table thead th{
    padding-left: 0;
    border-bottom: 1px solid #CCCCCC40;
    border-top: none;
    text-transform: capitalize;
    color: #DC3545;
    font-size: 17px;
    font-style: normal;
    font-weight: 700;
    line-height: 35px;
    font-family: "LatoWebBold";
}

.statusCard .table th, .statusCard .table td {
    min-width: 100px;
}

.statusCard .table td {
    padding-left: 0;
    color: #111;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    font-family: "LatoWeb";
}

.statusCard .table td.text-bold{
    font-weight: 700;
}

div.dataTables_wrapper div.dataTables_filter input {
    margin-left: 0.5em;
    display: inline-block;
    width: auto;
    border-radius: 5px;
    background: #fdfdfd;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.05);
    border: 1px solid #fdfdfd;
    padding: 10px 26px;
}

/* Text animation */
   
.scrolling-words-container {
    display: flex;
    align-items: center;
    font-size: 2rem;
    font-weight: 600;
  }
  
  .scrolling-words-box {
    height: 4rem;
    /* margin: auto; */
    overflow: hidden;
  }
  .scrolling-words-box ul {
    margin: 0 0.625rem;
    padding: 0;
    animation: scrollUp 4s infinite;
  }
  .scrolling-words-box ul li {
    align-items: center;
    justify-content: flex-end;
    vertical-align: middle;
    height: 23rem;
    list-style: none;
    font-family: 'LatoWebBlack';
    font-size: 36px;
    font-style: normal;
    font-weight: 800;
    line-height: 60px;
    letter-spacing: 2px;
  }
  
  @keyframes scrollUp {
    15%, 25% {
      transform: translateY(-20%);
    }
    40%, 50% {
      transform: translateY(-40%);
    }
    65%, 75% {
      transform: translateY(-60%);
    }
    90%, 100% {
      transform: translateY(-80%);
    }
  }

  /* animated icon */
  .animatedIcon img{
    height: 77px;
  }

  .animatedIcon2 img{
    height: 40px;
    margin-bottom: 16px;
  }

  /* section title */
  .sectionTitle h3{
    color: #1A1A1A;
    text-overflow: ellipsis;
    /* text shadow */
    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    /* section heading */
    font-family: 'LatoWebHeavy';
    font-size: 40px;
    font-style: normal;
    font-weight: 800;
    line-height: 50px; /* 125% */
    letter-spacing: 2px;
  }

  .padUp{
    padding-top: 60px;
  }

  .padDown{
    padding-bottom: 60px;
  }

  .AcctSection{
    background-color: #F9F9F9;
  }

  .downloadSection{
    background-color: #fff;
  }

  .cardRadius24{
    border-radius: 24px;
    border-top-left-radius: 43px;
    border-top-right-radius: 43px;
  }

  a.noTextDecor:hover, a.noTextDecor:focus{
    text-decoration: none;
  }

  section.productSection{
    background: linear-gradient(90deg, rgba(255, 130, 0, 0.02) 0%, rgba(255, 0, 43, 0.02) 111.11%), #FFF;
  }

  section.productSection .card.cardbg{
    border-radius: 15px;
    background: #FCFCFC;
    box-shadow: none;
  }

  section.productSection .card{
    border-radius: 15px;
    box-shadow: none;
    background: transparent;
  }

  section.productSection .card:hover, section.productSection .card:focus{
    background: #fbfbfb;
    box-shadow: none;
  }

  section.productSection .card img{
    width: 67px;
  }

  section.productSection a:hover, section.productSection a:focus{
    text-decoration: none;
  }

  span.readMore{
    color: #FF2800;
    font-family: 'LatoWeb';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 150% */
    letter-spacing: inherit;
  }

  .progressBar img {
    width: -webkit-fill-available;
}

#disabled .form-check {
    padding-left: 2.35rem;
}

/* file input upload style */
.files-area {
    width: 30%;
    margin: 0 auto;
  }
  
  .file-block {
    border-radius: 10px;
    background-color: #fafafa;
    margin: 5px;
    color: initial;
    display: inline-flex;
    padding-left: 5px;
    padding-right: 5px;
  }
  .file-block > span.name {
    padding-right: 10px;
    width: max-content;
    display: contents;
  }

  .lh-50{
    line-height: 50px;
  }

  .lh-60{
    line-height: 60px;
  }
  
  .file-delete {
    display: block;
    width: 24px;
    color: initial;
    background-color: #6eb4ff00;
    font-size: large;
    justify-content: center;
    margin-right: 3px;
    cursor: pointer;
  }
  .file-delete:hover {
    /* background-color: #fff; */
    border-radius: 10px;
    color: #DC3545;
  }
  .file-delete > span {
    transform: rotate(-45deg);
    border: 1px solid red;
    border-radius: 50px;
    padding: 0px 4px;
    color: red;
    cursor: pointer;
    font-size: 14px;
  }

  .file-delete > span:hover,  .file-delete > span:focus{
    color: #DC3545;
  }

  input[type=file]{
    visibility: hidden; position: absolute;
  }

  .form-group a.btn.btn-primary.text-light {
    background-color: #000;
    border: none;
    border-radius: 5px;
    background: #1E1E1E;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.05);
    display: inline-flex;
    padding: 7px 18px;
    justify-content: center;
    align-items: center;
}

.form-group.fileContainer {
    border-radius: 5px;
    background: #FDFDFD;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.05);
    padding: 6px 9px;
}

.rowBorderBottom{
border-bottom: 1px rgba(204, 204, 204, 0.33) solid;
/* padding-top: 15px; */
}

.form-group label>a.btn.btn-primary.text-light {
    border-radius: 2px;
    background: var(--secondary-color, #1A1A1A);
    box-shadow: 0px 1px 9px 0px rgba(0, 0, 0, 0.10);
    color: #FFF ! IMPORTANT;
    font-family: 'LatoWeb';
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: 0.8px;
    border: none;
    padding: 6px 16px 6px 12px;
}

.primaryTextColor{
    color: #ff8200;
}

/* modal content style */
.modal-dialog {
    height: -webkit-fill-available;
}

.modal-content {
    border-radius: 24px;
    background: #FFF;
    box-shadow: 0px 4px 10px 0px rgba(241, 241, 241, 0.15);
}

.modal-content.acctCreationModal{   
    background: url(../images/popupImg.svg);    
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100%;
    background-color: #fff;
}

hr.borderStyle {
    background: rgb(255,130,0);
    background: linear-gradient(90deg, rgba(255,130,0,1) 30%, rgba(255,0,43,1) 90%);
    height: 1px;
    margin: 0;
    width: 100%;
    border: 0;
}

.modal-body.text-center p {
    padding-bottom: 15px;
    color: #1A1A1A;
    text-align: center;
    font-family: "LatoWebBold";
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.modal-body.text-center img{
    font-size: 15px;
}

.modal-body.text-center img {
    height: 60px;
}

button.close:hover, button.close:focus {
    color: red;
    outline: none;
}


/* summary page */
p label.text-bold{
    font-weight: 550;
    color: #000;
    margin: 0;
    line-height: 28px;
}

#collapseOne .card-body.summaryDetail p {
        color: #6a6a6a;
        margin: 0;
        line-height: 28px;
}

/* Joint Account */
.secHeading h2.px-4 {
    color: #e5530c;
    font-size: 28px;
    font-weight: 800;
    font-family: "latoWebBold";
}


/* worklist */
.col.displayItem{
    display: inherit;
}

.gradBorderBottom{    
    border-bottom: 1px solid;
    border-image: linear-gradient(45deg, rgba(255,130,0,1) 30%, rgba(255,0,43,1)) 1;
}

.lineHeight{
    line-height: 45px;
}

#approvalStatus div#example_wrapper .row:first-child{
    display: none;
}

.modal-body.text-left a button img.iconHeight{
    padding-right: 8px;
    margin-top: -5px;
}

 a button img.iconHeight {
    padding-right: 8px;
    margin-top: -5px;
}

.modal-body h6.font-weight-bold.px-3 {
    text-shadow: 1px 2px 4px rgba(22, 23, 23, 0.10);
    font-size: 18px;
    line-height: 28px;
}

td.text-warning{
    color: #eab004;
}

td#textWarningIndicator{
    color: #eab004 !important;
}

td.textDangerIndicator{
    color: #FF002B;
}

img.exportIcon{
    padding-right: 8px;
    margin-top: -5px;
}

.row.rowBorderBottom span {
    font-size: 14px;
}

.card-body table.table thead {
    background-color: transparent;
}

.row.rowBorderBottom img.img-fluid {
    margin-top: -5px;
    height: 44px;
}

.documentUploads h3 {
    color: #DC3545;
    font-family: 'LatoWebBold';
    font-size: 17px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin: 0;
}

.row.formContainer .col-lg-12.pb-4.px-4 {
    padding-bottom: 0px !important;
}

.card.col-lg-12.border-0.statusCard.approvalSection {
    background: #F5F5F5;
}

.card.col-lg-12.border-0.statusCard.approvalSection h5{
    color: #212529;
    font-family: "LatoWebBold";
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: 0.52px;
    text-shadow: 1px 2px 4px rgba(22, 23, 23, 0.10);
}


/* table style */
/* table */

i.bx.bx-show {
    color: red;
}

div#example_info {
    padding: 6px 0 0px 0;
    font-size: 14px;
}

tbody {
    font-size: 12px;
}

table.dataTable thead>tr>th.sorting_asc {
    font-size: 12px;
}

.exportContainer span {
    font-size: 12px;
}

div.dataTables_wrapper div.dataTables_length label {
    font-size: 12px;

}

div.dataTables_wrapper div.dataTables_filter label {
    font-size: 12px;
}

footer.footerbg {
    background-color: #000;
    padding-top: 10px;
    padding-bottom: 10px;
    color: #fff;
}

#containerexample {
    display: none
}

#loadercontainer {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

table thead {
    background-color: #1a1a1a;
    color: #fff;

}

table.dataTable thead>tr>th.sorting {
    font-size: 12px;
}

.home select.exportType {
    text-transform: none;
    width: 11%;
    padding: 6px;
    font-size: 13px;
    border: none;
    box-shadow: 0 2px 5px rgb(0 0 0 / 15%);
    border-radius: 5px;
    height: 31.5px;
}

.home select.exportType option {
    font-size: 13px;
}

table.table-bordered.dataTable tbody td {
    font-size: 14px;
}

table.dataTable th {
    font-size: 12px;
}

div#example_info {
    padding: 18px 0;
}

div#example_filter {
    text-align: right;
}

table#example {
    width: 100%;
}

.badge-success {
    color: #fff;
    background-color: #28a745;
    height: 9px;
    width: 9px;
    border-radius: 50px;
}

.badge-danger {
    color: #fff;
    background-color: #DC3545;
    height: 9px;
    width: 9px;
    border-radius: 50px;
}

.badge-warning {
    color: #fff;
    background-color: #FFC107;
    height: 9px;
    width: 9px;
    border-radius: 50px;
}

.page-link {
    position: relative;
    display: block;
    padding: 0.5rem 0.5rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #000;
    background-color: transparent;
    border: none;
    font-size: 14px;

}

.page-item.disabled .page-link {
    background-color: transparent;
}

#example_previous .page-link:hover {
    color: #fff;
    text-decoration: none;
    background-color: #000;
    border-color: transparent;
}

#example_next .page-link:hover {
    color: #fff;
    text-decoration: none;
    background-color: #000;
    border-color: transparent;
}

.page-link:hover {
    color: red;
    text-decoration: none;
    background-color: transparent;
    border-color: transparent;
}

.page-link:focus {
    box-shadow: none;
}

.page-item:last-child .page-link {
    border-top-left-radius: 7px;
    border-bottom-right-radius: 7px;
    border-top-right-radius: 0;
}

.previous.page-item:first-child .page-link {
    border-top-left-radius: 7px;
    border-bottom-right-radius: 7px;
    border-bottom-left-radius: 0;
}

.page-item.active .page-link {
    z-index: 0;
    color: rgb(255, 130, 0);
    font-weight: 900;
    border-color: transparent;
    background: linear-gradient(90deg, rgba(255, 130, 0, 1) 30%, rgba(255, 0, 43, 1) 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgb(255, 130, 0);
    filter: drop-shadow(1px 1px rgb(255, 130, 0));
}

table.dataTable {
    width: 100% !important;
}

.table th,
.table td {
    border-top: none;
}

table.dataTable.dtr-inline.collapsed>tbody>tr[role="row"]>td:first-child:before {
    background-color: #1e1e1e !important;
}









/********************************************************************************************************************/

/* Mobile screen responsiveness */
@media (min-width: 1200px){
    .formFluid.container {
        max-width: 1086px;
    }
}

@media(max-width:1076px){
    div#navbarSupportedContent {
        max-width: 12%;
        width: 140.78px;
    }
}

@media(max-width:1024px){
    h1.banner-text{
        font-size: 38px;
        line-height: 45px; 
    }
    
    h1.banner-text > span{
        font-size: 27px;
        line-height: 40px;
    }
    
    .bannerText-container p{
        font-size: 15px;
        line-height: 28px; 
    }
}

@media(max-width:992px){
    section.navbar-container nav {
        height: 72px;
    }

    div#navbarToggler {
        background-color: #fff;
        padding-left: 15px;
        padding-bottom: 15px;
        margin-top: 58px;
        box-shadow: 0 3px 5px rgb(0 0 0 / 20%);
    }

    /* section.col-lg-12.px-0.navbar-container {
        position: relative;
    } */
    /* section.col-lg-12.navbar-container {
        padding: 15px;
    } */

    .navbar-container{
        position: relative;
    }

    .lh-50 {
        line-height: inherit;
    }

    .card-img-overlay.caption2 h5 {
        font-size: 18px;
    }

    li.padbutton {
        padding-left: 0px;
    }

    .card-img-overlay.caption2 {
        left: 3.5%;
        /* top: 6%; */
        width: 54%;
    }

    .navbar-container .navbar-toggler {
        position: absolute;
        left: 0;
    }

    .navbar-container .navbar-light .navbar-brand {
        position: absolute;
        right: 0;
    }

    
    a.navbar-brand img {
        height: 15px;
    }

    .col.displayItem {
        display: block;
    }
    
    .col-lg-6.pr-0 {
        padding-right: 15px !important;
    }

    .col-lg-6.pl-0 {
        padding-left: 15px !important;
    }

    button.mb-3.sec-btn {
        margin-bottom: 15px;
    }

    .container {
        max-width: 100% !important;
        width: 100%;
    }
    
    section.sibebar-container.d-inline-block{
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
        display: flex;
        background-color: transparent;
        box-shadow: none;
        opacity: 1;
    }

    div#navbarSupportedContent {
        position: absolute;
        background-color: #fcfcfc;
        box-shadow: 0px 4px 24px -1px rgba(0, 0, 0, 0.25);
        z-index: 999;
        padding: 25px;
        border-radius: 5px;
        max-width: 100%;
        width: 200px;
    }

    nav.navbar.navbar-expand-lg.navbar-light.bg-light.d-inline-block {
        position: inherit;
    }

    nav.aopMenu ul.navbar-nav li.nav-item  a{
        padding: 0.82rem 1rem;
    }

}

@media (max-width: 768px){
    h1.banner-text {
        font-size: 24px;
        line-height: 35px;
        letter-spacing: inherit;
    }

    .scrolling-words-box ul li{
        font-size: 24px;
    }

    .sectionTitle h3{
        font-size: 24px;
    }

    a .card.cardRadius24 .card-body h3.card-title{
        font-size: 20px;
    }

    a .card.cardRadius24 .card-body p.card-text{
        font-size: 15px;
    }

    .lh-50, .lh-60{
        line-height: normal;
    }

}

@media (min-width: 576px){
    .modal-dialog {
        max-width: 800px;
    }
}

@media(max-width:576px){
    section.bodyContainer {
        padding-bottom: 75px;
    }

    .modal-content.acctCreationModal {
        height: inherit;
    }

    h1.banner-text {
        font-size: 15px;
        line-height: 20px;
        letter-spacing: 1.3px;
    }

    .scrolling-words-box ul li{
        font-size: 15px;
    }

}

@media(max-width:480px){
    label.userStatus {
        font-size: 13px;
    }

    header a.cmblogo > img {
        height: 13px;
    }
}