﻿.has-float-label {
    display: block;
    position: relative
}

    .has-float-label label, .has-float-label > span {
        position: absolute;
        cursor: text;
        /*font-size: .95rem;*/
        /*font-size: 1.3rem;*/
        font-size: 16px;
        opacity: 1;
        -webkit-transition: all .2s;
        transition: all .2s;
        top: -.5em;
        left: 12px;
        z-index: 3;
        line-height: 1;
        padding: 0 1px
    }

        .has-float-label label::after, .has-float-label > span::after {
            content: " ";
            display: block;
            position: absolute;
            background: #fff;
            height: 2px;
            top: 8px;
            left: -.2em;
            right: -.2em;
            z-index: -1
        }

    .has-float-label .form-control::-webkit-input-placeholder {
        opacity: 1;
        -webkit-transition: all .2s;
        transition: all .2s
    }

    .has-float-label .form-control::-moz-placeholder {
        opacity: 1;
        transition: all .2s
    }

    .has-float-label .form-control:-ms-input-placeholder {
        opacity: 1;
        transition: all .2s
    }

    .has-float-label .form-control::placeholder {
        opacity: 1;
        -webkit-transition: all .2s;
        transition: all .2s
    }

    .has-float-label .form-control:placeholder-shown:not(:focus)::-webkit-input-placeholder {
        opacity: 0
    }

    .has-float-label .form-control:placeholder-shown:not(:focus)::-moz-placeholder {
        opacity: 0
    }

    .has-float-label .form-control:placeholder-shown:not(:focus):-ms-input-placeholder {
        opacity: 0
    }

    .has-float-label .form-control:placeholder-shown:not(:focus)::placeholder {
        opacity: 0
    }

    .has-float-label .form-control:placeholder-shown:not(:focus) + * {
        color: #757575;
        top: .99rem;
        /*font-size: 1.5rem;*/
        font-size: 18px;
        padding-right: 10px;
    }

.input-group .has-float-label {
    display: table-cell
}

    .input-group .has-float-label .form-control {
        border-radius: 4px
    }

    .input-group .has-float-label:not(:last-child) .form-control {
        border-bottom-right-radius: 0;
        border-top-right-radius: 0
    }

    .input-group .has-float-label:not(:first-child) .form-control {
        border-bottom-left-radius: 0;
        border-top-left-radius: 0;
        margin-left: -1px
    }

.float-label-form input:focus:not([readonly]),
.float-label-form textarea:focus:not([readonly]) {
    -webkit-box-shadow: 0 1px 0 0 #4285f4;
    box-shadow: 0 1px 0 0 #4285f4;
    border-bottom: 1px solid #4285f4;
}

    .float-label-form input:focus:not([readonly]) + label,
    .float-label-form textarea:focus:not([readonly]) + label {
        color: #4285f4;
    }

input.flout-lable-input, textarea.recommendation{
    height: auto;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    outline: 0;
    -webkit-box-shadow: none;
    border: none;
    border-bottom: 1px solid #ced4da;
    -webkit-border-radius: 0;
    border-radius: 0;
    background-color: transparent;
}

input:focus::-webkit-input-placeholder {
    color: #aab8c6 !important;
    font-size:18px;
}

input:focus:-moz-placeholder {
    color: #aab8c6 !important;
    font-size: 18px;
}
#midragLiveWizard input, #midragLiveWizard textarea {
    font-size: 18px;
}