input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  border: none;
  -webkit-text-fill-color: black;
  -webkit-box-shadow: none;
  transition: background-color 5000s ease-in-out 0s;
}
input:-webkit-autofill:focus .form-group.input-material .form-control:focus ~ label, input:-webkit-autofill:hover .form-group.input-material .form-control:focus ~ label, input:-webkit-autofill .form-group.input-material .form-control:focus ~ label, input:-webkit-autofill .form-group.input-material .form-control[value]:not([value=""]) ~ label {
    top: -14px;
     font-size: .825rem;
     color: #939393;
}

.input-material input:-webkit-autofill ~ label, .input-material input:-webkit-autofill:focus ~ label{
    top: -14px;
     font-size: .825rem;
     color: #939393;
}

    input:-webkit-autofill:focus .form-group.input-material .form-control:focus ~ label, input:-webkit-autofill:hover .form-group.input-material .form-control:focus ~ label, input:-webkit-autofill .form-group.input-material .form-control:focus ~ label, input:-webkit-autofill .form-group.input-material .form-control[value]:not([value=""]) ~ label {
        top: -15px;
        font-size: .625rem;
        color: #1e8acb;
        font-weight: 700;
    }

.input-material input:-webkit-autofill ~ label, .input-material input:-webkit-autofill:focus ~ label {
    top: -15px;
    font-size: .825rem;
    color: #939393;
    font-weight: 700;
}
/* Login Material Floating Start*/
.form-group.input-material {
    position: relative;
    margin-top: 40px;
    margin-bottom: 15px;
}

    .form-group.input-material label {
        color: #939393;
        font-size: 1rem;
        text-transform: uppercase;
        font-weight: normal;
        position: absolute;
        pointer-events: none;
        left: 48%;
        transform: translateX(-50%);
        top: 7px;
        transition: 0.1s ease all;
        -moz-transition: 0.1s ease all;
        -webkit-transition: 0.1s ease all;
    }

    .form-group.input-material .form-control {
        border: none;
        border-bottom: 1px solid #000;
        border-radius: 0px;
        background: transparent;
        padding-left: 5px;
        box-shadow: none;
        text-align: center;
        font-size: 1rem;
        font-weight: bold;
        text-transform: uppercase;
        /* active state */
        /* invalid state */
    }

        .form-group.input-material .form-control:focus, .form-group.input-material .form-control[value]:not([value=""]) {
            border-bottom-color: #1e8acb;
            color: #000;
            text-align: center;
        }

            .form-group.input-material .form-control:focus ~ label, .form-group.input-material .form-control[value]:not([value=""]) ~ label {
                top: -14px;
                font-size: .825rem;
                color: #939393;
            }

            .form-group.input-material .form-control:focus.invalid, .form-group.input-material .form-control.invalid, .form-group.input-material .form-control:focus.parsley-error, .form-group.input-material .form-control[value]:not([value=""]).parsley-error {
                border-bottom-color: #dc3545;
            }

                .form-group.input-material .form-control:focus.invalid ~ label, .form-group.input-material .form-control.invalid ~ label, .form-group.input-material .form-control:focus.parsley-error ~ label, .form-group.input-material .form-control[value]:not([value=""]).parsley-error ~ label {
                    color: #dc3545;
                }

    .form-group.input-material .parsley-errors-list {
        color: #dc3545;
        list-style: none;
        font-size: 0.7em;
        padding-left: 5px;
    }