@import url('https://fonts.googleapis.com/css?family=Montserrat:300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');

body {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    background: #ffffff;
}

.login-main .form-box .group label, .login-main .form-box .input-control, .register-link.registerLink, .new-btn {
    font-family: 'Montserrat', sans-serif;
}

.full-width-box {
    float: left;
    width: 100%;
    position: relative;
}

.login-main {
    height: 537px;
    padding: 0;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 1170px;
    max-width: 100%;
    margin: auto;
}

.login-logo {
    float: left;
    width: 62%;
    height: 537px;
    position: relative;
}

    .login-logo img {
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        right: 0;
        margin: auto;
        width: 283px;
    }

.login-form {
    float: left;
    width: 38%;
    height: 537px;
   /* background: #2b303b;*/
    padding: 0px 70px;
}

.login-form .form-box .input-control {
    background: transparent;
}

.login-form  .form-box .group label {
    color: #454545;
}

.login-form .new-btn {
    background: #454545;
    border-color: #454545;
}
.login-form .new-btn:hover {
    color: #454545;
}

.login-form .register-link {
    color: #454545;
    font-size: 16px;
    font-weight: 300;
    margin-top: 30px;
}

.login-form .register-link a {
    font-size: 16px;
    font-weight: 300;
    color: #0073DE;
}

.login-form .form-box .input-control{
    color: #454545;
    font-size: 16px;
}

.login-form .form-box .bar:before, .login-form .form-box .bar:after {
    background: #454545;
}

.form-title {
    float: left;
    width: 100%;
    font-weight: 600;
    color: #0073de;
    font-size: 26px;
    text-align: center;
}

.login-form .form-title {
    margin: 52px 0 64px 0;
}


.remember-check {
    float: left;
    width: auto;
}

    .remember-check .checkbox {
        display: inline-block;
        width: auto;
        padding: 0px;
        margin: 27px 0 80px 0 !important;
    }

        .remember-check .checkbox label {
            margin-top: 20px;
        }

        .remember-check .checkbox input[type=checkbox] {
            display: none;
        }

        .remember-check .checkbox label {
            display: inline-block;
            cursor: pointer;
            position: relative;
            padding-left: 25px;
            margin-right: 0;
            font-size: 12px;
            color: #fff !important;
            font-weight: 300;
            min-height: 14px;
            margin-top: 0px;
        }

            .remember-check .checkbox label:before {
                content: "";
                display: inline-block;
                position: absolute;
                left: 0;
                top: 0;
                background: url(../images/check-box-img.png) no-repeat !important;
                height: 14px;
                width: 14px;
                top: 2px;
            }

        .remember-check .checkbox input[type=checkbox]:checked + label:before {
            content: "";
            background: url(../images/check-box-img.png) no-repeat;
            background-position: left -17px !important;
            height: 14px;
            width: 14px;
        }

.new-btn {
    float: left;
    width: 100%;
    line-height: 46px;
    text-align: center;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    background: #0073de;
    color: #fff;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    font-size: 16px;
    font-weight: 600;
    border: 1px solid #0073de;
    box-shadow: 4px 5px 14px #1a2635;
}

    .new-btn:hover {
        color: #0073de;
        background: transparent;
        box-shadow: none;
    }

.register-link {
    float: left;
    width: 100%;
    color: #f0f0f0;
    font-size: 12px;
    text-align: center;
    margin: 26px 0 0 0;
    font-weight: 300;
}

    .register-link a {
        display: inline-block;
        font-size: 16px;
        font-weight: 600;
        color: #fff;
        margin: 0 0 0 5px;
    }



.form-box .group {
    position: relative;
    margin-bottom: 25px;
}

.form-box .input-control {
    font-size: 12px;
    padding: 8px 10px 14px 0;
    display: block;
    width: 100%;
    margin: 0px;
    background: #2b303b;
    border: none;
    color: #f0f0f0;
    border-bottom: 1px solid #666a72;
}

    .form-box .input-control:focus {
        outline: none;
    }

/* LABEL ======================================= */
.form-box .group label {
    color: #f0f0f0;
    font-size: 12px;
    font-weight: normal;
    position: absolute;
    pointer-events: none;
    left: 0;
    top: 10px;
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
}

/* active state */
.form-box .input-control:focus ~ label, .form-box .input-control.input-validation-error ~ label, .form-box .input-control.valid ~ label, .form-box input:read-only ~ label {
    top: -15px;
    font-size: 12px;
    color: #7a7e80;
    margin: 0px;
}

/* BOTTOM BARS ================================= */
.form-box .bar {
    position: relative;
    display: block;
    width: 100%;
}

    .form-box .bar:before, .form-box .bar:after {
        content: '';
        height: 1px;
        width: 0;
        bottom: 1px;
        position: absolute;
        background: #0073de;
        transition: 0.2s ease all;
        -moz-transition: 0.2s ease all;
        -webkit-transition: 0.2s ease all;
    }

    .form-box .bar:before {
        left: 50%;
    }

    .form-box .bar:after {
        right: 50%;
    }

/* active state */
.form-box .input-control:focus ~ .bar:before, .form-box .input-control:focus ~ .bar:after {
    width: 50%;
}

/* HIGHLIGHTER ================================== */
.form-box .highlight {
    position: absolute;
    height: 60%;
    width: 100px;
    top: 25%;
    left: 0;
    pointer-events: none;
    opacity: 0.5;
}

/* active state */
.form-box .input-control:focus ~ .highlight {
    -webkit-animation: inputHighlighter 0.3s ease;
    -moz-animation: inputHighlighter 0.3s ease;
    animation: inputHighlighter 0.3s ease;
}

/* ANIMATIONS ================ */
@-webkit-keyframes inputHighlighter {
    from {
        background: #5264AE;
    }

    to {
        width: 0;
        background: transparent;
    }
}

@-moz-keyframes inputHighlighter {
    from {
        background: #5264AE;
    }

    to {
        width: 0;
        background: transparent;
    }
}

@keyframes inputHighlighter {
    from {
        background: #5264AE;
    }

    to {
        width: 0;
        background: transparent;
    }
}

.icon-field-box .input-control {
    padding-right: 42px;
}

.icon-field-box .icon-field {
    width: 30px;
    position: absolute;
    right: 0;
    top: 6px;
    border-left: 1px solid #52565f;
    height: 20px;
}
/*.tooltip-box span {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    color: #fff;
    text-align: center;
    font-size: 11px;
    line-height: 20px;
}*/
.field-validation-error, .field-validation-error .report-selection {
    text-align: left;
    position: absolute;
    font-size: 10px;
    color: #0073de !important;
    right: 0;
}
#changePasswordForm .newPassValidation .field-validation-error {
    position: inherit;
    display: block;
    width: 100%;
    text-align: right;
}

.deliverBox {
    max-width: 315px;
}

.input-control:focus, button:focus {
    outline: none;
}
/*------------ sign up fomr --------------*/


/* SIGN UP START ================================== */
.signUp_main {
    height: 577px;
    padding: 0;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 1175px;
    max-width: 100%;
    margin: auto;
    font-family: 'Open Sans', sans-serif;
}

.signUp_form .form-title {
    text-align: left;
    margin-top: 0;
    font-family: 'Montserrat_Medium';
}

.signUp_form .form-box .group label {
    font-family: 'Montserrat_Light';
}

.signUp_form .form-box .input-control {
    font-family: 'Montserrat_Light';
}

.signUp_form .register-link {
    max-width: 300px;
    font-family: 'Montserrat_Hairline';
}

.signUp_main .full-width {
    float: left;
    width: 100%;
    margin: 51px -15px 0;
}

.signUp_form {
    float: left;
    width: 100%;
    height: 577px;
    background: #2b303b;
    padding: 50px 55px 43px 55px;
}

    .signUp_form .new-btn {
        max-width: 300px;
        margin-top: 15px;
    }

    .signUp_form .form-box .group {
        position: relative;
        margin-bottom: 58px;
        max-width: 300px;
    }

.form-box .group label sup {
    color: #f0f0f0;
}

@-webkit-keyframes autofill {
    to {
        color: #666;
        background: transparent;
    }
}

input:-webkit-autofill {
    -webkit-animation-name: autofill;
    -webkit-animation-fill-mode: both;
}

.signUp_form .submit-sec {
    float: left;
    width: 100%;
}

.signUp_form label {
    font-size: 12px;
    width: 100%;
    color: #f0f0f0;
    font-weight: normal;
}

.signUp_form .report-col.textellipsis {
    color: #7a7e80;
    position: relative;
    font-size: 12px;
    width: auto;
    padding: 0 15px;
}

    .signUp_form .report-col.textellipsis .remember-check .checkbox {
        display: inline-block;
        width: auto;
        padding: 0px;
        margin: 0 !important;
    }

/*Dashboard css edit*/
/*.Asbestos img {
    background: url(../images/hazmat_icn.png) no-repeat !important;
}

.LfaiReport img{
    background: url(..images/lfai_icn.png) no-repeat !important;
}*/
/*end*/

#divPasswordStrangth {
    font-size: 12px;
    color: #7a7e80;
    font-family: 'Montserrat_Light';
    top: -13px;
    float: left;
    width: 100%;
    position: inherit;
}

    #divPasswordStrangth label {
        font-size: 12px;
        color: #7a7e80;
        font-family: 'Montserrat_Light';
        top: 0;
        margin-bottom: 10px;
        position: inherit;
        float: left;
    }

    #divPasswordStrangth #passwordDescription {
        float: right;
        padding-bottom: 0;
        margin-top: 0;
        font-size: 10px;
        width: auto;
        font-family: 'Montserrat_Light';
        position: absolute;
        right: 0;
        background-color: unset;
    }

#changePasswordForm #divPasswordStrangth  {
   
    padding-bottom: 0;
    margin-top: 0;
    font-size: 10px;
    width: auto;
    font-family: 'Montserrat_Light';
    /*position: absolute;*/
    float: right !important;
    right:inherit;
    background-color: unset;
}
#changePasswordForm #passwordDescription  {
    padding-bottom: 0;
    margin-top: 0;
    font-size: 10px;
    width: auto;
    font-family: 'Montserrat_Light';
    /*position: absolute;*/
    float: right !important;
    right:70px;
    background-color: unset;
}

#changePasswordForm #divPasswordStrangth {
    font-size: 12px;
    color: #7a7e80;
    font-family: 'Montserrat_Light';
    top: -13px;
    float: left;
    width: 100%;
    position: inherit;
}

#changePasswordForm #divPasswordStrangth label {
        font-size: 12px;
        color: #7a7e80;
        font-family: 'Montserrat_Light';
        top: 0;
        margin-bottom: 10px;
        position: inherit;
        float: left;
        width: 93% !important;
    }

/* active state */
/*#changePasswordForm #lblConfirmPassword {
    top: 12px;
    font-size: 12px;
    color: #7a7e80;
    margin: 0px;
}*/

#divPasswordStrangth .field-validation-error {
    top: 40px;
}
.login-main input:-webkit-autofill , .signUp_main input:-webkit-autofill{
    -webkit-text-fill-color: #f0f0f0;
}
.login-main input:-webkit-autofill:focus , .signUp_main input:-webkit-autofill:focus{
    -webkit-text-fill-color: #f0f0f0;
}
input:-webkit-autofill {
   -webkit-text-fill-color: #2b303b;
}

input:-webkit-autofill:focus {
    -webkit-text-fill-color: #2b303b;
}

#ForgotPasswordForm div.login-form {
    padding-top: 86px;
}


  /* active state */
/*.form-box .input-control:focus ~ label, .form-box .input-control:valid ~ label, .form-box .group.icon-field-box .form--filled ~ label{
    top:-15px;
    font-size:12px;
    color:#7a7e80;
    margin: 0px;
  }*/

.form-box .group.input_Notempty_placeholder label{
     top:-15px;
    font-size:12px;
    color:#7a7e80;
    margin: 0px;
}

/*/* active state */
  /*.form-box .input-control:focus ~ label, .form-box .group.icon-field-box .form--filled ~ label{
    top:-15px;
    font-size:12px;
    color:#7a7e80;
    margin: 0px;
  }*/

.textareaExpand {
    background-color: #FFFFFF;
    border: 1px solid #DEE4F2;
    box-sizing: border-box;
    box-shadow: 0px 2px 4px rgba(31, 72, 134, 0.12);
    border-radius: 2px;
    padding: 7px 18px;
    /*height: 100px;*/
    font-family: CircularStd;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    min-height: 100px;
    line-height: 20px;
    color: #6D809B;
    display: block;
    width: 100%;
    overflow: hidden;
    resize: none;
}