/* login main css starts*/

.login-main-section {
    margin: 65px 0px 30px;
}


a:hover {
    text-decoration: none;
    color: #11175E !important;
}

.login-main-section a {
    color: #0067AC;
}


.container.athene-mainContainer ul.list-check li:before {
    content: "\f00c";
    font-family: Font Awesome\ 5 Pro;
}

.help-block.form-error{
    font-family: 'AtheneDemi';
    font-size: 13px;
    color: #C53E32;
}

.login-main-section .alert-warning {
    display: flex;
    justify-content: left;
    align-items: center;
    font-size: 18px;
    border: 1px solid #FAA634;
    background-color: #FFFFFF;
    color: #000000;
    font-family: 'AtheneDemi';
}

.login-main-section .fa-exclamation-triangle {
    font-size: 28px;
    margin-right: 12px;
    color: #FAA634;
}

.login-main-section .mail-check {
    font-size: 28px;
    margin-right: 12px;
    color: #00AC88;
}

.login-main-section .row {
    margin-left: 0px;
    margin-right: 0px;
}

.danger .fa-exclamation-triangle {
    color: #C53E32;
}

.danger {
    border: 1px solid #C53E32 !important;
}

.login-main-section .alert-success {
    border: 1px solid #00AC88 !important;
}

.cards-section {
    background-color: #EFEFEF;
    padding: 65px 0px 30px 0px;
}

.individual-card {
    border: 1px solid #CCCCCC;
    background-color: #ffffff;
    padding: 18px 20px 25px 20px;
    height: 100%;
}

.card-sub-head {
    font-size: 32px;
    color: #0067AC;
    font-family: 'Athene';
}


.individual-card p {
    color: #525252;
    font-size: 18px;
    font-family: 'Athene';
}


.card-links {
    /* font-size: 12px; */
    font-family: 'AtheneDemi';
    color: #0067AC;
}

.card-links i {
    position: relative;
    top: 1px;
    margin-left: 2px;
}

.card-row-flex {
    display: flex;
    flex-wrap: wrap;
    margin-left: 0px;
    margin-right: 0px;
}

.cards-section [class*="col-"] {
  margin-bottom: 30px;
}

.login-head {
    color: #000000;
    font-size: 44px;
    font-family: 'Athene';
}



.login-para a {
    font-family: 'AtheneDemi';
    font-weight: 400;
}


.login-form label {
    font-size: 20px;
    font-family: 'AtheneDemi';
    color: #000000;
    margin-bottom: 5px;
}

.login-form input {
    height: 54px;
    border: 1px solid #CCCCCC;
    background-color: #EDEDED;
}

.login-form input:focus {
    background-color: #EDEDED;
}


.login-form .athene-filled-btn {
    width: 100%;
    margin: 10px 0px 0px 0px;
    padding: 15px;
    color: #ffffff;
    font-family: 'AtheneDemi';
    font-size: 18px;
}


.login-form .disabled-btn {
    background-color: #CCCCCC;
    border: 1px solid #CCCCCC;
    color: #4E4E4E;
    cursor: not-allowed;
}

.disabled-user {
    color: #4E4E4E;
}


.separator {
    border-left: 1px solid #4D4D4D;
    height: 15px;
    margin-left: 20px;
    margin-right: 20px;
}

.forget-info {
    font-family: 'AtheneDemi';
    font-size: 13px;
    color: #0067AC;
    cursor: pointer;
    float: right;
    position: relative;
    top: 4px;
}

.login-field-error {
    border: 2px solid #C53E32;
}

.login-error {
    color: #C53E32;
}


input.error, input.valid {
    background-image: none;
}


.login-main-section .athene-filled-btn {
    height: auto;
}

.login-main-section .athene-filled-btn i { 
    margin-left: 8px;
}


.register-para {
    color: #4D4D4D;
    font-size: 18px;
    font-family: 'AtheneDemi';
}

.register-content li::before {
    content: "\f00c" !important;
    font-family: 'Font Awesome 5 Pro';
    font-weight: 900;
}

.register-content li,.need-account {
    color: #4D4D4D;
    font-size: 18px;
    font-family: 'Athene';
}

.need-account {
    text-align: center;
    color: #4D4D4D;
    font-size: 18px;
    font-family: 'Athene';
}

.need-account a{
    font-family: 'AtheneDemi';
}

/* login main css ends*/





/* code verify css starts*/
input.error, input.valid {
    background-image: none;
}


.code-verify .fa-envelope-open {
    font-size: 28px;
    margin-right: 12px;
    color: #FAA634;
}

.code-verify .athene-filled-btn {
    height: auto;
}

/* code verify css ends*/




/* two step css starts*/

    .verify-acc {
        margin: 25px 0px;
    }

    .verify-acc a {
        font-weight: 600;
    }

/* two step css ends*/


/* two step error css starts*/
    .two-step-error .forgotUserPass-proceedCancel-wrap {
        justify-content: flex-end;
    }

    .two-step-error-main {
        min-height: calc(100vh - 147px)
    }
/* two step error css ends*/




/**/

.password-requirement-subList {
    padding-top: 0px !important;
}

.password-requirement-subList li {
    padding-bottom: 0px !important;
}
/**/

/*forgot user css starts*/
    .idProofing-questionsWrap .form-group label {
        font-size: 20px;
        font-family: 'AtheneDemi';
        color: #000000;
        margin-bottom: 5px;
    }

    .password-icon {
        float: right;
        position: relative;
        cursor: pointer;
        right: 10px;
        font-size: 18px;
        bottom: 32px;
        color: #4E4E4E;
    }

    .contract-issue .input-group-addon {
        float: right;
        position: absolute;
        right: 12px;
        bottom: 12px;
        font-size: 18px;
        color: #4E4E4E;
    }

    .contract-issue input {
        border-radius: 0px !important;
    }

    .athene-user-form input {
        height: 54px;
        background-color: #EDEDED;
    }


    .forget-user .athene-filled-btn {
        height: auto;
    }


    input.error, input.valid {
        background-image: none;
    }

/*forgot user css ends*/

/* id proofing css starts*/
    
    .forget-userPassword-header{
        height: 100px;
        display: flex;
        align-items: center;
        width: 100%;
        padding-left: 15px;
    }

    .forgot-userpass-header-wrap{
        background-color: #11175E;
    }

    .header-img-forgotPassUser{
        width: 200px;
        height: 35px;
    }

    .header-img-forgotPassUser img{
        width: 100%;
        height: 100%;
    }

    .forgot-userPass-footerWrap{
        background-color: #000000;
        display: flex;
        align-items: center;
        padding: 12px 0px;
    }

    .forgot-userpass-main{
        max-width: 800px;
        width: 100%;
        margin: 0 auto;
    }

    .assistance-phone{
        color: #0067AC;
        text-decoration: none;
    }

    .assistance-help-forgotPass{
        font-size: 20px;
        font-family: 'AtheneDemi';
        background-color: #ffffff;
        padding: 20px 30px;
        border: 1px solid #cccccc;
        margin: 20px 0px;
    }

    .assistance-help-forgotPass .fa-mobile-alt{
        color: #1c78b5;
        font-size: 25px;
        padding-right: 10px;
    }

    .idProofing-questionsWrap{
        margin: 20px 0px; 
        border: 1px solid #cccccc;
        border-bottom: 0px;
        background-color: #ffffff;
    }

    .id-proofing-ques .form-row {
        padding: 0px 30px;
        margin: 0px;
    }



    .id-proofing-ques .form-row .form-group {
        padding: 0px;
    }

    .idProofingQuestions{
        padding: 20px 30px;
    }

    .forgotUserPass-proceedCancel-wrap, .id-proof-cancel{
        border-bottom: 1px solid #cccccc;
        background-color: #EDEDED;
        border-top: 1px solid #cccccc;
        height: 120px;
        display: flex;
        align-items: center;
        padding: 20px 30px;
        margin-top: 18px;
        justify-content: space-between;
    }

    .forgotUserPass-proceedCancel-wrap a, .id-proof-cancel a {
        font-family: 'AtheneDemi';
        color: #0067AC;
    }


    .forgotUserPass-proceedCancel-wrap a:hover,  .id-proof-cancel a:hover{
        color: #11175E !important;
    }

    .idProofing-sub-header{
        color: #4D4D4D;
        font-size: 18px;
        margin: 10px 0px;
        font-weight: 600;
    }


    .idProofingQuestions-header{
        font-family: 'AtheneDemi';
        color:#11175e;
        margin-bottom: 20px;
    }

    .idProofing-question{
        font-family: 'AtheneDemi';
        color:#000000;
        font-size: 18px;
    }

    div.idProofing-answers.customRadioCheckBoxWrap{
        margin: 10px 0px;
        font-size: 15px;
        padding-left: 50px;
        color: #7a7a7b;
    }

    .idProofing-answers .custom-control-label{
        padding-left: 20px;
        cursor: pointer;
        font-size: 18px;
        font-family: 'Athene';
    }

    .proof-ques .form-row {
        padding-bottom: 30px;
    }


    .id-proof .athene-filled-btn {
        height: auto;
    }


    .idProofing-answers .custom-control-label::before {
        background-color: #fff;
        border: #adb5bd solid 1px;
    }


    .forgot-pass  .idProofing-question {
        margin-bottom: 5px;
    }

    .forgot-pass input,.forgot-userPass-step3 input {
        height: 54px;
        background-color: #EDEDED;
    }
      
    .forgot-pass .userPass-continueBtn {
        height: auto;
    } 

    .password-requirements-title {
        margin-top: 25px;
    }


    .password-requirementList {
        padding-left: 0px !important;
        color: #7e7e7e;
        margin-bottom: 15px !important;
    }

    .password-requirementList li {
        padding-bottom: 0px !important; 
    }


    .password-icon {
        float: right;
        position: relative;
        cursor: pointer;
        right: 10px;
        font-size: 18px;
        bottom: 32px;
        color: #4E4E4E;
    }


/* id proofing css ends*/


/* login flow common css starts*/
    
    .two-step, .id-proof,
     .code-verify, .forgot-userPass-step3,.forget-user {
        display: none;
    }

/* login flow common css ends*/



@media only screen and (max-width:575px) { 

    /* login main css starts*/

   .individual-card {
        margin-bottom: 20px;
        padding: 12px 15px 0px 15px;
        height: 100%;
   }

  

   .card-sub-head {
        font-size: 26px;
    }


    .individual-card p {
        font-size: 14px;
    }

    .cards-section {
        padding: 20px 0px 0px 0px;
    }


    .login-main-section .alert-warning  {
        font-size: 14px;
    }

    .login-main-section .fa-exclamation-triangle {
        font-size: 24px;
    }

    .login-head {
        display: none;
    }

    .ordering-div {
        margin-bottom: 25px;
        padding-left: 0px;
        padding-right: 0px;
    }

    .padding-off {
        padding-left: 0px;
        padding-right: 0px;
    }
    
    
    
    .login-form label  {
        font-size: 18px;
    }

    .login-form input {
        height: 40px;
    }

    .login-form .athene-filled-btn {
        margin: 5px 0px 0px 0px;
        padding: 10px;
        font-size: 16px;
    }

    .forget-info {
        font-size: 12px;
    }
    
    .help-block.form-error{
        font-size: 12px;
    }

    /* login main css ends*/


}


@media only screen and (min-width: 576px) and (max-width:767px) { 
    
    /* login main css starts*/


    .individual-card {
        margin-bottom: 30px;
        padding: 20px 15px 0px 15px;
    }
    
    .cards-section {
        padding: 35px 0px 20px 0px;
    }

    .card-sub-head {
        font-size: 28px;
    }

    .individual-card p {
        font-size: 14px;
    }

    .login-main-section .alert-warning  {
        font-size: 16px;
    }

    .login-main-section .fa-exclamation-triangle {
        font-size: 26px;
    }

    .login-head {
        font-size: 36px;
    }

    .login-form label  {
        font-size: 18px;
    }

    .login-form input {
        height: 45px;
    }

    .login-form .athene-filled-btn {
        margin: 5px 0px 0px 0px;
        padding: 10px;
        font-size: 16px;
    }

    .forget-info {
        font-size: 12px;
    }
    
    .help-block.form-error{
        font-size: 12px;
    }

    /* login main css ends*/
}


@media only screen and (min-width: 768px) and (max-width:991px) { 
    
    /* login main css starts*/
    
    
    .individual-card {
        margin-bottom: 30px;
        padding: 20px 15px 0px 15px;
    }
    
    .cards-section {
        padding: 35px 0px 20px 0px;
    }

    .card-sub-head {
        font-size: 26px;
    }

    .login-main-section{
        margin: 35px 0px;
    }

    .individual-card p {
        font-size: 16px;
    }

    .forget-info {
        font-size: 13px;
    }

    .help-block.form-error{
        font-size: 13px;
    }

    /* login main css ends*/

}


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

    /* login main css starts*/

    .individual-card p {
        min-height: 55px;
    }

    /* login main css ends*/

}

/*forgot user css starts*/
    
    @media only screen and (min-width:768px) {
        .number-field {
            padding-right: 7px !important;
        }

        .date-field {
            padding-left: 7px !important;
        }
    }

/* forgot user css ends*/



/* id proofing css starts*/  
    
    @media only screen and (max-width:767px){
        /*forgot user css starts*/
        .idProofing-questionsWrap .form-group label {
            font-size: 18px;
            font-family: 'AtheneDemi';
            color: #000000;
            margin-bottom: 2px;
        }
        /* forgot user css ends*/

        .forgot-userPass-footer .text-center {
            margin-top: 0px !important;
        }

        .login-main-section{
            margin: 65px 0px 0px;
        }

        .forgetUserPass-TandC{
            align-items: center;
            flex-direction: column;
            font-size: 13px;
        }
        .forgot-userPass-footerWrap{
            height: auto;
        }
        .assistance-help-forgotPass{
            font-size: 16px;
            padding: 10px 15px;
        }
        .idProofingQuestions{
            padding: 15px 15px 10px 15px;
        }
        .idProofingQuestions-header{
            font-size: 24px;
        }
        .idProofing-sub-header{
            font-size: 16px;
        }
        .idProofing-question{
            margin: 5px 0px;
            font-size: 16px;
        }
        div.idProofing-answers.customRadioCheckBoxWrap{
            font-size: 13px;
            padding-left: 15px;
        }
        .idProofing-answers .custom-control-label{
            padding-left: 10px;
        }
        .forget-userPassword-header{
            height: auto;
            justify-content: left;
            padding: 10px 0px 10px 15px;
        }
        .header-img-forgotPassUser{
            width: 145px;
            height: 35px;
        }
        .forgot-userpass-main{
            padding: 0px 15px;
        }
        .forgotUserPass-proceedCancel-wrap , .id-proof-cancel {
            padding: 15px;
            height: 80px;
        }
        .userPass-continueBtn {
            max-width: 150px;
            margin: 0px;
            padding: 7px !important;
        }

        .id-proofing-ques .form-row {
            padding: 0px 15px;
            margin: 0px;
        }

        .idProofing-answers .custom-control-label{
            font-size: 16px;
            font-family: 'Athene';
        }
    }

/* id proofing css ends*/

