* {
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}

body, p, a {
    font-family: Helvetica,sans-serif !important;
    font-size: 14px;
    /* background: #f5f5f5;*/
}

 /*form change info icon command text input span-contain 30-06 */

.icon-text-container {
    display: flex;
    align-items: start;

}

.icon-box {
    margin-right: 2px;
    padding: 18px;
    color: #000;
}

    .icon-box i {
        /* Set styles for your icon, such as font-size, color, etc. */
    }


/*end code*/


label {
    font-family: 'Calibri';
    font-size: 16px !important;
}
input.form-control {
    font-family: 'Calibri';
    font-size:14px !important;
}
/*.fieldLabel {
    margin-top: 14px !important;
}*/

h1, h2, h3, h4, h5, h6 {
    color: #003466;
    font-weight: bold;
    font-family: 'Calibri';
}
h1{
    font-size:28px;
}
h2 {
    font-size: 22px;
}
h3 {
    font-size: 18px;
}
h4 {
    font-size: 17px;
}
h1, h2, h3, h4, h5, h6, .table-borde#DC2B27 td, .table-borde#DC2B27 th {
    font-family: 'Calibri';
}

.table-borde#DC2B27 td, .table-borde#DC2B27 th {
    font-size: 12px;
}
.table > tbody{background:#fff !important;}
/*select {
    color: #000000 !important;
    font-family: "Roboto" !important;
}*/
.login-form .form-input {
    margin: 10px 0px;
}

    .login-form .form-input label,
    .cap2 .captcha label {
        display: block;
        font-size: 15px;
        color: #111;
        margin-bottom: 5px;
    }

    .login-form .form-input input {
        width: 100%;
        padding: 10px;
        border: 1px solid #888;
        font-size: 15px;
    }

.loginLayout button#btnLogin, .loginLayout .form-control {
    border-radius: 0 !important;
    min-height:40px !important;
    font-size:16px;
}


.cap2 .captcha {
    margin: 15px 0px;
}

    .cap2 .captcha .preview {
        color: #555;
        width: 100%;
        text-align: center;
        height: 40px;
        line-height: 40px;
        letter-spacing: 8px;
        border: 1px dashed #888;
        font-family: "monospace";
    }

        .cap2 .captcha .preview span {
            display: inline-block;
            user-select: none;
        }

    .cap2 .captcha .captcha-form {
        display: flex;
    }

        .cap2 .captcha .captcha-form input {
            width: 100%;
            padding: 8px;
            border: 1px solid #888;
        }

        .cap2.captcha .captcha-form .captcha-refresh {
            width: 40px;
            border: none;
            outline: none;
            background: #888;
            color: #eee;
            cursor: pointer;
        }

header .dropdown-menu[data-bs-popper] {
    right: 0;
    left: auto;
}

header nav h1 {
    position: absolute;
    left: 48%;
    top: 15px;
    font-size: 24px;
    letter-spacing: 0.5px;
    text-transform: capitalize;
    color: #003466;
    font-weight: bold;
}


.SignUp h1.registerPage,
.Index h1.myApplication,
.SignUp h1.registerPage,
.SignUp h1.registerPage {
    display: block;
}

/*html body header nav h1.registerPage,
html body header nav h1.myApplication,
html body header nav h1,
html body header nav h1 {
    display: none;
}*/

.Index h1.myApplication {
    top: 24px;
    left: 46%;
}

footer.copyright {
    position: fixed !important;
    z-index:3;
}

footer p.text-center {
    padding: 0;
    margin: 0 0 6px 0;
}

html body .fade:not(.show) {
    opacity: 1;
}

span.field-validation-error {
    color: #DC2B27;
}

html body a {
    color: #003466;
    text-decoration: none;
    font-size:14px;
}

    html body a:hover, html body a:active, html body a:focus {
        text-decoration: underline;
        color: #DC2B27;
    }

.footer.expanded {
    height: 245px; /* Expanded height */
    z-index:9999;
}
footer i.fa.fa-arrow-circle-o-up, footer i.fa.fa-arrow-circle-o-down {
    display: none;
}
.container-fluid.body-content .table-responsive{background:#fff !important;}


@media (max-width:900px) {
    /* html, body {
        overflow: scroll !important;
    }*/

    #style-2 {
        padding-bottom: 100px;
    }
}

@media screen and (max-width: 500px) {
    header nav a.navbar-brand {
        width: 75%;
        margin: 0;
        padding: 0;
        text-align: left;
    }

    header .nav-item {
        text-align: left;
    }
   
   /* header {
        height: 45px !important;
    }*/
    /* header nav ul.navbar-nav {
        width: 100%;
        margin: 0 auto;
        text-align: center;
    }*/
    nav.navbar.navbar-expand-sm.navbar-toggleable-sm.navbar-light.bg-white.border-bottom.box-shadow.mb-3 {
        margin: 0 0 15px !important;
        padding: 0;
    }

    div#style-3 {
        height: 100%;
        padding: 0;
    }

    .Index #style-2 {
        padding-bottom: 50px;
    }

    .mb-3.bg-white.p-4.border {
        height: 100% !important;
    }

    .preview_next_box {
        position: relative;
        bottom: -8px;
        width: 100%;
        left: 0;
        right: auto;
    }

    .application_box {
        height: 100%;
    }

    div#style-2 {
        height: calc(100vh - 175px);
        margin-bottom: 0px;
    }
    .ChangeEmail form#frmEmailSubmit {
        width: 94%;
    }
    button#Complaint-backPage {
        margin-right: 6px;
    }
    body .preview_next_box .me-4 {
        margin-right: 0.5rem !important;
    }
    .preview_next_box span.btn-label {
        padding: 6px 8px;
    }
    body .preview_next_box  a.btn span.title_tab {
        font-size: 13px;
    }
    div#divSubmitData {
        height: 100% !important;
    }

    .save_continue_btn {
        margin: 15px 0;
    }
    body footer .social {
        text-align: center;
    }
        body footer .social a{ margin: 3px 4px 5px; }
        .SignUp h1.registerPage {
            display: none !important
        }

 /*   .title_tab {
        display: none;
    }*/

    .footer {
        background-color: #333;
        color: #fff;
        position: fixed;
        bottom: 0;
        width: 100%;
        height: 30px; /* Default height */
        overflow: hidden;
        transition: height 0.5s ease;
    }

    footer i.fa.fa-arrow-circle-o-up, footer i.fa.fa-arrow-circle-o-down {
        display: block;
        font-size: 25px;
        margin-top: 5px;
    }
    .footer i.fa.fa-arrow-circle-o-down, body .footer.expanded i.fa.fa-arrow-circle-o-up {
        display: none;
    }

    .footer.expanded i.fa.fa-arrow-circle-o-down {
        display: block;
    }
        .card .card-body label {
        width: 100%;
    }
    body span.checkmark{width:90%; padding:0; vertical-align:top;}

}



.organization_datagrid .checktext a {
    pointer-events: none;
    color:#000 !important;
}

div#divSubmitData {
    height: 55px;
    overflow: hidden;
}

.p-t-10 {
    padding-top: 10px;
}

.card-body.row {
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

    .card-body.row .table-responsive table.table {
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
    }

input#ecl_dateofbirth {
    display: inline-block;
    position: relative;
}

input[type="date"]::-webkit-calendar-picker-indicator, input.datepicker::-webkit-calendar-picker-indicator {
    background: transparent;
    bottom: 0;
    color: transparent;
    cursor: pointer;
    height: auto;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: auto;
    z-index: 2;
}


input[type="date"], input.datepicker {
    position: relative;
    z-index: 2;
}

    /*input[type="date"]:after {
    font: normal normal normal 14px/1 FontAwesome;
    content: "\f073";
    color: #555;
    padding: 0 5px;
}*/
    input[type="date"]:after, input.datepicker:after {
        font: normal normal normal 14px/1 FontAwesome;
        content: "\f073";
        color: #555;
        padding: 0 5px;
        background: #0a58ca;
        width: 36px;
        height: 40px;
        line-height: 40px;
        color: #fff;
        right: 0;
        position: absolute;
        text-align: center;
        z-index: 1;
    }
    /* change color of symbol on hover */
    /*input[type="date"]:hover:after {
    color: #bf1400;
}*/

    /* make the native arrow invisible and stretch it over the whole field so you can click anywhere in the input field to trigger the native datepicker*/
    input[type="date"]::-webkit-calendar-picker-indicator, input.datepicker::-webkit-calendar-picker-indicator {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: auto;
        height: auto;
        color: transparent;
        background: transparent;
    }

    /* adjust increase/decrease button */
    input[type="date"]::-webkit-inner-spin-button, input.datepicker::-webkit-inner-spin-button {
        z-index: 1;
    }

    /* adjust clear button */
    input[type="date"]::-webkit-clear-button, input.datepicker::-webkit-clear-button {
        z-index: 1;
    }

/*
  ***** Side css *****
*/
/*body {
    padding-top: 0px;
    padding-bottom: 20px;
}*/

/* Set padding to keep content from hitting the edges */
/*.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

.error.display-error {
    display: block;
    margin-bottom: 20px;
    transform: translateY(-20px);
}

.error {
    color: #af4242;
    background-color: #fde8ec;
    padding: 10px;
    display: none;
}*/

/* Set width on the form input elements since they're 100% wide by default */
/*input, select, textarea {
    max-width: 280px;
    color: #000000 !important;
    font-family: "Roboto" !important;
}

option {
    color: #000000 !important;
}

.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
    background-color: #777;
    border-color: #fff
}*/

/*
***** common ******

*/
/*

.field-validation-error {
    color: #DC2B27 !important;
}

.input-validation-error {
    border: 1px solid #DC2B27 !important;
}

.field-validation-success {
    color: green !important;
}*/


/*
   ****** custom style code ******
*/
:root {
    --font-blue-color: #1E2A36;
    --font-gray-color: gray;
    --orange-color: #f7923a;
    --brown-color: #730B12;
    --darkorange-color: #e16e3b;
}

ul.ui-autocomplete.ui-menu {
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 99999 !important;
    max-height: 250px;
    overflow: auto;
}

ul.auto-complete-list {
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 99999 !important;
    max-height: 250px;
    overflow: auto;
}

* {
    margin: 0;
    padding: 0
}


html {
    height: 100%;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
}

body {
    overflow-x: hidden;
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    line-height: 1.4;
    color: #000;
   /* background-color: #f4f6f8;*/
   background-color:#fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/*h1, h2, h3, h4, h5, h6 {
    margin: 0px 0px 10px 0px;
    font-weight: 500;
}

h1 {
    font-size: 32px;
    line-height: 44px;
    letter-spacing: -1px;
}

h2 {
    font-size: 24px;
    line-height: 32px;
}

h3 {
    font-size: 20px;
}

h4 {
    font-size: 16px;
    line-height: 1.6;
}

p {
    line-height: 1.6;
    font-weight: 400;
    -moz-font-weight: 500;
}*/

ul, ol {
}

    ul li, ol li {
        color: #000;
        font-weight: 500;
        font-size: 14px;
        line-height: 22px;
    }

a {
    text-decoration: underline;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    outline: 0;
}

    a:focus, a:hover {
        text-decoration: underline;
        color: var(--brown-color);
    }


.jumbotron {
    background-color: transparent;
}

.field-validation-error {
    color: #DC2B27 !important;
}

.input-validation-error {
    border: 1px solid #DC2B27 !important;
}

.field-validation-success {
    color: green !important;
}
/*.container-fluid {
    padding-right: 0px;
    padding-left: 0px;
}*/

#msform {
    position: relative;
    margin-top: 1px;
}

    #msform fieldset .form-card {
        background: white;
        border: 0 none;
        border-radius: 0px;
        box-shadow: 0 2px 2px 2px rgba(0, 0, 0, 0.2);
        padding: 20px 40px 30px 40px;
        box-sizing: border-box;
        width: 94%;
        margin: 0 3% 20px 3%;
        position: relative
    }

    #msform fieldset:not(:first-of-type) {
        display: contents
    }

    #msform fieldset .form-card {
        text-align: left;
        color: #9E9E9E
    }

select.list-dt {
    border: none;
    outline: 0;
    border-bottom: 1px solid #ccc;
    padding: 2px 5px 3px 5px;
    margin: 2px
}

    select.list-dt:focus {
        border-bottom: 2px solid skyblue
    }

.card {
    padding-bottom: 1em;
}

.validationError {
    border: 1px solid #DC2B27 !important;
    color: #DC2B27;
}

.groupError {
    border: 1px solid #DC2B27 !important;
    color: #DC2B27;
}

/*.nav-tabs .nav-link.active {
    background-color: var(--font-blue-color);
    border: 0;
    border-radius: 0;
}*/
.nav-tabs .nav-link.active strong {
    /*color: var(--brown-color);*/
    color: #1e4597;
}

.radio-group {
    position: relative;
    margin-bottom: 0
}

.radio {
    display: inline-block;
    width: 204px;
    height: 104px;
    border-radius: 0;
    background: lightblue;
    box-shadow: 0 2px 2px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    cursor: pointer;
    margin: 8px 2px
}
.radio-group span {
    padding-left: 5px;
    vertical-align: top;
    padding-right: 5px;
}
.radio-group input[type="radio"] {
    margin-left: 5px;
    margin-top:5px;
}
.alert.alert-primary i.fa.fa-info-circle {
    font-size: 16px;
    padding-right: 5px;
    line-height: 20px;
    vertical-align: bottom;
}
    .radio:hover {
        box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.3)
    }

    .radio.selected {
        box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.1)
    }

.fit-image {
    width: 100%;
    object-fit: cover
}

.font-white {
    color: rgba(0, 0, 0, 0.2);
}

.white-background {
    background-color: white;
}

.primary {
    color: var(--font-blue-color);
}

.small {
    font-size: 0.8em;
}

input, select, textarea {
    max-width: 100%;
}

    input[type=text], input[type=email], input[type=number], input[type=password], select {
        min-height: 40px;
    }

.bg-white {
    background-color: #fff;
}

.form-control {
    border-color: var(--font-blue-color);
}

    .form-control:focus, .form-control:active, .form-control:hover {
        box-shadow: none;
        border: 2px solid var(--font-blue-color);
    }

.header-logo {
    padding-top: 22px;
    padding-bottom: 22px;
}

    .header-logo img {
        max-width: 24em;
    }

.header-logo2 {
    padding-left: 0.5em;
    padding-top: 0.2em;
    background-color: var(--font-blue-color);
    /*border-top: 1px solid white;*/
}

.form .input-check-ic-panel {
    position: absolute;
    right: 18px;
    top: 2px;
    background-color: #ffffff;
    padding: 5px 10px;
    line-height: 27px;
}

    .form .input-check-ic-panel i {
        color: green;
    }

.bold {
    font-weight: bold;
}

.padding-left-1 {
    padding-left: 1em;
}

.padding-bottom-5 {
    padding-bottom: 5em;
}

.padding-top-8px {
    padding-top: 8px;
}

.padding-top-1 {
    padding-top: 1em;
}

.padding-top-2 {
    padding-top: 2em;
}

.padding-top-3 {
    padding-top: 3em;
}

.padding-top-5px {
    padding-top: 5px;
}

.padding-top-5 {
    padding-top: 5em;
}

.padding-top-6 {
    padding-top: 6em;
}

.padding-top-6-1 {
    padding-top: 6.1em;
}

.padding-top-12 {
    padding-top: 12em;
}

.padding-top-13 {
    padding-top: 13em;
}

.padding-top-18 {
    padding-top: 18em;
}

ul.list, ul.listWelcome {
    list-style: none;
    margin: 0;
}

    ul.list li {
        display: inline-block;
    }

    ul.list > li.sep:after {
        display: inline-block;
        content: "|";
        padding-left: 1rem;
        padding-right: 1rem;
    }

.width-80 {
    width: 80%;
}



.width-1 {
    width: 1%;
}

.width-18 {
    width: 18%;
}

label {
    color: #000 !important;
    font-weight: bold !important;
    font-size: 16px !important;
}

.error-context {
    color: #DC2B27; /* Change the color to #DC2B27 */
}



label.error {
    color: #ff0000;
    margin-top: 5px;
    font-size: 12px;
    /* display: none !important;*/
}

.input-validation-error,
input.error, select.error {
    background-color: #f3dcdb;
}

.modal-content, .btn {
    border-radius: 0px;
}

/*Progress Bar*/

#progressbar {
    /*margin-bottom: 30px;*/
    overflow: hidden;
    color: lightgrey;
    text-align: center;
    position: relative;
    top: 0px;
    width: 100%;
    /*background-color: var(--font-blue-color);*/
    background-color: #d7eafb;
    margin: 0 !important;
    z-index: 1;
    /*padding-top: 15px;
    padding-bottom: 7px;*/
    padding: 0 !important;
    border-radius: 0;
}

.nav-tabs .nav-link.active {
    background-color: #5766ab;
    pointer-events: none;
    cursor: pointer;
}
    .nav-tabs .nav-link.active span {
        color: #fff !important;
    }
.nav-tabs .nav-link span {
    color: #000 !important;
    font-size:15px;
    letter-spacing:0.9px;
}
.nav-tabs .nav-link {
    pointer-events: none;
    cursor: pointer;
}
#progressbar .active {
    color: #000000;
    cursor: pointer;
}
#progressbar {
    background: #cfe2ff
}
#progressbar li {
    list-style-type: none;
    font-size: 12px;
    width: 14.28%;
    float: left;
    position: relative;
    padding: 5px 7px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

    #progressbar li {
        pointer-events: none;
        cursor: default;
        text-decoration: none;
        color: black;
    }
    #progressbar li strong {
        color: #e9ecef;
    }


/*
#progressbar li:before {
    width: 50px;
    height: 50px;
    line-height: 45px;
    display: block;
    font-size: 18px;
    color: #ffffff;
    background: #e9ecef;
    border-radius: 50%;
    margin: 0 auto 10px auto;
    padding: 2px
}*/
/*#progressbar li:before {
    width: 26px;
    height: 26px;
    line-height: 26px;
    display: block;
    font-size: 16px;
    color: #ffffff;
    background: #e9ecef;*/
/* border-radius: 50%;*/
/*border-radius: 5px !important;
    font-weight: bold;
    margin: 0 auto 5px auto;
    padding: 0;
    display:none;
}

#progressbar li:after {
    content: '';
    width: 100%;
    height: 2px;
    background: #e9ecef;
    position: absolute;
    left: 0;
    top: 26px;
    z-index: -1
}

#progressbar li.active:before,
#progressbar li.active:after {
    background: var(--brown-color);
}

#progressbar li.currentpage:before,
#progressbar li.currentpage:after {
    background: var(--darkorange-color);
}*/
/*Button Style*/
.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus {
    outline: none !important;
    color: #fff;
    border-color: #fff;
    /*background-color: #5bc0de !important;*/
}


.btn-custom {
    background-color: var(--font-blue-color);
    color: white;
}

    .btn-custom:hover, .btn-custom:focus {
        filter: contrast(0.5) brightness(1.25);
        color: white;
    }

.btn-custom-cancel {
    background-color: #9e9e9e;
    color: white;
}

    .btn-custom-cancel:hover, .btn-custom-cancel:focus {
        filter: contrast(0.5) brightness(1.25);
        color: white;
    }

.btn-custom-withdraw {
    background-color: var(--brown-color);
    color: white;
}

    .btn-custom-withdraw:hover, .btn-custom-withdraw:focus {
        filter: contrast(0.5) brightness(1.25);
        color: white;
    }

.btn-custom-expand {
    background-color: var(--font-blue-color);
    color: white;
}

.btn-custom:hover, .btn-custom:focus {
    filter: contrast(0.5) brightness(1.25);
    color: white;
}


/*Checkbox Style*/

.radio, .checkbox {
    margin-top: 0px;
}

    .checkbox.checkbox-circle label ::before {
        outline: none !important;
    }

    .checkbox label::before, .checkbox label::after {
        width: 42px !important;
        height: 42px !important;
        border-color: var(--font-blue-color) !important;
    }

    .checkbox label::after {
        margin-left: -9px !important;
        padding-left: 3px !important;
        padding-top: 0px !important;
        margin-top: 3px !important;
    }

.radiobox label::after {
    padding-left: 4px !important;
    padding-top: 2px !important;
}

.checkbox input[type="checkbox"]:checked + label::after {
    font-size: 15px;
}

.checkbox input[type="radio"]:checked + label::after {
    content: "\25cf" !important;
    font-size: 20px;
    margin-top: -4px !important;
}

.radio, .checkbox {
    line-height: 45px !important;
}

    .checkbox label {
        padding-top: 3px !important;
        padding-left: 29px !important;
    }

    .radio label, .checkbox label {
        line-height: 53px !important;
    }

.navbar {
    border: none;
    nav-left: auto;
}

.input-group[class*="col-"] {
    padding-right: 15px;
    padding-left: 15px;
}

.input-group-addon {
    border-radius: 0px;
    border-color: var(--font-blue-color);
}

    .input-group-addon:first-child {
        border-right: none;
        border-radius: 0px;
        border-color: var(--font-blue-color);
    }

.panel-default {
    border-radius: 0px;
}

    .panel-default > .panel-heading {
        cursor: pointer;
        color: #545454;
        border-color: var(--font-blue-color);
        background-color: white;
    }

.navbar-fixed-top-1 {
    top: 124px;
}

.navbar-fixed-top-2 {
    top: 163px;
    z-index: 99999;
}

.datepicker-dropdown {
    z-index: 9999 !important;
}

.modal {
    z-index: 99999;
}

.checkbox4 label::after {
    margin-top: 17px !important;
}

select {
    color: #000000 !important;
}

option:not(:first-of-type) {
    color: #555555;
}

#loading {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,0.8);
    z-index: 999999;
}

#loadingcontent {
    display: table;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

#loadingspinner {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
    text-align: center;
    font-size: larger;
    padding-top: 80px;
}

.inner-container {
    position: relative;
    top: 243px;
    height: auto;
    min-height: 70%;
    overflow: auto;
    padding-bottom: 15px;
}

.remove-row {
    font-size: 16px;
}

    .remove-row i {
        margin-top: 5px;
    }

.navbar-inverse {
    background-color: #fff;
}

.inner-submit-container {
    top: 140px;
}

.fileUpload {
    position: relative;
    overflow: hidden;
    border-radius: 0px;
    margin-left: 0px;
}

    .fileUpload input.upload {
        position: absolute;
        top: 0;
        margin: 0;
        padding: 0;
        cursor: pointer;
        opacity: 0;
        filter: alpha(opacity=0);
    }

    .fileUpload span {
        font-size: 14px;
    }

.uploadedlabel {
    padding-top: 10px;
}

.remove-document-1,
.remove-document-2,
.remove-document-3 {
    height: 35px;
}

.input-disabled {
    background-color: #EBEBE4;
}

.datepicker table tr td.today, .datepicker table tr td.today:hover, .datepicker table tr td.today.disabled, .datepicker table tr td.today.disabled:hover {
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(var(--brown-color)), to(var(--brown-color))) !important;
    color: white !important;
}

.alert {
    border-radius: 0px;
}

.font-medium {
    font-size: 1.2em;
}

.text-colour {
    color: #061866;
}

.form-label {
    font-weight: 600;
}

/*sticky header*/
.header {
    color: black;
    text-align: center; /* Cente#DC2B27 text */
    font-weight: bold;
    position: fixed; /* Fixed position - sit on top of the page */
    top: 0;
    width: 100%; /* Full width */
    transition: 0.2s;
}

/*header {
    height: 89px;
    margin-bottom: 15px;
}*/

.content {
    padding-top: 16px;
    
    color: #000;
}

.form-control, .form-control, .form-control,
.form-control:focus, .form-control:active, .form-control:hover {
    border: 1px solid #cbcbcb !important;
}

.container {
    /*position: absolute;*/
    top: 200px;
    z-index: -9999;
    bottom: -2px;
    left: 0;
    right: 0;
}

    .container.mainlayout {
        top: 100px;
    }

.modal-header {
    display: inline;
}

.signature-pad > canvas {
    display: block;
    width: 300px;
    height: 150px;
    margin-bottom: 5px;
    border: 1px solid black;
}


/* Custom style  - Jignesh */
/*
#style-2::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}

#style-2::-webkit-scrollbar {
    width: 12px;
    background-color: #F5F5F5;
}


#style-2::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #D62929;
}*/
#style-2 {
    height: calc(100vh - 170px);
    overflow: auto;
    margin-top: 10px;
    margin-bottom: 10px;
}

.application_box {
    /*height: calc(100vh - 242px);
    overflow: auto;*/
    padding: 7px 0px 0px 0;
    margin: -10px auto 0;
    overflow: hidden;
    width: 60%;
    height:100%;
}

    #style-2::-webkit-scrollbar-track, .application_box::-webkit-scrollbar-track, .modal-dialog-scrollable .modal-body::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        background-color: #F5F5F5;
    }

    #style-2::-webkit-scrollbar, .application_box::-webkit-scrollbar, .modal-dialog-scrollable .modal-body::-webkit-scrollbar {
        width: 6px;
        background-color: #F5F5F5;
    }

    #style-2::-webkit-scrollbar-thumb, .application_box::-webkit-scrollbar-thumb, .modal-dialog-scrollable .modal-body::-webkit-scrollbar-thumb {
        background-color: #000000;
    }

select, input {
    border: 1px solid #ccc !important;
}

label.form-label.form-control-lg {
    font-weight: normal;
    margin: 0 -10px -8px;
    font-size: 1rem;
}

select.form-control-lg {
    font-size: 1rem;
}

.chosen-container-single .chosen-single {
    background-color: #fff !important;
    border-radius: .5rem;
    padding: .5rem 1rem;
}

button, a {
    border-radius: 0.5rem !important;
}

#progressbar li.active .card-subtitle {
    color: #fff !important;
}

#style-2 h1, #style-2 h2, #style-2 h3, #style-2 h4, #style-2 h5, #style-2 h6 {
    color: #003466 !important;
    font-weight: bold !important;
    font-family: 'Calibri' !important;
}

#progressbar li.active:before, #progressbar li.active:after {
    color: #fff !important;
}

#progressbar li.active:after {
    background: #fff !important;
    height: 2px;
}

#progressbar li.active {
    background: #003466 !important;
}

.card-header {
    font-weight: bold;
    color: #003466;
}

#style-2 .card-header h3.text-danger {
    margin: 18px 0 0 -8px;
}

.copyright b {
    font-weight: 500;
    color: #0f3b8f;
}

    .copyright b a {
        text-decoration: none;
        color: #0f3b8f;
    }

        .copyright b a:hover {
            color: #5bc0de;
        }

.btn-label {
    position: relative;
    left: -12px;
    display: inline-block;
    padding: 6px 12px;
    background: rgb(1 6 11 / 20%);
    border-radius: 3px 0 0 3px;
    margin: -6px 0 -5px;
}

header .dropdown-menu[data-bs-popper] {
    right: 0;
    left: auto;
}

header nav h1 {
    position: absolute;
    left: 20%;
    top: 10px;
    font-size: 30px;
    letter-spacing: 0.5px;
    text-transform: capitalize;
    color: #fff;
    font-weight: bold;
}


.SignUp h1.registerPage,
.Index h1.myApplication,
.SignUp h1.registerPage,
.SignUp h1.registerPage {
    display: block;
}

/*html body header nav h1.registerPage,
html body header nav h1.myApplication,
html body header nav h1,
html body header nav h1 {
    display: none;
}*/

html body .fade:not(.show) {
    opacity: 1;
}

/*#addChildModel span#messageSpan.text-dark {
    font-size: 12px;
    display: block;
    color: #664d03;
    background-color: #fff3cd;
    border-color: #ffecb5;
    padding: 0 10px;
    line-height: 22px;
}*/

#addChildModel h3 {
    font-size: 20px;
}

#addChildModel .tab-content, #addChildModel .tab-content .tab-pane {
    display: block !important;
}

.alert.alert-warning.fade.show.alert-dismissible, .alert.alert-info.fade.show.alert-dismissible, div#clientAcknowledgement {
    border-radius: 0;
}

/*.alert-info a, .alert-info p {
    color: #003466
}

.alert-warning p, .alert-warning a {
    color: #003466;
}*/

.preview_next_box {
    position: absolute;
    bottom: 140px;
    left: 0;
    /* z-index: 1;*/
    width: auto;
}

#addChildModel .preview_next_box, #frmSubmit .preview_next_box, .preview_next_box {
    display: none;
}

  /*  .preview_next_box #Applicants-and-Signatories-back, .preview_next_box #Consent-next {
        background-color: #e9ecef !important;
        border-color: #000 !important;
        color: #000 !important;
        cursor: default;
        text-decoration: inherit !important;
    }*/

#cmxform .preview_next_box {
    display: block !important;
    position: relative;
    bottom: 0;
    left: 12px;
    margin-bottom: 15px;
    margin-top: 20px;
}
/*div#bottamMessage {
    z-index: 2;
    width: 50%;
}*/
body.SignUp #FormData3 .preview_next_box {
    display: none !important
}

.menu_icon_style {
    margin-right: 7px;
    vertical-align: middle;
    line-height: 20px;
    font-size: 18px;
    color: #212121;
}

i.fa.fa-university.menu_icon_style {
    font-size: 16px;
}

i.fa.fa-user-o.menu_icon_style {
    font-size: 15px;
}

a:hover .menu_icon_style {
    color: #003466;
}

.sub_menu_icon_link a.dropdown-item:hover .menu_icon_style {
    color: #fff;
}

.lineHeight20px {
    line-height: 20px;
}

.vertical_middle {
    vertical-align: middle;
}
/* Menu section style code - Start */
/*.pl-4, .px-4 {
    padding-left: 1.5rem !important;
}*/
.ml-auto, .mx-auto {
    margin-left: auto !important;
}

.pb-4, .py-4 {
    padding-bottom: 1.5rem !important;
}

.pt-4, .py-4 {
    padding-top: 1.5rem !important;
}

/*.ml-0, .mx-0 {
    margin-left: 0 !important;
}*/
::selection {
    color: #fff;
    background-color: #8167a9;
}

::-moz-selection {
    color: #fff;
    background-color: #8167a9;
}


/* #Navigation
================================================== */


.start-header {
    opacity: 1;
    transform: translateY(0);
    padding: 0;
    box-shadow: 0 10px 30px 0 rgba(138, 155, 165, 0.15);
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

    .start-header.scroll-on {
        box-shadow: 0 5px 10px 0 rgba(138, 155, 165, 0.15);
        padding: 0;
        -webkit-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
    }

/*.start-header.scroll-on .navbar-brand img {
            height: 24px;
            -webkit-transition: all 0.3s ease-out;
            transition: all 0.3s ease-out;
        }*/

.navigation-wrap {
    position: fixed;
    width: 100%;
    top: 30px;
    left: 0;
    z-index: 1000;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.navbar {
    padding: 0;
}

/*.navbar-brand img {
    height: 28px;
    width: auto;
    display: block;
    filter: brightness(10%);
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}*/

.navbar-toggler {
    float: right;
    border: none;
    padding-right: 0;
}

    .navbar-toggler:active,
    .navbar-toggler:focus {
        outline: none;
        box-shadow: none !important;
    }

.navbar-light .navbar-toggler-icon {
    width: 24px;
    height: 17px;
    background-image: none;
    position: relative;
    border-bottom: 1px solid #000;
    transition: all 300ms linear;
}

    .navbar-light .navbar-toggler-icon:after,
    .navbar-light .navbar-toggler-icon:before {
        width: 24px;
        position: absolute;
        height: 1px;
        background-color: #fff;
        top: 0;
        left: 0;
        content: '';
        z-index: 2;
        transition: all 300ms linear;
    }

    .navbar-light .navbar-toggler-icon:after {
        top: 8px;
    }

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:after {
    transform: rotate(45deg);
}

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:before {
    transform: translateY(8px) rotate(-45deg);
}

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
    border-color: transparent;
}

header .nav-link {
    font-weight: 500;
    transition: all 200ms linear;
    text-decoration: none !important;
}

header .nav-item:hover .nav-link {
    color: #003466 !important;
}

header .nav-item.active .nav-link {
    color: #003466 !important;
}

header .nav-link {
    position: relative;
    padding: 5px !important;
    display: inline-block;
}

header .nav-item:after {
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 100%;
    height: 2px;
    content: '';
    background-color: #003466;
    opacity: 0;
    transition: all 200ms linear;
}

header .nav-item:hover:after {
    bottom: 0;
    opacity: 1;
}

header .nav-item.active:hover:after {
    opacity: 0;
}

header .nav-item {
    position: relative;
    transition: all 200ms linear;
}

/*li.nav-item {
    padding: 0 12px !important;
}*/
/* #Primary style
================================================== */

.bg-light {
    background-color: #fff !important;
    transition: all 200ms linear;
}

.section {
    position: relative;
    width: 100%;
    display: block;
}

.full-height {
    height: 100vh;
}

.over-hide {
    overflow: hidden;
}

.absolute-center {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    margin-top: 40px;
    transform: translateY(-50%);
    z-index: 20;
}

/*p {
    margin: 0;
    padding-top: 10px;
    opacity: 1;
    transform: translate(0);
    transition: all 300ms linear;
    transition-delay: 1700ms;
}*/

/*body.hero-anime p {
    opacity: 0;
    transform: translateY(40px);
    transition-delay: 1700ms;
}*/


header .nav-item .dropdown-menu {
    transform: translate3d(0, 10px, 0);
    visibility: hidden;
    opacity: 0;
    max-height: 0;
    display: block;
    padding: 0;
    margin: 0;
    transition: all 200ms linear;
}
header {
    z-index: 9999 !important;
    position:relative;
}
header .nav-item.show .dropdown-menu {
    opacity: 1;
    visibility: visible;
    max-height: 999px;
    /*transform: translate3d(0, 0px, 0);*/
   /* max-width:380px;*/
    z-index:99999999 !important;
}
    header .nav-item.w-400 .dropdown-menu{width:380px;}
    .dropdown-menu {
        padding: 10px !important;
        margin: 0;
        font-size: 13px;
        letter-spacing: 1px;
        color: #212121;
        background-color: #fcfaff;
        border: none;
        border-radius: 3px;
        box-shadow: 0 5px 10px 0 rgba(138, 155, 165, 0.15);
        transition: all 200ms linear;
    }

.dropdown-toggle::after {
    display: none;
}

.dropdown-item {
    padding: 3px 15px;
    color: #212121;
    border-radius: 2px;
    transition: all 200ms linear;
}

    .dropdown-item:hover,
    .dropdown-item:focus {
        color: #fff;
        background-color: rgba(33, 64, 154, 0.8);
        text-decoration: none !important;
    }


/* Menu section style code - End */

/*a#btnNext {
    color: #fff !important;
    text-decoration: none !important;
}*/

div#ecl_organisationalrole_chosen, div#ecl_accountrole_chosen {
    pointer-events: none;
    opacity: 0.9;
}
/*
Hide/Show label message*/
/*.Applicant_details #ecl_applicantDetails_label,
.Signatory_details #ecl_SignatoryDetails_label,
.Account_Details #ecl_AccountTypeDetails_label {
    display: none;
}*/


/*footer style code*/
.request_assistanceBox .modal-confirm {
    color: #636363;
    width: 420px;
    font-size: 14px;
}
#saveApplicationPopup.request_assistanceBox .modal-confirm{width:550px;}
.request_assistanceBox .modal-confirm .modal-content {
    padding: 20px;
    border-radius: 5px;
    border: none;
}

    .request_assistanceBox .modal-confirm .modal-header {
        border-bottom: none;
        position: relative;
    }

    .request_assistanceBox .modal-confirm h4 {
        text-align: center;
        font-size: 26px;
        margin: 30px 0 -15px;
    }

    .request_assistanceBox .modal-confirm .form-control, .request_assistanceBox .modal-confirm .btn {
        min-height: 40px;
        border-radius: 3px;
    }

    .request_assistanceBox .modal-confirm .close {
        position: absolute;
        top: -5px;
        right: -5px;
    }

    .request_assistanceBox .modal-confirm .modal-footer {
        border: none;
        text-align: center;
        border-radius: 5px;
        font-size: 13px;
    }

    .request_assistanceBox .modal-confirm .icon-box {
        color: #fff;
        position: absolute;
        margin: 0 auto;
        left: 0;
        right: 0;
        top: -70px;
        width: 95px;
        height: 95px;
        border-radius: 50%;
        z-index: 9;
        background: #003466;
        padding: 15px;
        text-align: center;
        box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
    }

        .request_assistanceBox .modal-confirm .icon-box i {
            font-size: 58px;
            position: relative;
            top: 3px;
        }

    .request_assistanceBox .modal-confirm.modal-dialog {
        margin-top: 80px;
    }

    .request_assistanceBox .modal-confirm .btn {
        color: #fff;
        border-radius: 4px;
        background: #003466;
        text-decoration: none;
        transition: all 0.4s;
        line-height: normal;
        border: none;
    }

        .request_assistanceBox .modal-confirm .btn:hover, .request_assistanceBox .modal-confirm .btn:focus {
            background: #6fb32b;
            outline: none;
        }

.request_assistanceBox p.text-center, div#toastBoxMessage, .request_assistanceBox p {
    font-family: 'Calibri';
    font-weight: 500;
    font-size: 15px;
}

.request_assistanceBtn a.btn.btn-primary.trigger-btn {
    margin: -3px 0 0;
    padding: 3px 6px;
    font-size: 12px;
    background: #DC2B27;
    text-decoration: none !important;
    font-weight: 500;
    letter-spacing: 0.5px;
}

    .request_assistanceBtn a.btn.btn-primary.trigger-btn:hover, .request_assistanceBtn a.btn.btn-primary.trigger-btn:active, .request_assistanceBtn a.btn.btn-primary.trigger-btn:focus {
        background-color: #DC2B27 !important;
        border-color: #DC2B27 !important;
        opacity:0.9;
    }

.request_assistanceBtn .btn-label {
    left: -7px;
    padding: 3px 8px;
}

footer .marquee {
    /* margin-left: 113px;
    margin-right: 118px;*/
    /*color: #DC2B27;*/
    color: #16ADE4;
    font-family: 'Calibri';
    font-weight: 500;
    font-size: 14px;
    padding: 0;
    margin: 0;
    letter-spacing: 1px;
}

    footer .marquee:hover {
        color: #fff;
    }


/*Dashboard Page menuitem Design START */
.dashboard_box .display-4 {
    line-height: 2.5rem;
    letter-spacing: 0.0073529412em;
    font-size: 2.125rem !important;
    font-weight: 500;
}

.dashboard_box *[class*=display-] {
    color: #212121 !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.font-s-13 {
    font-size: 13px;
    font-weight: normal;
}

.dashboard_box .bg-blue {
    --bs-bg-opacity: 1;
    /*background-color: #43219a !important*/
    /*background-color: #1C1F4C !important;*/
    background-color: #003466 !important
}

.dashboard_box .card.text-white.bg-info.o-hidden.p-0 {
    /*background-color: #005f71 !important;*/
    background-color: #003466 !important
}

.dashboard_box .card.text-white.bg-danger.o-hidden.h-100.p-0 {
    /*background-color: #71000b !important;*/
    /*background-color: #5F544A !important;*/
    background-color: #003466 !important;
}

.dashboard_box .card.text-white.bg-primary.o-hidden.h-100.p-0 {
    /*background-color: #0049b3 !important;*/
    /*background-color: #003466 !important;*/
    background-color: #003466 !important;
}

.dashboard_box .card.text-white.bg-success.o-hidden.h-100.p-0 {
    /* background-color: #084327 !important;*/
    /*background-color: #16ADE4 !important;*/
    background-color: #003466 !important
}

.dashboard_box .breadcrumb {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 0.75rem 1rem;
    margin-bottom: 0;
    list-style: none;
    background-color: #e9ecef;
    border-radius: 0.25rem;
}

.dashboard_box ol.breadcrumb a {
    color: #003466;
    text-decoration: none;
    background-color: transparent;
    -webkit-text-decoration-skip: objects;
}

.dashboard_box .breadcrumb-item.active {
    color: #6c757d;
}

.dashboard_box .text-white {
    color: #fff !important;
}
.dashboard_box .card-footer.text-white {
    background-color: #fff !important;
    color: #003466 !important;
    border-radius: 0 !important;
}
.dashboard_box .o-hidden {
    overflow: hidden !important;
}

.dashboard_box .card-body.bg-danger {
    background-color: #ad201c !important;
}
.dashboard_box .card.text-white.bg-danger.o-hidden.h-100.p-0 {
    border-color: #ad201c !important;
}
.dashboard_box .card-body {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 1.25rem;
    /*min-height: 92px;*/
}

.dashboard_box .card-body-icon {
    position: absolute;
    z-index: 0;
    top: 0px;
    right: 10px;
    font-size: 3rem;
    -webkit-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    transform: rotate(15deg);
    opacity: 0.7;
}

.dashboard_box .card-body .mr-5, .dashboard_box .card-header {
    font-size: 18px;
    font-weight: bold;
    color: #003466;
}
    .dashboard_box .card-body .mr-5{color:#fff; text-transform:none;}

    .dashboard_box .text-muted, .masthead.bg-light, .masthead.footer-light, .masthead.bg-white, .footer-light {
        --bs-text-opacity: 1;
        color: #252b58 !important;
    }

.dashboard_box .text-muted, .dashboard_box span.date {
    font-weight: bold;
    color: #252b58 !important;
}
    /*.dashboard_box .card-body{min-height:100%;}*/
    .dashboard_box span.date i {
        font-size: 17px;
    }
/*.card .card-body {
    padding: 20px 30px !important;
    margin-bottom: 20px !important;
}*/
.p-r-5 {
    padding-right: 5px;
}

.row.justify-content-between.align-items-center.mb-3 {
    background-color: #e9ecef;
}

.pagesWiseGrid {
    display: none;
}

.p-r-10 {
    padding-right: 10px;
}


#style-2 .dashboard_box h4 {
    font-size: 20px !important;
}

#style-2 .dashboard_box .text-right, #style-2 .dashboard_box .text-right h4, #style-2 .dashboard_box .text-right div {
    text-align: right !important;
}

a.card-footer.text-white.clearfix.small.z-1 b {
    float: right;
    font-size: 20px;
    line-height: 18px;
}

/*@-webkit-keyframes ring {
    0% {
        -webkit-transform: rotate(-15deg);
        transform: rotate(-15deg);
    }

    2% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg);
    }

    4% {
        -webkit-transform: rotate(-18deg);
        transform: rotate(-18deg);
    }

    6% {
        -webkit-transform: rotate(18deg);
        transform: rotate(18deg);
    }

    8% {
        -webkit-transform: rotate(-22deg);
        transform: rotate(-22deg);
    }

    10% {
        -webkit-transform: rotate(22deg);
        transform: rotate(22deg);
    }

    12% {
        -webkit-transform: rotate(-18deg);
        transform: rotate(-18deg);
    }

    14% {
        -webkit-transform: rotate(18deg);
        transform: rotate(18deg);
    }

    16% {
        -webkit-transform: rotate(-12deg);
        transform: rotate(-12deg);
    }

    18% {
        -webkit-transform: rotate(12deg);
        transform: rotate(12deg);
    }

    20% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}

@keyframes ring {
    0% {
        -webkit-transform: rotate(-15deg);
        -ms-transform: rotate(-15deg);
        transform: rotate(-15deg);
    }

    2% {
        -webkit-transform: rotate(15deg);
        -ms-transform: rotate(15deg);
        transform: rotate(15deg);
    }

    4% {
        -webkit-transform: rotate(-18deg);
        -ms-transform: rotate(-18deg);
        transform: rotate(-18deg);
    }

    6% {
        -webkit-transform: rotate(18deg);
        -ms-transform: rotate(18deg);
        transform: rotate(18deg);
    }

    8% {
        -webkit-transform: rotate(-22deg);
        -ms-transform: rotate(-22deg);
        transform: rotate(-22deg);
    }

    10% {
        -webkit-transform: rotate(22deg);
        -ms-transform: rotate(22deg);
        transform: rotate(22deg);
    }

    12% {
        -webkit-transform: rotate(-18deg);
        -ms-transform: rotate(-18deg);
        transform: rotate(-18deg);
    }

    14% {
        -webkit-transform: rotate(18deg);
        -ms-transform: rotate(18deg);
        transform: rotate(18deg);
    }

    16% {
        -webkit-transform: rotate(-12deg);
        -ms-transform: rotate(-12deg);
        transform: rotate(-12deg);
    }

    18% {
        -webkit-transform: rotate(12deg);
        -ms-transform: rotate(12deg);
        transform: rotate(12deg);
    }

    20% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}

.faa-ring.animated, .faa-ring.animated-hover:hover, .faa-parent.animated-hover:hover > .faa-ring {
    -webkit-animation: ring 2s ease infinite;
    animation: ring 2s ease infinite;
    transform-origin-x: 50%;
    transform-origin-y: 0px;
    transform-origin-z: initial;
}*/

/* VERTICAL */

/*@-webkit-keyframes vertical {
    0% {
        -webkit-transform: translate(0,-3px);
        transform: translate(0,-3px);
    }

    4% {
        -webkit-transform: translate(0,3px);
        transform: translate(0,3px);
    }

    8% {
        -webkit-transform: translate(0,-3px);
        transform: translate(0,-3px);
    }

    12% {
        -webkit-transform: translate(0,3px);
        transform: translate(0,3px);
    }

    16% {
        -webkit-transform: translate(0,-3px);
        transform: translate(0,-3px);
    }

    20% {
        -webkit-transform: translate(0,3px);
        transform: translate(0,3px);
    }

    22% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
}

@keyframes vertical {
    0% {
        -webkit-transform: translate(0,-3px);
        -ms-transform: translate(0,-3px);
        transform: translate(0,-3px);
    }

    4% {
        -webkit-transform: translate(0,3px);
        -ms-transform: translate(0,3px);
        transform: translate(0,3px);
    }

    8% {
        -webkit-transform: translate(0,-3px);
        -ms-transform: translate(0,-3px);
        transform: translate(0,-3px);
    }

    12% {
        -webkit-transform: translate(0,3px);
        -ms-transform: translate(0,3px);
        transform: translate(0,3px);
    }

    16% {
        -webkit-transform: translate(0,-3px);
        -ms-transform: translate(0,-3px);
        transform: translate(0,-3px);
    }

    20% {
        -webkit-transform: translate(0,3px);
        -ms-transform: translate(0,3px);
        transform: translate(0,3px);
    }

    22% {
        -webkit-transform: translate(0,0);
        -ms-transform: translate(0,0);
        transform: translate(0,0);
    }
}

.faa-vertical.animated,
.faa-vertical.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-vertical {
    -webkit-animation: vertical 2s ease infinite;
    animation: vertical 2s ease infinite;
}*/

/* HORIZONTAL */

/*@-webkit-keyframes horizontal {
    0% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }

    6% {
        -webkit-transform: translate(5px,0);
        transform: translate(5px,0);
    }

    12% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }

    18% {
        -webkit-transform: translate(5px,0);
        transform: translate(5px,0);
    }

    24% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }

    30% {
        -webkit-transform: translate(5px,0);
        transform: translate(5px,0);
    }

    36% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
    }
}

@keyframes horizontal {
    0% {
        -webkit-transform: translate(0,0);
        -ms-transform: translate(0,0);
        transform: translate(0,0);
    }

    6% {
        -webkit-transform: translate(5px,0);
        -ms-transform: translate(5px,0);
        transform: translate(5px,0);
    }

    12% {
        -webkit-transform: translate(0,0);
        -ms-transform: translate(0,0);
        transform: translate(0,0);
    }

    18% {
        -webkit-transform: translate(5px,0);
        -ms-transform: translate(5px,0);
        transform: translate(5px,0);
    }

    24% {
        -webkit-transform: translate(0,0);
        -ms-transform: translate(0,0);
        transform: translate(0,0);
    }

    30% {
        -webkit-transform: translate(5px,0);
        -ms-transform: translate(5px,0);
        transform: translate(5px,0);
    }

    36% {
        -webkit-transform: translate(0,0);
        -ms-transform: translate(0,0);
        transform: translate(0,0);
    }
}

.faa-horizontal.animated,
.faa-horizontal.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-horizontal {
    -webkit-animation: horizontal 2s ease infinite;
    animation: horizontal 2s ease infinite;
}*/

/* FLASHING */

/*@-webkit-keyframes flash {
    0%, 100%, 50% {
        opacity: 1;
    }

    25%, 75% {
        opacity: 0;
    }
}

@keyframes flash {
    0%, 100%, 50% {
        opacity: 1;
    }

    25%, 75% {
        opacity: 0;
    }
}

.faa-flash.animated,
.faa-flash.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-flash {
    -webkit-animation: flash 2s ease infinite;
    animation: flash 2s ease infinite;
}*/

/* BOUNCE */

/*@-webkit-keyframes bounce {
    0%, 10%, 20%, 50%, 80% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    40% {
        -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
    }

    60% {
        -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
    }
}

@keyframes bounce {
    0%, 10%, 20%, 50%, 80% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }

    40% {
        -webkit-transform: translateY(-15px);
        -ms-transform: translateY(-15px);
        transform: translateY(-15px);
    }

    60% {
        -webkit-transform: translateY(-15px);
        -ms-transform: translateY(-15px);
        transform: translateY(-15px);
    }
}

.faa-bounce.animated,
.faa-bounce.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-bounce {
    -webkit-animation: bounce 2s ease infinite;
    animation: bounce 2s ease infinite;
}*/

/* SPIN */

/*@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(359deg);
        -ms-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

.faa-spin.animated,
.faa-spin.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-spin {
    -webkit-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite;
}*/

/* FLOAT */

/*@-webkit-keyframes float {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    50% {
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px);
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes float {
    0% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }

    50% {
        -webkit-transform: translateY(-6px);
        -ms-transform: translateY(-6px);
        transform: translateY(-6px);
    }

    100% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}

.faa-float.animated,
.faa-float.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-float {
    -webkit-animation: float 2s linear infinite;
    animation: float 2s linear infinite;
}

}*/






a.request_box {
    background: #003466;
    display: block;
    width: 100%;
    padding: 10px 20px;
    color: #fff;
    border-radius: 40px !important;
    line-height: 34px;
}

    a.request_box:hover, a.request_box:focus, a.request_box:active {
        background: #16ADE4;
        color: #fff !important;
        text-decoration: none !important;
    }

.request_box span.titleLink {
    display: inline-block;
}

.request_box b.countNum {
    font-size: 32px;
    display: inline-block;
    text-align: center;
    font-weight: bold;
    vertical-align: top;
}

.card-footer span.titleLink {
    font-size: 14px;
    line-height: normal;
    font-weight: normal;
    text-transform:capitalize;
}

/*option 2*/
/*html body a.request_box {
    background: #003466;
    display: block;
    width: 150px;
    padding: 0;
    color: #fff;
    border-radius: 50% !important;
    text-align: center;
    height: 150px;
    vertical-align: middle;
    line-height: 26px;
    padding-top: 50px;
}*/
.dashboard_box .card-body .col-4, .dashboard_box .card-body .col-3, .dashboard_box .card-body .col-6, .dashboard_box .card-body .col-12 {
    width: auto;
}


/*.dashboard_box .mdc-select {
    display: inline-flex;
    position: relative;
}
.dashboard_box .mdc-select {
    width: 100%;
    display: inline-flex;
    position: relative;
}
.dashboard_box .mdc-select--outlined {
    border: none;
}
.dashboard_box .mdc-select__anchor {
    background-color: transparent;
}
    .mdc-select__anchor {
        display: flex;
        align-items: baseline;
        overflow: visible;
    }
    .mdc-select__anchor {
        height: 56px;
    }
.text-muted, .masthead.bg-light, .masthead.footer-light, .masthead.bg-white, .footer-light {
    --bs-text-opacity: 1;
    color: #252b58 !important;
}
.mwc-notched-outline {
    --mdc-notched-outline-border-color: var(--mdc-select-outlined-idle-border-color, rgba(0, 0, 0, 0.38) );
    --mdc-notched-outline-notch-offset: 1px;
}*/

/*Dashboard Page menuitem Design END */


/*UI Design change*/
.card .card-body label {
    font-weight: 600 !important;
    letter-spacing: 0.5px;
}

.form-control-lg, .form-control {
    border-radius: 0 !important;
}

html body .card, .btn-primary, .btn, .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    -webkit-border-radius: 0.375rem !important;
    -moz-border-radius: 0.375rem !important;
    border-radius: 0.375rem !important;
}

.table-borde#DC2B27 td {
    font-size: 13px;
    font-weight: normal;
    letter-spacing: 0.5px;
}

.table-borde#DC2B27 th {
    font-size: 13px;
    letter-spacing: 0.5px;
    font-weight: bold;
}

.table__head {
    /*background: #16ADE4 !important;*/
    background: #ddd !important;
    border-color: transparent !important;
}
.table-bordered td, .table-bordere th {
    border: 1px solid #fff !important;
}
    .table th{color:#000 !important;}
    .table-borde#DC2B27 td, .table-borde#DC2B27 th {
        border: 1px solid #fff !important;
    }
.table-responsive .table{margin:0;}
html body input, html body input.form-control, html body select, html body select.form-control, textarea.form-control, textarea {
    border-color: #605e5c !important;
}

    html body input:hover, html body input.form-control:hover, html body select:hover, html body select.form-control:hover, textarea:hover, textarea.form-control:hover {
        border-color: #ccc !important;
    }

    html body input:active, html body input.form-control:active, html body select:active, html body select.form-control:active, textarea.form-control:active,
    html body input:focus, html body input.form-control:focus, html body select:focus, html body select.form-control:focus, textarea.form-control:focus {
        border-color: #0078d4 !important;
        box-shadow: 0 0 0 0.25rem rgba(13,110,253,.25);
        -webkit-box-shadow: 0 0 0 0.25rem rgba(13,110,253,.25);
    }
.input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}
html body #cmxform #myTabContent .input-group span.input-group-text {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}
input.datepicker {
    height: 40px;
}

a.btn:hover {
    text-decoration: none !important;
}

body .btn, body a.btn span.title_tab, body a.btn {
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 16px;
    height: 36px;
    border-radius: 0 !important;
}

html body select, html body select.form-control {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, #fff 50%), linear-gradient(135deg, #fff 50%, transparent 50%), linear-gradient(to right, #0a58ca, #0a58ca);
    background-position: calc(100% - 15px) calc(1em + 2px), calc(100% - 10px) calc(1em + 2px), 100% 0;
    background-size: 5px 5px, 5px 5px, 2.5em 2.5em;
    background-repeat: no-repeat;
    line-height: 1.5em;
    padding: 0.5em 3.5em 0.5em 1em;
    display: inline-block;
}

    html body select:focus, html body select.form-control:focus {
        background-image: linear-gradient(45deg, white 50%, transparent 50%), linear-gradient(135deg, transparent 50%, white 50%), linear-gradient(to right, gray, gray);
        background-position: calc(100% - 10px) 1em, calc(100% - 15px) 1em, 100% 0;
        background-size: 5px 5px, 5px 5px, 2.5em 2.5em;
        background-repeat: no-repeat;
        border-color: grey;
        outline: 0;
        line-height: 1.5em;
        padding: 0.5em 3.5em 0.5em 1em;
        display: inline-block;
    }

    html body input.form-control.validationError, html body select.form-control.validationError, html body textarea.form-control.validationError {
        border: 1px solid #DC2B27 !important;
        color: #DC2B27;
    }

.input-group span.input-group-text {
    background-color: #0a58ca;
    border: 1px solid #094bac;
    color: #fff;
}

body .btn:hover {
    border-color: #16ADE4 !important;
    color: #fff !important;
    background: #16ADE4 !important;
}

input.currency_icon_input {
    padding-left: 1.4em;
    position: relative;
}
/*input.currency_icon::after {
        content: "\f155";
        font: normal normal normal 14px/1 FontAwesome;*/
/*font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;*/
/*text-decoration: inherit;
        color: #459ce7;*/
/*font-size: 18px;*/
/*padding-left: 0.5em;
        position: absolute;
        top: 10px;
        left: 0;
    }*/

span.input-group-text.currency_icon {
    background: none;
    border: none;
    position: absolute;
    top: 7px;
    /* display:none;*/
}
/*.currency_icon_input + span.input-group-text.currency_icon {
    display: block;
}*/
.price-format-input, input#ecl_amount {
    position: relative;
}

    input#ecl_amount::after, .price-format-input::after {
        content: attr(data-formatted-value);
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
    }

input#ecl_amount {
    padding-left: 1.4em;
}

#toastBoxValidation.request_assistanceBox .modal-confirm .icon-box {
    background: #DC2B27 !important;
}

#toastBoxValidation h4 {
    color: #DC2B27 !important;
}

#toastBoxValidation p {
    font-size: 14px;
    line-height: 20px;
}

#toastBoxValidation .modal-confirm.modal-dialog {
    margin-top: 130px;
}

#toastBoxValidation .modal-confirm {
    width: 550px;
}
.table > :not(caption) > * > *{line-height:normal}
div#organisationalRepresentativesDP, .alert.alert-warning.fade.show.alert-dismissible.mt-3.mb-1.pb-0, .alert.alert-info.fade.show.alert-dismissible.mt-3.mb-1,
.card .card-body .alert.alert-info.fade.show.alert-dismissible.mt-0.mb-1.pb-0,
#ecl_applicantDetails_label.alert.alert-info.fade.show.alert-dismissible,
#ecl_SignatoryDetails_label.alert.alert-info.fade.show.alert-dismissible,
#clientAcknowledgement.alert.alert-dark.fade.show.alert-dismissible.mt-0.mb-1.pb-0,
.card .card-body .alert.alert-info.fade.show.alert-dismissible,
.alert.alert-info.fade.show.alert-dismissible.mt-0.mb-1.pb-0,
.alert.alert-info.fade.show.alert-dismissible.mt-0.mb-1,
.alert.alert-info.fade.show.alert-dismissible.mt-0.mb-1 {
    background: transparent;
    border-color: transparent;
    color: #000;
    padding: 0;
    margin: 15px 0 0 !important;
}
    div#organisationalRepresentativesDP p,
    .alert.alert-warning.fade.show.alert-dismissible.mt-3.mb-1.pb-0 p,
    .alert.alert-info.fade.show.alert-dismissible.mt-3.mb-1 p,
    .card .card-body .alert.alert-info.fade.show.alert-dismissible.mt-0.mb-1.pb-0 p,
    div#ecl_applicantDetails_label.alert.alert-info.fade.show.alert-dismissible p,
    div#clientAcknowledgement.alert.alert-dark.fade.show.alert-dismissible.mt-0.mb-1.pb-0 p,
    .alert.alert-info.fade.show.alert-dismissible.mt-0.mb-1.pb-0 p,
    .alert.alert-info.fade.show.alert-dismissible.mt-0.mb-1 p,
    .alert.alert-info.fade.show.alert-dismissible.mt-0.mb-1.pb-0 ul li,
    div#clientAcknowledgement.alert.alert-dark.fade.show.alert-dismissible.mt-0.mb-1.pb-0 ul li,
    #ecl_SignatoryDetails_label.alert.alert-info.fade.show.alert-dismissible p,
    #ecl_SignatoryDetails_label.alert.alert-info.fade.show.alert-dismissible ul li,
    div#ecl_applicantDetails_label.alert.alert-info.fade.show.alert-dismissible strong,
    div#ecl_applicantDetails_label.alert.alert-info.fade.show.alert-dismissible ul li,
    .card .card-body .alert.alert-info.fade.show.alert-dismissible.mt-0.mb-1.pb-0 ul li,
    .alert.alert-info.fade.show.alert-dismissible.mt-3.mb-1 ul li,
    .alert.alert-warning.fade.show.alert-dismissible.mt-3.mb-1.pb-0 ul li,
    .card .card-body .alert.alert-info.fade.show.alert-dismissible p,
    .card .card-body .alert.alert-info.fade.show.alert-dismissible ul li,
    .alert.alert-info.fade.show.alert-dismissible.mt-0.mb-1 p{
        color: #000;
        font-weight: 500;
        font-size: 14px;
        line-height: 22px;
    }
button#backPage, body .btn-primary, .btn.active {
    background: #003466;
    border-color: #003466;
    --bs-btn-color: #fff;
    --bs-btn-bg: #003466 !important;
    --bs-btn-border-color: #5766ab !important;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #5766ab;
    --bs-btn-hover-border-color: #0a58ca;
    --bs-btn-focus-shadow-rgb: 31,70,151;
    --bs-btn-active-color: #fff;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    vertical-align:top;
    margin-top:0 !important;
}
div#ecl_AccountTypeDetails_label.alert {
    margin: 0 !important;
}

.loginBtn .btn-label {
    left: 0;
    position: absolute;
    width: 50px;
    height: 39px;
    top: 5.5px;
    line-height:28px;
}
.loginBtn button#btnLogin {
    position: relative;
    font-family: 'Roboto', sans-serif;
    font-size:16px;
    height:40px;
    border-radius:0 !important;
}
/*span.lineHeight20px.vertical_middle{font-size:14px; line-height:normal;}
.loginLayout button#btnLogin, .loginLayout .form-control,
button#backPage, body .btn-primary, .btn.active, body .btn.btn-secondary {
    border: 2px solid #16ADE4 !important;
    background-color: transparent;
    color: #16ADE4 !important;
}*/

   /* .loginBtn .btn-label,
    button#backPage .btn-label, body .btn-primary .btn-label, .btn.active .btn-label, body .btn.btn-secondary .btn-label {
        background-color: transparent;
        border-right: 2px solid #16ADE4 !important;
    }
    .loginBtn .btn-label{height:40px;}
.loginBtn button:hover .btn-label,
.loginBtn button:active .btn-label,
.loginBtn button:focus .btn-label,
button#backPage:hover .btn-label, body .btn-primary:hover .btn-label, .btn.active:hover .btn-label,
button#backPage:active .btn-label, body .btn-primary:active .btn-label, .btn.active:active .btn-label,
button#backPage:focus .btn-label, body .btn-primary:focus .btn-label, .btn.active:focus .btn-label,
body .btn.btn-secondary:hover .btn-label,
body .btn.btn-secondary:active .btn-label,
body .btn.btn-secondary:focus .btn-label {
    color: #fff !important;
    border-right: 2px solid #fff !important;
}

.loginBtn button .btn-label .fa{
    line-height:28px !important;
}

body .btn:hover, .loginLayout button#btnLogin:hover,
body .btn:active, .loginLayout button#btnLogin:active,
body .btn:focus, .loginLayout button#btnLogin:focus,
.GetOrgSearch a#btnNext:hover,
.GetOrgSearch a#btnNext:active,
.GetOrgSearch a#btnNext:focus,
button#backPage:hover,
button#backPage:active,
button#backPage:focus {
    background: #16ADE4 !important;
    color: #fff !important;
    border-color: #fff !important;
}

.request_assistanceBtn a.btn.btn-primary.trigger-btn{border:none !important; color:#fff !important;}
.request_assistanceBtn .btn-primary .btn-label {
    height: 100%;
    border-right: 2px solid #fff !important;
}*/

.btn-check:checked + .btn:focus-visible, .btn.active:focus-visible, .btn.show:focus-visible, .btn:first-child:active:focus-visible, :not(.btn-check) + .btn:active:focus-visible {
    box-shadow: none;
}

.GetOrgSearch a#btnNext {color: #16ADE4 !important;}
footer.copyright p b, footer.copyright p b a{font-size:13px;}

.SignUp form#cmxform,
.WithdrawalOrTransferDetail form#cmxform,
.IITDetail form#cmxform,
.DirectDebitDetail form#cmxform,
.PeriodicalPaymentReqOrAuthDetail form#cmxform,
.StopPaymentAndIndemnityOnBankDetail form#cmxform,
.TermInvestmentMaturityDateInstructionsDetails form#cmxform,
.EarlyRedemptionDetail form#cmxform,
.AddSignatories form#cmxform,
.AddOfficeholders form#cmxform,
.AddCompanyDirectorSecretaries form#cmxform,
.AddBOOfficeholder form#cmxform,
.AddPartners form#cmxform,
.AddPersonsOtTheTrust form#cmxform,
.AddOrganisationalRepresentatives form#cmxform,
.SignUp form#cmxform,
form#cmxform[action="WithdrawalOrTransferDetail"],
form#cmxform[action="IITDetail"],
form#cmxform[action="DirectDebitDetail"],
form#cmxform[action="PeriodicalPaymentReqOrAuthDetail"],

form#cmxform[action="StopPaymentAndIndemnityOnBankDetail"],
form#cmxform[action="TermInvestmentMaturityDateInstructionsDetails"],
form#cmxform[action="AddSignatories"],
form#cmxform[action="AddOfficeholders"],
form#cmxform[action="AddPartners"],
form#cmxform[action="AddPersonsOtTheTrust"],
form#cmxform[action="AddOrganisationalRepresentatives"],
form#cmxform[action="EarlyRedemptionDetail"],
form#cmxform[action="OrganizationalRepresentativesDetail"],
form#cmxform[action="AddOrganisationalRepresentatives"],
form#cmxform[action="ManageAccountPreferencesServiceDetail"],
form#cmxform[action="AddManageOrganisationalNameAddressDocumentation"],
form#cmxform[action="BankBookDetail"],
.AddExternalBankAccount form#cmxform,
.mytexInformaitonBox {
    margin: 0 auto;
    width: 60%;
}
.SignUp form#cmxform .icon-box{display:none}
html body.SignUp select{ min-height:37px !important; height:37px !important; border-radius:15px; }

div#ecl_applicantrole_chosen, div#ecl_accountrole_chosen, div#ecl_organisationalrole_chosen,
.ecl_applicantrole, .ecl_accountrole, .ecl_organisationalrole,
#ecl_organisationalrole + #ecl_organisationalrole_chosen, #ecl_accountrole + #ecl_accountrole_chosen {
    display: none !important;
}
.title_h1, .title_h1_signatories, .title_h1_accountTypeToBeOpened, .title_h1_FundsToOpenTheAccount, .title_h1_AccountPreferences, .title_h1_AcknowledgementConsent,
.title_h2_Applicant, .title_h1_Addresses, .title_h2_Addresses, .title_h2_Applicant_details, ._title_h2_Applicant_details,
.title_h1_Organisation_details_tab, .title_h1_Registration_profile_tab, .title_h1_Addresses_Contact_Details_section, .title_h1_Other_Organisational_Beneficial_Owners,  .title_h2_trasfer_title {
    border: none;
    margin: 10px -15px 0;
    padding: 0;
    width: 98%;
}

select#ecl_requeststatus, select#ecl_requeststatus1, #ecl_applicantrole_chosen, #ecl_applicantrole_chosen .chosen-choices, .chosen-choices, .readOnlyfield {
    background-color: #e9ecef;
    color: #000;
    cursor: not-allowed;
    pointer-events: none;
}
.SelectApplicationBox{ margin:0 auto; width:60%; }
input#txtOrg {
    height: 40px;
}
button#searchOrg {
    border: none;
    padding: 0;
    margin: 0px 0 0 -3px;
    background: none;
}
    button#searchOrg span.input-group-text {
        background-color: #0a58ca;
        border: 1px solid #094bac;
        color: #fff;
        height: 40px;
        width: 40px;
        border-top-left-radius: 0 !important;
        border-bottom-left-radius: 0 !important;
    }

#navbarSupportedContent .dropdown-menu b, #navbarSupportedContent .dropdown-menu a {
    text-transform: capitalize;
}
.ourpurposeBox {
    background: #003466;
    padding: 5% 5% 3.5%;
    color: #fff;
    margin: 5px;
}

    .ourpurposeBox .rightBox,
    .ourpurposeBox .leftBox {
        display: block;
        vertical-align:top;
        text-align:justify;
    }
        /*.ourpurposeBox .rightBox{width:56%;}
*/
#style-2 .ourpurposeBox .rightBox p,
#style-2 .ourpurposeBox .leftBox h2,
body #style-2 .ourpurposeBox h2,
#style-2 .ourpurposeBox ul li {
    color: #fff !important;
    font-weight: normal !important;
}
    body #style-2 .ourpurposeBox h2,
    #style-2 .ourpurposeBox ul li{
        font-size:24px !important;
    }
    #style-2 .ourpurposeBox .leftBox h2.secondTag {
        margin-top: 0;
        text-align: justify;
    }
#style-2 .ourpurposeBox .rightBox p {
    font-size: 16px;
    line-height: 26px;
    margin: 0 0 20px 20px;
    text-align: justify;
}
#style-2 .ourpurposeBox ul li{ margin:10px 0 }
body #style-2 .ourpurposeBox h2 {
    margin-bottom: 20px;
}
#productGrid .card-header {
    color: #003466 !important;
    font-weight: bold !important;
    font-family: 'Calibri';
    font-size: 18px;
}
#productGrid #DataTable tr td {
    color: #000 !important;
    font-weight: bold !important;
    font-size: 16px !important;
}
#productGrid #DataTable .table__head{display:none;}
.SelectApplicationBox input[name="ApplicationType"] {
    margin-right: 15px;
    margin-left: 10px;
}
.SelectApplicationBox ul.list-group.list-group-flush {
    background: #f5f5f5;
    padding-bottom: 10px;
}
.SelectApplicationBox ul.list-group.list-group-flush li {
    width: 97%;
    margin: 0 auto;
    padding-left: 8px;
    padding-right: 8px;
}
#productGrid #DataTable tblData tr td, .SelectApplicationBox, .SelectApplicationBox input#termData {
    margin-left: 10px;
}
    .padding-top-15 {
        padding-top: 15px !important;
    }
.ourpurposeBox .rightBox {
    padding: 5px 10px 0 10px;
}

.SignUp .card.Summary_section_4 {
    border: none !important;
    margin: 0 0 0 -15px;
}
.SelectApplication #cmxform .preview_next_box {
    display: none !important;
}
.w-97 {
    width: 97%;
    margin: 0 auto 10px !important;
}
.SelectApplicationBox .form-check {
    padding-left: 0;
}
input#ApplicationType {
    padding-right: 10px !important;
    display: inline-block;
    width: 20px;
}
#organisation input:read-only {
    background-color: #e9ecef;
    color: #000;
    /*cursor: not-allowed;
    pointer-events: none;*/
}


#addChildModel h5#addChildModelLabel {
    font-size: 20px !important;
}
#addChildModel h1 {
    font-size: 18px !important;
    margin:10px 0 0 0 !important
}
#addChildModel h2{font-size:17px !important}
#addChildModel h3{font-size:16px !important;}
#addChildModel ol li{list-style:none;}
#addChildModel .btn:disabled{display:none}
#addChildModel span#messageSpan.text-dark ol{margin:10px 0 0 0; padding:0;}
#addChildModel .card {
    margin-top: 5px !important;
}


/* Font Awesome CSS (you can use a different icon library if desired) */

/* Main CSS */
.tooltip-container {
    position: relative;
    cursor:pointer;
    display:inline-block;
    width:100%;
}
    .tooltip-container i {
        margin-left: 5px;
        font-size: 15px;
        color: #0a58ca;
    }

.custom-tooltip {
    display: none;
    position: absolute;
    bottom: 90%;
    left: 15px;
    background-color: #cfe2ff;
    color: #084298;
    padding: 5px;
    border-radius: 5px;
    font-size: 12px;
    z-index: 1;
    font-family: Helvetica,sans-serif !important;
    font-weight:normal;
}
    .modal .custom-tooltip{left:0;}
    .tooltip-container:hover .custom-tooltip {
        display: block;
    }
.SignatoryApprovalRequestList .alert.alert-info.fade.show.alert-dismissible.mt-3.mb-2 {
    background: transparent;
    border: none;
    color: #000;
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
    margin: 0;
    padding: 0;
}
.xdsoft_datetimepicker{z-index:9999999 !important;}

.SignatoryApprovalRequestList #style-2 {overflow: hidden; height: 100%;}
.SignatoryApprovalRequestList #style-3 {
    height: calc(100vh - 180px);
    overflow: auto;
    padding: 0 10px 10px 0;
}
#style-2 #Applicants h1, body #saveApplicationPopup h4.modal-title.w-100, body #submitApplicationPopup h4.modal-title.w-100 {
    text-transform: none !important;
}
.autosave-popup {
    display: none;
    position: fixed;
    bottom: 35px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #5766ab;
    color: white;
    padding: 10px 20px;
    border-radius: 3px;
    opacity: 0.9;
    transition: opacity 0.3s;
    z-index: 9999;
}

.loginBox_redirect {
    background: #fff !important;
    width: 100%;
    height: 100vh;
    overflow: hidden !important;
    position: absolute;
    top: 0;
    left: 0;
}
.userfirstNameBox {
    /* text-overflow: ellipsis;*/
    overflow: hidden;
    white-space: nowrap;
    width: 170px;
    text-align: center;
    display: inline-block;
    /* word-break: revert; */
    white-space: normal;
    height: 35px;
    vertical-align: top;
    
}
.dashboard_box .display-4.userfirstNameBox {
    font-size: 18px !important;
}
.z-999 {
    z-index: 999 !important;
}
.ViewMode {
    display: none !important;
}

.verifyBtnBox {
    position: absolute;
    bottom: 20px;
    right: 10px;
}
.verifyBtnBox button {
    height: 40px
}
form#Gridcrmxform .application_box .table a {
    pointer-events: none;
    color: #000 !important;
}


@supports (-ms-ime-align: auto) {
}

/** Mozilla Firefox */
@-moz-document url-prefix() {
}

/** Safari */
@media not all and (min-resolution: 0.001dpcm) {
}

/** Chrominum */
@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {
}

/*==========  Non-Mobile First Method  ==========*/
/* Large Devices, Full HD Screens */
@media only screen and (max-width : 1920px) {
}
/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
    footer p.text-center {
        font-size: 10px;
        line-height: 20px;
        letter-spacing: -0.5px;
    }

    footer .marquee,
    .request_assistanceBtn a.btn.btn-primary.trigger-btn {
        font-weight: normal;
        letter-spacing: normal;
    }
    #style-2 {
        height: calc(100vh - 215px);
    }
}

@media (min-width: 1200px) {
    .display-4 {
        font-size: 2.125rem !important;
    }
   
}
/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
    .navbar-brand img {
        max-width: 100%;
    }
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {

    .navbar-brand img {
        max-width: 100%;
    }

    header .nav-item {
        margin-left: 12px !important;
    }

    footer .row .col-5 {
        width: 100%;
    }

    .col-2.request_assistanceBtn {
        width: 100%;
        margin-bottom: 20px;
    }

    header .container-fluid {
        height: 45px;
        padding-top: 4px;
    }
    .verifyBtnBox {
        bottom: 5px;
    }
    button#btnRegister {
        margin: 0;
    }
    body button#btnverifyEmail{top:auto; bottom:28px;}

    body .toggle-password {
        position: absolute;
        top: 65%;
        right: 45px;
        
    }
    body .togglepassword1 {
        position: absolute;
        top: 93.5%;
        right: 45px;
    }
    body .forgotpassword {
        position: absolute;
        top: 13%;
        right: 18%;
        cursor: pointer;
    }

    body .forgotpassword1 {
        position: absolute;
        top: 35%;
        right: 17%;
        cursor: pointer;
    }
    body .currentpassword {
        position: absolute;
        top: 13%;
        right: 50px;
        transform: translateY(-50%);
        cursor: pointer;
    }

    body .changepassword {
        position: absolute;
        top: 33%;
        right: 50px;
        transform: translateY(-50%);
        cursor: pointer;
    }

    body .changeconfirmpassword {
        position: absolute;
        top: 53%;
        right: 50px;
        transform: translateY(-50%);
        cursor: pointer;
    }
}

@media(max-width: 768px) {
    .container {
        top: 180px !important;
    }

        .container.mainlayout {
            top: 100px !important;
        }

/*    .col-sm-12, .col-xs-12 {
        padding-top: 1em;
    }*/

    .radio label, .checkbox label {
        line-height: 32px !important;
    }

    #progressbar {
        padding-left: 15px;
    }

     /*   #progressbar li strong {
            display: none;
        }*/

 /*   body #cmxform .preview_next_box a {
        width: 30px;
        margin-right: 10px !important;
    }*/

    body #cmxform .preview_next_box {
        position: relative;
        bottom: auto;
        z-index: 9999;
        width: 100%;
        top: auto;
        margin:10px 0 !important
    }

        body #cmxform .preview_next_box .d-flex.float-end {
            width: 100%;
        }

         /*   body #cmxform .preview_next_box .d-flex.float-end a.previous {
                position: absolute;
                left: 10px;
                opacity: 0.5;
                margin: 0 !important;
            }

            body #cmxform .preview_next_box .d-flex.float-end a.next {
                position: absolute;
                left: 50px;
                opacity: 0.5;
            }*/

    .card-body.row.Admin {
        padding-bottom: 190px;
    }

    .popup {
        width: 94%;
    }

    header nav a.navbar-brand {
        padding: 0;
        max-width: 100%;
        width: 230px;
    }

        header nav a.navbar-brand img {
            max-width: 100%;
        }

    a#navbarDropdownMenuLink {
        padding: 6px 0 3px;
    }

    footer p.text-center {
        padding: 3px 16px 9px
    }
    .loginLayout footer p.text-center {
        padding: 0;
        font-size: 12px;
        font-family: 'Calibri';
    }

   /* footer.copyright {
        position: relative !important;
    }*/
    body.loginLayout .copyright{position:absolute !important;}

    button#saveContinue {
        margin: 15px 0;
    }
    /* #progressbar li.active strong{display:block !important}*/
 /*   #style-2 {
        padding-bottom: 15px;
        height: calc(100vh - 90px);
        margin-top: 10px;
    }*/

    .application_box {
        height: 100% !important;
        padding: 0 !important;
    }

    .checkbox label::after {
        padding-top: 12px !important;
    }

    #progressbar li:after {
        background: none;
        content: none;
    }

    #progressbar #personal_info:before {
        content: "PER";
    }

    #progressbar #residential_info:before {
        content: "RES";
    }

    #progressbar #employement_info:before {
        content: "EMP";
    }

    #progressbar #financial_info:before {
        content: "FIN";
    }

    #progressbar #relative_info:before {
        content: "REL";
    }

    #progressbar #document_info:before {
        content: "DOC";
    }

    #progressbar #summary_info:before {
        content: "SUM";
    }

    .header-logo img {
        width: 100%;
    }

    #progressbar li:before {
        width: 40px;
        height: 40px;
        font-size: 14px;
        line-height: 40px;
        font-size: 20px;
    }

    .checkbox4 label::after {
        margin-top: 7px !important;
    }

    .application_box .col-sm-12, .application_box .col-xs-12 {
        padding-top: 0;
    }

   /* .application_box {
        height: calc(100vh - 220px) !important;
    }*/

    .ml-md-4, .mx-md-4 {
        margin-right: 1px !important;
    }
    .mobile-display-none{display:none !important;}
}

@media (min-width: 820px) {
    .container {
        top: 230px !important;
    }

        .container.mainlayout {
            top: 100px !important;
        }
}

@media (min-width: 912px) {
    .container {
        top: 230px !important;
    }

        .container.mainlayout {
            top: 100px !important;
        }
}

@media(min-width: 768px) {
    .container {
        top: 230px !important;
    }

        .container.mainlayout {
            top: 100px !important;
        }

    .navbar-expand-md .navbar-nav .dropdown-menu {
        right: 0;
    }

    button.navbar-toggler{
        position:absolute;
        top:5px;
        right:15px;
        float:none;
    }
}

@media screen and (max-width: 500px) {
    #divSubmitData {
        margin-top: 0 !important;
    }
    .loginBtn button#btnLogin {
        padding-left: 25px !important;
    }

    .loginBtn .btn-label {
        width: 35px;
    }
/*
    header {
        height: 35px;
    }*/
    ul.navbar-nav.ml-auto.py-md-0 {
        background: #003466;
        padding:5px 10px;
    }
    div#style-2 {
     /*   height: calc(100vh - 290px);*/
        padding:0;
        margin:0;
        width:100%;
    }
    .card-header {
        padding: 0;
        margin: 0;
    }
    .tab-content .card {
        margin-top: 5px !important;
    }
    #divSubmitData {
        margin-top: 0 !important;
    }

    .forgotPassword_box, form#frmSubmit, .forgotPassword_box, form#frmSubmit, form#cmxform {
        width: 100% !important;
    }

    input#txtcaptcha {
        width: 50%;
    }

    #progressbar .active {
        color: #000000;
        cursor: pointer;
    }

    #progressbar li {
        list-style-type: none;
        font-size: 12px;
        width: auto;
        float: left;
        position: relative;
        padding: 0 15px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

        #progressbar li strong {
            color: #e9ecef;
        }

    #progressbar .info1:before {
        content: "1";
        color: #999;
    }

    #progressbar .info2:before {
        content: "2";
        color: #999;
    }

    #progressbar .info3:before {
        content: "2";
        color: #999;
    }
    #progressbar .info3.tab3:before {
        content: "3";
        color: #999;
    }
    #progressbar .info5.tab4:before {
        content: "4";
        color: #999;
    }
    #progressbar .info5.tab3:before {
        content: "3";
        color: #999;
    }
    #progressbar .info6.tab4:before {
        content: "4";
        color: #999;
    }
    #progressbar .info7.tab5:before {
        content: "5";
        color: #999;
    }

    #progressbar .info6.tab5:before {
        content: "5";
        color: #999;
    }
    #progressbar .info7.tab6:before {
        content: "6";
        color: #999;
    }

    #progressbar .info4:before {
        content: "4";
        color: #999;
    }

    #progressbar .info5:before {
        content: "5";
        color: #999;
    }

    #progressbar .info6:before {
        content: "3";
        color: #999;
    }

    #progressbar .info7:before {
        content: "4";
        color: #999;
    }

    #progressbar .info8:before {
        content: "8";
        color: #999;
    }

    #progressbar .info9:before {
        content: "9";
        color: #999;
    }

    #progressbar .info10:before {
        content: "10";
        color: #999;
    }

    #progressbar .info11:before {
        content: "11";
        color: #999;
    }

    #progressbar .info12:before {
        content: "12";
        color: #999;
    }

    #progressbar .info13:before {
        content: "13";
        color: #999;
    }

    #progressbar .info14:before {
        content: "14";
        color: #999;
    }
    #progressbar li strong{display:none;}

}

@media only screen and (min-device-width: 480px) and (max-device-width: 500px) and (-webkit-min-device-pixel-ratio: 2) {
    /* CSS styles specific to iPhones in portrait orientation */
    div#style-2 {
        height: calc(100vh - 300px)
    }
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
   /* header {
        height: 45px;
    }*/

    .btn {
        font-size: 15px;
    }
}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {
    .navbar-brand img {
        width: 270px;
        margin-left: -10px;
    }

    .btn {
        font-size: 15px;
    }
}

@media (min-width: 768px) {
    .pl-md-0, .px-md-0 {
        padding-left: 0 !important;
    }

    .ml-md-4, .mx-md-4 {
        margin-right: 1.2rem !important;
    }
}

/* #Media
================================================== */

@media (max-width: 767px) {
    form#frmLoginUSerPwd .form-actions.btns.loginBtn.clearfix.d-grid.gap-2.col-12.mx-auto {
        width: 42% !important; 
    }

    form#frmLoginUSerPwd, form#cmxform, .title_h1_changePwd {
        width: 94% !important;
        margin: 10px auto -50px !important;
    }
    .footer.expanded{height:265px;}
    span.btn-label {
        padding: 6px 10px;
    }
    header .nav-item:after {
        display: none;
    }

    header .nav-item::before {
        position: absolute;
        display: block;
        top: 15px;
        left: -9px;
        width: 11px;
        height: 2px;
        content: "";
        border: none;
        background-color: #fff;
        vertical-align: 0;
    }

    header .dropdown-toggle::after {
        position: absolute;
        display: block;
        top: 10px;
        left: -7px;
        width: 2px;
        height: 12px;
        content: "";
        border: none;
        background-color: #fff;
        vertical-align: 0;
        transition: all 200ms linear;
    }
    body .menu_icon_style{color:#fff;}

    header .nav-link {
        padding-left: 10px !important;
    }

    header .dropdown-toggle[aria-expanded="true"]::after {
        transform: rotate(90deg);
        opacity: 0;
    }

    header .dropdown-menu {
        padding: 0 !important;
        background-color: transparent;
        box-shadow: none;
        transition: all 200ms linear;
    }

    header .dropdown-toggle[aria-expanded="true"] + .dropdown-menu {
        margin-top: 10px !important;
        margin-bottom: 10px !important;
    }

    /*    body.dark .nav-item::before {
        background-color: #fff;
    }

    body.dark .dropdown-toggle::after {
        background-color: #fff;
    }

    body.dark .dropdown-menu {
        background-color: transparent;
        box-shadow: none;
    }*/
}

/* #Link to page
================================================== */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
 /*   header {
        height: 50px !important;
    }*/
    /* div#navbarSupportedContent {
        height: 95vh;
    }*/
    .navbar-brand img {
        max-width: 100%;
    }

    header .nav-item {
        margin-left: 5px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .menu_icon_style {
        margin-right: 5px;
        font-size: 16px;
    }

    header .nav-link {
        font-size: 12px;
    }

    #navbarSupportedContent .dropdown-menu .dropdown-item {
        padding-left: 9px;
        padding-right: 9px;
    }
    /*.preview_next_box span.title_tab {
        display: none;
    }*/
/*    #style-2 {
        height: calc(100vh - 90px);
    }*/

    div#divSubmitData {
        position: fixed;
        bottom: 40px;
        right: 10px;
    }
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
    /*header {
        height: 34px !important;
    }*/

    /*  div#navbarSupportedContent {
        height: 95vh;
    }*/

    .navbar-brand img {
        max-width: 100%;
    }

    header .nav-item {
        margin-left: 5px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-right: 0 !important;
    }

    .menu_icon_style {
        margin-right: 5px;
        font-size: 16px;
    }

    header .nav-link {
        font-size: 12px;
    }

    #navbarSupportedContent .dropdown-menu .dropdown-item {
        padding-left: 9px;
        padding-right: 9px;
    }

    .preview_next_box span.title_tab {
        display: none;
    }

    div#divSubmitData {
        bottom: 58px;
    }

    footer.copyright {
        position: fixed !important;
    }


    .ml-md-4, .mx-md-4 {
        margin-right: 1px !important;
    }

    .dashboard_box .col-6.mb-5.mb-md-0 {
        width: 100%;
    }

    .dashboard_box .col-10, .dashboard_box .col-2, .dashboard_box .col-6 {
        width: 100%;
    }

    .dashboard_box .card-body .col-4, .dashboard_box .card-body .col-3, .dashboard_box .card-body .col-6, .dashboard_box .card-body .col-12 {
        width: 100%;
    }

    .dashboard_box a.request_box {
        margin-bottom: 10px;
    }
}

@media only screen and (min-width: 320px) and (max-width: 1023px) {
    /* styles go here */
    body {
        overflow:scroll !important;
        height:100%;
    }
        body #style-2{height:100% !important;}
        .ml-md-4, .mx-md-4 {
            margin-right: 1px !important;
        }
    footer.copyright {
        position: relative !important;
    }
    .dashboard_box .col-6.mb-5.mb-md-0 {
        width: 50%;
    }

    .dashboard_box .col-10, .dashboard_box .col-2, .dashboard_box .col-6 {
        width: 100%;
    }

    .dashboard_box .card-body .col-4, .dashboard_box .card-body .col-3, .dashboard_box .card-body .col-6, .dashboard_box .card-body .col-12 {
        width: 100%;
    }
    .dashboard_box a.request_box {
        margin-bottom: 10px;
    }

    .dashboard_box .col-3.mb-5.mb-md-0 {
        margin-bottom: 5px !important;
    }

    .dashboard_box .card-body .mr-5, .dashboard_box .card-header {
        padding: 5px 10px;
        font-size: 16px;
    }
    body header{position:static;}
    body .navigation-wrap{position:absolute;}
    body footer .social a {
        margin-left: 0;
        margin-right: 0;
    }
}

@media only screen and (max-width: 1370px) {
    header li .nav-link{ font-size:12px; }
    .dashboard_box .card-body, a.request_box {
        padding: 10px;
    }

    .menu_icon_style {
        margin-right: 5px;
    }

    .ml-md-4, .mx-md-4 {
        margin-right: 0.7rem !important;
    }

    .dashboard_box .card-body-icon {
        font-size: 2.5rem;
        top: -2px;
        right: 10px;
    }
}

@media only screen and (max-width: 1170px) {
    .ml-md-4, .mx-md-4 {
        margin-right: 0.5rem !important;
    }
    .dashboard_box .card-body .col-4, .dashboard_box .card-body .col-3, .dashboard_box .card-body .col-6, .dashboard_box .card-body .col-12 {
        width: 49%
    }

    a.request_box {
        line-height: 28px;
        margin: 5px;
    }

    .dashboard_box .col-10, .dashboard_box .col-2, .dashboard_box .col-6, .dashboard_box .col-3 {
        width: 100%;
    }

    .dashboard_box .card-body {
        margin: 0;
        padding: 2px 0;
    }

    .dashboard_box .card-body .mr-5, .dashboard_box .card-header {
        padding: 6px 12px;
    }

    .dashboard_box .card-body-icon {
        display: none;
    }
    .application_box,
    .SignUp form#cmxform,
    .WithdrawalOrTransferDetail form#cmxform,
    .IITDetail form#cmxform,
    .DirectDebitDetail form#cmxform,
    .PeriodicalPaymentReqOrAuthDetail form#cmxform,
    .TermInvestmentMaturityDateInstructionsDetails form#cmxform,
    .EarlyRedemptionDetail form#cmxform,
    .AddSignatories form#cmxform,
    .SignUp form#cmxform {
        width: 99%;
    }
}

@media only screen and (max-width: 767px) {
    .ml-md-4, .mx-md-4 {
        margin-right: 1px !important;
    }

    .dashboard_box .col-6.mb-5.mb-md-0 {
        width: 100%;
        margin-bottom: 0 !important;
    }

    #style-2 .dashboard_box .text-right {
        text-align: left !important;
    }

    .dashboard_box span.date {
        display: block;
        padding-bottom: 10px !important;
    }

    .dashboard_box .col-10, .dashboard_box .col-2, .dashboard_box .col-6 {
        width: 100%;
    }

    .dashboard_box .card-body .col-4, .dashboard_box .card-body .col-3, .dashboard_box .card-body .col-6, .dashboard_box .card-body .col-12 {
        width: 100%;
    }

    .dashboard_box a.request_box {
        margin: 1px 0;
        padding: 2px 4px;
        border-radius: 5px !important;
        line-height: 26px;
        vertical-align: top;
    }

    .dashboard_box .request_box span.titleLink {
        font-size: 13px;
    }

    .dashboard_box .request_box b.countNum {
        font-size: 28px;
    }

    .dashboard_box .card-body {
        margin: 0;
        padding: 2px 0;
    }

    header .navbar-light .navbar-toggler-icon {
        border-bottom: 1px solid #fff;
    }

    header #navbarSupportedContent .dropdown-menu b {
        color: gray;
    }

    header #navbarSupportedContent .dropdown-menu .dropdown-item {
        color: #fff;
    }

    .dashboard_box .row .col-xl-4.col-sm-12.mb-4.mt-1 {
        margin-bottom: 5px !important;
    }

    .dashboard_box .row.justify-content-between.align-items-center.mb-3 {
        margin-bottom: 2px !important;
    }
    body .topBanner[_ngcontent-yyj-c115] {
        background: url(https://complaints.igt.gov.au/assets/logo.png) no-repeat 10px,url(https://complaints.igt.gov.au/assets/banner.jpg) no-repeat 100%;
        background-color: #003466;
        background-size: 300px, 100%;
    }
}

@media screen and (max-width: 500px) {
  /*  div#style-2 {
        height: calc(100vh - 140px);
        margin-bottom: 0px;
    }*/
}

@media only screen and (max-width: 420px) {
    .dashboard_box .col-3.mb-5.mb-md-0 {
        margin-bottom: 5px !important;
    }

    .dashboard_box .card-body .mr-5, .dashboard_box .card-header {
        padding: 5px 10px;
        font-size: 16px;
    }

    .card-footer span.titleLink {
        font-size: 14px;
    }

   /* div#style-2 {
        height: calc(100vh - 1px);
    }*/

    .request_assistanceBtn .btn-label {
        display: none;
    }
}

@media screen and (min-width : 320px) and (max-width : 480px) {
    body html .SelectApplicationBox {
        margin: 0 auto;
        width: 98%;
    }
}

@media screen and (min-width : 768px) and (max-width : 1024px) {
    /*.navbar-expand-md .navbar-toggler {
        display: block !important;
    }*/
  /*  .navbar-expand-md .navbar-collapse{display:none !important;}*/
    .navbar-expand-md .navbar-collapse.show {
        display: block !important;
    }
    html body .navbar-expand-md {
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
    html body header nav a.navbar-brand {
        padding: 0;
        max-width: 100%;
        width: 230px;
    }
    html body .navbar-collapse {
        flex-basis: 100%;
        flex-grow: 1;
        align-items: center;
    }
    body html .SelectApplicationBox {
        margin: 0 auto;
        width: 98%;
    }

}

@media screen and (min-width : 740px) {

}

@media screen and (min-width : 1024px) {
    
}

@media screen and (min-width : 1284px) {
   
}


svg {
    width: 105%;
    stroke-dasharray: 2000;
    stroke-dashoffset: 2000;
    animation: dash 2s linear forwards infinite;
}

@keyframes dash {
    100% {
        stroke-dashoffset: 0;
    }
}
nav .navbar-brand img {
    max-width: 100%;
    padding:6px 0 5px;
    width:300px;
}
.topBanner[_ngcontent-yyj-c115] {
    background: url(https://complaints.igt.gov.au/assets/logo.png) no-repeat 20px,url(https://complaints.igt.gov.au/assets/banner.jpg) no-repeat 100%;
    background-color: #003466;
    background-size: 300px,100%;
    width: 100%;
    height:90px;
}

button#btnRegister {
    display: block;
    width: auto;
    margin-right: 15px;
    margin-block:10px;
    margin-top:0;
}
/*footer{min-height:130px;}*/
footer .copyrightTextFooter{margin:0 30px; display:block;}
footer .social a {
    margin: 12px 4px 0px;
    display: inline-block;
}
footer .social{text-align:right;}
.navbar-expand-md .navbar-nav .nav-link i,
.navbar-expand-md .navbar-nav .nav-link span {
    color: #fff; font-size:16px;
}

html header .navbar-toggler{
    position:absolute;
    top:0; 
    right:10px;
}
div#navbarSupportedContent.show {
    background: #003466;
    width: 100%;
    margin-top:50px;
}

.errorMessage {
    color: red;
    font-size: 13px;
    line-height:24px;
    display:block;
    box-sizing:border-box;
}
.cerrorMessage {
    color: red;
    display: none;
    font-size: 13px;
    line-height: 24px;
    display: block;
    box-sizing: border-box;
}
.card-header{background-color:#fff !important;}
.container li::after {
    content: "";
    display: inline-block;
    background: transparent;
    width: 0;
    height: 0;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    right: -28px;
    position: absolute;
    z-index: 1;
}
body #cmxform .nav.clearfi.preview_next_box.footerSection,
body #frmLoginUSerPwd .nav.clearfi.preview_next_box.footerSection {
    display: block !important;
    left: 0;
}

input[type="checkbox"] {
    margin: 0 0 0 5px;
    width: 15px;
    height: 15px;
    vertical-align: middle;
}
span.checkmark {
    line-height: 20px;
    vertical-align: bottom;
    padding-top: 5px;
    display: inline-block;
}
.alert.alert-primary a {
    font-weight: bold;
}
    .alert.alert-primary a:hover, .alert.alert-primary a:focus {
        color: #0dcaf0 !important;
    }
p.clearfix.footerSection {
    width: 100%;
    display: block;
    z-index: 99;
    position: relative;
    margin: 7px 0 5px 0;
    font-weight: 500;
    font-size: 15px;
    line-height: 25px;
    color: #0b5e84;
    text-align: left;
    font-family: Helvetica,sans-serif !important;
    letter-spacing:0.7px;
}
    p.clearfix.footerSection a {
        color: #0b5e84;
        font-weight: bold;
    }
        p.clearfix.footerSection a:hover {
            color: #16ADE4;
        }
div#popupSignInModal_MobilephoneOtp button#closePopup {
    margin-right: -10px;
    margin-left: 12px;
}
form#frmLoginUSerPwd .form-actions.btns.loginBtn.clearfix.d-grid.gap-2.col-12.mx-auto {
    width: 25%;
    margin: 10px auto -38px;
}
footer a.social__icons img {
    max-width: 100%;
    width: 35px;
    display: block;
}
footer a.social__icons:hover{opacity:0.8;}
.card.ComplainantContactBox_Tab,
.card.ComplainantOrganisationBox_Tab,
.card.RepresentativeOrganisationBox_Tab,
.card.RepresentativeContactBox_Tab {
    margin-bottom: 5px !important;
    padding: 0 !important;
}
    .card.ComplainantContactBox_Tab + .card.ComplainantContactBox_Tab,
    .card.ComplainantOrganisationBox_Tab + .card.ComplainantOrganisationBox_Tab,
    .card.RepresentativeOrganisationBox_Tab + .card.RepresentativeOrganisationBox_Tab,
    .card.RepresentativeContactBox_Tab + .card.RepresentativeContactBox_Tab {
        display: none !important;
    }
.table-responsive.table-container {
    height: 100%;
}

div.dt-container .dt-paging .dt-paging-button.current, div.dt-container .dt-paging .dt-paging-button {
    background: #003466;
    border-color: #003466;
    color: #fff !important;
}
    div.dt-container .dt-paging .dt-paging-button:hover, div.dt-container .dt-paging .dt-paging-button.current:hover {
        border-color: #16ADE4 !important;
        color: #fff !important;
        background: #16ADE4 !important;
    }
input[readonly] {
    /* Your styling here */
    background-color: #f2f2f2; /* Example background color */
    color: #888 !important; /* Example text color */
    border: 1px solid #ccc; /* Example border */
    /* Add any other styles as needed */
    pointer-events: none;
}
.alert.alert-primary.mt-1.mb-1 {
    font-size: 14px;
    line-height: normal;
    vertical-align: top;
    font-weight: normal;
}
    .alert.alert-primary.mt-1.mb-1 b{display:inline-block;letter-spacing:1px;word-spacing:0.2px;}


    /* iPhone 13 Pro Portrait */
    @media only screen and (device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) {
        /* Your CSS styles for iPhone 13 Pro in portrait mode */
    }

/* iPhone 13 Pro Landscape */
@media only screen and (device-width: 926px) and (device-height: 428px) and (-webkit-device-pixel-ratio: 3) {
    /* Your CSS styles for iPhone 13 Pro in landscape mode */
}

/*body #progressbar li#Representative-Contact-tab::before {
    content: attr(data-content);
}*/
body .alert-primary {
    font-family: Helvetica, sans-serif !important;
    line-height: 20px;
    font-size: 14px;
    font-weight:normal;
}
body .alert-primary.yellow-bg {
    --bs-alert-color: #084298;
    --bs-alert-bg: #ffb554;
    --bs-alert-border-color: #ffb554;
    letter-spacing: 1px;
    font-weight: bold;
    line-height: normal;
}
button#btnverifyEmail {
    height: 40px;
    position: absolute;
    right: 1px;
    bottom: 13px
}
.verifyemailbox {
    position:relative;width:100%;min-height: 105px;
}
.password-container {
    position: relative;
}

.password-input {
    padding-right: 30px; /* Adjust as needed to make space for the icon */
}

.toggle-password {
    position: absolute;
    top: 67%;
    right: 45px; 
    transform: translateY(-50%);
    cursor: pointer;
}
.togglepassword1 {
    position: absolute;
    top: 93.5%;
    right: 45px;
    cursor: pointer;
}
.forgotpassword {
    position: absolute;
    top: 15%;
    right: 54%;
    cursor: pointer;
}
.forgotpassword1 {
    position: absolute;
    top: 39%;
    right: 54%;
    transform: translateY(-50%);
    cursor: pointer;
}
.currentpassword {
    position: absolute;
    top: 15%;
    right: 50px;
    transform: translateY(-50%);
    cursor: pointer;
}
.changepassword {
    position: absolute;
    top: 35%;
    right: 50px;
    transform: translateY(-50%);
    cursor: pointer;
}
.changeconfirmpassword {
    position: absolute;
    top: 53%;
    right: 50px;
    transform: translateY(-50%);
    cursor: pointer;
}