body {
    font-family: 'Open Sans';
    font-size: 14px;
}
a {
    color: #363636;
}
.fa {
    font-size: 12px;
    color: #B1B1BD;
}
.fa-lock{
    font-size: 15px;
}
.fa-envelope{
    font-size: 13px !important;
}
figure img {
    height: 80px;
    width: 197px;
    margin-bottom: 20px;
}
.is-black {
    color: #3C3C41;
}
.button span{
    font-family: 'Open Sans';
}
/*head*/


.title {
    font-size: 22px;
    padding-top: 2rem;
    color: #3C3C41
}

/*head-end*/

/*middle-section-start*/
.login-page-desktop .form-heading {
    color: #3C3C41; font-size: 20px; margin-bottom: 16px
}

.login-page-desktop .card-footer .first-content {
    font-size: 16px; color: #3C3C41; font-weight: 600; margin-bottom: 10px;
}

.login-page .fa-exclamation-circle {
    color: #CC3137;
    font-size: 20px;
}

.login-page .fa-check-circle{
    font-size: 20px;
    color: #376600;
}

.login-page .error-message{
    line-height: 12px;
}

.field.custom-field {
    height: 85px;
}
.custom-field .input {
    height: 40px;
    border: 1px solid #B1B1BD;
    border-radius: 6px;
    font-size: 14px;
    box-shadow: none
}

.custom-field .input::placeholder {
    font-weight: lighter;
}

.login-page .is-danger {
    color: #CC3137;
}
.login-page .is-success {
    color: #376600;
}

.has-underline a {
    text-decoration: underline;
}

form input::-webkit-input-placeholder{
    color:#828296 !important;

}

.icon{
    padding-top: .3rem;
}
input[type=checkbox] {
    margin:2px;
    -ms-transform: scale(1.3); /* IE */
    -moz-transform: scale(1.3); /* FF */
    -webkit-transform: scale(1.3); /* Safari and Chrome */
    -o-transform: scale(1.3); /* Opera */
}
.label {
    color:#3C3C41;
    font-size: 14px;
    font-weight: bold;
}
.login-row {
    display: flow-root;
    margin-bottom: 1.45rem;
    font-size: 14px;
    margin-top: 1.5rem;
}
.button {
    height: 40px;
    width: 358px;
    border-radius: 6px;
    background-color: #860032;
}
.submit-btn{
    border: none;
}
.submit-btn:hover {
    background-color: #64001E;
    transition: background-color 0.1s ease-in;
}
.button span {
    color: white;
    font-weight: 600;
    font-size: 14px;
}
/*middle-section-end*/

/*footer-start*/

.bottom-text {
    font-size: 10px;
    margin-top: 2rem;
    color: #6F6E84;
}

.bottom-text a {
    color: #6F6E84;
    text-decoration: underline;
}
.bottom-text:not(:last-child){
    margin-bottom: 0rem;
}
.sec-content {
    font-size: 14px
}
.sec-content a {
    color: #860032;
    text-decoration: underline;
}
.first-content {
    font-size: 16px;
}
.is-pulled-right a{
    text-decoration: underline;
    color:#3C3C41
}

.card-footer {
    background-color: #F0F0F0;
    border-top: none;
    border-radius: 0px 0px 8px 8px;
    padding: 0.75rem 1.3rem;
}

/*footer-end*/

/*Forgot Password Starts*/
.forgot-password .fa-arrow-left {
    font-size: 15px;
}
.forgot-password .title{
    margin-top: 30px;
    padding-top: 0px;
    font-size: 16px;
    font-weight: unset !important;
}
.forgot-password .title .fa-lock{
    font-size: 16px;
    color: black;
    margin-right: 5px;
}
.forgot-password .sub-title{
    color: #828296;
    font-size: 14px;
    margin-top: 14px;
    margin-left: 49px;
    margin-right: 48px;
    line-height: 23px;
}
/*Forgot Password Ends*/

/*Reset password success starts here*/
.change-password .logo img{
    margin-top: 10px !important;
}
.password-success .fa-check-circle{
    font-size: 60px;
    color: #73C837;
    margin-top: 40px;
}
.password-success .login-link{
    text-decoration: underline;
    color: #870032;
    font-weight: 600;
	cursor: pointer;
}

.change-password .confirm-pass-err {
    display: none;
}

@media screen and (min-width: 769px) {
    .login-page {
        margin-top: 70px;
    }
    .card-footer{
        margin-top: 11px
    }
    .login-page .box-custom {
        box-sizing: border-box;
        width: 402px;
        border: 1px solid #DCDCE1;
        border-radius: 8px;
        background-color: #FFFFFF;
        box-shadow: 0 0 40px 0 rgba(60, 60, 65, 0.2);
        color: #3C3C41
    }
    .login-row{
        margin-bottom: 10px;
    }
    .bottom-text {
        float: left;
    }
    .bottom-text br{
        display: none;
    }
    .card-content {
        padding-bottom: 15px
    }
    /*forgot password starts here*/
    .forgot-password .logo img{
        margin-top: -20px;
        width: 159px;
        height: 70px
    }
    .forgot-password .card-footer{
        padding: inherit;
    }
    .forgot-password .bottom-text{
        font-size: 10px;
        margin-top: 20px;
        margin-bottom: 20px;
        margin-left: 20px;
        color: #828296;
    }
    /*forgot password ends here*/

    /*change password starts here*/
    .change-password .sub-title{
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 12px;
        font-size: 12px;
    }
    /*change password ends here*/

    /*password success starts here*/
    .password-success .title{
        font-size: 16px;
        margin-left: 24px;
        margin-right: 20px;
    }
	.password-success .fa-exclamation-circle{
		font-size: 60px;
		color: #CC3137;
		margin-top: 40px;
	}
    /*password success ends here*/

    /*login page desktop starts here*/
    .login-page-desktop {
        margin-top: 0;
    }
    .login-page-desktop .tile .tile:nth-of-type(1) {
        position: relative;
    }

    .login-page-desktop .tile .tile:nth-of-type(1) .card {
        background-color:transparent; position: absolute; top:55px; left:50%; transform: translate(-50%); width: 85%; box-shadow: none;
    }

    .login-page-desktop .primary-heading {
        font-size: 12px; color: #FFFFFF; margin-bottom: 15px; line-height: 17px;
    }

    .login-page-desktop .secondary-heading {
        font-size: 18px; color: #FFFFFF; margin-bottom: 22px; font-weight: 600; line-height: 30px;
    }

    .login-page-desktop .main-content {
        color: #FFFFFF; opacity: 0.71; font-style: italic; font-size: 16px; line-height: 22px; margin-bottom: 20px
    }

    .login-page-desktop .learn-more-btn {
        height: 36px; width: 104px; border-radius: 6px; background-color: transparent; font-size: 10px; font-weight: bold; color: #FFFFFF; border: 1px solid #FFFFFF;
    }
    .login-page-desktop .learn-more-btn:hover {
        background-color: rgba(255, 255, 255, 0.4) !important;
        border-color: transparent;
        transition: background-color 0.3s ease-in, border-color 0.3s ease-in;
    }

    .login-page-desktop .tile .tile:nth-of-type(2) .card {
        width: 100%
    }

    .login-page-desktop .custom-card-content {
        padding-top: 20px; padding-bottom: 20px; min-height: calc(100vh - 130px); /*Here 130px is the height of the footer.*/
    }

    .login-page-desktop .logo {
        margin-top: 3.8rem; margin-bottom: 4.1rem;
    }

    .login-page-desktop .logo img {
        height: 70px; width: 159px; margin-bottom: 0;
    }

    .login-page-desktop form {
        width: 520px
    }

    .login-page-desktop .card-footer {
        width: 100%; margin-top: 0; height: 130px;
    }

    .login-page-desktop .card-footer .content {
        width: 100%; text-align: center !important;
    }

    .login-page-desktop .bottom-text {
        margin-top: 1rem;
        float: none;
    }

    .login-page-desktop .copy-right {
        font-size: 10px; color: #828296; margin-top: 15px; margin-bottom: 20px;
    }

    .login-page-desktop .copy-right a{
        font-size: 10px; color: #828296;
    }
    /*login page desktop ends here*/
}
@media screen and (max-width: 768px) {
    .login-page .fa-exclamation-circle {
        margin-top: 8px;
        color: #CC3137;
        font-size: 20px;
    }
    .card {
        box-shadow: none;
    }
    .hero-body {
        padding: 0.75rem;
    }
    .card-content {
        margin-bottom: 1rem;
    }
    .vertical-break span {
        margin-left:1px ;

    }
    .card-footer {
        border-radius: 0 0 0 0;
    }
    .sec-content br{
        display: none;
    }
    /*forgot password css*/
    .forgot-password {
        margin-top: 10px;
    }
    .forgot-password .logo img{
        margin-top: -20px;
        width: 140px;
        height: 60px
    }
    .forgot-password .sub-title{
        color: #828296;
        font-size: 14px;
        margin-top: 14px;
        margin-left: initial;
        margin-right: initial;
        line-height: 23px;
    }
    .forgot-password .card-footer{
        padding-bottom: 20px;
    }
    .forgot-password .bottom-text{
        line-height: 23px;
    }
    .forgot-password .card-footer{
        display: block;
    }
    .password-success .fa-check-circle{
        margin-top: 5rem;
    }
    .forgot-password .bottom-text{
        margin-top: 0.1rem;
    }
	.password-success .fa-exclamation-circle{
		margin-top: 5rem;
	}
    .login-page-desktop .logo img {
        margin-bottom: 30px;
    }
    .login-page-desktop .card-content {
        padding: 2.3rem;
    }
}

/*login screen fixed footer */
@media screen and (max-width: 768px) and (min-height: 655px) {
    .login-page .card-footer{
        position: fixed;
        bottom: 0px;
        right: 0px;
        left: 0px;
    }
}

/*forgot password fixed footer */
@media screen and (max-width: 768px) and (min-height: 484px) {
    .forgot-password .card-footer{
        position: fixed;
        bottom: 0px;
        right: 0px;
        left: 0px;
    }
    .change-password .card-footer{
        position: relative;
    }
}

/*change password screen fixed footer */
@media screen and (max-width: 768px) and (min-height: 587px) {
    .change-password .card-footer{
        position: fixed;
        bottom: 0px;
        right: 0px;
        left: 0px;
    }
}

/*Password success screen fixed footer */
@media screen and (max-width: 768px) and (min-height: 480px) {
    .password-success .card-footer{
        position: fixed;
        bottom: 0px;
        right: 0px;
        left: 0px;
    }
}