﻿body {
    background-color:#F2F6FA !important;

}

a {
    text-decoration:none !important;
}


.aOTP {
    text-decoration:underline !important;
}
h1 {
    font-size:24px;
    font-weight:600;
    color:#2777D0;
}

h2 {
    font-size:24px;
    color:#2777D0;
}

br {
    font-size:10px;
}

h3 {
    /*font-family: Inter-SemiBold;*/
    font-weight: 600;
    font-size:20px;
    color:#2777D0;
    margin-top:10px;
}

.body1 {
    font-size:16px;
    color:#2F4360;
}

.lblLogin {
    font-size:24px;
    color:#2777D0;
}
.lblWelcome {
    font-size:16px;
    color:#2F4360;
}
.DashIcon {
    text-decoration:none !important;
    color:#2F4360;
}
.DashIcon:hover {
    text-decoration:none !important;
    color:#2F4360;
}
.DashIconLabel {
    font-size:12px;
    text-decoration:none !important;
    color:#2F4360 !important;
    text-align:center !important;
}
.body2 {
    font-size:14px;
    color:#2F4360;
}
.subtitle2 {
    font-size:14px;
    color:#2F4360;
}

.subtitle2bold {
    font-size:14px;
    color:#0F2D4F;
    /*font-weight:bold;*/
    margin-bottom:1.2em;
}

 .txtUserID {
        width:350px !important;
    }


/*input[type=text] {
font-size:20px!important;
}*/


.caption {
    font-size:12px;
}
.btnBluewithArrow
,.btnBluewithArrow:visited
,.btnBluewithArrow:link
,.btnBluewithArrow:hover
,.btnBluewithArrow:active
,.btnBluewithArrow:focus {
    font-size: 16px;
    font-weight: bold;
    background-color: #45B0E6;
    color: #fff;
    background-image: url('ntb/ntb_arrow_right_clear.png');
    background-repeat: no-repeat;
    background-position-x: 90%;
    background-position-y: 50%;
    outline:none !important;
    box-shadow: none !important;
    height:48px;
    border-radius:8px;
    padding-left: 24px;
    padding-right: 16px;
}

.btnBluewithArrow[disabled=disabled] {
        font-size: 16px;
    font-weight: bold;
    background-color: #b7b7b7;
    color: #fff;
    background-image: url('ntb/ntb_arrow_right_clear.png');
    background-repeat: no-repeat;
    background-position-x: 90%;
    background-position-y: 50%;
     height:48px;
    border-radius:8px;
    }

.btnBlue
,.btnBlue:visited
,.btnBlue:link
,.btnBlue:hover
,.btnBlue:active
,.btnBlue:focus {
    font-size: 16px;
    font-weight: bold;
    background-color: #45B0E6;
    color: #fff;
    /*background-image: url('ntb/ntb_arrow_right_clear.png');*/
    background-repeat: no-repeat;
    background-position-x: 90%;
    background-position-y: 50%;
    outline:none !important;
    box-shadow: none !important;
    height:48px;
}
.form-control:focus {
    box-shadow: none !important;
}


    .btnBlue[disabled=disabled] {
        font-size: 16px;
    font-weight: bold;
    background-color: #b7b7b7;
    color: #fff;
    background-image: url('ntb/ntb_arrow_right_clear.png');
    background-repeat: no-repeat;
    background-position-x: 90%;
    background-position-y: 50%;
     height:48px;
    border-radius:10px;
    }

    


    .ntbsection {
        width: 100%;
        /*margin-left:0px;
        margin-right:0px;*/
    }

    .ntbsectionSuccess {
        width: 100%;
    }
     .ntbsectionReminder {
        width: 100%;
    }
    .ntbsectionclear {
        width: 100%;
    }
    .Arrow_Right {
    margin-top:-38px;
    margin-right:3px;
    }
     .col-md-10 {
        padding-left:15px;
        padding-right:15px;
    }
      .col-md-7 {
         padding-left:15px;
        padding-right:15px;
    }

@media (max-width: 576px) {
    .floating-label-field--s4 + .floating-label {
    position: absolute;
    top: .3em;
    left: 7.3em !important;
    display: inline-block;
    width: auto;
    margin: 0;
    /*margin-left: 5px;*/
    padding: .3em;
    transition: transform .25s, opacity .25s, padding .25s ease-in-out;
    transform-origin: 0 0;
    color: #0F2D4F;
    border-color:lightgray;
    }

     .txtUserID {
        width:100% !important;
    }


    .row {
        margin-left:0px !important;
        margin-right:0px !important;
    }
     .col-md-7 {
        padding-left:0px !important;
        padding-right:0px !important;
    }
     .txtWelcomeHello {
    margin-left:0px !important;
}
    .ntbcontainerwhite {
        width: 100%;
    }
    .Container_Div {
        background-color:white;
        width:100%;
        /*padding:20px;*/
        border-radius:0px  !important; 
        margin-left:auto;
        margin-right:auto;
    }
    .Panel {
        width:100% !important;
    }
    .Right_Container_Div {
        background-color:white;
        width:85% !important; 
        padding:20px !important; 
        border-radius:8px !important; 
        margin-left:30px !important; 
        margin-right:5px !important; 
        margin-top:30px !important; 
    }
    .col-md-3 {
        padding-left:0px;
        padding-right:0px;

    }
    .col-md-10 {
        padding-left:0px;
        padding-right:0px;
    }
    .lblLogin {
        margin-left:30px;
    }
    .lblWelcome {
        margin-left:30px;
    }
    .ntbsectionSuccess {
    background-color:#fff !important;
    border-radius:10px !important;
    padding:25px !important;
    }

     .ntbsectionReminder {
    background-color:#fff !important;
    border-radius:10px !important;
    padding:25px !important;
    }
    .PasswordDiv {
         padding:15px !important;
    }
     .ntbsectionSuccess {
            font-size:13px;
        }
}
@media (max-width: 767px) {
    .row {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    .PasswordDiv {
         padding:15px !important;
    }
    .ntbsectionSuccess {
            font-size:13px;
        }
}



.ntbcontainerwhite {
    background-color: #fff !important;
}
.ntbcontainerwhiteWaived {
    background-color: #fff !important;
    border-radius:5px;
}
.ntbsection {
    background-color:#fff;
    border-radius:10px;
    padding:20px;
}

.ntbsectionSuccess {
    background-color:#fff;
    border-radius:10px;
    padding:88px;
    position: inherit;
}
.ntbsectionReminder {
    background-color:#fff;
    border-radius:10px;
    padding:40px;
}

.ntbsectionTerms {
    background-color:#F2F6FA;
    border:#bcc6d1 1px solid ;
    color:#2F4360 !important;
    border-radius:5px;
    padding:20px;
    width: 90%;
    text-align:justify;
    word-wrap: break-word;

}
.ntbsectionTermsWaived {
    background-color:#F2F6FA;
    border:#bcc6d1 1px solid ;
    color:#2F4360 !important;
    border-radius:5px;
    padding:20px;
    text-align:justify;
    word-wrap: break-word;

}
    .ntbsectionTerms div.scrollcontainer {
        padding-right:10px;
        overflow-y: scroll;
    }

        .ntbsectionTerms div.scrollcontainer::-webkit-scrollbar {
            width: 16px;
            height: 16px;
        }

        .ntbsectionTerms div.scrollcontainer::-webkit-scrollbar-thumb {
            background: #2777D0;
            border-radius: 8px;
        }

            .ntbsectionTerms div.scrollcontainer::-webkit-scrollbar-thumb:hover {
                background: #2777D0;
            }

        .ntbsectionTerms div.scrollcontainer::-webkit-scrollbar-track {
            background: #F0F0F0;
            border-radius: 0px;
            box-shadow: inset 0px 0px 0px 0px #F0F0F0;
        }



.ntbsectionTermsWaived .body2 {
    color:#2F4360 !important;
}

 .ntbsectionTermsWaived div.scrollcontainer {
        padding-right:10px;
        overflow-y: scroll;
    }

        .ntbsectionTermsWaived div.scrollcontainer::-webkit-scrollbar {
            width: 16px;
            height: 16px;
        }

        .ntbsectionTermsWaived div.scrollcontainer::-webkit-scrollbar-thumb {
            background: #2777D0;
            border-radius: 8px;
        }

            .ntbsectionTermsWaived div.scrollcontainer::-webkit-scrollbar-thumb:hover {
                background: #2777D0;
            }

        .ntbsectionTermsWaived div.scrollcontainer::-webkit-scrollbar-track {
            background: #F0F0F0;
            border-radius: 0px;
            box-shadow: inset 0px 0px 0px 0px #F0F0F0;
        }



.ntbsectionTermsWaived .body2 {
    color:#2F4360 !important;
}

.ntbsectionWealth {
    background-color:#F2F6FA;
    border:#bcc6d1 1px solid ;
    color:#2F4360 !important;
    border-radius:5px;
    padding:20px;
    /*width: 90%;*/
    word-wrap: break-word;
    /*margin-left:10px;*/
    margin-right:10px;

}

.ntbsectionAddOnTFI {
    background-color:#F2F6FA;
    border:#bcc6d1 1px solid ;
    color:#2F4360 !important;
    border-radius:5px;
    padding:20px;
    word-wrap: break-word;
    margin-right:10px;

}

.ntbsectionWealth .body2 {
    color:#2F4360 !important;
}

.ntbsectionBankard {
    background-color:#F2F6FA;
    border:#bcc6d1 1px solid ;
    color:#5D6A7A !important;
    border-radius:5px;
    padding:12px;
    width: 100%;
    word-wrap: break-word;
    margin-right:10px;
    font-size:12px;
    font-family:Inter-Medium;
    margin-bottom:10px;

}

.ntbsectionBankard .body2 {
    color:#2F4360 !important;
}

.ntbsectionNewToRCBC {
    background-color:#F2F6FA;
    border:#bcc6d1 1px solid ;
    color:#0F2D4F !important;
    border-radius:5px;
    padding:20px;
    word-wrap: break-word;
}

.ntbsectionNewToRCBC .body2 {
    color:#2F4360 !important;
}

.tdPDIC {
    vertical-align:top;
    padding-left:20px;
    color: #2F4360;
}


.navbar {
    /*position: relative !important;*/
}
.backarrow {
    display:block;
    height:57px;
    position:relative;
}

.backarrow img {
    position:absolute;
    display:block;
    top: 35%;
    left: 50%;
}
.brandNTB {
    position: absolute;
    left: 50%;
    margin-left: -83px !important;  /* 50% of your logo width */
    display: block;
}

.divSpaces {
    height:40px;
}




.regProgress > div {
    width:21.0%;
    float:left;
}


.regProgress > div:first-child,
.regProgress > div:last-child {
    width:18%;
}


.regProgress > div > div {
    /*border: 1px solid #45B0E6;*/
    border-radius:5px;
    height:15px;
    width:85%;
    margin-left:auto;
    margin-right:auto;
}


.regProgress > div:first-child > div,
.regProgress > div:last-child  > div{
    width:95%;
}

.regProgress > div:first-child > div> div{
    float:left;
}

.regProgress > div:last-child  > div{
    float:right;
}


.regProgress > div > div {
    background-color:#cdebfc;
}

.regProgress > div.active > div {
    border: 1px solid #cdebfc !important;
}

.regProgress > div.active > div {
    border: 1px solid #2777D0 !important;
    background-color:#2777D0;
}


/* val progress */



.valProgress > div {
    width:16.6%;
    float:left;
}


.valProgress > div:first-child,
.valProgress > div:last-child {
    width:15.6%;
}


.valProgress > div > div {
    /*border: 1px solid #45B0E6;*/
    border-radius:5px;
    height:15px;
    width:85%;
    margin-left:auto;
    margin-right:auto;
}


.valProgress > div:first-child > div,
.valProgress > div:last-child  > div{
    width:95%;
}

.valProgress > div:first-child > div> div{
    float:left;
}

.valProgress > div:last-child  > div{
    float:right;
}


.valProgress > div > div {
    background-color:#cdebfc;
}

.valProgress > div.active > div {
    border: 1px solid #cdebfc !important;
}

.valProgress > div.active > div {
    border: 1px solid #2777D0  !important;
    background-color:#2777D0 ;
}

/* val progress end */


input[type=password].ntbpassword ~ .password-visibility-icon img {
    content:url("ntb/ic_visibility_off.png");
}
input[type=text].ntbpassword ~ .password-visibility-icon img {
    content:url("ntb/ic_visibility.png");
}

.password-visibility-icon {
cursor:pointer;
}

.customgroupInput {
    border:1px solid #0F2D4F3D; padding:10px; border-radius:8px; height: 56px;
}

.customgroupInput .mb-3 {
    margin-bottom:0px !important; 
}

.multiline {
    height: auto;
}

.customgroupInput .input-group-text,
.customgroupInput input,
.customgroupInput select,
.customgroupInput input:focus,
.customgroupInput select:focus
  {
    border:0px none;
    outline:none;
    font-size:16px;
     
}

.customgroupInput input
  {
    flex: 1 1 auto;
    width: 1%;
    margin-bottom: 0;
}


.ntb_forms_ul {
  
  /*list-style-image: url('ntb/lst_ic_check_circle.png');*/
  list-style-type: none;
  padding:0px;
  margin: 0px;
}

.ntb_forms_ul li {
    background-repeat:no-repeat;
    background: url('ntb/lst_ic_check_circle.png') no-repeat;
    margin-block-start: 0em;
    margin-block-end: .3em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 20px;
        background-position-x: 0px;
    background-position-y: 50%;
}
.ntb_forms_ul li.active {
    background-repeat:no-repeat;
    /*background: url('ntb/lst_ic_check_circle_active.png') no-repeat;*/
    background: url('ntb/lst_ic_checkblue_circle_active.png') no-repeat;
    margin-block-start: 0em;
    margin-block-end: .3em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 20px;
        background-position-x: 0px;
    background-position-y: 50%;
    color: #2777D0;
}



/* Make the label and field look identical on every browser */
.floating-label,
.floating-label-field {
    font: inherit;
    line-height: 1;
    display: block;
    width: 100%;
    font-size: 16px;
}

.floating-label-field,
.floating-label-wrap {
    position: relative;
}

/* Input Style #1 */
.floating-label-field--s1 {
    transition: border-color .25s ease-in-out;
    color: rgba(255, 255, 255, .75);
    border-bottom: 3px solid rgba(255, 255, 255, .05);
    background-color: transparent;
}

    .floating-label-field--s1 + .floating-label {
        transition: transform .25s, opacity .25s ease-in-out;
        transform-origin: 0 0;
        opacity: .5;
    }

    .floating-label-field--s1:focus,
    .floating-label-field--s1:not(:placeholder-shown) {
        border-color: rgba(255, 255, 255, .1);
    }

        .floating-label-field--s1:focus + .floating-label,
        .floating-label-field--s1:not(:placeholder-shown) + .floating-label {
            transform: translate(.25em, -30%) scale(.8);
            opacity: .25;
        }

    .floating-label-field--s1:valid:not(:placeholder-shown) {
        border-color: rgba(46, 213, 115, .3);
    }

    .floating-label-field--s1:invalid {
        border-color: rgba(255, 71, 87, .3);
    }

/* Input Style #2 */
.floating-label-field--s2 {
    transition: background-color .25s ease-in-out;
    border: 2px solid #fff;
    border-radius: 5px;
    background-color: #fff;
}

    .floating-label-field--s2 + .floating-label {
        visibility: hidden;
        transition: transform .25s, visibility .5s, opacity .5s ease-in-out;
        opacity: 0;
    }

    .floating-label-field--s2:focus + .floating-label,
    .floating-label-field--s2:not(:placeholder-shown) + .floating-label {
        visibility: visible;
        transform: translateY(-80%);
        opacity: .5;
    }

    .floating-label-field--s2:valid:not(:placeholder-shown) {
        border-color: #adefc8;
        background-color: #adefc8;
    }

    .floating-label-field--s2:invalid {
        border-color: #ffe0e3;
        background-color: #ffe0e3;
    }

.floating-label-field--s3 {
    padding: .60em;
    transition: border-color .25s ease-in-out;
    color: #2F4360;
    /*border: 2px solid #0F2D4F3D;*/
    background-color: transparent;
    border-radius: 8px !important;
    opacity: 1;
    margin-bottom:1.5em;
}

select.floating-label-field--s3 {
    padding: 1.3em;
    transition: border-color .25s ease-in-out;
    color: #2F4360;
    border: 2px solid #0F2D4F;
    background-color: white;
    border-radius: 8px !important;
    opacity: 1;
}

.has-error .floating-label-field--s3 {
    border-color: #a94442 !important;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    color: #a94442 !important;
}
.has-error .floating-label {
    color: #a94442 !important;
}
.floating-label-field--s3 + .floating-label {
    position: absolute;
    top: .3em;
    left: .1em;
    display: inline-block;
    width: auto !important;
    margin: 0;
    padding: .3em;
    transition: transform .25s, opacity .25s, padding .25s ease-in-out;
    transform-origin: 0 0;
    color: #0F2D4F;
    border-color:lightgray;
    
}
select.floating-label-field--s3 + .floating-label {
    position: absolute;
    top: .3em;
    left: .75em;
    display: inline-block;
    width: auto;
    margin: 0;
    padding: .3em;
    transition: transform .25s, opacity .25s, padding .25s ease-in-out;
    transform-origin: 0 0;
    color: #2F4360;
    border-color:lightgray;
}


     .floating-label-field--s3:focus,
    .floating-label-field--s3:not(:placeholder-shown) {
        border-color: #2777D0; 
    }

        .floating-label-field--s3:focus + .floating-label,
        .floating-label-field--s3:not(:placeholder-shown) + .floating-label {
            /*z-index: 300;
            padding: .60em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: transparent;
            width:100%;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;*/
             z-index: 10;
            padding: .40em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: white;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;
        }


img.inputCheckimg {
    content:url("ntb/checkgrey.png");
}

img.inputCheckimg.active {
    content:url("ntb/checkblue.png");

}
/*Floating label s4*/

.floating-label-field--s4 {
    padding: .75em;
    transition: border-color .25s ease-in-out;
    color: #0F2D4F;
    /*border: 2px solid #0F2D4F3D;*/
    background-color: transparent;
    border-radius: 4px !important;
    opacity: 1;
    margin-bottom:1.5em;
    height:auto !important;
}
.mobileNumber {
    padding: .375rem .75rem;
}

select.floating-label-field--s4 {
    /*padding: 1.3em;*/
    transition: border-color .25s ease-in-out;
    color: #0F2D4F;
    border: 2px solid #0F2D4F;
    background-color: transparent;
    border-radius: 4px !important;
    opacity: 1;
}

.has-error .floating-label-field--s4 {
    border-color: #a94442 !important;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    color: #a94442 !important;
}
.has-error .floating-label {
    color: #a94442 !important;
}
.floating-label-field--s4 + .floating-label {
    position: absolute;
    top: .4em;
    left: 8em;
    display: inline-block;
    width: auto;
    margin: 0;
    /*margin-left: 5px;*/
    padding: .3em;
    transition: transform .25s, opacity .25s, padding .25s ease-in-out;
    transform-origin: 0 0;
    color: #0F2D4F;
    border-color:lightgray;
}
select.floating-label-field--s4 + .floating-label {
    
    width: auto;
    margin: 0;
    padding: .3em;
    transition: transform .25s, opacity .25s, padding .25s ease-in-out;
    transform-origin: 0 0;
    color: #0F2D4F;position: absolute;
    top: .3em;
    left: .75em !important;
    display: inline-block;
    border-color:lightgray;
}


     .floating-label-field--s4:focus,
    .floating-label-field--s4:not(:placeholder-shown) {
        border-color: #2777D0; /*#0F2D4F3D;*/
    }

        .floating-label-field--s4:focus + .floating-label,
        .floating-label-field--s4:not(:placeholder-shown) + .floating-label {
            /*z-index: 10;
            padding: .60em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: transparent;

            position: absolute;
            top: .3em;
            left: .75em !important;
            display: inline-block;
             -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;*/
             z-index: 10;
            padding: .40em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: white;
            position: absolute;
            top: .3em;
            left: .75em !important;
            display: inline-block;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white
        }



        .floating-label-field--s4:focus + .input-group-append,
        .floating-label-field--s4:not(:placeholder-shown) + .input-group-append {
            border:1px solid #2777D0 !important;
            transform: translate(0, -2em) scale(.9);


        }

/*Floating label s5*/

.floating-label-field--s5 {
    padding: .60em;
    transition: border-color .25s ease-in-out;
    color: #0F2D4F;
    /*border: 2px solid #0F2D4F3D;*/
    background-color: transparent;
    border-radius: 4px !important;
    opacity: 1;
    margin-bottom:1.5em;
    height:auto !important;
}

select.floating-label-field--s5 {
    /*padding: 1.3em;*/
    transition: border-color .25s ease-in-out;
    color: #2F4360;
    /* border: 2px solid #0F2D4F; */
    background-color: transparent;
    border-radius: 4px !important;
    opacity: 1;
    padding:.4em;
}

.has-error .floating-label-field--s5 {
    border-color: #a94442 !important;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    color: #a94442 !important;
}
.has-error .floating-label {
    color: #a94442 !important;
}
.floating-label-field--s5 + .floating-label {
    position: absolute;
    top: .3em;
    left: .1em !important;
    display: inline-block;
    width: auto;
    margin: 0;
    padding: .3em;
    transition: transform .25s, opacity .25s, padding .25s ease-in-out;
    transform-origin: 0 0;
    color: #0F2D4F;
    border-color:lightgray;
}
select.floating-label-field--s5 + .floating-label {
    display:none;
    /* width: auto; */
    /* margin: 0; */
    /* padding: .3em; */
    /* transition: transform .25s, opacity .25s, padding .25s ease-in-out; */
    /* transform-origin: 0 0; */
    /* color: #0F2D4F;position: absolute; */
    /* top: .3em; */
    /* left: .75em !important; */
    /* display: inline-block; */
    /* border-color:lightgray; */
}




        select.floating-label-field--s5:focus + .floating-label,
        select.floating-label-field--s5:not([ntbselval=""])  + .floating-label {
            /*z-index: 10;
            padding: .75em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: #fff;
            position: absolute;
            top: .3em;
            left: .20em !important;
            display: inline-block;*/
            z-index: 10;
            padding: .40em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: white;
            top: .3em;
            left: .1em !important;
            display: inline-block;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;

        }



        select.floating-label-field--s5:focus + .input-group-append,
        select.floating-label-field--s5:not(:placeholder-shown) + .input-group-append {
            /* border:1px solid #2777D0 !important; */
            /* transform: translate(0, -2em) scale(.9); */


         }

        

/* ----------------------------------*/

    /* Common Styles */
    /* Identical inputs on all browsers */
    .floating-label-field--s1:not(textarea),
    .floating-label-field--s2:not(textarea),
    .floating-label-field--s3:not(textarea),
    .floating-label-field--s4:not(textarea) {
        max-height: 4em;
    }
select.floating-label-field--s3:not(textarea) {
    max-height: 4em;
}
.floating-label-field--s1,
.floating-label-field--s1 + .floating-label,
.floating-label-field--s2,
.floating-label-field--s2 + .floating-label {
    padding: .75em;
    margin-bottom:1.5em;
}

    .floating-label-field--s1 + .floating-label,
    .floating-label-field--s2 + .floating-label {
        z-index: 100;
    }

    .floating-label-field--s1::placeholder,
    .floating-label-field--s3::placeholder,
    .floating-label-field--s4::placeholder  {
        color: transparent;
    }





/* NTB Checkbox Container */
.ntbCBContainer {
    box-sizing:border-box;
  display: inline;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ntbCBContainer input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.ntbcheckmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 2px;
}
.ntbTermsCondition {
    color: #0F2D4F;
}

.ntbCBContainer:hover input ~ .ntbcheckmark {
  background-color: #ccc;
}

.ntbCBContainer input:checked ~ .ntbcheckmark {
  background-color: #45B0E6;
}

.ntbcheckmark:after {
  content: "";
  position: absolute;
  display: none;
}


.ntbCBContainer input:checked ~ .ntbcheckmark:after {
  display: block;
}

.ntbCBContainer .ntbcheckmark:after {
  left: 9px;
  top: 5px;
  width: 8px;
  height: 14px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}




.ntbradcontainer {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.ntbradcontainer input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.ntbradcontainer .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  /*background-color: #eee;*/
  background-color: #fff;
  border: 1px solid #2196F3;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.ntbradcontainer:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.ntbradcontainer input:checked ~ .checkmark {
  /*background-color: #2196F3;*/
  background-color: #fff;
 
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.ntbradcontainer .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.ntbradcontainer input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.ntbradcontainer .checkmark:after {
 	top: 5px;
    left: 5px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #45B0E6;
}



.otpModal {
    padding:0px !important;
}
.otpModal .modal-dialog {
    margin: 0 auto; 
}

.otpInpoutcontainer > div {
    width:16.6%;
    float:left;
    /*border:1px solid #0F2D4F;*/
}

.otpInpoutcontainer > div:first-child,
.otpInpoutcontainer > div:last-child {
    /*width:15.6%;*/
}

.otpInpoutcontainer > div > input {
    border: 1px solid #45B0E6;
    height:auto;
    width:85%;
    display:block;
    /*margin-left:auto;
    margin-right:auto;*/
    font-size:2.5em;
    text-align: center; 
    font-weight: bold;
    border-radius:5px;
    float:right;
}


.otpInpoutcontainer > div:first-child > input,
.otpInpoutcontainer > div:last-child  > input{
    width:95%;
}

.otpInpoutcontainer > div:first-child > input{
    float:left;
}

.otpInpoutcontainer > div:last-child  > input{
    float:right;
}


input[type=number] { 
    -moz-appearance: textfield;
    appearance: textfield;
    margin: 0; 
    margin-left:auto;
    margin-right: auto;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
      -webkit-appearance: none; 
      margin: 0; 
}
/*START FOR DASHBOARD CSS*/
.Dash_Title {
    font-size:20px;
    font-weight:bold;
    color: #0F2D4F;
}
.Container_Div {
     background-color:white;
     width:70%;
     padding:20px;
     border-radius:10px;
}
.Right_Container_Div {
     background-color:white;
     width:100%;
     padding:20px;
     border-radius:10px;
}
.Panel{
    width:100%;
}
.divOtherProdTitleHeader {
 font-size:15px;
 font-weight:bold;  
}
.divOtherProdTitleLabel {
 font-size:13px;
}
.divOtherProd {
     border: 1px solid lightgray;
     padding: 15px;
     border-radius: 5px; 
}
.divMargin {
    margin-left:15px;
     margin-right:15px;
}
.divWelcomeMargin {
    margin-left:12px;
     margin-right:12px;
}


.divMarginTop {
    margin-left:30px;
    margin-right:30px;
}

.otpinput {
    text-align: center;
    border:1px solid #ced4da  ;
    height:35px;
    border-radius: 4px 4px 4px 4px;
    padding:10px;
    letter-spacing: 3px;
    font-weight:bold;
    height:48px;
}


.otpinput:focus {
    text-align: center;
    border:1px solid #ced4da !important;
    height:35px;
    border-radius: 4px 4px 4px 4px;
    padding:10px;
    letter-spacing: 3px;
    font-weight:bold;
    height:48px;
}



/*END FOR DASHBOARD CSS*/

.checklist {
			    list-style-type: none;
			    margin:0;
			    padding:0;
                width:100%;
			}
			.checklist li {
                background: url('../Areas/nb/Images/ic_check_circle.png') no-repeat left top;
			    margin-top:0 !important;
			    padding:0;
			    margin:0;
                vertical-align:top;
                margin-bottom:1em;
			}
			.checklist .icon-holder {
                margin-top:1px;
			    background:#444;
			    font-size:11px;
			    color:#fff;
			    text-align:center;
			    display: table;
               
			}
			.item-content {
			    margin-top:0 !important;
			    margin-left:30px;
			}

.txtWelcome {
    font-size:12px;
    color: #5D6A7A;
     font-family: Inter-Medium
}
.txtWelcomeHello {
    font-size:12px;
    color: #5D6A7A;
    font-family: Inter-Medium;
    margin-left:70px;

}
.txtTitleDigital {
    font-size: 14px;
    color: #0F2D4F;
    font-family: Inter-Medium
}
.PasswordWaivedTitle {
    font-family: "Inter-SemiBold";
    text-align: left;
    font-size: 20px !important;
    color: #2777D0;
}
.PasswordWaivedContent {
    font-family: "Inter-Regular";
    text-align: left;
    font-size: 16px !important;
}
.PasswordDiv {
    padding-right: 60px;
    padding-left: 60px;
    padding-top: 40px;
    padding-bottom: 40px;
}
.txtAcct {
    font-size:14px;
    color: #2777D0;
    font-family: Inter-Medium
}
.txtBal {
     font-size:16px;
   color: #2777D0;
   font-family: Inter-Medium
}
.txtDesc {
     font-size:14px;
    color:#0F2D4F;
    font-family: Inter-Medium
}
.tblUnverified {
    width:100%;
}
.tblUnverified td {
   padding:8px;
}
.tblNoMiddle {
    border-color: #2F4360;
}
.otpMessage {
    color: #2F4360;
}

/* Pixel */
@media (min-device-height:566px) and (max-device-height:568px) {
        .floating-label-field--s3:focus + .floating-label,
        .floating-label-field--s3:not(:placeholder-shown) + .floating-label {
            /*z-index: 300;
            padding: .60em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: transparent;
            width:100%;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;*/
             z-index: 10;
            padding: .40em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: white;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;
        }
        .floating-label-field--s3:focus + .singleLine,
        .floating-label-field--s3:not(:placeholder-shown) + .singleLine {
            padding: .40em;
        }
         .PasswordDiv {
         padding:15px !important;
        }
        .ntbsectionSuccess {
            font-size:13px;
        }
    .ntbcontainerwhiteWaived {
        background-color: #fff !important;
        border-radius: 0px;
    }

}

/* Pixel */
@media (min-device-height:729px) and (max-device-height:731px) {
    .floating-label-field--s3:focus + .floating-label,
    .floating-label-field--s3:not(:placeholder-shown) + .floating-label {
        /*z-index: 300;
            padding: .60em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: transparent;
            width:100%;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;*/
        z-index: 10;
        padding: .40em;
        transform: translate(0, -2em) scale(.9);
        color: #2777D0;
        background-color: white;
        -webkit-text-stroke: 1px #2777D0;
        text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;
    }

    .PasswordDiv {
        padding: 15px !important;
    }

    .ntbsectionSuccess {
        font-size: 13px;
    }

    .ntbcontainerwhiteWaived {
        background-color: #fff !important;
        border-radius: 0px;
    }
}

/* Pixel2 */
@media (min-device-height:821px) and (max-device-height:823px) {
        .floating-label-field--s3:focus + .floating-label,
        .floating-label-field--s3:not(:placeholder-shown) + .floating-label {
            /*z-index: 300;
            padding: .60em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: transparent;
            width:100%;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;*/
             z-index: 10;
            padding: .40em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: white;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;
        }
         .PasswordDiv {
         padding:15px !important;
    }
    .ntbcontainerwhiteWaived {
        background-color: #fff !important;
        border-radius: 0px;
    }
}


/* iphone 6 */
@media (min-device-height:665px) and (max-device-height:667px) {
        .floating-label-field--s3:focus + .floating-label,
        .floating-label-field--s3:not(:placeholder-shown) + .floating-label {
            /*z-index: 300;
            padding: .60em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: transparent;
            width:100%;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;*/
             z-index: 10;
            padding: .45em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: white;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;
        }
        .floating-label-field--s3:focus + .singleLine,
        .floating-label-field--s3:not(:placeholder-shown) + .singleLine {
            padding: .40em;
        }
        /*.txtmultiline1 {
            padding-top: inherit;
        }*/
         .PasswordDiv {
         padding:15px !important;
        }
        .ntbsectionSuccess {
            font-size:13px;
        }
    .ntbcontainerwhiteWaived {
        background-color: #fff !important;
        border-radius: 0px;
    }
}



/* iphone plus */
@media (min-device-height:734px) and (max-device-height:736px) {
        .floating-label-field--s3:focus + .floating-label,
        .floating-label-field--s3:not(:placeholder-shown) + .floating-label {
            /*z-index: 300;
            padding: .60em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: transparent;
            width:100%;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;*/
             z-index: 10;
            padding: .40em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: white;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;
        }
        .PasswordDiv {
         padding:15px !important;
        }
       .ntbsectionSuccess {
            font-size:13px;
        }
    .ntbcontainerwhiteWaived {
        background-color: #fff !important;
        border-radius: 0px;
    }
}


/* iphone X */
@media (min-device-height:810px) and (max-device-height:812px) {
        .floating-label-field--s3:focus + .floating-label,
        .floating-label-field--s3:not(:placeholder-shown) + .floating-label {
            /*z-index: 300;
            padding: .60em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: transparent;
            width:100%;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;*/
             z-index: 10;
            padding: .40em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: white;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;
        }
        .floating-label-field--s3:focus + .singleLine,
        .floating-label-field--s3:not(:placeholder-shown) + .singleLine {
            padding: .40em;
        }
        .PasswordDiv {
             padding:15px !important;
        }
        .ntbsectionSuccess {
            font-size:13px;
        }
    .ntbcontainerwhiteWaived {
        background-color: #fff !important;
        border-radius: 0px;
    }
}
/*G4*/
@media (min-device-height:640px) and (max-device-height:642px) {
        .floating-label-field--s3:focus + .floating-label,
        .floating-label-field--s3:not(:placeholder-shown) + .floating-label {
            /*z-index: 300;
            padding: .60em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: transparent;
            width:100%;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;*/
             z-index: 10;
            padding: .40em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: white;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;
        }
        .floating-label-field--s3:focus + .singleLine,
        .floating-label-field--s3:not(:placeholder-shown) + .singleLine {
            padding: .40em;
        }
        .PasswordDiv {
         padding:15px !important;
        }
        .ntbsectionSuccess {
            font-size:13px;
        }
    .ntbcontainerwhiteWaived {
        background-color: #fff !important;
        border-radius: 0px;
    }
}
	


/*G4*/
@media (min-device-height:775px) and (max-device-height:785px) {
        .floating-label-field--s3:focus + .floating-label,
        .floating-label-field--s3:not(:placeholder-shown) + .floating-label {
            /*z-index: 300;
            padding: .60em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: transparent;
            width:100%;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;*/
             z-index: 10;
            padding: .40em;
            transform: translate(0, -2em) scale(.9);
            color: #2777D0;
            background-color: white;
            -webkit-text-stroke: 1px #2777D0;
            text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;
        }
        .floating-label-field--s3:focus + .singleLine,
        .floating-label-field--s3:not(:placeholder-shown) + .singleLine {
            padding: .40em;
        }
        .PasswordDiv {
        padding:15px !important;
        }
        .ntbsectionSuccess {
            font-size:13px;
        }
    .ntbcontainerwhiteWaived {
        background-color: #fff !important;
        border-radius: 0px;
    }
}


.ntbradio{
    position: absolute;
    top: 0px;
    left: 5px;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    border: 1px solid #555555;
}

.del-sub-text{
        font-size: 10px;
}
	
.delRadioSelected{
     background-color: #45B0E6;
    border: 1px solid #45B0E6;
}

.delOptPresentAddress{
    background-color: #F2F6FA;
    border-radius: 5px;
    padding: 12px;
    width: 100%;
    word-wrap: break-word;
    margin-right: 10px;
    font-size: 12px;
    font-family: Inter-Medium;
    margin-bottom: 10px;
    background-color: #cae3ff;
    border: 1px solid #2777D0;
    color: #2777D0 !important;
}
.delOptBranch{
    border-radius: 5px;
    padding: 12px;
    width: 100%;
    word-wrap: break-word;
    margin-right: 10px;
    font-size: 12px;
    font-family: Inter-Medium;
    margin-bottom: 10px;
    background-color: #cae3ff;
    border: 1px solid #2777D0;
    color: #2777D0 !important;
}
			